/* shared/bh-tokens.css — BaakiHai v2
   THE single source of truth for all colour tokens.
   Editing this file changes the fallback defaults only.
   NEVER define --bg, --card, etc. anywhere else. */

/* ── Typography — Plus Jakarta Sans is the primary UI sans ───────── */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&family=Cormorant+Garamond:ital,wght@0,400;0,700;1,400;1,500;1,700&family=Noto+Sans+Devanagari:wght@400;500;600&display=swap');

:root {
  /* ── Typography scale ────────────────────────────────────── */
  --font-ui:      'Plus Jakarta Sans', 'Noto Sans Devanagari', system-ui, sans-serif;
  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-hindi:   'Noto Sans Devanagari', system-ui, sans-serif;

  --fs-xs:   10px;   /* timestamps, decorative only — never body copy */
  --fs-sm:   12px;   /* labels, chips, meta text */
  --fs-base: 14px;   /* primary body / nav text */
  --fs-md:   16px;   /* card titles, important content */
  --fs-lg:   20px;   /* section headings */
  --fs-xl:   26px;   /* page headings, modal titles (use --font-display) */
  --fs-2xl:  32px;   /* hero headings (use --font-display italic) */

  /* ── Light theme (primary brand palette) ─────────────────── */
  /* Backgrounds */
  --bg:    #fff9e1;
  --card:  #fffdf4;
  --card2: #fff5d6;
  --sb:    #fff9e1;

  /* Text — obsidian/dark for readability on cream */
  --cream: #120B04;       /* main text — near-black warm brown */
  --muted: #3D2010;       /* secondary text */
  --muted2:#6B4020;       /* tertiary text */

  /* Topbar — always dark */
  --topbar-bg: #1C1208;
  --topbar-text: #F2E8D4;
  --topbar-muted: rgba(242,232,212,0.55);

  /* Brand accents — canonical gold + soft variant */
  --gold:       #C8860A;  /* primary CTA / gold accent */
  --gold-light: #E8C070;  /* soft gold for decorative borders / backgrounds */
  --tur:        #C8860A;  /* topbar accent — same as gold */
  --terra: #C94830;       /* warning / error */
  --sage:  #2E7D52;       /* success / positive */
  --nacc:  #1A9B8C;       /* warm teal — replaces cold clinical blue */
  --mauve: #8B5CF6;       /* Sahayak AI accent — violet */
  --mauve-bg:  rgba(139,92,246,0.07);
  --mauve-bor: rgba(139,92,246,0.25);
  --mauve-act: rgba(139,92,246,0.15);

  /* Borders (derived from --gold) */
  --bor:   rgba(150,80,10,0.30);
  --borhi: rgba(150,80,10,0.60);
  --act:   rgba(150,80,10,0.14);

  /* Sidebar active state */
  --sb-active-bg:  #FAEEDA;
  --sb-active-bor: #BA7517;

  /* Exam colours */
  --upsc:    #C8860A;
  --ssc:     #2E7D52;
  --upsc-bg: rgba(200,134,10,0.10);
  --ssc-bg:  rgba(46,125,82,0.10);

  /* Sahayak */
  --sah-bg:  #FFF9E1;

  /* Pattern tokens */
  --radius-card: 12px;
  --radius-btn:  10px;
  --radius-chip: 20px;
  --shadow:      0 2px 16px rgba(26,16,8,0.14);
  --sb-width:    240px;
  --sb-collapsed:52px;
  --topbar-h:    50px;
  --anim:        0.2s;
}

/* ── Dark mode ───────────────────────────────────────────────────────── */
html.dark {
  --bg:    #18100A;
  --card:  #1E140C;
  --card2: #241A10;
  --sb:    #1C1208;
  --cream: #F2E8D4;
  --muted: #C4A882;
  --muted2:#9E7B5A;
  --bor:   rgba(220,135,50,0.18);
  --borhi: rgba(220,135,50,0.40);
  --act:   rgba(220,135,50,0.12);
  --shadow: 0 2px 16px rgba(0,0,0,0.30);
  --sb-active-bg:  rgba(220,135,50,0.12);
  --sb-active-bor: #C8860A;
}