/* ============================================================
   Parus Design System — Design Tokens
   Source of truth for all Parus products (dashboards, chats,
   corporate services, tables). Consumed as CSS custom props.
   Base: slate neutrals + blue primary, shadcn/ui aligned.
   ============================================================ */

:root,
[data-theme="light"] {
  /* Surfaces & text */
  --mp-bg: #f8fafc;
  --mp-bg-alt: #f1f5f9;
  --mp-surface: #ffffff;
  --mp-border: #e2e8f0;
  --mp-text: #0f172a;
  --mp-text-secondary: #475569;
  --mp-text-muted: #64748b;
  --mp-hover: rgba(59, 130, 246, 0.06);
  --mp-selected: rgba(59, 130, 246, 0.12);

  /* Brand & semantics */
  --mp-primary: #3b82f6;
  --mp-primary-hover: #2563eb;
  --mp-primary-bg: #eff6ff;
  --mp-on-primary: #ffffff;
  --mp-critical: #ef4444;
  --mp-on-track: #22c55e;
  --mp-delayed: #f97316;
  --mp-on-hold: #94a3b8;
  --mp-warning: #ca8a04;
  --mp-danger-hover-bg: #fef2f2;

  /* Status pills (bg + text pairs) */
  --mp-status-not-started: #cbd5e1;
  --mp-status-not-started-text: #475569;
  --mp-status-in-progress: #93c5fd;
  --mp-status-in-progress-text: #1e40af;
  --mp-status-completed: #86efac;
  --mp-status-completed-text: #15803d;
  --mp-status-delayed: #fdba74;
  --mp-status-delayed-text: #9a3412;
  --mp-status-on-hold: #d1d5db;
  --mp-status-on-hold-text: #6b7280;

  /* Soft badges */
  --mp-badge-green-bg: #dcfce7;
  --mp-badge-green-text: #15803d;
  --mp-badge-amber-bg: #fef9c3;
  --mp-badge-amber-text: #854d0e;
  --mp-badge-red-bg: #fee2e2;
  --mp-badge-red-text: #b91c1c;
  --mp-badge-blue-bg: #dbeafe;
  --mp-badge-blue-text: #1d4ed8;

  /* Overlays */
  --mp-toast-bg: #1e293b;
  --mp-toast-text: #f1f5f9;

  /* Elevation */
  --mp-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --mp-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --mp-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --mp-shadow-popover: 0 4px 20px rgba(0, 0, 0, 0.15);

  /* Radii — role-based, not a linear scale */
  --mp-radius-button: 6px;   /* buttons, inputs, selects */
  --mp-radius-menu: 8px;     /* dropdowns, popovers, icon buttons, segmented */
  --mp-radius-card: 12px;    /* cards, panels, modals */
  --mp-radius-pill: 99px;    /* chips, status badges */

  /* Type */
  --mp-font: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --mp-font-mono: "Fira Code", "Cascadia Code", Consolas, monospace;

  /* Type scale (compact density) */
  --mp-text-hero: 1.5rem;    /* 24px / 700 — section title */
  --mp-text-lg: 1.0625rem;   /* 17px / 600 — panel subtitle */
  --mp-text-base: 0.9375rem; /* 15px       — body / fields */
  --mp-text-sm: 0.8125rem;   /* 13px       — tables, task rows */
  --mp-text-label: 11px;     /* 11px / 600 uppercase — field label */

  /* Control heights (compact) */
  --mp-control-h: 34px;

  /* Tell the browser to theme native UI (scrollbars, form controls, caret) */
  color-scheme: light;
}

/* Respond to BOTH conventions: `.dark` (Tailwind `darkMode: ["class"]`, shadcn,
   and what globals.css keys off) and `[data-theme="dark"]`. ThemeProvider sets
   both, but anything that toggles only `.dark` must still get the tokens. */
[data-theme="dark"],
.dark {
  color-scheme: dark;
  --mp-bg: #0f172a;
  --mp-bg-alt: #1e293b;
  --mp-surface: #1e293b;
  --mp-border: #334155;
  --mp-text: #f1f5f9;
  --mp-text-secondary: #94a3b8;
  --mp-text-muted: #64748b;
  --mp-hover: rgba(99, 179, 237, 0.08);
  --mp-selected: rgba(99, 179, 237, 0.16);

  --mp-primary: #60a5fa;
  --mp-primary-hover: #93c5fd;
  --mp-primary-bg: #1e3a5f;
  --mp-on-primary: #0f172a;
  --mp-critical: #f87171;
  --mp-on-track: #4ade80;
  --mp-delayed: #fb923c;
  --mp-on-hold: #64748b;
  --mp-warning: #fbbf24;
  --mp-danger-hover-bg: rgba(239, 68, 68, 0.12);

  --mp-status-not-started: #334155;
  --mp-status-not-started-text: #94a3b8;
  --mp-status-in-progress: #1e40af;
  --mp-status-in-progress-text: #93c5fd;
  --mp-status-completed: #14532d;
  --mp-status-completed-text: #86efac;
  --mp-status-delayed: #7c2d12;
  --mp-status-delayed-text: #fdba74;
  --mp-status-on-hold: #374151;
  --mp-status-on-hold-text: #94a3b8;

  --mp-badge-green-bg: #14532d;
  --mp-badge-green-text: #86efac;
  --mp-badge-amber-bg: #713f12;
  --mp-badge-amber-text: #fde68a;
  --mp-badge-red-bg: #7f1d1d;
  --mp-badge-red-text: #fca5a5;
  --mp-badge-blue-bg: #1e3a5f;
  --mp-badge-blue-text: #93c5fd;

  --mp-toast-bg: #0f172a;
  --mp-toast-text: #f1f5f9;

  --mp-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.3);
  --mp-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.4), 0 1px 2px -1px rgb(0 0 0 / 0.4);
  --mp-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.5), 0 4px 6px -4px rgb(0 0 0 / 0.5);
  --mp-shadow-popover: 0 4px 24px rgba(0, 0, 0, 0.5);
}