/*
 * ============================================================
 *  Pantheon: Will of the Gods — GDD Stylesheet
 *  File: pantheon-dark.css
 *  Contains: Color values ONLY — dark / canonical theme
 *  Requires: pantheon-structure.css loaded before this file
 *
 *  Color token quick-reference:
 *  --void         #0f0d0b   Page + topbar background
 *  --deep-soil    #1a1610   Sidebar background
 *  --dark-earth   #28201a   Card / surface background
 *  --mid-earth    #3e3025   Borders, dividers
 *  --stone        #685848   Muted text, icons, labels
 *  --sand         #9a8870   Secondary / body text
 *  --parchment    #d4c8a8   Primary text, headings
 *  --deep-moss    #1e2e1a   Nature tag background
 *  --forest       #2e4828   Nature tag text
 *  --sage         #4a7040   Nature tag border
 *  --deep-slate   #182830   Divine tag background
 *  --river        #3a6878   Divine tag border
 *  --crimson-d    #8b1a1a   War tag bg / warning bg
 *  --crimson      #c82020   War tag border / warning accent
 *  --gold         #c8881a   Primary accent
 *  --gold-dim     rgba(200,136,26,0.15)   Active nav tint
 * ============================================================
 */


/* ── Color tokens ── */
:root {
  --void:        #0f0d0b;
  --deep-soil:   #1a1610;
  --dark-earth:  #28201a;
  --mid-earth:   #3e3025;
  --stone:       #685848;
  --sand:        #9a8870;
  --parchment:   #d4c8a8;
  --deep-moss:   #1e2e1a;
  --forest:      #2e4828;
  --sage:        #4a7040;
  --deep-slate:  #182830;
  --slate:       #204050;
  --river:       #3a6878;
  --crimson-d:   #8b1a1a;
  --crimson:     #c82020;
  --gold:        #c8881a;
  --gold-dim:    rgba(200, 136, 26, 0.15);
  --divine-gradient: linear-gradient(135deg, #3a6878 0%, #6888c8 50%, #c8a830 100%);
}


/* ── Base ── */
html, body {
  background-color: var(--void);
  color: var(--parchment);
}


/* ── Sidebar ── */
.sidebar {
  background-color: var(--void);
  border-right-color: var(--dark-earth);
}

.sidebar-logo {
  border-bottom-color: var(--dark-earth);
}

.sidebar-logo::after {
  background-color: var(--gold);
}

.logo-eyebrow  { color: var(--stone); }
.logo-title    { color: var(--parchment); }
.logo-sub      { color: var(--stone); }

.nav-section-label { color: var(--mid-earth); }

.nav-item       { color: var(--stone); }
.nav-item:hover { color: var(--sand); background-color: rgba(255, 255, 255, 0.02); }

.nav-item.active {
  color: var(--parchment);
  border-left-color: var(--gold);
  background: linear-gradient(
    to right,
    rgba(200, 136, 26, 0.22) 0%,
    rgba(200, 136, 26, 0.06) 60%,
    transparent 100%
  );
}

.nav-num                  { color: var(--mid-earth); }
.nav-item.active .nav-num { color: var(--gold); }

.sidebar-footer      { border-top-color: var(--dark-earth); }
.sidebar-footer-text { color: var(--mid-earth); }


/* ── Topbar ── */
.topbar          { background-color: var(--void); border-bottom-color: var(--dark-earth); }
.breadcrumb      { color: var(--stone); }
.breadcrumb span { color: var(--sand); }
.breadcrumb-sep  { color: var(--mid-earth); }
.topbar-meta     { color: var(--mid-earth); }


/* ── Typography ── */
.page-eyebrow     { color: var(--stone); }
.page-title       { color: var(--parchment); }
.page-subtitle    { color: var(--stone); }
.section-heading  { color: var(--parchment); border-bottom-color: var(--dark-earth); }
.sub-heading      { color: var(--parchment); }
.body-text        { color: var(--sand); }
.body-text strong { color: var(--parchment); }
.body-text em     { color: var(--stone); }
.caption          { color: var(--stone); }


/* ── Divider ── */
.divider-line         { background: linear-gradient(to right, var(--gold), var(--dark-earth) 70%); }
.divider-line.reverse { background: linear-gradient(to left,  var(--gold), var(--dark-earth) 70%); }
.divider-ornament     { color: var(--stone); }


/* ── Tags ── */
.tag-neutral { border-color: var(--mid-earth); color: var(--stone);  background-color: var(--dark-earth); }
.tag-war     { border-color: var(--crimson);   color: #ffc8b8;        background-color: var(--crimson-d);  }
.tag-divine  { border-color: var(--river);     color: #b8d8e0;        background-color: var(--deep-slate); }
.tag-nature  { border-color: var(--sage);      color: #c8e8a8;        background-color: var(--deep-moss);  }


/* ── Pull quote ── */
.pullquote {
  border-left-color: var(--gold);
  color: var(--sand);
  background-color: var(--gold-dim);
}


/* ── Stat cards ── */
.stat-card             { background-color: var(--deep-soil); border-color: var(--dark-earth); }
.stat-card-val         { color: var(--gold); }
.stat-card-val.war     { color: var(--crimson); }
.stat-card-val.neutral { color: var(--parchment); }
.stat-card-val.nature  { color: #c8e8a8; }
.stat-card-val.divine  { color: #b8d8e0; }
.stat-card-label       { color: var(--stone); }


/* ── Formula block ── */
.formula-block {
  background-color: var(--deep-soil);
  border-color: var(--dark-earth);
  border-left-color: var(--gold);
  color: var(--sand);
}


/* ── Warning block ── */
.warning-block {
  background-color: rgba(139, 26, 26, 0.15);
  border-color: var(--crimson-d);
  color: #ffc8b8;
}


/* ── Design note ── */
.design-note         { background-color: var(--deep-soil); border-color: var(--dark-earth); color: var(--stone); }
.design-note::before { color: var(--mid-earth); }


/* ── Data table ── */
.data-table          { border-color: var(--dark-earth); }
.data-table th       { color: var(--stone); background-color: var(--deep-soil); border-bottom-color: var(--mid-earth); }
.data-table td       { color: var(--sand); border-bottom-color: var(--dark-earth); }
.data-table td strong { color: var(--parchment); }
.data-table tbody tr:hover { background-color: rgba(255, 255, 255, 0.02); }
.data-table caption  { color: var(--stone); }
