/* =====================================================================
 * OXQ Core — Design System Tokens (Oxequa)
 * =====================================================================
 * Allineato al design system del PIM (reference/pim-white-label-main),
 * con i valori canonici del brand Oxequa.
 * 3 livelli: Primitive → Semantic → Component.
 *
 * Caricato via <link> PRIMA del CSS Tailwind compilato, così che le
 * utility mappate in styles.css (@theme inline) risolvano var(--ds-*).
 *
 * Brand Oxequa (verificato su InstanceConfig del PIM):
 *   - font   = "Inter" (variabile, self-hosted, theme/static/fonts/inter/)
 *   - primary = #000000  (nero)          → scala neutra/nera
 *   - accent  = #FF224C  (Sizzling Red)  → scala rossa
 *   - stato   = palette "semaforo" fissa (green/amber/red/blue standard)
 * NB: il font "Locator" e le scale blu sono del white-label ASA Dental,
 *     NON Oxequa → non usati qui. Core è mono-brand (no engine OKLCH).
 * ===================================================================== */

/* ---------------------------------------------------------------------
 * Font self-hosted — Inter variabile (theme/static/fonts/inter/).
 * Sans da UI: più leggibile ai piccoli formati / colonne numeriche di Poppins.
 * Un solo file variabile copre tutti i pesi (100–900).
 * Path relativo a questo file (static/oxq_ds/) → ../fonts/inter/.
 * collectstatic (ManifestStorage) riscrive gli url() in nomi hashati.
 * (I .ttf Poppins restano in ../fonts/poppins/ ma non sono più referenziati.)
 * ------------------------------------------------------------------- */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/inter/inter-variable-latin.260c81a4759b.woff2") format("woff2");
}

