/* ============================================================================
   LoanSpace theme layer — depth + interaction polish, a design cousin of
   BuyerPath's theme (static/buyerpath.css). Color comes from the tokens in
   editorial-tokens.css (institutional navy-blue + gold); this file applies
   the shared design language on top: card depth and hover lift, gradient
   primary buttons, and brand focus rings.

   Concatenated LAST into style-bundle.css (see scripts/build_css.py) so it
   wins the cascade over the legacy sheets, and linked directly (after
   editorial-tokens.css) on standalone pages that don't load the bundle.
   ============================================================================ */

/* ---- cards: depth ---------------------------------------------------------
   Shared card surfaces across chat, calculators, funnel, and dashboard. */
.card,
.feature-card,
.feature-card-modern,
.option-card,
.inline-option-card,
.panel-card,
.history-card,
.chart-card,
.question-card,
.welcome-card-v2,
.recommendations-card,
.scenario-input-card,
.scenario-result-card,
.starter-card {
  border-radius: var(--ls-radius, 16px);
  box-shadow: var(--ls-shadow, 0 1px 2px rgba(18, 42, 68, .04), 0 6px 18px rgba(18, 42, 68, .06));
}

/* tappable cards lift on hover/active */
a.feature-card, a.option-card, a.starter-card,
.option-card, .inline-option-card, .starter-card {
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
a.feature-card:hover, .option-card:hover, .inline-option-card:hover, .starter-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--ls-shadow-hover, 0 2px 5px rgba(18, 42, 68, .07), 0 14px 32px rgba(18, 42, 68, .11));
}
a.feature-card:active, .option-card:active, .inline-option-card:active, .starter-card:active {
  transform: translateY(0);
}

/* ---- primary buttons: navy gradient + soft glow --------------------------- */
.btn-primary,
.hero-btn-primary,
.register-button,
.btn-lookup,
.btn-email-report,
.calc-lender-btn {
  background: linear-gradient(180deg, var(--brand-blue, #1a5b9e) 0%, var(--brand-blue-deep, #114274) 100%);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 1px 2px rgba(18, 42, 68, .10), 0 4px 12px rgba(26, 91, 158, .22);
  transition: filter .15s ease, transform .05s ease, box-shadow .15s ease;
}
.btn-primary:hover,
.hero-btn-primary:hover,
.register-button:hover,
.btn-lookup:hover,
.btn-email-report:hover,
.calc-lender-btn:hover {
  filter: brightness(1.08);
}
.btn-primary:active,
.hero-btn-primary:active,
.register-button:active,
.btn-lookup:active,
.btn-email-report:active,
.calc-lender-btn:active {
  transform: translateY(1px);
}
/* dark mode keeps the deeper gradient so white label text stays readable */
[data-theme="dark"] .btn-primary,
[data-theme="dark"] .hero-btn-primary,
[data-theme="dark"] .register-button,
[data-theme="dark"] .btn-lookup,
[data-theme="dark"] .btn-email-report,
[data-theme="dark"] .calc-lender-btn {
  background: linear-gradient(180deg, #2b6cae 0%, #1a5b9e 100%);
}

/* ---- inputs: brand focus ring --------------------------------------------- */
input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: none;
  border-color: var(--brand-blue, #1a5b9e);
  box-shadow: 0 0 0 3px rgba(26, 91, 158, .16);
}
[data-theme="dark"] input:focus-visible,
[data-theme="dark"] select:focus-visible,
[data-theme="dark"] textarea:focus-visible {
  border-color: var(--brand-blue-soft, #79aede);
  box-shadow: 0 0 0 3px rgba(121, 174, 222, .22);
}

/* ---- header stripe: signature gold hairline ------------------------------- */
.seo-header {
  position: relative;
}
.seo-header::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: -1px;
  height: 3px;
  background: linear-gradient(90deg, var(--brand-orange-deep) 0%, var(--brand-orange) 45%, var(--brand-orange-soft) 100%);
}
