/* RudramPSP — DESIGN TOKENS (V11 cycle 9 / C3 "design system v2"). ONE place for colour, type, spacing, radius, shadow and layer values.
   Themes (theme.js puts the choice on <html data-theme="…"> before the first paint):
     dark      the default — the original palette, unchanged, so nobody sees a difference until they switch
     light     light surfaces; every TEXT token meets WCAG AA (4.5 : 1) on every surface; gold also works under black button text
     contrast  high contrast for low vision — black / white / yellow, AAA text (7 : 1), white borders, a thick yellow focus ring
   Theme blocks use :root[data-theme=…] (specificity 0,2,0), so they override each page's own :root{…} palette without !important.
   Pages paint with these variables; `node scripts/theme_tool.js lint` (suite 71) refuses palette colours written as literals in CSS.
   TEXT tokens: --tx --mu --gold --g2tx --warn --red --grn --blu --pur --wa · FILL tokens: --goldf + --g2 (gold button / badge fills: black text on them),
   --on-accent = text ON a gold / yellow fill. In CSS, background uses of var(--gold) are written var(--goldf,var(--gold)) (the codemod does it). */
:root {
  --bg: #0a0c10; --s1: #111520; --s2: #161b28; --bd: #1e2535;
  --tx: #e8e6df; --mu: #7a7f8e;
  --gold: #c8922a; --goldf: var(--gold); --g2: #e8b84b; --g2tx: var(--g2); --warn: #e8b84b;
  --red: #e05c5c; --grn: #4caf87; --blu: #5b9bd5; --pur: #9b59b6; --wa: #25d366;
  --on-accent: #000; --sb: #2a3142; --sb2: #3a4258; --focus: #e8b84b;
  /* names a few legacy dashboards use for the same things */
  --surface: var(--s1); --border: var(--bd); --text: var(--tx); --muted: var(--mu); --danger: var(--red); --success: var(--grn); --gld: var(--gold); --gold2: var(--g2);
  /* type, spacing, shape, depth, layers — for new components */
  --font: 'DM Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --fs-xs: 11px; --fs-sm: 12px; --fs-md: 14px; --fs-lg: 16px; --fs-xl: 20px; --fs-2xl: 26px;
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px;
  --r-sm: 6px; --r-md: 10px; --r-lg: 14px; --r-pill: 999px;
  --sh-1: 0 1px 2px rgba(0,0,0,.3); --sh-2: 0 10px 28px -12px rgba(0,0,0,.5); --sh-3: 0 24px 60px rgba(0,0,0,.6);
  --z-shell: 8800; --z-drawer: 9700; --z-modal: 9800; --z-toast: 9900; --z-net: 10040;
}
/* dark = the default palette, with one accessibility correction: purple TEXT was 3.9 : 1 on cards → 5.0 : 1 */
:root[data-theme="dark"] { --pur: #a970c4; }
:root[data-theme="light"] {
  --bg: #f3f4f7; --s1: #ffffff; --s2: #eef1f5; --bd: #d3d8e1;
  --tx: #1a1d24; --mu: #5c6373;
  --gold: #86620a; --goldf: #c8922a; --g2: #e8b84b; --g2tx: #875c00; --warn: #875c00;
  --red: #c0392b; --grn: #1b7448; --blu: #1f63b0; --pur: #7d3c98; --wa: #11733c;
  --on-accent: #000; --sb: #c3c9d4; --sb2: #a9b1bf; --focus: #1f63b0;
  --surface: var(--s1); --border: var(--bd); --text: var(--tx); --muted: var(--mu); --danger: var(--red); --success: var(--grn); --gld: var(--gold); --gold2: var(--g2);
  --g3: #875c00; --p2: #7d3c98; --b2: #1f63b0; --bl: #1f63b0;
  --sh-1: 0 1px 2px rgba(16,24,40,.08); --sh-2: 0 10px 28px -12px rgba(16,24,40,.18); --sh-3: 0 24px 60px rgba(16,24,40,.25);
  color-scheme: light;
}
:root[data-theme="contrast"] {
  --bg: #000000; --s1: #000000; --s2: #141414; --bd: #ffffff;
  --tx: #ffffff; --mu: #e0e0e0;
  --gold: #ffcc33; --goldf: #ffcc33; --g2: #ffe066; --g2tx: #ffe066; --warn: #ffe066;
  --red: #ff7070; --grn: #4dff9a; --blu: #7fc8ff; --pur: #d9a6ff; --wa: #4dff9a;
  --on-accent: #000; --sb: #ffffff; --sb2: #ffcc33; --focus: #ffff00;
  --surface: var(--s1); --border: var(--bd); --text: var(--tx); --muted: var(--mu); --danger: var(--red); --success: var(--grn); --gld: var(--gold); --gold2: var(--g2);
  --g3: #ffe066; --p2: #d9a6ff; --b2: #7fc8ff; --bl: #7fc8ff;
  color-scheme: dark;
}
/* the page backdrop: light / contrast drop the dark glow */
:root[data-theme="light"] body { background: var(--bg); color: var(--tx); }
:root[data-theme="contrast"] body { background: #000; color: #fff; }
/* light: soft elevation instead of the heavy dark-theme shadows of the shell (sidebar, quick-view drawer, palette) */
:root[data-theme="light"] .psp-menu { box-shadow: 4px 0 18px rgba(16,24,40,.08); }
:root[data-theme="light"] .psp-dr { box-shadow: -8px 0 24px rgba(16,24,40,.12); }
:root[data-theme="light"] .psp-dr:not(.open), :root[data-theme="contrast"] .psp-dr:not(.open) { box-shadow: none; }
:root[data-theme="light"] .psp-pal, :root[data-theme="light"] .psp-qa, :root[data-theme="light"] .psp-np, :root[data-theme="light"] .psp-um { box-shadow: 0 14px 40px rgba(16,24,40,.18); }
/* contrast: visible edges and a thick focus ring everywhere */
:root[data-theme="contrast"] :focus-visible { outline: 3px solid var(--focus) !important; outline-offset: 2px !important; }
:root[data-theme="contrast"] p a, :root[data-theme="contrast"] td a, :root[data-theme="contrast"] li a, :root[data-theme="contrast"] .psp-crumbs a { text-decoration: underline; } /* inline links; cards that are links stay clean */
:root[data-theme="contrast"] .psp-kpi, :root[data-theme="contrast"] .psp-card, :root[data-theme="contrast"] .card, :root[data-theme="contrast"] .tw, :root[data-theme="contrast"] .sc { border-width: 2px; }
/* Hindi (Devanagari) — V11 C7. i18n.js sets <html lang="hi"> for the Hindi interface. System fonts only (no network font, no @import); English keeps DM Sans. */
:root:lang(hi) { --font: "Noto Sans Devanagari", "Nirmala UI", "Mangal", sans-serif; }
:root:lang(hi) body, :root:lang(hi) body * { font-family: var(--font); }
:root:lang(hi) body { line-height: 1.55; }
/* paper is always light */
@media print {
  :root, :root[data-theme] { --bg: #fff; --s1: #fff; --s2: #fff; --bd: #999; --tx: #000; --mu: #333; --gold: #86620a; --goldf: #c8922a; --g2tx: #875c00; --warn: #875c00; }
  body { background: #fff !important; color: #000 !important; }
}