/* SkyOps — Design tokens
   Dark-first engineering aesthetic. Light theme maps same semantic tokens. */

:root,
[data-theme="dark"] {
  /* Surfaces */
  --bg-app: #0a0e1a;
  --bg-sidebar: #0f1420;
  --bg-card: #111827;
  --bg-inset: #0f172a;
  --bg-elevated: #162033;
  --bg-hover: #18223a;
  --bg-active: #1b2744;

  /* Borders */
  --border-base: #1e293b;
  --border-elevated: #334155;
  --border-strong: #475569;

  /* Text */
  --fg-primary: #e2e8f0;
  --fg-secondary: #94a3b8;
  --fg-muted: #64748b;
  --fg-disabled: #475569;

  /* Brand gradient */
  --brand-from: #2E75B6;
  --brand-to: #7B5EA7;
  --brand-grad: linear-gradient(135deg, #2E75B6 0%, #7B5EA7 100%);

  /* Actions */
  --accent-primary: #4a90d9;     /* info, links, secondary CTA */
  --accent-primary-hover: #5da0e3;
  --accent-mission: #d4910c;     /* mission / primary action */
  --accent-mission-hover: #e5a024;

  /* Status — health */
  --health-ok: #22c55e;
  --health-warn: #eab308;
  --health-crit: #ef4444;

  /* Severity */
  --sev-critical: #ef4444;
  --sev-high: #f97316;
  --sev-medium: #eab308;
  --sev-low: #22c55e;

  /* Thermal palette */
  --thermal-cool: #3b82f6;
  --thermal-normal: #22d3ee;
  --thermal-warm: #eab308;
  --thermal-hot: #ef4444;

  /* Temporal chips */
  --temp-new: #4a90d9;
  --temp-persistent: #64748b;
  --temp-degraded: #ef4444;
  --temp-resolved: #22c55e;

  /* Focus */
  --focus-ring: 0 0 0 2px rgba(74, 144, 217, 0.4);

  /* Type */
  --font-sans: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Type scale */
  --fs-10: 10px;
  --fs-11: 11px;
  --fs-12: 12px;
  --fs-13: 13px;
  --fs-14: 14px;
  --fs-16: 16px;
  --fs-18: 18px;
  --fs-20: 20px;
  --fs-22: 22px;
  --fs-28: 28px;
  --fs-36: 36px;

  /* Spacing — 4-based */
  --s-2: 2px;
  --s-4: 4px;
  --s-6: 6px;
  --s-8: 8px;
  --s-10: 10px;
  --s-12: 12px;
  --s-14: 14px;
  --s-16: 16px;
  --s-20: 20px;
  --s-24: 24px;
  --s-28: 28px;
  --s-32: 32px;
  --s-40: 40px;
  --s-48: 48px;

  /* Radius */
  --r-input: 6px;
  --r-button: 8px;
  --r-card: 10px;
  --r-hero: 12px;
  --r-pill: 999px;

  /* Motion */
  --motion-fast: 120ms cubic-bezier(0.2, 0, 0, 1);
  --motion-base: 180ms cubic-bezier(0.2, 0, 0, 1);
  --motion-slow: 240ms cubic-bezier(0.2, 0, 0, 1);

  /* Layout */
  --row-h: 40px;
  --sidebar-w: 220px;
  --topbar-h: 52px;
}

/* Light theme — same tokens, remapped */
[data-theme="light"] {
  --bg-app: #f5f7fa;
  --bg-sidebar: #ffffff;
  --bg-card: #ffffff;
  --bg-inset: #f0f3f7;
  --bg-elevated: #ffffff;
  --bg-hover: #eef2f7;
  --bg-active: #e2e8f0;

  --border-base: #e2e8f0;
  --border-elevated: #cbd5e1;
  --border-strong: #94a3b8;

  --fg-primary: #0f172a;
  --fg-secondary: #475569;
  --fg-muted: #64748b;
  --fg-disabled: #cbd5e1;

  --accent-primary: #2563eb;
  --accent-primary-hover: #1d4ed8;
  --accent-mission: #b27208;
  --accent-mission-hover: #d4910c;

  --health-ok: #16a34a;
  --health-warn: #ca8a04;
  --health-crit: #dc2626;

  --sev-critical: #dc2626;
  --sev-high: #ea580c;
  --sev-medium: #ca8a04;
  --sev-low: #16a34a;

  --temp-new: #2563eb;
  --temp-persistent: #64748b;
  --temp-degraded: #dc2626;
  --temp-resolved: #16a34a;
}

/* Accent variants (Tweak) */
[data-accent="blue"]   { --accent-primary: #4a90d9; --accent-primary-hover: #5da0e3; }
[data-accent="cyan"]   { --accent-primary: #22d3ee; --accent-primary-hover: #67e8f9; }
[data-accent="violet"] { --accent-primary: #8b5cf6; --accent-primary-hover: #a78bfa; }