/* ============================================================
   AVASAR CRM — DESIGN TOKENS  (Standards domain 18)
   Tier 1 primitive palette  ->  Tier 2 semantic tokens  ->  components.
   Theme = brand override only. Semantic colors (ok/warn/crit/info) are
   FIXED across themes. Light/dark via [data-mode]. Brand via [data-theme].
   Components must consume semantic tokens, never raw hex.
   ============================================================ */

/* ---------- SEMANTIC defaults (= Indigo, light) ---------- */
:root{
  /* neutrals (light) */
  --bg:#f1f5f9; --surface:#ffffff; --surface-2:#f1f5f9; --surface-3:#e2e8f0;
  --border:#e4e9f0; --border-2:#cbd5e1;
  --text:#334155; --text-muted:#64748b; --heading:#0f172a;

  /* brand (default indigo) — themes override --brand-* */
  --brand-50:#eef2ff; --brand-400:#818cf8; --brand-600:#4f46e5; --accent:#ea580c;
  --primary:var(--brand-600); --primary-50:var(--brand-50); --on-primary:#ffffff;
  --ring:color-mix(in srgb, var(--primary) 38%, transparent);

  /* fixed semantics (light) */
  --ok:#10b981; --ok-50:#ecfdf5;
  --warn:#f59e0b; --warn-50:#fffbeb;
  --crit:#ef4444; --crit-50:#fef2f2;
  --info:#3b82f6; --info-50:#eff6ff;
  --purple:#7c3aed; --purple-50:#f5f3ff;

  /* shape + type + elevation */
  --radius:12px; --radius-sm:8px; --radius-lg:18px;
  --ff:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --shadow-sm:0 1px 2px rgba(15,23,42,.06),0 2px 8px rgba(15,23,42,.05);
  --shadow-md:0 6px 24px rgba(15,23,42,.10);
  --shadow-lg:0 18px 48px rgba(15,23,42,.16);
  --sidebar-w:248px; --topbar-h:62px;
}

/* ---------- DARK mode: neutrals + lift brand/semantics ---------- */
[data-mode="dark"]{
  --bg:#0b1220; --surface:#131d2e; --surface-2:#182539; --surface-3:#22324a;
  --border:#243349; --border-2:#33475f;
  --text:#dce5f0; --text-muted:#8da3bd; --heading:#f4f8fc;
  --primary:var(--brand-400);
  --primary-50:color-mix(in srgb, var(--brand-400) 18%, #0b1220);
  --on-primary:#0b1220;
  --ok:#34d399; --ok-50:#0c2a20;
  --warn:#fbbf24; --warn-50:#2e2410;
  --crit:#f87171; --crit-50:#311616;
  --info:#60a5fa; --info-50:#11233e;
  --purple:#a78bfa; --purple-50:#241a3a;
  --shadow-sm:0 1px 2px rgba(0,0,0,.4),0 2px 8px rgba(0,0,0,.35);
  --shadow-md:0 8px 28px rgba(0,0,0,.5);
  --shadow-lg:0 20px 50px rgba(0,0,0,.6);
}

/* ============ THEME CATALOG (brand only; ≥9 + a11y) ============ */
[data-theme="indigo"]  { --brand-50:#eef2ff; --brand-400:#818cf8; --brand-600:#4f46e5; --accent:#ea580c; }
[data-theme="saffron"] { --brand-50:#fff7ed; --brand-400:#fb923c; --brand-600:#ea580c; --accent:#4f46e5; }
[data-theme="emerald"] { --brand-50:#ecfdf5; --brand-400:#34d399; --brand-600:#059669; --accent:#0ea5e9; }
[data-theme="ocean"]   { --brand-50:#f0f9ff; --brand-400:#38bdf8; --brand-600:#0284c7; --accent:#14b8a6; }
[data-theme="violet"]  { --brand-50:#f5f3ff; --brand-400:#a78bfa; --brand-600:#7c3aed; --accent:#ec4899; }
[data-theme="rose"]    { --brand-50:#fff1f2; --brand-400:#fb7185; --brand-600:#e11d48; --accent:#f59e0b; }
[data-theme="teal"]    { --brand-50:#f0fdfa; --brand-400:#2dd4bf; --brand-600:#0d9488; --accent:#6366f1; }
[data-theme="amber"]   { --brand-50:#fffbeb; --brand-400:#fbbf24; --brand-600:#d97706; --accent:#0ea5e9; }
[data-theme="slate"]   { --brand-50:#f8fafc; --brand-400:#94a3b8; --brand-600:#475569; --accent:#0ea5e9; }
/* accessibility themes */
[data-theme="contrast"]{ --brand-50:#f5f5f5; --brand-400:#ffffff; --brand-600:#000000; --accent:#0000ee; }
[data-theme="contrast"]:not([data-mode="dark"]){ --border:#000; --border-2:#000; --text:#000; --heading:#000; }
[data-theme="colorblind"]{ --brand-50:#eef4ff; --brand-400:#56b4e9; --brand-600:#0072b2; --accent:#e69f00; }
[data-theme="colorblind"]{ --ok:#009e73; --warn:#e69f00; --crit:#d55e00; --info:#0072b2; }