/* GENERATO da tools/design-tokens/generate.ts — non modificare a mano.
 * Sorgente: tools/design-tokens/source.ts. Rigenera con `pnpm tokens`.
 * I valori al passo 500 vengono dal manuale del brand e non si toccano (ADR-0018). */
:root {
  /* --- primitivi: mappano 1:1 sulle Variable Collections di Figma --- */
  --bnb-neutral-50: #fafafa;
  --bnb-neutral-100: #f3f4f4;
  --bnb-neutral-200: #e4e6e7;
  --bnb-neutral-300: #c9cdcf;
  --bnb-neutral-400: #899397;
  --bnb-neutral-500: #6c757b;
  --bnb-neutral-600: #4c565c;
  --bnb-neutral-700: #3c4449;
  --bnb-neutral-800: #2b3236;
  --bnb-neutral-900: #1b2022;
  --bnb-magenta-100: #fce4ec;
  --bnb-magenta-200: #f8c4d7;
  --bnb-magenta-500: #e83c7b;
  --bnb-magenta-600: #df1a62;
  --bnb-magenta-700: #a8144a;
  --bnb-teal-100: #e9f6f7;
  --bnb-teal-200: #ceeced;
  --bnb-teal-500: #84ced2;
  --bnb-teal-600: #307e82;
  --bnb-teal-700: #245e61;
  --bnb-blue-100: #e4effc;
  --bnb-blue-200: #c4ddf8;
  --bnb-blue-700: #114c8b;
  --bnb-blue-800: #0b3058;
  --bnb-green-100: #ebf4ef;
  --bnb-green-600: #247d4a;
  --bnb-amber-100: #f7f2e9;
  --bnb-amber-600: #97650d;
  --bnb-red-100: #f6ebea;
  --bnb-red-600: #ca3124;
  --bnb-teal-900: #1e3233;
  --bnb-green-900: #1c3527;
  --bnb-amber-900: #3c2e16;
  --bnb-red-900: #381c19;
  --bnb-green-200: #31ac66;
  --bnb-amber-200: #cd8912;
  --bnb-red-200: #e16257;
  --bnb-teal-800: #225a5d;
  --bnb-green-700: #1b5d37;
  --bnb-amber-700: #6f4a0a;
  --bnb-red-700: #96241b;
  --bnb-magenta-400: #ea4984;

  /* --- semantici: l'unico livello che i *.module.css possono usare.
   * Qui c'è il TEMA STANDARD: un documento senza data-theme deve avere una palette
   * completa, e dev'essere quella, non una quarta mappa che nessuno guarda. --- */
  --bnb-color-surface: var(--bnb-neutral-50);
  --bnb-color-surface-hover: var(--bnb-magenta-100);
  --bnb-color-text: var(--bnb-neutral-800);
  --bnb-color-text-muted: var(--bnb-neutral-500);
  --bnb-color-surface-muted: var(--bnb-blue-200);
  --bnb-color-line: var(--bnb-magenta-500);
  --bnb-color-border-strong: var(--bnb-neutral-400);
  --bnb-color-action: var(--bnb-magenta-600);
  --bnb-color-action-hover: var(--bnb-magenta-700);
  --bnb-color-action-surface: var(--bnb-magenta-600);
  --bnb-color-action-text: #ffffff;
  --bnb-color-selected: var(--bnb-magenta-600);
  --bnb-color-selected-surface: #ffffff;
  --bnb-color-selected-text: var(--bnb-magenta-600);
  --bnb-color-focus: var(--bnb-magenta-700);
  --bnb-color-navbar-surface: var(--bnb-magenta-600);
  --bnb-color-navbar-text: #ffffff;
  --bnb-color-navbar-mark: #ffffff;
  --bnb-color-mark: var(--bnb-magenta-600);
  --bnb-color-info-surface: var(--bnb-teal-100);
  --bnb-color-info-text: var(--bnb-teal-700);
  --bnb-color-success-surface: var(--bnb-green-100);
  --bnb-color-success-text: var(--bnb-green-600);
  --bnb-color-warning-surface: var(--bnb-amber-100);
  --bnb-color-warning-text: var(--bnb-amber-600);
  --bnb-color-danger-surface: var(--bnb-red-100);
  --bnb-color-danger-text: var(--bnb-red-600);

  /* --- scale a un livello --- */
  --bnb-space-1: 0.25rem;
  --bnb-space-2: 0.5rem;
  --bnb-space-3: 0.75rem;
  --bnb-space-4: 1rem;
  --bnb-space-5: 1.5rem;
  --bnb-space-6: 2rem;
  --bnb-space-7: 3rem;
  --bnb-space-8: 4rem;
  --bnb-radius-1: 0.125rem;
  --bnb-radius-2: 0.25rem;
  --bnb-radius-3: 0.5rem;
  --bnb-radius-full: 9999px;
  --bnb-font-size-1: 0.75rem;
  --bnb-font-size-2: 0.875rem;
  --bnb-font-size-3: 1rem;
  --bnb-font-size-4: 1.125rem;
  --bnb-font-size-5: 1.375rem;
  --bnb-font-size-6: 1.75rem;
  --bnb-font-size-7: 2.25rem;
  --bnb-line-height-tight: 1.25;
  --bnb-line-height-normal: 1.5;
  --bnb-line-height-loose: 1.75;
  --bnb-font-weight-regular: 400;
  --bnb-font-weight-bold: 700;
  --bnb-border-width-1: 1px;
  --bnb-border-width-2: 2px;
  --bnb-measure-1: 40rem;
  --bnb-measure-sidebar: 14rem;
  --bnb-measure-pane: 26rem;
  --bnb-font-heading: "Outfit", "Montserrat", system-ui, sans-serif;
  --bnb-font-body: "Montserrat", system-ui, sans-serif;
  --bnb-shadow-1: 0 1px 2px rgb(27 32 34 / 0.08);
  --bnb-shadow-2: 0 4px 12px rgb(27 32 34 / 0.12);

  /* --- densità: i valori COMODI sono il default (spec §A.1) --- */
  --bnb-control-min-height: 2.75rem;
  --bnb-control-padding-block: 0.5rem;
  --bnb-control-padding-inline: 0.75rem;
  --bnb-control-font-size: 1rem;
  --bnb-control-box-size: 1.25rem;
  --bnb-control-switch-width: 2.75rem;
  --bnb-control-gap: 0.25rem;
  --bnb-control-spacing: 1rem;
  --bnb-box-padding: 1rem;
}

