/* ============================================================
   Redesign Identity Tokens — Nusoos 2026 (navy · gold · cyan)
   ------------------------------------------------------------
   Overrides the design-system.css variables to the new brand
   identity. Loaded AFTER design-system.css so :root wins by
   cascade order. Pages keep their existing markup — every
   element that uses var(--brand-*) / var(--surface) etc. adopts
   the new identity with NO structural/logic change.
   Source of truth: ~/Documents/Nusoos-redesign/Nusoos *.html
   ============================================================ */

:root {
  /* Brand scale: green → GOLD (matches design files' --gold-*) */
  --brand-50:  #fffbeb;
  --brand-100: #fef3c7;
  --brand-200: #fde68a;
  --brand-300: #e9cf85;
  --brand-400: #d6bb6c;
  --brand-500: #c9a84c;
  --brand-600: #b8902a;
  --brand-700: #92660d;
  --brand-800: #7a560b;
  --brand-900: #5e4309;

  /* Cyan accent (design files' --cyan-*) — for links/highlights */
  --accent-500: #06b6d4;
  --accent-600: #0891b2;
  --accent-700: #0e7490;

  /* Navy/gray surfaces & text already match the design palette,
     but pin them explicitly so the identity is self-contained. */
  --bg-primary:   #ffffff;
  --bg-secondary: #f8fafc;
  --bg-tertiary:  #f1f5f9;
  --surface:         #ffffff;
  --surface-hover:   #f8fafc;
  --surface-elevated:#ffffff;
  --text-primary:   #0f172a;
  --text-secondary: #334155;
  --text-tertiary:  #64748b;
  --border:       #e2e8f0;
  --border-hover: #cbd5e1;

  /* Gold glow replaces green glow */
  --shadow-glow: 0 0 20px rgba(201,168,76,0.20);

  /* Warning text tuned for AA on LIGHT surfaces. Bare --warning (#d97706,
     amber-600) is only ~3.2:1 on white — too low for the small legal-status
     pills (.src-pill.amend / .src-card-status.amend). Pin a darker step for
     TEXT; dark mode lifts it back to the bright warning (below). */
  --warning-strong: #b45309;   /* amber-700 — ~5.0:1 on #fff */

  --font-arabic: 'IBM Plex Sans Arabic', 'Tajawal', system-ui, sans-serif;

  /* ── Design aliases (Nusoos 2026 — navy · gold · cyan) ──────────
     Named scales so page CSS can reference the identity directly,
     matching the design files' --navy-*/--gold-*/--cyan-* tokens. */
  --navy-950: #0a1020;
  --navy-900: #0f172a;
  --navy-800: #1e293b;
  --navy-700: #334155;
  --gold-50:  #fffbeb;
  --gold-100: #fef3c7;
  --gold-200: #fde68a;
  --gold-400: #d6bb6c;
  --gold-500: #c9a84c;
  --gold-600: #b8902a;
  --gold-700: #92660d;
  --gold:     #c9a84c;
  --cyan-50:  #ecfeff;
  --cyan-100: #cffafe;
  --cyan-300: #67e8f9;
  --cyan-500: #06b6d4;
  --cyan-600: #0891b2;
  --cyan-700: #0e7490;
  --cyan:     #06b6d4;
  --accent-50:  #ecfeff;
  --accent-300: #67e8f9;
}

[data-theme="dark"] {
  --bg-primary:   #0a1020;
  --bg-secondary: #0f172a;
  --bg-tertiary:  #1e293b;
  --surface:         #0f172a;
  --surface-hover:   #1e293b;
  --surface-elevated:#1e293b;
  --text-primary:   #f1f5f9;
  --text-secondary: #cbd5e1;
  --text-tertiary:  #94a3b8;
  --border:       #334155;
  --border-hover: #475569;
  --shadow-glow: 0 0 24px rgba(201,168,76,0.30);

  /* ── Dark-mode contrast fixes (WCAG AA on navy surfaces) ──────────
     The default semantic / cyan / info colours are mid-dark hues that
     fail AA when used as TEXT on the dark surfaces (#0f172a / #1e293b).
     Lighten them in dark mode only — light theme keeps its original
     values. Templates reference these as tokens, so fixing here is the
     single-source-of-truth fix (no template edits needed).            */
  --info:    #38bdf8;  /* was #0284c7 (3.6:1) → 6.8:1 on #1e293b */
  --success: #34d399;  /* was #059669 (3.9:1) → 7.6:1 */
  --warning: #fbbf24;  /* was #d97706 (4.6:1) → 8.8:1 */
  --warning-strong: #fbbf24;  /* lift amber-700 to the bright warning on navy */
  --danger:  #f87171;  /* was #dc2626 (3.0:1) → 5.3:1 */

  /* Cyan accent: keep bright for accents AND readable as text.
     The dark-blue 600/700 ramp steps fail as text on dark, so pin the
     darker cyan steps to brighter values in dark mode. Light theme is
     untouched. */
  --accent-500: #38bdf8;
  --accent-600: #38bdf8;  /* was #0891b2 (≈3.0:1) */
  --accent-700: #67e8f9;
  --cyan-600:   #38bdf8;  /* was #0891b2 — used as text in systems/detail */
  --cyan-700:   #22d3ee;  /* was #0e7490 */
  --cyan:       #38bdf8;
}

/* Body font picks up the new Arabic stack (Tajawal added). */
body { font-family: var(--font-arabic); }

/* Selection in brand gold instead of green. */
::selection { background: var(--brand-200); color: var(--brand-900); }
[data-theme="dark"] ::selection { background: var(--brand-800); color: var(--brand-100); }