/* === Gestionale — identità corporate (stile approvato) === */
:root {
  --mono: "Cascadia Code", "Consolas", monospace;
}

/* === Tema scuro === */
[data-tema="scuro"] {
  color-scheme: dark;
}
[data-tema="scuro"] .ramo-voci li { border-top-color: var(--line); }
[data-tema="scuro"] .galleria-voce, [data-tema="scuro"] .sel-icona-voce,
[data-tema="scuro"] .filtro-menu > summary { background: var(--card); color: var(--ink); }

[data-tema="scuro"] img.icona-img { filter: brightness(1.35); }
* { box-sizing: border-box; }
/* Una sola freccia nelle <summary> */
summary::-webkit-details-marker { display: none; }
summary::marker { content: ""; }

/* Sfondo anche su <html> */
html { background: var(--paper); color-scheme: light; }
html, body { margin: 0; }
body { font-family: var(--font); background: var(--paper); color: var(--ink); font-size: 15px; }
a { color: var(--blu); text-decoration: none; }
a:hover { text-decoration: underline; }
code { font-family: var(--mono); font-size: .85em; background: var(--blu-tenue); padding: 1px 5px; border-radius: 4px; }
:focus-visible { outline: 2px solid var(--blu); outline-offset: 2px; }

/* Shell */
.shell { display: flex; min-height: 100vh; }
.sidebar {
  width: 232px; flex: 0 0 232px; background: var(--ink); color: #cfd8e2;
  display: flex; flex-direction: column;
}
.brand { display: flex; align-items: center; gap: 10px; padding: 18px 16px; }
.brand-mark {
  width: 34px; height: 34px; border-radius: var(--r); background: var(--blu-pieno);
  color: #fff; font-weight: 700; font-size: 18px;
  display: inline-flex; align-items: center; justify-content: center;
}
.brand-name { font-weight: 600; color: #fff; letter-spacing: .3px; }
.nav { display: flex; flex-direction: column; padding: 6px 10px 16px; gap: 1px; flex: 1; overflow-y: auto; }

.main { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.topbar {
  background: var(--card); border-bottom: 1px solid var(--line);
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 22px; min-height: 58px; position: relative; z-index: 20;
}
.page-title { font-size: 19px; margin: 0; font-weight: 600; }
/* Contenuto centrato */
.content { padding: 22px; max-width: 1180px; width: 100%; margin-inline: auto; }

/* Menu utente */
/* Menu utente: animazione della freccia */

/* Carte */
.card {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r);
  padding: 18px; margin-bottom: 18px;
}
.card h2 { margin: 0 0 10px; font-size: 16px; }
.card .hint, .hint { color: var(--ink-soft); font-size: 13px; }
.grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.stat { display: flex; align-items: baseline; gap: 8px; }
.stat b { font-size: 26px; }

/* Tabelle */
.tbl-wrap { overflow-x: auto; }
.tbl { width: 100%; border-collapse: collapse; background: var(--card); font-size: 14px; }
.tbl th {
  background: var(--tbl-testa); color: var(--tbl-testa-testo);
  text-align: left; padding: 8px 10px;
  position: sticky; top: 0; font-weight: 600; white-space: nowrap;
}
.tbl th a { color: var(--tbl-testa-testo); }
.tbl td { padding: 7px 10px; border-bottom: 1px solid var(--line); vertical-align: top; }
.tbl tbody tr:hover { background: var(--blu-tenue); }

/* Form */
.form-row { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 12px; }
.form-group { display: flex; flex-direction: column; gap: 4px; min-width: 180px; flex: 1; }
.form-group.grow { flex: 2; }
label { font-size: 13px; font-weight: 600; color: var(--ink-soft); }
input[type=text], input[type=password], input[type=number], input[type=date],
input[type=email], input[type=file], input[type=search], input[type=time],
input[type=datetime-local], select, textarea {
  font: inherit; padding: 7px 9px; border: 1px solid var(--bordo-campo); border-radius: var(--r);
  background: var(--campo); color: var(--ink); width: 100%;
}
/* il calendario e le frecce dei campi nativi seguono il tema */
input[type=date], input[type=time], input[type=datetime-local] { color-scheme: inherit; }
textarea { min-height: 84px; resize: vertical; }
input:focus, select:focus, textarea:focus { border-color: var(--blu); }
.check { display: flex; gap: 8px; align-items: center; font-size: 14px; font-weight: 400; color: var(--ink); }
.check input { width: auto; }
.opzioni-multi { display: flex; flex-wrap: wrap; gap: 8px 16px; padding: 6px 0; }

/* Bottoni */
.btn {
  display: inline-flex; align-items: center; gap: 6px; font: inherit; cursor: pointer;
  background: var(--blu-pieno); color: #fff; border: 1px solid var(--blu-pieno-hover);
  border-radius: var(--r); padding: 7px 14px; font-size: 14px;
}
.btn:hover { background: var(--blu-pieno-hover); text-decoration: none; }
.btn-ghost { background: transparent; color: var(--blu); border-color: var(--line); }
.btn-ghost:hover { background: var(--blu-tenue); color: var(--blu-scuro); }
.btn-danger { background: var(--err); border-color: #8c2626; }
.btn-danger:hover { background: #8c2626; }
.btn-sm { padding: 4px 10px; font-size: 13px; }
.form-actions { display: flex; gap: 10px; margin-top: 14px; }

/* Badge e flash */
.badge { display: inline-block; padding: 2px 9px; border-radius: 999px; font-size: 12px; font-weight: 600; }
.badge-on { background: var(--ok-bg); color: var(--ok); }
.badge-off { background: var(--err-bg); color: var(--err); }
.badge-blu { background: var(--blu-tenue); color: var(--blu-scuro); }
.badge-multi { background: var(--blu-tenue); color: var(--blu-scuro); margin: 0 3px 3px 0; }
.flash { padding: 10px 14px; border-radius: var(--r); margin-bottom: 14px; font-size: 14px; }
.flash-ok { background: var(--ok-bg); color: var(--ok); }
.flash-err { background: var(--err-bg); color: var(--err); }
.flash-warn { background: var(--warn-bg); color: var(--warn-testo); }
/* Avviso: record salvato da un altro mentre era aperto */
.avviso-conflitto { background: var(--warn-bg); color: var(--warn-testo); border: 1px solid var(--warn-bordo); border-radius: var(--r); padding: 12px 14px; margin-bottom: 16px; }
.avviso-conflitto p { margin: 0 0 8px; }
.avviso-conflitto-titolo { font-weight: 600; }
.avviso-conflitto .tbl-wrap { background: var(--card); color: var(--ink); border-radius: var(--r); margin: 8px 0 4px; max-height: 260px; overflow: auto; }
.avviso-conflitto-tabella td.cambiato { font-weight: 600; }
.avviso-conflitto-tabella tr.riga-conflitto td { background: var(--warn-bg); }
.badge-conflitto { background: var(--err-bg); color: var(--err); }
.avviso-conflitto .form-actions { margin-top: 10px; }

/* Utilità */
.toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; margin-bottom: 14px; }
.toolbar .form-group { min-width: 150px; flex: 0 1 auto; }
.paginazione { display: flex; gap: 8px; align-items: center; margin-top: 12px; font-size: 14px; }

.login-shell { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: var(--ink); }
.login-card { width: 360px; background: var(--card); border-radius: 8px; padding: 26px; }
.login-card .brand { padding: 0 0 14px; }
.login-card .brand-name { color: var(--ink); }

/* Barra mobile */

@media (max-width: 1024px) {
  .shell { flex-direction: column; }

  

  
  .sidebar {
    position: fixed; inset: 0 auto 0 0; width: 260px; transform: translateX(-100%);
    transition: transform .18s ease; z-index: 80;
  }

  

  .sidebar .brand { display: none; }
  .content { padding: 14px; }
  .topbar { padding: 8px 14px; }
  .form-group { min-width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  /* niente spostamenti: restano i cambi di colore e le dissolvenze */
  *, *::before, *::after {
    transition-property: color, background-color, border-color, outline-color, opacity, box-shadow !important;
  }
}

/* Filtri a tendina multi-selezione */
.filtro-menu { position: relative; }
.filtro-menu > summary {
  list-style: none; cursor: pointer; user-select: none;
  border: 1px solid var(--bordo, #d7dce3); border-radius: 8px;
  padding: 8px 12px; background: var(--carta, #fff); font-size: .92rem;
  white-space: nowrap;
}
.filtro-menu > summary::-webkit-details-marker { display: none; }
.filtro-menu > summary::after { content: " ▾"; color: var(--grigio-500, #6b7280); }
/* Pulsanti dei filtri senza freccia */
.filtro-menu > summary.filter-dropdown-btn::after { content: none; }
.filtro-menu[open] > summary { border-color: var(--blu, #1e3a5f); }
.filtro-voci {
  position: absolute; z-index: 30; min-width: 210px; max-height: 260px; overflow: auto;
  background: var(--carta, #fff); border: 1px solid var(--bordo, #d7dce3);
  border-radius: 10px; box-shadow: 0 10px 24px rgba(15, 26, 42, .14);
  padding: 8px 10px; margin-top: 6px; display: grid; gap: 2px;
}
.filtro-voci .check { display: flex; gap: 8px; align-items: center; padding: 3px 2px; }

/* Lista valori: chips per il testo lungo */
.lista-valori-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.lista-chip {
  border: 1px solid var(--bordo, #d7dce3); background: var(--sfondo, #f5f7fa);
  border-radius: 999px; padding: 3px 10px; font-size: .82rem; cursor: pointer;
}
.lista-chip:hover { border-color: var(--blu, #1e3a5f); }

/* Autocomplete vincolato da tabella esterna */
.autocomplete-wrapper { position: relative; }
.autocomplete-list {
  position: absolute; z-index: 40; left: 0; right: 0; margin: 4px 0 0; padding: 4px;
  list-style: none; background: var(--carta, #fff);
  border: 1px solid var(--bordo, #d7dce3); border-radius: 10px;
  box-shadow: 0 10px 24px rgba(15, 26, 42, .14); max-height: 240px; overflow: auto;
}
.autocomplete-list li { padding: 7px 9px; border-radius: 7px; cursor: pointer; font-size: .9rem; }
.autocomplete-list li:hover { background: var(--sfondo, #f5f7fa); }
.input-error { border-color: var(--err) !important; }
.input-error-msg { font-size: .78rem; color: var(--err); margin-top: 2px; }

/* Dettagli inline (tabella esterna nel form campo) */
.card-inline { border: 1px dashed var(--bordo, #d7dce3); border-radius: 10px; padding: 10px 14px; margin: 10px 0; }
.card-inline > summary { cursor: pointer; font-weight: 600; }

/* Import CSV */
.import-preview .col-esclusa { opacity: .4; text-decoration: line-through; }
.import-step { margin: 14px 0; }

/* Titolo-tendina: il nome della tabella è il selettore */
.page-title { display: flex; align-items: center; gap: 10px; }

/* Pannello filtri */
.filter-panel {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-start;
  margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--bordo, #d7dce3);
}
.filter-field { position: relative; }
.filter-dropdown-btn {
  list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 8px;
  border: 1px solid var(--bordo, #d7dce3); border-radius: 999px; padding: 7px 14px;
  background: var(--carta, #fff); font-size: .88rem; white-space: nowrap;
}
.filter-dropdown-btn::-webkit-details-marker { display: none; }
.filter-dropdown-btn.active { border-color: var(--blu, #1e3a5f); background: var(--sfondo, #f5f7fa); }
.filter-dropdown-label { font-weight: 600; }
.filter-dropdown-value { color: var(--grigio-500, #6b7280); }

.filter-active-count {
  background: var(--blu-pieno); color: #fff; border-radius: 999px;
  font-size: .72rem; padding: 1px 7px; font-weight: 700;
}
.filter-dropdown-panel {
  position: absolute; z-index: 50; margin-top: 6px; min-width: 240px;
  background: var(--carta, #fff); border: 1px solid var(--bordo, #d7dce3);
  border-radius: 12px; box-shadow: 0 12px 26px rgba(15, 26, 42, .16); overflow: hidden;
}
.filter-dropdown-header {
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  padding: 9px 12px; border-bottom: 1px solid var(--bordo, #d7dce3);
  font-size: .74rem; font-weight: 600; text-transform: uppercase;
  letter-spacing: .04em; color: var(--grigio-500, #6b7280);
}
.filter-dropdown-clear { font-size: .74rem; color: var(--err); text-decoration: none; }
.filter-dropdown-list { max-height: 260px; overflow: auto; padding: 6px; display: grid; gap: 1px; }
.filter-dropdown-item {
  display: flex; align-items: center; gap: 9px; padding: 6px 9px;
  border-radius: 7px; cursor: pointer; font-size: .9rem;
}
.filter-dropdown-item:hover { background: var(--sfondo, #f5f7fa); }
.filter-dropdown-item.checked { background: var(--sfondo, #f5f7fa); font-weight: 600; }
.filter-dropdown-item.special { font-style: italic; color: var(--grigio-500, #6b7280); }
.filter-dropdown-empty { padding: 10px 12px; font-size: .85rem; color: var(--grigio-500, #6b7280); }
/* Cella delle categorie */

/* Filtri sempre in vista (sul telefono dietro il pulsante) */
#pannello-filtri { display: flex; }
.barra-filtri { display: flex; margin: 0 0 10px; }
.solo-telefono { display: none !important; }
@media (max-width: 640px) {
  #pannello-filtri { display: none; }
  #pannello-filtri.zona-aperta { display: flex; }
  .barra-filtri.solo-telefono { display: flex !important; }
  .btn.solo-telefono { display: inline-flex !important; }
}

/* Prima colonna e spunte ferme durante lo scorrimento */
.tbl-scroll.con-frecce .tbl-dati .col-check,
.tbl-scroll.con-frecce .tbl-dati .col-ferma {
  position: sticky; z-index: 3; background: var(--card);
}
.tbl-scroll.con-frecce .tbl-dati .col-check { left: 0; }
.tbl-scroll.con-frecce .tbl-dati .col-ferma { left: 44px; box-shadow: 1px 0 0 var(--line); }
/* Senza colonna delle spunte */
.tbl-scroll.con-frecce .tbl-dati tr > .col-ferma:first-child { left: 0; }
.tbl-scroll.con-frecce .tbl-dati thead .col-check,
.tbl-scroll.con-frecce .tbl-dati thead .col-ferma { z-index: 5; background: var(--tbl-testa); }

/* Grafico a barre con molte voci: riquadro a scorrimento */
/* Oltre dodici voci il grafico scorre */
.barre-scorrevoli {
  max-height: 340px; overflow-y: auto; padding-right: 6px;
  border: 1px solid var(--line); border-radius: var(--r); padding: 8px;
}
.barre-nota { font-size: .8rem; color: var(--ink-soft); margin: 6px 0 0; }

/* Frecce di scorrimento della tabella */
.tbl-scroll.con-frecce { position: relative; }
/* Frecce laterali (mobile.js) */

/* Colonna delle categorie */
.badge-cat {
  display: inline-flex; align-items: center; gap: 5px;
  background: var(--blu-tenue); color: var(--blu-scuro);
  border-radius: 999px; padding: 1px 9px; font-size: .82em; font-weight: 600;
  margin: 1px 3px 1px 0;
}

.cella-nidificata { cursor: help; }

/* Filtro ad albero: categoria e sottocategorie in una sola tendina */
.filtro-ramo { border-bottom: 1px solid var(--line); }
.filtro-ramo:last-child { border-bottom: 0; }
.filtro-ramo-testa { display: flex; align-items: center; }
.filtro-ramo-testa .filter-dropdown-item { flex: 1; font-weight: 600; }
.filtro-ramo-freccia {
  border: 0; background: none; cursor: pointer; color: var(--ink-soft);
  font-size: .8rem; padding: 4px 6px; line-height: 1;
}
.filtro-ramo-freccia:hover { color: var(--blu); }
.filter-dropdown-item.sotto { padding-left: 30px; font-size: .88em; }
.filtro-ramo-voci[hidden] { display: none; }
/* Albero delle date: anni, mesi, giorni */
.filtro-albero-date .filtro-ramo-voci { padding-left: 16px; }
.filtro-albero-date .filtro-ramo .filtro-ramo { border-bottom: 0; }
.filtro-albero-date .filtro-ramo .filtro-ramo .filtro-ramo-testa .filter-dropdown-item { font-weight: 500; }
.filtro-albero-date .filter-dropdown-item.sotto { padding-left: 28px; font-variant-numeric: tabular-nums; }

/* Filtro data: scorciatoie + intervallo, sopra l'albero di anni, mesi e giorni */
.filtro-data { padding: 8px 10px; border-bottom: 1px solid var(--bordo, #d7dce3); }
.filtro-data-scorciatoie { display: flex; flex-wrap: wrap; gap: 5px; }
.filtro-data-intervallo { display: flex; gap: 8px; margin-top: 7px; }
.filtro-data-intervallo label { display: flex; align-items: center; gap: 5px;
  font-size: .8rem; color: var(--ink-soft); flex: 1; }
.filtro-data-intervallo input { width: 100%; font-size: .8rem; padding: 3px 5px; }
.filtro-data .hint { display: block; margin-top: 6px; font-size: .75rem; }

/* Barra di conferma in fondo alla tendina */
.filter-dropdown-azioni {
  display: flex; justify-content: flex-end; gap: 6px;
  padding: 8px 10px; border-top: 1px solid var(--bordo, #d7dce3);
  background: var(--sfondo, #f5f7fa);
}
.toolbar-btn-active { border-color: var(--blu, #1e3a5f); }

/* Tabella dati: scorrimento orizzontale e altezza massima */
.tbl-scroll {
  overflow-x: auto; overflow-y: visible; -webkit-overflow-scrolling: touch; max-width: 100%;
}
/* La griglia si adatta alla pagina, scorre solo se serve */
/* Larghezza delle colonne */
/* Larghezza delle colonne: sul contenuto, mai sotto il contenitore */
.tbl-dati { width: max-content; min-width: 100%; table-layout: auto; }
.tbl-dati th, .tbl-dati td {
  white-space: normal; word-break: break-word;
  min-width: 0; max-width: 340px;
  padding-left: var(--tbl-gap, 14px); padding-right: var(--tbl-gap, 14px);
}
/* Forbice di larghezza secondo il numero di colonne */
.tbl-dati td:not(.col-riempi):not(.col-check),
.tbl-dati th:not(.col-riempi):not(.col-check) {
  min-width: var(--col-min, 90px);
  max-width: var(--col-max, 340px);
}
/* Larghezza dal contenuto reale (--col-car) */
/* --col-car come minimo, entro il massimo della fascia */
.tbl-dati th.col-piena {
  min-width: min(calc((var(--col-car, 10) * 0.55em) + 2.4em), var(--col-max, 340px));
}
/* A capo solo per il testo lungo */
.tbl-dati td.cella-lunga { white-space: normal; }
/* Categorie su una riga sola */
.tbl-dati td.cella-categorie { white-space: nowrap; }
.badge-altri {
  background: var(--ink-soft); color: var(--card); border-radius: 999px;
  padding: 1px 8px; font-size: .78em; font-weight: 700; cursor: help;
}
/* Colonne vuote: larghezza minima */
.tbl-dati th.col-vuota, .tbl-dati td.col-vuota {
  min-width: 56px; width: 56px; max-width: 90px;
}
/* Fasce: minimo e massimo di sicurezza */
.tbl-poche { --col-min: 140px; --col-max: 520px; }
.tbl-medie { --col-min: 110px; --col-max: 460px; }
.tbl-molte { --col-min: 80px; --col-max: 400px; }
.tbl-moltissime { --col-min: 64px; --col-max: 360px; }
.tbl-dati th { white-space: nowrap; }
/* Solo righe e contorno, niente linee verticali */
.tbl-dati { border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; }
.tbl-dati td, .tbl-dati th { border-left: 0; border-right: 0; }
/* Colonna di riempimento: prende lo spazio che avanza */
.tbl-dati .col-riempi {
  width: auto; max-width: none; min-width: 0; padding: 0; border-left: 0;
}
.tbl-dati thead th { position: sticky; top: 0; z-index: 2;
  background: var(--tbl-testa); color: var(--tbl-testa-testo); }
.tbl-dati thead th a { color: var(--tbl-testa-testo); text-decoration: none; }
.tbl-dati thead th a:hover { color: #ffffff; text-decoration: underline; }
.tbl-dati .col-check { width: 34px; }

.riga-record { cursor: pointer; }
.riga-record:hover td { background: var(--sfondo, #f5f7fa); }

/* Finestra modale (scheda record e modifica in blocco) */
body.modale-aperta { overflow: hidden; }
.modale { position: fixed; inset: 0; z-index: 200; display: flex; align-items: center; justify-content: center; padding: 20px; }
.modale[hidden] { display: none; }
.modale-sfondo { position: absolute; inset: 0; background: rgba(15, 26, 42, .5); }
.modale-box {
  position: relative; z-index: 1; width: min(860px, 100%); max-height: 90vh;
  display: flex; flex-direction: column; background: var(--carta, #fff);
  border-radius: 14px; box-shadow: 0 24px 60px rgba(15, 26, 42, .3); overflow: hidden;
}
.modale-testa {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 14px 18px; border-bottom: 1px solid var(--bordo, #d7dce3);
}
.modale-testa h2 { margin: 0; font-size: 1.05rem; }
.modale-corpo { padding: 16px 18px; overflow: auto; }
.modale-corpo .card { box-shadow: none; border: 0; padding: 0; margin: 0; }

/* Form record: campi a flusso, ognuno largo quanto la sua misura (--car), mai più della riga */
.form-griglia {
  display: flex; flex-wrap: wrap;
  gap: 12px 18px; align-items: start;
}
.form-griglia .form-group {
  min-width: 0; margin: 0;
  /* casella da --car (+ spazio per la freccia delle liste), almeno 10em per l'etichetta */
  flex: 0 1 clamp(10em, calc((var(--car, 15) * 0.55em) + 3.4em), 100%);
  max-width: 100%;
}
.form-griglia .campo-largo { flex: 1 1 100%; max-width: 100%; }
/* Data e spunta: larghezza del controllo */
.form-griglia .campo-date, .form-griglia .campo-boolean {
  flex-basis: 170px; max-width: 220px;
}
/* Orario: casella da 5 caratteri (hh:mm) */
input[data-orario]:not(.valore-criterio) {
  box-sizing: content-box; width: 5ch; max-width: 5ch;
  font-variant-numeric: tabular-nums;
}
.form-griglia .campo-time { flex: 0 0 auto; max-width: none; }

/* Pulsante del lettore di codici a barre accanto alla casella */
.con-lettore { display: flex; gap: 6px; align-items: stretch; }
.con-lettore > input, .con-lettore > textarea { flex: 1 1 auto; min-width: 0; }
.con-lettore > textarea { align-self: stretch; }
.btn-lettore { flex: 0 0 auto; padding: 0 9px; justify-content: center; align-self: stretch; }
.con-lettore > textarea + .btn-lettore { align-self: flex-start; min-height: 36px; }
.form-griglia .form-group:not(.campo-largo):has(.con-lettore) {
  flex-basis: clamp(13em, calc((var(--car, 15) * 0.55em) + 6.4em), 100%);
}
/* Finestra del lettore: sopra a tutto, anche alla finestra del record */
.lettore-modale { z-index: 260; }
.lettore-box { width: min(560px, 100%); }
.lettore-corpo { padding: 14px 18px 16px; }
.lettore-video {
  position: relative; overflow: hidden; border-radius: 10px; background: #000;
  aspect-ratio: 4 / 3; max-height: 62vh; margin: 0 auto;
}
.lettore-video video { display: block; width: 100%; height: 100%; object-fit: cover; }
/* Mirino del lettore */
.lettore-mirino {
  position: absolute; inset: 22% 8%; border: 2px solid rgba(255, 255, 255, .9);
  border-radius: 8px; box-shadow: 0 0 0 999px rgba(0, 0, 0, .28); pointer-events: none;
}
.lettore-mirino::after {
  content: ""; position: absolute; left: 6%; right: 6%; top: 50%; height: 2px;
  background: rgba(230, 60, 60, .85);
}
.lettore-stato { margin: 10px 0 0; font-size: 14px; color: var(--ink-soft); min-height: 1.4em; }
.lettore-stato.lettore-errore { color: var(--err); }
.lettore-corpo .form-actions { justify-content: flex-end; }

/* Selettore dell'orario: due rulli sotto il campo */
.orario-selettore {
  --orario-riga: 32px;
  display: flex; width: max-content; align-items: center; gap: 2px;
  margin-top: 6px; padding: 4px 8px; position: relative;
  background: var(--card, #fff); border: 1px solid var(--line);
  border-radius: 10px; box-shadow: 0 6px 18px rgba(15, 26, 42, .14);
}
/* Fascia centrale: voce scelta */
.orario-selettore::before {
  content: ""; position: absolute; left: 6px; right: 6px; top: 50%;
  height: var(--orario-riga); transform: translateY(-50%);
  background: var(--blu-tenue, #e8eef6); border-radius: 6px; pointer-events: none;
}
.orario-colonna {
  position: relative; width: 3.4em;
  height: calc(var(--orario-riga) * var(--orario-righe, 3));
  overflow-y: auto; scroll-snap-type: y mandatory; overscroll-behavior: contain;
  scrollbar-width: none; outline: none;
}
.orario-colonna::-webkit-scrollbar { display: none; }
/* Riga vuota sopra e sotto */
.orario-colonna::before, .orario-colonna::after {
  content: ""; display: block; height: var(--orario-riga);
}
.orario-colonna:focus-visible { box-shadow: 0 0 0 2px var(--blu); border-radius: 6px; }
.orario-voce {
  height: var(--orario-riga); line-height: var(--orario-riga);
  text-align: center; scroll-snap-align: center; cursor: pointer;
  color: var(--ink-soft); font-variant-numeric: tabular-nums;
}
.orario-voce.orario-scelta { color: var(--ink); font-weight: 700; }
.orario-separatore { font-weight: 700; color: var(--ink); position: relative; }
@media (prefers-reduced-motion: reduce) {
  .orario-colonna { scroll-behavior: auto; }
}
.campo input, .campo select, .campo textarea { max-width: 100%; }
/* Campo bloccato (primario o non modificabile) */
.campo-bloccato input, .campo-bloccato select, .campo-bloccato textarea {
  background: var(--sfondo, #eef1f4); cursor: not-allowed;
}
.campo-date input { max-width: 190px; }
.campo-boolean .check-bool { width: max-content; }
.campo-select select { max-width: 460px; }
/* Lista con dimensione scelta */
.campo-select select.con-dimensione {
  width: calc((var(--car) * 0.55em) + 3.4em); max-width: 100%;
}
/* Testo e Numero: larghezza da --car */
.campo-text input, .campo-number input {
  max-width: calc((var(--car, 15) * 0.55em) + 2.4em);
}
.campo-textarea textarea { width: 100%; max-width: 100%; resize: vertical; }
/* Testo lungo: piena larghezza senza misura scelta */
.campo-textarea textarea.con-dimensione {
  width: auto; max-width: calc((var(--car) * 0.55em) + 2.4em);
}
/* Elenchi lunghi a scorrimento */
.campo-multiselect .ms-group,
.campo .lista-valori-chips {
  max-height: 168px; overflow: auto;
  border: 1px solid var(--bordo, #d7dce3); border-radius: 8px;
  padding: 8px; background: var(--carta, #fff);
}
/* Categorie e sottocategorie (con «tutte») */

.campo-multiselect .ms-group { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 2px 12px; }
/* Larghezza adattata al contenuto */
.modale-corpo .form-griglia { gap: 10px 16px; }
@media (max-width: 640px) {
  .campo-date input { max-width: 100%; }
}

/* Scheda record nella finestra */
.scheda-campi { margin: 0; display: grid; gap: 2px; }
.scheda-riga {
  display: grid; grid-template-columns: minmax(140px, 30%) 1fr; gap: 12px;
  padding: 8px 10px; border-radius: 8px;
}
.scheda-riga dt { margin: 0; font-size: .78rem; font-weight: 600; text-transform: uppercase;
  letter-spacing: .03em; color: var(--ink-soft); opacity: .72; align-self: center; }
.scheda-riga dd { margin: 0; font-size: .95rem; font-weight: 600; color: var(--ink); }
.scheda-testo-lungo { white-space: pre-wrap; }
.scheda-tracce {
  display: flex; flex-wrap: wrap; gap: 6px 20px; margin-top: 14px; padding: 10px 12px;
  border: 1px dashed var(--bordo, #d7dce3); border-radius: 10px;
  font-size: .8rem; color: var(--grigio-500, #6b7280);
}
.modale-azioni {
  display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end;
  margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--bordo, #d7dce3);
}

/* Pulsante filtri con icona */

.bulk-riga + .bulk-riga { margin-top: 4px; }
/* Modifica in blocco: categoria e sottocategoria affiancate */
.bulk-valore-controllo { display: flex; gap: 6px; flex-wrap: wrap; }
.bulk-valore-controllo > select, .bulk-valore-controllo > input { flex: 1 1 auto; min-width: 0; }

.per-pagina-menu .filtro-voci a {
  display: block; padding: 7px 10px; border-radius: 7px; text-decoration: none;
  color: inherit; font-size: .9rem; white-space: nowrap;
}
.per-pagina-menu .filtro-voci a:hover { background: var(--sfondo, #f5f7fa); }
.per-pagina-menu .filtro-voci a.attiva { background: var(--sfondo, #f5f7fa); font-weight: 700; }
.per-pagina-menu .filtro-voci { right: 0; left: auto; }

.paginazione-basso { display: flex; align-items: center; gap: 10px; margin-top: 12px; }
.riga-modifica-campo { background: var(--sfondo, #f5f7fa); padding: 14px !important; }

/* Permessi: gruppi e utenti, con ricerca */
.permessi-colonne { display: grid; grid-template-columns: repeat(auto-fit, minmax(330px, 1fr)); gap: 18px; }
.permessi-blocco h3 { margin: 0 0 8px; font-size: .95rem; }
.permessi-lista {
  border: 1px solid var(--bordo, #d7dce3); border-radius: 10px; padding: 6px;
  max-height: 268px; overflow-y: auto;      /* ~5 righe, poi scorre */
}
.permesso-riga {
  display: grid; grid-template-columns: 1fr auto auto; gap: 10px; align-items: center;
  padding: 8px 10px; border-radius: 8px;
}
.permesso-riga:nth-child(odd) { background: var(--sfondo, #f5f7fa); }
.permesso-riga label { font-size: .74rem; color: var(--grigio-500, #6b7280); display: grid; gap: 2px; }
.permesso-nome { font-size: .92rem; font-weight: 600; display: grid; }
.permesso-nome .hint { font-weight: 400; }

/* Grafici dei report (SVG e barre) */
.grafici-griglia { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 14px; margin-bottom: 14px; }
.grafico h2 { margin-top: 0; font-size: 1rem; }
.barre { display: grid; gap: 7px; }
.barra-riga { display: grid; grid-template-columns: minmax(80px, 26%) 1fr auto; gap: 10px; align-items: center; }
.barra-et { font-size: .84rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.barra-traccia { background: var(--sfondo, #f5f7fa); border-radius: 999px; height: 16px; overflow: hidden; }
.barra-valore { display: block; height: 100%; border-radius: 999px; }
.barra-num { font-size: .84rem; font-variant-numeric: tabular-nums; }
.torta-riga { display: flex; flex-wrap: wrap; gap: 18px; align-items: center; }
.torta { width: 150px; height: 150px; transform: rotate(-90deg); }
.legenda { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; font-size: .85rem; }
.legenda-inline { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 8px; }
.legenda .chiave { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 7px; }
.grafico-linea { width: 100%; height: 150px; color: #1e3a5f; }

/* Otto colori della palette, a rotazione */
.barra-0, .chiave-0 { background: #1e3a5f; } .fetta-0 { stroke: #1e3a5f; }
.barra-1, .chiave-1 { background: #c2410c; } .fetta-1 { stroke: #c2410c; }
.barra-2, .chiave-2 { background: #0f766e; } .fetta-2 { stroke: #0f766e; }
.barra-3, .chiave-3 { background: #b91c1c; } .fetta-3 { stroke: #b91c1c; }
.barra-4, .chiave-4 { background: #6d28d9; } .fetta-4 { stroke: #6d28d9; }
.barra-5, .chiave-5 { background: #a16207; } .fetta-5 { stroke: #a16207; }
.barra-6, .chiave-6 { background: #2563eb; } .fetta-6 { stroke: #2563eb; }
.barra-7, .chiave-7 { background: #4d7c0f; } .fetta-7 { stroke: #4d7c0f; }

/* Elementi cliccabili in homepage */
.card-link { display: block; text-decoration: none; color: inherit; transition: box-shadow .15s, transform .15s; }
.card-link:hover { box-shadow: 0 10px 24px rgba(15, 26, 42, .12); transform: translateY(-1px); }
.riga-link { cursor: pointer; }
.riga-link:hover td { background: var(--sfondo, #f5f7fa); }

/* [hidden] vince sui display dei componenti */
[hidden] { display: none !important; }

/* Permessi allegati per soggetto */
.permessi-allegati { grid-column: 1 / -1; }
.permessi-allegati > summary { cursor: pointer; font-size: .78rem; color: var(--grigio-500, #6b7280); }
.permessi-allegati-voci { display: flex; flex-wrap: wrap; gap: 8px 14px; padding: 8px 4px 2px; }

/* Ricerca dentro la tendina del filtro */
.filter-dropdown-cerca { padding: 8px 8px 4px; border-bottom: 1px solid var(--bordo, #d7dce3); }
.filter-dropdown-cerca input {
  width: 100%; box-sizing: border-box; border: 1px solid var(--bordo, #d7dce3);
  border-radius: 8px; padding: 6px 9px; font-size: .87rem;
}
.filter-dropdown-cerca input:focus { outline: 2px solid var(--blu, #1e3a5f); outline-offset: 1px; }

/* Pulsante di eliminazione e celle booleane */
.btn-danger { background: var(--err); border-color: var(--err); color: #ffffff; }
.btn-danger:hover { background: #8f2a2a; border-color: #8f2a2a; color: #ffffff; }
.btn-danger .filter-active-count { background: rgba(255,255,255,.28); color: #ffffff; }
/* Modifica in blocco: azione secondaria */
#btn-bulk { background: var(--blu-tenue); border-color: var(--blu); color: var(--blu-scuro); }
#btn-bulk:hover { background: var(--blu-pieno); border-color: var(--blu-pieno); color: #ffffff; }
#btn-bulk:hover .filter-active-count { background: rgba(255,255,255,.3); }
.bool-cella { font-weight: 700; }
.check-bool { display: inline-flex; align-items: center; gap: 8px; }

.autocomplete-suggerimenti { position: relative; }

/* Export report con scelta delle sezioni */
.export-report .filtro-voci { right: 0; left: auto; min-width: 210px; }
.export-sezioni { border-bottom: 1px solid var(--bordo, #d7dce3); padding-bottom: 8px; margin-bottom: 6px; display: grid; gap: 3px; }
.link-export { display: block; padding: 7px 10px; border-radius: 7px; text-decoration: none; color: inherit; font-size: .9rem; }
.link-export:hover { background: var(--sfondo, #f5f7fa); }
button.link-export { width: 100%; background: none; border: 0; text-align: left; font: inherit; font-size: .9rem; cursor: pointer; }

/* Pagina minima (finestre di servizio, es. allegati) */
.pagina-minima { background: var(--sfondo, #f5f7fa); margin: 0; }
.contenuto-minimo { max-width: 860px; margin: 0 auto; padding: 22px 18px 32px; }
.contenuto-minimo .page-title { font-size: 1.15rem; margin: 0 0 14px; }

/* Schede e righe cliccabili: solo sollevamento */
.card-link, .card-link:hover, .card-link h2, .card-link:hover h2 { text-decoration: none; }
.riga-link, .riga-link:hover, .riga-link td, .riga-link:hover td { text-decoration: none; }
.riga-link a, .card-link a { text-decoration: none; }

/* Accostamenti cromatici dei grafici */
.pal-istituzionale .barra-0, .pal-istituzionale .chiave-0 { background: #17497f; } .pal-istituzionale .fetta-0 { stroke: #17497f; }
.pal-istituzionale .barra-1, .pal-istituzionale .chiave-1 { background: #b45309; } .pal-istituzionale .fetta-1 { stroke: #b45309; }
.pal-istituzionale .barra-2, .pal-istituzionale .chiave-2 { background: #0e7490; } .pal-istituzionale .fetta-2 { stroke: #0e7490; }
.pal-istituzionale .barra-3, .pal-istituzionale .chiave-3 { background: #9f1239; } .pal-istituzionale .fetta-3 { stroke: #9f1239; }
.pal-istituzionale .barra-4, .pal-istituzionale .chiave-4 { background: #4c1d95; } .pal-istituzionale .fetta-4 { stroke: #4c1d95; }
.pal-istituzionale .barra-5, .pal-istituzionale .chiave-5 { background: #1d4ed8; } .pal-istituzionale .fetta-5 { stroke: #1d4ed8; }
.pal-istituzionale .barra-6, .pal-istituzionale .chiave-6 { background: #3f6212; } .pal-istituzionale .fetta-6 { stroke: #3f6212; }
.pal-istituzionale .barra-7, .pal-istituzionale .chiave-7 { background: #475569; } .pal-istituzionale .fetta-7 { stroke: #475569; }

.pal-sabbia .barra-0, .pal-sabbia .chiave-0 { background: #7c2d12; } .pal-sabbia .fetta-0 { stroke: #7c2d12; }
.pal-sabbia .barra-1, .pal-sabbia .chiave-1 { background: #ca8a04; } .pal-sabbia .fetta-1 { stroke: #ca8a04; }
.pal-sabbia .barra-2, .pal-sabbia .chiave-2 { background: #57534e; } .pal-sabbia .fetta-2 { stroke: #57534e; }
.pal-sabbia .barra-3, .pal-sabbia .chiave-3 { background: #d97706; } .pal-sabbia .fetta-3 { stroke: #d97706; }
.pal-sabbia .barra-4, .pal-sabbia .chiave-4 { background: #4d7c0f; } .pal-sabbia .fetta-4 { stroke: #4d7c0f; }
.pal-sabbia .barra-5, .pal-sabbia .chiave-5 { background: #92400e; } .pal-sabbia .fetta-5 { stroke: #92400e; }
.pal-sabbia .barra-6, .pal-sabbia .chiave-6 { background: #eab308; } .pal-sabbia .fetta-6 { stroke: #eab308; }
.pal-sabbia .barra-7, .pal-sabbia .chiave-7 { background: #78716c; } .pal-sabbia .fetta-7 { stroke: #78716c; }

.pal-verde .barra-0, .pal-verde .chiave-0 { background: #14532d; } .pal-verde .fetta-0 { stroke: #14532d; }
.pal-verde .barra-1, .pal-verde .chiave-1 { background: #ca8a04; } .pal-verde .fetta-1 { stroke: #ca8a04; }
.pal-verde .barra-2, .pal-verde .chiave-2 { background: #0e7490; } .pal-verde .fetta-2 { stroke: #0e7490; }
.pal-verde .barra-3, .pal-verde .chiave-3 { background: #84cc16; } .pal-verde .fetta-3 { stroke: #84cc16; }
.pal-verde .barra-4, .pal-verde .chiave-4 { background: #047857; } .pal-verde .fetta-4 { stroke: #047857; }
.pal-verde .barra-5, .pal-verde .chiave-5 { background: #b45309; } .pal-verde .fetta-5 { stroke: #b45309; }
.pal-verde .barra-6, .pal-verde .chiave-6 { background: #0891b2; } .pal-verde .fetta-6 { stroke: #0891b2; }
.pal-verde .barra-7, .pal-verde .chiave-7 { background: #365314; } .pal-verde .fetta-7 { stroke: #365314; }

.pal-contrasto .barra-0, .pal-contrasto .chiave-0 { background: #0072b2; } .pal-contrasto .fetta-0 { stroke: #0072b2; }
.pal-contrasto .barra-1, .pal-contrasto .chiave-1 { background: #d55e00; } .pal-contrasto .fetta-1 { stroke: #d55e00; }
.pal-contrasto .barra-2, .pal-contrasto .chiave-2 { background: #009e73; } .pal-contrasto .fetta-2 { stroke: #009e73; }
.pal-contrasto .barra-3, .pal-contrasto .chiave-3 { background: #cc79a7; } .pal-contrasto .fetta-3 { stroke: #cc79a7; }
.pal-contrasto .barra-4, .pal-contrasto .chiave-4 { background: #56b4e9; } .pal-contrasto .fetta-4 { stroke: #56b4e9; }
.pal-contrasto .barra-5, .pal-contrasto .chiave-5 { background: #9a6a00; } .pal-contrasto .fetta-5 { stroke: #9a6a00; }
.pal-contrasto .barra-6, .pal-contrasto .chiave-6 { background: #6d28d9; } .pal-contrasto .fetta-6 { stroke: #6d28d9; }
.pal-contrasto .barra-7, .pal-contrasto .chiave-7 { background: #3f3f46; } .pal-contrasto .fetta-7 { stroke: #3f3f46; }

.pal-istituzionale .grafico-linea { color: #17497f; }
.pal-sabbia .grafico-linea { color: #7c2d12; }
.pal-verde .grafico-linea { color: #14532d; }
.pal-contrasto .grafico-linea { color: #0072b2; }

/* Albero dei permessi (gruppi) */
.albero-nodo { border: 1px solid var(--line); border-radius: var(--r); margin-bottom: 6px; background: var(--card); }
.albero-nodo > summary {
  cursor: pointer; padding: 9px 12px; display: flex; align-items: center; gap: 8px;
  font-weight: 600; list-style: none;
}
.albero-nodo > summary::-webkit-details-marker { display: none; }
.albero-nodo > summary::before { content: "▸"; color: var(--ink-soft); font-weight: 400; }
.albero-nodo[open] > summary::before { content: "▾"; }
.albero-nodo[open] > summary { border-bottom: 1px solid var(--line); background: var(--paper); }
.albero-titolo { flex: 1; }
.albero-corpo { padding: 10px 12px 12px 28px; display: grid; gap: 10px; }
.albero-gruppo { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.albero-etichetta { font-size: .78rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .04em; color: var(--ink-soft); min-width: 92px; }
.albero-gruppo label { display: flex; align-items: center; gap: 6px; font-size: .8rem; }

/* Nome a sinistra, controlli a destra */
.permesso-riga {
  display: flex !important; flex-wrap: wrap; align-items: center; gap: 8px 14px;
  grid-template-columns: none !important;
}
.permesso-riga .permesso-nome { flex: 1 1 180px; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.permesso-riga > label,
.permesso-riga .riga-controlli { display: flex; align-items: center; gap: 6px; margin: 0; white-space: nowrap; }
.permesso-riga > label > select { margin-left: 2px; }
.riga-controlli { flex-wrap: wrap; gap: 6px 14px; }
.riga-controlli .check { margin: 0; white-space: nowrap; }
.permessi-allegati { flex-basis: 100%; }
/* Permessi in linea con il nome */
.permesso-riga > label { flex: 0 0 auto; font-size: .74rem; }
.permesso-riga > label > select { font-size: .82rem; padding: 3px 6px; }
@media (max-width: 640px) { .permesso-riga > label { flex: 1 1 45%; } }

/* Stellina dei preferiti */
.stella {
  background: none; border: 0; cursor: pointer; padding: 0 2px; line-height: 1;
  font-size: 1.45rem; color: var(--ink-soft); transition: transform .12s, color .12s;
}
.stella:hover { transform: scale(1.15); color: #c9a227; }
.stella-attiva { color: #e3b505; }
/* Stellina accanto al nome di report, registro e tabella */
.stella-titolo {
  background: none; border: 0; cursor: pointer; padding: 0; margin-right: 2px;
  font: inherit; line-height: 1; color: var(--ink-soft); transition: transform .12s, color .12s;
}
.stella-titolo:hover { transform: scale(1.15); color: #c9a227; }

/* Menu laterale riducibile alle sole icone */

/* Menu ridotto: solo icone */

/* Marchio in alto, freccia sotto */

/* Azioni sullo storico dei backup */
.azioni-storico { white-space: nowrap; display: flex; gap: 6px; align-items: center; }
.azioni-storico .sel-parte { max-width: 190px; }

/* Caricamento allegati: campo e pulsante allineati */
.carica-allegato { margin-top: 16px; display: grid; gap: 4px; }
.carica-etichetta { font-size: 13px; font-weight: 600; color: var(--ink-soft); }
.carica-riga { display: flex; align-items: stretch; gap: 8px; flex-wrap: wrap; }
.carica-riga input[type=file] { flex: 1 1 240px; min-width: 0; }
.carica-riga .btn { flex: none; }
.anteprima-riquadro { border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; background: var(--paper); }
.anteprima-riquadro iframe { width: 100%; height: min(62vh, 560px); border: 0; display: block; background: #fff; }

/* Pagine con griglie: tutta la larghezza del browser */
body.pagina-larga .content { max-width: none; }
.colonne-elenco { display: grid; gap: 2px; max-height: 260px; overflow: auto; }
.colonne-azioni { display: flex; gap: 6px; margin-top: 8px; }
/* Campi numero senza frecce */
input[type=number] { -moz-appearance: textfield; appearance: textfield; }
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* Aspetto: icone caricate e selettore */
.icona-img { width: 1.15em; height: 1.15em; object-fit: contain; vertical-align: -0.18em; }

.icona-cella .icona-img { width: 22px; height: 22px; }
.galleria-icone { display: flex; flex-wrap: wrap; gap: 10px; }
.galleria-set { flex: 0 0 100%; margin: 10px 0 0; font-size: .82rem; text-transform: uppercase;
  letter-spacing: .04em; color: var(--ink-soft); }
.galleria-voce {
  position: relative; width: 92px; padding: 10px 6px 6px; text-align: center;
  border: 1px solid var(--line); border-radius: 10px; background: var(--card);
}
.galleria-voce img { width: 34px; height: 34px; object-fit: contain; display: block; margin: 0 auto 6px; }
.galleria-nome { display: block; font-size: .72rem; color: var(--ink-soft);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.galleria-elimina {
  position: absolute; top: 2px; right: 2px; border: 0; background: transparent;
  color: var(--err); cursor: pointer; font-size: .8rem; line-height: 1; padding: 3px;
}
.nav-icone-griglia { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 8px 18px; }
.nav-icona-riga { display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 5px 0; border-bottom: 1px dashed var(--line); }
.nav-icona-nome { display: flex; flex-direction: column; font-size: .9rem; }
/* Chiaro e scuro affiancati */
.nav-icona-scelte { display: flex; gap: 10px; align-items: flex-end; }
.nav-icona-scelta { display: flex; flex-direction: column; gap: 3px; }
@media (max-width: 640px) {
  .nav-icona-riga { flex-direction: column; align-items: stretch; }
  .nav-icona-scelte { justify-content: flex-start; }
}

.sel-icona { position: relative; }
.sel-icona-menu > summary { list-style: none; cursor: pointer; }
.sel-icona-menu > summary::-webkit-details-marker { display: none; }
.sel-icona-bottone { display: inline-flex; align-items: center; gap: 8px; min-width: 96px; }
.sel-icona-anteprima { font-size: 1.15rem; min-width: 1.3em; text-align: center; }
.sel-icona-etichetta { font-size: .78rem; color: var(--ink-soft); }
.sel-icona-pannello {
  position: absolute; z-index: 60; margin-top: 6px; width: 290px; max-height: 330px;
  overflow: auto; background: var(--card); border: 1px solid var(--line);
  border-radius: 12px; box-shadow: 0 12px 26px rgba(15, 26, 42, .16); padding: 10px;
}
.sel-icona-sezione + .sel-icona-sezione { margin-top: 10px; border-top: 1px solid var(--line); padding-top: 8px; }
.sel-icona-griglia { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 5px; }
.sel-icona-voce {
  width: 34px; height: 34px; display: flex; align-items: center; justify-content: center;
  border: 1px solid var(--line); border-radius: 8px; background: var(--card);
  cursor: pointer; font-size: 1.05rem; padding: 0;
}
.sel-icona-voce img { width: 22px; height: 22px; object-fit: contain; }
.sel-icona-voce:hover { border-color: var(--blu); background: var(--blu-tenue); }
.sel-icona-voce.scelta { border-color: var(--blu); background: var(--blu-tenue); font-weight: 700; }
.sel-icona-libero { width: 100%; margin-top: 5px; }
.sel-icona-bi { width: 100%; margin-top: 6px; font-size: .8rem; }
.sel-icona-voce .bi { font-size: 1.05rem; line-height: 1; }
.bootstrap-prova { display: inline-flex; gap: 10px; font-size: 1.25rem; vertical-align: -3px; margin: 0 6px; }

/* Avviso «attenzione»: colori da variabili */
.flash-warn {
  background: var(--warn-bg); border: 1px solid var(--warn-bordo);
  color: var(--warn-testo); padding: 10px 12px; border-radius: var(--r);
}
.sel-icona-azioni { display: flex; gap: 6px; justify-content: space-between; }

/* Import: tendina del tipo sopra ogni colonna dell'anteprima */
.tipo-colonna {
  margin-top: 6px; width: 100%; min-width: 130px; font-size: .8rem;
  padding: 3px 6px; border: 1px solid var(--bordo, #d7dce3); border-radius: 6px;
  background: var(--carta, #fff); color: var(--ink);
}
.import-preview th { vertical-align: top; }

/* Anteprima import: intestazioni leggibili */
.import-preview .tbl th,
.import-preview .tbl th label,
.import-preview .tbl th .check { color: var(--tbl-testa-testo); }
.import-preview .tbl th .check { display: flex; align-items: center; gap: 7px; font-weight: 600; }
.import-preview .col-esclusa { opacity: .55; }

/* Logo personalizzato e anteprime del marchio */
.brand-logo { max-width: 132px; max-height: 38px; object-fit: contain; display: block; }

.marchio-anteprima {
  border: 1px dashed var(--line); border-radius: var(--r); padding: 14px;
  display: flex; align-items: center; justify-content: center; margin-bottom: 10px;
  background: var(--paper); min-height: 74px;
}
.marchio-anteprima img { max-width: 220px; max-height: 60px; object-fit: contain; }
.marchio-piccolo img { max-width: 48px; max-height: 48px; }

/* Riquadri della homepage, riordinabili col mouse */
.widget-area { display: grid; gap: 14px; }
.widget { margin: 0; position: relative; }
.widget-testa { display: flex; align-items: center; gap: 9px; margin-bottom: 10px; }
.widget-testa h2 { margin: 0; font-size: 1rem; }
.widget-presa {
  cursor: grab; color: var(--ink-soft); font-size: 15px; line-height: 1;
  padding: 2px 4px; border-radius: 4px; user-select: none;
}
.widget-presa:hover { background: var(--paper); color: var(--blu); }
.widget-in-movimento { opacity: .55; outline: 2px dashed var(--blu); }
.widget-bersaglio { outline: 2px solid var(--blu-tenue); }
.grid-interna { margin: 0; }
.grid-interna > .card { background: var(--card-interna); }
.scheda-tabella h3 { margin: 0 0 6px; font-size: .95rem; }
/* Ricerca e liste: cinque risultati, poi scorre */
.risultati-scroll { max-height: 244px; overflow-y: auto; border: 1px solid var(--line); border-radius: var(--r); }
.risultati-scroll .tbl th { position: sticky; top: 0; }

/* Vista a schede per schermi stretti */
.schede-record { display: none; }
@media (max-width: 640px) {
  .tbl-scroll { display: none; }              /* profilo small: comandano le schede */
  .schede-record { display: grid; gap: 8px; margin-top: 10px; }
  .scheda-rec { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); }
  .scheda-rec-testa { display: flex; align-items: center; gap: 9px; padding: 10px 12px; }
  .scheda-rec-titolo {
    flex: 1; text-align: left; background: none; border: 0; padding: 0; cursor: pointer;
    font: inherit; font-weight: 700; color: var(--ink); overflow: hidden;
    text-overflow: ellipsis; white-space: nowrap;
  }
  .scheda-rec-apri {
    background: none; border: 0; cursor: pointer; color: var(--ink-soft);
    font-size: 15px; padding: 2px 6px;
  }
  .scheda-rec.aperta .scheda-rec-apri { transform: rotate(180deg); }
  .scheda-rec-corpo { display: none; margin: 0; padding: 0 12px 12px; }
  .scheda-rec.aperta .scheda-rec-corpo { display: grid; gap: 4px; }
  .scheda-rec-corpo > div {
    display: grid; grid-template-columns: minmax(90px, 38%) 1fr; gap: 10px;
    padding: 5px 0; border-top: 1px solid var(--line);
  }
  .scheda-rec-corpo dt { margin: 0; font-size: .72rem; font-weight: 600; text-transform: uppercase;
    letter-spacing: .03em; color: var(--ink-soft); }
  .scheda-rec-corpo dd { margin: 0; font-size: .9rem; word-break: break-word; }
}

/* Widget a contatore */

/* Nome dell'allegato come pulsante */
.link-allegato {
  background: none; border: 0; padding: 0; cursor: pointer; font: inherit;
  color: var(--blu); text-align: left;
}
.link-allegato:hover { text-decoration: underline; }

/* Riquadri tabella in homepage: scelta e riordino */
.box-tabella { position: relative; padding-top: 22px; }
.box-presa {
  position: absolute; top: 6px; right: 8px; cursor: grab; color: var(--ink-soft);
  font-size: 13px; line-height: 1; user-select: none;
}
.box-presa:hover { color: var(--blu); }
.scheda-tabella-link { display: block; text-decoration: none; color: inherit; }
.scegli-tabelle .filtro-voci { right: 0; left: auto; }

/* Area widget */
/* Riquadri larghi quanto il contenuto */
.griglia-widget {
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  align-items: start;
}
.box-widget:has(.widget-elenco) { grid-column: span 2; }
@media (max-width: 1024px) { .griglia-widget { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); } }
.box-widget { position: relative; padding-top: 22px; }
.box-widget h3 { margin: 0 0 6px; font-size: .95rem; }
.box-widget .stat b { font-size: 26px; color: var(--blu-scuro); }
.box-chiudi { position: absolute; top: 4px; left: 6px; margin: 0; }
.box-chiudi button {
  background: none; border: 0; cursor: pointer; color: var(--ink-soft); font-size: 12px; padding: 2px 4px;
}
.box-chiudi button:hover { color: var(--err); }
.widget-elenco { list-style: none; margin: 0; padding: 0; display: grid; gap: 3px; font-size: .84rem; }
.widget-elenco li { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.box-widget:has(.widget-elenco) .widget-elenco li { white-space: normal; }

/* === Profili di risoluzione: small ≤640 · medium 641–1024 · large 1025–2559 · xlarge ≥2560 === */
:root {
  --fs: 15px;             /* testo di base */
  --fs-piccolo: 13px;
  --fs-tbl: 14px;         /* griglie dati */
  --fs-titolo: 1.25rem;
  --sp: 16px;             /* spaziatura di riferimento */
  --sp-s: 10px;
  --tbl-gap: 14px;        /* respiro fra una colonna e l'altra */
  --tbl-cell-y: 7px;
  --sidebar-w: 232px;
  --controllo-y: 7px;     /* altezza interna di campi e pulsanti */
  --controllo-x: 9px;
  --contenuto-max: 1600px;
  --ombra-card: 0 1px 2px rgba(15, 26, 42, .06);
}

/* small: telefoni */
@media (max-width: 640px) {
  :root {
    --fs: 15px; --fs-piccolo: 12px; --fs-tbl: 13px; --fs-titolo: 1.05rem;
    --sp: 12px; --sp-s: 8px;
    --tbl-gap: 9px; --tbl-cell-y: 8px;
    --controllo-y: 9px; --controllo-x: 10px;   /* bersagli più grandi al tocco */
    --contenuto-max: none;
    --ombra-card: none;
  }
  /* Meno effetti */
  .card, .modale-box, .filtro-menu > div, .sel-icona-pannello,
  .filter-dropdown-panel { box-shadow: none !important; }
  .widget, .box-tabella, .box-widget { transition: none !important; }
  .riga-record:hover, .tbl tbody tr:hover { background: inherit; }
  /* Niente trascinamento dei riquadri */
  .widget-presa, .box-presa { display: none; }
  /* Una colonna sola */
  .nav-icone-griglia, .analisi-grid { grid-template-columns: 1fr !important; }
  .toolbar { gap: var(--sp-s); }
  .toolbar .btn { flex: 1 1 auto; }
  .filter-panel { flex-direction: column; align-items: stretch; }
  .filter-dropdown-wrap, .filtro-menu, .filtro-menu > summary { width: 100%; }
  .filter-dropdown-panel { position: static; width: 100%; max-height: 320px; }
  /* Finestra a tutto schermo */
  .modale { padding: 0; }
  .modale-box { width: 100%; height: 100%; max-height: 100%; border-radius: 0; }
  .modale-corpo { padding: var(--sp-s) var(--sp); }
  /* Griglia dati: righe alte, colonne compatte */
  .tbl-dati th, .tbl-dati td { max-width: 200px; }
  .tbl-dati .col-riempi { display: none; }     /* su schermo stretto non avanza spazio */
  .paginazione { flex-wrap: wrap; gap: var(--sp-s); }
  .schede-record { width: 100%; }
  .galleria-voce { width: 74px; }
  .sel-icona-pannello { position: static; width: 100%; }
}

/* medium: tablet e schermi medi */
@media (min-width: 641px) and (max-width: 1024px) {
  :root {
    --fs: 15px; --fs-tbl: 13.5px; --fs-titolo: 1.15rem;
    --sp: 14px; --sp-s: 9px;
    --tbl-gap: 11px;
    --sidebar-w: 224px;
    --contenuto-max: none;
  }
  .tbl-dati th, .tbl-dati td { max-width: 260px; }
  .modale-box { width: min(94vw, 760px); }
}

/* large: 720p–QHD (riferimento) */
@media (min-width: 1025px) and (max-width: 2559px) {
  :root {
    --fs: 15px; --fs-tbl: 14px;
    --sp: 16px; --tbl-gap: 14px;
    --sidebar-w: 232px;
    --contenuto-max: 1600px;
  }
}

/* xlarge: 4K e oltre */
@media (min-width: 2560px) {
  :root {
    --fs: 18px; --fs-piccolo: 15px; --fs-tbl: 17px; --fs-titolo: 1.6rem;
    --sp: 24px; --sp-s: 14px;
    --tbl-gap: 20px; --tbl-cell-y: 10px;
    --controllo-y: 10px; --controllo-x: 13px;
    --sidebar-w: 300px;
    --contenuto-max: 2400px;
  }
  /* Larghezza massima del testo */
  .content { margin: 0 auto; }
  .galleria-voce { width: 118px; }
  .galleria-voce img { width: 44px; height: 44px; }
  .sel-icona-voce { width: 42px; height: 42px; font-size: 1.3rem; }
  .sel-icona-pannello { width: 380px; max-height: 460px; }
  .torta { width: 210px; height: 210px; }
  .grafico-linea { height: 210px; }
}

/* Applicazione delle variabili */
body { font-size: var(--fs); }
.content { padding: var(--sp); max-width: var(--contenuto-max); }
.card { box-shadow: var(--ombra-card); }
.page-title { font-size: var(--fs-titolo); }
.hint, label { font-size: var(--fs-piccolo); }
.tbl { font-size: var(--fs-tbl); }
.tbl-dati td, .tbl-dati th { padding-top: var(--tbl-cell-y); padding-bottom: var(--tbl-cell-y); }
.sidebar { width: var(--sidebar-w); flex-basis: var(--sidebar-w); }
input[type=text], input[type=password], input[type=number], input[type=date],
input[type=email], input[type=file], select, textarea {
  padding: var(--controllo-y) var(--controllo-x);
}
.btn { padding: var(--controllo-y) calc(var(--controllo-x) + 4px); }

/* === Barra in alto: navigazione, nome del sito, menu utente === */
.shell { display: block; }
.main { width: 100%; }
.topbar {
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
  gap: var(--sp-s);
  background: var(--barra); color: var(--barra-testo);
  padding: var(--sp-s) var(--sp);
  border-bottom: 3px solid var(--blu);
  position: sticky; top: 0; z-index: 70;
}
.topbar-sx { justify-self: start; min-width: 0; }
.topbar-dx { justify-self: end; min-width: 0; }
.marchio-nome {
  justify-self: center; text-align: center;
  font-weight: 700; font-size: 1.06rem; letter-spacing: .02em;
  color: var(--barra-testo-forte); text-decoration: none; white-space: nowrap;
}
.marchio-nome:hover { text-decoration: none; color: var(--barra-testo-forte); }

/* Passaggio del mouse e aperto: come il pulsante utente */

/* Pannello del menu di sinistra come quello utente */
/* Pannello come le altre tendine */

/* Colore del testo nella tendina */

/* Voci del menu: evidenza al passaggio */

/* interruttore chiaro/scuro nel menu utente */
.tema-form { margin: 0; }
.tema-toggle {
  display: flex; align-items: center; gap: 9px; width: 100%;
  background: none; border: 0; cursor: pointer; font: inherit;
  padding: 8px 10px; border-radius: 4px; color: var(--ink); text-align: left;
}
.tema-toggle:hover { background: var(--blu-tenue); }
.tema-interruttore {
  margin-left: auto; width: 34px; height: 18px; border-radius: 999px;
  background: var(--line); position: relative; transition: background .15s ease;
}
.tema-pallino {
  position: absolute; top: 2px; left: 2px; width: 14px; height: 14px;
  border-radius: 50%; background: var(--card); transition: transform .15s ease;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .3);
}
.tema-toggle[aria-pressed="true"] .tema-interruttore { background: var(--blu-pieno); }
.tema-toggle[aria-pressed="true"] .tema-pallino { transform: translateX(16px); }

@media (max-width: 640px) {
  .topbar { grid-template-columns: auto 1fr auto; gap: 6px; padding: 8px 10px; }
  .marchio-nome { font-size: .95rem; overflow: hidden; text-overflow: ellipsis; }

}

/* Titolo di pagina */
.titolo-pagina {
  margin: 0 0 var(--sp-s); font-size: var(--fs-titolo); font-weight: 700;
  color: var(--ink); display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
}

/* === Celle: una riga sola, contenuto completo al passaggio === */
.tbl-dati td, .tbl-dati th {
  min-width: 96px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.tbl-dati .col-check, .tbl-dati .col-riempi { min-width: 0; }
.tbl-dati td.cella-troncata { cursor: help; }
.tbl-dati td.cella-troncata::after {
  content: ""; position: absolute;                 /* nessun ingombro: serve al solo stato */
}
.cella-popup {
  position: fixed; z-index: 120; max-width: min(460px, 82vw); max-height: 320px;
  overflow: auto; background: var(--card); color: var(--ink);
  border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px;
  box-shadow: 0 10px 26px rgba(15, 26, 42, .18); font-size: var(--fs-tbl);
  white-space: pre-wrap; word-break: break-word; pointer-events: none;
}
.cella-popup .cella-popup-campo {
  display: block; font-size: .74rem; text-transform: uppercase; letter-spacing: .04em;
  color: var(--ink-soft); margin-bottom: 4px;
}
/* Riquadro delle categorie */
.cella-popup .popup-albero { display: grid; gap: 10px; }
.cella-popup .popup-cat {
  font-size: .72rem; text-transform: uppercase; letter-spacing: .06em;
  font-weight: 700; color: var(--blu-scuro);
  border-bottom: 1px solid var(--line); padding-bottom: 3px; margin-bottom: 4px;
}
.cella-popup .popup-elenco { margin: 0; padding-left: 16px; list-style: none; }
.cella-popup .popup-elenco li { padding: 2px 0; line-height: 1.35; }
.cella-popup .popup-elenco li::before { content: "• "; color: var(--ink-soft); }

@media (max-width: 640px) { .cella-popup { display: none; } }   /* sul tocco vale la scheda */

/* Notifiche in alto a destra */
#notifiche-destra {
  position: fixed; top: 16px; right: 16px; z-index: 500;
  display: flex; flex-direction: column; gap: 8px;
  max-width: min(360px, 90vw);
}
.notifica-destra {
  position: relative; padding: 10px 32px 10px 14px;
  border-radius: var(--r); box-shadow: var(--elev-3);
  font-size: var(--fs-tbl); animation: notifica-entra .18s ease-out;
}
.notifica-destra p { margin: 0; }
.notifica-err { background: var(--err-bg); color: var(--err); border: 1px solid var(--err); }
.notifica-ok { background: var(--ok-bg); color: var(--ok); border: 1px solid var(--ok); }
.notifica-warn { background: var(--warn-bg); color: var(--warn-testo); border: 1px solid var(--warn-bordo); }
.notifica-chiudi {
  position: absolute; top: 4px; right: 6px; background: none; border: none;
  color: inherit; font-size: 1.15rem; line-height: 1; cursor: pointer; padding: 4px;
}
@keyframes notifica-entra {
  from { opacity: 0; transform: translateX(16px); }
  to { opacity: 1; transform: none; }
}
@media (max-width: 640px) { #notifiche-destra { left: 8px; right: 8px; max-width: none; } }

/* Ricerca rapida: risultati per tabella, ad albero */
.albero-risultati { border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; }
.albero-risultati .ramo + .ramo { border-top: 1px solid var(--line); }
.ramo-testa {
  display: flex; align-items: center; gap: 9px; cursor: pointer;
  padding: 9px 12px; background: var(--paper); list-style: none;
  font-weight: 600; user-select: none;
}
.ramo-testa::-webkit-details-marker { display: none; }
.ramo-testa:hover { background: var(--blu-tenue); }
.ramo-freccia { color: var(--ink-soft); transition: transform .12s ease; font-size: .9em; }
.ramo[open] > .ramo-testa .ramo-freccia { transform: rotate(90deg); }
.ramo-nome { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ramo-conteggio {
  background: var(--blu-pieno); color: #fff; border-radius: 999px;
  padding: 1px 9px; font-size: .78rem; font-weight: 700;
}
.ramo-apri { font-weight: 600; font-size: .82rem; white-space: nowrap; }
.ramo-voci { margin: 0; padding: 4px 0; list-style: none; background: var(--card); }
.ramo-voci li { border-top: 1px solid var(--line); }
.voce-record {
  display: block; width: 100%; text-align: left; background: none; border: 0;
  padding: 8px 12px 8px 32px; font: inherit; color: var(--ink); cursor: pointer;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.voce-record:hover { background: var(--blu-tenue); text-decoration: none; }
.ramo-altri { padding: 8px 12px 8px 32px; }
@media (max-width: 640px) {
  .ramo-apri { display: none; }          /* sul telefono basta toccare il ramo */
  .voce-record { white-space: normal; }
}

/* === Telefono: comandi compatti === */
.comando-attivo { border-color: var(--blu); color: var(--blu); }
.comando-aperto { background: var(--blu-tenue); border-color: var(--blu); }

@media (max-width: 640px) {

  .per-pagina-menu .filtro-voci { left: 0; right: auto; width: min(92vw, 300px); }

}

/* === Tabelle dei report su telefono === */
@media (max-width: 640px) {
  .report-scroll {
    overflow-x: auto; -webkit-overflow-scrolling: touch;
    border: 1px solid var(--line); border-radius: var(--r);
  }
  .report-scroll .tbl-dati { border: 0; border-radius: 0; min-width: max-content; }
  .report-scroll .tbl-dati th, .report-scroll .tbl-dati td { max-width: 190px; }
  .report-scroll .tbl-dati .col-riempi { display: none; }
  /* Prima colonna bloccata */
  .report-scroll .tbl-dati th:first-child,
  .report-scroll .tbl-dati td:first-child {
    position: sticky; left: 0; z-index: 2;
    background: var(--card); border-right: 1px solid var(--line);
  }
  .report-scroll .tbl-dati thead th:first-child { background: var(--ink); z-index: 3; }
  .report-suggerimento { display: block; }
  /* pannelli del report: una colonna, senza tagli */
  .analisi-grid { grid-template-columns: 1fr !important; }
  .torta-riga { flex-direction: column; align-items: flex-start; }

  
}
.report-suggerimento { display: none; font-size: .8rem; color: var(--ink-soft); margin: 6px 0 0; }

/* Area documenti */
.doc-albero { padding: 6px 10px; }
.doc-area { border-bottom: 1px solid var(--line); }
.doc-area:last-child { border-bottom: 0; }
.doc-area-testa {
  display: flex; align-items: center; gap: 9px; cursor: pointer;
  padding: 10px 4px; list-style: none; font-weight: 600; user-select: none;
}
.doc-area-testa::-webkit-details-marker { display: none; }
.doc-area-testa:hover { color: var(--blu-scuro); }
.doc-area-freccia { color: var(--ink-soft); font-size: .85em; transition: transform .12s ease; }
.doc-area[open] > .doc-area-testa .doc-area-freccia { transform: rotate(90deg); }
.doc-conta {
  background: var(--blu-pieno); color: #fff; border-radius: 999px;
  padding: 1px 9px; font-size: .78rem; font-weight: 700;
}
.doc-area-desc { font-weight: 400; }
.doc-area-corpo { padding: 0 0 8px 26px; }
.doc-risorsa {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 8px 6px; border-top: 1px solid var(--line);
}

.doc-titolo { flex: 1; min-width: 180px; display: flex; flex-direction: column; }

.doc-azioni { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.doc-riga-admin {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 7px 0; border-bottom: 1px solid var(--line);
}
.doc-riga-file { font-size: .92rem; }
@media (max-width: 640px) {
  .doc-area-corpo { padding-left: 12px; }
  .doc-risorsa { gap: 6px; }
  .doc-azioni .btn { flex: 1 1 auto; }
}

/* Pagina di manutenzione */
.pagina-servizio {
  display: flex; align-items: center; justify-content: center;
  min-height: 100vh; background: var(--paper); margin: 0; padding: 20px;
}
.manutenzione-riquadro { max-width: 520px; text-align: center; padding: 32px 28px; }
.manutenzione-icona { font-size: 2.6rem; display: block; margin-bottom: 10px; color: var(--blu); }
.manutenzione-riquadro h1 { font-size: 1.3rem; margin: 0 0 10px; }
.manutenzione-riquadro p { color: var(--ink); }
.manutenzione-conto { color: var(--ink-soft); }
/* Riquadro leggibile nel tema scuro */
[data-tema="scuro"] .pagina-servizio { background: var(--paper); }
[data-tema="scuro"] .manutenzione-riquadro {
  background: var(--card); border: 1px solid var(--line); color: var(--ink);
}
[data-tema="scuro"] .manutenzione-riquadro h1,
[data-tema="scuro"] .manutenzione-riquadro p { color: var(--ink); }
[data-tema="scuro"] .manutenzione-icona { color: var(--blu-scuro); }
.avviso-servizio { margin-bottom: 12px; }

/* Finestra per aggiungere una fonte all'autocomplete */
.ref-dialogo {
  position: fixed; inset: 0; z-index: 90; display: flex;
  align-items: center; justify-content: center;
  background: rgba(15, 26, 42, .45); padding: 16px;
}
.ref-dialogo[hidden] { display: none; }
.ref-dialogo-riquadro {
  background: var(--card); color: var(--ink); border-radius: var(--r);
  border: 1px solid var(--line); box-shadow: 0 14px 40px var(--ombra);
  padding: 18px; width: min(760px, 96vw); max-height: 90vh; overflow: auto;
}
.ref-dialogo-riquadro h3 { margin-top: 0; }
.ref-riepilogo td { vertical-align: top; }
/* Mappature: tre per riga, poi scorre */
.ref-mapp-scroll { max-height: 208px; overflow-y: auto; margin-bottom: 12px; }
.ref-mapp-riga:last-child { margin-bottom: 0; }
.btn-tondo {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; padding: 0; border-radius: 50%;
  background: var(--blu-pieno); color: #fff; border: 1px solid var(--blu-pieno-hover);
  font-size: 18px; line-height: 1; cursor: pointer;
}
.btn-tondo:hover { background: var(--blu-pieno-hover); }
.ref-mapp-aggiungi { margin-left: auto; }

/* Centro documentale a schede */
.doc-tab-barra {
  display: flex; gap: 4px; flex-wrap: wrap;
  border-bottom: 2px solid var(--line); margin-bottom: 14px;
}
.doc-tab {
  border: 1px solid transparent; border-bottom: 0; background: transparent;
  color: var(--ink-soft); font: inherit; font-weight: 600; cursor: pointer;
  padding: 9px 16px; border-radius: var(--r) var(--r) 0 0; margin-bottom: -2px;
}
.doc-tab:hover { color: var(--blu-scuro); background: var(--blu-tenue); }
.doc-tab.attiva {
  color: var(--blu-scuro); background: var(--card);
  border-color: var(--line); border-bottom: 2px solid var(--card);
}
.doc-schede { display: grid; gap: 10px; }
.doc-scheda {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r);
  box-shadow: var(--ombra-card);
}
.doc-scheda-testa {
  display: flex; align-items: center; gap: 10px; cursor: pointer;
  padding: 12px 14px; list-style: none; font-weight: 600; user-select: none;
}
.doc-scheda-testa::-webkit-details-marker { display: none; }
.doc-scheda-testa::before { content: "▸"; color: var(--ink-soft); font-size: .85em; }
.doc-scheda[open] > .doc-scheda-testa::before { content: "▾"; }
.doc-scheda-testa:hover { color: var(--blu-scuro); }
.doc-scheda-nome { flex: 1; min-width: 0; }
.doc-scheda-corpo { padding: 0 14px 12px; }
.doc-riga {
  display: grid; grid-template-columns: 1fr 160px 130px auto;
  align-items: center; gap: 10px;
  padding: 8px 0; border-top: 1px solid var(--line);
}
.doc-riga-nome { display: flex; flex-direction: column; min-width: 0; }
.doc-riga-azioni { display: flex; gap: 6px; flex-wrap: wrap; }
/* Allegati delle tabelle: una riga per record */
.doc-riga-record { grid-template-columns: 1fr auto; }
.doc-riga-file-elenco { display: flex; flex-wrap: wrap; gap: 2px 0; }
@media (max-width: 900px) {
  .doc-riga { grid-template-columns: 1fr; gap: 4px; }
  .doc-riga-azioni { margin-top: 4px; }
  .doc-riga-azioni .btn { flex: 1 1 auto; }
}

/* Card cliccabile per intero */
.card-link {
  display: block; text-decoration: none; color: inherit;
  transition: border-color .12s ease, box-shadow .12s ease;
}
.card-link:hover {
  text-decoration: none; border-color: var(--blu);
  box-shadow: 0 4px 14px var(--ombra);
}
.card-link h2 { color: var(--blu-scuro); }

/* Widget di riepilogo */
.stat-riepilogo { margin-bottom: 6px; }
/* Nessuno scorrimento interno */
.widget-elenco { margin: 0; padding-left: 0; list-style: none; }
.widget-elenco li {
  display: flex; justify-content: space-between; gap: 10px;
  padding: 3px 0; border-bottom: 1px dashed var(--line); font-size: .9rem;
}
.widget-elenco li:last-child { border-bottom: 0; }

/* Spunta delle barre da stampare */
.barra-riga:has(.barra-scelta) { grid-template-columns: auto minmax(80px, 24%) 1fr auto; }
.barra-scelta { margin: 0; }

/* === Profondità: livelli di elevazione 0–3 === */

/* Riquadri: rilievo leggero */
.card {
  box-shadow: var(--elev-1);
  border: 1px solid var(--bordo-tenue);
}
.card-link:hover { box-shadow: var(--elev-3); transform: translateY(-1px); }
.card-link { transition: box-shadow .14s ease, transform .14s ease, border-color .14s ease; }

/* Barra in alto: ombra */
.topbar { box-shadow: var(--elev-2); }

/* Intestazione appiccicata con ombra */
.tbl-dati { box-shadow: var(--elev-1); }
.tbl-dati thead th { box-shadow: 0 2px 4px rgba(15, 26, 42, .12); }
.tbl-dati tbody tr:hover { background: var(--blu-tenue); }

/* Pulsanti: rilievo e risposta al clic */
.btn {
  box-shadow: var(--elev-1);
  transition: box-shadow .12s ease, transform .06s ease, background .12s ease;
}
.btn:hover { box-shadow: var(--elev-2); }
.btn:active { transform: translateY(1px); box-shadow: none; }
.btn-ghost { box-shadow: none; }
.btn-ghost:hover { box-shadow: var(--elev-1); }

/* Tendine, finestre e riquadri: livello più alto */
.filtro-voci, .sel-icona-pannello,
.filter-dropdown-panel, .cella-popup, .modale-box, .ref-dialogo-riquadro {
  box-shadow: var(--elev-3);
}

/* Campi: incavo leggero */
input[type=text], input[type=password], input[type=number], input[type=date],
input[type=email], input[type=search], input[type=time], select, textarea {
  box-shadow: inset 0 1px 2px rgba(15, 26, 42, .05);
}
/* Barre dei grafici: volume */
.barra-valore { box-shadow: inset 0 -2px 3px rgba(0, 0, 0, .12); }

/* === PROFILO TELEFONO: impostazioni da applicazione (360–430px) === */
@media (max-width: 640px) {
  :root {
    --fs: 16px;            /* iOS non ingrandisce la pagina se il campo è ≥16px */
    --fs-piccolo: 13px;
    --fs-tbl: 15px;
    --fs-titolo: 1.15rem;
    --sp: 14px; --sp-s: 10px;
    --controllo-y: 12px;   /* bersagli da toccare: circa 44px di altezza */
    --controllo-x: 14px;
    --r: 12px;             /* angoli più morbidi, come nelle app */
  }
  body { -webkit-text-size-adjust: 100%; }

  /* la barra resta in alto e raggiungibile mentre si scorre */
  .topbar { position: sticky; top: 0; padding: 10px 12px; }
  .content { padding: 12px; }

  /* riquadri a tutta larghezza, staccati fra loro come schede */
  .card { border-radius: var(--r); margin-bottom: 12px; }

  /* comandi comodi: pulsanti alti e a piena larghezza dove ha senso */
  .btn { min-height: 44px; padding: 0 16px; display: inline-flex; }
  .form-actions { display: flex; gap: 8px; }
  .form-actions .btn { flex: 1 1 auto; justify-content: center; }
  input, select, textarea { min-height: 44px; font-size: 16px; }
  textarea { min-height: 96px; }
  .check { padding: 6px 0; }               /* spunte più facili da centrare */

  /* elenchi: le schede record diventano l'interfaccia principale */

  

  /* tendine e finestre occupano lo schermo, come nelle app */
  .filtro-voci, .filter-dropdown-panel {
    position: fixed; left: 8px; right: 8px; width: auto;
    max-height: 65vh; border-radius: var(--r); box-shadow: var(--elev-3);
  }
  .modale-box { border-radius: 0; }

  /* il menu di sezione diventa a tutta larghezza */
  /* paginazione e barre strumenti: righe intere, niente elementi schiacciati */
  .paginazione { gap: 8px; }
  .paginazione .btn { flex: 1 1 auto; justify-content: center; }
}

/* Schermi molto stretti (360px) */
@media (max-width: 380px) {
  :root { --sp: 10px; --sp-s: 8px; }
  .marchio-nome { display: none; }     /* lo spazio serve ai comandi */

}

/* Correzioni al profilo telefono */
@media (max-width: 640px) {
  /* Widget con elenco: una colonna */
  .box-widget:has(.widget-elenco) { grid-column: auto; }
  .griglia-widget { grid-template-columns: 1fr; }

  /* schede record: anteprima di due campi sotto il titolo */
  .scheda-rec-sommario {
    display: grid; grid-template-columns: 1fr 1fr; gap: 2px 10px;
    margin: 6px 0 0; padding: 0 4px 4px;
  }
  .scheda-rec-sommario dt {
    font-size: .68rem; text-transform: uppercase; letter-spacing: .04em;
    color: var(--ink-soft);
  }
  .scheda-rec-sommario dd { margin: 0; font-size: .92rem; }
  .scheda-rec.aperta .scheda-rec-sommario { display: none; }   /* aperta: c'è tutto */
}
@media (min-width: 641px) { .scheda-rec-sommario { display: none; } }

/* Rilievo: sfondo più scuro e luce sul bordo superiore */

.card, .tbl-dati, .doc-scheda, .box-widget, .box-tabella {
  border-top-color: rgba(255, 255, 255, .7);
}
[data-tema="scuro"] .card,
[data-tema="scuro"] .tbl-dati,
[data-tema="scuro"] .doc-scheda,
[data-tema="scuro"] .box-widget { border-top-color: rgba(255, 255, 255, .06); }

/* Le intestazioni di sezione dentro i riquadri si staccano dal contenuto */
.card > h2:first-child, .card > h2 {
  border-bottom: 1px solid var(--bordo-tenue); padding-bottom: 8px;
}
/* I riquadri interni (widget, schede tabella) sono un gradino più in alto */
.box-widget, .box-tabella {
  background: var(--card); box-shadow: var(--elev-1);
  border: 1px solid var(--bordo-tenue); border-radius: var(--r);
}
.box-widget:hover, .box-tabella:hover { box-shadow: var(--elev-2); }

/* === Campo a categorie === */
/* Campo a categorie: tag, ricerca, albero, «Aggiungi» */
.tag-nidificato {
  display: grid; gap: 10px;
  border: 1px solid var(--line); border-radius: var(--r);
  padding: 10px 12px; background: var(--card);
}
.tag-scelti { display: flex; flex-wrap: wrap; gap: 6px; min-height: 26px; align-items: center; }
.tag-voce {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--blu-tenue); color: var(--blu-scuro);
  border: 1px solid var(--blu); border-radius: 999px;
  padding: 3px 8px 3px 12px; font-size: .88rem; font-weight: 600;
  max-width: 100%;
}
.tag-voce > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tag-togli {
  border: 0; background: transparent; color: var(--blu-scuro);
  cursor: pointer; font-size: 1.05rem; line-height: 1; padding: 0 2px;
}
.tag-togli:hover { color: var(--err); }

.tag-ricerca { border-top: 1px dashed var(--line); padding-top: 10px; }
.tag-cerca { width: 100%; }
.tag-albero {
  max-height: 240px; overflow-y: auto;
  border: 1px solid var(--line); border-radius: var(--r);
  padding: 8px 10px; background: var(--campo);
  /* spazio fra il contenuto e la barra di scorrimento */
  scrollbar-gutter: stable both-edges;
}
.tag-gruppo + .tag-gruppo { margin-top: 10px; }
.tag-gruppo-nome {
  font-size: .72rem; text-transform: uppercase; letter-spacing: .06em;
  font-weight: 700; color: var(--ink-soft);
  border-bottom: 1px solid var(--line); padding-bottom: 3px; margin-bottom: 4px;
}
.tag-opzione {
  display: flex; align-items: center; gap: 8px;
  padding: 4px 6px 4px 14px; border-radius: 6px; cursor: pointer;
  font-size: .92rem; line-height: 1.3;
}
.tag-opzione:hover { background: var(--blu-tenue); }
.tag-opzione input { margin: 0; flex: none; }
/* scelta singola: voce cliccabile senza pallino, stesso aspetto della riga */
.tag-opzione-singola {
  width: 100%; border: 0; background: none; color: inherit;
  font-family: inherit; text-align: left;
}
.tag-opzione-singola:focus-visible { outline: 2px solid var(--blu); outline-offset: -2px; }
.tag-azioni {
  display: flex; align-items: center; justify-content: flex-end; gap: 12px;
}
@media (max-width: 640px) {
  .tag-albero { max-height: 200px; }
  .tag-azioni .btn { flex: 1 1 auto; }
}

/* === PROFILO TELEFONO — impianto ripreso da v13 === */

/* Aiuti allo scorrimento */
.tbl-wrap { position: relative; }
.aiuti-tbl {
  position: absolute; right: 12px; bottom: 12px;
  display: flex; gap: 6px; z-index: 7;
  pointer-events: none;                 /* i clic passano alla tabella… */
}
.aiuto-tbl {
  pointer-events: auto;                 /* …ma non sui pulsanti */
  width: 38px; height: 38px; border-radius: 50%;
  border: 1px solid var(--line); background: var(--card); color: var(--blu);
  font-size: 15px; line-height: 1; cursor: pointer;
  box-shadow: var(--elev-2);
  display: inline-flex; align-items: center; justify-content: center;
  transition: transform .16s ease, background .16s ease;
}
.aiuto-tbl:hover { background: var(--blu-pieno); color: #fff; transform: translateY(-2px); }
.aiuto-tbl:focus-visible { outline: 2px solid var(--blu); outline-offset: 2px; }
.aiuto-tbl[hidden] { display: none; }
.aiuto-su { background: var(--blu-pieno); color: #fff; border-color: var(--blu-pieno-hover); }
.aiuto-su:hover { background: var(--blu-pieno-hover); }

/* Prima colonna ferma (classe dal JS) */
.tbl-wrap.scorre .tbl-dati thead th:first-child,
.tbl-wrap.scorre .tbl-dati tbody td:first-child {
  position: sticky; left: 0; z-index: 3;
  background: var(--card);
  box-shadow: 1px 0 0 var(--line), 6px 0 8px -6px var(--ombra);
}
.tbl-wrap.scorre .tbl-dati thead th:first-child {
  z-index: 4; background: var(--tbl-testa); color: var(--tbl-testa-testo);
}
/* Tabella a schede su schermo stretto (tbl-schede) */
@media (max-width: 640px) {
  .tbl-schede thead { display: none; }
  .tbl-schede, .tbl-schede tbody, .tbl-schede tr, .tbl-schede td { display: block; width: auto; }
  .tbl-schede tr {
    background: var(--card); border: 1px solid var(--line); border-radius: var(--r);
    box-shadow: var(--elev-1); margin-bottom: 10px; padding: 4px 0; overflow: hidden;
  }
  .tbl-schede td {
    display: grid; grid-template-columns: minmax(88px, 38%) 1fr;
    gap: 10px; align-items: baseline;
    padding: 7px 12px; border: 0; border-top: 1px solid var(--bordo-tenue);
    white-space: normal; max-width: none;
  }
  .tbl-schede tr > td:first-child { border-top: 0; }
  .tbl-schede td::before {
    content: attr(data-etichetta);
    font-size: .7rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: .04em; color: var(--ink-soft);
  }
  /* una cella senza etichetta (comandi, spunte) prende tutta la larghezza */
  .tbl-schede td[data-etichetta=""] { grid-template-columns: 1fr; }
  .tbl-schede td[data-etichetta=""]::before { display: none; }
  /* i comandi di riga si allineano e restano toccabili */
  .tbl-schede td .btn { min-height: 40px; }
  .tbl-schede td:last-child { display: flex; flex-wrap: wrap; gap: 8px; }
  .tbl-schede td:last-child::before { flex-basis: 100%; }
  /* riga «nessun dato» */
  .tbl-schede td[colspan] { grid-template-columns: 1fr; }
  .tbl-schede td[colspan]::before { display: none; }
}

/* Vista a schede del report */
.schede-report { }
.scheda-rec-tutta {
  width: 100%; background: none; border: 0; font: inherit; text-align: left;
  cursor: pointer; color: inherit;
}
@media (max-width: 640px) {
  .scheda-rec-tutta { min-height: 46px; }
  .schede-report .scheda-rec-corpo > div { grid-template-columns: minmax(88px, 40%) 1fr; }
  .schede-report .badge-multi { margin: 0 4px 3px 0; }
}

/* Finestre dal basso (telefono) */
@media (max-width: 640px) {
  .modale { padding: 0; align-items: flex-end; }
  .modale-box {
    width: 100%; max-width: 100%;
    height: auto; max-height: 94dvh;
    border-radius: 14px 14px 0 0;
    display: flex; flex-direction: column;
    animation: finestraSu .22s ease;
    padding-bottom: env(safe-area-inset-bottom, 0);
  }
  .modale-testa {
    position: sticky; top: 0; z-index: 3;
    background: var(--card); border-bottom: 1px solid var(--line);
  }
  .modale-testa h2 { font-size: 1.02rem; }
  .modale-corpo { overflow-y: auto; -webkit-overflow-scrolling: touch; flex: 1; }
  /* i pulsanti di conferma restano visibili in fondo alla finestra */
  .modale-corpo .form-actions {
    position: sticky; bottom: 0; z-index: 2;
    background: var(--card); border-top: 1px solid var(--line);
    margin: 10px -12px -8px; padding: 10px 12px;
    padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px));
    flex-wrap: wrap;
  }
  .modale-corpo .form-actions .btn { min-height: 44px; }
}
@keyframes finestraSu { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: translateY(0); } }

/* Barra in alto e area sicura */
@media (max-width: 640px) {
  .topbar {
    padding-top: calc(10px + env(safe-area-inset-top, 0px));
    padding-left: calc(12px + env(safe-area-inset-left, 0px));
    padding-right: calc(12px + env(safe-area-inset-right, 0px));
  }
  .content {
    padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px));
  }
  /* il menu di sezione non esce dal bordo */

  
}

/* Intestazioni e barre a capo */
@media (max-width: 900px) {
  .toolbar, .barra-filtri,
  .paginazione, .widget-testa { flex-wrap: wrap; }
  /* Spaziatore annullato quando si va a capo */
  .paginazione > span.grow, .toolbar > span.grow { flex-basis: 100%; height: 0; }
}
@media (max-width: 640px) {
  /* i comandi di riga di una scheda o di una testata stanno insieme */
  .card > h2, .titolo-pagina { font-size: 1.12rem; line-height: 1.25; }
  .titolo-pagina { margin-bottom: 10px; }
  /* Tabelle di amministrazione: scorrimento con inerzia */
  .tbl-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  /* i comandi in coda alla riga non si spezzano a metà parola */
  .tbl td .btn + .btn { margin-left: 6px; }
}

/* Riquadri a griglia automatica */

/* Log attività su telefono: dettagli al posto dell'IP */
@media (max-width: 640px) {
  .log-solo-grande { display: none; }
}

/* Meno movimento (prefers-reduced-motion) */
@keyframes appare { from { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  .modale-box, .notifica-destra { animation: appare .18s ease-out; }
  .aiuto-tbl { transition: none; }
}

/* === Correzioni iPhone 390px === */

/* Freccia nativa di <summary> nascosta */
summary { list-style: none; }
summary::-webkit-details-marker { display: none; }
summary::marker { content: ""; }

@media (max-width: 640px) {
  /* Bersagli da toccare: 44px */
  .btn, .btn-sm,
  .filtro-menu > summary, .per-pagina-menu > summary,
  .stella, .scheda-rec-apri, .link-allegato {
    min-height: 44px;
  }
  /* btn-sm a misura normale */
  .btn-sm { padding: 0 14px; font-size: var(--fs); }

  /* Barra in alto: due comandi da 44px */

  /* Schede record: testata come bersaglio */
  .scheda-rec-testa { min-height: 48px; padding: 8px 12px; }
  .scheda-rec-titolo { min-height: 32px; display: flex; align-items: center; }
  .scheda-rec-apri {
    min-width: 44px; display: inline-flex; align-items: center; justify-content: center;
    font-size: 18px;
  }
  /* Spunta di selezione più grande */
  .scheda-rec-testa input[type="checkbox"],
  .colonne-elenco input[type="checkbox"],
  .check input[type="checkbox"] { width: 20px; height: 20px; }
  .check { min-height: 40px; }

  /* Stellina dei preferiti */
  /* Con etichetta e misura di comando */
  .stella {
    display: inline-flex; align-items: center; gap: 8px;
    min-width: 44px; padding: 0 12px;
    border: 1px solid var(--line); border-radius: var(--r);
    background: var(--card); font-size: 18px;
  }
  .stella::after {
    content: "Preferita"; font-size: var(--fs-piccolo); font-weight: 600;
    color: var(--ink-soft);
  }
  .stella-attiva::after { content: "Preferita ✓"; color: var(--blu); }
  .stella-titolo { min-width: 32px; min-height: 32px; }
  .stella-titolo::after { content: none; }

  /* Conteggi e comandi di pagina su una riga */
  .paginazione .hint { font-size: var(--fs-piccolo); }
  .per-pagina-menu > summary { width: 100%; justify-content: center; }
}

/* Campi in anteprima nelle schede */
.colonne-sezione {
  border-top: 1px dashed var(--line); margin-top: 8px; padding-top: 8px;
  display: flex; flex-direction: column; gap: 4px;
}
.colonne-sezione-titolo {
  font-size: .72rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .04em; color: var(--ink-soft);
}
.colonne-elenco-anteprima { max-height: 190px; overflow-y: auto; }
/* Massimo raggiunto: voci spente */
.colonne-elenco-anteprima .check.esaurito { opacity: .45; }

/* Menu «Colonne»: comandi fissi in fondo */

/* Tutte le <summary> a misura di tocco */
@media (max-width: 640px) {
  summary { min-height: 44px; display: flex; align-items: center; }
  /* Spunte quadrate, bersaglio sull'etichetta */
  .check input[type="checkbox"] { flex: 0 0 20px; }
}

/* Pannello «Colonne» ancorato in basso */
@media (max-width: 640px) {
  .per-pagina-menu > .filtro-voci,
  .export-report > .filtro-voci {
    position: fixed; left: 8px; right: 8px; top: auto;
    bottom: calc(8px + env(safe-area-inset-bottom, 0px));
    width: auto; max-height: 76dvh; z-index: 60;
    box-shadow: var(--elev-3); border-radius: var(--r);
  }
}

/* Ricerca a icona e titolo della scheda a misura */
@media (max-width: 640px) {
  summary.btn { min-width: 44px; justify-content: center; }
  .zona-ricerca summary.btn, .zona-ricerca .btn { min-width: 44px; }
  .scheda-rec-titolo { min-height: 40px; }
}

/* === Innesti da gestionale_prova_14 === */

/* Categorie aggregate nella scheda del record */
.scheda-categorie { display: grid; gap: 6px; }
.scheda-categoria { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; }
.scheda-cat-nome {
  font-size: .72rem; text-transform: uppercase; letter-spacing: .05em;
  font-weight: 700; color: var(--ink-soft); min-width: 96px;
}
.scheda-cat-voci { display: flex; flex-wrap: wrap; gap: 4px; }
@media (max-width: 640px) {
  /* Categoria a capo su telefono */
  .scheda-categoria { display: grid; gap: 3px; }
  .scheda-cat-nome { min-width: 0; }
}

/* Report su telefono: schede o tabella */
.scambia-vista { display: none; }
@media (max-width: 640px) {
  .scambia-vista { display: inline-flex; width: 100%; justify-content: center; margin-bottom: 10px; }
  /* Di serie: schede visibili, tabella nascosta */
  .tabella-report { display: none; }
  body.report-tabella .schede-report { display: none; }
  body.report-tabella .tabella-report {
    display: block; overflow-x: auto; -webkit-overflow-scrolling: touch;
  }
  .tabella-report .tbl-dati { font-size: .88rem; }
  .tabella-report .tbl-dati th, .tabella-report .tbl-dati td {
    padding-left: 8px; padding-right: 8px; max-width: 220px;
  }
  /* Prima colonna ferma */
  .tabella-report .tbl-dati thead th:first-child,
  .tabella-report .tbl-dati tbody td:first-child {
    position: sticky; left: 0; z-index: 3; background: var(--card);
    box-shadow: 1px 0 0 var(--line), 6px 0 8px -6px var(--ombra);
  }
  .tabella-report .tbl-dati thead th:first-child { background: var(--tbl-testa); z-index: 4; }
}

/* Tabella del report: larghezza naturale, scorre */
@media (max-width: 640px) {
  body.report-tabella .tabella-report { width: 100%; }
  body.report-tabella .tabella-report > table { min-width: max-content; width: auto; }
}

/* Scorrimento sul genitore diretto della tabella */
@media (max-width: 640px) {
  body.report-tabella .tabella-report { overflow: visible; }
  body.report-tabella .tabella-report .report-scroll {
    overflow-x: auto; -webkit-overflow-scrolling: touch;
    max-width: 100%; width: 100%;
  }
  body.report-tabella .tabella-report .report-scroll > table {
    min-width: max-content; width: auto;
  }
}

/* Sticky nelle celle: border-collapse separate */
@media (max-width: 640px) {
  body.report-tabella .tabella-report .tbl-dati {
    border-collapse: separate; border-spacing: 0;
  }
}

/* === Correzioni v16 === */

/* 1. Ricerca: un solo blocco */
.ricerca-gruppo {
  /* Larghezza in em */
  display: flex; align-items: stretch; width: 100%; max-width: min(100%, 42em);
  border: 1px solid var(--line); border-radius: 999px;
  background: var(--campo); overflow: hidden;
  transition: border-color .12s, box-shadow .12s;
}
/* Contorno sul gruppo */
.ricerca-gruppo > input[type=text],
.ricerca-gruppo > select,
.ricerca-gruppo > button {
  border: 0; border-radius: 0; background: transparent; color: var(--ink);
  font: inherit; min-width: 0; outline: 0; box-shadow: none;
}
.ricerca-gruppo > input[type=text] {
  flex: 1 1 auto; padding: 9px 8px 9px 16px; width: auto;
}
.ricerca-gruppo > select {
  flex: 0 1 auto; width: auto; max-width: 42%; cursor: pointer;
  padding: 9px 10px; color: var(--ink-soft);
}
/* Filo fra testo e colonna */
.ricerca-divisore {
  flex: 0 0 1px; align-self: center; height: 60%;
  background: var(--line);
}
.ricerca-gruppo > button {
  flex: 0 0 auto; padding: 0 20px; cursor: pointer; font-weight: 600;
  background: var(--blu-pieno); color: #fff;
}
.ricerca-gruppo > button:hover { background: var(--blu-pieno-hover); }
/* Fuoco sull'intero gruppo */
.ricerca-gruppo:focus-within {
  border-color: var(--blu); box-shadow: 0 0 0 3px var(--blu-tenue);
}
/* Ricerca attiva segnalata */
.ricerca-piena { border-color: var(--blu); }
.zona-ricerca { align-items: center; gap: 8px; }
.ricerca-azzera { flex: 0 0 auto; border-radius: 999px; }

/* Fascia intermedia: la ricerca non segue min-width 100% */
@media (max-width: 1024px) {
  .zona-ricerca .form-group { min-width: 0; }
}
/* Telefono: blocco su due righe */
@media (max-width: 560px) {
  .ricerca-gruppo {
    flex-wrap: wrap; border-radius: var(--r); padding: 0;
  }
  .ricerca-gruppo > input[type=text] {
    flex: 1 1 100%; padding: 11px 14px; min-height: 44px;
    border-bottom: 1px solid var(--line);
  }
  .ricerca-divisore { display: none; }
  .ricerca-gruppo > select { flex: 1 1 auto; max-width: none; min-height: 44px; }
  .ricerca-gruppo > button { min-height: 44px; padding: 0 18px; }
  .ricerca-azzera { min-width: 44px; min-height: 44px; }
}

/* 2. Evidenza della riga anche sulle colonne ferme */
.riga-record:hover td { background: var(--blu-tenue); }
.tbl-dati tbody tr:hover > .col-check,
.tbl-dati tbody tr:hover > .col-ferma,
.tbl-scroll.con-frecce .tbl-dati tbody tr:hover > .col-check,
.tbl-scroll.con-frecce .tbl-dati tbody tr:hover > .col-ferma,
.tbl-scroll.con-frecce .tbl-dati tbody tr:nth-child(even):hover > .col-check,
.tbl-scroll.con-frecce .tbl-dati tbody tr:nth-child(even):hover > .col-ferma {
  background: var(--blu-tenue);
}
/* Riga selezionata nella colonna ferma */
.tbl-dati tbody tr:has(input[name=record_ids]:checked) > .col-check,
.tbl-dati tbody tr:has(input[name=record_ids]:checked) > .col-ferma {
  background: var(--blu-tenue);
}
/* Idem nel report */
@media (max-width: 640px) {
  .report-scroll .tbl-dati tbody tr:hover > td:first-child,
  .tabella-report .tbl-dati tbody tr:hover > td:first-child {
    background: var(--blu-tenue);
  }
}

/* 2b. Larghezza delle colonne sul contenuto */
.tbl-dati th.col-piena {
  width: min(calc((var(--col-car, 10) * 0.58em) + 2.6em), var(--col-max, 340px));
}
.tbl-dati th.col-vuota { width: 56px; }

/* 3. Icone nelle voci di menu: posto di misura fissa */
.voce-ico {
  flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center;
  width: 1.35em; min-width: 1.35em; height: 1.35em; line-height: 1;
}
.voce-ico .bi { font-size: 1.05em; line-height: 1; }
.voce-ico .icona-img { width: 100%; height: 100%; object-fit: contain; }

/* === Correzioni v17 === */

/* 1. Tabelle: solo linee orizzontali */
.tbl th, .tbl td { border-left: 0; border-right: 0; }
.tbl td { border-bottom: 1px solid var(--line); }
.tbl { border: 0; }
.tbl-dati { border: 0; border-radius: 0; }
/* Ultima riga senza linea */
.tbl tbody tr:last-child > td { border-bottom: 0; }
/* Linea marcata sotto l'intestazione */
.tbl thead th { border-bottom: 2px solid var(--line); }

/* 2. Misure standard dei campi (rem) */
.form-group { max-width: 24rem; }
.form-group.grow { max-width: 36rem; }
/* campo-lungo: campi larghi */
.form-group.campo-lungo, .form-group:has(textarea) { max-width: 40rem; }
/* Modulo record: misura da --car */
/* Ricerca: misura propria */
.zona-ricerca .form-group { max-width: none; }

/* 3. Pulsanti larghi quanto il testo */
/* Larghezza massima dei comandi */
.btn, .filtro-menu > summary { max-width: 22rem; }

/* 4. Tendine nei riquadri larghe quanto il testo */
@media (max-width: 640px) {
  .widget-testa .filtro-menu, .widget-testa .filtro-menu > summary { width: auto; }
  .widget-testa .btn { flex: 0 1 auto; }
}
/* Ricerca rapida in homepage */
.zona-ricerca .ricerca-gruppo > input[type=text]:last-of-type { border-bottom: 0; }
@media (max-width: 560px) {
  .ricerca-gruppo:not(:has(select)) > input[type=text] {
    flex: 1 1 auto; border-bottom: 0;
  }
  .ricerca-gruppo:not(:has(select)) { flex-wrap: nowrap; border-radius: 999px; }
}

/* === Correzioni v18 === */

/* 1. Pulsanti nelle righe di modulo allineati in basso */
.form-row > .form-actions { align-self: flex-end; margin-top: 0; }
.form-row > .form-actions > .btn,
.form-row > .form-actions > button { align-self: center; }
.form-row > .btn, .form-row > button { align-self: flex-end; }
/* Idem nelle barre comandi */
.toolbar > .btn, .toolbar > button, .toolbar > .form-actions > .btn { align-self: flex-end; }

/* 2. Segnale di caricamento */
.barra-carico {
  position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 200;
  background: transparent; pointer-events: none;
}
.barra-carico > span {
  display: block; height: 100%; width: 0; background: var(--blu-pieno);
  box-shadow: 0 0 8px rgba(30, 58, 95, .5);
}
/* Barra di avanzamento fino a tre quarti */
.barra-carico.in-corso > span { animation: carico-avanza 2.2s ease-out forwards; }
@keyframes carico-avanza {
  0%   { width: 0; }
  35%  { width: 45%; }
  70%  { width: 68%; }
  100% { width: 78%; }
}
/* Puntatore di attesa */
.sta-caricando, .sta-caricando a, .sta-caricando button { cursor: progress; }

/* Pulsante in corso */
.btn.in-attesa { opacity: .72; position: relative; pointer-events: none; }
.btn.in-attesa::after {
  content: ""; width: 12px; height: 12px; margin-left: 8px; flex: 0 0 auto;
  border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%;
  display: inline-block; vertical-align: -2px; animation: carico-gira .7s linear infinite;
}
@keyframes carico-gira { to { transform: rotate(360deg); } }

/* Segnaposto di caricamento */
.carico-segnaposto {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  padding: 28px 16px; color: var(--ink-soft); font-size: .95rem;
}
.carico-cerchio {
  width: 18px; height: 18px; border: 2px solid var(--line);
  border-top-color: var(--blu); border-radius: 50%;
  animation: carico-gira .8s linear infinite;
}
/* Rotella per le attese lunghe */
.carico-lento {
  position: fixed; right: 16px; bottom: 16px; z-index: 210;
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px; border-radius: 10px; font-size: .9rem;
  background: var(--card, #fff); color: var(--ink, #1a1a2e);
  border: 1px solid var(--line); box-shadow: 0 4px 14px rgba(0, 0, 0, .18);
  pointer-events: none;
}
.carico-lento[hidden] { display: none; }
.carico-lento .carico-cerchio { width: 22px; height: 22px; border-width: 3px; }

/* Avviso di connessione */
.avviso-connessione {
  position: fixed; top: 0; left: 0; right: 0; z-index: 220;
  display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap;
  padding: 8px 16px; font-size: .9rem; text-align: center;
  background: var(--ok-bg, #e4f3e8); color: var(--ok, #1f6b3a);
  border-bottom: 1px solid var(--line);
}
.avviso-connessione[hidden] { display: none; }
.avviso-connessione.avviso-connessione-errore { background: var(--err-bg); color: var(--err); }

/* Meno movimento: segnale fermo */
@media (prefers-reduced-motion: reduce) {
  .barra-carico.in-corso > span { width: 40%; animation: none; }
  .btn.in-attesa::after, .carico-cerchio { animation: none; }
}

/* 3. Schede di sezione (pagina Report) */
/* Linea delle schede come ombra interna */
.schede {
  display: flex; gap: 4px; flex-wrap: wrap; align-items: flex-end;
  box-shadow: inset 0 -2px 0 var(--line);
  margin-bottom: 16px; padding-bottom: 0;
}
.scheda-voce {
  padding: 9px 16px; border-radius: var(--r) var(--r) 0 0;
  color: var(--ink-soft); text-decoration: none; font-weight: 600;
  border: 1px solid transparent; border-bottom: 0;
  box-shadow: inset 0 -2px 0 transparent;
}
/* Schede senza sottolineatura */
.scheda-voce:hover {
  color: var(--blu); background: var(--blu-tenue); text-decoration: none;
}
.scheda-voce:focus-visible { text-decoration: none; }
.scheda-voce.attiva {
  background: var(--card); color: var(--ink);
  border-color: var(--line);
  /* Copre la linea sotto la scheda attiva */
  box-shadow: inset 0 -2px 0 var(--card);
}
/* Scheda non concessa */
.scheda-spenta {
  opacity: .55; cursor: not-allowed; background: var(--sfondo);
  color: var(--ink-soft); user-select: none;
}
.scheda-spenta:hover { background: var(--sfondo); color: var(--ink-soft); }
.scheda-lucchetto { font-size: .85em; margin-left: 4px; }

/* Scheda di report con la stellina */
.scheda-report { position: relative; }
.scheda-report-link { display: block; color: inherit; text-decoration: none; }
.stella-form { position: absolute; top: 8px; right: 10px; margin: 0; }
/* Oro scuro sul chiaro (contrasto 3:1), oro pieno sul tema scuro */
.stella-attiva, .stella-titolo.stella-attiva { color: #b7791f; }
[data-tema="scuro"] .stella-attiva, [data-tema="scuro"] .stella-titolo.stella-attiva { color: #e3b505; }

/* === Correzioni v19 === */

/* Schede dell'amministrazione scorrevoli */
.schede-scorrevoli {
  flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden;
  scrollbar-width: thin; -webkit-overflow-scrolling: touch;
  scroll-snap-type: x proximity;
}
.schede-scorrevoli .scheda-voce {
  flex: 0 0 auto; white-space: nowrap; scroll-snap-align: start;
}
@media (max-width: 640px) {
  /* Bersaglio e spaziatura */
  .schede-scorrevoli .scheda-voce { padding: 11px 14px; min-height: 44px; display: flex;
                                    align-items: center; gap: 6px; }
  /* Sfumatura a destra */
  .schede-scorrevoli {
    -webkit-mask-image: linear-gradient(to right, #000 88%, transparent 100%);
    mask-image: linear-gradient(to right, #000 88%, transparent 100%);
  }
}

/* Voce «Amministrazione» come pulsante */

/* Nota accanto ad «Applica ora» */

.filter-dropdown-azioni { display: flex; align-items: center; }

/* Aree documentali annidate */
.doc-sottoaree {
  margin: 8px 0 0 6px; padding-left: 14px;
  border-left: 2px solid var(--line);
  display: flex; flex-direction: column; gap: 8px;
}
.doc-albero .doc-scheda .doc-scheda { background: transparent; box-shadow: none; }
.doc-quante-sotto { font-weight: 400; margin-left: 8px; }
.doc-quante-sotto { white-space: nowrap; }
/* Telefono: la descrizione dell'area va a capo, nome e contatore restano sulla riga */
@media (max-width: 640px) {
  .doc-scheda-testa { flex-wrap: wrap; row-gap: 2px; }
  .doc-scheda-testa > .hint { flex: 1 0 100%; padding-left: 1.4em; font-weight: 400; }
}
/* Intestazioni più leggere in profondità */
.doc-livello-1 > .doc-scheda-testa .doc-scheda-nome { font-size: .96em; }
.doc-livello-2 > .doc-scheda-testa .doc-scheda-nome { font-size: .93em; }
.doc-livello-3 > .doc-scheda-testa .doc-scheda-nome,
.doc-livello-4 > .doc-scheda-testa .doc-scheda-nome { font-size: .9em; }
@media (max-width: 640px) {
  /* Rientro ridotto su schermo stretto */
  .doc-sottoaree { margin-left: 2px; padding-left: 8px; }
}

/* Velo sulla zona dei risultati in aggiornamento */
.zona-in-aggiornamento { opacity: .72; transition: opacity .12s; }
@media (prefers-reduced-motion: reduce) {
  .zona-in-aggiornamento { transition: none; }
}

/* === Correzioni v22 === */

/* Barra comandi del report su telefono */
@media (max-width: 640px) {
  .toolbar { row-gap: 8px; column-gap: 8px; }
  /* Scavalca .filtro-menu { width: 100% } */
  .toolbar > details.export-report {
    /* Metà larghezza meno lo spazio */
    flex: 1 1 calc(50% - 8px); width: auto; min-width: 0;
  }
  .toolbar > details.export-report > summary {
    width: 100%; display: flex; align-items: center; justify-content: center;
  }
  /* Spaziatore annullato */
  .toolbar > span.grow { display: none; }
}

/* Filtri e criteri nello stesso riquadro */
/* Sezioni una sotto l'altra */
.riquadro-filtri .filter-panel {
  padding-top: 4px; flex-direction: column; align-items: stretch;
}
/* Senza barra sopra: niente filetto */
@media (min-width: 641px) {
  .riquadro-filtri > .barra-filtri.solo-telefono + .filter-panel {
    margin-top: 0; border-top: 0;
  }
}
/* Tendine affiancate */
#form-filtri-report {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end;
}
#form-filtri-report > .titolo-sezione-filtri { width: 100%; }
.titolo-sezione-filtri, .card h2.titolo-sezione-filtri {
  font-size: .95rem; font-weight: 700; margin: 10px 0 6px;
  color: var(--ink); cursor: pointer;
}

.criteri-avanzati > summary { list-style: none; margin: 6px 0; }
.criteri-avanzati > summary::-webkit-details-marker { display: none; }
/* Pulsante con freccia, come le altre tendine */
.criteri-avanzati > summary::after { content: " ▾"; color: var(--ink-soft); }
.criteri-avanzati[open] > summary::after { content: " ▴"; }

/* Finestra dell'informativa */
.modale-privacy { display: flex; }
.modale-privacy .modale-box { max-width: 44rem; }
.modale-privacy .modale-piede { display: flex; gap: 10px; flex-wrap: wrap; }
.modale-privacy .modale-piede form { margin: 0; }
@media (max-width: 640px) {
  .modale-privacy .modale-piede form { width: 100%; }
  .modale-privacy .modale-piede .btn { width: 100%; }
}

/* Aiuto: recapiti dell'assistenza */
.btn-aiuto {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; border-radius: 999px; cursor: pointer;
  background: var(--barra-bottone); border: 1px solid var(--barra-bordo);
  color: var(--barra-testo-forte); font: inherit; font-weight: 700; font-size: 1rem;
}
.btn-aiuto:hover { background: var(--barra-bottone-hover); }
@media (max-width: 640px) {
  /* Bersaglio da toccare */
  .btn-aiuto { width: 44px; height: 44px; }
}
.aiuto-login { margin: 14px 0 0; text-align: center; font-size: .92rem; }
.aiuto-login a { color: var(--ink-soft); }
.aiuto-login a:hover { color: var(--blu); }

.modale-aiuto .modale-box { max-width: 30rem; }
.elenco-contatti { list-style: none; margin: 0; padding: 0; }
.elenco-contatti li {
  display: flex; flex-direction: column; gap: 2px;
  padding: 10px 0; border-bottom: 1px solid var(--line);
}
.elenco-contatti li:last-child { border-bottom: 0; }
.contatto-etichetta { font-weight: 600; }
/* Nota in fondo alla finestra */
.versione-software { margin: 14px 0 0; padding-top: 10px; border-top: 1px solid var(--line); text-align: left; }

/* Carica da file (Struttura dati → opzioni di un campo) */
.carica-file { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 6px 0; }
.carica-file > label.btn { cursor: pointer; margin: 0; }
.carica-file .carica-file-esito { flex: 1 1 100%; margin: 0; }
.carica-file .carica-file-esito .btn { margin: 4px 6px 0 0; }

/* Modifica in blocco: opzioni multiple a scorrimento */
.bulk-scelte-multiple {
  display: flex; flex-direction: column; gap: 4px;
  max-height: 180px; overflow-y: auto; padding: 4px 0;
}
.bulk-valore-controllo .hint { margin: 4px 0 0; }

/* === Strato TailDash: palette e componenti principali === */
@font-face {
  font-family: "Jost"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url("../vendor/jost/jost-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
                 U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
                 U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Jost"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url("../vendor/jost/jost-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304,
                 U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB,
                 U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Tavolozza chiara */
:root {
  /* scala del testo: 7 gradini */
  --testo-minimo: .75rem; --testo-piccolo: .85rem; --testo-medio: .95rem; --testo-base: 1rem;
  --testo-grande: 1.15rem; --testo-titolo: 1.3rem; --testo-display: 1.6rem;
  --font: "Jost", "Segoe UI", system-ui, -apple-system, sans-serif;
  --paper: #f8f6f2;
  --card: #ffffff; --carta: #ffffff;
  --line: #e5e7eb; --bordo: #e5e7eb; --bordo-tenue: #e5e7eb;
  --line-tenue: #f1f5f9;
  --sfondo: #f8fafc;
  --ink: #1f2937;
  --ink-soft: #4b5563; --grigio-500: #4b5563;
  --ink-tenue: #5b6b7f;
  --blu: #2563eb; --blu-scuro: #1d4ed8; --blu-tenue: #eff6ff;
  --blu-pieno: #2563eb; --blu-pieno-hover: #1d4ed8; /* fondi pieni con testo bianco */
  --ok: #047857;  --ok-bg: #ecfdf5;
  --err: #b91c1c; --err-bg: #fef2f2;
  --err-pieno: #b91c1c; --err-pieno-hover: #991b1b; /* fondi pieni con testo bianco */
  --bordo-campo: #e5e7eb; --bordo-hover: #d1d5db;
  --card-interna: #ffffff; --traccia: #f1f5f9;   /* schede dentro una sezione, fondo delle barre */
  --warn-bg: #fff7ed; --warn-testo: #9a3412; --warn-bordo: #fed7aa;
  --grigio-tenue: #f1f5f9; --grigio-tenue-testo: #334155;
  --r: 4px;
  --barra: #ffffff;
  --barra-testo: #4b5563;
  --barra-testo-forte: #111827;
  --barra-bottone: #ffffff;
  --barra-bottone-hover: #f3f4f6;
  --barra-bordo: #e5e7eb;
  --riga-alterna: #fafafa;
  --campo: #ffffff;
  --tbl-testa: #f9fafb;
  --tbl-testa-testo: #374151;
  --ombra: rgba(15, 23, 42, .12);
  --elev-1: 0 1px 2px rgba(15, 23, 42, .04);
  --elev-2: 0 1px 3px rgba(15, 23, 42, .06), 0 4px 12px rgba(15, 23, 42, .05);
  --elev-3: 0 12px 28px rgba(15, 23, 42, .14), 0 2px 6px rgba(15, 23, 42, .06);
  /* menu laterale */
  --menu-largo: 260px;
  --menu-stretto: 72px;
  --menu-sfondo: #ffffff;
  --menu-testo: #4b5563;
  --menu-forte: #000000;
  --menu-titolo: #6b7280;
  --menu-hover: rgba(0, 0, 0, .05);
  --menu-attivo: rgba(0, 0, 0, .07);
  --barra-alta: 70px;
}

/* Tavolozza scura */
[data-tema="scuro"] {
  --paper: #11161c;
  --card: #1b232d; --carta: #1b232d;
  --line: #2c3743; --bordo: #2c3743; --bordo-tenue: #2c3743;
  --line-tenue: #232d38;
  --sfondo: #161d25;
  --ink: #e9eef5;
  --ink-soft: #b3c0d0; --grigio-500: #b3c0d0;
  --ink-tenue: #9aa8b9;
  --blu: #5b9bf0; --blu-scuro: #8bb8f5; --blu-tenue: #1d2f47;
  --blu-pieno: #2563eb; --blu-pieno-hover: #1d4ed8;
  --ok: #4cc38a;  --ok-bg: #16302a;
  --err: #f0736a; --err-bg: #3a1f1f;
  --err-pieno: #b91c1c; --err-pieno-hover: #991b1b;
  --bordo-campo: #64748b; --bordo-hover: #3d4a59;   /* contorno dei campi: 3:1 sulla scheda */
  --card-interna: #232e3a; --traccia: #2a3542;   /* un gradino sopra la scheda */
  --warn-bg: #3a2f16; --warn-testo: #f5d98a; --warn-bordo: #6b5520;
  --grigio-tenue: #26313d; --grigio-tenue-testo: #d5deea;
  --barra: #1b232d;
  --barra-testo: #b3c0d0;
  --barra-testo-forte: #e9eef5;
  --barra-bottone: transparent;
  --barra-bottone-hover: rgba(255, 255, 255, .06);
  --barra-bordo: #2c3743;
  --riga-alterna: #1f2832;
  --campo: #141a21;
  --tbl-testa: #202a35;
  --tbl-testa-testo: #dbe6f2;
  --ombra: rgba(0, 0, 0, .5);
  --elev-1: 0 1px 2px rgba(0, 0, 0, .35);
  --elev-2: 0 2px 8px rgba(0, 0, 0, .4);
  --elev-3: 0 12px 28px rgba(0, 0, 0, .55);
  --menu-sfondo: #1b232d;
  --menu-testo: #a3b1c2;
  --menu-forte: #ffffff;
  --menu-titolo: #8492a6;
  --menu-hover: rgba(255, 255, 255, .05);
  --menu-attivo: rgba(255, 255, 255, .09);
}

body { font-family: var(--font); letter-spacing: .005em; }
h1, h2, h3, .titolo-pagina { font-weight: 600; }

/* Impianto: menu a sinistra, contenuto a destra */
.shell.con-menu { display: flex; min-height: 100vh; }
.shell.con-menu > .main { flex: 1 1 auto; width: auto; min-width: 0; }

.app-menu {
  flex: 0 0 var(--menu-largo); width: var(--menu-largo);
  position: sticky; top: 0; height: 100vh; overflow-y: auto; overscroll-behavior: contain;
  background: var(--menu-sfondo); border-right: 1px solid var(--line);
  display: flex; flex-direction: column; z-index: 80;
  transition: width .2s ease, flex-basis .2s ease, transform .2s ease;
}
.app-menu-marchio {
  height: var(--barra-alta); flex: 0 0 var(--barra-alta);
  display: flex; align-items: center; justify-content: center; gap: 10px;
  padding: 0 16px; color: var(--ink); text-decoration: none;
}
.app-menu-marchio:hover { text-decoration: none; }
.app-menu-sigla {
  width: 30px; height: 30px; flex: 0 0 30px; background: var(--blu-pieno); color: #ffffff;
  font-weight: 700; font-size: 16px; display: inline-flex; align-items: center; justify-content: center;
}
.app-menu-logo { max-height: 34px; max-width: 180px; object-fit: contain; }
.app-menu-nome {
  font-size: var(--testo-grande); font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.app-menu-voci { display: flex; flex-direction: column; gap: 2px; padding: 4px 20px 28px; }
.app-menu-titolo {
  font-size: var(--testo-piccolo); font-weight: 500; letter-spacing: .1em; text-transform: uppercase;
  color: var(--menu-titolo); padding: 18px 16px 8px; white-space: nowrap;
}
.app-menu-voce {
  display: flex; align-items: center; gap: 10px; min-height: 42px; padding: 0 16px;
  color: var(--menu-testo); text-decoration: none; font-size: var(--testo-base); white-space: nowrap;
  transition: background .15s ease, color .15s ease;
}
.app-menu-voce:hover, .app-menu-voce:focus-visible {
  background: var(--menu-hover); color: var(--menu-forte); text-decoration: none;
}
.app-menu-voce.attiva { background: var(--menu-attivo); color: var(--menu-forte); font-weight: 500; }
.app-menu-ico {
  width: 22px; flex: 0 0 22px; display: inline-flex; align-items: center; justify-content: center;
  font-size: var(--testo-grande); line-height: 1;
}
.app-menu-ico img { max-width: 20px; max-height: 20px; }
.app-menu-testo { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.app-menu-conta {
  font-size: var(--testo-minimo); font-weight: 600; padding: 1px 7px; background: var(--blu-pieno); color: #ffffff;
}
.app-menu-vuoto { font-size: var(--testo-piccolo); color: var(--ink-tenue); padding: 4px 16px 6px; white-space: normal; }
.app-menu-velo { display: none; }

/* menu ridotto alle icone (solo schermo largo non tattile: i tablet lo aprono sopra la pagina) */
@media (min-width: 1367px), (min-width: 1025px) and (pointer: fine), (min-width: 1025px) and (max-height: 499px) {
  body.menu-ridotto .app-menu { flex-basis: var(--menu-stretto); width: var(--menu-stretto); }
  body.menu-ridotto .app-menu-voci { padding: 4px 10px 28px; }
  body.menu-ridotto .app-menu-testo,
  body.menu-ridotto .app-menu-conta,
  body.menu-ridotto .app-menu-titolo { display: none; }
  body.menu-ridotto .app-menu-voce { justify-content: center; padding: 0; }
  body.menu-ridotto .app-menu-logo { max-width: 40px; }
}

/* Barra in alto */
.topbar {
  display: flex; align-items: center; gap: 14px;
  min-height: var(--barra-alta); padding: 0 24px;
  background: var(--barra); color: var(--barra-testo);
  border-bottom: 1px solid var(--line); box-shadow: none;
  position: sticky; top: 0; z-index: 70;
}
.topbar-sx { display: flex; align-items: center; gap: 12px; flex: 1 1 auto; min-width: 0; justify-self: auto; }
.topbar-dx { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; justify-self: auto; }
.shell.con-menu .marchio-nome { display: none; }     /* il nome sta già nel menu */
.marchio-nome { color: var(--barra-testo-forte); }

.btn-aiuto, .utente-sigla {
  width: 44px; height: 44px; flex: 0 0 44px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--line); background: var(--barra-bottone); color: var(--barra-testo-forte);
  cursor: pointer; font: inherit; padding: 0;
  transition: background .15s ease;
}
.btn-aiuto:hover { background: var(--barra-bottone-hover); }
.btn-aiuto { font-weight: 600; font-size: var(--testo-base); }
.utente-sigla {
  border: 0; background: #dbeafe; color: #1d4ed8; font-weight: 600; font-size: var(--testo-medio);
  text-decoration: none; letter-spacing: .02em;
}
.utente-sigla:hover { text-decoration: none; background: #bfdbfe; }
[data-tema="scuro"] .utente-sigla { background: #1d2f47; color: #a9c8f5; }

.barra-titolo-ico {
  display: inline-flex; align-items: center; justify-content: center;
  width: 24px; flex: 0 0 24px; font-size: var(--testo-grande); color: var(--barra-testo-forte);
}
.barra-titolo-ico img { max-width: 22px; max-height: 22px; }
.barra-titolo-ico svg.hi { width: 22px; height: 22px; }
/* Titolo della sezione aperta */
.barra-titolo {
  font-size: var(--testo-grande); font-weight: 500; color: var(--barra-testo-forte);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0;
}

/* Menu utente: le iniziali aprono il pannello */
.menu-utente { position: relative; }
.menu-utente > summary { list-style: none; }
.menu-utente > summary::-webkit-details-marker { display: none; }
.menu-utente[open] > .utente-sigla { box-shadow: 0 0 0 3px rgba(37, 99, 235, .25); }
.menu-utente-pannello {
  position: absolute; right: 0; top: calc(100% + 10px); z-index: 85;
  min-width: 250px; padding: 6px 0;
  background: var(--card); color: var(--ink);
  border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--elev-3);
  display: flex; flex-direction: column;
}
.menu-utente-chi {
  display: flex; flex-direction: column; gap: 2px;
  padding: 10px 16px 12px; margin-bottom: 4px; border-bottom: 1px solid var(--line);
}
.menu-utente-nome { font-weight: 600; color: var(--ink); }
.menu-utente-ruolo { font-size: var(--testo-piccolo); color: var(--ink-tenue); }
.menu-utente-pannello > a, .menu-utente-pannello .tema-toggle {
  display: flex; align-items: center; gap: 10px; min-height: 42px; padding: 0 16px;
  color: var(--ink); text-decoration: none; border-radius: 0; font-size: var(--testo-medio);
}
.menu-utente-pannello > a:hover, .menu-utente-pannello > a:focus-visible,
.menu-utente-pannello .tema-toggle:hover { background: var(--menu-hover); text-decoration: none; }
.menu-utente-pannello > a.attiva { background: var(--menu-attivo); font-weight: 500; }
.menu-utente-pannello .voce-ico { width: 20px; display: inline-flex; justify-content: center; }
.menu-utente-pannello .menu-utente-esci { border-top: 1px solid var(--line); margin-top: 4px; color: var(--err); }

/* Contenuto */
.content { padding: 24px; }
.titolo-pagina { font-size: var(--testo-titolo); font-weight: 600; color: var(--ink); }

/* Riquadri */
.card, .tbl-dati, .doc-scheda, .box-widget, .box-tabella {
  border: 1px solid var(--line); border-radius: 0; box-shadow: none;
}
.card { padding: 20px; margin-bottom: 24px; background: var(--card); }
.card > h2, .card > h2:first-child, .widget-testa h2 { font-size: var(--testo-base); font-weight: 600; color: var(--ink); }
.card > h2 { border-bottom: 1px solid var(--line); padding-bottom: 12px; margin-bottom: 14px; }
.card-link { transition: box-shadow .15s ease, border-color .15s ease; }
.card-link:hover { box-shadow: var(--elev-2); transform: none; border-color: var(--bordo-hover); }
.widget-area { gap: 24px; }
.widget { margin: 0; }
.widget-testa { margin-bottom: 14px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.widget-presa, .box-presa { color: var(--ink-tenue); }

/* Riquadri delle tabelle in homepage: schede di sintesi */
.box-tabella { padding: 0; display: flex; flex-direction: column; overflow: hidden; }
.box-tabella .box-presa { top: 8px; right: 10px; z-index: 1; }
.scheda-tabella-link { display: flex; flex-direction: column; height: 100%; }
.sintesi-corpo { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 20px; flex: 1 1 auto; }
.sintesi-testo { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.scheda-tabella .sintesi-testo h3 {
  margin: 0; font-size: var(--testo-medio); font-weight: 600; color: var(--ink-tenue);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.sintesi-testo .stat b { font-size: var(--testo-display); font-weight: 600; color: var(--ink); }
.sintesi-ultimo { font-size: var(--testo-piccolo); }
.sintesi-icona {
  width: 56px; height: 56px; flex: 0 0 56px; background: var(--blu-tenue); color: var(--blu);
  display: inline-flex; align-items: center; justify-content: center; font-size: var(--testo-display);
}
.sintesi-icona img { max-width: 28px; max-height: 28px; }
.sintesi-piede {
  display: flex; align-items: center; gap: 6px; padding: 12px 20px;
  background: var(--sfondo); color: var(--blu); font-weight: 600; font-size: var(--testo-medio);
}
.box-tabella:hover .sintesi-piede { text-decoration: underline; }
.box-widget { padding: 20px; }
.box-widget h3 { font-size: var(--testo-medio); font-weight: 600; color: var(--ink-tenue); }
.box-widget .stat b { font-size: var(--testo-display); font-weight: 600; }

/* Pulsanti */
.btn {
  border-radius: var(--r); font-weight: 500; letter-spacing: .02em;
  background: var(--blu-pieno); border-color: var(--blu-pieno); box-shadow: none;
}
.btn:hover { background: var(--blu-pieno-hover); border-color: var(--blu-pieno-hover); box-shadow: none; }
.btn-ghost {
  background: var(--grigio-tenue); color: var(--grigio-tenue-testo); border-color: transparent;
}
.btn-ghost:hover { background: var(--line); color: var(--ink); box-shadow: none; }
[data-tema="scuro"] .btn-ghost { background: var(--grigio-tenue); color: var(--grigio-tenue-testo); }
.btn-danger { background: var(--err-pieno); border-color: var(--err-pieno); color: #ffffff; }
.btn-danger:hover { background: var(--err-pieno-hover); border-color: var(--err-pieno-hover); color: #ffffff; }

/* Campi */
input[type=text], input[type=password], input[type=number], input[type=date],
input[type=email], input[type=file], input[type=search], input[type=time],
input[type=datetime-local], select, textarea {
  border-color: var(--line); border-radius: var(--r); box-shadow: none;
}
/* Fuoco dei campi: contorno pieno di 2px, ben visibile in entrambi i temi */
input:focus, select:focus, textarea:focus {
  border-color: var(--blu); box-shadow: none; outline: 2px solid var(--blu); outline-offset: 1px;
}
.ricerca-gruppo:focus-within { box-shadow: none; outline: 2px solid var(--blu); outline-offset: 1px; }
label { color: var(--ink-soft); font-weight: 500; }
.filtro-menu > summary { border-radius: var(--r); border-color: var(--line); }

/* Testo solo per i lettori di schermo */
.solo-lettore {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* Righe per pagina (sotto le tabelle): pulsante secondario con bordo */
.paginazione .per-pagina-menu > summary.btn-ghost {
  display: inline-flex; align-items: center; gap: 6px; min-height: 36px;
  padding: 7px 14px; font-size: 14px; border: 1px solid var(--line); border-radius: var(--r);
  background: var(--grigio-tenue); color: var(--grigio-tenue-testo);
}
.paginazione .per-pagina-menu > summary.btn-ghost:hover { background: var(--line); color: var(--ink); }

/* Pulsante che sembra testo: apre la riga di una tabella da tastiera */
.cella-apri {
  background: none; border: 0; padding: 0; margin: 0; font: inherit; color: inherit;
  text-align: left; cursor: pointer;
}
.cella-apri:hover { color: var(--blu); }

/* «Salta al contenuto»: compare solo quando riceve il fuoco da tastiera */
.salta-contenuto {
  position: fixed; top: 8px; left: 8px; z-index: 1000; transform: translateY(-200%);
  padding: 10px 16px; border-radius: var(--r); background: var(--blu-pieno); color: #ffffff;
  font-weight: 600; text-decoration: none;
}
.salta-contenuto:focus { transform: none; text-decoration: none; }
#contenuto:focus { outline: none; }

/* Titolo della finestra: riceve il fuoco all'apertura, senza contorno */
#modale-titolo:focus, #titolo-privacy:focus { outline: none; }

/* Testo che non va a capo (date, orari) */
.senza-a-capo { white-space: nowrap; }

/* Colonne numeriche: allineate a destra, cifre di pari larghezza */
.tbl-dati .col-num { text-align: right; font-variant-numeric: tabular-nums; }

/* Etichette delle schede record (telefono): almeno 12px */
.scheda-rec-sommario dt, .scheda-rec-corpo dt { font-size: var(--testo-minimo); }

/* Scheda di un registro nell'area Widget: due colonne della griglia, tre caselle compatte */
.box-registro { grid-column: span 2; }
@media (max-width: 640px) { .box-registro { grid-column: auto; } }
.registro-caselle { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.registro-casella {
  display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; min-height: 44px;
  border: 1px solid var(--line); border-radius: var(--r); background: var(--card);
  color: var(--ink); text-decoration: none;
}
.registro-casella:hover { border-color: var(--c); background: var(--f); }
.registro-casella b { font-size: var(--testo-titolo); font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1.2; }
.registro-casella span:last-child { font-size: var(--testo-minimo); color: var(--ink-soft); line-height: 1.3; }
.registro-casella-pallino { width: 10px; height: 10px; border-radius: 50%; background: var(--c); }
.registro-dialogo-corpo { padding: 14px 18px; display: grid; gap: 6px; }

/* Intestazione dei widget: titolo, poi ✎ ✕ ⠿ sulla stessa riga (area di tocco di 24px) */
.box-widget-testa { display: flex; align-items: flex-start; gap: 2px; margin: -8px -8px 6px 0; }
.box-widget-testa h3 { flex: 1 1 auto; min-width: 0; margin: 8px 6px 0 0; overflow-wrap: break-word; }
/* colonne dei widget abbastanza larghe per titolo e comandi */
@media (max-width: 1024px) { .griglia-widget { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); } }
@media (max-width: 640px) { .griglia-widget { grid-template-columns: 1fr; } }
.box-widget-testa .box-chiudi, .box-widget-testa .box-presa { position: static; margin: 0; }
.box-comando {
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
  min-width: 24px; min-height: 24px; padding: 0; border: 0; background: none; cursor: pointer;
  font-size: 13px; color: var(--ink-tenue); text-decoration: none; border-radius: var(--r);
}
.box-comando:hover { color: var(--blu); background: var(--blu-tenue); }
.box-chiudi .box-comando:hover { color: var(--err); background: var(--err-bg); }
/* Widget tutti della stessa altezza: gli elenchi lunghi scorrono dentro il riquadro */
.griglia-widget { grid-auto-rows: 176px; align-items: stretch; }
.griglia-widget-alta { grid-auto-rows: 236px; }
.griglia-widget-molto_alta { grid-auto-rows: 296px; }
.altezza-widget { display: inline-flex; gap: 2px; }
.altezza-widget .btn[aria-pressed="true"] { color: var(--blu); background: var(--blu-tenue); }
.griglia-widget .box-widget { display: flex; flex-direction: column; min-height: 0; overflow: hidden; margin: 0; }
.griglia-widget .box-widget .widget-elenco {
  flex: 1 1 auto; min-height: 0; overflow-y: auto; align-content: start; grid-auto-rows: max-content;
}
.griglia-widget .box-widget > .hint:last-child { margin: auto 0 0; padding-top: 6px; }
/* senza display: sul telefono la presa resta nascosta */
.box-widget-testa .box-presa { min-width: 24px; line-height: 24px; text-align: center; }

/* Tabelle */
.tbl th, .tbl-dati thead th {
  background: var(--tbl-testa); color: var(--tbl-testa-testo); font-weight: 600;
}
.tbl-dati thead th { box-shadow: inset 0 -1px 0 var(--line); }
.tbl-dati thead th a { color: var(--tbl-testa-testo); }
.tbl-dati thead th a:hover { color: var(--blu); }
.tbl td, .tbl-dati td { border-bottom-color: var(--line-tenue); }
.tbl tbody tr:hover, .tbl-dati tbody tr:hover, .riga-link:hover td { background: var(--blu-tenue); }

/* Etichette e avvisi */
.badge { border-radius: 2px; font-weight: 500; padding: 3px 8px; }
.flash { border-radius: var(--r); }

/* Finestre */
.modale-sfondo { background: rgba(15, 23, 42, .5); }
.modale-box { border-radius: 0; box-shadow: var(--elev-3); background: var(--card); }
.modale-testa { padding: 16px 24px; border-bottom-color: var(--line); }
.modale-testa h2 { font-size: var(--testo-grande); font-weight: 600; }
.modale-corpo { padding: 20px 24px; }

/* Grafici */
.grafici-griglia { gap: 24px; margin-bottom: 24px; }
.grafico h2 { font-size: var(--testo-base); font-weight: 600; }
.barre { gap: 12px; }
.barra-traccia { background: var(--traccia); border-radius: 0; height: 22px; }
.barra-valore { border-radius: 0; box-shadow: none; }
.barra-et { color: var(--ink-soft); font-size: var(--testo-piccolo); }
.barra-num { font-weight: 600; font-size: var(--testo-piccolo); }
.torta { width: 180px; height: 180px; transform: none; }
.torta-fondo { stroke: var(--line-tenue); }
.torta-totale { font-family: var(--font); font-size: 7px; font-weight: 700; fill: var(--ink); }
.torta-dicitura { font-family: var(--font); font-size: 3px; fill: var(--ink-tenue); }
.legenda { gap: 8px; font-size: var(--testo-medio); }
.legenda .chiave { border-radius: 0; width: 12px; height: 12px; }
.grafico-linea { height: 180px; }
.linea-griglia path { stroke: var(--line-tenue); stroke-width: 1; }
.linea-base { stroke: var(--line); stroke-width: 1; }
.linea-area { opacity: .12; }
.grafico-linea circle { stroke: var(--card); stroke-width: 1.5; }
/* Tavolozza TailDash */
.pal-taildash .barra-0, .pal-taildash .chiave-0 { background: #0f9f84; } .pal-taildash .fetta-0 { stroke: #0f9f84; }
.pal-taildash .barra-1, .pal-taildash .chiave-1 { background: #2563eb; } .pal-taildash .fetta-1 { stroke: #2563eb; }
.pal-taildash .barra-2, .pal-taildash .chiave-2 { background: #f59e0b; } .pal-taildash .fetta-2 { stroke: #f59e0b; }
.pal-taildash .barra-3, .pal-taildash .chiave-3 { background: #dc2626; } .pal-taildash .fetta-3 { stroke: #dc2626; }
.pal-taildash .barra-4, .pal-taildash .chiave-4 { background: #6d28d9; } .pal-taildash .fetta-4 { stroke: #6d28d9; }
.pal-taildash .barra-5, .pal-taildash .chiave-5 { background: #0891b2; } .pal-taildash .fetta-5 { stroke: #0891b2; }
.pal-taildash .barra-6, .pal-taildash .chiave-6 { background: #db2777; } .pal-taildash .fetta-6 { stroke: #db2777; }
.pal-taildash .barra-7, .pal-taildash .chiave-7 { background: #64748b; } .pal-taildash .fetta-7 { stroke: #64748b; }
.pal-taildash .grafico-linea { color: #2563eb; }
/* Grafici nel tema scuro: stesse tinte, schiarite fino ad almeno 3:1 sulla scheda */
/* palette di serie: :where() la lascia sotto le palette scelte */
[data-tema="scuro"] :where(.barra-0), [data-tema="scuro"] :where(.chiave-0) { background: #57759e; } [data-tema="scuro"] :where(.fetta-0) { stroke: #57759e; }
[data-tema="scuro"] :where(.barra-1), [data-tema="scuro"] :where(.chiave-1) { background: #c94817; } [data-tema="scuro"] :where(.fetta-1) { stroke: #c94817; }
[data-tema="scuro"] :where(.barra-2), [data-tema="scuro"] :where(.chiave-2) { background: #23827a; } [data-tema="scuro"] :where(.fetta-2) { stroke: #23827a; }
[data-tema="scuro"] :where(.barra-3), [data-tema="scuro"] :where(.chiave-3) { background: #d23933; } [data-tema="scuro"] :where(.fetta-3) { stroke: #d23933; }
[data-tema="scuro"] :where(.barra-4), [data-tema="scuro"] :where(.chiave-4) { background: #864cf9; } [data-tema="scuro"] :where(.fetta-4) { stroke: #864cf9; }
[data-tema="scuro"] :where(.barra-5), [data-tema="scuro"] :where(.chiave-5) { background: #a4650e; } [data-tema="scuro"] :where(.fetta-5) { stroke: #a4650e; }
[data-tema="scuro"] :where(.barra-6), [data-tema="scuro"] :where(.chiave-6) { background: #2b6af2; } [data-tema="scuro"] :where(.fetta-6) { stroke: #2b6af2; }
[data-tema="scuro"] :where(.barra-7), [data-tema="scuro"] :where(.chiave-7) { background: #507f14; } [data-tema="scuro"] :where(.fetta-7) { stroke: #507f14; }
[data-tema="scuro"] :where(.grafico-linea) { color: #57759e; }
[data-tema="scuro"] .pal-istituzionale .barra-0, [data-tema="scuro"] .pal-istituzionale .chiave-0 { background: #4375ae; } [data-tema="scuro"] .pal-istituzionale .fetta-0 { stroke: #4375ae; }
[data-tema="scuro"] .pal-istituzionale .barra-1, [data-tema="scuro"] .pal-istituzionale .chiave-1 { background: #bb5915; } [data-tema="scuro"] .pal-istituzionale .fetta-1 { stroke: #bb5915; }
[data-tema="scuro"] .pal-istituzionale .barra-2, [data-tema="scuro"] .pal-istituzionale .chiave-2 { background: #1e7d99; } [data-tema="scuro"] .pal-istituzionale .fetta-2 { stroke: #1e7d99; }
[data-tema="scuro"] .pal-istituzionale .barra-3, [data-tema="scuro"] .pal-istituzionale .chiave-3 { background: #c9415a; } [data-tema="scuro"] .pal-istituzionale .fetta-3 { stroke: #c9415a; }
[data-tema="scuro"] .pal-istituzionale .barra-4, [data-tema="scuro"] .pal-istituzionale .chiave-4 { background: #825ed8; } [data-tema="scuro"] .pal-istituzionale .fetta-4 { stroke: #825ed8; }
[data-tema="scuro"] .pal-istituzionale .barra-5, [data-tema="scuro"] .pal-istituzionale .chiave-5 { background: #3369f4; } [data-tema="scuro"] .pal-istituzionale .fetta-5 { stroke: #3369f4; }
[data-tema="scuro"] .pal-istituzionale .barra-6, [data-tema="scuro"] .pal-istituzionale .chiave-6 { background: #5b7f34; } [data-tema="scuro"] .pal-istituzionale .fetta-6 { stroke: #5b7f34; }
[data-tema="scuro"] .pal-istituzionale .barra-7, [data-tema="scuro"] .pal-istituzionale .chiave-7 { background: #657489; } [data-tema="scuro"] .pal-istituzionale .fetta-7 { stroke: #657489; }
[data-tema="scuro"] .pal-istituzionale .grafico-linea { color: #4375ae; }
[data-tema="scuro"] .pal-sabbia .barra-0, [data-tema="scuro"] .pal-sabbia .chiave-0 { background: #b05c41; } [data-tema="scuro"] .pal-sabbia .fetta-0 { stroke: #b05c41; }
[data-tema="scuro"] .pal-sabbia .barra-2, [data-tema="scuro"] .pal-sabbia .chiave-2 { background: #76726d; } [data-tema="scuro"] .pal-sabbia .fetta-2 { stroke: #76726d; }
[data-tema="scuro"] .pal-sabbia .barra-4, [data-tema="scuro"] .pal-sabbia .chiave-4 { background: #507f14; } [data-tema="scuro"] .pal-sabbia .fetta-4 { stroke: #507f14; }
[data-tema="scuro"] .pal-sabbia .barra-5, [data-tema="scuro"] .pal-sabbia .chiave-5 { background: #b35e32; } [data-tema="scuro"] .pal-sabbia .fetta-5 { stroke: #b35e32; }
[data-tema="scuro"] .pal-sabbia .grafico-linea { color: #b05c41; }
[data-tema="scuro"] .pal-verde .barra-0, [data-tema="scuro"] .pal-verde .chiave-0 { background: #468158; } [data-tema="scuro"] .pal-verde .fetta-0 { stroke: #468158; }
[data-tema="scuro"] .pal-verde .barra-2, [data-tema="scuro"] .pal-verde .chiave-2 { background: #1e7d99; } [data-tema="scuro"] .pal-verde .fetta-2 { stroke: #1e7d99; }
[data-tema="scuro"] .pal-verde .barra-4, [data-tema="scuro"] .pal-verde .chiave-4 { background: #1e8462; } [data-tema="scuro"] .pal-verde .fetta-4 { stroke: #1e8462; }
[data-tema="scuro"] .pal-verde .barra-5, [data-tema="scuro"] .pal-verde .chiave-5 { background: #bb5915; } [data-tema="scuro"] .pal-verde .fetta-5 { stroke: #bb5915; }
[data-tema="scuro"] .pal-verde .barra-7, [data-tema="scuro"] .pal-verde .chiave-7 { background: #5f7e41; } [data-tema="scuro"] .pal-verde .fetta-7 { stroke: #5f7e41; }
[data-tema="scuro"] .pal-verde .grafico-linea { color: #468158; }
[data-tema="scuro"] .pal-contrasto .barra-0, [data-tema="scuro"] .pal-contrasto .chiave-0 { background: #1078b9; } [data-tema="scuro"] .pal-contrasto .fetta-0 { stroke: #1078b9; }
[data-tema="scuro"] .pal-contrasto .barra-6, [data-tema="scuro"] .pal-contrasto .chiave-6 { background: #864cf9; } [data-tema="scuro"] .pal-contrasto .fetta-6 { stroke: #864cf9; }
[data-tema="scuro"] .pal-contrasto .barra-7, [data-tema="scuro"] .pal-contrasto .chiave-7 { background: #74747b; } [data-tema="scuro"] .pal-contrasto .fetta-7 { stroke: #74747b; }
[data-tema="scuro"] .pal-contrasto .grafico-linea { color: #1078b9; }
[data-tema="scuro"] .pal-taildash .barra-1, [data-tema="scuro"] .pal-taildash .chiave-1 { background: #2b6af2; } [data-tema="scuro"] .pal-taildash .fetta-1 { stroke: #2b6af2; }
[data-tema="scuro"] .pal-taildash .barra-3, [data-tema="scuro"] .pal-taildash .chiave-3 { background: #e02b29; } [data-tema="scuro"] .pal-taildash .fetta-3 { stroke: #e02b29; }
[data-tema="scuro"] .pal-taildash .barra-4, [data-tema="scuro"] .pal-taildash .chiave-4 { background: #864cf9; } [data-tema="scuro"] .pal-taildash .fetta-4 { stroke: #864cf9; }
[data-tema="scuro"] .pal-taildash .grafico-linea { color: #2b6af2; }

/* Pagina di accesso */
/* Colori del logo Cotral */
.login-shell {
  padding: 24px 16px;
  background-color: #0077b3;
  background-image:
    radial-gradient(circle at 88% 92%, rgba(242, 142, 0, .55) 0, rgba(242, 142, 0, 0) 38%),
    radial-gradient(circle at 10% 8%, rgba(255, 255, 255, .12) 0, rgba(255, 255, 255, 0) 35%),
    linear-gradient(135deg, #0077b3 0%, #00598a 42%, #9e0b2e 78%, #cc0935 100%);
  background-attachment: fixed;
}
.login-card .btn { background: #0077b3; border-color: #0077b3; }
.login-card .btn:hover { background: #005f8f; border-color: #005f8f; }
.login-card .brand-mark { background: #0077b3; }
.login-card input:focus { border-color: #0077b3; box-shadow: 0 0 0 3px rgba(0, 119, 179, .18); }
.login-card { width: 100%; max-width: 460px; border-radius: 6px; padding: 36px 28px; box-shadow: var(--elev-3); }
.login-card .brand { justify-content: center; padding-bottom: 22px; }
.login-card .brand-mark { border-radius: 0; width: 32px; height: 32px; }
.login-card .brand-name { font-size: var(--testo-titolo); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.login-card .btn { min-height: 44px; font-size: var(--testo-base); letter-spacing: .05em; }
.login-card input { min-height: 44px; }
/* Campi e pulsante a tutta larghezza del riquadro */
.login-card .form-group, .login-card .btn { max-width: none; width: 100%; }
.aiuto-login a { color: var(--ink-soft); }

/* Icone Heroicons (hi:nome) */
/* SVG a 1em */
svg.hi { width: 1.15em; height: 1.15em; display: inline-block; vertical-align: -.2em; flex: 0 0 auto; }
.sel-icona-voce svg.hi { width: 20px; height: 20px; }
.sel-icona-anteprima svg.hi { width: 18px; height: 18px; }
.sintesi-icona svg.hi { width: 28px; height: 28px; }
.app-menu-ico svg.hi { width: 21px; height: 21px; }
.barra-basso-ico svg.hi { width: 23px; height: 23px; }

/* Barra in basso (telefono) */
.barra-basso { display: none; }

/* Schermo medio e telefono: menu sopra la pagina */
@media (max-width: 1024px) {
  .app-menu {
    position: fixed; top: 0; left: 0; bottom: 0; height: auto;
    width: 288px; flex-basis: auto; transform: translateX(-100%);
    box-shadow: none; z-index: 95;
  }
  body.menu-aperto .app-menu { transform: none; box-shadow: 8px 0 30px rgba(15, 23, 42, .2); }
  body.menu-aperto { overflow: hidden; }
  .app-menu-velo { display: block; position: fixed; inset: 0; z-index: 90; background: rgba(15, 23, 42, .5); }
  .app-menu-velo[hidden] { display: none; }
  .app-menu-marchio { justify-content: flex-start; padding: 0 20px; border-bottom: 1px solid var(--line); }
  .app-menu-voci { padding: 4px 12px 28px; }
  .app-menu-voce { min-height: 44px; }
}
@media (max-width: 640px) {
  :root { --barra-alta: 60px; --r: 4px; }
  .topbar {
    min-height: var(--barra-alta); gap: 8px;
    padding: env(safe-area-inset-top, 0px) calc(10px + env(safe-area-inset-right, 0px)) 0 calc(10px + env(safe-area-inset-left, 0px));
  }
  .topbar-sx { gap: 6px; }
  .topbar-dx { gap: 6px; }
  .barra-titolo { font-size: var(--testo-base); }
  /* Menu utente a tutta larghezza (telefono) */
  .menu-utente-pannello {
    position: fixed; left: 8px; right: 8px; top: calc(var(--barra-alta) + env(safe-area-inset-top, 0px) + 6px);
    min-width: 0;
  }
  .menu-utente-pannello > a, .menu-utente-pannello .tema-toggle { min-height: 48px; }
  .content { padding: 16px 14px calc(92px + env(safe-area-inset-bottom, 0px)); }
  .card { padding: 16px; margin-bottom: 16px; }
  .card, .tbl-dati, .box-widget, .box-tabella { border-radius: 0; }
  .sintesi-corpo { padding: 14px; }
  .sintesi-icona { width: 44px; height: 44px; flex-basis: 44px; font-size: var(--testo-grande); }
  .sintesi-piede { padding: 10px 14px; }
  .modale-box { border-radius: 0; }

  .barra-basso {
    display: grid; grid-auto-flow: column; grid-auto-columns: 1fr;
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 50;
    background: var(--card); border-top: 1px solid var(--line);
    padding-bottom: env(safe-area-inset-bottom, 0px);
    box-shadow: 0 -4px 14px rgba(15, 23, 42, .06);
  }
  .barra-basso a {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
    min-height: 62px; font-size: var(--testo-minimo); color: var(--ink-soft); text-decoration: none;
  }
  .barra-basso a.attiva { color: var(--blu); font-weight: 600; }
  .barra-basso-ico { font-size: var(--testo-titolo); line-height: 1; }
  .barra-basso-ico img { max-width: 22px; max-height: 22px; }
  body.modale-aperta .barra-basso { display: none; }
}
@media (max-width: 380px) {
  .btn-aiuto { display: none; }        /* su 360px lo spazio serve al titolo */
}
/* Iniziali sempre visibili */
.utente-sigla { cursor: pointer; user-select: none; }
@media print {
  .app-menu, .app-menu-velo, .barra-basso, .linguetta-menu, .utente-sigla { display: none !important; }
}

/* Assistenza: più recapiti per etichetta (finestra di aiuto) */
.modale-aiuto .modale-box { max-width: 34rem; }
.contatto-gruppo { margin-top: 6px; }
.contatto-tipo { display: block; font-size: var(--testo-piccolo); color: var(--ink-soft); }
/* Due recapiti per riga */
.contatto-recapiti {
  list-style: none; margin: 2px 0 0; padding: 0;
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 16px;
}
.elenco-contatti .contatto-recapiti li {
  display: block; padding: 2px 0; border: 0; overflow-wrap: anywhere;
}
/* Assistenza: editor in Sistema */
.ass-elenco { display: flex; flex-direction: column; gap: 12px; }
.ass-blocco {
  margin: 0; padding: 12px 14px; min-width: 0;
  border: 1px solid var(--line); border-radius: 10px;
}
.ass-blocco > .form-group { margin-bottom: 8px; }
.ass-recapiti { display: flex; flex-direction: column; gap: 6px; margin-bottom: 8px; }
.ass-recapito { display: flex; gap: 6px; align-items: center; }
.ass-recapito select { flex: 0 0 9.5rem; }
.ass-recapito input { flex: 1 1 auto; min-width: 0; }
@media (max-width: 640px) {
  .ass-recapito { flex-wrap: wrap; }
  .ass-recapito select { flex: 1 1 100%; }
}

/* Campo a categorie: tag compatti (11px) */
.tag-scelti { gap: 4px; min-height: 20px; }
.tag-voce {
  gap: 4px; padding: 1px 4px 1px 8px;
  font-size: 11px; line-height: 16px; font-weight: 600;
}
.tag-togli { font-size: 13px; line-height: 1; padding: 0 2px; }
/* Ricerca larga 20 caratteri */
.tag-nidificato input.tag-cerca { width: calc(20ch + 2.4em); max-width: 100%; }
/* Albero: categorie che si aprono e si chiudono */
.tag-gruppo + .tag-gruppo { margin-top: 2px; }
button.tag-gruppo-nome {
  display: flex; align-items: center; gap: 6px; width: 100%;
  margin: 0; padding: 5px 6px; border: 0; border-radius: 6px;
  background: none; cursor: pointer; text-align: left; font-family: inherit;
}
button.tag-gruppo-nome:hover { background: var(--blu-tenue); color: var(--blu-scuro); }
button.tag-gruppo-nome:focus-visible { outline: 2px solid var(--blu); outline-offset: -2px; }
.tag-gruppo-freccia {
  flex: none; width: 0; height: 0;
  border-top: 4px solid transparent; border-bottom: 4px solid transparent;
  border-left: 6px solid currentColor; transition: transform .12s;
}
.tag-gruppo-nome[aria-expanded="true"] .tag-gruppo-freccia { transform: rotate(90deg); }
.tag-gruppo-conta {
  margin-left: auto; font-weight: 600; letter-spacing: 0;
  color: var(--ink-tenue, var(--ink-soft));
}
.tag-gruppo-voci { margin: 0 0 6px 10px; border-left: 1px solid var(--line); }
.tag-gruppo-voci[hidden] { display: none; }
/* === Registri: consultazione, cruscotto, cronologia, dettaglio === */
:root { --stato-corso:#f59e0b; --stato-riscuotere:#b91c1c; --stato-incassata:#047857; --stato-nondovuta:#94a3b8; --stato-arrivo:#2563eb; }
[data-tema="scuro"] { --stato-corso:#e2a355; --stato-riscuotere:#f0736a; --stato-incassata:#4cc38a; --stato-arrivo:#5b9bf0; }

/* Consultazione a due metà */
.consulta-due { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:24px; align-items:start; }
.consulta-due.consulta-una { grid-template-columns:minmax(0, 1fr); }
.consulta-colonna { min-width:0; }
.consulta-testa { display:flex; align-items:baseline; justify-content:space-between; gap:10px; flex-wrap:wrap; border-bottom:1px solid var(--line); padding-bottom:10px; margin-bottom:14px; }
.consulta-testa h2 { margin:0; font-size:var(--testo-grande); }
.consulta-griglia { display:grid; grid-template-columns:repeat(auto-fill, minmax(230px, 1fr)); gap:14px; }
.consulta-griglia .card, .consulta-vuoto-card { margin:0; }
.consulta-griglia h3 { margin:0 28px 6px 0; font-size:var(--testo-base); }
.consulta-tutti { margin-top:14px; }
.consulta-tutti > summary { list-style:none; display:inline-flex; align-items:center; gap:8px; cursor:pointer; }
.consulta-tutti > summary::-webkit-details-marker { display:none; }
.consulta-tutti[open] > summary { margin-bottom:14px; }
.consulta-vuoto { margin:0 0 4px; }
.consulta-vuoto-card h3 { margin:0 0 6px; font-size:var(--testo-base); }
@media (max-width:1024px) { .consulta-due { grid-template-columns:minmax(0, 1fr); } }

/* Stato: pallino e parola */
.stato-voce { display:inline-flex; align-items:center; gap:6px; padding:2px 8px; border-radius:2px; font-size:var(--testo-piccolo); font-weight:500; white-space:nowrap; line-height:1.5; }
.stato-voce::before { content:""; width:8px; height:8px; border-radius:50%; flex:0 0 8px; background:var(--c, currentColor); }
.stato-corso { --c:var(--stato-corso); background:var(--warn-bg); color:var(--warn-testo); }
.stato-riscuotere { --c:var(--stato-riscuotere); background:var(--err-bg); color:var(--err); }
.stato-incassata { --c:var(--stato-incassata); background:var(--ok-bg); color:var(--ok); }
.stato-nondovuta { --c:var(--stato-nondovuta); background:var(--grigio-tenue); color:var(--grigio-tenue-testo); }
.stato-arrivo { --c:var(--stato-arrivo); background:var(--blu-tenue); color:var(--blu-scuro); }
.registro-conteggi { display:flex; flex-wrap:wrap; gap:6px; margin:8px 0 0; }
.voce-avviso { color:var(--warn-testo); font-weight:700; margin-left:4px; cursor:help; }

/* Barra e filtri */
.registro-barra { align-items:center; }
.interruttore-vista { display:inline-flex; gap:4px; }
.registro-filtri { padding:14px 18px; margin-bottom:18px; }
.registro-filtri-riga { display:flex; flex-wrap:wrap; gap:12px 16px; align-items:flex-end; }
.registro-filtri-riga .form-group { margin:0; min-width:140px; flex:0 1 auto; }
.registro-filtri-riga .filtro-menu { position:relative; }
.registro-scorciatoie, .registro-filtri-azioni { display:flex; flex-wrap:wrap; gap:6px; align-items:center; padding-bottom:3px; }
.registro-nota-periodo { margin:10px 0 0; }
.registro-filtri h2.titolo-sezione-filtri { cursor:default; margin-top:16px; }
.registro-filtri h2.titolo-sezione-filtri:first-of-type { margin-top:4px; }
/* Ricerca su tutti i campi: casella corta, accanto alle tendine */
.registro-filtri-riga .registro-cerca { flex:0 1 300px; width:300px; min-width:200px; max-width:100%; border-radius:999px; padding:7px 14px; }
/* «＋ Aggiungi campo filtro»: pillola tratteggiata stretta accanto alle tendine */
.registro-filtri-riga .registro-aggiungi-filtro { flex:0 0 auto; width:auto; max-width:220px; border:1px dashed var(--line); border-radius:999px; padding:7px 14px; background:transparent; color:var(--ink-soft); cursor:pointer; }
@media (max-width:640px) { .registro-filtri-riga .registro-cerca, .registro-filtri-riga .registro-aggiungi-filtro { flex-basis:100%; width:100%; max-width:none; } }

/* Numeri di sintesi */
.registro-sintesi { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:16px; margin-bottom:18px; }
.registro-kpi { display:flex; align-items:center; justify-content:space-between; gap:12px; background:var(--card); border:1px solid var(--line); padding:16px 18px; min-width:0; }
.registro-kpi h3 { margin:0; font-size:var(--testo-medio); font-weight:600; color:var(--ink-tenue); }
.registro-kpi b { display:block; font-size:var(--testo-display); font-weight:600; color:var(--ink); margin:2px 0; font-variant-numeric:tabular-nums; }
.registro-kpi .hint { font-size:var(--testo-piccolo); }
.kpi-segno { width:48px; height:48px; flex:0 0 48px; display:inline-flex; align-items:center; justify-content:center; background:var(--f); }
.kpi-segno::before { content:""; width:16px; height:16px; border-radius:50%; background:var(--c); }
.kpi-corso { --c:var(--stato-corso); --f:var(--warn-bg); } .kpi-riscuotere { --c:var(--stato-riscuotere); --f:var(--err-bg); }
.kpi-incassata { --c:var(--stato-incassata); --f:var(--ok-bg); } .kpi-arrivo { --c:var(--stato-arrivo); --f:var(--blu-tenue); }
@media (max-width:1200px) { .registro-sintesi { grid-template-columns:repeat(2, minmax(0, 1fr)); } }
@media (max-width:520px) { .registro-sintesi { grid-template-columns:minmax(0, 1fr); } }
.registro-arrivo { padding:12px 18px; margin-bottom:18px; }
.registro-arrivo > summary { cursor:pointer; display:flex; align-items:center; gap:10px; font-weight:500; }
.registro-arrivo-elenco { list-style:none; margin:12px 0 0; padding:0; display:grid; gap:6px; }
.registro-arrivo-elenco li { display:flex; flex-wrap:wrap; gap:6px 10px; align-items:baseline; padding:6px 0; border-top:1px solid var(--line-tenue); }
.registro-schede .scheda-voce { display:inline-flex; align-items:center; gap:8px; }

/* Grafico per stato */
.pal-stati .fetta-0, .pal-stati .chiave-0 { --c:var(--stato-corso); }
.pal-stati .fetta-1, .pal-stati .chiave-1 { --c:var(--stato-riscuotere); }
.pal-stati .fetta-2, .pal-stati .chiave-2 { --c:var(--stato-incassata); }
.pal-stati .fetta-3, .pal-stati .chiave-3 { --c:var(--stato-nondovuta); }
.pal-stati .fetta { stroke:var(--c); } .pal-stati .chiave { background:var(--c); }
.registro-grafici .barra-num { white-space:nowrap; }

/* Tabella e dettaglio */
.registro-corpo { display:grid; grid-template-columns:minmax(0, 1fr); gap:16px; align-items:start; }

.registro-tabella { min-width:0; margin:0; }
.registro-selezione { padding:10px 14px; margin:0; border-bottom:1px solid var(--line); align-items:center; }
.tbl-registro td { white-space:nowrap; }
.tbl-registro .n { text-align:right; font-variant-numeric:tabular-nums; }
.tbl-registro tbody tr[data-href] { cursor:pointer; }
.tbl-registro tbody tr.sel td { background:var(--blu-tenue); }
.tbl-registro tbody td a { color:var(--ink); }
.tbl-registro tfoot td { background:var(--sfondo); border-top:1px solid var(--line); padding:9px 10px; }
.registro-dettaglio { margin:0; padding:16px 18px; position:sticky; top:86px; max-height:calc(100vh - 100px); overflow-y:auto; }
.registro-dettaglio-testa { display:flex; align-items:flex-start; gap:10px; justify-content:space-between; border-bottom:1px solid var(--line); padding-bottom:12px; margin-bottom:12px; }
.registro-dettaglio-testa h2 { margin:0; font-size:var(--testo-base); border:0; padding:0; }
.registro-dettaglio-testa > div { flex:1 1 auto; min-width:0; }
.registro-kv { display:grid; grid-template-columns:110px 1fr; gap:5px 10px; margin:0 0 12px; font-size:var(--testo-medio); }
.registro-kv dt { color:var(--ink-tenue); }
.registro-kv dd { margin:0; min-width:0; overflow-wrap:anywhere; }
.registro-calcolo { background:var(--sfondo); border:1px solid var(--line); padding:10px 12px; margin-bottom:12px; font-size:var(--testo-piccolo); }
.calcolo-riga { display:flex; justify-content:space-between; gap:10px; }
.calcolo-passo { color:var(--ink-soft); }
.calcolo-totale { border-top:1px solid var(--line); margin-top:6px; padding-top:6px; font-weight:600; font-size:var(--testo-medio); }
.striscia-giorni { display:flex; flex-wrap:wrap; gap:3px; margin-bottom:8px; }
.sg { min-width:22px; height:24px; display:inline-flex; align-items:flex-end; justify-content:center; font-size:var(--testo-minimo); padding-bottom:2px; color:var(--ink-tenue); background:var(--card); border:1px solid var(--line); }
.cs-corso { --c:var(--stato-corso); } .cs-riscuotere { --c:var(--stato-riscuotere); }
.cs-incassata { --c:var(--stato-incassata); } .cs-nondovuta { --c:var(--stato-nondovuta); }
.sg-conta { color:#fff; border-color:transparent; background:var(--c); }
.sg-conta.cs-corso, .sg-conta.cs-nondovuta { color:#1f2937; }
[data-tema="scuro"] .sg-conta { color:var(--paper); }   /* i colori di stato scuri sono chiari */
.sg-esclusa { background:repeating-linear-gradient(135deg, var(--sfondo) 0 4px, var(--line) 4px 5px); }
.sg-franchigia { background:var(--blu-tenue); color:var(--blu-scuro); }
.sg-futuro { border-style:dashed; }
.registro-azione { margin:4px 0 12px; }
.registro-azione > summary { list-style:none; display:inline-flex; cursor:pointer; }
.registro-azione > summary::-webkit-details-marker { display:none; }
.registro-azione[open] > summary { margin-bottom:10px; }
.registro-azione form { border:1px solid var(--line); padding:12px; background:var(--card); }
.registro-storia-titolo { font-size:var(--testo-medio); margin:14px 0 8px; }
.registro-storia { list-style:none; margin:0; padding:0 0 0 16px; border-left:2px solid var(--line); font-size:var(--testo-piccolo); }
.registro-storia li { position:relative; margin-bottom:10px; }
.registro-storia li::before { content:""; position:absolute; left:-22px; top:4px; width:10px; height:10px; border-radius:50%; background:var(--card); border:2px solid var(--blu); }
.registro-storia small, .registro-storia-nota { display:block; color:var(--ink-tenue); }

.registro-dialogo { border:1px solid var(--line); border-radius:var(--r); padding:0; width:min(560px, 94vw); background:var(--card); color:var(--ink); box-shadow:var(--elev-3); }
.registro-dialogo::backdrop { background:rgba(15, 23, 42, .45); }
.registro-dialogo-testa { display:flex; justify-content:space-between; align-items:center; padding:14px 18px; border-bottom:1px solid var(--line); }
.registro-dialogo-testa h2 { margin:0; font-size:var(--testo-base); }
.registro-dialogo .form-chiusura { padding:14px 18px; }
.form-chiusura textarea, .form-chiusura input[type=text], .form-chiusura select { width:100%; }

/* Cronologia */
.registro-cronologia { overflow-x:auto; }
.crono { min-width:720px; font-size:var(--testo-piccolo); }
.crono-riga { display:grid; grid-template-columns:170px minmax(0, 1fr) 110px; align-items:center; border-bottom:1px solid var(--line-tenue); min-height:40px; }
.crono-testa { background:var(--tbl-testa); color:var(--tbl-testa-testo); font-weight:600; min-height:32px; border-bottom:1px solid var(--line); }
.crono-nome { padding:4px 10px; display:flex; flex-direction:column; min-width:0; color:var(--ink); text-decoration:none; }
.crono-nome small { color:var(--ink-tenue); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
a.crono-nome:hover b { color:var(--blu); }
.crono-importo { padding:4px 10px; text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.crono-giorni { display:grid; grid-template-columns:repeat(var(--giorni), minmax(0, 1fr)); height:100%; align-items:center; }
.crono-scala { font-size:var(--testo-minimo); color:var(--ink-tenue); white-space:nowrap; font-weight:500; }
.crono-scala.mese { color:var(--ink); font-weight:700; }
.cg { display:block; height:22px; border-right:1px solid var(--card); }
.cg-fs { background:var(--sfondo); }
.cg-conta, .cg-esclusa, .cg-franchigia, .cg-futuro { background-color:var(--c); }
.cg-esclusa { opacity:.35; }
.cg-franchigia { background-image:repeating-linear-gradient(135deg, transparent 0 3px, rgba(255, 255, 255, .7) 3px 5px); }
.cg-futuro { opacity:.2; }
[data-tema="scuro"] .cg-esclusa { opacity:.5; }
[data-tema="scuro"] .cg-futuro { opacity:.35; }
.cg-oggi { box-shadow:inset 2px 0 0 var(--blu); }
.crono-legenda { list-style:none; display:flex; flex-wrap:wrap; gap:6px 16px; margin:12px 0 0; padding:0; font-size:var(--testo-piccolo); color:var(--ink-soft); }
.crono-legenda li { display:inline-flex; align-items:center; gap:6px; }
.crono-legenda .cg { width:14px; height:14px; border:0; }

/* Modulo di configurazione */
.registro-scelte { display:flex; flex-direction:column; gap:6px; margin:0 0 10px; }
.registro-giorni { display:flex; flex-wrap:wrap; gap:6px 14px; margin:6px 0 8px; }
.registro-motivi input[type=text], .versione-corpo textarea { width:100%; }
.form-registro h2 { margin-top:26px; }
[data-modo][hidden], [data-se-calendario][hidden], [data-se-tariffa][hidden], .gruppo-registro[hidden], .versione-registro[hidden] { display:none !important; }
.gruppo-registro { border:1px solid var(--line); background:var(--sfondo); padding:12px 14px; margin:0 0 14px; }
.gruppo-registro > legend { font-weight:600; padding:0 6px; }
.versione-registro { border:1px solid var(--line); background:var(--card); margin:10px 0 0; }
.versione-testa { display:flex; flex-wrap:wrap; gap:8px 16px; align-items:center; padding:8px 12px; border-bottom:1px solid var(--line); background:var(--blu-tenue); }
.versione-testa label { display:inline-flex; gap:6px; align-items:center; font-weight:500; }
.versione-corpo { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); }
.versione-corpo > div { padding:10px 12px; min-width:0; }
.versione-corpo > div + div { border-left:1px solid var(--line); }
.versione-corpo h4 { margin:0 0 8px; font-size:var(--testo-medio); }
@media (max-width:1024px) {
 .versione-corpo { grid-template-columns:minmax(0, 1fr); }
 .versione-corpo > div + div { border-left:0; border-top:1px solid var(--line); }
}
.gruppo-azioni { display:flex; gap:8px; margin-top:10px; }

@media print {
 .no-stampa, .registro-filtri, .registro-selezione, .registro-azione, .registro-dialogo { display:none !important; }

 .registro-dettaglio { position:static; max-height:none; overflow:visible; break-inside:avoid; }
 .registro-sintesi { grid-template-columns:repeat(4, minmax(0, 1fr)); }
 .stato-voce, .sg, .cg, .kpi-segno { -webkit-print-color-adjust:exact; print-color-adjust:exact; }
 .registro-cronologia { overflow:visible; }
}

/* Registro: dettaglio della voce nella finestra, intestazioni ordinabili */
.registro-dettaglio-finestra { position:static; max-height:none; overflow:visible; padding:0; }
.tbl-registro th a { color:inherit; text-decoration:none; white-space:nowrap; }
.tbl-registro th a:hover { color:var(--blu); }
.tbl-registro th.ordinata a { color:var(--blu); }
.tbl-registro tbody tr[data-voce] { cursor:pointer; }

/* Gestione documenti: schede interne, sottolineate sotto la scheda principale */
.doc-sottotab-barra {
  display: flex; gap: 4px 18px; flex-wrap: wrap;
  border-bottom: 1px solid var(--line); margin-bottom: 12px;
}
.doc-sottotab {
  border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--ink-soft);
  font: inherit; font-weight: 600; font-size: var(--testo-medio); cursor: pointer;
  padding: 8px 2px; margin-bottom: -1px; min-height: 40px;
}
.doc-sottotab:hover { color: var(--blu-scuro); }
.doc-sottotab.attiva { color: var(--blu-scuro); border-bottom-color: var(--blu); }
.doc-sotto-pannello[hidden] { display: none; }

/* Struttura: albero riordinabile */
.doc-lista-admin { list-style: none; margin: 0; padding: 0; }
.doc-lista-admin .doc-lista-admin { padding-left: 22px; }
.doc-struttura > .doc-lista-admin { padding-left: 0; }
.doc-riga-admin .doc-area-nome { flex: 1; min-width: 0; }
.doc-maniglia {
  cursor: grab; color: var(--ink-soft); padding: 0 4px; user-select: none;
  font-size: var(--testo-base); line-height: 1;
}
.doc-maniglia:active { cursor: grabbing; }
.doc-nodo.in-trascinamento > .doc-riga-admin { opacity: .45; background: var(--blu-tenue); }
.doc-permessi .tbl-wrap { max-height: 50vh; overflow: auto; }
.doc-nodo.doc-dentro > .doc-riga-admin {
  background: var(--blu-tenue); outline: 2px dashed var(--blu-scuro); outline-offset: -2px;
}

/* Elenco dei report in homepage */
.elenco-report { list-style: none; margin: 0; padding: 0; }
.elenco-report li + li { border-top: 1px solid var(--line); }
.elenco-report a {
  display: flex; align-items: center; gap: 12px; padding: 12px 14px;
  color: var(--ink); text-decoration: none;
}
.elenco-report a:hover { background: var(--blu-tenue); }
.elenco-report-testo { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.elenco-report-nome { font-weight: 600; overflow-wrap: anywhere; }
.elenco-report-desc { font-size: var(--testo-piccolo); color: var(--ink-soft); overflow-wrap: anywhere; }
.elenco-report-freccia { color: var(--ink-soft); font-size: var(--testo-titolo); line-height: 1; }
.elenco-report-vuoto { padding: 12px 14px; }

/* Telefono: niente menu a scomparsa, la navigazione è la barra in basso */
.barra-basso .testo-breve { display: none; }
@media (max-width: 640px) {
  .barra-basso a { container-type: inline-size; padding: 0 2px; min-width: 0; }
  .barra-basso-testo { max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}
@container (max-width: 96px) {
  .barra-basso .testo-lungo { display: none; }
  .barra-basso .testo-breve { display: inline; }
}

/* Telefono compatto: comandi più bassi, una riga di comandi che scorre, margini stretti */
@media (max-width: 640px) {
  .content { padding: 10px 10px calc(80px + env(safe-area-inset-bottom, 0px)); }
  .card { padding: 12px; margin-bottom: 10px; }
  .titolo-pagina { font-size: var(--testo-grande); margin: 4px 0 8px; }
  .topbar { min-height: 52px; }
  .btn, a.btn, button.btn, summary.btn { min-height: 38px; padding: 6px 12px; font-size: var(--testo-medio); }
  .btn-sm { min-height: 34px; }
  input:not([type=checkbox]):not([type=radio]):not([type=range]), select { min-height: 40px; font-size: 16px; }
  .registro-barra {
    flex-wrap: nowrap; overflow-x: auto; gap: 6px; scrollbar-width: none; padding-bottom: 2px;
  }
  .registro-barra::-webkit-scrollbar { display: none; }
  .registro-barra > * { flex: 0 0 auto !important; width: auto !important; white-space: nowrap; }
  .registro-barra > .grow { display: none !important; }
  .schede-record { gap: 6px; }
  .scheda-rec-testa { min-height: 44px; padding: 4px 10px; }
  .scheda-rec-titolo { min-height: 36px; }
  .scheda-rec-sommario { padding: 0 12px 8px; gap: 2px 12px; }
  .barra-basso a { min-height: 54px; }
}

/* Telefono: barre che escono scorrendo verso il basso (mobile.js, classe barre-nascoste) */
@media (max-width: 640px) {
  .topbar, .barra-basso { transition: transform .2s ease; will-change: transform; }
  body.barre-nascoste .topbar { transform: translateY(-100%); }
  body.barre-nascoste .barra-basso { transform: translateY(100%); }
}
@media (prefers-reduced-motion: reduce) { .topbar, .barra-basso { transition: none; } }

/* Tablet (tattile): la barra del telefono al posto del menu laterale; in basso in verticale, a sinistra in orizzontale */
@media (pointer: coarse) and (min-width: 641px) and (max-width: 1366px) and (min-height: 500px) {
  .barra-basso {
    display: grid; position: fixed; z-index: 50; background: var(--card);
  }
  .barra-basso a {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
    min-height: 60px; font-size: var(--testo-minimo); color: var(--ink-soft); text-decoration: none;
    container-type: inline-size; min-width: 0; padding: 0 4px;
  }
  .barra-basso a.attiva { color: var(--blu); font-weight: 600; }
  .barra-basso-ico { font-size: var(--testo-titolo); line-height: 1; }
  .barra-basso-ico img { max-width: 24px; max-height: 24px; }
  .barra-basso-testo { max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  body.modale-aperta .barra-basso { display: none; }
}
@media (pointer: coarse) and (min-width: 641px) and (max-width: 1366px) and (min-height: 500px) and (orientation: portrait) {
  .barra-basso {
    grid-auto-flow: column; grid-auto-columns: 1fr; left: 0; right: 0; bottom: 0;
    border-top: 1px solid var(--line); padding-bottom: env(safe-area-inset-bottom, 0px);
    box-shadow: 0 -4px 14px rgba(15, 23, 42, .06);
  }
  .content { padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px)); }
}
/* In orizzontale la barra si apre dalla linguetta: vedi «Orizzontale tattile» più sotto */

/* ── Margini standard: stesso spazio fra menu, barra in alto e contenuto ── */
:root { --margine: 24px; }
@media (max-width: 1024px) { :root { --margine: 20px; } }
@media (max-width: 640px) { :root { --margine: 12px; } }
.topbar {
  padding-left: calc(var(--margine) + env(safe-area-inset-left, 0px));
  padding-right: calc(var(--margine) + env(safe-area-inset-right, 0px));
}
.content { padding: var(--margine); max-width: none; margin-inline: 0; }
/* Pagine principali e di configurazione: campi non più larghi di 720px (il modulo record usa --car) */
body:not(.pagina-larga) .content :is(input[type=text], input[type=email], input[type=tel], input[type=url],
  input[type=number], input[type=password], input[type=search], select, textarea):not(.form-griglia *) { max-width: 720px; }
.content > .card, .content > form.card, .content > .comandi { margin-bottom: var(--margine); }
.content > .titolo-pagina:first-child, .content > h1:first-child { margin-top: 0; }
@media (max-width: 640px) {
  .content { padding-bottom: calc(80px + env(safe-area-inset-bottom, 0px)); }
}
@media (pointer: coarse) and (min-width: 641px) and (max-width: 1366px) and (min-height: 500px) and (orientation: portrait) {
  .content { padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px)); }
}

/* ── Menu laterale sopra la pagina anche sui tablet tattili larghi ── */
@media (pointer: coarse) and (min-width: 1025px) and (max-width: 1366px) and (min-height: 500px) {
  .app-menu {
    position: fixed; top: 0; left: 0; bottom: 0; height: auto;
    width: 288px; flex-basis: auto; transform: translateX(-100%);
    box-shadow: none; z-index: 95;
  }
  body.menu-aperto .app-menu { transform: none; box-shadow: 8px 0 30px rgba(15, 23, 42, .2); }
  body.menu-aperto { overflow: hidden; }
  .app-menu-velo { display: block; position: fixed; inset: 0; z-index: 90; background: rgba(15, 23, 42, .5); }
  .app-menu-velo[hidden] { display: none; }
}

/* ── Linguetta del menu: accanto a «Riepilogo», freccia verso dove si apre ── */
.linguetta-menu {
  position: fixed; z-index: 96; top: 140px; left: calc(var(--menu-largo) - 1px);
  transform: translateY(-50%);
  width: 20px; height: 44px; padding: 0 2px 0 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--menu-sfondo); color: var(--menu-testo);
  border: 1px solid var(--line); border-left-color: var(--menu-sfondo); border-radius: 0 8px 8px 0;
  box-shadow: 3px 2px 6px rgba(15, 23, 42, .07);
  cursor: pointer; transition: left .2s ease, transform .2s ease, color .15s ease;
}
.linguetta-menu:hover { color: var(--blu); }
.linguetta-menu svg { transition: transform .2s ease; }
.linguetta-menu[aria-expanded="true"] svg { transform: rotate(180deg); }
.linguetta-menu:focus-visible { outline: 2px solid var(--blu); outline-offset: 2px; }
@media (min-width: 1367px), (min-width: 1025px) and (pointer: fine), (min-width: 1025px) and (max-height: 499px) {
  body.menu-ridotto .linguetta-menu { left: calc(var(--menu-stretto) - 1px); }
}
/* Menu sopra la pagina: linguetta sul bordo dello schermo, poi sul bordo del menu aperto */
@media (max-width: 1024px), (pointer: coarse) and (max-width: 1366px) and (min-height: 500px) {
  .linguetta-menu { left: 0; border-left-width: 0; }
  body.menu-aperto .linguetta-menu { left: 287px; border-left-width: 1px; }
}
@media (max-width: 640px) {
  .linguetta-menu { width: 18px; height: 40px; }
}

/* ── Tablet: barre che escono scorrendo verso il basso e tornano verso l'alto (mobile.js) ── */
@media (pointer: coarse) and (min-width: 641px) and (max-width: 1366px) and (min-height: 500px) {
  .topbar, .barra-basso { transition: transform .2s ease; }
  body.barre-nascoste .topbar { transform: translateY(-100%); }
}
@media (pointer: coarse) and (min-width: 641px) and (max-width: 1366px) and (min-height: 500px) and (orientation: portrait) {
  body.barre-nascoste .barra-basso { transform: translateY(100%); }
}
@media (max-width: 640px), (pointer: coarse) and (max-width: 1366px) and (min-height: 500px) {
  body.barre-nascoste .linguetta-menu { transform: translate(-110%, -50%); }
}
@media (prefers-reduced-motion: reduce) { .topbar, .barra-basso, .linguetta-menu, .linguetta-menu svg { transition: none; } }

/* ── Barra dei comandi: filtri, analisi, colonne, esporta; pannelli sotto la barra ── */
.card.comandi { padding: 0; }
.comandi .zona-ricerca { margin: 0; padding: 16px 20px 0; }
.comandi-barra { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 14px 20px; }
.comandi-barra > .grow { flex: 1 1 auto; }
.comando {
  position: relative; display: inline-flex; align-items: center; gap: 8px;
  min-height: 40px; padding: 0 14px; margin: 0;
  font: inherit; font-size: 14px; font-weight: 500; line-height: 1; white-space: nowrap;
  color: var(--ink); background: var(--card); border: 1px solid var(--line); border-radius: var(--r);
  text-decoration: none; cursor: pointer; transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.comando:hover { background: var(--grigio-tenue); color: var(--ink); text-decoration: none; }
.comando .ic { flex: 0 0 auto; color: var(--ink-soft); }
.comando-icona { width: 44px; padding: 0; justify-content: center; }
.comando[aria-expanded="true"], .comando.comando-aperto,
.menu-esporta[open] > summary.comando {
  background: var(--blu-pieno); border-color: var(--blu-pieno); color: #ffffff;
}
.comando[aria-expanded="true"] .ic, .comando.comando-aperto .ic, .menu-esporta[open] > summary.comando .ic { color: #ffffff; }
.comando-acceso { border-color: var(--blu); color: var(--blu); }
.comando-acceso .ic { color: var(--blu); }
.comando-pericolo { color: var(--err); }
.comando-pericolo .ic { color: var(--err); }
.comando-conta {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px;
  background: var(--blu-pieno); color: #ffffff; font-size: var(--testo-minimo); font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.comando[aria-expanded="true"] .comando-conta { background: #ffffff; color: var(--blu-pieno); }
.comando-icona .comando-conta { position: absolute; top: -7px; right: -7px; }
.comando-punto {
  position: absolute; top: 7px; right: 7px; width: 8px; height: 8px; border-radius: 50%;
  background: var(--blu-pieno);
}
.comando[aria-expanded="true"] .comando-punto { background: #ffffff; }
.comando-nuovo { min-height: 40px; gap: 8px; }
.comando-nuovo .ic { color: inherit; }
.comandi-conteggio {
  display: inline-flex; align-items: center; flex-wrap: wrap; gap: 8px;
  font-size: 13px; color: var(--ink-soft); margin-right: 4px;
}
.comandi-conteggio b { color: var(--ink); font-variant-numeric: tabular-nums; }
.comandi-fonte { display: inline-flex; align-items: center; gap: 6px; }
.comandi-ambito { color: var(--blu); font-weight: 500; }
.comandi-ambito:empty { display: none; }

/* Menu «Esporta» */
.menu-esporta { position: relative; }
.menu-esporta > summary { list-style: none; }
.menu-esporta > summary::-webkit-details-marker { display: none; }
.menu-esporta > summary::after { content: none; }
.menu-esporta > summary .ic-giu { transition: transform .15s ease; }
.menu-esporta[open] > summary .ic-giu { transform: rotate(180deg); }
.menu-esporta-voci {
  position: absolute; right: 0; top: calc(100% + 6px); z-index: 60;
  min-width: 220px; padding: 6px; display: grid; gap: 2px;
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--elev-3);
}
.menu-esporta-voci a {
  display: flex; align-items: center; gap: 10px; padding: 9px 10px;
  color: var(--ink); text-decoration: none; font-size: 14px; border-radius: var(--r);
}
.menu-esporta-voci a:hover, .menu-esporta-voci a:focus-visible { background: var(--grigio-tenue); text-decoration: none; }
.menu-esporta-voci .ic { color: var(--ink-soft); }
.menu-esporta-voci .export-sezioni { display: grid; gap: 0; padding: 2px 0 6px; margin: 0 0 4px; border-bottom: 1px solid var(--line); }
.menu-esporta-voci .export-sezioni .check { padding: 4px 10px; min-height: 0; }
.menu-esporta-titolo {
  padding: 6px 10px 2px; font-size: var(--testo-minimo); font-weight: 600; letter-spacing: .06em;
  text-transform: uppercase; color: var(--ink-tenue);
}

/* Pannelli */
.pannello-comandi { display: none; padding: 18px 20px 20px; background: var(--sfondo); border-top: 1px solid var(--line); }
.pannello-comandi.zona-aperta { display: block; }
#pannello-filtri.pannello-comandi { display: none; }
#pannello-filtri.pannello-comandi.zona-aperta { display: block; }
.pannello-comandi.pannello-segue { border-top: 0; padding-top: 0; }
.pannello-testa { display: flex; align-items: center; gap: 10px; margin: 0 0 14px; }
.pannello-testa > .ic { color: var(--ink-soft); }
.pannello-testa h2 { flex: 1 1 auto; margin: 0; padding: 0; border: 0; font-size: var(--testo-base); font-weight: 600; color: var(--ink); }
.pannello-chiudi {
  display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px;
  padding: 0; background: none; border: 0; border-radius: var(--r); color: var(--ink-soft); cursor: pointer;
}
.pannello-chiudi:hover { background: var(--grigio-tenue); color: var(--ink); }
.pannello-nota { margin: 0 0 10px; font-size: 13px; color: var(--ink-soft); }
.pannello-piede {
  display: flex; justify-content: flex-end; align-items: center; flex-wrap: wrap; gap: 10px;
  margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line);
}
.pannello-piede-sx { justify-content: flex-start; }
.pannello-piede .btn, .riga-analisi-azione .btn, .colonne-azioni .btn { min-height: 40px; padding: 0 20px; justify-content: center; }
.btn.btn-ghost.btn-bordo { background: var(--card); border: 1px solid var(--line); color: var(--ink); }
.btn.btn-ghost.btn-bordo:hover { background: var(--grigio-tenue); }
#form-filtri-report { display: block; }

/* Filtri: etichetta sopra, tendina a scelta multipla sotto */
.filtri-griglia { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px 20px; }
.filtro-campo { position: relative; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.filtro-campo-etichetta { font-size: 13px; font-weight: 500; color: var(--ink-soft); }
.filtro-campo > .filtro-menu { position: relative; width: 100%; }
.filtri-griglia summary.filtro-tendina {
  display: flex; align-items: center; gap: 8px; width: 100%; min-height: 40px; padding: 0 12px;
  border: 1px solid var(--bordo-campo); border-radius: var(--r); background: var(--campo);
  color: var(--ink-tenue); font-size: 14px; font-weight: 400; white-space: nowrap;
}
.filtri-griglia summary.filtro-tendina .filter-dropdown-value {
  flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; color: inherit;
}
.filtri-griglia summary.filtro-tendina.active { color: var(--ink); border-color: var(--blu); background: var(--campo); }
.filtri-griglia .filtro-menu[open] > summary.filtro-tendina { border-color: var(--blu); outline: 2px solid var(--blu); outline-offset: 1px; }
.filtri-griglia summary.filtro-tendina .ic-giu { flex: 0 0 auto; color: var(--ink-soft); transition: transform .15s ease; }
.filtri-griglia .filtro-menu[open] > summary.filtro-tendina .ic-giu { transform: rotate(180deg); }
.filtri-griglia .filter-dropdown-panel {
  left: 0; right: auto; width: max(100%, 260px); max-width: min(360px, 92vw);
  border-color: var(--line); border-radius: var(--r); box-shadow: var(--elev-3); background: var(--card);
}
.filtri-griglia .filter-dropdown-cerca { padding: 8px; border-bottom: 1px solid var(--line); }
.filtri-griglia .filter-dropdown-cerca input { width: 100%; min-height: 36px; }

/* Colonne: griglia di spunte, comandi a destra */
.colonne-corpo { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px; }
.pannello-comandi .colonne-griglia {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 4px 20px;
  max-height: none; overflow: visible;
}
.pannello-comandi .colonne-griglia .check { margin: 0; }
.pannello-comandi .colonne-sezione { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); gap: 0; }
.pannello-comandi .colonne-azioni {
  display: flex; flex-direction: column; align-items: flex-start; gap: 14px; margin: 0;
  padding-left: 24px; border-left: 1px solid var(--line);
}
.link-azione { background: none; border: 0; padding: 0; font: inherit; font-size: 14px; color: var(--blu); cursor: pointer; }
.link-azione:hover { text-decoration: underline; }

/* Analisi: formula, campo, condizione e «Calcola» sulla stessa riga */
#viewer-analisi { display: grid; gap: 12px; }
#viewer-analisi .riga-viewer {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(120px, auto);
  gap: 12px 20px; align-items: end; margin: 0;
}
#viewer-analisi .form-group { margin: 0; min-width: 0; }
#viewer-analisi .riga-viewer[hidden] { display: none; }

/* Criteri avanzati, in coda ai filtri del report */
.pannello-segue .criteri-avanzati { border-top: 1px solid var(--line); padding-top: 14px; }
.pannello-segue .criteri-avanzati > summary {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 10px; margin: 0;
  font-weight: 600; font-size: 14px; color: var(--ink); cursor: pointer;
}
.pannello-segue .criteri-avanzati > summary .hint { font-weight: 400; }
.pannello-segue .criteri-avanzati h3 { margin: 16px 0 6px; font-size: var(--testo-medio); font-weight: 600; }

@media (max-width: 640px) {
  .comandi .zona-ricerca { padding: 12px 12px 0; }
  .comandi-barra { padding: 10px 12px; gap: 6px; }
  .comandi-barra > .grow { display: none; }
  .comandi-conteggio { order: 10; flex-basis: 100%; }
  .comando { min-height: 40px; padding: 0 12px; }
  .comando-icona { width: 44px; padding: 0; }
  .pannello-comandi { padding: 14px 12px 16px; }
  .filtri-griglia { grid-template-columns: minmax(0, 1fr); }
  .colonne-corpo { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .pannello-comandi .colonne-azioni {
    flex-direction: row; justify-content: space-between; align-items: center;
    padding: 12px 0 0; border-left: 0; border-top: 1px solid var(--line);
  }
  #viewer-analisi .riga-viewer { grid-template-columns: minmax(0, 1fr); }
  .menu-esporta-voci { position: fixed; left: 8px; right: 8px; top: auto; bottom: calc(8px + env(safe-area-inset-bottom, 0px)); }
}

/* ── Telefono e tablet: linguetta solo in orizzontale; in verticale c'è già la barra in basso ── */
@media (max-width: 640px) and (orientation: portrait),
       (pointer: coarse) and (orientation: portrait) and (max-width: 1366px) {
  .linguetta-menu { display: none; }
}
/* ── Orizzontale tattile (telefono girato, tablet in orizzontale): la linguetta mostra la barra in basso del telefono ── */
@media (pointer: coarse) and (orientation: landscape) and (max-width: 1366px) {
  .barra-basso {
    display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; position: fixed; z-index: 94;
    left: 0; right: 0; bottom: 0; top: auto; width: auto; gap: 0; overflow: visible;
    padding: 0 env(safe-area-inset-right, 0px) env(safe-area-inset-bottom, 0px) env(safe-area-inset-left, 0px);
    background: var(--card); border-top: 1px solid var(--line); border-right: 0;
    box-shadow: 0 -4px 14px rgba(15, 23, 42, .06);
    /* Chiusa: fuori schermo e nascosta davvero (Tab e lettori di schermo non la raggiungono) */
    transform: translateY(110%); visibility: hidden;
    transition: transform .2s ease, visibility 0s linear .2s;
  }
  body.barra-aperta .barra-basso { transform: none; visibility: visible; transition: transform .2s ease, visibility 0s; }
  .barra-basso a {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
    min-height: 58px; margin: 0; padding: 0 4px; border-radius: 0; background: none; min-width: 0;
    font-size: var(--testo-minimo); color: var(--ink-soft); text-decoration: none; container-type: inline-size;
  }
  .barra-basso a.attiva { color: var(--blu); font-weight: 600; background: none; }
  .barra-basso-ico { font-size: var(--testo-titolo); line-height: 1; }
  .barra-basso-testo { max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .shell { padding-left: 0; }
  .content { padding-bottom: var(--margine); }
  body.barra-aperta .content { padding-bottom: calc(70px + env(safe-area-inset-bottom, 0px)); }
  .linguetta-menu { left: 0; border-left-width: 0; }
  body.modale-aperta .barra-basso { display: none; }
}
/* Telefono girato: barra più bassa */
@media (pointer: coarse) and (orientation: landscape) and (max-height: 499px) {
  .barra-basso a { min-height: 50px; gap: 2px; }
  .barra-basso-ico { font-size: var(--testo-grande); }
}
@media (prefers-reduced-motion: reduce) { .barra-basso { transition: none; } }

/* Anteprima allegati: finestra alta quanto lo schermo, larga secondo la risoluzione.
   Altezze in % del contenitore fisso, non in vh, così valgono anche con lo zoom delle fasce. */
.modale-box:has(.anteprima-riquadro) { width: min(1100px, 100%); height: 100%; max-height: 100%; }
.modale-box:has(.anteprima-riquadro) .modale-corpo { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.modale-corpo .anteprima-riquadro { flex: 1; min-height: 0; display: flex; align-items: center; justify-content: center; }
.modale-corpo .anteprima-riquadro iframe { flex: 1; align-self: stretch; height: auto; }
.anteprima-immagine img { display: block; max-width: 100%; max-height: 100%; object-fit: contain; }
.conta-allegati { margin-left: 6px; font-size: .82em; color: var(--ink-soft); white-space: nowrap; }
@media (min-width: 1440px) { .modale-box:has(.anteprima-riquadro) { width: min(1360px, 100%); } }
@media (min-width: 1920px) { .modale-box:has(.anteprima-riquadro) { width: min(1680px, 100%); } }
@media (max-width: 640px) {
  .modale:has(.anteprima-riquadro) { align-items: stretch; }
  .modale-box:has(.anteprima-riquadro) { border-radius: 0; }
  .modale-box:has(.anteprima-riquadro) .modale-corpo { padding: 8px; }
}

/* Fasce di risoluzione: solo scala (zoom), disposizione invariata.
   Telefoni per larghezza; tablet e pieghevoli aperti solo se tattili e alti almeno 500px
   (portatili e telefoni in orizzontale restano al 100%). */
@media (max-width: 359px) { html { zoom: .92; } }                                   /* T0 schermi esterni stretti */
@media (min-width: 360px) and (max-width: 389px) { html { zoom: .96; } }             /* T1 Galaxy S8, S2x, iPhone SE */
/* T2 390–429px: iPhone, Pixel, Galaxy Z Fold 8 esterno, Z Flip 8 interno: 100% */
@media (min-width: 430px) and (max-width: 640px) { html { zoom: 1.04; } }            /* T3 Pro Max, Air, iPhone Duo */
@media (pointer: coarse) and (min-height: 500px) and (min-width: 641px) and (max-width: 833px) {
  html { zoom: 1.08; }                                                                /* T4 iPad mini, Galaxy Tab verticale */
}
@media (pointer: coarse) and (min-height: 500px) and (min-width: 834px) and (max-width: 1023px) {
  html { zoom: 1.1; }                                                                 /* T5 iPad 11", Z Fold 8 interno */
}
@media (pointer: coarse) and (min-height: 500px) and (min-width: 1024px) and (max-width: 1366px) {
  html { zoom: 1.06; }                                                                /* T6 tablet orizzontali, iPad 13" */
}
