/* =========================================================
   UiKit — design tokens
   Copy into any admin. Change accent to rebrand.
   ========================================================= */

:root {
  --font: "Manrope", "Segoe UI", system-ui, sans-serif;
  --display: "Unbounded", "Manrope", sans-serif;

  --i: 0;
  --v: 0%;
  --h: 217;
  --ttl: 4s;
  --p: 50%;

  --radius-xs: 8px;
  --radius-sm: 12px;
  --radius: 18px;
  --radius-lg: 24px;
  --sidebar-w: 264px;

  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

  --accent: #3b82f6;
  --accent-2: #2563eb;
  --accent-ink: #1d4ed8;
  --accent-grad: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
  --accent-soft: rgba(59, 130, 246, 0.12);
  --accent-glow: rgba(59, 130, 246, 0.35);

  --ok: #10b981;
  --warn: #f59e0b;
  --danger: #ef4444;
  --info: #38bdf8;
  --violet: #8b5cf6;
}

:root,
[data-theme="light"] {
  --bg: #f1f5f9;
  --surface: #ffffff;
  --surface-2: #f8fafc;
  --surface-3: #eef2f7;
  --glass: rgba(255, 255, 255, 0.72);
  --glass-strong: rgba(255, 255, 255, 0.86);
  --ink: #0f172a;
  --ink-2: #334155;
  --muted: #64748b;
  --line: rgba(15, 23, 42, 0.08);
  --line-strong: rgba(15, 23, 42, 0.14);
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.05), 0 2px 6px rgba(15, 23, 42, 0.04);
  --shadow: 0 10px 30px -12px rgba(15, 23, 42, 0.16), 0 2px 6px rgba(15, 23, 42, 0.04);
  --shadow-lg: 0 30px 60px -20px rgba(15, 23, 42, 0.28);
  --orb-1: rgba(59, 130, 246, 0.35);
  --orb-2: rgba(14, 165, 233, 0.22);
  --orb-3: rgba(99, 102, 241, 0.18);
  --track: rgba(15, 23, 42, 0.07);
  --skeleton: rgba(15, 23, 42, 0.06);
  --skeleton-hi: rgba(15, 23, 42, 0.11);
  color-scheme: light;
}

[data-theme="dark"] {
  --bg: #070b12;
  --surface: #0f1520;
  --surface-2: #131a28;
  --surface-3: #182233;
  --glass: rgba(15, 21, 32, 0.66);
  --glass-strong: rgba(15, 21, 32, 0.85);
  --ink: #e8eef8;
  --ink-2: #c4cddc;
  --muted: #8490a3;
  --line: rgba(232, 238, 248, 0.07);
  --line-strong: rgba(232, 238, 248, 0.13);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow: 0 14px 34px -14px rgba(0, 0, 0, 0.6);
  --shadow-lg: 0 30px 70px -20px rgba(0, 0, 0, 0.75);
  --accent-ink: #60a5fa;
  --accent-soft: rgba(59, 130, 246, 0.16);
  --orb-1: rgba(59, 130, 246, 0.28);
  --orb-2: rgba(14, 165, 233, 0.16);
  --orb-3: rgba(99, 102, 241, 0.16);
  --track: rgba(232, 238, 248, 0.07);
  --skeleton: rgba(232, 238, 248, 0.05);
  --skeleton-hi: rgba(232, 238, 248, 0.1);
  color-scheme: dark;
}