/* ============================================================
   Unify Design Tokens — CSS variables for app-wide theming
   Generated from DESIGN.md (2026-06-28)
   ============================================================ */
:root,
[data-theme="light"] {
  /* ---------- Sidebar / dark shell ---------- */
  --color-sidebar-bg: #0f172a;
  --color-sidebar-text: #cbd5e1;
  --color-sidebar-border: #1e293b;
  --color-sidebar-hover-bg: #1e293b;
  --color-sidebar-hover-text: #e2e8f0;

  /* ---------- Main surface ---------- */
  --color-surface: #ffffff;
  --color-surface-secondary: #f8fafc;
  --color-surface-overlay: #f1f5f9;

  /* ---------- Primary brand / interactive ---------- */
  --color-primary: #2563eb;
  --color-primary-hover: #1d4ed8;
  --color-primary-fax: #2664b0;
  --color-primary-fax-hover: #1f5598;
  --color-primary-light: #eff6ff;
  --color-primary-text: #1d4ed8;

  /* ---------- Neutral / border / text scale ---------- */
  --color-text-primary: #020617;
  --color-text-secondary: #334155;
  --color-text-muted: #64748b;
  --color-text-faint: #94a3b8;
  --color-border: #e2e8f0;
  --color-border-strong: #cbd5e1;
  --color-border-input: #cbd5e1;

  /* ---------- Semantic — Status & Alerts ---------- */
  --color-warning: #ea580c;
  --color-warning-bg: #fff7ed;
  --color-warning-border: #fed7aa;
  --color-warning-text: #9a3412;

  --color-danger: #dc2626;
  --color-danger-bg: #fef2f2;
  --color-danger-border: #fecaca;
  --color-danger-text: #991b1b;

  --color-success: #059669;
  --color-success-bg: #ecfdf5;
  --color-success-border: #a7f3d0;
  --color-success-text: #065f46;

  --color-purple-bg: #faf5ff;
  --color-purple-border: #e9d5ff;
  --color-purple-text: #7e22ce;

  /* ---------- Service type badges ---------- */
  --color-equipment-bg: #eef2ff;
  --color-equipment-border: #c7d2fe;
  --color-equipment-text: #3730a3;

  --color-supply-bg: #ecfdf5;
  --color-supply-border: #a7f3d0;
  --color-supply-text: #065f46;

  /* ---------- Rounded corners ---------- */
  --rounded-sm: 4px;
  --rounded-md: 6px;
  --rounded-lg: 8px;
  --rounded-xl: 12px;
  --rounded-full: 9999px;

  /* ---------- Spacing scale ---------- */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 12px;
  --space-lg: 16px;
  --space-xl: 24px;
  --space-2xl: 40px;
}