:root {

  /* ============================================================
   * 0. VERSIONE DEL DESIGN SYSTEM
   * ============================================================
   * Semver del DS (R9.1). Ogni modifica ai token richiede una voce in
   * docs/ds/CHANGELOG.md con la stessa stringa di versione, e la voce deve
   * dichiarare i 4 campi: cosa cambia · perché · dove va propagato · cosa si
   * rompe se non lo fai. Il test `test_versione_ds_nel_changelog` lo verifica.
   * Prerelease `-onda0` = migrazione a v2 in corso (vedi docs/ds/06-roadmap.md).
   * ============================================================ */
  --ds-version: "2.0.0";

  /* ============================================================
   * 1. PRIMITIVES
   * ============================================================ */

  /* La scala `primary` è stata RIMOSSA in Onda 2 (D-01): era l'inchiostro del brand
     con un secondo nome (primary-500 #1a1a1a = neutral-900). I 93 usi sono migrati a
     `neutral`. L'identità non abita nell'inchiostro ma in tipografia, ritmo, marchi. */

  /* La scala `accent` è stata RIMOSSA in Onda 1 (D-15): era una copia
     byte-per-byte di `red-*` in tutti e 10 i gradini — la stessa scala dichiarata
     due volte e proiettata due volte in Tailwind (`accent-*` **e** `error-*`), cioè
     20 famiglie di utility per un solo hue. La separazione brand/critical è
     **semantica**, non di valore, e vive nell'elenco identitario qui sotto.
     Tutti i 16 riferimenti sono passati a `red-*`, a valore identico. */

  /* Neutral = LA scala grigia del sistema, unica (Onda 1, D-13/G1.2).
   *
   * Prima ne esistevano DUE, con numerazione e temperatura diverse: questa (grigi
   * freddi: #6f797f, #4b575f, #000b13, 11 gradini, 37 riferimenti) e quella dichiarata
   * a mano in styles.css (grigi puri: #737373, #5C5C5C, #000000, 15 gradini,
   * **1.581 usi**). Due numerazioni per la stessa scala erano la causa diretta di
   * `bg-neutral-05` e `border-neutral-8`, classi che non coloravano nulla.
   *
   * Sopravvive la scala **pura**, perché è quella che il prodotto usa davvero e perché
   * è la temperatura del riferimento. I valori sono quelli, 1:1 → per i 1.581 usi nei
   * template il cambiamento è **zero**: cambia solo il nome del gradino. I 37
   * riferimenti freddi si rimappano al gradino più vicino: è l'unico delta visivo di
   * questo passo, e vale per il chrome (bordi, testo secondario, canvas), non per i dati.
   *
   * Numerazione per chiarezza (50 = più chiaro → 1000 = nero), con i mezzi gradini
   * dove il prodotto li usava davvero (150, 750). */
  --ds-neutral-0:    #ffffff;
  --ds-neutral-25:   #fafafa;   /* canvas di pagina (era #f7f7f7) */
  --ds-neutral-50:   #f5f5f5;   /* superficie tenue */
  --ds-neutral-100:  #eeeeee;
  --ds-neutral-150:  #e5e5e5;   /* bordo di default (era #e8e9ea) */
  --ds-neutral-200:  #d4d4d4;
  --ds-neutral-300:  #c4c4c4;   /* bordo forte (era #b7bcbf) */
  --ds-neutral-400:  #a3a3a3;
  --ds-neutral-500:  #8a8a8a;   /* bordo dei controlli (era #81898f) */
  --ds-neutral-600:  #737373;
  --ds-neutral-700:  #5c5c5c;   /* testo secondario e placeholder (era #4b575f) */
  --ds-neutral-750:  #454545;
  --ds-neutral-800:  #2e2e2e;
  --ds-neutral-900:  #1a1a1a;   /* L'INCHIOSTRO (era #000b13 — D-12) */
  --ds-neutral-950:  #0d0d0d;
  --ds-neutral-1000: #000000;

  /* Status — palette "semaforo" fissa, brand-independent (standard) */
  --ds-green-50:  #f0fdf4;
  --ds-green-100: #dcfce7;
  --ds-green-300: #86efac;  /* success-300 */
  --ds-green-500: #22c55e;
  --ds-green-700: #15803d;
  --ds-green-800: #166534;

  --ds-amber-50:  #fffbeb;
  --ds-amber-100: #fef3c7;
  --ds-amber-200: #fde68a;  /* fill chiaro «da fatturare» (TOK-01) — on-scale */
  --ds-amber-300: #fcd34d;
  --ds-amber-500: #f59e0b;
  --ds-amber-700: #b45309;
  --ds-amber-800: #92400e;

  /* Semaforo "errore" = rosso Oxequa (stesso hue dell'accent, non un rosso
     estraneo). Gli step 600/700 sono accessibili su bianco — #e0163d ~4.8:1,
     #b8102f ~6.6:1 — per testo/valori piccoli; il 500 (#ff224c) resta per
     fill/bordi/testo grande. Il 600 prima mancava (--color-error-600 rotto). */
  --ds-red-50:  #fff1f3;
  --ds-red-100: #ffd6dc;
  --ds-red-200: #ffa3b3;   /* tinta del bordo di errore (border-error-200, ds.css:1908) */
  --ds-red-500: #ff224c;
  --ds-red-600: #e0163d;
  --ds-red-700: #b8102f;
  --ds-red-800: #8a0c23;

  --ds-blue-50:  #eff6ff;
  --ds-blue-100: #dbeafe;
  --ds-blue-300: #93c5fd;  /* info-300 */
  --ds-blue-500: #3b82f6;
  --ds-blue-700: #1d4ed8;
  --ds-blue-800: #1e40af;

  /* Il bianco è il gradino 0 della scala grigia, non un valore a sé (Onda 1). */
  --ds-white: var(--ds-neutral-0);

  /* Spacing (px) — base grid 4px */
  --ds-space-xxs: 4px;
  --ds-space-2xs: 6px;
  --ds-space-xs:  8px;
  --ds-space-sm:  12px;
  --ds-space-md:  16px;
  /* TOK-03: rimossi i mezzi-passi off-grid --ds-space-s(10) e -m(14) → scala
     8/12/16 sulla griglia 4px (Polaris). Usi migrati a xs(8)/sm(12) in ds.css. */
  --ds-space-lg:  24px;
  --ds-space-xl:  32px;
  --ds-space-2xl: 48px;

  /* Radius — UNA scala, numerica (G1.3). Onda 2: i gradini transitori 050(2px) e
     150(6px) sono stati rimossi dopo l'allineamento dei 31 usi. Restano 3 valori:
     100(4) · 200(8) · 300(12) + full. Numerazione = Polaris. */
  --ds-radius-100:  4px;
  --ds-radius-200:  8px;
  --ds-radius-300:  12px;
  --ds-radius-full: 9999px;

  /* Elevazione — UNA scala (Onda 1). Prima: 2 token DS + 6 ombre Tailwind + 11
     box-shadow letterali in ds.css. Qui i 4 livelli che il prodotto usa davvero,
     coi valori attuali. */
  --ds-shadow-100:  0 1px 2px rgba(0, 0, 0, .05);                                    /* superficie sollevata */
  --ds-shadow-200:  0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1);   /* menu, dropdown */
  --ds-shadow-300:  0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1); /* modale */
  --ds-shadow-400:  0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1);

  /* Chart — 4 serie, 7 gradini. Sono i **default** statici: a runtime
     `chart_colors_processor` sovrascrive `--color-chart-*` con i valori di
     `Configurazione`, quindi questi si vedono solo se quell'iniezione manca.
     Onda 1: erano letterali in styles.css e **non corrispondevano ai default reali**
     (dichiaravano viola e violetto dove il modello dice indaco e teal) — un file che
     dichiarava colori che nessuno vede mai. Rigenerati con la stessa
     `core/utils/colors.py:generate_palette()` che usa il runtime, dai default del
     modello: statico e default ora coincidono. */
  --ds-chart-preventivi-50:  #F6F6FE;
  --ds-chart-preventivi-100: #EDECFC;
  --ds-chart-preventivi-300: #B9B5F5;
  --ds-chart-preventivi-400: #8D87EE;
  --ds-chart-preventivi-500: #4F46E5;   /* indaco — default di Configurazione */
  --ds-chart-preventivi-600: #433CC3;
  --ds-chart-preventivi-700: #3731A0;

  --ds-chart-progetti-50:  #F3FAF9;
  --ds-chart-progetti-100: #E7F4F3;
  --ds-chart-progetti-300: #9ED4CF;
  --ds-chart-progetti-400: #62B9B2;
  --ds-chart-progetti-500: #0D9488;     /* teal */
  --ds-chart-progetti-600: #0B7E74;
  --ds-chart-progetti-700: #09685F;

  --ds-chart-consuntivo-50:  #F5F9FF;
  --ds-chart-consuntivo-100: #EBF2FE;
  --ds-chart-consuntivo-300: #B1CDFB;
  --ds-chart-consuntivo-400: #80AEF9;
  --ds-chart-consuntivo-500: #3B82F6;   /* blu */
  --ds-chart-consuntivo-600: #326ED1;
  --ds-chart-consuntivo-700: #295BAC;

  --ds-chart-costi-50:  #FFF4F6;
  --ds-chart-costi-100: #FFE9ED;
  --ds-chart-costi-300: #FFA7B7;
  --ds-chart-costi-400: #FF6F8B;
  --ds-chart-costi-500: #FF224C;        /* rosso Oxequa — riservato ai costi */
  --ds-chart-costi-600: #D91D41;
  --ds-chart-costi-700: #B21835;

  /* Font sizes (px) */
  --ds-font-h1:      30px;
  --ds-font-h2:      24px;
  --ds-font-h3:      20px;
  --ds-font-h4:      18px;
  --ds-font-body:    16px;
  --ds-font-body-sm: 14px;
  --ds-font-caption: 13px;
  --ds-font-xs:      12px;

  /* Font family — Inter variabile (self-hosted, vedi @font-face in testa al file).
     Stack di fallback ridotto a 6 voci (D-31/D-31a): fuori **Roboto** (serve Android e
     ChromeOS, che non sono nostre piattaforme: CORE è desktop-only, D-04) e
     **"Helvetica Neue"** (macOS legacy, già coperto da -apple-system). Il riferimento
     tiene entrambi, più un `'San Francisco'` che su macOS moderno è una voce morta:
     copiarlo alla lettera avrebbe importato un no-op. Divergenza dichiarata.
     NB: il fallback si vede solo durante lo swap di un woff2 da 48 KB → è igiene,
     non un guadagno percepibile di leggibilità (quello viene dai pesi, D-31). */
  --ds-font-family: "Inter", -apple-system, BlinkMacSystemFont,
                    "Segoe UI", Arial, sans-serif;

  /* Pesi ottici di Inter (Onda 2, D-29/D-31). A 13-14px un «regular» leggermente più
     pesante (450 invece di 400) regge meglio la leggibilità — è la scelta del
     riferimento, resa possibile dal fatto che Inter qui è **variabile** (100-900),
     quindi i pesi intermedi sono reali. Rimappano i 576 usi di font-medium/semibold/
     bold senza toccarne uno: la scala si sposta sotto i nomi. */
  --ds-font-weight-regular:  450;
  --ds-font-weight-medium:   550;
  --ds-font-weight-semibold: 650;
  --ds-font-weight-bold:     700;

  /* Line heights — RAPPORTI (per testo che va a capo, scala col font-size) */
  --ds-lh-tight:   1.2;
  --ds-lh-snug:    1.3;
  --ds-lh-normal:  1.4;

  /* Line heights — SCALA PX (D-29: interlinea calcolabile, modello Polaris).
     Accoppiata per RUOLO al font-size: 30/40 titolo · 24/32 KPI · 20/24 sezione ·
     13/20 tabella+form · 12/16 etichetta. Ogni step è aggiunto col suo consumatore
     (TOK-02, riconciliazione per-ruolo) → niente token morti. */
  --ds-lh-20:  20px;
  --ds-lh-24:  24px;
  --ds-lh-40:  40px;

  /* ============================================================
   * 2. SEMANTIC
   * ============================================================ */

  /* ── IDENTITÀ OXEQUA — elenco chiuso (R2.1). Cambiare queste voci cambia il tema;
        nessun componente deve referenziarle direttamente: passano dai semantici. ──
        1. brand-accent   il rosso #FF224C, ammesso in 3 soli ruoli (R2.3):
                          brand-line · logo · chevron » dei titoli di sezione
        2. brand-ink      l'inchiostro: È il gradino scuro della scala neutra, non un
                          secondo nero (D-01/D-12)
        3. brand-font-ui  Inter, per lo schermo
        4. brand-font-doc Poppins, per i documenti commerciali (PDF/Word) — C-06
        5. brand-mark-size lo spessore del filo di brand
        NB: in Onda 2 l'interattività passa al blu e questo rosso resta ai soli 3 ruoli. */
  --ds-brand-accent:        var(--ds-red-500);         /* #ff224c — i 3 ruoli brand */
  --ds-brand-ink:           var(--ds-neutral-900);     /* #1a1a1a */
  --ds-brand-mark-size:     3px;

  /* Brand (semantici che ne derivano) */
  --ds-color-primary:         var(--ds-brand-ink);
  --ds-color-primary-hover:   var(--ds-neutral-950);
  --ds-color-accent:          var(--ds-brand-accent);

  /* Status */
  --ds-color-success: var(--ds-green-500);
  --ds-color-warning: var(--ds-amber-500);
  --ds-color-error:   var(--ds-red-500);               /* #ff224c — rosso Oxequa (stato/distruttivo) */
  --ds-color-info:    var(--ds-blue-500);              /* #3b82f6 (blu fisso) */

  /* Ruolo "testo/icona su superficie chiara" (audit E1). Gli step 500 NON sono
     accessibili come TESTO (<4.5:1): error-500 #ff224c = 3.76:1. Questi step scuri
     sì: red-700 #b8102f = 6.66:1, green-700 #15803d, amber-700 #b45309. Il 500
     resta per fill/bordo (≥3:1, 1.4.11). Usare *-text per colore-testo e colore-icona. */
  --ds-color-error-text:   var(--ds-red-700);
  --ds-color-success-text: var(--ds-green-700);
  --ds-color-warning-text: var(--ds-amber-700);

  /* ===== data-* : il vocabolario del DATO (R6.1/R6.3, Onda 4) ==============
     Famiglia SEPARATA dai token di interfaccia (`info`, `error`…): un valore non
     riceve mai il colore da un token UI. Con l'interazione al blu (D-10), il blu
     su un DATO deve avere una sorgente propria, distinta da quella dei link/focus.
     Vocabolario del dato CHIUSO a 11 stati (R6.2): negativo · positivo · neutro ·
     sotto-obiettivo · sopra-obiettivo · upside · stimato · consuntivo · bloccato ·
     parziale · assente — più le CATEGORIE di dominio (es. fatturabilità).
     ONDA 4 · FETTA BLU: qui popoliamo solo ciò che usa il BLU, con gli STESSI
     valori di prima (blue-*) → nome diverso, zero cambiamento visivo. Gli stati
     rosso/verde/ambra restano instradati dai filtri fascia_* e sign_class fino alla
     wave Onda 4 piena. Restano fuori (deferiti) altri blu-dato non ancora
     tokenizzati: piano «in lavorazione», stato-fascia della barra fatturabilità.
     ------------------------------------------------------------------------- */
  --ds-data-billable:        var(--ds-blue-700);  /* categoria «fatturabile» — testo/enfasi (pari ai segmenti blu della .ds-fattbar) */
  --ds-data-billable-fill:   var(--ds-blue-500);  /* categoria «fatturabile» — riempimento barra/dot */
  --ds-data-estimated:       var(--ds-blue-700);  /* stato «stimato/proiettato» — testo (cashflow futuro) */
  --ds-data-estimated-fill:  var(--ds-blue-500);  /* stato «stimato» — riempimento dot legenda */
  --ds-data-estimated-bg:    var(--ds-blue-50);   /* stato «stimato» — tinta cella */
  --ds-data-estimated-bg2:   var(--ds-blue-100);  /* stato «stimato» — tinta enfasi (totali) */
  /* Stati semaforici del dato (fetta filtri, D-33): il colore di un VALORE
     (margine, segno, fascia) esce dai filtri `sign_class`/`fascia_text`/
     `fascia_border`/`margine_riga`, non più dai token UI `error/success/warning`.
     Stessi valori (700 testo, 500 bordo) → zero cambiamento visivo. `-edge` = la
     tinta bordo (fascia_border, bordo-sinistro delle card KPI). */
  --ds-data-negative:        var(--ds-red-700);    /* perdita / segno negativo / fascia critico — testo */
  --ds-data-negative-edge:   var(--ds-red-500);    /* idem — bordo */
  --ds-data-positive:        var(--ds-green-700);  /* ≥ obiettivo / segno positivo / fascia ok — testo */
  --ds-data-positive-edge:   var(--ds-green-500);  /* idem — bordo */
  --ds-data-warn:            var(--ds-amber-700);  /* sotto-target (fascia warn) — testo */
  --ds-data-warn-edge:       var(--ds-amber-500);  /* idem — bordo */

  /* Surfaces */
  --ds-surface-background:   var(--ds-white);
  --ds-surface-card:         var(--ds-white);
  --ds-surface-page:         var(--ds-neutral-25);     /* #f7f7f7 canvas pagina */
  --ds-surface-muted:        var(--ds-neutral-50);
  --ds-surface-primary-tint: var(--ds-neutral-50);     /* hover secondary/ghost — era primary-50, valore identico */
  --ds-surface-warning-tint: var(--ds-amber-50);       /* G1.4: era #fff7e0 (Δ12) → tinta di superficie = amber-50 */
  --ds-surface-error-tint:   var(--ds-red-50);         /* era #fff2f2 (Δ1) */
  --ds-surface-hover:        var(--ds-neutral-25);     /* era #f8f9fa (Δ2) */

  /* On-surface (text) — contrasto WCAG AA. G1.4: i 2 letterali freddi salgono a
     primitivo; tertiary/muted → neutral-600 (#737373 = 4.74:1 su bianco, resta AA). */
  --ds-on-surface-primary:   var(--ds-neutral-900);
  --ds-on-surface-secondary: var(--ds-neutral-700);
  --ds-on-surface-tertiary:  var(--ds-neutral-600);    /* era #5e6970 (Δ23) */
  --ds-on-surface-muted:     var(--ds-neutral-600);    /* era #646d73 (Δ16) */
  --ds-on-surface-inverse:   var(--ds-white);

  /* Borders */
  --ds-border-default: var(--ds-neutral-150);
  --ds-border-strong:  var(--ds-neutral-300);
  /* Interattività = BLU (Onda 2, D-10). Il modello ink+blu di Polaris 12: l'azione
     primaria è inchiostro, tutto ciò che si tocca (focus, link, selezione, corrente)
     è blu, il rosso resta al solo dato/errore e ai 3 ruoli di brand. blue-700 fa
     6.70:1 su bianco / 5.78:1 sul grigio più scuro — individuabile su tabella piena,
     e acromaticamente distinto dal rosso del dato. */
  --ds-border-focus:      var(--ds-blue-700);          /* anello di fuoco, era rosso */
  --ds-focus-ring:        var(--ds-blue-100);          /* alone tenue del focus (3px) */
  --ds-text-interactive:  var(--ds-blue-700);          /* link, marcatori interattivi */

  /* Semantic spacing (layout) */

  /* ============================================================
   * 3. COMPONENT
   * ============================================================ */

  /* Buttons */
  --ds-btn-primary-bg:       var(--ds-color-primary);
  --ds-btn-primary-text:     var(--ds-white);
  --ds-btn-primary-hover-bg: var(--ds-color-primary-hover);
  --ds-btn-secondary-border: var(--ds-color-primary);
  --ds-btn-secondary-text:   var(--ds-color-primary);
  --ds-btn-destructive-bg:   var(--ds-red-600);     /* #e0163d — rosso Oxequa scuro: testo bianco AA (~4.8:1) */
  --ds-btn-destructive-text: var(--ds-white);
  --ds-btn-ghost-text:       var(--ds-color-primary);
  --ds-btn-radius:           var(--ds-radius-200);

  /* Inputs */
  --ds-input-bg:           var(--ds-white);
  /* Bordo controlli form: neutral-400 (#81898f ≈ 3.6:1 su bianco) per rispettare
     WCAG 1.4.11 (contrasto non-testuale ≥3:1). NB: solo gli input — card/tabelle
     usano --ds-border-default (invariato). */
  --ds-input-border:       var(--ds-neutral-500);
  --ds-input-border-focus: var(--ds-border-focus);
  --ds-input-text:         var(--ds-on-surface-primary);
  /* Placeholder: neutral-600 (#4b575f ≈ 7:1 su bianco, ≈6.6:1 sul canvas #f7f7f7).
     Corretto dall'audit E2: neutral-500 (#6f797f) era 4.45:1 su bianco ma 4.16:1
     sul canvas pagina → sotto WCAG 1.4.3. Il placeholder funge spesso da hint visibile. */
  --ds-input-placeholder:  var(--ds-neutral-700);
  --ds-input-radius:       var(--ds-radius-200);

  /* Cards */
  --ds-card-bg:     var(--ds-white);
  --ds-card-border: var(--ds-border-default);
  --ds-card-radius: var(--ds-radius-200);

  /* Tables */
  --ds-table-row-border:  var(--ds-border-default);
  --ds-table-stripe:      var(--ds-neutral-25);        /* zebra righe pari — era #fafbfb (Δ1) */

  /* Sidebar (non usata nel Core, mantenuta per compat componenti DS) */

  /* Badges */
  --ds-badge-success-bg:   var(--ds-green-100);
  --ds-badge-success-text: var(--ds-green-800);
  --ds-badge-warning-bg:   var(--ds-amber-100);
  --ds-badge-warning-text: var(--ds-amber-800);
  --ds-badge-error-bg:     var(--ds-red-100);
  --ds-badge-error-text:   var(--ds-red-800);
  --ds-badge-info-bg:      var(--ds-blue-100);
  --ds-badge-info-text:    var(--ds-blue-800);

  /* Tabs */

  /* Motion */
  --ds-motion-fast:   150ms;
  --ds-ease-standard: cubic-bezier(0.4, 0, 0.2, 1);

  /* Le ombre vivono ora nel livello 1 come scala a 4 gradini (`--ds-shadow-100…400`,
     vedi sopra). La vecchia coppia `sm`/`lg` è stata rimossa in Onda 1: era il residuo
     di una scala a 2 valori che conviveva con le 6 ombre di Tailwind e con 11
     box-shadow letterali in ds.css. In Onda 0 due sue righe erano perfino CSS
     invalido (dichiarazioni senza nome di proprietà). */

  /* Z-index — scala di layering (audit W2-2/E3). Prima ogni overlay sceglieva un
     numero a mano (nessun token) → 12+ valori ad-hoc. I valori qui NOMINANO
     l'ordine già in uso dagli overlay vivi (nessun cambiamento visivo): un overlay
     nuovo sceglie un LIVELLO, non un numero.

     @ds-exception-permanent: lo stacking INTERNO alla .ds-table (header sticky z:3,
       angolo pin-first z:1/2/4) NON usa questa scala e non deve usarla: è un contesto
       di impilamento locale e corretto: quei valori competono solo tra loro, dentro la
       tabella. Portarli sulla scala globale li metterebbe in relazione con i dropdown.
       Motivazione permanente, non una deroga in attesa. */
  --ds-z-dropdown: 50;    /* menu in-flow: combobox / status-select panel */
  --ds-z-overlay:  100;   /* backdrop modale, tooltip */
  --ds-z-popover:  1000;  /* pannelli portati su <body> (combobox --floating) */
  --ds-z-toast:    1100;  /* notifiche toast (sopra tutto) */

  /* Larghezze colonna per tabelle a layout fisso (audit W2-4). Con
     `.ds-table--fixed` (table-layout:fixed) le colonne NON si ridimensionano più
     al variare del contenuto (stop al "dance" sugli swap HTMX): quelle senza
     larghezza assorbono lo spazio residuo. */
  --ds-col-sm: 110px;
  --ds-col-md: 140px;
  --ds-col-lg: 180px;

  /* Altezze dei controlli (Onda 2, D-28) — 3 taglie: 32 / 36 / 48, **default 36**.
     Allineate alla scala del riferimento, che NON contiene il gradino 44px. Il default
     scende da 44 a 36 (−8px per controllo): è la risposta al feedback «bottoni troppo
     alti». Evidenza a supporto: 135 bottoni su 694 usavano già `--sm` a 36px. */
  --ds-control-h-sm: 32px;
  --ds-control-h:    36px;
  --ds-control-h-lg: 48px;

  /* ============================================================
   * 4. COMPAT — alias usati da alcuni componenti DS del PIM
   *    (naming alternativo / stop intermedi). Mappati ai canonici
   *    così ogni componente portato risolve (nel PIM alcuni di
   *    questi sono usati senza fallback → qui li rendiamo validi).
   *
   * @ds-exception: alias di compatibilità del PIM (13 riferimenti residui).
   *   Muoiono con la rinomina numerica della scala spaziatura in Onda 1
   *   (03-token.md tab. B/E). scade 2026-10-31
   * ============================================================ */
  /* Spacing (--ds-spacing-* → --ds-space-*) */
  --ds-spacing-xxs: var(--ds-space-xxs);
  --ds-spacing-xs:  var(--ds-space-xs);
  --ds-spacing-sm:  var(--ds-space-sm);
  --ds-spacing-md:  var(--ds-space-md);
  --ds-spacing-lg:  var(--ds-space-lg);
  --ds-spacing-2xl: var(--ds-space-2xl);

  /* Foreground / background / surface / border */
  --ds-on-surface:               var(--ds-on-surface-primary);

  /* Accent / destructive */

  /* Status alias (semaforo). NB: alias --ds-danger-* rimossi (0 usi, il rosso
     è unificato su accent/red). */
  --ds-success-50:  var(--ds-green-50);
  /* red-600 NON qui: è definito sopra come rosso Oxequa #e0163d (accent-600).
     La vecchia riga #dc2626 lo shadowava (vince l'ultima) → rimossa. */

  /* Mono */
}

