/* ==========================================================================
   Daberna Admin — design tokens
   Dark-first. The light theme is a token swap, not a second stylesheet, so a
   component only ever reads variables and never branches on the theme.
   ========================================================================== */

:root {
  /* --- surfaces (dark) --- */
  --bg: #080a10;
  --bg-elev: #0d111a;
  --surface: #111725;
  --surface-2: #161d2e;
  --surface-3: #1c2438;
  --overlay: rgba(4, 6, 11, 0.72);

  /* --- lines --- */
  --line: #1f2739;
  --line-soft: #182032;
  --line-strong: #2c3650;

  /* --- text --- */
  --text: #e8edf7;
  --text-2: #a8b3c7;
  --text-3: #6f7b93;
  --text-inv: #0a0d14;

  /* --- brand --- */
  --brand: #6366f1;
  --brand-2: #8b5cf6;
  --brand-soft: rgba(99, 102, 241, 0.14);
  --brand-line: rgba(99, 102, 241, 0.38);
  --brand-text: #a5b4fc;

  /* --- semantic --- */
  --ok: #22c55e;
  --ok-soft: rgba(34, 197, 94, 0.13);
  --warn: #f59e0b;
  --warn-soft: rgba(245, 158, 11, 0.13);
  --danger: #f43f5e;
  --danger-soft: rgba(244, 63, 94, 0.13);
  --info: #38bdf8;
  --info-soft: rgba(56, 189, 248, 0.13);
  --purple: #a855f7;
  --purple-soft: rgba(168, 85, 247, 0.13);

  /* --- shape --- */
  --r-xs: 6px;
  --r-sm: 9px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 22px;
  --r-full: 999px;

  /* --- elevation --- */
  --sh-1: 0 1px 2px rgba(0, 0, 0, 0.4);
  --sh-2: 0 4px 16px rgba(0, 0, 0, 0.45);
  --sh-3: 0 18px 50px rgba(0, 0, 0, 0.6);
  --ring: 0 0 0 3px var(--brand-soft);

  /* --- motion --- */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --t-fast: 120ms;
  --t: 200ms;
  --t-slow: 380ms;

  /* --- layout --- */
  --sidebar-w: 264px;
  --sidebar-w-collapsed: 76px;
  --topbar-h: 62px;

  --font: "Vazirmatn", "IRANSans", "Segoe UI", Tahoma, system-ui, -apple-system, sans-serif;
  --mono: "JetBrains Mono", "Fira Code", ui-monospace, SFMono-Regular, Menlo, monospace;
}

html[data-theme="light"] {
  --bg: #f4f6fb;
  --bg-elev: #ffffff;
  --surface: #ffffff;
  --surface-2: #f7f9fd;
  --surface-3: #eef2f9;
  --overlay: rgba(15, 23, 42, 0.42);

  --line: #e3e8f2;
  --line-soft: #edf1f8;
  --line-strong: #cfd7e6;

  --text: #0f172a;
  --text-2: #4a5568;
  --text-3: #8792a6;
  --text-inv: #ffffff;

  --brand: #4f46e5;
  --brand-2: #7c3aed;
  --brand-soft: rgba(79, 70, 229, 0.09);
  --brand-line: rgba(79, 70, 229, 0.28);
  --brand-text: #4338ca;

  --ok: #16a34a;
  --ok-soft: rgba(22, 163, 74, 0.1);
  --warn: #d97706;
  --warn-soft: rgba(217, 119, 6, 0.1);
  --danger: #e11d48;
  --danger-soft: rgba(225, 29, 72, 0.09);
  --info: #0284c7;
  --info-soft: rgba(2, 132, 199, 0.1);
  --purple: #9333ea;
  --purple-soft: rgba(147, 51, 234, 0.1);

  --sh-1: 0 1px 2px rgba(15, 23, 42, 0.06);
  --sh-2: 0 4px 16px rgba(15, 23, 42, 0.08);
  --sh-3: 0 18px 50px rgba(15, 23, 42, 0.16);
}