/* =========================================================
   Backoffice Cybernix — foglio di stile unico
   Struttura: 1 variabili · 2 base · 3 layout · 4 componenti · 5 pagine · 6 responsive
   ========================================================= */

/* 1 · VARIABILI ------------------------------------------ */
:root {
  /* Palette ufficiale cybernix.it (tra parentesi il nome della variabile sul sito) */

  /* sfondi */
  --sfondo-pagina: #060608;      /* --black */
  --sfondo-pannello: #0d0d10;    /* --dark */
  --sfondo-card: #13131a;        /* --dark-2 */
  --sfondo-hover: #1c1c25;       /* --dark-3 */
  --sfondo-campo: #1c1c25;       /* --dark-3 */

  /* rosso del marchio */
  --rosso: #ca1518;              /* --red */
  --rosso-scuro: #9b0f12;        /* --red-dark: pulsante al passaggio */
  --rosso-premuto: #860d10;      /* scala 700 */
  --rosso-testo: #f2575a;        /* --red-text */
  --rosso-100: #fbe3e3; --rosso-200: #f5b8b9; --rosso-300: #ec8183; --rosso-400: #e24a4d; --rosso-500: #ca1518;
  --rosso-600: #a81114; --rosso-700: #860d10; --rosso-800: #5e090b; --rosso-900: #3a0506;

  /* testo */
  --testo: #ffffff;              /* --white: titoli e testo principale */
  --testo-paragrafo: #c8c8d8;    /* --grey-light */
  --testo-secondario: #a0a0b4;   /* --grey-2 */
  --grigio: #8b8b9e;             /* --grey: etichette e note */
  --bordo: rgba(255, 255, 255, 0.08);
  --bordo-forte: rgba(255, 255, 255, 0.16);
  --bordo-hover: rgba(255, 255, 255, 0.28);
  --sfondo-barra: rgba(6, 6, 8, 0.92);
  --segnaposto-luce: #262631;
  --ombra-finestra: 0 24px 64px rgba(0, 0, 0, 0.6);
  --ombra-toast: 0 12px 32px rgba(0, 0, 0, 0.5);

  /* stati */
  --verde: #34c77b;
  --giallo: #f5b041;
  --blu: #5aa9f2;
  --viola: #b59cf0;

  /* origini (neutri distinguibili) */
  --origine-nis2: #c9ccd8;
  --origine-autovalutazione: #7d93bd;
  --origine-contatti: #bfa27f;
  --origine-inglese: #6c6c80;

  /* tipografia */
  --font-titoli: "Barlow Condensed", "Arial Narrow", sans-serif;
  --font-testo: "Barlow", system-ui, sans-serif;

  /* misure */
  --raggio: 3px;
  --raggio-piccolo: 2px;
  --larghezza-menu: 248px;
  --altezza-barra: 64px;
  --altezza-riga: 44px;
  --altezza-controllo: 40px;
  --spazio-1: 4px;
  --spazio-2: 8px;
  --spazio-3: 12px;
  --spazio-4: 16px;
  --spazio-5: 24px;
  --spazio-6: 32px;
  --spazio-7: 48px;
}

/* 2 · BASE ----------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { color-scheme: dark; }

/* Tema chiaro: <html data-tema="chiaro">. Solo variabili: i componenti non cambiano. */
[data-tema="chiaro"] {
  color-scheme: light;
  --sfondo-pagina: #f3f3f6;
  --sfondo-pannello: #ffffff;
  --sfondo-card: #ffffff;
  --sfondo-hover: #ebebf0;
  --sfondo-campo: #ffffff;
  --sfondo-barra: rgba(243, 243, 246, 0.92);
  --rosso-testo: #b31215;
  --testo: #0d0d10;
  --testo-paragrafo: #2c2c38;
  --testo-secondario: #4a4a5a;
  --rosso-scuro: #9b0f12;
  --grigio: #64647a;
  --bordo: rgba(16, 16, 28, 0.1);
  --bordo-forte: rgba(16, 16, 28, 0.2);
  --bordo-hover: rgba(16, 16, 28, 0.36);
  --segnaposto-luce: #f7f7fa;
  --verde: #157a47;
  --giallo: #935d00;
  --blu: #1d68b5;
  --viola: #6b4dbf;
  --origine-nis2: #3a3e50;
  --origine-autovalutazione: #4d69a1;
  --origine-contatti: #a9824f;
  --origine-inglese: #a6a6b8;
  --ombra-finestra: 0 24px 64px rgba(16, 16, 28, 0.18);
  --ombra-toast: 0 12px 32px rgba(16, 16, 28, 0.16);
}
[data-tema="chiaro"] .qr-segnaposto { border: 1px solid var(--bordo-forte); }
[data-tema="chiaro"] .finestra::backdrop { background: rgba(16, 16, 28, 0.45); }

