/* ═══════════════════════════════════════════════════════
   futurein.ai — Light Theme Override
   Loads after style.css to switch all content to light.
   Nav: light frosted glass. Footer, mobile-menu, toast
   and modals stay dark.
   ═══════════════════════════════════════════════════════ */

/* ── CSS variable overrides ── */
:root {
  --surface:   #f0f2f8;
  --card:      #ffffff;
  --panel:     #edf0f7;
  --hover:     #f9fafb;
  --soft:      #edf0f7;
  --mid:       #4a5568;
  --muted:     #6b7280;
  --tx-1:      #1a1a2e;
  --tx-2:      #4a5568;
  --tx-3:      #6b7280;
  --border:    rgba(0,0,0,.08);
  --border-s:  rgba(0,0,0,.14);
  --shadow-sm: 0 2px 8px rgba(0,0,0,.06);
  --shadow-md: 0 8px 32px rgba(0,0,0,.1);
  --shadow-lg: 0 20px 64px rgba(0,0,0,.14);
  --shadow-xl: 0 32px 80px rgba(0,0,0,.18);
}

/* ── Body ── */
body { background:#f5f6fb; color:#1a1a2e; }

/* ── Typography ── */
h1,h2,h3,h4,h5,h6 { color:#1a1a2e; }
p { color:#4a5568; }
strong { color:#1a1a2e; }

/* ── Page hero ── */
.page-hero { background:#f5f6fb; }
.page-hero::before { background:radial-gradient(ellipse 65% 55% at 60% 50%,rgba(59,130,246,.07),transparent 65%); }
.page-hero p { color:#4a5568; }
.page-hero h1 em { color:var(--glow); }

/* ── Sections ── */
.section          { background:#f5f6fb; }
.section-soft     { background:#edf0f7; }
.section-surface  { background:#f0f2f8; }
.section-panel    { background:#edf0f7; }
.section-dark     { background:#1a1a2e; }  /* kept dark on purpose */
.section-title    { color:#1a1a2e; }
.section-sub      { color:#4a5568; }

/* ── Cards ── */
.card { background:#fff; border-color:rgba(0,0,0,.08); box-shadow:0 2px 8px rgba(0,0,0,.06); }
.card:hover { background:#f9fafb; box-shadow:0 12px 40px rgba(0,0,0,.1); }
.feat-card { background:#fff; border-color:rgba(0,0,0,.08); }
.feat-card:hover { box-shadow:0 16px 48px rgba(0,0,0,.12); }
.feat-card-thumb { background:#edf0f7; }
.card-thumb { background:#edf0f7; }
.testi-card { background:#fff; border-color:rgba(0,0,0,.08); }
.testi-quote { color:#374151; }
.testi-name { color:#1a1a2e; }
.testi-role { color:#6b7280; }

/* ── Panel / sidebar ── */
.panel { background:#edf0f7; border-color:rgba(0,0,0,.08); }
.panel-dark { background:#1a1a2e; }
.panel-title { color:#1a1a2e; }

/* ── News ── */
.news-item { border-color:rgba(0,0,0,.07); }
.news-thumb { background:#edf0f7; }

/* ── Stats ── */
.stat-grid  { background:rgba(0,0,0,.07); }
.stat-cell  { background:#fff; }
.stat-label { color:#6b7280; }

/* ── Data table ── */
.data-table th,.data-table td { border-color:rgba(0,0,0,.07); }
.data-table th { color:#6b7280; background:#f5f6fb; }
.data-table td { color:#374151; }
.data-table tr:hover td { background:#f9fafb; }

/* ── FAQ ── */
.faq-item { border-color:rgba(0,0,0,.08); }
.faq-question { color:#1a1a2e; }
.faq-question:hover { color:#000; }
.faq-icon { color:#6b7280; }
.faq-answer p { color:#4a5568; }

/* ── Progress bars ── */
.progress-track { background:rgba(0,0,0,.08); }
.bar-row { color:#4a5568; }
.pw-strength { background:rgba(0,0,0,.08); }
.pw-strength-label { color:#6b7280; }

/* ── Forms ── */
.form-label { color:#374151; }
.form-field { background:#fff; border-color:rgba(0,0,0,.14); color:#1a1a2e; }
.form-field::placeholder { color:#9ca3af; }
.form-field:focus { border-color:var(--signal); box-shadow:0 0 0 3px rgba(59,130,246,.12); }
.form-hint { color:#6b7280; }
.auth-wrap { background:#f5f6fb; }
.auth-card { background:#fff; border-color:rgba(0,0,0,.1); box-shadow:0 8px 32px rgba(0,0,0,.1); }

/* ── Chip buttons ── */
.chip-btn { border-color:rgba(0,0,0,.14); color:#374151; background:transparent; }
.chip-btn:hover { border-color:rgba(0,0,0,.26); color:#1a1a2e; background:rgba(0,0,0,.04); }
.chip-btn.active-panel { background:#edf0f7; border-color:rgba(0,0,0,.16); color:#1a1a2e; }

/* ── Buttons (secondary variants) ── */
.btn-outline { color:#1a1a2e; border-color:rgba(0,0,0,.2); }
.btn-outline:hover { background:rgba(0,0,0,.06); border-color:rgba(0,0,0,.32); }
.btn-ghost { background:rgba(0,0,0,.06); color:#1a1a2e; }
.btn-ghost:hover { background:rgba(0,0,0,.1); }
.btn-dark { background:#1a1a2e; color:#fff; border-color:transparent; }
.btn-dark:hover { background:#2d2d45; }

/* ── Newsletter panel ── */
.newsletter-panel { background:#fff; border-color:rgba(0,0,0,.1); }
.newsletter-panel h4 { color:#1a1a2e; }
.newsletter-panel p  { color:#4a5568; }
.newsletter-panel input { background:#f5f6fb; border-color:rgba(0,0,0,.14); color:#1a1a2e; }
.newsletter-panel input::placeholder { color:#9ca3af; }

/* ── Ticker ── */
.ticker-wrap { background:#edf0f7; border-color:rgba(0,0,0,.08); }
.ticker-item { color:#4a5568; }

/* ── Divider ── */
.divider { border-color:rgba(0,0,0,.08); }

/* ── Live badge ── */
.live-badge { background:rgba(59,130,246,.08); }

/* ── Scrollbar ── */
::-webkit-scrollbar-track { background:#edf0f7; }
::-webkit-scrollbar-thumb { background:rgba(0,0,0,.2); }
::-webkit-scrollbar-thumb:hover { background:rgba(0,0,0,.35); }

/* ── Back to top ── */
#back-to-top { background:#fff; border-color:rgba(0,0,0,.1); color:#374151; box-shadow:0 4px 12px rgba(0,0,0,.1); }
#back-to-top:hover { color:#1a1a2e; }

/* ── Cookie banner ── */
#cookie-banner { background:#fff; border-color:rgba(0,0,0,.1); box-shadow:0 8px 32px rgba(0,0,0,.12); }
#cookie-banner p { color:#4a5568; }
.cookie-btn-reject { background:rgba(0,0,0,.06); color:#374151; border-color:rgba(0,0,0,.1); }

/* ─────────────────────────────────────────────────────
   THEME OVERRIDES: Nav (light), Footer/Mobile/Toast/Modal (dark)
   ───────────────────────────────────────────────────── */

/* Nav — neutral grey, complements light page theme */
.nav { background:rgba(240,242,247,.94) !important; border-color:rgba(15,23,42,.1) !important; }
.nav.scrolled { background:rgba(240,242,247,.99) !important; box-shadow:0 2px 16px rgba(15,23,42,.09) !important; }
.nav-logo { color:#0f172a !important; }
.nav-logo span { color:var(--glow) !important; }
.nav-menu a { color:#475569 !important; }
.nav-menu a:hover { color:#0f172a !important; background:rgba(15,23,42,.07) !important; }
.nav-menu a.active { color:var(--signal) !important; }
.nav-login { color:rgba(15,23,42,.68) !important; }
.nav-login:hover { color:#0f172a !important; background:rgba(15,23,42,.07) !important; }
.hamburger span { background:rgba(15,23,42,.72) !important; }
/* Greeting adapts on light/grey nav */
.nav-greeting { color:rgba(15,23,42,.6) !important; }
.nav-user-name { color:var(--signal) !important; }
/* Language bar adapts to light nav */
.fi-lang-bar .fi-lang-lnk { color:rgba(15,23,42,.35) !important; }
.fi-lang-bar .fi-lang-lnk:hover { color:rgba(15,23,42,.75) !important; }
.fi-lang-bar .fi-lang-lnk.active { color:var(--glow) !important; }
.fi-lang-bar .fi-lang-sep { color:rgba(15,23,42,.18) !important; }

/* Mobile menu — stays dark */
.mobile-menu { background:#1e1e2e !important; border-color:rgba(255,255,255,.08) !important; }
.mobile-menu a { color:rgba(255,255,255,.7) !important; }
.mobile-menu a:hover { color:#fff !important; background:rgba(255,255,255,.08) !important; }
.mobile-menu a.active { color:var(--signal) !important; }
.close-menu { background:rgba(255,255,255,.1) !important; border-color:rgba(255,255,255,.1) !important; color:rgba(255,255,255,.7) !important; }
.close-menu:hover { background:rgba(255,255,255,.2) !important; color:#fff !important; }
.mobile-overlay { background:rgba(0,0,0,.65); }

/* Footer — white background, dark text */
footer, .footer {
  background:#ffffff !important;
  border-top-color:rgba(0,0,0,.08) !important;
}
.footer-brand p,
.footer-col h5,
.footer-col a,
.footer-bottom,
.footer-bottom p,
.footer-legal a { color:rgba(0,0,0,.55) !important; }
.footer-col a:hover,
.footer-legal a:hover { color:#000 !important; }
.footer-bottom { border-top-color:rgba(0,0,0,.08) !important; }
footer .nav-logo { color:#1a1a2e !important; }
footer .nav-logo span { color:var(--glow) !important; }
footer p { color:rgba(0,0,0,.45) !important; }

/* Toast — stays dark */
.toast { background:#1e1e2e !important; color:#fff !important; border-color:rgba(255,255,255,.1) !important; }
.toast-error   { background:#7f1d1d !important; }
.toast-success { background:#14532d !important; }

/* Modal — stays dark */
.modal-box { background:#1e1e2e !important; border-color:rgba(255,255,255,.1) !important; }
.modal-head { border-color:rgba(255,255,255,.08) !important; }
.modal-close { background:rgba(255,255,255,.1) !important; border-color:rgba(255,255,255,.08) !important; color:rgba(255,255,255,.6) !important; }
.modal-close:hover { background:rgba(255,255,255,.2) !important; color:#fff !important; }