[data-theme="standard"] {
  --bnb-color-surface: var(--bnb-neutral-50);
  --bnb-color-surface-hover: var(--bnb-magenta-100);
  --bnb-color-text: var(--bnb-neutral-800);
  --bnb-color-text-muted: var(--bnb-neutral-500);
  --bnb-color-surface-muted: var(--bnb-blue-200);
  --bnb-color-line: var(--bnb-magenta-500);
  --bnb-color-border-strong: var(--bnb-neutral-400);
  --bnb-color-action: var(--bnb-magenta-600);
  --bnb-color-action-hover: var(--bnb-magenta-700);
  --bnb-color-action-surface: var(--bnb-magenta-600);
  --bnb-color-action-text: #ffffff;
  --bnb-color-selected: var(--bnb-magenta-600);
  --bnb-color-selected-surface: #ffffff;
  --bnb-color-selected-text: var(--bnb-magenta-600);
  --bnb-color-focus: var(--bnb-magenta-700);
  --bnb-color-navbar-surface: var(--bnb-magenta-600);
  --bnb-color-navbar-text: #ffffff;
  --bnb-color-navbar-mark: #ffffff;
  --bnb-color-mark: var(--bnb-magenta-600);
  --bnb-color-info-surface: var(--bnb-teal-100);
  --bnb-color-info-text: var(--bnb-teal-700);
  --bnb-color-success-surface: var(--bnb-green-100);
  --bnb-color-success-text: var(--bnb-green-600);
  --bnb-color-warning-surface: var(--bnb-amber-100);
  --bnb-color-warning-text: var(--bnb-amber-600);
  --bnb-color-danger-surface: var(--bnb-red-100);
  --bnb-color-danger-text: var(--bnb-red-600);
}

