/* Design tokens - Device Migration System (cloudatus) */

:root {
  /* Brand scale - navy + blue */
  --brand-50: #eff6ff;
  --brand-100: #dbeafe;
  --brand-500: #2f6bff;
  --brand-600: #2558d9;
  --brand-700: #1b2f4b;
  --brand-800: #0f2744;

  /* Legacy aliases (used across app.css and pages) */
  --brand: var(--brand-500);
  --brand-soft: var(--brand-50);
  --brand-rgb: 47, 107, 255;
  --ring: rgba(47, 107, 255, 0.18);

  /* Charts & progress */
  --accent: #3b82f6;
  --accent-soft: #eff6ff;
  --accent-rgb: 59, 130, 246;

  /* Brand surfaces */
  --brand-solid: #1b2f4b;
  --brand-arrow: #3b82f6;
  --brand-accent: #34d399;
  --brand-gradient: linear-gradient(90deg, var(--brand-700) 0%, var(--brand-500) 100%);
  --brand-gradient-vertical: linear-gradient(180deg, var(--brand-800) 0%, var(--brand-700) 100%);

  /* Surfaces */
  --bg-0: #ffffff;
  --bg-1: #f6f7f9;
  --bg-2: #f1f3f6;
  --bg-sidebar: #f6f7f9;
  --surface-elevated: #fafbfc;

  /* Text */
  --ink-0: #0d1526;
  --ink-1: #1e293b;
  --muted: #5c6578;
  --muted-2: #8b95a8;

  /* Borders */
  --line: #e4e8ef;
  --line-soft: #f0f2f5;
  --line-strong: #cbd5e1;

  /* Semantic */
  --ok: #0a7a55;
  --ok-soft: #ecfdf5;
  --ok-line: #a7f3d0;

  --warn: #b45309;
  --warn-soft: #fffbeb;
  --warn-line: #fde68a;

  --err: #b42318;
  --err-soft: #fef3f2;
  --err-line: #fecaca;

  --info: #0369a1;
  --info-soft: #e0f2fe;
  --info-line: #7dd3fc;

  /* Elevation */
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
  --shadow-md: 0 1px 3px rgba(15, 23, 42, 0.06), 0 8px 24px rgba(15, 23, 42, 0.05);
  --shadow-lg: 0 4px 6px rgba(15, 23, 42, 0.04), 0 16px 40px rgba(15, 23, 42, 0.08);

  /* Radius */
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;

  /* Spacing */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 40px;
  --space-8: 48px;

  /* Layout */
  --sidebar-w: 248px;
  --topbar-h: 56px;

  /* Typography */
  --font: "Inter", system-ui, -apple-system, sans-serif;
  --font-mono: ui-monospace, "Cascadia Code", "Consolas", monospace;

  --text-xs: 0.75rem;
  --text-sm: 0.8125rem;
  --text-base: 0.9375rem;
  --text-md: 1rem;
  --text-lg: 1.25rem;
  --text-xl: 1.375rem;
  --text-2xl: 1.75rem;

  --leading-tight: 1.25;
  --leading-normal: 1.5;
  --tracking-tight: -0.025em;

  /* Motion */
  --transition-fast: 120ms ease;
  --transition-base: 200ms ease;
}

/* Dark mode — deeper near-black surfaces, readable ink */
[data-theme="dark"] {
  color-scheme: dark;

  --bg-0: #0b0e13;
  --bg-1: #06080c;
  --bg-2: #12161e;
  --bg-sidebar: #080a0f;
  --surface-elevated: #0f1319;

  --ink-0: #f8fafc;
  --ink-1: #e8eef6;
  --muted: #a7b4c6;
  --muted-2: #7d8a9c;

  --line: #1c2330;
  --line-soft: #141922;
  --line-strong: #2a3444;

  --brand-50: rgba(47, 107, 255, 0.14);
  --brand-soft: rgba(47, 107, 255, 0.16);
  --accent-soft: rgba(59, 130, 246, 0.14);

  --ok: #3ecf8e;
  --ok-soft: rgba(62, 207, 142, 0.12);
  --ok-line: rgba(62, 207, 142, 0.35);

  --warn: #f0b429;
  --warn-soft: rgba(240, 180, 41, 0.12);
  --warn-line: rgba(240, 180, 41, 0.35);

  --err: #f07167;
  --err-soft: rgba(240, 113, 103, 0.12);
  --err-line: rgba(240, 113, 103, 0.35);

  --info: #5bb8f5;
  --info-soft: rgba(91, 184, 245, 0.12);
  --info-line: rgba(91, 184, 245, 0.35);

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.45);
  --shadow-md: 0 1px 3px rgba(0, 0, 0, 0.5), 0 8px 24px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 4px 6px rgba(0, 0, 0, 0.45), 0 16px 40px rgba(0, 0, 0, 0.5);

  /* Bootstrap bridges */
  --bs-body-bg: var(--bg-1);
  --bs-body-color: var(--ink-1);
  --bs-secondary-color: var(--muted);
  --bs-tertiary-bg: var(--bg-2);
  --bs-border-color: var(--line);
  --bs-heading-color: var(--ink-0);
}