/* =====================================================================
   Digital Sarthi brand tokens — the ONLY place colours are defined.
   Base colours are averaged from the real logo pixels (brand/digital-sarthi-logo.png):
     navy-deep #053474 · navy #06599F · blue #0870B7 · orange #F4770D · orange-deep #EE5B08 · gold #FB9A10
   Every other value is a tint (mix with white) or shade (mix with black) of one of those.
   Contrast of every text/background pair is verified by `node tools/brand-check.mjs` (WCAG AA).
   ===================================================================== */
:root {
  /* Logo colours */
  --brand-navy-deep: #053474;
  --brand-navy: #06599F;
  --brand-blue: #0870B7;
  --brand-orange: #F4770D;
  --brand-orange-deep: #EE5B08;
  --brand-gold: #FB9A10;

  /* Surfaces and text (light) */
  --paper: #FFFAF5;          /* orange 4% on white */
  --card: #FFFFFF;
  --ink: #021734;            /* navy-deep 45% (shade) */
  --muted: #446797;          /* navy-deep 75% (tint) */
  --line: #DCE8F2;           /* navy 14% (tint) */

  /* Story band (header, hero, price card, footer) */
  --band: #053474;           /* navy-deep */
  --on-band: #FFFAF5;
  --on-band-muted: #CDDEEC;  /* navy 20% (tint) */

  /* Primary action: logo gold with dark ink text */
  --gold: #FB9A10;
  --on-gold: #021734;
  --accent: #F4770D;         /* logo orange, decoration and large shapes */

  /* Secondary action: logo blue */
  --teal: #0870B7;           /* name kept from the approved design; value is logo blue */
  --on-teal: #FFFFFF;
  --teal-text: #065A92;      /* blue 80% (shade) for text on light surfaces */
  --ok-soft: #E1EEF6;        /* blue 12% (tint) */

  /* Warning / "fake" state: deep orange family */
  --rose: #B34406;           /* orange-deep 75% (shade) */
  --rose-soft: #FDEBE1;      /* orange-deep 12% (tint) */

  /* Alerts used across member and admin panels */
  --alert-ok-bg: #E1EEF6;    --alert-ok-ink: #065A92;    --alert-ok-line: #0870B7;
  --alert-err-bg: #FDEBE1;   --alert-err-ink: #B34406;   --alert-err-line: #EE5B08;
  --alert-warn-bg: #FEF0DB;  --alert-warn-ink: #021734;  --alert-warn-line: #FB9A10;
  --alert-info-bg: #E1EEF6;  --alert-info-ink: #053474;  --alert-info-line: #053474;

  /* WhatsApp button uses brand blue (never WhatsApp green) so it stays inside the palette */
  --wa-bg: #0870B7;
  --wa-ink: #FFFFFF;

  /* Illustration-only neutrals: human skin and hair tones in the story scenes (not brand colours, not used for UI) */
  --illus-skin-1: #C98B5E;
  --illus-skin-2: #D9A073;
  --illus-hair: #021734;
  --illus-moon: #FEF0DB;

  --shadow: 0 10px 30px rgba(5, 52, 116, .12);
  --shadow-up: 0 -6px 20px rgba(5, 52, 116, .12);
  --focus: #FB9A10;
  --overlay: rgba(2, 23, 52, .55);          /* navy shade, backdrop behind the chat sheet */
  --poster-chip: rgba(2, 23, 52, .78);      /* label on the video poster */
  --watermark: rgba(255, 250, 245, .55);    /* paper tint, lesson watermark over video */

  /* Phone mock-up in the scam quiz (fixed: an illustration, not themed) */
  --device: #021734;
  --device-screen: #EEF3F8;
  --device-muted: #446797;
  --device-bubble: #FFFFFF;
  --device-ink: #021734;

  /* Story scene palette (fixed): logo colours and their tints/shades */
  --scene-night: #031F46;   /* navy-deep 60% shade */
  --scene-floor: #053474;   /* navy-deep */
  --scene-table: #06599F;   /* navy */
  --scene-wall: #021734;    /* navy-deep 45% shade */
  --scene-cloud: #06599F;
  --scene-paper: #FFFAF5;
  --scene-line: #CDDEEC;    /* navy 20% tint */
  --scene-dim: #446797;     /* navy-deep 75% tint */
  --scene-ray: #FDD39A;     /* gold 40% tint */
  --scene-glow: #FB9A10;

  /* Course banner tokens (Price/GST addendum §2), mapped to the real logo colours (verified against brand/digital-sarthi-logo.png;
     the artwork's navy #013B72–#1B3F7A and orange #F9900F–#F26B1D fall inside the logo palette). */
  --brand-primary: #053474;      /* logo navy-deep */
  --on-brand-primary: #FFFAF5;
  --brand-accent: #FB9A10;       /* logo gold */
  --on-brand-accent: #021734;
  --brand-tint: #E1EEF6;         /* logo blue 12% tint */
  --brand-ink: #021734;
  /* Alternating light band behind sections (Redesign §2): navy-deep 6% tint */
  --tint: #F0F3F7;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper: #010F20; --card: #021734; --ink: #EEF3F8; --muted: #B4CDE2; --line: #32598D;
    --band: #031F46; --on-band: #FFFAF5; --on-band-muted: #CDDEEC;
    --teal: #075F9C; --teal-text: #90BFDF; --ok-soft: #032740;
    --rose: #F9B47A; --rose-soft: #431902;
    --alert-ok-bg: #032740;  --alert-ok-ink: #90BFDF;  --alert-ok-line: #0870B7;
    --alert-err-bg: #431902; --alert-err-ink: #F9B47A; --alert-err-line: #EE5B08;
    --alert-warn-bg: #2E1D03; --alert-warn-ink: #FEF0DB; --alert-warn-line: #FB9A10;
    --alert-info-bg: #032740; --alert-info-ink: #EEF3F8; --alert-info-line: #90BFDF;
    --wa-bg: #075F9C;
    --brand-primary: #031F46; --brand-tint: #032740; --brand-ink: #EEF3F8; --tint: #021734;
    --shadow: 0 10px 30px rgba(0, 0, 0, .45);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --paper: #010F20; --card: #021734; --ink: #EEF3F8; --muted: #B4CDE2; --line: #32598D;
  --band: #031F46; --on-band: #FFFAF5; --on-band-muted: #CDDEEC;
  --teal: #075F9C; --teal-text: #90BFDF; --ok-soft: #032740;
  --rose: #F9B47A; --rose-soft: #431902;
  --alert-ok-bg: #032740;  --alert-ok-ink: #90BFDF;  --alert-ok-line: #0870B7;
  --alert-err-bg: #431902; --alert-err-ink: #F9B47A; --alert-err-line: #EE5B08;
  --alert-warn-bg: #2E1D03; --alert-warn-ink: #FEF0DB; --alert-warn-line: #FB9A10;
  --alert-info-bg: #032740; --alert-info-ink: #EEF3F8; --alert-info-line: #90BFDF;
  --wa-bg: #075F9C;
  --brand-primary: #031F46; --brand-tint: #032740; --brand-ink: #EEF3F8; --tint: #021734;
  --shadow: 0 10px 30px rgba(0, 0, 0, .45);
  color-scheme: dark;
}