[data-theme="high-contrast"] {
  --bnb-color-surface: var(--bnb-neutral-50);
  --bnb-color-surface-hover: var(--bnb-magenta-100);
  --bnb-color-text: var(--bnb-neutral-900);
  --bnb-color-text-muted: var(--bnb-neutral-600);
  --bnb-color-surface-muted: var(--bnb-magenta-200);
  --bnb-color-line: var(--bnb-magenta-600);
  --bnb-color-border-strong: var(--bnb-neutral-600);
  --bnb-color-action: var(--bnb-blue-800);
  --bnb-color-action-hover: var(--bnb-blue-700);
  --bnb-color-action-surface: var(--bnb-blue-800);
  --bnb-color-action-text: #ffffff;
  --bnb-color-selected: var(--bnb-blue-800);
  --bnb-color-selected-surface: #ffffff;
  --bnb-color-selected-text: var(--bnb-blue-800);
  --bnb-color-focus: var(--bnb-magenta-700);
  --bnb-color-navbar-surface: var(--bnb-magenta-100);
  --bnb-color-navbar-text: var(--bnb-neutral-900);
  --bnb-color-navbar-mark: var(--bnb-magenta-700);
  --bnb-color-mark: var(--bnb-blue-800);
  --bnb-color-info-surface: var(--bnb-teal-100);
  --bnb-color-info-text: var(--bnb-teal-800);
  --bnb-color-success-surface: var(--bnb-green-100);
  --bnb-color-success-text: var(--bnb-green-700);
  --bnb-color-warning-surface: var(--bnb-amber-100);
  --bnb-color-warning-text: var(--bnb-amber-700);
  --bnb-color-danger-surface: var(--bnb-red-100);
  --bnb-color-danger-text: var(--bnb-red-700);
}

[data-theme="dark"] {
  --bnb-color-surface: var(--bnb-neutral-900);
  --bnb-color-surface-hover: var(--bnb-neutral-700);
  --bnb-color-text: var(--bnb-neutral-50);
  --bnb-color-text-muted: var(--bnb-neutral-300);
  --bnb-color-surface-muted: var(--bnb-neutral-700);
  --bnb-color-line: var(--bnb-neutral-500);
  --bnb-color-border-strong: var(--bnb-neutral-400);
  --bnb-color-action: var(--bnb-magenta-400);
  --bnb-color-action-hover: var(--bnb-magenta-500);
  --bnb-color-action-surface: var(--bnb-neutral-900);
  --bnb-color-action-text: var(--bnb-magenta-400);
  --bnb-color-selected: var(--bnb-magenta-400);
  --bnb-color-selected-surface: var(--bnb-neutral-900);
  --bnb-color-selected-text: var(--bnb-magenta-400);
  --bnb-color-focus: var(--bnb-magenta-400);
  --bnb-color-navbar-surface: var(--bnb-neutral-700);
  --bnb-color-navbar-text: var(--bnb-neutral-50);
  --bnb-color-navbar-mark: var(--bnb-neutral-50);
  --bnb-color-mark: var(--bnb-neutral-50);
  --bnb-color-info-surface: var(--bnb-teal-900);
  --bnb-color-info-text: var(--bnb-teal-200);
  --bnb-color-success-surface: var(--bnb-green-900);
  --bnb-color-success-text: var(--bnb-green-200);
  --bnb-color-warning-surface: var(--bnb-amber-900);
  --bnb-color-warning-text: var(--bnb-amber-200);
  --bnb-color-danger-surface: var(--bnb-red-900);
  --bnb-color-danger-text: var(--bnb-red-200);
}

