/*
 * Design tokens - LMS Kozienice
 * Zrodlo prawdy: block-a-foundations-public-layout-components.md (sekcja 0).
 * Docelowo nadpisywalne per klient z branding.yaml (P3).
 *
 * Kolory jako RGB channels ("R G B"), NIE hex - zeby Tailwind mogl wstrzykiwac
 * alpha (klasy typu bg-error/5, ring-primary/20). Konsumpcja: rgb(var(--x) / <alpha>).
 */
:root {
  /* --- Kolory: marka --- */
  --primary: 0 51 102;          /* #003366 hospital blue */
  --primary-hover: 0 64 128;    /* #004080 */
  --secondary: 0 102 204;       /* #0066CC */
  --accent: 255 179 0;          /* #FFB300 */

  /* --- Kolory: status --- */
  --success: 46 125 50;         /* #2E7D32 */
  --warning: 237 108 2;         /* #ED6C02 */
  --error: 211 47 47;           /* #D32F2F */
  --info: 2 136 209;            /* #0288D1 */
  --violet: 124 58 237;         /* #7C3AED - badge UI: rola admina / status zaproszony */

  /* --- Kolory: powierzchnie --- */
  --surface: 255 255 255;       /* #FFFFFF */
  --surface-alt: 245 247 250;   /* #F5F7FA */
  --surface-hover: 238 242 247; /* #EEF2F7 */
  --border: 224 228 234;        /* #E0E4EA */
  --border-strong: 196 202 211; /* #C4CAD3 */

  /* --- Kolory: tekst --- */
  --text-primary: 26 31 46;     /* #1A1F2E */
  --text-secondary: 90 99 120;  /* #5A6378 */
  --text-tertiary: 138 148 166; /* #8A94A6 */
  --text-inverse: 255 255 255;  /* #FFFFFF */
  --text-disabled: 176 182 195; /* #B0B6C3 */

  /* --- Promienie --- */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;

  /* --- Cienie --- */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 8px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 12px 24px rgba(0, 0, 0, 0.12);
}

html {
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
body {
  background-color: rgb(var(--surface-alt));
  color: rgb(var(--text-primary));
}

/* Alpine: ukryj elementy z x-cloak do czasu inicjalizacji (eliminuje mignięcie). */
[x-cloak] { display: none !important; }
