/* Dark-mode overrides for carried-over saint landing pages.
   Each page defines its own light-palette :root vars using a shared set of
   names; we re-map those same names under [data-theme=dark].

   Vars covered (verified from each saint's index.html):
     --bg, --bg-deep, --ink, --ink-soft, --muted,
     --saffron, --saffron-dk, --vithal, --vithal-dk,
     --gold, --sand, --line, --paper,
     --accent, --accent-dk
*/

[data-theme="dark"] {
  --bg:         #0E1424;
  --bg-deep:    #131B30;
  --paper:      rgba(255, 255, 255, 0.05);
  --ink:        #EDE6D6;
  --ink-soft:   #B9B2A0;
  --muted:      #8E8775;
  --saffron:    #D9A441;
  --saffron-dk: #D9A441;
  --vithal:     #F5EFDF;
  --vithal-dk:  #F5EFDF;
  --gold:       #D9A441;
  --sand:       #8E8775;
  --line:       rgba(217, 164, 65, 0.25);
  /* --accent and --accent-dk vary by saint (each page overrides in :root);
     provide neutral dark defaults that work for all five pages */
  --accent:     #D9A441;
  --accent-dk:  #A87C28;
}

[data-theme="dark"] body {
  background: var(--bg);
  color: var(--ink);
}

/* Inverted accent panels — in light mode these are dark boxes (var(--vithal-dk)
   / var(--ink) background + var(--bg) light text). In dark mode those vars flip
   light, which would make the panels glare bright. Re-style them as dark,
   slightly-elevated surfaces with light text. */
[data-theme="dark"] header.top-nav,
[data-theme="dark"] .one-practice,
[data-theme="dark"] .cross-nav,
[data-theme="dark"] .cta,
[data-theme="dark"] .anchor-tip,
[data-theme="dark"] .stat {
  background: var(--bg-deep);
  color: var(--ink);
}
[data-theme="dark"] .stats { background: var(--line); }      /* grid-gap lines */
[data-theme="dark"] header.top-nav { border-bottom-color: var(--line); }

/* Text inside those panels that hard-codes color:var(--bg) (→dark on dark) */
[data-theme="dark"] .one-practice h4,
[data-theme="dark"] .cta h2,
[data-theme="dark"] .cross-nav .cn-link,
[data-theme="dark"] .cross-nav .cn-title,
[data-theme="dark"] header.top-nav .crumbs .current,
[data-theme="dark"] header.top-nav .crumbs a:hover,
[data-theme="dark"] .stat .n,
[data-theme="dark"] .stat .label {
  color: var(--ink);
}
[data-theme="dark"] .cta .btn.ghost { color: var(--ink); border-color: var(--line); }
[data-theme="dark"] a.stat:hover .n { color: var(--saffron); }

/* Active graph-filter chip: use the gold accent instead of flipped cream */
[data-theme="dark"] .graph-controls .gc-chip.active {
  background: var(--saffron);
  color: var(--bg);
  border-color: var(--saffron);
}

/* Cool Slate — backgrounds only; the saint pages' ink/accents stay as their :root */
[data-theme="slate"] {
  --bg:      #F2F4F6;
  --bg-deep: #E5E9EE;
  --paper:   #FCFDFE;
  --line:    #D6DCE3;
}
[data-theme="slate"] body { background: var(--bg); }

/* Soft Sage */
[data-theme="sage"] {
  --bg:      #F1F3EF;
  --bg-deep: #E4E8E1;
  --paper:   #FBFCFA;
  --line:    #D4DBCE;
}
[data-theme="sage"] body { background: var(--bg); }

/* Hero quick-links (jump to key sections) */
.hero-quicklinks { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 14px; margin: 22px auto 0; max-width: 760px; }
.hero-quicklinks a {
  font-family: 'Inter', sans-serif; font-size: 13px; line-height: 1.3; letter-spacing: .01em;
  color: var(--ink, #2b2b2b); text-decoration: none;
  padding: 7px 14px; border: 1px solid var(--line, #d7cbb3); border-radius: 999px;
  background: var(--paper, #fff); transition: border-color .15s, transform .15s, color .15s;
}
.hero-quicklinks a:hover { border-color: var(--saffron, #C8702A); color: var(--saffron-dk, #A8842C); transform: translateY(-1px); }

/* Linked voice-card titles in the Five Voices section */
.voice-card h4 a { color: inherit; text-decoration: none; border-bottom: 1px solid transparent; transition: border-color .15s; }
.voice-card h4 a:hover { border-bottom-color: currentColor; }

/* Hero stat tiles linked to their sections */
a.stat { text-decoration: none; color: inherit; cursor: pointer; transition: transform .12s; }
a.stat:hover { transform: translateY(-2px); }
a.stat:hover .n { color: var(--saffron-dk, #A8842C); }

/* Work-in-progress / AI disclaimer banner (injected by landings.py) */
.wip-banner {
  background:     var(--bg-deep, #F2EAD8);
  border-bottom:  1px solid var(--line, #D7CBB3);
  color:          var(--muted, #6b6453);
  font-family:    'Inter', sans-serif;
  font-size:      12px;
  line-height:    1.45;
  text-align:     center;
  padding:        8px 48px;
}
.wip-banner b { color: var(--saffron-dk, #A8842C); font-weight: 600; }

/* Theme-toggle button injected by landings.py */
#theme-toggle {
  background:    var(--bg-deep, #F2EAD8);
  border:        1px solid var(--line, #D7CBB3);
  color:         var(--gold, #A8842C);
  border-radius: 50%;
  width:         32px;
  height:        32px;
  cursor:        pointer;
  font-size:     15px;
}