/* =============================================
   its-variables.css
   Variabili CSS globali e import font
   ============================================= */

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600;700&family=DM+Mono:wght@400;500&display=swap');

:root {
    /* ── Superfici e testo ──
       Comuni a tutte le pagine: erano ricopiati identici in testa a ogni
       CSS scoped (--ad-*, --lc2-*, --bot2-*). Da qui in poi si citano. */
    --its-bg: #f5f6fa;
    --its-surface: #ffffff;
    --its-surface2: #f0f2f8;
    --its-border: #e0e3ed;
    --its-text: #1a1d2e;
    --its-text-muted: #8a93b8;
    --its-text-dim: #5a6282;

    /* ── Accento delle pagine operative (chat) ── */
    --its-accent: #25d366;
    --its-accent-light: #eef8f2;

    /* ── Accento delle pagine amministrative ──
       Usato da AnagraficaDettaglio e Chat2Bot: è il blu Primary del MudTheme. */
    --its-admin: #1a56db;
    --its-admin-darken: #1040b0;
    --its-admin-light: #eaf1fc;

    /* ── Stati ── */
    --its-blue: #4f8ef7;
    --its-success: #25d366;
    --its-warning: #f5c842;
    --its-warning-bg: #fffbea;
    --its-warning-text: #8a6300;
    --its-danger: #e53935;
    --its-danger-bg: #fdecea;
    --its-danger-text: #b3261e;

    /* ── Ombre e velature ── */
    --its-shadow: rgba(0, 0, 0, 0.08);
    --its-shadow-md: rgba(0, 0, 0, 0.14);
    --its-overlay: rgba(26, 29, 46, 0.45);

    /* ── Misure ──
       --its-shell-h è l'altezza utile sotto la barra: le tre pagine
       scrivevano "calc(100vh - 64px)" ciascuna per conto suo.
       ⚠️ Sottraeva 64px con una barra di 56: otto pixel vuoti in fondo.
       --its-vh è 100dvh dove esiste (sotto): su telefono 100vh è l'altezza
       con la barra dell'indirizzo nascosta, e il fondo della pagina —
       il composer della chat, i bottoni dei drawer — finiva sotto di essa. */
    --its-nav-w: 220px;
    --its-appbar-h: 56px;
    --its-vh: 100vh;
    --its-shell-h: calc(var(--its-vh) - var(--its-appbar-h));
    /* Striscia degli avvisi dell'azienda (FasciaAvvisi): quando c'è, its-shell.css
       ridefinisce --its-shell-h su .its-layout sottraendola, o le pagine sforano. */
    --its-fascia-avvisi-h: 44px;

    /* Spazio della barra home su iPhone (serve viewport-fit=cover in index.html). */
    --its-safe-bottom: env(safe-area-inset-bottom, 0px);

    /* ── Breakpoint ──
       Le custom property non si possono usare dentro @media, quindi le
       soglie stanno qui come promemoria e si scrivono a mano. Solo queste,
       allineate a MudBlazor (Xs/Sm/Md):
         600px  telefono — una colonna, card al posto delle righe
         960px  tablet   — testate che vanno a capo, pannelli sovrapposti
         1280px desktop
       Eccezione: 1024px per il menu laterale (its-sidenav.css), letto
       anche da js/its-responsive.js. */

    /* ── Spaziature ── */
    --its-space-1: 4px;
    --its-space-2: 8px;
    --its-space-3: 12px;
    --its-space-4: 16px;
    --its-space-5: 24px;
    --its-space-6: 32px;

    /* ── Raggi ── */
    --its-radius-sm: 6px;
    --its-radius: 8px;
    --its-radius-lg: 12px;
    --its-radius-pill: 999px;

    /* ── Tipografia ── */
    /* ⚠️ Si usano **sempre** queste variabili, mai la famiglia scritta a mano nelle
       regole: scriverla significa saltare la catena di ripiego, ed è così che
       `'DM Sans', sans-serif` finiva su Arial invece che su DM Sans o Segoe UI. */
    --its-font: 'DM Sans', 'Segoe UI', system-ui, sans-serif;

    /* Testo a spaziatura fissa dove serve l'aspetto tecnico e non si leggono cifre
       una per una: sottotitoli di conteggio, righe meta degli elenchi. */
    --its-font-mono: 'DM Mono', 'Consolas', 'SF Mono', 'Menlo', monospace;

    /* Numeri e codici che si leggono — e si dettano — carattere per carattere:
       partita IVA, codice fiscale, date, telefoni, identificativi.

       ⚠️ **DM Mono sta in coda apposta.** È il font del design, ma non ha lo zero
       barrato: verificato rendendolo su canvas, `slashed-zero` non cambia un pixel.
       Su una partita IVA come «00000000000» questo significa undici ovali identici,
       cioè esattamente il difetto che questa variabile esiste per evitare. Consolas,
       SF Mono e Menlo lo zero lo tagliano. */
    --its-font-codici: 'Consolas', 'SF Mono', 'Menlo', 'Roboto Mono', 'DM Mono', monospace;
    --its-fs-label: 10px;
    --its-fs-caption: 11px;
    --its-fs-sm: 12px;
    --its-fs-base: 13px;
    --its-fs-md: 14px;
    --its-fs-lg: 16px;
}

@supports (height: 100dvh) {
    :root {
        --its-vh: 100dvh;
    }
}