/* ============================================================
   Foresst Study — Design Tokens
   Deep forest · emerald · sage mist · golden hour
   ============================================================ */

:root {
  /* ── Forest accent ── */
  --color-accent:        #2d6a4f;
  --color-accent-hover:  #1b4332;
  --color-accent-soft:   rgba(45, 106, 79, 0.12);
  --color-accent-muted:  rgba(45, 106, 79, 0.06);

  /* ── Golden hour / leaf highlights ── */
  --color-gold:          #74c69d;
  --color-gold-light:    #b7e4c7;
  --color-gold-dark:     #40916c;
  --color-gold-glow:     rgba(82, 183, 136, 0.28);

  /* ── Deep forest ── */
  --color-royal:         #1a3d2e;
  --color-royal-deep:    #0d2818;
  --color-royal-soft:    rgba(26, 61, 46, 0.08);

  /* ── Light surfaces (sage mist) ── */
  --color-bg:            #f2f6f3;
  --color-bg-elevated:   #fafcfa;
  --color-bg-subtle:     #e8efe9;
  --color-bg-hover:      #dce8df;
  --color-bg-active:     rgba(45, 106, 79, 0.10);

  /* ── Sidebar (deep forest) ── */
  --sidebar-bg:          #0f2419;
  --sidebar-bg-hover:    rgba(255, 255, 255, 0.06);
  --sidebar-bg-active:   rgba(116, 198, 157, 0.16);
  --sidebar-border:      rgba(116, 198, 157, 0.20);
  --sidebar-text:        rgba(240, 248, 242, 0.72);
  --sidebar-text-active: #d8f3dc;
  --sidebar-label:       rgba(149, 213, 178, 0.55);

  /* ── Borders ── */
  --color-border:        rgba(26, 61, 46, 0.10);
  --color-border-strong: rgba(26, 61, 46, 0.18);
  --color-border-gold:   rgba(64, 145, 108, 0.32);

  /* ── Text ── */
  --color-text-primary:   #1a2e24;
  --color-text-secondary: #4a5c52;
  --color-text-tertiary:  #7a8f82;
  --color-text-inverse:   #f0f8f2;

  /* ── Shadows (soft, organic) ── */
  --shadow-xs:  0 1px 2px rgba(13, 40, 24, 0.05);
  --shadow-sm:  0 2px 8px rgba(13, 40, 24, 0.06), 0 1px 2px rgba(13, 40, 24, 0.04);
  --shadow-md:  0 8px 24px rgba(13, 40, 24, 0.08), 0 2px 6px rgba(13, 40, 24, 0.04);
  --shadow-lg:  0 16px 48px rgba(13, 40, 24, 0.10), 0 4px 12px rgba(13, 40, 24, 0.06);
  --shadow-gold: 0 4px 20px rgba(64, 145, 108, 0.22);

  /* ── Gradients ── */
  --gradient-gold:       linear-gradient(135deg, #95d5b2 0%, #52b788 45%, #2d6a4f 100%);
  --gradient-royal:      linear-gradient(180deg, #1a3d2e 0%, #0f2419 100%);
  --gradient-surface:    linear-gradient(180deg, #fafcfa 0%, #f2f6f3 100%);
  --gradient-shimmer:    linear-gradient(105deg, transparent 40%, rgba(82, 183, 136, 0.10) 50%, transparent 60%);
  --gradient-aurora:     linear-gradient(135deg, rgba(45, 106, 79, 0.08) 0%, rgba(149, 213, 178, 0.12) 50%, rgba(212, 165, 116, 0.06) 100%);

  /* ── Layout ── */
  --sidebar-width:           260px;
  --sidebar-width-collapsed: 64px;
  --navbar-height:           60px;
  --radius-sm:   8px;
  --radius-md:   12px;
  --radius-lg:   16px;
  --radius-xl:   20px;
  --radius-full: 9999px;

  /* ── Typography ── */
  --font-family:    'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-display:   'Fraunces', Georgia, 'Times New Roman', serif;
  --font-size-xs:   0.75rem;
  --font-size-sm:   0.8125rem;
  --font-size-base: 0.9375rem;
  --font-size-lg:   1.125rem;
  --font-size-xl:   1.5rem;
  --font-size-2xl:  2.125rem;
  --font-size-3xl:  2.75rem;
  --font-weight-normal:   400;
  --font-weight-medium:   500;
  --font-weight-semibold: 600;
  --font-weight-bold:     700;
  --line-height-tight:  1.25;
  --line-height-normal: 1.5;
  --line-height-relaxed: 1.65;
  --letter-spacing-tight:  -0.02em;
  --letter-spacing-wide:    0.08em;
  --letter-spacing-display: 0.01em;

  /* ── Motion ── */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-in-out: cubic-bezier(0.45, 0, 0.55, 1);
  --duration-fast:   150ms;
  --duration-normal: 250ms;
  --duration-slow:   500ms;
  --duration-slower: 700ms;

  /* ── Subject icon tints ── */
  --icon-history:    #6b8f7a;
  --icon-ancient:    #8a9a78;
  --icon-medieval:   #788898;
  --icon-polity:     #5c8a9a;
  --icon-economics:  #5a9a78;
  --icon-econ-opt:   #7a9a68;
  --icon-geography:  #4a9a9a;
  --icon-environment:#3d9a6a;
  --icon-science:    #8a7a9a;
  --icon-current:    #9a6a8a;
  --icon-ssc:        #6a9a6a;
}

[data-theme="dark"] {
  --color-accent:        #52b788;
  --color-accent-hover:  #74c69d;
  --color-accent-soft:   rgba(82, 183, 136, 0.14);
  --color-accent-muted:  rgba(82, 183, 136, 0.08);

  --color-gold:          #95d5b2;
  --color-gold-light:    #d8f3dc;
  --color-gold-dark:     #52b788;
  --color-gold-glow:     rgba(149, 213, 178, 0.22);

  --color-royal:         #0a120e;
  --color-royal-deep:    #060a08;
  --color-royal-soft:    rgba(82, 183, 136, 0.06);

  --color-bg:            #0a100c;
  --color-bg-elevated:   #111a14;
  --color-bg-subtle:     #1a2620;
  --color-bg-hover:      #243028;
  --color-bg-active:     rgba(82, 183, 136, 0.12);

  --sidebar-bg:          #080f0b;
  --sidebar-bg-hover:    rgba(149, 213, 178, 0.08);
  --sidebar-bg-active:   rgba(149, 213, 178, 0.18);
  --sidebar-border:      rgba(149, 213, 178, 0.22);
  --sidebar-text:        rgba(216, 243, 220, 0.68);
  --sidebar-text-active: #d8f3dc;
  --sidebar-label:       rgba(149, 213, 178, 0.50);

  --color-border:        rgba(149, 213, 178, 0.10);
  --color-border-strong: rgba(149, 213, 178, 0.18);
  --color-border-gold:   rgba(149, 213, 178, 0.30);

  --color-text-primary:   #e8f0ea;
  --color-text-secondary: #9ab0a4;
  --color-text-tertiary:  #6a8074;
  --color-text-inverse:   #0a100c;

  --shadow-xs:  0 1px 2px rgba(0, 0, 0, 0.30);
  --shadow-sm:  0 2px 8px rgba(0, 0, 0, 0.32), 0 1px 2px rgba(0, 0, 0, 0.20);
  --shadow-md:  0 8px 24px rgba(0, 0, 0, 0.36), 0 2px 6px rgba(0, 0, 0, 0.22);
  --shadow-lg:  0 16px 48px rgba(0, 0, 0, 0.42), 0 4px 12px rgba(0, 0, 0, 0.28);
  --shadow-gold: 0 4px 24px rgba(82, 183, 136, 0.18);

  --gradient-gold:    linear-gradient(135deg, #b7e4c7 0%, #52b788 50%, #2d6a4f 100%);
  --gradient-royal:   linear-gradient(180deg, #111a14 0%, #080f0b 100%);
  --gradient-surface: linear-gradient(180deg, #111a14 0%, #0a100c 100%);
  --gradient-aurora:  linear-gradient(135deg, rgba(45, 106, 79, 0.12) 0%, rgba(82, 183, 136, 0.08) 50%, rgba(0, 0, 0, 0) 100%);
}