/* Interruttore tema: mostra l'icona del tema verso cui si passa */
.interruttore-tema .icona--luna { display: none; }
[data-tema="chiaro"] .interruttore-tema .icona--sole { display: none; }
[data-tema="chiaro"] .interruttore-tema .icona--luna { display: block; }
body {
  margin: 0;
  background: var(--sfondo-pagina);
  color: var(--testo-paragrafo);
  font-family: var(--font-testo);
  font-size: 15px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4 { color: var(--testo); margin: 0; font-family: var(--font-titoli); font-weight: 700; line-height: 1.1; letter-spacing: 0.01em; }
p { margin: 0; text-wrap: pretty; }
a { color: var(--rosso-testo); text-decoration: none; }
a:hover { color: var(--testo); text-decoration: underline; }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--rosso-testo); outline-offset: 2px; }
::selection { background: rgba(202, 21, 24, 0.45); }
[hidden] { display: none !important; }
.solo-lettori { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.icona { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.icona--piccola { width: 14px; height: 14px; }
.icona--grande { width: 24px; height: 24px; }

.etichetta {
  font-family: var(--font-titoli);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--grigio);
}
.testo-secondario { color: var(--testo-secondario); }
.testo-grigio { color: var(--grigio); }
.numero { font-family: var(--font-titoli); font-weight: 700; font-variant-numeric: tabular-nums; }
.mono { font-variant-numeric: tabular-nums; }

/* 3 · LAYOUT --------------------------------------------- */
.app { display: grid; grid-template-columns: var(--larghezza-menu) minmax(0, 1fr); min-height: 100vh; }

/* barra laterale */
.barra-laterale {
  position: sticky; top: 0; height: 100vh;
  display: flex; flex-direction: column;
  background: var(--sfondo-pannello);
  border-right: 1px solid var(--bordo);
}
.logo {
  display: flex; align-items: center; gap: var(--spazio-2);
  height: var(--altezza-barra); padding: 0 var(--spazio-5);
  border-bottom: 1px solid var(--bordo);
  font-family: var(--font-titoli); font-weight: 800; font-size: 24px; letter-spacing: 0.08em;
  color: var(--testo);
}
.logo:hover { color: var(--testo); text-decoration: none; }
/* Logo: versione bianca su tema scuro, versione standard su tema chiaro, pittogramma con menu ridotto */
.logo__immagine { display: block; height: 40px; width: auto; }
.logo__immagine--per-chiaro, .logo__pittogramma { display: none; }
[data-tema="chiaro"] .logo__immagine--per-scuro { display: none; }
[data-tema="chiaro"] .logo__immagine--per-chiaro { display: block; }
.logo__pittogramma { height: 34px; width: auto; }

.menu { flex: 1; overflow-y: auto; padding: var(--spazio-4) var(--spazio-3); display: flex; flex-direction: column; gap: 2px; }
.menu .lista { display: flex; flex-direction: column; gap: 2px; }
.barra-filtri .ricerca-globale { margin-left: 0; width: 260px; }
.menu__sezione { padding: var(--spazio-4) var(--spazio-3) var(--spazio-2); }
.menu__voce {
  position: relative;
  display: flex; align-items: center; gap: var(--spazio-3);
  min-height: 42px; padding: 0 var(--spazio-3);
  border-radius: var(--raggio);
  color: var(--testo-secondario); font-weight: 500;
}
.menu__voce:hover { background: var(--sfondo-hover); color: var(--testo); text-decoration: none; }
.menu__voce--attiva, .menu__voce--attiva:hover { background: var(--rosso); color: #fff; }
.menu__contatore {
  margin-left: auto; min-width: 22px; padding: 0 6px; border-radius: var(--raggio-piccolo);
  background: var(--sfondo-hover); color: var(--testo);
  font-family: var(--font-titoli); font-weight: 700; font-size: 13px; text-align: center; line-height: 20px;
}
.menu__voce--attiva .menu__contatore { background: rgba(0, 0, 0, 0.28); color: #fff; }

.utente-corrente {
  display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: var(--spazio-3);
  padding: var(--spazio-4); border-top: 1px solid var(--bordo);
}
.avatar {
  display: grid; place-items: center; width: 36px; height: 36px; border-radius: var(--raggio);
  background: var(--sfondo-hover); color: var(--testo);
  font-family: var(--font-titoli); font-weight: 700; font-size: 14px; letter-spacing: 0.04em;
}
.avatar--piccolo { width: 26px; height: 26px; font-size: 11px; }
.utente-corrente__nome { font-weight: 600; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.utente-corrente__ruolo { font-size: 13px; color: var(--grigio); }

/* area principale */
.principale { min-width: 0; display: flex; flex-direction: column; }
.barra-superiore {
  position: sticky; top: 0; z-index: 10;
  display: flex; align-items: center; gap: var(--spazio-4);
  height: var(--altezza-barra); padding: 0 var(--spazio-6);
  background: var(--sfondo-barra); backdrop-filter: blur(6px);
  border-bottom: 1px solid var(--bordo);
}
.barra-superiore__menu { display: none; }
.barra-superiore__titolo { font-size: 24px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; white-space: nowrap; }
.ricerca-globale { position: relative; margin-left: auto; width: min(420px, 100%); }
.ricerca-globale .icona { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--grigio); pointer-events: none; }
.ricerca-globale .campo__input { padding-left: 38px; }
.notifiche { position: relative; }
.notifiche__contatore {
  position: absolute; top: 4px; right: 4px; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 9px;
  background: var(--rosso); color: #fff; font-family: var(--font-titoli); font-weight: 700; font-size: 12px; line-height: 18px; text-align: center;
  pointer-events: none;
}
.contenuto { padding: var(--spazio-6); display: flex; flex-direction: column; gap: var(--spazio-5); width: 100%; min-width: 0; }

.intestazione-pagina { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--spazio-4); flex-wrap: wrap; }
.intestazione-pagina__titolo { font-size: 32px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.02em; }
.intestazione-pagina__sottotitolo { color: var(--testo-secondario); margin-top: var(--spazio-1); }
.intestazione-pagina__azioni { display: flex; gap: var(--spazio-2); flex-wrap: wrap; }
.briciole { display: flex; align-items: center; gap: var(--spazio-2); font-size: 14px; color: var(--grigio); }
.briciole a { color: var(--testo-secondario); }

/* griglie */
.griglia-indicatori { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--spazio-4); }
.griglia-dashboard { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: var(--spazio-4); align-items: start; }
.layout-dettaglio { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: var(--spazio-5); align-items: start; }
.colonna { display: flex; flex-direction: column; gap: var(--spazio-4); min-width: 0; }
.colonna--laterale { position: sticky; top: calc(var(--altezza-barra) + var(--spazio-5)); }

/* 4 · COMPONENTI ----------------------------------------- */

/* pulsanti */
.pulsante {
  display: inline-flex; align-items: center; justify-content: flex-start; gap: var(--spazio-2);
  min-height: var(--altezza-controllo); padding: 0 var(--spazio-4);
  border: 1px solid transparent; border-radius: var(--raggio);
  background: transparent; color: var(--testo);
  font-family: var(--font-titoli); font-weight: 700; font-size: 15px; letter-spacing: 0.06em; text-transform: uppercase;
  cursor: pointer; white-space: nowrap; text-decoration: none;
}
.pulsante:hover { text-decoration: none; }
.pulsante--principale { background: var(--rosso); color: #fff; }
.pulsante--principale:hover { background: var(--rosso-scuro); color: #fff; }
.pulsante--principale:active { background: var(--rosso-premuto); }
.pulsante--secondario { border-color: var(--bordo-forte); color: var(--testo); }
.pulsante--secondario:hover { background: var(--sfondo-hover); border-color: var(--bordo-hover); color: var(--testo); }
.pulsante--secondario:active { background: var(--sfondo-card); }
.pulsante--pericolo { border-color: rgba(242, 87, 90, 0.5); color: var(--rosso-testo); }
.pulsante--pericolo:hover { background: rgba(242, 87, 90, 0.12); color: var(--rosso-testo); }
.pulsante--pericolo-pieno { background: var(--rosso); color: #fff; }
.pulsante--pericolo-pieno:hover { background: var(--rosso-scuro); color: #fff; }
.pulsante--fantasma { color: var(--testo-secondario); }
.pulsante--fantasma:hover { background: var(--sfondo-hover); color: var(--testo); }
.pulsante--piccolo { min-height: 32px; padding: 0 var(--spazio-3); font-size: 14px; }
.pulsante--blocco { width: 100%; }
.pulsante--blocco .icona:last-child { margin-left: auto; }
.pulsante:disabled { opacity: 0.45; cursor: not-allowed; }
.pulsante-icona {
  display: inline-grid; place-items: center; width: var(--altezza-controllo); height: var(--altezza-controllo); padding: 0;
  border: 1px solid transparent; border-radius: var(--raggio); background: transparent; color: var(--testo-secondario); cursor: pointer;
}
.pulsante-icona:hover { background: var(--sfondo-hover); color: var(--testo); }
.pulsante-icona--bordo { border-color: var(--bordo-forte); }

/* campi */
.campo { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.campo__etichetta { font-size: 13px; font-weight: 600; color: var(--testo-secondario); }
.campo__input, .campo__select, .campo__area {
  width: 100%; min-height: var(--altezza-controllo); padding: 0 var(--spazio-3);
  background: var(--sfondo-campo); color: var(--testo);
  border: 1px solid var(--bordo-forte); border-radius: var(--raggio);
}
.campo__area { min-height: 88px; padding: 10px var(--spazio-3); resize: vertical; line-height: 1.45; }
.campo__input::placeholder, .campo__area::placeholder { color: var(--grigio); }
.campo__input:hover, .campo__select:hover, .campo__area:hover { border-color: var(--bordo-hover); }
.campo__input:focus, .campo__select:focus, .campo__area:focus { outline: none; border-color: var(--rosso-testo); box-shadow: 0 0 0 1px var(--rosso-testo); }
.campo__select {
  appearance: none; padding-right: 36px; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a8a8b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 10px center; background-size: 16px;
}
.campo__aiuto { font-size: 13px; color: var(--grigio); }
.campo--errore .campo__input { border-color: var(--rosso-testo); }
.campo--errore .campo__aiuto { color: var(--rosso-testo); }
.campo__riga { display: flex; justify-content: space-between; align-items: baseline; gap: var(--spazio-3); }
.campi-in-riga { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--spazio-3); }

/* caselle e radio */
.casella { display: inline-flex; align-items: center; gap: var(--spazio-2); min-height: var(--altezza-controllo); cursor: pointer; font-size: 14px; }
.casella input {
  appearance: none; margin: 0; width: 18px; height: 18px; flex: none; cursor: pointer;
  border: 1px solid var(--bordo-forte); border-radius: var(--raggio-piccolo); background: var(--sfondo-campo);
  display: grid; place-items: center;
}
.casella input:hover { border-color: var(--bordo-hover); }
.casella input:checked { background: var(--rosso); border-color: var(--rosso); }
.casella input:checked::after { content: ""; width: 10px; height: 6px; border: 2px solid #fff; border-top: 0; border-right: 0; transform: translateY(-1px) rotate(-45deg); }
.casella input:indeterminate { background: var(--rosso); border-color: var(--rosso); }
.casella input:indeterminate::after { content: ""; width: 8px; height: 2px; background: #fff; }
.casella input[type="radio"] { border-radius: 50%; }
.casella input[type="radio"]:checked::after { width: 6px; height: 6px; border: 0; border-radius: 50%; background: #fff; transform: none; }
.casella--sola { justify-content: center; width: var(--altezza-controllo); }

/* chip filtro */
.barra-filtri { display: flex; flex-wrap: wrap; align-items: center; gap: var(--spazio-2); }
.gruppo-chip { display: flex; flex-wrap: wrap; gap: var(--spazio-1); align-items: center; }
.chip {
  display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 var(--spazio-3);
  border: 1px solid var(--bordo-forte); border-radius: var(--raggio); background: transparent;
  color: var(--testo-secondario); font-size: 14px; font-weight: 500; cursor: pointer; white-space: nowrap;
}
.chip:hover { background: var(--sfondo-hover); color: var(--testo); }
.chip[aria-pressed="true"], .chip--attivo { background: rgba(202, 21, 24, 0.16); border-color: var(--rosso); color: var(--testo); }
.chip__valore { color: var(--testo); font-weight: 600; }
.separatore-verticale { width: 1px; align-self: stretch; background: var(--bordo); margin: 0 var(--spazio-1); }

/* badge */
.badge {
  display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 8px;
  border: 1px solid transparent; border-radius: var(--raggio-piccolo);
  font-family: var(--font-titoli); font-weight: 700; font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; white-space: nowrap;
}
.badge--rosso { background: rgba(242, 87, 90, 0.14); color: var(--rosso-testo); border-color: rgba(242, 87, 90, 0.3); }
.badge--giallo { background: rgba(245, 176, 65, 0.13); color: var(--giallo); border-color: rgba(245, 176, 65, 0.3); }
.badge--verde { background: rgba(52, 199, 123, 0.13); color: var(--verde); border-color: rgba(52, 199, 123, 0.3); }
.badge--blu { background: rgba(90, 169, 242, 0.14); color: var(--blu); border-color: rgba(90, 169, 242, 0.32); }
.badge--viola { background: rgba(181, 156, 240, 0.13); color: var(--viola); border-color: rgba(181, 156, 240, 0.3); }
.badge--grigio { background: rgba(255, 255, 255, 0.06); color: var(--testo-secondario); border-color: var(--bordo-forte); }
.badge--grigio-scuro { background: transparent; color: var(--grigio); border-color: var(--bordo); }
/* origine: badge neutro con quadratino di colore */
.badge--origine { background: transparent; color: var(--testo-secondario); border-color: var(--bordo-forte); }
.badge--origine::before { content: ""; width: 8px; height: 8px; flex: none; background: var(--colore-origine, var(--grigio)); }
.badge--nis2 { --colore-origine: var(--origine-nis2); }
.badge--autovalutazione { --colore-origine: var(--origine-autovalutazione); }
.badge--contatti { --colore-origine: var(--origine-contatti); }
.badge--inglese { --colore-origine: var(--origine-inglese); }
.punto { width: 8px; height: 8px; border-radius: 50%; background: currentColor; flex: none; }

/* schede (pannelli) */
.scheda { background: var(--sfondo-card); border: 1px solid var(--bordo); border-radius: var(--raggio); min-width: 0; }
.scheda__intestazione {
  display: flex; align-items: center; justify-content: space-between; gap: var(--spazio-3);
  min-height: 52px; padding: var(--spazio-3) var(--spazio-5); border-bottom: 1px solid var(--bordo);
}
.scheda__titolo { font-size: 16px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.scheda__corpo { padding: var(--spazio-5); }
.scheda__corpo--compatto { padding: var(--spazio-4) var(--spazio-5); }
.scheda__corpo--senza-spazio { padding: 0; }
.scheda__piede { padding: var(--spazio-3) var(--spazio-5); border-top: 1px solid var(--bordo); display: flex; gap: var(--spazio-2); justify-content: flex-end; }
.scheda--pericolo { border-color: rgba(242, 87, 90, 0.3); }

/* card indicatore */
.scheda-indicatore {
  display: flex; flex-direction: column; gap: var(--spazio-2);
  padding: var(--spazio-5); background: var(--sfondo-card); border: 1px solid var(--bordo); border-radius: var(--raggio);
  border-top: 2px solid var(--bordo-forte);
}
.scheda-indicatore--accento { border-top-color: var(--rosso); }
.scheda-indicatore__valore { font-family: var(--font-titoli); font-weight: 800; font-size: 48px; line-height: 1; font-variant-numeric: tabular-nums; }
.scheda-indicatore__nota { font-size: 13px; color: var(--testo-secondario); display: flex; align-items: center; gap: 6px; }
.variazione--su { color: var(--verde); }
.variazione--giu { color: var(--rosso-testo); }

/* tabella */
.contenitore-tabella { overflow-x: auto; }
.tabella { width: 100%; border-collapse: collapse; font-size: 14px; }
.tabella th {
  height: 40px; padding: 0 var(--spazio-3); text-align: left; white-space: nowrap;
  font-family: var(--font-titoli); font-weight: 700; font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--grigio);
  background: var(--sfondo-pannello); border-bottom: 1px solid var(--bordo-forte);
}
.tabella td { height: var(--altezza-riga); padding: 0 var(--spazio-3); border-bottom: 1px solid var(--bordo); white-space: nowrap; }
.tabella th:first-child, .tabella td:first-child { padding-left: var(--spazio-5); }
.tabella th:last-child, .tabella td:last-child { padding-right: var(--spazio-5); }
.tabella tbody tr:hover td { background: var(--sfondo-hover); }
.tabella tbody tr.riga--selezionata td { background: var(--sfondo-hover); }
.tabella tbody tr.riga--selezionata td:first-child { box-shadow: inset 2px 0 0 var(--rosso); }
.tabella tbody tr:last-child td { border-bottom: 0; }
.tabella__colonna-casella { width: 52px; }
.tabella__colonna-azioni { width: 1%; text-align: right; }
.tabella td.tabella__colonna-azioni { text-align: right; }
.tabella__principale { font-weight: 600; color: var(--testo); }
.tabella__principale a { color: var(--testo); }
.tabella__principale a:hover { color: var(--rosso-testo); }
.tabella__secondario { color: var(--testo-secondario); }
.tabella__ordina {
  display: inline-flex; align-items: center; gap: 4px; height: 32px; padding: 0 4px; margin-left: -4px;
  border: 0; border-radius: var(--raggio-piccolo); background: transparent; cursor: pointer;
  font: inherit; letter-spacing: inherit; text-transform: inherit; color: inherit;
}
.tabella__ordina:hover { color: var(--testo); background: var(--sfondo-hover); }
.tabella__ordina .icona { width: 12px; height: 12px; opacity: 0.6; }
th[aria-sort="ascending"] .tabella__ordina, th[aria-sort="descending"] .tabella__ordina { color: var(--testo); }
th[aria-sort="ascending"] .tabella__ordina .icona, th[aria-sort="descending"] .tabella__ordina .icona { opacity: 1; color: var(--rosso-testo); }
.link-telefono { display: inline-flex; align-items: center; gap: 6px; color: var(--testo); font-variant-numeric: tabular-nums; }
.link-telefono .icona { color: var(--grigio); width: 14px; height: 14px; }
.link-telefono:hover { color: var(--rosso-testo); text-decoration: none; }
.persona { display: inline-flex; align-items: center; gap: var(--spazio-2); }

.barra-tabella { display: flex; align-items: center; justify-content: space-between; gap: var(--spazio-3); flex-wrap: wrap; padding: var(--spazio-3) var(--spazio-5); border-bottom: 1px solid var(--bordo); }
.barra-selezione {
  display: flex; align-items: center; gap: var(--spazio-2); flex-wrap: wrap;
  padding: var(--spazio-2) var(--spazio-5); background: rgba(202, 21, 24, 0.1); border-bottom: 1px solid rgba(202, 21, 24, 0.4);
}
.barra-selezione__conteggio { font-family: var(--font-titoli); font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; margin-right: var(--spazio-3); }

/* paginazione */
.paginazione { display: flex; align-items: center; justify-content: space-between; gap: var(--spazio-3); flex-wrap: wrap; padding: var(--spazio-3) var(--spazio-5); border-top: 1px solid var(--bordo); font-size: 14px; color: var(--testo-secondario); }
.paginazione__pagine { display: flex; gap: 2px; align-items: center; }
.paginazione__pagina {
  display: inline-grid; place-items: center; min-width: 36px; height: 36px; padding: 0 6px; border-radius: var(--raggio);
  border: 1px solid transparent; background: transparent; color: var(--testo-secondario); cursor: pointer; font-variant-numeric: tabular-nums;
}
.paginazione__pagina:hover { background: var(--sfondo-hover); color: var(--testo); text-decoration: none; }
.paginazione__pagina[aria-current="page"] { border-color: var(--rosso); color: var(--testo); background: rgba(202, 21, 24, 0.16); }
.paginazione__puntini { padding: 0 6px; color: var(--grigio); }

/* lista (da richiamare, promemoria) */
.lista { list-style: none; margin: 0; padding: 0; }
.lista__voce {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--spazio-4);
  min-height: 64px; padding: var(--spazio-3) var(--spazio-5); border-bottom: 1px solid var(--bordo);
}
.lista__voce:last-child { border-bottom: 0; }
.lista__voce:hover { background: var(--sfondo-hover); }
.lista__titolo { font-weight: 600; }
.lista__dettagli { display: flex; flex-wrap: wrap; align-items: center; gap: var(--spazio-2) var(--spazio-3); margin-top: 4px; font-size: 13px; color: var(--testo-secondario); }
.lista__azioni { display: flex; align-items: center; gap: var(--spazio-2); }

/* promemoria */
.gruppo-promemoria__titolo { display: flex; align-items: center; gap: var(--spazio-3); }
.voce-promemoria {
  display: grid; grid-template-columns: 96px minmax(0, 1.2fr) minmax(0, 2fr) 160px auto; align-items: center; gap: var(--spazio-4);
  min-height: 64px; padding: var(--spazio-3) var(--spazio-5); border-bottom: 1px solid var(--bordo);
}
.voce-promemoria:last-child { border-bottom: 0; }
.voce-promemoria:hover { background: var(--sfondo-hover); }
.voce-promemoria__ora { font-family: var(--font-titoli); font-weight: 700; font-size: 20px; font-variant-numeric: tabular-nums; line-height: 1.1; }
.voce-promemoria__giorno { display: block; font-family: var(--font-testo); font-weight: 500; font-size: 12px; color: var(--grigio); }
.voce-promemoria--ritardo .voce-promemoria__ora { color: var(--rosso-testo); }
.voce-promemoria__nota { color: var(--testo-secondario); font-size: 14px; }

/* esiti NIS2 (riepilogo) */
.esiti { display: flex; flex-direction: column; }
.esiti__voce { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--spazio-2) var(--spazio-3); align-items: center; padding: var(--spazio-3) 0; border-bottom: 1px solid var(--bordo); }
.esiti__voce:first-child { padding-top: 0; }
.esiti__voce:last-child { border-bottom: 0; padding-bottom: 0; }
.esiti__numero { font-family: var(--font-titoli); font-weight: 800; font-size: 28px; line-height: 1; font-variant-numeric: tabular-nums; }
.esiti__barra { grid-column: 1 / -1; height: 4px; background: var(--sfondo-hover); }
.esiti__riempimento { display: block; height: 100%; background: var(--colore, var(--grigio)); }
.esiti__voce--rosso { --colore: var(--rosso-testo); }
.esiti__voce--giallo { --colore: var(--giallo); }
.esiti__voce--verde { --colore: var(--verde); }
/* larghezze in passi da 5%: impostare la classe in base al valore */
.larghezza-5 { width: 5%; } .larghezza-10 { width: 10%; } .larghezza-15 { width: 15%; } .larghezza-20 { width: 20%; }
.larghezza-25 { width: 25%; } .larghezza-30 { width: 30%; } .larghezza-35 { width: 35%; } .larghezza-40 { width: 40%; }
.larghezza-45 { width: 45%; } .larghezza-50 { width: 50%; } .larghezza-60 { width: 60%; } .larghezza-70 { width: 70%; }
.larghezza-80 { width: 80%; } .larghezza-90 { width: 90%; } .larghezza-100 { width: 100%; }

/* grafico a barre (SVG) */
.grafico { width: 100%; height: auto; display: block; }
.grafico__griglia { stroke: var(--bordo); stroke-width: 1; }
.grafico__asse { fill: var(--grigio); font-family: var(--font-testo); font-size: 11px; }
.grafico__barra--nis2 { fill: var(--origine-nis2); }
.grafico__barra--autovalutazione { fill: var(--origine-autovalutazione); }
.grafico__barra--contatti { fill: var(--origine-contatti); }
.grafico__barra--inglese { fill: var(--origine-inglese); }
.legenda { display: flex; flex-wrap: wrap; gap: var(--spazio-2) var(--spazio-4); list-style: none; margin: 0; padding: 0; font-size: 13px; color: var(--testo-secondario); }
.legenda__voce { display: inline-flex; align-items: center; gap: 6px; }
.legenda__colore { width: 10px; height: 10px; background: var(--colore-origine); }

/* dettaglio richiesta */
.testata-richiesta { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--spazio-5); padding: var(--spazio-5); background: var(--sfondo-card); border: 1px solid var(--bordo); border-top: 2px solid var(--rosso); border-radius: var(--raggio); }
.testata-richiesta__azienda { font-size: 40px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.01em; }
.testata-richiesta__badge { display: flex; gap: var(--spazio-2); flex-wrap: wrap; margin-bottom: var(--spazio-3); }
.testata-richiesta__contatti { display: flex; flex-wrap: wrap; gap: var(--spazio-2) var(--spazio-5); margin-top: var(--spazio-3); }
.testata-richiesta__contatti a, .testata-richiesta__contatti span { display: inline-flex; align-items: center; gap: 6px; }
.testata-richiesta__contatti .icona { color: var(--grigio); }
.testata-richiesta__telefono { font-family: var(--font-titoli); font-weight: 700; font-size: 20px; color: var(--testo); letter-spacing: 0.02em; }
.testata-richiesta__meta { display: grid; grid-template-columns: auto auto; gap: var(--spazio-2) var(--spazio-5); align-content: start; font-size: 14px; }
.testata-richiesta__meta dt { margin: 0; }
.testata-richiesta__meta dd { margin: 0; color: var(--testo); }
.consenso { display: inline-flex; align-items: center; gap: 6px; color: var(--verde); }

.esito-test { display: flex; flex-direction: column; gap: var(--spazio-4); }
.esito-test__titolo { font-size: 28px; font-weight: 800; text-transform: uppercase; color: var(--rosso-testo); }
.esito-test__dati { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: var(--spazio-3) var(--spazio-4); margin: 0; font-size: 14px; }
.esito-test__dati dt { margin: 0; }
.esito-test__dati dd { margin: 0; }

.barra-livello { display: flex; flex-direction: column; gap: var(--spazio-2); }
.barra-livello__scala { position: relative; height: 10px; background: linear-gradient(90deg, var(--rosso-testo), var(--giallo) 50%, var(--verde)); border-radius: var(--raggio-piccolo); }
.barra-livello__indicatore { position: absolute; top: -5px; width: 4px; height: 20px; margin-left: -2px; background: var(--testo); box-shadow: 0 0 0 2px var(--sfondo-card); }
.barra-livello--basso .barra-livello__indicatore { left: 18%; }
.barra-livello--medio .barra-livello__indicatore { left: 50%; }
.barra-livello--buono .barra-livello__indicatore { left: 84%; }
.barra-livello__etichette { display: grid; grid-template-columns: repeat(3, 1fr); font-size: 12px; color: var(--grigio); }
.barra-livello__etichette span:nth-child(2) { text-align: center; }
.barra-livello__etichette span:nth-child(3) { text-align: right; }

.risposte { margin: 0; display: grid; grid-template-columns: minmax(0, 1fr); }
.risposte__voce { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--spazio-4); padding: 10px 0; border-bottom: 1px solid var(--bordo); font-size: 14px; }
.risposte__voce:first-child { padding-top: 0; }
.risposte__voce:last-child { border-bottom: 0; padding-bottom: 0; }
.risposte__domanda { margin: 0; color: var(--testo-secondario); }
.risposte__risposta { margin: 0; font-weight: 600; }
.risposta--no { color: var(--rosso-testo); }
.risposta--si { color: var(--verde); }
.risposta--nonso { color: var(--giallo); }

.messaggio-cliente { margin: 0; padding: var(--spazio-4); background: var(--sfondo-pannello); border-left: 2px solid var(--bordo-forte); color: var(--testo); font-size: 15px; }

/* timeline attività */
.timeline { list-style: none; margin: 0; padding: 0; }
.timeline__voce { position: relative; display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: var(--spazio-3); padding-bottom: var(--spazio-5); }
.timeline__voce:last-child { padding-bottom: 0; }
.timeline__voce::before { content: ""; position: absolute; left: 15px; top: 32px; bottom: 0; width: 1px; background: var(--bordo-forte); }
.timeline__voce:last-child::before { display: none; }
.timeline__icona { display: grid; place-items: center; width: 32px; height: 32px; border-radius: var(--raggio); background: var(--sfondo-hover); color: var(--testo-secondario); }
.timeline__icona .icona { width: 16px; height: 16px; }
.timeline__voce--chiamata .timeline__icona { color: var(--verde); }
.timeline__voce--email .timeline__icona { color: var(--blu); }
.timeline__voce--nota .timeline__icona { color: var(--giallo); }
.timeline__voce--stato .timeline__icona { color: var(--viola); }
.timeline__testa { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px var(--spazio-2); font-size: 14px; min-height: 32px; padding-top: 6px; }
.timeline__tipo { font-weight: 600; }
.timeline__autore { color: var(--testo-secondario); }
.timeline__data { color: var(--grigio); margin-left: auto; font-size: 13px; font-variant-numeric: tabular-nums; }
.timeline__testo { margin-top: 2px; color: var(--testo); font-size: 14px; }
.nuova-attivita { display: flex; flex-direction: column; gap: var(--spazio-3); padding-bottom: var(--spazio-5); margin-bottom: var(--spazio-5); border-bottom: 1px solid var(--bordo); }
.nuova-attivita__piede { display: flex; gap: var(--spazio-3); align-items: flex-end; justify-content: space-between; flex-wrap: wrap; }
.selettore-tipo { display: flex; gap: var(--spazio-1); flex-wrap: wrap; }

/* segmentato */
.segmentato { display: inline-flex; border: 1px solid var(--bordo-forte); border-radius: var(--raggio); padding: 2px; gap: 2px; }
.segmentato__opzione { position: relative; }
.segmentato__opzione input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.segmentato__opzione span { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 0 var(--spazio-3); border-radius: var(--raggio-piccolo); font-size: 14px; color: var(--testo-secondario); }
.segmentato__opzione:hover span { background: var(--sfondo-hover); color: var(--testo); }
.segmentato__opzione input:checked + span { background: var(--sfondo-hover); color: var(--testo); box-shadow: inset 0 -2px 0 var(--rosso); }
.segmentato__opzione input:focus-visible + span { outline: 2px solid var(--rosso-testo); outline-offset: 1px; }

/* blocchi laterali */
.pila { display: flex; flex-direction: column; gap: var(--spazio-4); }
.pila--stretta { gap: var(--spazio-2); }
.zona-pericolo { display: flex; flex-direction: column; gap: var(--spazio-3); }
.zona-pericolo p { font-size: 13px; color: var(--testo-secondario); }

/* avviso in linea */
.avviso { display: flex; gap: var(--spazio-3); align-items: flex-start; padding: var(--spazio-3) var(--spazio-4); border: 1px solid var(--bordo-forte); border-radius: var(--raggio); font-size: 14px; }
.avviso .icona { margin-top: 2px; }
.avviso--errore { border-color: rgba(242, 87, 90, 0.4); background: rgba(242, 87, 90, 0.08); color: var(--testo); }
.avviso--errore .icona { color: var(--rosso-testo); }
.avviso--info { border-color: rgba(90, 169, 242, 0.35); background: rgba(90, 169, 242, 0.07); }
.avviso--info .icona { color: var(--blu); }

/* finestra (dialog nativo) */
.finestra {
  width: min(520px, calc(100vw - 32px)); padding: 0; border: 1px solid var(--bordo-forte); border-radius: var(--raggio);
  background: var(--sfondo-card); color: var(--testo); box-shadow: var(--ombra-finestra);
}
.finestra::backdrop { background: rgba(3, 3, 5, 0.72); }
.finestra--pericolo { border-top: 2px solid var(--rosso); }
.finestra__intestazione { display: flex; align-items: center; justify-content: space-between; gap: var(--spazio-3); padding: var(--spazio-4) var(--spazio-5); border-bottom: 1px solid var(--bordo); }
.finestra__titolo { font-size: 22px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.02em; }
.finestra__corpo { padding: var(--spazio-5); display: flex; flex-direction: column; gap: var(--spazio-4); }
.finestra__corpo p { color: var(--testo-secondario); }
.finestra__corpo strong { color: var(--testo); }
.finestra__azioni { display: flex; justify-content: flex-end; gap: var(--spazio-2); padding: var(--spazio-4) var(--spazio-5); border-top: 1px solid var(--bordo); }
.finestra-anteprima { position: static; display: block; margin: 0; }

/* toast */
.area-toast { position: fixed; right: var(--spazio-5); bottom: var(--spazio-5); z-index: 100; display: flex; flex-direction: column; gap: var(--spazio-2); }
.toast {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--spazio-3); align-items: start;
  width: 360px; max-width: calc(100vw - 32px); padding: var(--spazio-3) var(--spazio-3) var(--spazio-3) var(--spazio-4);
  background: var(--sfondo-hover); border: 1px solid var(--bordo-forte); border-left: 3px solid var(--grigio); border-radius: var(--raggio);
  box-shadow: var(--ombra-toast); font-size: 14px;
}
.toast .icona { margin-top: 2px; }
.toast--successo { border-left-color: var(--verde); }
.toast--successo > .icona { color: var(--verde); }
.toast--errore { border-left-color: var(--rosso-testo); }
.toast--errore > .icona { color: var(--rosso-testo); }
.toast__titolo { font-weight: 600; }
.toast__testo { color: var(--testo-secondario); }
.toast .pulsante-icona { width: 28px; height: 28px; margin: -2px 0; }
.toast--anteprima { box-shadow: none; }

/* stato vuoto */
.stato-vuoto { display: flex; flex-direction: column; align-items: flex-start; gap: var(--spazio-3); padding: var(--spazio-7) var(--spazio-5); }
.stato-vuoto__icona { display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid var(--bordo-forte); border-radius: var(--raggio); color: var(--grigio); }
.stato-vuoto__titolo { font-size: 22px; font-weight: 700; text-transform: uppercase; }
.stato-vuoto__testo { color: var(--testo-secondario); max-width: 48ch; }
.tabella td.tabella__vuota { height: auto; padding: 0; white-space: normal; }

/* caricamento */
.caricamento { display: flex; align-items: center; gap: var(--spazio-3); color: var(--testo-secondario); font-size: 14px; }
.caricamento__giro { width: 18px; height: 18px; border: 2px solid var(--bordo-forte); border-top-color: var(--rosso-testo); border-radius: 50%; animation: giro 0.8s linear infinite; }
.segnaposto { display: block; height: 12px; border-radius: var(--raggio-piccolo); background: linear-gradient(90deg, var(--sfondo-hover) 0%, var(--segnaposto-luce) 50%, var(--sfondo-hover) 100%); background-size: 200% 100%; animation: luccichio 1.4s ease-in-out infinite; }
.segnaposto--corto { width: 40%; } .segnaposto--medio { width: 65%; } .segnaposto--lungo { width: 90%; }
@keyframes giro { to { transform: rotate(360deg); } }
@keyframes luccichio { from { background-position: 200% 0; } to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { .caricamento__giro, .segnaposto { animation: none; } }

/* 5 · PAGINE --------------------------------------------- */

/* accesso e verifica */
.pagina-accesso { display: grid; grid-template-columns: minmax(0, 1fr) minmax(420px, 560px); min-height: 100vh; }
.pagina-accesso__marchio {
  display: flex; flex-direction: column; justify-content: space-between; padding: var(--spazio-7);
  background: var(--sfondo-pannello); border-right: 1px solid var(--bordo);
  background-image: linear-gradient(var(--bordo) 1px, transparent 1px), linear-gradient(90deg, var(--bordo) 1px, transparent 1px);
  background-size: 64px 64px;
}
.pagina-accesso__marchio .logo { padding: 0; border: 0; height: auto; font-size: 32px; }
.pagina-accesso__marchio .logo__immagine { height: 64px; }
.pagina-accesso__dichiarazione { font-family: var(--font-titoli); font-weight: 800; font-size: 64px; line-height: 0.95; text-transform: uppercase; max-width: 10ch; }
.pagina-accesso__dichiarazione span { color: var(--rosso-testo); }
.pagina-accesso__piede { font-size: 13px; color: var(--grigio); }
.pagina-accesso__modulo { display: flex; flex-direction: column; justify-content: center; padding: var(--spazio-7); }
.modulo-accesso { display: flex; flex-direction: column; gap: var(--spazio-4); width: 100%; max-width: 400px; }
.modulo-accesso__titolo { font-size: 36px; font-weight: 800; text-transform: uppercase; }
.modulo-accesso__intro { color: var(--testo-secondario); }
.modulo-accesso__nota { font-size: 13px; color: var(--grigio); padding-top: var(--spazio-4); border-top: 1px solid var(--bordo); }

.codice-otp { display: grid; grid-template-columns: repeat(6, 52px); gap: var(--spazio-2); }
.codice-otp__cifra {
  width: 52px; height: 60px; text-align: center; padding: 0;
  font-family: var(--font-titoli); font-weight: 700; font-size: 28px;
  background: var(--sfondo-campo); border: 1px solid var(--bordo-forte); border-radius: var(--raggio);
}
.codice-otp__cifra:focus { outline: none; border-color: var(--rosso-testo); box-shadow: 0 0 0 1px var(--rosso-testo); }
.codice-otp__cifra:nth-child(3) { margin-right: var(--spazio-3); }
.configurazione-2fa { display: grid; grid-template-columns: 148px minmax(0, 1fr); gap: var(--spazio-4); align-items: start; }
.qr-segnaposto {
  display: grid; place-items: center; width: 148px; height: 148px; background: #fff; color: #060608; border-radius: var(--raggio-piccolo);
  font-family: var(--font-titoli); font-weight: 700; font-size: 13px; letter-spacing: 0.1em; text-transform: uppercase;
}
.codice-testo { display: block; padding: var(--spazio-2) var(--spazio-3); background: var(--sfondo-campo); border: 1px dashed var(--bordo-forte); border-radius: var(--raggio); font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 14px; letter-spacing: 0.08em; word-break: break-all; }
.passi { margin: 0; padding-left: 20px; color: var(--testo-secondario); font-size: 14px; display: flex; flex-direction: column; gap: 4px; }

/* pagina componenti */
.catalogo { display: flex; flex-direction: column; gap: var(--spazio-6); }
.catalogo__sezione { display: flex; flex-direction: column; gap: var(--spazio-3); }
.catalogo__titolo { font-size: 14px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--grigio); padding-bottom: var(--spazio-2); border-bottom: 1px solid var(--bordo); }
.catalogo__riga { display: flex; flex-wrap: wrap; align-items: center; gap: var(--spazio-3); }
.catalogo__griglia { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: var(--spazio-4); align-items: start; }
.catalogo__menu { width: var(--larghezza-menu); height: 420px; position: static; }

/* 6 · RESPONSIVE ----------------------------------------- */
@media (max-width: 1280px) {
  .griglia-dashboard { grid-template-columns: minmax(0, 1fr); }
  .layout-dettaglio { grid-template-columns: minmax(0, 1fr) 300px; }
  .voce-promemoria { grid-template-columns: 88px minmax(0, 1fr) minmax(0, 1.4fr) auto; }
  .voce-promemoria__assegnatario { display: none; }
}
@media (max-width: 1100px) {
  :root { --larghezza-menu: 72px; }
  .logo { justify-content: center; padding: 0; }
  .barra-laterale .logo__immagine { display: none !important; }
  .barra-laterale .logo__pittogramma--per-scuro { display: block; }
  [data-tema="chiaro"] .barra-laterale .logo__pittogramma--per-scuro { display: none; }
  [data-tema="chiaro"] .barra-laterale .logo__pittogramma--per-chiaro { display: block; }
  .menu__testo, .menu__sezione, .utente-corrente__dati { display: none; }
  .menu__voce { justify-content: center; padding: 0; }
  .menu__contatore { position: absolute; top: 2px; right: 2px; min-width: 18px; line-height: 16px; font-size: 11px; padding: 0 3px; }
  .utente-corrente { grid-template-columns: 1fr; justify-items: center; padding: var(--spazio-3); }
  .griglia-indicatori { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .layout-dettaglio { grid-template-columns: minmax(0, 1fr); }
  .colonna--laterale { position: static; }
  .testata-richiesta { grid-template-columns: minmax(0, 1fr); }
  .pagina-accesso { grid-template-columns: minmax(0, 1fr); }
  .pagina-accesso__marchio { padding: var(--spazio-5) var(--spazio-6); }
  .pagina-accesso__dichiarazione, .pagina-accesso__piede { display: none; }
  .pagina-accesso__modulo { align-items: center; }
}
@media (max-width: 900px) {
  .contenuto { padding: var(--spazio-5); }
  .barra-superiore { padding: 0 var(--spazio-5); }
  .barra-superiore__titolo { font-size: 20px; }
  .voce-promemoria { grid-template-columns: 80px minmax(0, 1fr) auto; }
  .voce-promemoria__nota { grid-column: 2 / 3; }
}

/* ==========================================================================
   Aggiunte per l'applicazione (non nella grafica di Claude Design)
   ========================================================================== */
.larghezza-0 { width: 0; }
a.avatar { text-decoration: none; }
.qr svg { display: block; width: 100%; height: 100%; }
.qr { padding: 6px; }
.esiti__voce a { color: inherit; text-decoration: none; }
.esiti__voce a:hover { text-decoration: underline; }
.form-in-linea { display: inline; }
.date-personalizzate { display: flex; gap: var(--spazio-2); align-items: center; flex-wrap: wrap; }
.dati-cancellati { color: var(--grigio); font-style: italic; }
@media (max-width: 600px) { .campi-in-riga { grid-template-columns: minmax(0, 1fr); } }
.contenitore-tabella { position: relative; } /* tiene dentro le etichette .solo-lettori delle intestazioni */

/* Richieste che chi guarda non ha ancora aperto */
.riga-da-leggere .tabella__principale a { font-weight: 700; }
.punto-da-leggere { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--rosso, #ca1518); margin-right: 8px; vertical-align: middle; }