/* ==========================================================================
   EAC Design System — tokeny
   Źródło: Claude Design, projekt "EACenter" (_ds/eacenter-78c7d677…/tokens/*.css)
   oraz "EAC Pakiet Elementów". Nie zmieniaj wartości bez zmiany w design systemie.
   ========================================================================== */

/* ---- Fonty (self-hosted, OFL; CSP script/style-src 'self') ---- */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("../fonts/HankenGrotesk-var-latin.c501f578bf3f.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("../fonts/HankenGrotesk-var-latin-ext.20672d217485.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("../fonts/Newsreader-var-latin.175a37868200.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("../fonts/Newsreader-var-latin-ext.b55601316b0e.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 300 700;
  font-display: swap;
  src: url("../fonts/Newsreader-var-italic-latin.a6974fdd8f8b.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 300 700;
  font-display: swap;
  src: url("../fonts/Newsreader-var-italic-latin-ext.31b4686830b2.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  /* ---- Neutrals: ciepły ink na ciepłym papierze ---- */
  --ink-900: #0a0a0a;
  --ink-800: #151515;
  --ink-700: #2b2b2b;
  --ink-500: #5c5c5c;
  --ink-400: #8a8a8a;
  --ink-300: #c9c7c2;
  --ink-200: #ebe8e1;
  --paper: #f4f2ed;
  --paper-2: #ebe8e1;
  --paper-3: #faf9f6;
  --card: #ffffff;
  --white: #ffffff;

  /* ---- Aliasy semantyczne ---- */
  --text-primary: var(--ink-900);
  --text-secondary: var(--ink-500);
  --text-muted: var(--ink-400);
  --text-on-dark: #f4f2ed;
  --text-on-dark-muted: #a8a6a0;

  --surface-page: var(--paper);
  --surface-card: var(--card);
  --surface-dark: var(--ink-900);
  --surface-sunken: var(--paper-2);
  --surface-row-hover: var(--paper-3);

  --border-hairline: var(--ink-300);
  --border-soft: var(--ink-200);
  --border-on-dark: rgba(255, 255, 255, 0.16);
  --border-on-dark-strong: rgba(255, 255, 255, 0.24);
  --surface-on-dark-hover: rgba(255, 255, 255, 0.08);

  --accent: var(--ink-900);
  --accent-on: var(--paper);

  /* ---- Statusy: tekst + kształt + kolor. Kolor nigdy sam. ----
     Pary tła/tekstu spełniają co najmniej 4.5:1 (patrz sekcja 22 pakietu). */
  --status-good-fg: #2f7d4f;
  --status-good-bg: #e8f0e8;
  --status-good-line: #2f7d4f;
  --status-attention-fg: #8a6410;
  --status-attention-bg: #f5ecdc;
  --status-attention-line: #c2802e;
  --status-critical-fg: #a8322f;
  --status-critical-bg: #f6e6e4;
  --status-critical-line: #b23a3a;
  --status-working-fg: #33547c;
  --status-working-bg: #e4eaf2;
  --status-working-line: #3a5f8a;
  --status-neutral-fg: var(--ink-500);
  --status-neutral-bg: var(--paper-2);
  --status-neutral-line: var(--ink-300);

  /* Severity — obramowane znaczniki na liście i w tabeli */
  --severity-critical: #b23a3a;
  --severity-critical-fg: #a8322f;
  --severity-serious: #c2802e;
  --severity-serious-fg: #a06a1c;
  --severity-moderate: var(--ink-500);
  --severity-moderate-fg: var(--ink-500);
  --severity-minor: var(--ink-400);
  --severity-minor-fg: var(--ink-400);

  /* ---- Serie wykresów (czytane z CSS przez eac-charts.js) ---- */
  --chart-1: #0a0a0a;
  --chart-2: #3a5f8a;
  --chart-3: #2f7d4f;
  --chart-4: #c2802e;
  --chart-5: #b23a3a;
  --chart-6: #6b4a30;
  --chart-grid: #ebe8e1;
  --chart-axis: #c9c7c2;
  --chart-label: #8a8a8a;
  --chart-track: #e0d9d0;
  --chart-risk-low: #2f7d4f;
  --chart-risk-moderate: #c2a02e;
  --chart-risk-high: #c2662e;
  --chart-risk-critical: #b23a3a;

  /* ---- Typografia ---- */
  --font-sans: 'Hanken Grotesk', 'Helvetica Neue', Arial, sans-serif;
  --font-serif: 'Newsreader', 'Times New Roman', Georgia, serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --fs-display-xl: 72px;
  --lh-display-xl: 1.02;
  --ls-display-xl: -0.02em;
  --fs-display-lg: 56px;
  --lh-display-lg: 1.04;
  --ls-display-lg: -0.02em;
  --fs-display-md: 40px;
  --lh-display-md: 1.08;
  --ls-display-md: -0.015em;
  --fs-title: 28px;
  --lh-title: 1.15;
  --ls-title: -0.01em;
  --fs-subtitle: 20px;
  --lh-subtitle: 1.3;
  --fs-body-lg: 18px;
  --lh-body-lg: 1.55;
  --fs-body: 16px;
  --lh-body: 1.6;
  --fs-small: 14px;
  --lh-small: 1.5;
  --fs-caption: 12px;
  --lh-caption: 1.4;
  --ls-caption: 0.06em;
  --fs-micro: 11px;

  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  --fs-wordmark: 22px;
  --ls-wordmark: 0.01em;

  /* ---- Spacing: baza 4 px ---- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;

  --page-max: 1200px;
  --gutter: 24px;
  --sidebar-w: 268px;
  --topbar-h: 61px;
  --context-col: 320px;

  /* ---- Promienie, cienie, ruch ---- */
  --radius-pill: 999px;
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 18px;
  --radius-xl: 28px;

  --shadow-card: 0 1px 2px rgba(10, 10, 10, 0.04), 0 8px 24px rgba(10, 10, 10, 0.06);
  --shadow-raised: 0 12px 40px rgba(10, 10, 10, 0.12);
  --shadow-none: none;

  --border-w: 1px;

  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-inout: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 140ms;
  --dur: 240ms;
  --dur-slow: 520ms;

  /* ---- Fokus: jeden pierścień, czytelny również na czerni ---- */
  --focus-color: #3a5f8a;
  --focus-color-on-dark: #c2d4ea;
  --focus-width: 3px;
  --focus-offset: 2px;

  /* Minimalny cel dotykowy (WCAG 2.2 SC 2.5.8 / 44 px na mobile) */
  --touch-min: 24px;
  --touch-mobile: 44px;
}