/* ============================================================
 * DENSITÀ — token contestuali (Onda 5, R5.2/R5.3 · 03-token §4)
 * La densità è una proprietà della SUPERFICIE: si dichiara con
 * data-density="condensed" su un contenitore e i componenti che
 * leggono questi alias si compattano, senza ridichiarare regole.
 * Consumatore oggi: SOLO la .ds-table (griglia dati) — portata
 * "solo griglia", come il `condensed` di Shopify/Polaris (non una
 * densità globale che rimpicciolisce ogni bottone o badge).
 * Un 3° livello è impossibile per costruzione: servirebbe un nuovo
 * blocco di binding, cioè una modifica al sistema, non a una schermata.
 * Valori off-scala (7/5px, 8/6px) DI PROPOSITO: guidano l'altezza di
 * riga (~35px default / ~30px condensed), non stanno sulla griglia 4px.
 * ============================================================ */
:root, [data-density="default"] {
  --ds-space-cell-y:      7px;                    /* padding-y cella corpo → riga ~35px */
  --ds-space-cell-head-y: 8px;                    /* padding-y thead / tfoot / sort-btn */
  --ds-space-cell-x:      var(--ds-space-md);     /* 16px — padding-x di cella */
  --ds-space-cell-gutter: var(--ds-space-lg);     /* 24px — padding di bordo (prima/ultima colonna) */
  --ds-font-cell-head:    var(--ds-font-caption); /* 13px — header e sort-btn */
}
[data-density="condensed"] {
  --ds-space-cell-y:      5px;                    /* riga ~30px (griglie analitiche 12-14 colonne) */
  --ds-space-cell-head-y: 6px;
  --ds-space-cell-x:      var(--ds-space-sm);     /* 12px */
  --ds-space-cell-gutter: var(--ds-space-md);     /* 16px */
  --ds-font-cell-head:    var(--ds-font-xs);      /* 12px */
}