[data-density="compact"] {
  --bnb-control-min-height: 2rem;
  --bnb-control-padding-block: 0.25rem;
  --bnb-control-padding-inline: 0.5rem;
  --bnb-control-font-size: 0.875rem;
  --bnb-control-box-size: 1rem;
  --bnb-control-switch-width: 2.25rem;
  --bnb-control-gap: 0.25rem;
  --bnb-control-spacing: 0.75rem;
  --bnb-box-padding: 0.75rem;
}
body.dark-mode {
  --bnb-color-surface: var(--bnb-neutral-900);
  --bnb-color-surface-hover: var(--bnb-neutral-700);
  --bnb-color-text: var(--bnb-neutral-50);
  --bnb-color-text-muted: var(--bnb-neutral-300);
  --bnb-color-surface-muted: var(--bnb-neutral-700);
  --bnb-color-line: var(--bnb-neutral-500);
  --bnb-color-border-strong: var(--bnb-neutral-400);
  --bnb-color-action: var(--bnb-magenta-400);
  --bnb-color-action-hover: var(--bnb-magenta-500);
  --bnb-color-action-surface: var(--bnb-neutral-900);
  --bnb-color-action-text: var(--bnb-magenta-400);
  --bnb-color-selected: var(--bnb-magenta-400);
  --bnb-color-selected-surface: var(--bnb-neutral-900);
  --bnb-color-selected-text: var(--bnb-magenta-400);
  --bnb-color-focus: var(--bnb-magenta-400);
  --bnb-color-navbar-surface: var(--bnb-neutral-700);
  --bnb-color-navbar-text: var(--bnb-neutral-50);
  --bnb-color-navbar-mark: var(--bnb-neutral-50);
  --bnb-color-mark: var(--bnb-neutral-50);
  --bnb-color-info-surface: var(--bnb-teal-900);
  --bnb-color-info-text: var(--bnb-teal-200);
  --bnb-color-success-surface: var(--bnb-green-900);
  --bnb-color-success-text: var(--bnb-green-200);
  --bnb-color-warning-surface: var(--bnb-amber-900);
  --bnb-color-warning-text: var(--bnb-amber-200);
  --bnb-color-danger-surface: var(--bnb-red-900);
  --bnb-color-danger-text: var(--bnb-red-200);
}

