/* RK Advocates — Request a Consultation web form
   Mirrors portal login: navy atmosphere + white form card + gold CTA.
   Loaded via Website Settings head_html → /files/rk-consultation.css (immediate on Cloud)
   and Web Form custom_css as fallback. */

@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:wght@500;600;700&family=Inter:wght@400;500;600&display=swap");

:root {
  --rk-bg: #0d1421;
  --rk-surface: #161e2e;
  --rk-gold: #c7a35d;
  --rk-gold-btn: #9e8847;
  --rk-gold-bright: #ddc084;
  --rk-text: #0f172a;
  --rk-muted: #64748b;
  --rk-label: #334155;
  --rk-field-bg: #f8fafc;
  --rk-field-border: #e2e8f0;
}

/* --- Page shell --- */
body[data-path^="request-consultation"],
#page-request-a-consultation {
  font-family: "Inter", system-ui, -apple-system, sans-serif;
}

body[data-path^="request-consultation"] {
  background-color: var(--rk-bg) !important;
  background-image:
    radial-gradient(900px 520px at 50% 8%, rgba(158, 136, 71, 0.16), transparent 55%),
    linear-gradient(180deg, #161e2e, #0d1421) !important;
  min-height: 100vh;
}

body[data-path^="request-consultation"] .navbar,
body[data-path^="request-consultation"] nav.navbar {
  display: none !important;
}

body[data-path^="request-consultation"] .page-content-wrapper,
body[data-path^="request-consultation"] main.container,
body[data-path^="request-consultation"] .page_content,
body[data-path^="request-consultation"] .page-header-wrapper {
  background: transparent !important;
  color: #e8e4d9 !important;
}

body[data-path^="request-consultation"] .page-breadcrumbs,
body[data-path^="request-consultation"] .page-header,
body[data-path^="request-consultation"] .page-footer {
  display: none !important;
}

body[data-path^="request-consultation"] main.container {
  max-width: 720px !important;
  padding-top: 0.5rem;
  padding-bottom: 3rem;
}

body[data-path^="request-consultation"] .web-footer,
body[data-path^="request-consultation"] footer.web-footer {
  display: none !important;
}

/* --- Brand hero (injected by rk_consultation.js) --- */
.rk-consultation-shell {
  padding: 1.75rem 0 1.25rem;
  text-align: center;
}

.rk-consultation-eyebrow {
  margin: 0 0 1.25rem;
  color: var(--rk-gold);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-size: 0.72rem;
  font-weight: 600;
}

.rk-consultation-card {
  background: #ffffff;
  border-radius: 16px;
  box-shadow: 0 24px 64px rgba(0, 8, 24, 0.5);
  padding: 2rem 1.75rem 1.5rem;
  color: var(--rk-text);
  text-align: left;
}

@media (min-width: 640px) {
  .rk-consultation-card {
    padding: 2.25rem 2.25rem 1.75rem;
  }
}

.rk-consultation-logo {
  display: block;
  height: 48px;
  width: auto;
  max-width: 260px;
  object-fit: contain;
  margin: 0 auto 1rem;
}

.rk-consultation-title {
  margin: 0 0 0.35rem;
  font-family: "Playfair Display", Georgia, serif;
  font-size: 1.45rem;
  font-weight: 700;
  color: var(--rk-text);
  text-align: center;
  line-height: 1.25;
}

.rk-consultation-subtitle {
  margin: 0 0 1.5rem;
  font-size: 0.925rem;
  color: var(--rk-muted);
  text-align: center;
  line-height: 1.5;
}

.rk-consultation-form-slot .web-form-footer .right-area {
  text-align: center;
}

.rk-consultation-powered {
  margin-top: 2rem;
  text-align: center;
  color: var(--rk-gold-btn);
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.02em;
}

/* --- Hide stock web-form header (replaced by hero) --- */
body[data-path^="request-consultation"] .web-form-header,
body[data-path^="request-consultation"] .web-form-container {
  display: none !important;
}

body[data-path^="request-consultation"] .web-form-container > div[style*="height: 3rem"]:first-of-type {
  display: none !important;
}

body[data-path^="request-consultation"] form.web-form {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

body[data-path^="request-consultation"] .web-form-body,
body[data-path^="request-consultation"] .web-form-wrapper {
  background: transparent !important;
  padding: 0 !important;
}

/* --- Labels --- */
body[data-path^="request-consultation"] .frappe-control .control-label,
body[data-path^="request-consultation"] .frappe-control label,
body[data-path^="request-consultation"] .web-form-body label {
  color: var(--rk-label) !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  margin-bottom: 0.35rem !important;
}

body[data-path^="request-consultation"] .frappe-control .reqd:after,
body[data-path^="request-consultation"] .control-label .reqd {
  color: #b45309 !important;
}

/* --- Inputs (light fields on white card) --- */
body[data-path^="request-consultation"] .web-form .form-control,
body[data-path^="request-consultation"] .web-form textarea.form-control,
body[data-path^="request-consultation"] .web-form select.form-control,
body[data-path^="request-consultation"] .web-form .ql-editor,
body[data-path^="request-consultation"] .web-form input[type="text"],
body[data-path^="request-consultation"] .web-form input[type="email"],
body[data-path^="request-consultation"] .web-form input[type="tel"] {
  background: var(--rk-field-bg) !important;
  border: 1px solid var(--rk-field-border) !important;
  color: var(--rk-text) !important;
  border-radius: 8px !important;
  min-height: 42px;
  box-shadow: none !important;
}

body[data-path^="request-consultation"] .web-form .form-control:focus,
body[data-path^="request-consultation"] .web-form textarea.form-control:focus,
body[data-path^="request-consultation"] .web-form select.form-control:focus {
  border-color: var(--rk-gold-btn) !important;
  box-shadow: 0 0 0 3px rgba(158, 136, 71, 0.28) !important;
  outline: none !important;
}

body[data-path^="request-consultation"] .web-form .form-control::placeholder {
  color: #94a3b8 !important;
  opacity: 1;
}

body[data-path^="request-consultation"] .web-form .help-box,
body[data-path^="request-consultation"] .web-form .text-muted {
  color: var(--rk-muted) !important;
}

body[data-path^="request-consultation"] .web-form .frappe-control {
  margin-bottom: 1rem !important;
}

/* --- Footer actions --- */
body[data-path^="request-consultation"] .web-form-footer {
  border-top: 1px solid #f1f5f9 !important;
  margin-top: 0.5rem !important;
  padding-top: 1.25rem !important;
  background: transparent !important;
}

body[data-path^="request-consultation"] .web-form-footer .web-form-actions {
  display: flex !important;
  justify-content: stretch !important;
}

body[data-path^="request-consultation"] .web-form-footer .left-area,
body[data-path^="request-consultation"] .web-form-footer .center-area {
  display: none !important;
}

body[data-path^="request-consultation"] .web-form-footer .right-area {
  width: 100% !important;
  display: flex !important;
  flex-direction: column-reverse !important;
  gap: 0.65rem !important;
}

body[data-path^="request-consultation"] .web-form-footer .discard-btn {
  display: none !important;
}

body[data-path^="request-consultation"] .web-form-footer .submit-btn,
body[data-path^="request-consultation"] .web-form-footer .btn-primary {
  width: 100% !important;
  background: var(--rk-gold-btn) !important;
  border: none !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
  padding: 0.65rem 1rem !important;
  border-radius: 8px !important;
  margin: 0 !important;
}

body[data-path^="request-consultation"] .web-form-footer .submit-btn:hover,
body[data-path^="request-consultation"] .web-form-footer .submit-btn:focus,
body[data-path^="request-consultation"] .web-form-footer .btn-primary:hover {
  background: var(--rk-gold-bright) !important;
  color: var(--rk-bg) !important;
}

/* --- Success state --- */
body[data-path^="request-consultation"] .success-page {
  background: #ffffff !important;
  border-radius: 16px !important;
  box-shadow: 0 24px 64px rgba(0, 8, 24, 0.5) !important;
  padding: 2.5rem 2rem !important;
  color: var(--rk-text) !important;
  text-align: center;
}

body[data-path^="request-consultation"] .success-page .success-title {
  font-family: "Playfair Display", Georgia, serif;
  color: var(--rk-text) !important;
}

body[data-path^="request-consultation"] .success-page .success-message {
  color: var(--rk-muted) !important;
}

body[data-path^="request-consultation"] .success-page .new-btn {
  background: var(--rk-gold-btn) !important;
  border: none !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  border-radius: 8px !important;
}

body[data-path^="request-consultation"] .success-page .new-btn:hover {
  background: var(--rk-gold-bright) !important;
  color: var(--rk-bg) !important;
}

body[data-path^="request-consultation"] .success-icon {
  color: var(--rk-gold-btn) !important;
}
