/* NEXULIS — Color system
 * Dark-first. Base palette = "ink" (cool near-black blues), accent = electric
 * blue. Semantic colors (red/green/amber) are reserved for real telemetry and
 * state — never decorative. Swiss-origin red appears only as a small mark.
 *
 * :root carries the DARK theme (the primary mode). [data-theme="light"] remaps
 * the semantic aliases; base scales stay identical so components are theme-safe.
 */

:root {
  /* ---- Base scale: Ink (cool blue-greys) ---- */
  --ink-950: #0A0F1F; /* app background */
  --ink-925: #0C1120;
  --ink-900: #0E1424; /* raised surface */
  --ink-850: #131A2C; /* card */
  --ink-800: #1A2236; /* card hover / inset */
  --ink-750: #1F293F;
  --ink-700: #232C42; /* hairline borders on dark */
  --ink-600: #323C56;
  --ink-500: #4B5670;
  --ink-400: #6B768F; /* muted text */
  --ink-300: #95A0B8; /* secondary text */
  --ink-200: #C2CAD9;
  --ink-100: #E4E8F0;
  --ink-50:  #F8FAFC; /* primary text on dark / app bg on light */
  --white:   #FFFFFF;

  /* ---- Accent: Electric blue ---- */
  --blue-700: #1D4ED8;
  --blue-600: #2563EB;
  --blue-500: #3B82F6;
  --blue-400: #60A5FA;
  --blue-300: #93C5FD;
  --blue-200: #BFDBFE;

  /* ---- Semantic raw ---- */
  --red-700:   #B91C1C;
  --red-600:   #DC2626; /* critical / alert */
  --red-500:   #EF4444;
  --green-700: #047857;
  --green-600: #059669; /* success / healthy */
  --green-500: #10B981;
  --amber-600: #D97706;
  --amber-500: #F59E0B; /* warning / degraded */
  --cyan-500:  #06B6D4; /* informational telemetry */

  /* Swiss-origin signal — small mark / footer treatment only */
  --swiss-red: #D52B1E;

  /* ---- Semantic aliases (DARK) ---- */
  --bg-base:        var(--ink-950);
  --bg-raised:      var(--ink-900);
  --bg-card:        var(--ink-850);
  --bg-inset:       var(--ink-800);
  --bg-overlay:     rgba(6, 9, 18, 0.72);
  --surface-card:   var(--ink-850);

  --border-subtle:  rgba(255, 255, 255, 0.06);
  --border-default: rgba(255, 255, 255, 0.10);
  --border-strong:  rgba(255, 255, 255, 0.18);
  --border-accent:  var(--blue-500);

  --text-primary:   var(--ink-50);
  --text-secondary: var(--ink-300);
  --text-muted:     var(--ink-400);
  --text-inverse:   var(--ink-950);
  --text-accent:    var(--blue-400);
  --text-on-accent: var(--white);

  --accent:         var(--blue-500);
  --accent-hover:   var(--blue-400);
  --accent-press:   var(--blue-600);
  --accent-soft:    rgba(59, 130, 246, 0.12);
  --accent-ring:    rgba(59, 130, 246, 0.45);

  --status-critical: var(--red-500);
  --status-warning:  var(--amber-500);
  --status-healthy:  var(--green-500);
  --status-info:     var(--cyan-500);

  --critical-soft: rgba(239, 68, 68, 0.12);
  --warning-soft:  rgba(245, 158, 11, 0.12);
  --healthy-soft:  rgba(16, 185, 129, 0.12);
  --info-soft:     rgba(6, 182, 212, 0.12);

  --focus-ring: var(--accent-ring);
}

/* ---- Light theme ---- */
[data-theme="light"] {
  --bg-base:        var(--ink-50);
  --bg-raised:      var(--white);
  --bg-card:        var(--white);
  --bg-inset:       #EEF1F6;
  --bg-overlay:     rgba(15, 23, 42, 0.40);
  --surface-card:   var(--white);

  --border-subtle:  rgba(10, 15, 31, 0.07);
  --border-default: rgba(10, 15, 31, 0.12);
  --border-strong:  rgba(10, 15, 31, 0.22);
  --border-accent:  var(--blue-600);

  --text-primary:   var(--ink-950);
  --text-secondary: var(--ink-500);
  --text-muted:     var(--ink-400);
  --text-inverse:   var(--ink-50);
  --text-accent:    var(--blue-600);
  --text-on-accent: var(--white);

  --accent:         var(--blue-600);
  --accent-hover:   var(--blue-700);
  --accent-press:   var(--blue-700);
  --accent-soft:    rgba(37, 99, 235, 0.08);
  --accent-ring:    rgba(37, 99, 235, 0.35);

  --status-critical: var(--red-600);
  --status-warning:  var(--amber-600);
  --status-healthy:  var(--green-600);
  --status-info:     var(--cyan-500);

  --critical-soft: rgba(220, 38, 38, 0.08);
  --warning-soft:  rgba(217, 119, 6, 0.10);
  --healthy-soft:  rgba(5, 150, 105, 0.10);
  --info-soft:     rgba(6, 182, 212, 0.10);
}