/* ─────────────────────────────────────────────────────────────────────────────
   ACA Marketplace Explorer — base styles shared across sections.

   This file owns the dark theme variables, body defaults, the cross-section
   nav, and the "coming soon" placeholder. Per-section stylesheets layer on
   top via {% block extra_head %}.
   ───────────────────────────────────────────────────────────────────────── */

/* Color tokens. Variable names are historical (--navy, --white) from the
   original dark theme; the VALUES are now the light theme so role mapping
   stays consistent without site-wide renames.
   --navy   = page background  (lightest)
   --navy2  = panel background (white)
   --navy3  = raised surface   (slightly darker than panel)
   --text   = main body text
   --text2  = secondary text
   --text3  = muted / placeholder text
   --white  = max-contrast headings (darkest text token)                   */
:root{
  --navy:#f1f5f9;
  --navy2:#ffffff;
  --navy3:#e2e8f0;
  --teal:#0d9488;
  --teal2:#0f766e;
  --border:#cbd5e1;
  --border2:#94a3b8;
  --text:#1e293b;
  --text2:#475569;
  --text3:#64748b;
  --white:#0f172a;
  --green:#059669;
  --red:#dc2626;
  --mono:'JetBrains Mono',monospace;
  --sans:'Barlow',sans-serif;
  --cond:'Barlow Condensed',sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0;}

body{
  background:var(--navy);
  color:var(--text);
  font-family:var(--sans);
  font-size:15px;
  line-height:1.6;
  min-height:100vh;
}

/* ─── Cross-section navigation (the top-level "Filings | Plans | Rate Areas") ─── */

.section-nav{
  background:var(--navy2);
  border-bottom:1px solid var(--border);
  box-shadow:0 1px 3px rgba(15,23,42,.04);
  padding:0 2rem;
  display:flex;
  align-items:center;
  gap:1.5rem;
  height:48px;
  position:sticky;
  top:0;
  z-index:101;
}

.section-nav-title{
  font-family:var(--cond);
  font-size:17px;
  font-weight:700;
  letter-spacing:.08em;
  color:var(--white);
  text-transform:uppercase;
  margin-right:auto;
  text-decoration:none;
  transition:color .15s;
}
.section-nav-title:hover{color:var(--teal2);}
.section-nav-title span{color:var(--teal2);}

.section-nav-link{
  font-family:var(--cond);
  font-size:14px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--text3);
  text-decoration:none;
  padding:8px 14px;
  border-radius:4px;
  transition:color .15s, background .15s;
}
.section-nav-link:hover{color:var(--text);background:rgba(15,23,42,.04);}
.section-nav-link.active{color:var(--teal);background:rgba(13,148,136,.08);}

/* ─── Coming-soon placeholder (used for /plans/ and /rate-areas/ until built) ─── */

.coming-soon{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-height:60vh;
  text-align:center;
  gap:1rem;
  padding:2rem;
}
.coming-soon h1{
  font-family:var(--cond);
  font-size:36px;
  font-weight:700;
  color:var(--white);
  letter-spacing:.04em;
}
.coming-soon p{color:var(--text2);font-size:15px;max-width:480px;}
.coming-soon .badge{
  display:inline-block;
  font-family:var(--cond);
  font-size:12px;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--teal2);
  background:rgba(13,148,136,.08);
  border:1px solid rgba(13,148,136,.25);
  border-radius:20px;
  padding:4px 14px;
}