/* foundation/tokens.css — the design system's single source of truth.
   REBUILT from design_reference/.../assets/style.css §5. Values are the actual style.css values
   (source of truth for pixel-match); where the README §5 summary differed, the CSS wins.
   Load order: tokens.css → components.css → shell.css → (page css). RTL + Vazirmatn. */

@import url('/foundation/vazirmatn.css');
/* Lexend is used ONLY for the logotype (see ui.js UI.logo). KaTeX 0.16.9 is loaded on demand. */

:root {
  /* ---- Brand · indigo ---- */
  --indigo-50:#EEF0FF; --indigo-100:#E0E3FF; --indigo-200:#C4C9FF; --indigo-300:#A0A8FF;
  --indigo-400:#7C84F7; --indigo-500:#5B63E8; --indigo-600:#4F46E5; --indigo-700:#4038C4;
  --indigo-800:#322C9B; --indigo-900:#272275;
  /* ---- Accent · cyan ---- */
  --cyan-300:#67E8F9; --cyan-400:#38D6EE; --cyan-500:#22C7E0; --cyan-600:#0FAEC9;
  /* ---- Highlight · amber ---- */
  --amber-300:#FCD34D; --amber-400:#FBBF24; --amber-500:#F59E0B; --amber-600:#D97706;
  /* ---- Neutrals · slate ---- */
  --slate-50:#F8FAFC; --slate-100:#F1F5F9; --slate-150:#E9EEF5; --slate-200:#E2E8F0;
  --slate-300:#CBD5E1; --slate-400:#94A3B8; --slate-500:#64748B; --slate-600:#475569;
  --slate-700:#334155; --slate-800:#1E293B; --slate-900:#0F172A; --slate-950:#070C18;
  /* ---- Semantic ---- */
  --success:#16A34A; --success-bg:#DCFCE7;
  --warn:#D97706;    --warn-bg:#FEF3C7;
  --danger:#DC2626;  --danger-bg:#FEE2E2;
  --info:#2563EB;    --info-bg:#DBEAFE;

  /* ---- Roles ---- */
  --primary:var(--indigo-600); --primary-strong:var(--indigo-700);
  --accent:var(--cyan-500); --highlight:var(--amber-400);
  --bg:var(--slate-100); --surface:#FFFFFF; --surface-2:var(--slate-50);
  --text:var(--slate-800); --text-soft:var(--slate-500); --text-faint:var(--slate-400);
  --border:var(--slate-200); --border-strong:var(--slate-300);

  /* ---- Radii ---- */
  --r-xs:7px; --r-sm:10px; --r-md:14px; --r-lg:20px; --r-xl:28px; --r-full:999px;
  /* ---- Shadow (soft, low-alpha) ---- */
  --sh-xs:0 1px 2px rgba(15,23,42,.06);
  --sh-sm:0 1px 3px rgba(15,23,42,.08), 0 1px 2px rgba(15,23,42,.04);
  --sh-md:0 4px 14px rgba(15,23,42,.08), 0 2px 4px rgba(15,23,42,.04);
  --sh-lg:0 14px 40px rgba(15,23,42,.12), 0 4px 10px rgba(15,23,42,.05);
  --sh-indigo:0 10px 28px rgba(79,70,229,.30);           /* brand CTAs */

  /* ---- Type ---- */
  --font:'Vazirmatn', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-logo:'Lexend', var(--font);

  /* ---- Layout ---- */
  --sidebar-w:264px; --sidebar-collapsed:76px; --topbar-h:66px; --content-max:1180px;
  --gutter:24px;
}

/* Playful icon-tile palette (ico-*): a tint bg + matching ink, per README §5. */
:root {
  --ico-indigo-bg:var(--indigo-100); --ico-indigo-ink:var(--indigo-700);
  --ico-cyan-bg:#CFF7FB;             --ico-cyan-ink:var(--cyan-600);
  --ico-green-bg:var(--success-bg);  --ico-green-ink:var(--success);
  --ico-amber-bg:var(--warn-bg);     --ico-amber-ink:var(--amber-600);
  --ico-rose-bg:#FFE4EC;             --ico-rose-ink:#E11D6B;
  --ico-violet-bg:#EDE9FE;           --ico-violet-ink:#6D28D9;
}

*, *::before, *::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body {
  margin:0; font-family:var(--font); background:var(--bg); color:var(--text);
  direction:rtl; line-height:1.7; font-size:15px; -webkit-font-smoothing:antialiased;
}
a { color:inherit; text-decoration:none; }
:focus-visible { outline:2px solid var(--primary); outline-offset:2px; border-radius:var(--r-xs); }
::selection { background:var(--indigo-100); }

/* Persian numerals: JS does the real conversion (UI.faNum); this keeps numeric inputs LTR. */
input[inputmode="numeric"], input.ltr-num, .num-ltr { direction:ltr; text-align:right; }
