/* tokens.css — design tokens Sie-Naprawi (H5/H6)
   paleta "aurora borealis": fiolet #7c3aed + mint #5eead4, tło ciemne #0a0e1a.
   MOTYW: ciemny = domyślny. Przełącznik data-theme (auto/light/dark) sterowany
   przez render.js (wzorzec Yasuke). Bez JS = zawsze ciemny.
*/

:root {
  /* Typografia */
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "Cascadia Mono", Menlo, Consolas, monospace;

  /* Layout */
  --maxw: 1100px;
  --radius: 6px;
  --radius-lg: 12px;
  --ease: cubic-bezier(.22,.61,.36,1);
  --space: 1rem;

  /* ============ MOTYW CIEMNY (domyślny) ============ */
  --bg: #0a0e1a;           /* tło bazowe (ciemny granat) */
  --bg-card: #12162a;      /* karta/sekcja */
  --bg-elevated: #161b30;  /* hover / podniesione */
  --line: #1e2440;         /* obramowanie / subtelny */

  --text: #f5f3ff;         /* tekst główny (biały z nutą fioletu) */
  --text-soft: #a5a3b3;    /* tekst drugorzędny */

  --fiolet: #7c3aed;       /* akcent 1 (głęboki fiolet) */
  --fiolet-light: #8b5cf6; /* rozświetlony (tylko podświetlenie) */
  --mint: #5eead4;         /* akcent 2 (CTA / "naprawione") */
  --mint-light: #7ff0dc;   /* rozświetlony */

  --on-fiolet: #f5f3ff;    /* tekst na fioletowym tle (biały) */
  --on-mint: #06281f;      /* tekst na mint (ciemny — kontrast) */

  /* Statusy */
  --ok: #4ec77a;
  --err: #f06a5c;
  --warn: #e6b45e;

  color-scheme: dark;
}

/* ============ MOTYW JASNY (data-theme="light" albo auto+system light) ============ */
:root[data-theme="light"] {
  --bg: #f7f7fb;
  --bg-card: #ffffff;
  --bg-elevated: #f0f0f6;
  --line: #e2e2ea;

  --text: #1a1a2e;
  --text-soft: #5a5a6e;

  --fiolet: #7c3aed;
  --fiolet-light: #6d28d9;
  --mint: #0d9488;
  --mint-light: #14b8a6;

  --on-fiolet: #ffffff;
  --on-mint: #06281f;

  --ok: #1f7a3d;
  --err: #c0392b;
  --warn: #b45309;

  color-scheme: light;
}

/* auto + system jasny → jasny motyw */
@media (prefers-color-scheme: light) {
  :root[data-theme="auto"] {
    --bg: #f7f7fb;
    --bg-card: #ffffff;
    --bg-elevated: #f0f0f6;
    --line: #e2e2ea;

    --text: #1a1a2e;
    --text-soft: #5a5a6e;

    --fiolet: #7c3aed;
    --fiolet-light: #6d28d9;
    --mint: #0d9488;
    --mint-light: #14b8a6;

    --on-fiolet: #ffffff;
    --on-mint: #06281f;

    --ok: #1f7a3d;
    --err: #c0392b;
    --warn: #b45309;

    color-scheme: light;
  }
}
