@charset "UTF-8";
:root {
  color-scheme: light dark;
  /* Brand — l'accento di PRIMO PIANO: testo dei link, anello di focus, icone.
     Vive separato da --ev-accent (il riempimento) perche' i due ruoli hanno
     soglie diverse: 4,5:1 il primo, 3:1 il secondo. Nello scuro quasi
     coincidono; nel chiaro no, ed e' li' che tenerli uniti si rompe. */
  --ev-primary: #35600F;
  --ev-primary-rgb: 53, 96, 15;
  --ev-primary-hover: #2A4C0C;
  --ev-primary-subtle: #E9F0DE;
  --ev-on-primary: #FFFFFF;
  /* Accento di RIEMPIMENTO: barre, pill, tracce, aloni. Mai testo su fondo chiaro. */
  --ev-accent: #4D7C0F;
  --ev-accent-on: #FFFFFF;
  --ev-accent-tint: rgba(77, 124, 15, .14);
  --ev-accent-line: rgba(77, 124, 15, .40);
  --ev-accent-hover: rgba(77, 124, 15, .09);
  /* Superfici e testo */
  --ev-bg: #F4F6F5;
  --ev-surface: #FFFFFF;
  --ev-surface-raised: #FFFFFF;
  --ev-surface-sunken: #F1F4F3;
  --ev-track: #E4E8E7;
  --ev-border: #D8DEDE;
  --ev-border-strong: #C6CFCE;
  --ev-hairline: #E6EAEA;
  --ev-border-control: #828B8E;
  --ev-text: #16201F;
  --ev-text-muted: #54615F;
  --ev-text-faint: #5F6C6A;
  --ev-text-disabled: #8A9391;
  /* Semantici */
  --ev-success: #177244;
  --ev-success-subtle: #E3F3EA;
  --ev-warning: #8A4708;
  --ev-warning-subtle: #F6ECE0;
  --ev-danger: #A3211A;
  --ev-danger-subtle: #F8E8E6;
  --ev-danger-on: #FFFFFF;
  --ev-info: #15558F;
  --ev-info-subtle: #E4EDF6;
  --ev-neutral: #54615F;
  --ev-neutral-subtle: #ECEFEF;
  --ev-code: #8E1E86;
  /* Gradienti — sono valori di colore, quindi stanno qui e non accanto al componente. */
  --ev-grad-accent: linear-gradient(180deg, #4D7C0F, #3F6212);
  --ev-grad-title: linear-gradient(94deg, #16201F 30%, #35600F 110%);
  --ev-grad-banner: linear-gradient(100deg, rgba(77, 124, 15, .10), rgba(15, 118, 110, .05));
  --ev-grad-page: radial-gradient(1100px 580px at 88% -16%, rgba(77, 124, 15, .07), transparent 62%),
                  radial-gradient(900px 520px at -10% 112%, rgba(15, 118, 110, .05), transparent 60%);
  /* I filetti di categoria: 3px verticali a sinistra di una tessera. Portano la
     stessa informazione della pill accanto, mai da soli (LINEE-GUIDA §3). */
  --ev-mark-accent: linear-gradient(#4D7C0F, #35600F);
  --ev-mark-danger: linear-gradient(#C43A32, #8C1A14);
  --ev-mark-warning: linear-gradient(#D99236, #8A4708);
  --ev-mark-info: linear-gradient(#3A7CB8, #15558F);
  /* Vetro — il velo delle superfici appiccicose (sidebar, topbar, barre filtri).
     ⚠️ backdrop-filter non e' gratuito: si usa dove la superficie sta SOPRA
     contenuto che scorre, non su ogni card. */
  --ev-glass: rgba(255, 255, 255, .86);
  --ev-glass-side: rgba(255, 255, 255, .92);
  --ev-glass-blur: blur(18px) saturate(1.3);
  /* Tessere */
  --ev-card-bg: #FFFFFF;
  --ev-elev-card: inset 0 0 0 1px #D8DEDE, 0 1px 2px rgba(16, 24, 32, .06);
  --ev-elev-card-hover: inset 0 0 0 1px rgba(77, 124, 15, .45), 0 8px 24px rgba(16, 24, 32, .12);
  --ev-glow: 0 1px 2px rgba(16, 24, 32, .18);
  --ev-glow-card: 0 6px 20px rgba(16, 24, 32, .08);
  --ev-glow-danger: rgba(163, 33, 26, .45);
  /* Fasi / canali — ogni serie porta anche pattern di tratto e forma di marcatore,
     perche' in tritanopia la prima e la terza si avvicinano e il solo colore non basta.

     Si chiamano a/b/c e NON l1/l2/l3, e il nome non e' cosmetico. Il tecnico ha
     risposto il 2026-09-14 che i morsetti sono montati a caso sulle fasi: quale fase
     del distributore misuri il morsetto A non lo sa nessuno e per i due dispositivi
     esistenti non e' recuperabile. Un token chiamato --ev-phase-l1 finisce come classe
     `sg-chart__swatch--ev-phase-l1` nel DOM della pagina di confronto, cioe' scrive
     un'identita' fabbricata dove chi ispeziona la pagina la legge come un fatto — che
     e' esattamente cio' che M7.0 ha aggiunto il ruolo `Phase` per non fare.

     📌 M11.0 NON li tocca: la pelle e' cambiata, il contrasto misurato in M7.1 no, e
     riaccordarli e' lavoro di M11.4, dove si tocca anche la fabbrica di ApexCharts che
     li legge. Cambiarli qui li scollerebbe dal grafico che li disegna. */
  --ev-phase-a: #C2621A; /* ambra   · tratto pieno      · marcatore cerchio   */
  --ev-phase-b: #2563EB; /* blu     · tratteggio 6-3    · marcatore quadrato  */
  --ev-phase-c: #A21CAF; /* magenta · punteggiato 2-3   · marcatore triangolo */
  --ev-phase-total: #334155; /* grafite · pieno 2.5px       · marcatore rombo     */
  --ev-phase-device: #0F766E;
  /* Serie generiche, non-fase */
  --ev-series-1: #4D7C0F;
  --ev-series-2: #B35309;
  --ev-series-3: #6D28D9;
  --ev-series-4: #1A7F4B;
  --ev-series-5: #9F1239;
  --ev-series-6: #475569;
  /* Grafici */
  --ev-chart-grid: #E4E8E7;
  --ev-chart-axis: #8B9698;
  --ev-chart-band: rgba(77, 124, 15, .13);
  --ev-chart-forecast: #6D28D9;
  /* Forma e ritmo — density 8/10 */
  --ev-radius-sm: 5px;
  --ev-radius: 10px;
  --ev-radius-lg: 14px;
  --ev-radius-xl: 16px;
  --ev-radius-pill: 999px;
  --ev-space-1: 4px;
  --ev-space-2: 8px;
  --ev-space-3: 12px;
  --ev-space-4: 16px;
  --ev-space-5: 24px;
  --ev-space-6: 32px;
  --ev-space-7: 48px;
  --ev-shadow-sm: 0 1px 2px rgba(16, 24, 32, .06);
  --ev-shadow: 0 2px 8px rgba(16, 24, 32, .08);
  --ev-shadow-pop: 0 8px 28px rgba(16, 24, 32, .16);
  --ev-scrim: rgba(16, 24, 32, .45);
  /* Tipografia */
  --ev-font-sans: "Space Grotesk", "Segoe UI", system-ui, -apple-system, sans-serif;
  --ev-font-mono: "JetBrains Mono", "Cascadia Code", Consolas, monospace;
  --ev-fs-display: 2.125rem; /* 34px — il titolo di pagina del mockup */
  --ev-fs-h1: 1.375rem;
  --ev-fs-h2: .96875rem; /* 15.5px */
  --ev-fs-h3: .90625rem; /* 14.5px */
  --ev-fs-body: .84375rem; /* 13.5px */
  --ev-fs-sm: .78125rem; /* 12.5px */
  --ev-fs-xs: .65625rem; /* 10.5px — solo etichette maiuscolette, mai prosa */
  --ev-fs-caption: .71875rem; /* 11.5px */
  --ev-lh-body: 1.5;
  --ev-lh-tight: 1.25;
  /* Motion */
  --ev-dur-fast: 120ms;
  --ev-dur: 180ms;
  --ev-dur-slow: 280ms;
  --ev-ease-out: cubic-bezier(.2, .8, .3, 1);
  --ev-ease-in: cubic-bezier(.5, 0, .9, .4);
  /* Focus — outline, mai il solo box-shadow: in forced-colors il box-shadow sparisce
     e il focus diventa invisibile proprio a chi ha attivato il contrasto alto. */
  --ev-focus-outline: 2px solid var(--ev-primary);
  --ev-focus-ring: 0 0 0 3px rgba(var(--ev-primary-rgb), .38);
}

[data-bs-theme=dark] {
  --ev-primary: #BEF264;
  --ev-primary-rgb: 190, 242, 100;
  --ev-primary-hover: #D9F99D;
  --ev-primary-subtle: #1B2410;
  --ev-on-primary: #0A1204;
  --ev-accent: #A3E635;
  --ev-accent-on: #0A1204;
  --ev-accent-tint: rgba(163, 230, 53, .14);
  --ev-accent-line: rgba(163, 230, 53, .32);
  --ev-accent-hover: rgba(163, 230, 53, .08);
  --ev-bg: #08090C;
  --ev-surface: #0E1116;
  --ev-surface-raised: #141922;
  --ev-surface-sunken: #0B0E13;
  --ev-track: #141922;
  --ev-border: #1A212B;
  --ev-border-strong: #232B37;
  --ev-hairline: #161D26;
  --ev-border-control: #6A767A;
  --ev-text: #EDF1F7;
  --ev-text-muted: #8D97A8;
  --ev-text-faint: #7A8597;
  --ev-text-disabled: #6B7679;
  --ev-success: #4ADE80;
  --ev-success-subtle: #10251A;
  --ev-warning: #FBBF24;
  --ev-warning-subtle: #2A2113;
  --ev-danger: #F87171;
  --ev-danger-subtle: #2A1614;
  --ev-danger-on: #3B0A0A;
  --ev-info: #60A5FA;
  --ev-info-subtle: #14212E;
  --ev-neutral: #8D97A8;
  --ev-neutral-subtle: #161D26;
  --ev-code: #F0ABFC;
  --ev-grad-accent: linear-gradient(180deg, #BEF264, #A3E635);
  --ev-grad-title: linear-gradient(94deg, #EDF1F7 25%, #A3E635 110%);
  --ev-grad-banner: linear-gradient(100deg, rgba(163, 230, 53, .10), rgba(34, 211, 238, .05));
  --ev-grad-page: radial-gradient(1200px 620px at 86% -14%, rgba(163, 230, 53, .10), transparent 62%),
                  radial-gradient(900px 540px at -10% 112%, rgba(34, 211, 238, .05), transparent 60%);
  --ev-mark-accent: linear-gradient(#BEF264, #65A30D);
  --ev-mark-danger: linear-gradient(#FCA5A5, #DC2626);
  --ev-mark-warning: linear-gradient(#FCD34D, #B45309);
  --ev-mark-info: linear-gradient(#93C5FD, #2563EB);
  --ev-glass: rgba(14, 17, 22, .78);
  --ev-glass-side: rgba(14, 17, 22, .88);
  --ev-card-bg: linear-gradient(165deg, rgba(20, 25, 34, .9), rgba(14, 17, 22, .9));
  --ev-elev-card: inset 0 1px 0 rgba(255, 255, 255, .05), inset 0 0 0 1px #1A212B, 0 8px 26px rgba(0, 0, 0, .34);
  --ev-elev-card-hover: inset 0 1px 0 rgba(255, 255, 255, .07), inset 0 0 0 1px rgba(163, 230, 53, .35), 0 0 26px rgba(163, 230, 53, .10), 0 12px 34px rgba(0, 0, 0, .4);
  --ev-glow: 0 0 14px rgba(163, 230, 53, .35);
  --ev-glow-card: 0 0 26px rgba(163, 230, 53, .10);
  --ev-glow-danger: rgba(248, 113, 113, .45);
  --ev-phase-a: #E2903F;
  --ev-phase-b: #7BA7F5;
  --ev-phase-c: #DE7BE8;
  --ev-phase-total: #C3CDD3;
  --ev-series-1: #A3E635;
  --ev-series-2: #E2903F;
  --ev-series-3: #A78BFA;
  --ev-series-4: #4CC384;
  --ev-series-5: #F0768F;
  --ev-series-6: #A3B1BD;
  --ev-chart-grid: #1A212B;
  --ev-chart-axis: #6B7679;
  --ev-chart-band: rgba(163, 230, 53, .20);
  --ev-shadow-sm: 0 1px 2px rgba(0, 0, 0, .5);
  --ev-shadow: 0 2px 10px rgba(0, 0, 0, .55);
}
/*# sourceMappingURL=/src/src/SensoriGateway.Web/Styles/sg-tokens.css.map */