/* --- ponte: le variabili di Scalar prendono i valori dai token del design system --- */
body.light-mode,
body.dark-mode {
  --scalar-background-1: var(--bnb-color-surface);
  /* --scalar-background-2/-3 NON SI DICHIARANO, ed è una decisione, non una dimenticanza
   * (revisione del 2026-08-19, seconda passata — dual-theme-report.md). Il foglio di fabbrica di
   * Scalar (style.css 1.65.1, righe 210-232) le dichiara già da solo, neutre e già commutanti:
   * .light-mode { --scalar-background-2: #f6f6f6; --scalar-background-3: #e7e7e7 },
   * .dark-mode { --scalar-background-2: #1a1a1a; --scalar-background-3: #272727 }. La prima
   * versione del ponte le sovrascriveva con un primitivo grezzo UNICO per i due temi — la pagina
   * scura ereditava il fondo del blocco di codice, delle intestazioni di tabella e di 89
   * dichiarazioni di style.css dal tema chiaro: 1,06:1 di contrasto testo-su-blocco, illeggibile.
   * Il design system non ha (e qui non gliene si inventa uno) un ruolo di superficie neutra
   * rialzata che non sia già coperto meglio dal default di Scalar: NON dichiarare è la correzione,
   * non un buco. Vale anche per --scalar-sidebar-search-background più sotto, che il foglio di
   * fabbrica alias già a --scalar-background-2.
   *
   * CONSEGUENZA ACCETTATA, non un difetto (annotata alla terza revisione, 2026-08-19 sera):
   * l'elevazione in scuro si inverte. --scalar-background-1 resta nostro (--bnb-neutral-900,
   * #1b2022), mentre -2/-3 restano di fabbrica (#1a1a1a, #272727) — e #1a1a1a è più scuro di
   * #1b2022, non più chiaro. Blocchi di codice e intestazioni di tabella, in scuro, stanno quindi
   * un gradino SOTTO la pagina invece che sopra: il contrasto testo-su-blocco resta ottimo
   * (misurato: 16,67:1 per un'intestazione, 10,87:1 per il testo del codice — dual-theme-report.md),
   * ma il segnale "superficie rialzata" che l'elevazione normalmente porta si perde. Non si
   * corregge qui: sistemarlo vorrebbe dire tornare a dichiarare -2/-3, cioè il difetto da cui
   * questa decisione è partita. */
  --scalar-background-accent: var(--bnb-color-surface-hover);
  --scalar-color-1: var(--bnb-color-text);
  --scalar-color-2: var(--bnb-color-text-muted);
  /* text-muted, non un primitivo (corretto nella stessa revisione): commuta (neutral-500 nello
   * standard, neutral-300 nello scuro) ed è testo neutro secondario — lo stesso ruolo che
   * --scalar-color-3 gioca nel foglio di fabbrica (etichette secondarie, testo del campo di
   * ricerca). Il costo, accettato e non ignorato: -color-2 e -color-3 diventano lo stesso
   * colore, quindi un commento del codice (di solito reso con -color-3) diventa indistinguibile
   * dal codice stesso (-color-2). In cambio si chiude una violazione di contrasto: text-muted nel
   * tema standard è derivato per stare a 4,503:1 contro surface, mentre --scalar-color-3 DI
   * FABBRICA (#8e8e8e) misura 3,139:1 sul nostro fondo chiaro (3,276:1 sul proprio bianco di
   * fabbrica) — entrambi sotto AA. NOTA CORRETTA (revisione successiva): la versione precedente
   * di QUESTO ponte, che puntava --scalar-color-3 a var(--bnb-neutral-400), misurava 3,01:1 — un
   * numero vicino ma non lo stesso, e non di fabbrica: era il difetto che questa riga risolve, non
   * la controparte con cui si confronta. */
  --scalar-color-3: var(--bnb-color-text-muted);
  --scalar-color-accent: var(--bnb-color-action);
  /* "line" e non un primitivo: è la stessa cornice decorativa che delimita un riquadro
   * (tools/design-tokens/themes.ts, commento su "line"), ed è il ruolo che Scalar dà a QUESTA
   * variabile ovunque nel suo foglio — bordi di pannelli e divisori, non un controllo. Commuta:
   * magenta-500 nel tema standard, neutral-500 nello scuro. */
  --scalar-border-color: var(--bnb-color-line);

  --scalar-color-green: var(--bnb-color-success-text);
  --scalar-color-red: var(--bnb-color-danger-text);
  --scalar-color-yellow: var(--bnb-color-warning-text);
  --scalar-color-orange: var(--bnb-color-warning-text);
  --scalar-color-blue: var(--bnb-color-info-text);
  --scalar-color-purple: var(--bnb-color-mark);

  --scalar-link-color: var(--bnb-color-action);
  --scalar-link-color-hover: var(--bnb-color-action-hover);
  /* DEBITO NOTO (Important 3, revisione del 2026-08-19): action-surface è, DI PROPOSITO, il fondo
   * della pagina nel tema scuro (themes.ts riga ~434, "CONTORNATO, non pieno" — il bottone perde
   * il riempimento e resta un'etichetta rosa col bordo). Il design system dà per scontato che chi
   * consuma questo semantico disegni anche il bordo (action) intorno al fondo; .bg-b-btn di Scalar
   * imposta SOLO background-color, senza alcuna variabile per il bordo del bottone primario
   * (verificato su style.css 1.65.1: nessun --scalar-button-1-border). Il risultato in scuro è un
   * bottone senza forma. Non si corregge scambiando action-surface con action qui: fingerebbe un
   * riempimento pieno che il design system ha deliberatamente escluso per quel tema, una decisione
   * di prodotto e non un difetto di questo ponte. */
  --scalar-button-1: var(--bnb-color-action-surface);
  --scalar-button-1-hover: var(--bnb-color-action-hover);
  --scalar-button-1-color: var(--bnb-color-action-text);

  --scalar-font: var(--bnb-font-body);
  --scalar-bold: var(--bnb-font-weight-bold);
  --scalar-regular: var(--bnb-font-weight-regular);
  --scalar-radius: var(--bnb-radius-2);

  --scalar-sidebar-background-1: var(--bnb-color-surface);
  --scalar-sidebar-color-1: var(--bnb-color-text);
  --scalar-sidebar-color-2: var(--bnb-color-text-muted);
  /* Stesso "line" di --scalar-border-color qui sopra: nel foglio di fabbrica di Scalar
   * (style.css 1.65.1) --sidebar-border-color e --sidebar-search-border-color sono ALIASATE a
   * --border-color (var(--scalar-border-color)), non un ruolo diverso — il bordo del riquadro di
   * ricerca è lo stesso divisorio, non un bordo di controllo. */
  --scalar-sidebar-border-color: var(--bnb-color-line);
  --scalar-sidebar-item-hover-background: var(--bnb-color-surface-hover);
  --scalar-sidebar-item-active-background: var(--bnb-color-surface-hover);
  --scalar-sidebar-color-active: var(--bnb-color-selected-text);
  /* --scalar-sidebar-search-background NON SI DICHIARA, stessa decisione di --scalar-background-2
   * qui sopra: nel foglio di fabbrica è letteralmente var(--scalar-background-2), quindi lasciata
   * indefinita eredita da lì e commuta da sola. */
  --scalar-sidebar-search-border-color: var(--bnb-color-line);
}