/* =====================================================================
   ENOVA FISCALE — Debiti fiscali e contributivi del gruppo — foglio di stile unico
   Stessa famiglia visiva di ENOVA APT: blu profondo, blu elettrico,
   verde acqua. Neutri con leggera dominante blu.
   ===================================================================== */
:root {
  --blu:        #0b2e9e;
  --blu-scuro:  #071c63;
  --blu-chiaro: #1547d6;
  --acqua:      #0fc0aa;
  --ciano:      #14bee0;
  --verde:      #1a7f37;  --verde-bg: #e4f5e9;
  --rosso:      #c0392b;  --rosso-bg: #fdecea;
  --giallo:     #a8760a;  --giallo-bg: #fdf4de;
  --arancio:    #c2670f;  --arancio-bg: #fdeede;
  --viola:      #6d28d9;  --viola-bg: #efe7fb;
  --sfondo:     #f3f5f9;
  --superficie: #ffffff;
  --superficie-2: #f7f9fc;
  --linea:      #e3e8ef;
  --linea-2:    #c1cad6;
  --testo:      #1b2530;
  --testo-2:    #5f6f80;
  --blu-bg:     #e6ecfa;
  --ombra:      0 1px 3px rgba(16,32,52,.10), 0 1px 2px rgba(16,32,52,.06);
  --ombra-alta: 0 10px 30px rgba(16,32,52,.18);
  --raggio:     10px;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --blu: #7d9bff; --blu-scuro: #a9bcff; --blu-chiaro: #6f8fff; --acqua: #2fd6c1; --ciano: #38cdea;
    --verde: #5fcf82; --verde-bg: #14301d; --rosso: #f0857a; --rosso-bg: #3a1d1a;
    --giallo: #e2b24a; --giallo-bg: #33290f; --arancio: #f0a05a; --arangio-bg: #33220f; --arancio-bg: #33220f;
    --viola: #b995f5; --viola-bg: #2a1c44;
    --sfondo: #0f141b; --superficie: #171e27; --superficie-2: #1d2530; --linea: #2a3441; --linea-2: #3b4757;
    --testo: #e6ebf2; --testo-2: #98a6b6; --blu-bg: #1c2742;
    --ombra: 0 1px 3px rgba(0,0,0,.4); --ombra-alta: 0 10px 30px rgba(0,0,0,.5);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --blu: #7d9bff; --blu-scuro: #a9bcff; --blu-chiaro: #6f8fff; --acqua: #2fd6c1; --ciano: #38cdea;
  --verde: #5fcf82; --verde-bg: #14301d; --rosso: #f0857a; --rosso-bg: #3a1d1a;
  --giallo: #e2b24a; --giallo-bg: #33290f; --arancio: #f0a05a; --arancio-bg: #33220f;
  --viola: #b995f5; --viola-bg: #2a1c44;
  --sfondo: #0f141b; --superficie: #171e27; --superficie-2: #1d2530; --linea: #2a3441; --linea-2: #3b4757;
  --testo: #e6ebf2; --testo-2: #98a6b6; --blu-bg: #1c2742;
  --ombra: 0 1px 3px rgba(0,0,0,.4); --ombra-alta: 0 10px 30px rgba(0,0,0,.5);
  color-scheme: dark;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  background: var(--sfondo); color: var(--testo);
  font-size: 15px; line-height: 1.5; -webkit-font-smoothing: antialiased;
}
button, input, select, textarea { font-family: inherit; font-size: inherit; color: inherit; }
a { color: var(--blu-chiaro); }
:focus-visible { outline: 2px solid var(--acqua); outline-offset: 2px; }
.num { font-variant-numeric: tabular-nums; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }

/* ------------------------------------------------------------ LOGO */
.logo-login { text-align: center; margin-bottom: 8px; }
.logo-login img { width: 260px; max-width: 84%; height: auto; display: inline-block; }
.barra-alta .marchio img { height: 38px; width: auto; display: block; }
/* ------------------------------------------------------------- LOGIN */
#schermata-login {
  min-height: 100vh; display: none; align-items: center; justify-content: center; padding: 20px;
  background:
    radial-gradient(1000px 520px at 82% 6%, rgba(20,190,224,.35), transparent 62%),
    radial-gradient(760px 460px at 8% 96%, rgba(15,192,170,.30), transparent 60%),
    linear-gradient(146deg, #071c63 0%, #0a2a92 52%, #1547d6 100%);
}
#schermata-login.attiva { display: flex; }
.box-login {
  background: #ffffff; color: #1b2530; width: 100%; max-width: 420px;
  border-radius: 16px; padding: 34px 32px 30px; box-shadow: 0 20px 50px rgba(4,16,60,.34);
}
.box-login .sottotitolo { text-align: center; font-size: 13px; color: #5f6f80; margin-bottom: 26px; }
.box-login .campo input { background: #fff; color: #1b2530; border-color: #c1cad6; }
.box-login .campo label { color: #5f6f80; }
.box-login .btn-primario { background: #0b2e9e; }
.box-login .piede { margin-top: 18px; font-size: 12.5px; color: #5f6f80; text-align: center; }
.box-login .piede b { color: #0b2e9e; }

/* ------------------------------------------------------------- FORM */
.campo { margin-bottom: 14px; min-width: 0; }
.campo label { display: block; font-size: 12px; font-weight: 700; color: var(--testo-2); margin-bottom: 5px; text-transform: uppercase; letter-spacing: .4px; }
.campo input, .campo select, .campo textarea {
  width: 100%; padding: 10px 12px; border: 1px solid var(--linea-2); border-radius: 8px;
  background: var(--superficie); color: var(--testo); transition: border-color .15s, box-shadow .15s;
}
.campo input:focus, .campo select:focus, .campo textarea:focus { outline: none; border-color: var(--blu-chiaro); box-shadow: 0 0 0 3px rgba(21,71,214,.14); }
.campo textarea { min-height: 78px; resize: vertical; }
.campo .aiuto { font-size: 12px; color: var(--testo-2); margin-top: 4px; }
.griglia { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }
.griglia-2 { display: grid; gap: 14px; grid-template-columns: 1fr 1fr; }
.griglia > *, .griglia-2 > * { min-width: 0; }

/* ---------------------------------------------------------- PULSANTI */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  padding: 10px 16px; border: 1px solid transparent; border-radius: 8px;
  font-weight: 600; font-size: 14px; cursor: pointer; white-space: nowrap;
  transition: background .15s, transform .06s, box-shadow .15s; background: none;
}
.btn:active { transform: translateY(1px); }
.btn-primario { background: var(--blu); color: #fff; }
.btn-primario:hover { filter: brightness(.92); }
.btn-acqua { background: var(--acqua); color: #052b26; }
.btn-chiaro { background: var(--superficie); color: var(--testo); border-color: var(--linea-2); }
.btn-chiaro:hover { background: var(--superficie-2); }
.btn-rosso { background: var(--rosso-bg); color: var(--rosso); }
.btn-piccolo { padding: 6px 11px; font-size: 13px; }
.btn-largo { width: 100%; }
.btn .ico { font-size: 15px; line-height: 1; }

/* ------------------------------------------------------- STRUTTURA */
#schermata-app { display: none; min-height: 100vh; }
#schermata-app.attiva { display: block; }
.barra-alta {
  background: var(--superficie); padding: 0 20px; height: 62px;
  display: flex; align-items: center; gap: 18px; position: sticky; top: 0; z-index: 50;
  border-bottom: 1px solid var(--linea); box-shadow: 0 1px 4px rgba(11,46,158,.07);
}
.barra-alta .spazio { flex: 1; }
.barra-alta .cerca {
  display: flex; align-items: center; gap: 8px; background: var(--superficie-2); border: 1px solid var(--linea);
  border-radius: 8px; padding: 7px 12px; min-width: 260px; color: var(--testo-2); font-size: 13.5px;
}
.barra-alta .cerca kbd { margin-left: auto; font-size: 11px; border: 1px solid var(--linea-2); border-radius: 4px; padding: 0 5px; }
.campanella { position: relative; background: var(--superficie-2); border: 1px solid var(--linea); border-radius: 8px; width: 38px; height: 38px; display: grid; place-items: center; cursor: pointer; font-size: 17px; }
.campanella .pallino { position: absolute; top: -6px; right: -6px; background: var(--rosso); color: #fff; font-size: 10.5px; font-weight: 800; min-width: 19px; height: 19px; border-radius: 10px; display: grid; place-items: center; padding: 0 5px; border: 2px solid var(--superficie); }
.utente-info { font-size: 13px; text-align: right; line-height: 1.3; }
.utente-info b { display: block; color: var(--blu); }
.utente-info small { color: var(--testo-2); }
.barra-alta .esci { background: var(--superficie-2); color: var(--blu); border: 1px solid var(--linea); padding: 7px 13px; border-radius: 7px; cursor: pointer; font-size: 13px; font-weight: 600; }

.menu { background: var(--superficie); border-bottom: 1px solid var(--linea); padding: 0 20px; display: flex; gap: 2px; overflow-x: auto; position: sticky; top: 62px; z-index: 40; }
.menu button { background: none; border: none; padding: 13px 15px; font-weight: 600; font-size: 14px; color: var(--testo-2); cursor: pointer; border-bottom: 3px solid transparent; white-space: nowrap; display: inline-flex; align-items: center; gap: 7px; }
.menu button:hover { color: var(--blu); }
.menu button.attivo { color: var(--blu); border-bottom-color: var(--acqua); }
.menu .conta { background: var(--rosso-bg); color: var(--rosso); font-size: 11px; font-weight: 800; padding: 1px 7px; border-radius: 10px; }

.contenuto { padding: 22px 20px 90px; max-width: 1400px; margin: 0 auto; }
.pagina { display: none; }
.pagina.attiva { display: block; animation: entra .18s ease; }
@keyframes entra { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

.titolo-pagina { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-bottom: 18px; }
.titolo-pagina h1 { font-size: 21px; font-weight: 700; letter-spacing: -.3px; text-wrap: balance; }
.titolo-pagina .sub { font-size: 13px; color: var(--testo-2); }
.titolo-pagina .azioni { display: flex; gap: 8px; flex-wrap: wrap; }

/* ------------------------------------------------------------- CARD */
.card { background: var(--superficie); border: 1px solid var(--linea); border-radius: var(--raggio); box-shadow: var(--ombra); margin-bottom: 18px; min-width: 0; }
.card-testa { padding: 13px 18px; border-bottom: 1px solid var(--linea); font-weight: 700; font-size: 15px; display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.card-testa .link { font-size: 13px; font-weight: 600; color: var(--blu-chiaro); cursor: pointer; }
.card-corpo { padding: 16px 18px; }
.card-corpo.stretto { padding: 0; }

/* --------------------------------------------------------- CRUSCOTTO */
.kpi-griglia { display: grid; gap: 14px; margin-bottom: 20px; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
.kpi { background: var(--superficie); border: 1px solid var(--linea); border-radius: var(--raggio); padding: 15px 16px; box-shadow: var(--ombra); border-left: 4px solid var(--blu-chiaro); min-width: 0; cursor: pointer; }
.kpi .etichetta { font-size: 11.5px; text-transform: uppercase; letter-spacing: .5px; color: var(--testo-2); font-weight: 700; margin-bottom: 6px; }
.kpi .valore { font-size: 28px; font-weight: 800; letter-spacing: -1px; line-height: 1.1; font-variant-numeric: tabular-nums; }
.kpi .nota { font-size: 12px; color: var(--testo-2); margin-top: 4px; }
.kpi.rosso { border-left-color: var(--rosso); } .kpi.rosso .valore { color: var(--rosso); }
.kpi.giallo { border-left-color: var(--giallo); }
.kpi.viola { border-left-color: var(--viola); }
.kpi.verde { border-left-color: var(--verde); }
.kpi.acqua { border-left-color: var(--acqua); }

.colonne-2 { display: grid; grid-template-columns: 1.5fr 1fr; gap: 18px; align-items: start; }
.colonne-2 > * { min-width: 0; }

.barra-grafico { display: flex; flex-direction: column; gap: 9px; }
.barra-riga { display: grid; grid-template-columns: 130px 1fr 44px; align-items: center; gap: 10px; font-size: 13.5px; }
.barra-riga .etich { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.barra-riga .traccia { background: var(--linea); border-radius: 5px; height: 18px; overflow: hidden; }
.barra-riga .riemp { background: var(--blu-chiaro); height: 100%; border-radius: 5px; }
.barra-riga .riemp.acqua { background: var(--acqua); }
.barra-riga .num { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; }

/* -------------------------------------------------------- SCADENZE */
.elenco { display: flex; flex-direction: column; gap: 9px; }
.riga-scad {
  background: var(--superficie); border: 1px solid var(--linea); border-left: 4px solid var(--linea-2);
  border-radius: var(--raggio); padding: 11px 14px; display: grid; gap: 2px 14px;
  grid-template-columns: 74px 1fr auto; align-items: center; cursor: pointer; transition: box-shadow .15s;
}
.riga-scad:hover { box-shadow: var(--ombra-alta); }
.riga-scad.scaduta { border-left-color: var(--rosso); background: color-mix(in srgb, var(--rosso-bg) 40%, var(--superficie)); }
.riga-scad.urgente { border-left-color: var(--rosso); }
.riga-scad.presto { border-left-color: var(--giallo); }
.riga-scad.ok { border-left-color: var(--acqua); }
.riga-scad.fatta { opacity: .6; }
.riga-scad.fatta .titolo { text-decoration: line-through; }
.rs-quando { text-align: center; border-right: 1px solid var(--linea); padding-right: 10px; }
.rs-quando .giorno { font-size: 20px; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; }
.rs-quando .mese { font-size: 10.5px; text-transform: uppercase; color: var(--testo-2); font-weight: 700; letter-spacing: .5px; }
.rs-quando .ora { font-size: 12px; font-weight: 700; color: var(--blu-chiaro); margin-top: 2px; }
.rs-centro { min-width: 0; }
.rs-centro .titolo { font-weight: 700; font-size: 14.5px; overflow-wrap: anywhere; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.rs-centro .dettagli { font-size: 12.5px; color: var(--testo-2); display: flex; flex-wrap: wrap; gap: 2px 12px; margin-top: 2px; }
.rs-destra { display: flex; flex-direction: column; align-items: flex-end; gap: 5px; }
.conto { font-size: 12.5px; font-weight: 800; padding: 3px 9px; border-radius: 6px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.conto.rosso { background: var(--rosso-bg); color: var(--rosso); }
.conto.giallo { background: var(--giallo-bg); color: var(--giallo); }
.conto.acqua { background: color-mix(in srgb, var(--acqua) 18%, var(--superficie)); color: var(--verde); }
.conto.grigio { background: var(--linea); color: var(--testo-2); }

.perentorio { font-size: 10.5px; font-weight: 800; letter-spacing: .4px; text-transform: uppercase; color: var(--rosso); border: 1px solid var(--rosso); border-radius: 4px; padding: 0 5px; }

/* ------------------------------------------------------------ BADGE */
.badge { display: inline-block; padding: 3px 9px; border-radius: 20px; font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .3px; white-space: nowrap; line-height: 1.4; }
.badge.grigio { background: var(--linea); color: var(--testo-2); }
.badge.blu { background: var(--blu-bg); color: var(--blu); }
.badge.verde { background: var(--verde-bg); color: var(--verde); }
.badge.rosso { background: var(--rosso-bg); color: var(--rosso); }
.badge.giallo { background: var(--giallo-bg); color: var(--giallo); }
.badge.arancio { background: var(--arancio-bg); color: var(--arancio); }
.badge.viola { background: var(--viola-bg); color: var(--viola); }
.badge.acqua { background: color-mix(in srgb, var(--acqua) 18%, var(--superficie)); color: var(--verde); }

/* Sigla azienda: stessa forma ovunque, colore per società */
.az { display: inline-flex; align-items: center; justify-content: center; font-size: 10.5px; font-weight: 900; letter-spacing: .3px; padding: 2px 7px; border-radius: 5px; color: #fff; white-space: nowrap; min-width: 34px; }
.az-sei { background: #0b2e9e; } .az-fe { background: #0fa58f; } .az-rei { background: #1547d6; } .az-eai { background: #2e8b57; }
.az-gne { background: #5b3cc4; } .az-p4u { background: #d9762b; } .az-eq { background: #1b2530; } .az-m4u { background: #b03a5b; }
:root[data-theme="dark"] .az-eq { background: #4a5a6e; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .az-eq { background: #4a5a6e; } }

/* ------------------------------------------------------------ FILTRI */
.filtri { background: var(--superficie); border: 1px solid var(--linea); border-radius: var(--raggio); padding: 12px 16px; margin-bottom: 16px; display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); align-items: end; box-shadow: var(--ombra); }
.filtri .campo { margin: 0; }
.filtri .azioni { display: flex; gap: 8px; }
.segmenti { display: inline-flex; border: 1px solid var(--linea-2); border-radius: 8px; overflow: hidden; }
.segmenti button { background: var(--superficie); border: none; padding: 7px 13px; font-size: 13px; font-weight: 600; color: var(--testo-2); cursor: pointer; }
.segmenti button + button { border-left: 1px solid var(--linea-2); }
.segmenti button.attivo { background: var(--blu); color: #fff; }

/* ------------------------------------------------------------ TABELLA */
.tabella-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }
table.tab { width: 100%; border-collapse: collapse; font-size: 14px; }
table.tab th { text-align: left; padding: 10px 12px; background: var(--superficie-2); font-size: 11.5px; text-transform: uppercase; letter-spacing: .4px; color: var(--testo-2); font-weight: 700; border-bottom: 1px solid var(--linea); white-space: nowrap; }
table.tab td { padding: 11px 12px; border-bottom: 1px solid var(--linea); vertical-align: middle; }
table.tab tr:last-child td { border-bottom: none; }
table.tab tbody tr { cursor: pointer; }
table.tab tbody tr:hover { background: var(--superficie-2); }
table.tab .t-tit { font-weight: 700; }
table.tab .t-sub { font-size: 12.5px; color: var(--testo-2); }
table.tab .num { text-align: right; }

/* Rischio: tre tacche */
.rischio { display: inline-flex; gap: 2px; align-items: flex-end; height: 14px; vertical-align: middle; margin-right: 6px; }
.rischio i { width: 5px; background: var(--linea-2); border-radius: 1px; display: block; }
.rischio i:nth-child(1) { height: 6px; } .rischio i:nth-child(2) { height: 10px; } .rischio i:nth-child(3) { height: 14px; }
.rischio.basso i:nth-child(1) { background: var(--verde); }
.rischio.medio i:nth-child(-n+2) { background: var(--giallo); }
.rischio.alto i { background: var(--rosso); }


/* ------------------------------------------------------------ POSIZIONI */
.posizione {
  position: relative; margin: 30px 0 14px; background: var(--superficie); border: 1px solid var(--linea);
  border-radius: 0 10px 10px 10px; box-shadow: var(--ombra); display: grid; grid-template-columns: 1fr 330px;
  cursor: pointer; transition: box-shadow .15s;
}
.posizione:hover { box-shadow: var(--ombra-alta); }
.posizione::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: var(--blu-chiaro); border-radius: 0 0 0 10px; }
.posizione.evidenza::before { background: var(--rosso); }
.posizione.chiuso::before { background: var(--verde); }
.posizione.chiuso { opacity: .75; }
.posizione .linguetta {
  position: absolute; top: -27px; left: -1px; height: 28px; background: var(--superficie); border: 1px solid var(--linea); border-bottom: none;
  border-radius: 8px 8px 0 0; padding: 0 12px 0 14px; font-size: 12.5px; font-weight: 800; letter-spacing: .3px;
  display: flex; align-items: center; gap: 8px; color: var(--testo); max-width: calc(100% - 20px); white-space: nowrap;
}
.posizione .linguetta::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--superficie); }
.posizione .linguetta .data { color: var(--testo-2); font-weight: 600; font-variant-numeric: tabular-nums; }
.posizione .corpo { padding: 14px 16px 14px 20px; min-width: 0; }
.posizione .tit { font-weight: 700; font-size: 15.5px; text-wrap: balance; margin-bottom: 6px; }
.posizione .riga-meta { font-size: 13px; color: var(--testo-2); display: flex; flex-wrap: wrap; gap: 3px 16px; }
.posizione .riga-meta b { color: var(--testo); font-weight: 600; }
.posizione .riga-stato { margin-top: 10px; display: flex; gap: 6px; flex-wrap: wrap; }
.posizione .scad-legali { border-left: 1px dashed var(--linea); background: var(--superficie-2); padding: 12px 14px; border-radius: 0 10px 10px 0; min-width: 0; }
.posizione .scad-legali .et { font-size: 10.5px; text-transform: uppercase; letter-spacing: .6px; color: var(--testo-2); font-weight: 800; margin-bottom: 6px; }
.posizione .scad-legali .vuota { font-size: 13px; color: var(--testo-2); }
.posizione .sl { display: grid; grid-template-columns: 44px 1fr auto; gap: 8px; align-items: center; font-size: 12.5px; padding: 5px 0; border-bottom: 1px dashed var(--linea); }
.posizione .sl:last-child { border-bottom: none; }
.posizione .sl .d { font-weight: 800; color: var(--blu); }
.posizione .sl.urg .d { color: var(--giallo); }
.posizione .sl.scad .d { color: var(--rosso); }
.posizione .sl .t { min-width: 0; overflow-wrap: anywhere; }
.posizione .sl .conto { font-size: 11px; padding: 2px 7px; }
@media (max-width: 900px) { .posizione { grid-template-columns: 1fr; } .posizione .scad-legali { border-left: none; border-top: 1px dashed var(--linea); border-radius: 0 0 10px 10px; } }

/* ------------------------------------------------------ SCHEDA PRATICA */
.testa-pratica { background: var(--superficie); border: 1px solid var(--linea); border-radius: var(--raggio); box-shadow: var(--ombra); padding: 18px 20px; margin-bottom: 18px; display: grid; grid-template-columns: 1fr auto; gap: 14px 20px; align-items: start; }
.testa-pratica .codice { font-size: 12.5px; color: var(--testo-2); font-weight: 700; letter-spacing: .5px; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.testa-pratica h1 { font-size: 22px; font-weight: 800; letter-spacing: -.4px; margin: 4px 0 8px; text-wrap: balance; }
.testa-pratica .meta { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 13.5px; color: var(--testo-2); }
.testa-pratica .meta b { color: var(--testo); font-weight: 600; }
.testa-pratica .azioni { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.marchio-azienda { height: 28px; width: auto; display: inline-block; vertical-align: middle; background: #fff; padding: 3px 6px; border-radius: 6px; border: 1px solid var(--linea); }

.layout-pratica { display: grid; grid-template-columns: 300px 1fr; gap: 18px; align-items: start; }
.layout-pratica > * { min-width: 0; }
.info-lista { display: flex; flex-direction: column; }
.info-voce { padding: 9px 0; border-bottom: 1px dashed var(--linea); }
.info-voce:last-child { border-bottom: none; }
.info-voce .et { font-size: 11px; text-transform: uppercase; letter-spacing: .5px; color: var(--testo-2); font-weight: 700; margin-bottom: 1px; }
.info-voce .vl { font-size: 14px; font-weight: 600; word-break: break-word; }

.tab-pratica { display: flex; gap: 2px; border-bottom: 1px solid var(--linea); margin-bottom: 16px; overflow-x: auto; }
.tab-pratica button { background: none; border: none; padding: 10px 14px; font-weight: 600; font-size: 14px; color: var(--testo-2); cursor: pointer; border-bottom: 3px solid transparent; white-space: nowrap; display: inline-flex; gap: 6px; align-items: center; }
.tab-pratica button.attivo { color: var(--blu); border-bottom-color: var(--acqua); }
.tab-pratica .n { font-size: 11px; font-weight: 800; background: var(--linea); color: var(--testo-2); padding: 0 6px; border-radius: 9px; }
.tab-pratica .n.viola { background: var(--viola-bg); color: var(--viola); }
.pannello { display: none; }
.pannello.attivo { display: block; }

/* Fasi: sequenza verticale, ordine = ordine del procedimento */
.fasi { position: relative; padding-left: 4px; }
.fase { display: grid; grid-template-columns: 30px 1fr; gap: 12px; position: relative; padding-bottom: 20px; }
.fase::before { content: ""; position: absolute; left: 14px; top: 28px; bottom: 0; width: 2px; background: var(--linea); }
.fase:last-child::before { display: none; }
.fase .pallino { width: 30px; height: 30px; border-radius: 50%; border: 2px solid var(--linea-2); background: var(--superficie); display: grid; place-items: center; font-size: 12px; font-weight: 800; color: var(--testo-2); z-index: 1; }
.fase.fatta .pallino { background: var(--verde); border-color: var(--verde); color: #fff; }
.fase.fatta::before { background: var(--verde); }
.fase.corrente .pallino { background: var(--blu); border-color: var(--blu); color: #fff; box-shadow: 0 0 0 5px color-mix(in srgb, var(--blu) 18%, transparent); }
.fase .corpo { background: var(--superficie); border: 1px solid var(--linea); border-radius: 8px; padding: 11px 14px; }
.fase.corrente .corpo { border-color: var(--blu-chiaro); background: color-mix(in srgb, var(--blu-bg) 55%, var(--superficie)); }
.fase .corpo .nome { font-weight: 700; font-size: 14.5px; display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; align-items: center; }
.fase .corpo .quando { font-size: 12.5px; color: var(--testo-2); margin-top: 2px; font-variant-numeric: tabular-nums; }
.fase .corpo .note { font-size: 13.5px; margin-top: 7px; }
.fase .corpo ul { margin: 6px 0 0 18px; font-size: 13px; color: var(--testo-2); }

/* Documenti */
.doc { display: grid; grid-template-columns: 42px 1fr auto; gap: 12px; align-items: center; padding: 11px 14px; border: 1px solid var(--linea); border-radius: 8px; background: var(--superficie); margin-bottom: 8px; }
.doc .icona { width: 42px; height: 42px; border-radius: 8px; background: var(--superficie-2); display: grid; place-items: center; font-size: 11px; font-weight: 800; color: var(--testo-2); border: 1px solid var(--linea); letter-spacing: .3px; }
.doc .nome { font-weight: 700; font-size: 14px; overflow-wrap: anywhere; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.doc .dett { font-size: 12.5px; color: var(--testo-2); display: flex; flex-wrap: wrap; gap: 2px 12px; }
.doc .az-doc { display: flex; gap: 6px; }
.doc.bozza { border: 1.5px dashed var(--viola); background: color-mix(in srgb, var(--viola-bg) 45%, var(--superficie)); }
.doc.bozza .icona { border-style: dashed; border-color: var(--viola); color: var(--viola); background: transparent; }
.cartella { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .6px; color: var(--testo-2); margin: 16px 0 8px; }
.cartella::after { content: ""; flex: 1; height: 1px; background: var(--linea); }
.cartella:first-child { margin-top: 0; }
.cartella.viola { color: var(--viola); }

.bozze-avviso { border: 1.5px dashed var(--viola); background: color-mix(in srgb, var(--viola-bg) 55%, var(--superficie)); border-radius: 8px; padding: 10px 14px; font-size: 13.5px; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 12px; }
.bozze-avviso b { color: var(--viola); }

.zip-contenuto { margin: -4px 0 10px 54px; border-left: 2px solid var(--linea); padding-left: 12px; }
.zip-contenuto .zf { display: grid; grid-template-columns: 44px 1fr auto; gap: 10px; font-size: 12.5px; padding: 4px 0; color: var(--testo-2); font-variant-numeric: tabular-nums; }
.zip-contenuto .zf .tipo { font-weight: 800; font-size: 10.5px; color: var(--testo-2); }
.zip-contenuto .zf span:nth-child(2) { color: var(--testo); overflow-wrap: anywhere; }
.zona-carica { border: 2px dashed var(--linea-2); border-radius: 10px; padding: 26px 18px; text-align: center; background: var(--superficie-2); margin-bottom: 16px; }
.zona-carica .grande { font-size: 15px; font-weight: 700; }
.zona-carica .tipi { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 10px; }
.zona-carica .tipi span { font-size: 11px; font-weight: 800; border: 1px solid var(--linea-2); border-radius: 5px; padding: 2px 7px; color: var(--testo-2); }
.zona-carica .tipi span.zip { border-color: var(--acqua); color: var(--verde); }
.zona-carica .nota { font-size: 12.5px; color: var(--testo-2); margin-top: 10px; }
.file-scelto { display: grid; grid-template-columns: 42px 1fr auto; gap: 12px; align-items: center; border: 1px solid var(--linea); border-radius: 8px; padding: 9px 12px; background: var(--superficie); margin-bottom: 14px; }

/* Diario */
.diario-voce { display: grid; grid-template-columns: 112px 1fr; gap: 12px; padding: 10px 0; border-bottom: 1px dashed var(--linea); font-size: 13.5px; }
.diario-voce:last-child { border-bottom: none; }
.diario-voce .quando { color: var(--testo-2); font-variant-numeric: tabular-nums; font-size: 12.5px; line-height: 1.35; }
.diario-voce .quando b { display: block; color: var(--testo); font-size: 13px; }
.diario-voce .chi { font-size: 12px; color: var(--testo-2); margin-top: 2px; }
.diario-voce .tipo { font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .4px; margin-right: 6px; color: var(--blu); }

/* Persone */
.persona { display: grid; grid-template-columns: 40px 1fr; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px dashed var(--linea); }
.persona:last-child { border-bottom: none; }
.avatar { width: 40px; height: 40px; border-radius: 50%; background: var(--blu-bg); color: var(--blu); display: grid; place-items: center; font-weight: 800; font-size: 13px; }
.persona .n { font-weight: 700; font-size: 14px; }
.persona .r { font-size: 12.5px; color: var(--testo-2); }

/* Calendario mese */
.calendario { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.calendario .intest { font-size: 11px; text-transform: uppercase; letter-spacing: .5px; color: var(--testo-2); font-weight: 700; text-align: center; padding: 4px 0; }
.calendario .g { min-height: 74px; border: 1px solid var(--linea); border-radius: 6px; padding: 5px 6px; font-size: 12px; background: var(--superficie); min-width: 0; }
.calendario .g .d { font-weight: 700; font-variant-numeric: tabular-nums; color: var(--testo-2); }
.calendario .g.oggi { border-color: var(--acqua); box-shadow: inset 0 0 0 1px var(--acqua); }
.calendario .g.oggi .d { color: var(--verde); }
.calendario .g.fuori { opacity: .35; }
.calendario .ev { display: block; margin-top: 3px; font-size: 11px; font-weight: 600; padding: 1px 5px; border-radius: 4px; background: var(--blu-bg); color: var(--blu); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.calendario .ev.rosso { background: var(--rosso-bg); color: var(--rosso); }
.calendario .ev.giallo { background: var(--giallo-bg); color: var(--giallo); }
.calendario .ev.viola { background: var(--viola-bg); color: var(--viola); }
.calendario .ev.verde { background: var(--verde-bg); color: var(--verde); }

/* Impostazioni */
.modello-fasi { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.modello-fasi .passo { font-size: 12.5px; background: var(--superficie-2); border: 1px solid var(--linea); border-radius: 6px; padding: 3px 9px; font-weight: 600; }
.modello-fasi .freccia { color: var(--linea-2); font-size: 13px; }
.modello-fasi .passo small { color: var(--testo-2); font-weight: 600; }

/* ------------------------------------------------------------ MODALE */
.sfondo-modale { position: fixed; inset: 0; background: rgba(16,32,52,.55); display: none; align-items: flex-start; justify-content: center; z-index: 100; padding: 24px 16px; overflow-y: auto; backdrop-filter: blur(2px); }
.sfondo-modale.aperto { display: flex; }
.modale { background: var(--superficie); border-radius: 14px; width: 100%; max-width: 760px; box-shadow: var(--ombra-alta); animation: sali .2s ease; margin: auto 0; }
@keyframes sali { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.modale-testa { padding: 16px 22px; border-bottom: 1px solid var(--linea); display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.modale-testa h2 { font-size: 18px; font-weight: 700; }
.modale-testa .chiudi { background: none; border: none; font-size: 26px; line-height: 1; cursor: pointer; color: var(--testo-2); }
.modale-corpo { padding: 20px 22px; }
.modale-piede { padding: 14px 22px; border-top: 1px solid var(--linea); display: flex; gap: 10px; justify-content: flex-end; flex-wrap: wrap; }
.sezione-form { margin-bottom: 20px; }
.sezione-form > h3 { font-size: 12px; text-transform: uppercase; letter-spacing: .8px; color: var(--blu); font-weight: 800; margin-bottom: 12px; padding-bottom: 7px; border-bottom: 2px solid var(--linea); }
.passi-wizard { display: flex; gap: 6px; margin-bottom: 18px; }
.passi-wizard span { flex: 1; height: 5px; border-radius: 3px; background: var(--linea); }
.passi-wizard span.fatto { background: var(--acqua); }
.scelta-tipo { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 9px; }
.scelta-tipo label { border: 1px solid var(--linea-2); border-radius: 8px; padding: 10px 12px; cursor: pointer; font-size: 13.5px; display: flex; gap: 9px; align-items: flex-start; text-transform: none; letter-spacing: 0; color: var(--testo); font-weight: 600; }
.scelta-tipo label small { display: block; color: var(--testo-2); font-weight: 500; font-size: 12px; }
.scelta-tipo label:has(input:checked) { border-color: var(--acqua); background: color-mix(in srgb, var(--acqua) 12%, var(--superficie)); }
.scelta-tipo input { margin-top: 3px; accent-color: var(--blu); }
.anteprima-fasi { background: var(--superficie-2); border: 1px solid var(--linea); border-radius: 8px; padding: 12px 14px; font-size: 13.5px; }

.risultato-termine { background: var(--blu-bg); border-radius: 8px; padding: 14px 16px; margin-top: 6px; }
.risultato-termine .grande { font-size: 24px; font-weight: 800; color: var(--blu); font-variant-numeric: tabular-nums; }
.risultato-termine .spiega { font-size: 13px; color: var(--testo-2); margin-top: 4px; }
.interruttore { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; text-transform: none; letter-spacing: 0; font-weight: 600; color: var(--testo); cursor: pointer; }
.interruttore input { accent-color: var(--blu); width: 16px; height: 16px; }

/* ------------------------------------------------------ AVVISI/VUOTO */
.avviso { padding: 11px 14px; border-radius: 8px; font-size: 14px; margin-bottom: 14px; }
.avviso.info { background: var(--blu-bg); color: var(--blu); }
.avviso.attenzione { background: var(--giallo-bg); color: var(--giallo); }
.vuoto { text-align: center; padding: 36px 20px; color: var(--testo-2); font-size: 14px; }

/* ------------------------------------------------------------ MOBILE */
@media (max-width: 900px) {
  .colonne-2 { grid-template-columns: 1fr; }
  .layout-pratica { grid-template-columns: 1fr; }
  .testa-pratica { grid-template-columns: 1fr; }
  .testa-pratica .azioni { justify-content: flex-start; }
}
@media (max-width: 720px) {
  body { font-size: 14.5px; }
  .contenuto { padding: 16px 16px 90px; }
  .barra-alta { padding: 0 14px; gap: 10px; height: 56px; }
  .barra-alta .cerca, .utente-info { display: none; }
  .menu { top: 56px; padding: 0 8px; }
  .menu button { padding: 12px 11px; font-size: 13.5px; }
  .riga-scad { grid-template-columns: 64px 1fr; }
  .rs-destra { grid-column: 1 / -1; flex-direction: row; align-items: center; justify-content: flex-start; flex-wrap: wrap; padding-top: 8px; border-top: 1px dashed var(--linea); margin-top: 6px; }
  .griglia-2 { grid-template-columns: 1fr; }
  .modale-piede .btn { flex: 1; }
  .kpi .valore { font-size: 24px; }
  .calendario .g { min-height: 54px; padding: 3px 4px; }
  .calendario .ev { font-size: 9.5px; padding: 0 3px; }
  .doc { grid-template-columns: 42px 1fr; }
  .doc .az-doc { grid-column: 1 / -1; }
  .diario-voce { grid-template-columns: 1fr; gap: 2px; }
}

/* ===================================================== AGGIUNTE APP */
.campo select[multiple] { min-height: 110px; }
.scelta-chip { display: flex; flex-wrap: wrap; gap: 7px; }
.scelta-chip label { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--linea-2); border-radius: 20px; padding: 5px 11px 5px 7px; cursor: pointer; font-size: 13px; text-transform: none; letter-spacing: 0; color: var(--testo); font-weight: 600; margin: 0; }
.scelta-chip label:has(input:checked) { border-color: var(--blu); background: var(--blu-bg); }
.scelta-chip input { accent-color: var(--blu); margin: 0; width: 15px; height: 15px; }

/* Avvisi (campanella) */
.avvisi-tendina { position: absolute; top: 50px; right: 0; width: min(420px, calc(100vw - 24px)); background: var(--superficie); border: 1px solid var(--linea); border-radius: 12px; box-shadow: var(--ombra-alta); z-index: 80; display: none; max-height: 70vh; overflow-y: auto; }
.avvisi-tendina.aperta { display: block; }
.avvisi-tendina .testa { padding: 11px 14px; border-bottom: 1px solid var(--linea); font-weight: 700; display: flex; justify-content: space-between; align-items: center; font-size: 14px; }
.avviso-riga { display: grid; grid-template-columns: 8px 1fr; gap: 10px; padding: 10px 14px; border-bottom: 1px solid var(--linea); cursor: pointer; font-size: 13.5px; }
.avviso-riga:hover { background: var(--superficie-2); }
.avviso-riga .pt { width: 8px; height: 8px; border-radius: 50%; margin-top: 6px; background: var(--linea-2); }
.avviso-riga.rosso .pt { background: var(--rosso); } .avviso-riga.giallo .pt { background: var(--giallo); } .avviso-riga.viola .pt { background: var(--viola); } .avviso-riga.blu .pt { background: var(--blu-chiaro); }
.avviso-riga.letto { opacity: .55; }
.avviso-riga small { display: block; color: var(--testo-2); font-size: 12px; }
.campanella-box { position: relative; }

/* Posizione: chip società con colore dinamico */
.az { background: var(--blu); }

/* Pulsanti riga */
.azioni-riga { display: flex; gap: 6px; flex-wrap: wrap; }
.btn-icona { background: none; border: 1px solid transparent; border-radius: 6px; padding: 4px 7px; cursor: pointer; color: var(--testo-2); font-size: 14px; }
.btn-icona:hover { background: var(--superficie-2); color: var(--testo); border-color: var(--linea); }

/* Stato fase: bottoni */
.fase .stato-btn { display: flex; gap: 5px; flex-wrap: wrap; margin-top: 8px; }
.fase .stato-btn .btn { padding: 4px 9px; font-size: 12px; }

/* File input */
.zona-carica input[type=file] { display: none; }
.zona-carica.trascina { border-color: var(--acqua); background: color-mix(in srgb, var(--acqua) 10%, var(--superficie)); }
.barra-avanzamento { height: 6px; background: var(--linea); border-radius: 3px; overflow: hidden; margin-top: 10px; display: none; }
.barra-avanzamento div { height: 100%; background: var(--acqua); width: 0; transition: width .2s; }

/* Dettaglio chiuso */
.testa-pratica.chiuso { border-left: 5px solid var(--verde); }
.testa-pratica.sospeso { border-left: 5px solid var(--giallo); }

/* Tabelle strette */
table.tab td.azioni { white-space: nowrap; text-align: right; }
.piccolo { font-size: 12.5px; color: var(--testo-2); }
.link-blu { color: var(--blu-chiaro); cursor: pointer; font-weight: 600; text-decoration: none; }
.link-blu:hover { text-decoration: underline; }
.pre { white-space: pre-wrap; }
.colore-quadro { display: inline-block; width: 14px; height: 14px; border-radius: 4px; vertical-align: middle; margin-right: 6px; }

/* Ricerca globale */
.barra-alta .cerca { cursor: text; }
.barra-alta .cerca input { border: none; background: transparent; outline: none; width: 100%; font-size: 13.5px; color: var(--testo); }

/* Login: avviso password */
.box-login .avviso { margin-top: 12px; margin-bottom: 0; }

/* Cambio password obbligatorio */
#schermata-password { min-height: 100vh; display: none; align-items: center; justify-content: center; padding: 20px; background: var(--sfondo); }
#schermata-password.attiva { display: flex; }

/* Sospeso */
.posizione.sospeso::before { background: var(--giallo); }

/* Versioni documento */
.versioni { margin: -4px 0 10px 54px; border-left: 2px solid var(--linea); padding-left: 12px; font-size: 12.5px; }
.versioni div { padding: 3px 0; display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }

@media (max-width: 720px) {
  .barra-alta .marchio img { height: 30px; }
  .avvisi-tendina { position: fixed; top: 60px; left: 12px; right: 12px; width: auto; }
}

/* ===================================================== v1.1 */
.badge.cls { color: #fff; letter-spacing: .5px; }
.logo-box { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; border: 1px solid var(--linea); border-radius: 8px; padding: 10px 12px; background: var(--superficie-2); }
.logo-anteprima { max-height: 48px; max-width: 220px; background: #fff; padding: 4px 8px; border-radius: 6px; border: 1px solid var(--linea); }
.albero-voce { padding: 5px 0; font-size: 13.5px; border-bottom: 1px dashed var(--linea); }
.albero-voce:last-child { border-bottom: none; }
.albero-linea { color: var(--linea-2); margin-right: 6px; }
.lista-fasc { max-height: 320px; overflow-y: auto; border: 1px solid var(--linea); border-radius: 8px; padding: 6px 12px; background: var(--superficie); }
.fasc-voce { display: flex; gap: 8px; align-items: center; padding: 5px 0; font-size: 13.5px; text-transform: none; letter-spacing: 0; color: var(--testo); font-weight: 500; cursor: pointer; }
.fasc-voce input { accent-color: var(--blu); }
.msg { border: 1px solid var(--linea); border-radius: 8px; padding: 10px 14px; margin-bottom: 10px; font-size: 14px; background: var(--superficie); }
.msg.nuovo { border-left: 4px solid var(--blu-chiaro); background: color-mix(in srgb, var(--blu-bg) 40%, var(--superficie)); cursor: pointer; }
.msg.urgente { border-left: 4px solid var(--rosso); }
.msg-testa { font-size: 12.5px; color: var(--testo-2); margin-bottom: 4px; }
.msg-tit { font-weight: 700; margin-bottom: 4px; }
#btn-avviso { background: var(--blu); color: #fff; border-color: var(--blu); }
@media (max-width: 720px) { #btn-avviso { padding: 7px 8px; font-size: 12px; } }

/* ===================================================== v1.2 */
[hidden] { display: none !important; }
/* Login: occhio sulla password, Face ID, recupero */
.campo-occhio { position: relative; }
.campo-occhio input { padding-right: 44px; width: 100%; }
.campo-occhio .occhio { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); background: none; border: none; cursor: pointer; font-size: 17px; padding: 4px 6px; border-radius: 6px; opacity: .55; }
.campo-occhio .occhio:hover, .campo-occhio .occhio.attivo { opacity: 1; background: rgba(11,46,158,.08); }
.btn-faceid { margin-top: 10px; background: #fff; color: #0b2e9e; border: 1.5px solid #0b2e9e; }
.btn-faceid:hover { background: #eef2ff; }
.login-link { text-align: center; margin-top: 14px; font-size: 13px; }
.login-link a { color: #0b2e9e; font-weight: 600; text-decoration: none; }
.login-link a:hover { text-decoration: underline; }
#schermata-reimposta { min-height: 100vh; display: none; align-items: center; justify-content: center; padding: 20px; background: linear-gradient(146deg, #071c63 0%, #0a2a92 52%, #1547d6 100%); }
#schermata-reimposta.attiva { display: flex; }
button.utente-info { background: none; border: 1px solid transparent; border-radius: 8px; padding: 4px 8px; cursor: pointer; font-family: inherit; }
button.utente-info:hover { border-color: var(--linea); background: var(--superficie-2); }
.dispositivo { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px dashed var(--linea); font-size: 13.5px; }
.dispositivo:last-child { border-bottom: none; }
.dispositivo .quando { color: var(--testo-2); font-size: 12px; margin-left: auto; }

/* Documenti: email, PEC, immagini, allegati */
.doc .icona.img { padding: 0; overflow: hidden; }
.doc .icona img { width: 100%; height: 100%; object-fit: cover; }
.doc.email { border-left: 4px solid var(--ciano); }
.doc.email.pec { border-left-color: var(--viola); }
.doc .email-meta { font-size: 12.5px; color: var(--testo-2); display: grid; grid-template-columns: auto 1fr; gap: 1px 8px; margin-top: 4px; }
.doc .email-meta b { color: var(--testo); font-weight: 600; overflow-wrap: anywhere; }
.doc .anteprima-testo { font-size: 12.5px; color: var(--testo-2); margin-top: 4px; white-space: pre-wrap; max-height: 3.6em; overflow: hidden; }
.doc .anteprima-testo.aperta { max-height: none; }
.badge.ricevuta { background: color-mix(in srgb, var(--ciano) 18%, var(--superficie)); color: #0b6b80; }
.badge.spedita { background: var(--blu-bg); color: var(--blu); }
.badge.pec { background: var(--viola-bg); color: var(--viola); }
.allegati { margin: -4px 0 10px 54px; border-left: 2px solid var(--linea); padding-left: 12px; }
.allegati .doc { margin-bottom: 6px; padding: 7px 10px; grid-template-columns: 32px 1fr auto; }
.allegati .doc .icona { width: 32px; height: 32px; font-size: 10px; }
.allegati .doc .nome { font-size: 13px; }
.galleria { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin-bottom: 12px; }
.galleria .foto { border: 1px solid var(--linea); border-radius: 8px; overflow: hidden; background: var(--superficie); cursor: pointer; }
.galleria .foto img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; background: var(--superficie-2); }
.galleria .foto .did { font-size: 12px; padding: 6px 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.file-lista { margin-top: 10px; display: grid; gap: 6px; }
.file-riga { display: grid; grid-template-columns: 38px 1fr auto; gap: 10px; align-items: center; border: 1px solid var(--linea); border-radius: 8px; padding: 6px 10px; background: var(--superficie); font-size: 13px; }
.file-riga .ext { width: 38px; height: 38px; border-radius: 7px; background: var(--superficie-2); display: grid; place-items: center; font-size: 10.5px; font-weight: 800; color: var(--testo-2); border: 1px solid var(--linea); }
.file-riga .n { font-weight: 600; overflow-wrap: anywhere; }
.file-riga .i { color: var(--testo-2); font-size: 12px; }
.file-riga.email { border-left: 4px solid var(--ciano); }
.file-riga.pec { border-left: 4px solid var(--viola); }
.aiuto-mail { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; margin-top: 10px; }
.aiuto-mail div { background: var(--superficie-2); border: 1px solid var(--linea); border-radius: 8px; padding: 10px 12px; font-size: 12.5px; color: var(--testo-2); }
.aiuto-mail b { color: var(--testo); display: block; margin-bottom: 3px; }

/* Caricamento ZIP */
.zip-tab td { vertical-align: middle; }
.zip-tab select, .zip-tab input { padding: 6px 8px; font-size: 13px; min-width: 120px; }
.zip-tab td:nth-child(2) { min-width: 300px; }
.z-nota label { white-space: nowrap; }
.zip-tab .nomefile { font-weight: 600; overflow-wrap: anywhere; font-size: 13px; }
.zip-tab .cartella-zip { font-size: 11.5px; color: var(--testo-2); }
.esito-ok { color: var(--verde); font-weight: 700; }
.esito-err { color: var(--rosso); font-weight: 700; }
.riga-default { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; align-items: end; background: var(--superficie-2); border: 1px solid var(--linea); border-radius: 8px; padding: 12px 14px; margin-bottom: 14px; }

/* Archivio */
.posizione.archiviato { opacity: 1; }
.posizione.archiviato .riga-stato { align-items: center; }
.posizione.archiviato::before { background: var(--verde); }
.anno-archivio { display: flex; align-items: center; gap: 12px; margin: 18px 0 10px; }
.anno-archivio h2 { font-size: 20px; margin: 0; color: var(--blu); }
.anno-archivio .n { font-size: 12.5px; color: var(--testo-2); font-weight: 600; }
.btn-riporta { white-space: nowrap; }
@media (max-width: 720px) { .allegati { margin-left: 20px; } .doc .az-doc { flex-wrap: wrap; } }
.campo label.dest-voce { display: flex; text-transform: none; letter-spacing: 0; font-size: 13.5px; font-weight: 500; color: var(--testo); margin: 0; border-bottom: 1px dashed var(--linea); padding-top: 7px; padding-bottom: 7px; }
.dest-voce:last-child { border-bottom: none; }
.dest-voce b { font-weight: 600; }
.campo .dest-voce input[type=checkbox] { width: auto; flex: 0 0 auto; margin: 0; accent-color: var(--blu); }
.campo .dest-voce { justify-content: flex-start; align-items: center; gap: 8px; cursor: pointer; }
.campo .dest-voce b, .campo .dest-voce span { flex: 0 0 auto; }

/* ===================================================== v1.3 — AI */
.box-ai { border: 1.5px solid var(--acqua); border-radius: 10px; padding: 12px 14px; margin: 10px 0 14px; background: color-mix(in srgb, var(--acqua) 7%, var(--superficie)); }
.box-ai-testa { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 14px; margin-bottom: 8px; }
.box-ai-riassunto { font-size: 13.5px; background: var(--superficie); border: 1px solid var(--linea); border-radius: 8px; padding: 10px 12px; margin-bottom: 8px; }
.box-ai-avv { font-size: 12.5px; background: var(--giallo-bg); color: var(--giallo); border-radius: 8px; padding: 8px 10px; margin-bottom: 8px; }
.box-ai-sez { margin-top: 8px; font-size: 13.5px; }
.box-ai-sez > b { display: block; margin-bottom: 4px; }
.ai-voce { display: flex; gap: 8px; align-items: flex-start; padding: 5px 0; border-bottom: 1px dashed var(--linea); font-size: 13.5px; cursor: pointer; text-transform: none; letter-spacing: 0; font-weight: 500; color: var(--testo); }
.ai-voce:last-child { border-bottom: none; }
.ai-voce input[type=checkbox] { width: auto; flex: 0 0 auto; margin-top: 3px; accent-color: var(--blu); }
.ai-voce.scaduta { opacity: .7; }
.ai-avvio { border: 1.5px dashed var(--acqua); border-radius: 10px; padding: 12px 14px; background: color-mix(in srgb, var(--acqua) 6%, var(--superficie)); }
.ai-avvio h3 { color: var(--verde); }
@keyframes ai-lamp { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }
.ai-lampeggia { animation: ai-lamp 1.2s ease-in-out infinite; color: var(--verde); font-weight: 600; }

/* Tabella utenti: i tre pulsanti uno sotto l'altro, così stanno sempre dentro la scheda */
table.tab-utenti { table-layout: fixed; width: 100%; min-width: 0; }
table.tab-utenti td { overflow-wrap: anywhere; padding-left: 8px; padding-right: 8px; }
table.tab-utenti th { white-space: normal; padding-left: 8px; padding-right: 8px; }
table.tab-utenti .badge { white-space: normal; overflow-wrap: normal; word-break: keep-all; font-size: 10.5px; letter-spacing: .2px; padding: 3px 7px; }
td.azioni-utente { width: 118px; }
td.azioni-utente .btn { display: flex; width: 110px; justify-content: flex-start; margin-bottom: 4px; padding: 6px 9px; font-size: 12.5px; }
td.azioni-utente .btn:last-child { margin-bottom: 0; }
.zip-tab input[type=checkbox] { min-width: 0; width: auto; margin: 0 4px 0 0; vertical-align: middle; accent-color: var(--blu); }
.z-nota label { display: inline-flex; align-items: center; gap: 4px; margin-right: 10px; cursor: pointer; }

/* Registro attività a pacchetti */
.pacchetti { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin: 0 0 12px; }
.pacchetti select { padding: 6px 10px; font-size: 13px; }
tr.riga-rossa td { background: color-mix(in srgb, var(--rosso-bg) 50%, var(--superficie)); }
/* Voce di menu "Scadenze" in rosso, come richiesto */
.menu button[data-pag="scadenze"] { color: var(--rosso); font-weight: 700; }
.menu button[data-pag="scadenze"]:hover, .menu button[data-pag="scadenze"].attivo { color: var(--rosso); border-bottom-color: var(--rosso); }

/* ===================================================== TELEFONO (v1.7.1): niente scorrimento laterale, tutto dentro lo schermo */
@media (max-width: 720px) {
  html, body { overflow-x: hidden; max-width: 100vw; }
  #schermata-app, .contenuto, .card, .card-corpo, .testa-pratica, .layout-pratica, .posizione, .riga-scad, .doc, .modale { max-width: 100%; min-width: 0; }
  .contenuto { padding: 12px 12px 90px; }
  h1, h2, h3, .tit, .titolo, .nome, .n, .t-tit, .t-sub, .dett, .piccolo, .sub, .vl, .et, .info-voce, .linguetta, .riga-meta, .email-meta b, .box-ai-riassunto, .anteprima-testo, .msg, .diario-voce { overflow-wrap: anywhere; word-break: break-word; }
  /* Intestazione: su una riga, compatta */
  .barra-alta { padding: 0 10px; gap: 8px; height: 54px; }
  .barra-alta .marchio img { height: 28px; }
  .barra-alta .esci { padding: 7px 9px; font-size: 12.5px; white-space: nowrap; }
  #btn-avviso { font-size: 0; padding: 7px 9px; }
  #btn-avviso::before { content: "📣"; font-size: 15px; }
  .campanella { width: 34px; height: 34px; font-size: 15px; }
  /* Menu: va a capo su più righe invece di correre a destra */
  .menu { top: 54px; padding: 4px 6px; flex-wrap: wrap; overflow: visible; gap: 0; justify-content: flex-start; }
  .menu button { padding: 8px 9px; font-size: 13px; border-bottom-width: 2px; }
  .menu .conta { font-size: 10px; padding: 0 5px; }
  /* Titoli pagina e pulsanti */
  .titolo-pagina { gap: 10px; margin-bottom: 12px; }
  .titolo-pagina h1 { font-size: 19px; }
  .titolo-pagina .azioni { width: 100%; gap: 6px; }
  .titolo-pagina .azioni .btn { padding: 8px 10px; font-size: 13px; }
  .segmenti button { padding: 7px 10px; font-size: 12.5px; }
  .filtri { grid-template-columns: 1fr 1fr; gap: 8px 10px; padding: 10px 12px; }
  .filtri .azioni { grid-column: 1 / -1; }
  .kpi-griglia { grid-template-columns: 1fr 1fr; gap: 10px; }
  .kpi { padding: 12px 12px; }
  /* Posizioni: cartellina a colonna unica, testi a capo */
  .posizione { margin: 26px 0 12px; }
  .posizione .linguetta { white-space: normal; max-width: 100%; line-height: 1.5; }
  .posizione .corpo { padding: 12px 12px 12px 16px; }
  .posizione .tit { font-size: 15px; }
  .posizione .riga-meta { gap: 2px 10px; font-size: 12.5px; }
  .posizione .scad-legali { padding: 10px 12px; }
  /* Scheda posizione */
  .testa-pratica { padding: 14px 14px; gap: 10px; }
  .testa-pratica h1 { font-size: 18px; }
  .testa-pratica .codice { flex-wrap: wrap; display: flex; gap: 4px 6px; align-items: center; }
  .testa-pratica .meta { gap: 2px 12px; font-size: 12.5px; }
  .testa-pratica .azioni { gap: 6px; }
  .testa-pratica .azioni .btn { padding: 7px 9px; font-size: 12.5px; }
  .tab-pratica { overflow-x: auto; -webkit-overflow-scrolling: touch; flex-wrap: nowrap; }
  .tab-pratica button { padding: 10px 10px; font-size: 13px; white-space: nowrap; }
  .fasi .stato-btn { flex-wrap: wrap; }
  .info-voce .vl { font-size: 13.5px; }
  /* Tabelle: scorrono da sole dentro il riquadro, la pagina no */
  .tabella-scroll { overflow-x: auto; }
  table.tab-utenti { table-layout: auto; min-width: 720px; }
  table.tab th, table.tab td { padding: 8px 8px; }
  /* Finestre a tutto schermo */
  .sfondo-modale { padding: 6px; }
  .modale { border-radius: 10px; }
  .modale-corpo { padding: 14px 12px; }
  .modale-testa { padding: 12px 12px; }
  .modale-testa h2 { font-size: 16px; }
  .griglia { grid-template-columns: 1fr; }
  .scelta-tipo { grid-template-columns: 1fr; }
  .scelta-chip label { font-size: 12.5px; }
  /* Registro e pacchetti */
  .pacchetti { gap: 6px; }
  .pacchetti select { max-width: 100%; }
  /* Documenti */
  .doc .dett { gap: 2px 8px; font-size: 12px; }
  .doc .az-doc { gap: 4px; }
  .doc .az-doc .btn { padding: 5px 8px; font-size: 12px; }
  .galleria { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); }
  .file-riga { grid-template-columns: 32px 1fr auto; }
  .zip-tab td:nth-child(2) { min-width: 200px; }
  /* Avvisi a tendina e brindisi */
  #brindisi { left: 8px; right: 8px; max-width: none; }
}
@media (max-width: 420px) {
  .filtri { grid-template-columns: 1fr; }
  .kpi-griglia { grid-template-columns: 1fr 1fr; }
  .menu button { padding: 8px 7px; font-size: 12.5px; }
}
@media (max-width: 720px) { .btn { white-space: normal; text-align: center; } #doc-nuovo { width: 100%; } }
@media (max-width: 900px) { .layout-pratica > aside { order: 2; } }
.filtri-toggle { display: none; }
@media (max-width: 720px) {
  .filtri-toggle { display: inline-flex; margin-bottom: 10px; }
  .filtri.chiusi { display: none; }
}

/* ===================================================== v1.9.1 — telefono: menu a pulsanti, logo visibile al buio, tabelle a schede */
.menu .mi { display: none; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .barra-alta .marchio { background: #fff; padding: 4px 8px; border-radius: 8px; } }
:root[data-theme="dark"] .barra-alta .marchio { background: #fff; padding: 4px 8px; border-radius: 8px; }
@media (max-width: 720px) {
  .menu { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; padding: 8px 8px; background: var(--superficie); }
  .menu button { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; padding: 7px 2px; font-size: 10.5px; font-weight: 600; line-height: 1.15; text-align: center;
    border: 1px solid var(--linea); border-radius: 10px; background: var(--superficie-2); color: var(--testo); white-space: normal; min-height: 54px; position: relative; }
  .menu button .mi { display: block; font-size: 18px; line-height: 1; }
  .menu button.attivo { background: var(--blu); border-color: var(--blu); color: #fff; }
  .menu button[data-pag="scadenze"] { color: var(--rosso); }
  .menu button[data-pag="scadenze"].attivo { background: var(--rosso); border-color: var(--rosso); color: #fff; }
  .menu button:hover { color: inherit; }
  .menu .conta { position: absolute; top: -5px; right: -4px; border: 2px solid var(--superficie); }
  .menu button[hidden] { display: none !important; }
  /* Tabelle trasformate in schede: niente scorrimento laterale */
  .schede-mobile .scheda-riga { border: 1px solid var(--linea); border-radius: 10px; background: var(--superficie); padding: 10px 12px; margin-bottom: 8px; }
  .schede-mobile .scheda-riga .sr { display: grid; grid-template-columns: 96px 1fr; gap: 3px 8px; padding: 4px 0; border-bottom: 1px dashed var(--linea); font-size: 13.5px; align-items: start; }
  .schede-mobile .scheda-riga .sr:last-child { border-bottom: none; }
  .schede-mobile .scheda-riga .sr .se { font-size: 10.5px; text-transform: uppercase; letter-spacing: .4px; color: var(--testo-2); font-weight: 700; padding-top: 3px; }
  .schede-mobile .scheda-riga .sr .sv { min-width: 0; overflow-wrap: anywhere; }
  .schede-mobile .scheda-riga .sr.azioni-scheda { display: flex; flex-wrap: wrap; gap: 6px; padding-top: 8px; }
  .schede-mobile .scheda-riga .sr.azioni-scheda .btn, .schede-mobile .scheda-riga .sr.azioni-scheda .btn-icona { width: auto; margin: 0; }
  .schede-mobile .scheda-riga.cliccabile { cursor: pointer; }
}

/* v1.9.3 — telefono: blocco vero dello scorrimento laterale (anche su iPhone) e tab del posizione a capo */
@media (max-width: 720px) {
  html, body { overflow-x: clip; position: relative; width: 100%; }
  #schermata-app { overflow-x: clip; position: relative; width: 100%; }
  .contenuto { overflow-x: clip; }
  .tab-pratica { flex-wrap: wrap; overflow: visible; gap: 4px; padding: 4px 0; }
  .tab-pratica button { flex: 1 1 30%; white-space: normal; padding: 8px 6px; font-size: 12.5px; border: 1px solid var(--linea); border-radius: 8px; background: var(--superficie-2); justify-content: center; }
  .tab-pratica button.attivo { background: var(--blu); color: #fff; border-color: var(--blu); }
  .tab-pratica button .n { background: rgba(255,255,255,.25); }
  .posizione .scad-legali .sl { grid-template-columns: 40px 1fr auto; }
  .kpi-griglia .kpi .valore { font-size: 22px; }
}

/* ===================================================== v1.9.5 — menu a pulsanti anche sul computer; profilo sul telefono; niente zoom automatico */
.menu .mi { display: block; font-size: 17px; line-height: 1; }
.menu { display: flex; gap: 6px; padding: 8px 12px; overflow: visible; }
.menu button { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; padding: 7px 4px; font-size: 12px; font-weight: 600; line-height: 1.15; text-align: center;
  border: 1px solid var(--linea); border-bottom: 1px solid var(--linea); border-radius: 10px; background: var(--superficie-2); color: var(--testo); white-space: normal; min-height: 56px; position: relative; }
.menu button:hover { color: var(--blu); border-color: var(--blu); }
.menu button.attivo { background: var(--blu); border-color: var(--blu); color: #fff; }
.menu button[data-pag="scadenze"] { color: var(--rosso); }
.menu button[data-pag="scadenze"].attivo { background: var(--rosso); border-color: var(--rosso); color: #fff; }
.menu .conta { position: absolute; top: -6px; right: -4px; border: 2px solid var(--superficie); }
.menu button[hidden] { display: none !important; }
#btn-profilo-mobile { display: none; }
@media (max-width: 720px) {
  #btn-profilo-mobile:not([hidden]) { display: inline-block; padding: 7px 9px; font-size: 15px; }
  /* niente zoom automatico di Safari quando si tocca un campo: i campi sono grandi almeno 16px */
  input, select, textarea, .campo input, .campo select, .campo textarea, .box-login .campo input { font-size: 16px !important; }
  .menu { grid-template-columns: repeat(4, 1fr); }
}
.faceid-invito { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; background: color-mix(in srgb, var(--acqua) 12%, var(--superficie)); border: 1px solid var(--acqua); border-radius: 10px; padding: 10px 12px; margin-bottom: 14px; font-size: 13.5px; }

/* ===================================================== v1.10.0 — veste grafica più moderna (angoli morbidi, pillole, ombre leggere) */
:root { --raggio: 14px; --ombra: 0 6px 18px rgba(11,46,158,.10), 0 1px 3px rgba(11,46,158,.06); --ombra-alta: 0 16px 36px rgba(11,46,158,.18); --linea: #e3e9f4; --sfondo: #edf2fb; --bordo-attivo: #c9d6f7; --bordo-attivo-rosso: #f3c7c7; }
/* Sfondo: azzurro chiarissimo sfumato verso gli angoli (acqua in alto a destra, blu in basso a sinistra) */
body { background: #eef3fc; }
body::before { content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(1100px 640px at 102% -8%, rgba(21,71,214,.42), rgba(20,190,224,.22) 40%, transparent 66%),
    radial-gradient(1000px 620px at -8% 106%, rgba(11,46,158,.46), rgba(21,71,214,.18) 45%, transparent 66%),
    radial-gradient(700px 420px at 55% 50%, rgba(15,192,170,.06), transparent 65%),
    linear-gradient(180deg, #e9effb 0%, #f0f4fd 55%, #ecf2fc 100%); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) body { background: #0d1420; } :root:not([data-theme="light"]) body::before { background: radial-gradient(1100px 640px at 102% -8%, rgba(21,71,214,.30), rgba(20,190,224,.10) 40%, transparent 66%), radial-gradient(1000px 620px at -8% 106%, rgba(11,46,158,.42), rgba(21,71,214,.14) 45%, transparent 66%), linear-gradient(180deg, #0c1220, #0f1523); } }
:root[data-theme="dark"] body { background: #0d1420; }
:root[data-theme="dark"] body::before { background: radial-gradient(1100px 640px at 102% -8%, rgba(21,71,214,.30), rgba(20,190,224,.10) 40%, transparent 66%), radial-gradient(1000px 620px at -8% 106%, rgba(11,46,158,.42), rgba(21,71,214,.14) 45%, transparent 66%), linear-gradient(180deg, #0c1220, #0f1523); }
#schermata-login, #schermata-reimposta { position: relative; z-index: 0; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --ombra: 0 6px 18px rgba(0,0,0,.45), 0 1px 3px rgba(0,0,0,.3); --ombra-alta: 0 16px 36px rgba(0,0,0,.6); --linea: #2a3441; --sfondo: #0f141b; --bordo-attivo: #34497f; --bordo-attivo-rosso: #6b3a36; } }
:root[data-theme="dark"] { --ombra: 0 6px 18px rgba(0,0,0,.45), 0 1px 3px rgba(0,0,0,.3); --ombra-alta: 0 16px 36px rgba(0,0,0,.6); --linea: #2a3441; --sfondo: #0f141b; --bordo-attivo: #34497f; --bordo-attivo-rosso: #6b3a36; }
body { letter-spacing: -.005em; }
/* Intestazione: linea sfumata blu → acqua, ricerca a pillola */
.barra-alta { border-bottom: none; box-shadow: 0 1px 0 var(--linea), 0 4px 16px rgba(11,46,158,.06); position: sticky; }
.schede-mobile .scheda-riga, .fase .corpo, .file-riga, .msg, .zona-carica, .logo-box, .riga-default, .anteprima-fasi { box-shadow: var(--ombra); }
.fase .corpo { border: none; }
.barra-alta::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; background: linear-gradient(90deg, #0b2e9e, #0fc0aa 60%, #14bee0); pointer-events: none; }
.barra-alta .cerca { border-radius: 999px; padding: 0 16px; height: 40px; flex: 0 1 360px; min-width: 200px; background: var(--sfondo); border-color: transparent; }
.barra-alta .esci, .campanella, button.utente-info { border-radius: 999px; }
#btn-avviso { border-radius: 999px; background: linear-gradient(135deg, #0b2e9e, #1547d6); border: none; }
@media (min-width: 721px) { .barra-alta { height: 64px; } .menu { top: 64px; } }
/* Menu: pillole chiare con icona in un riquadro, voce attiva con sottolineatura acqua */
.menu { gap: 8px; padding: 10px 14px; background: transparent; border-bottom: none; }
.menu button { background: var(--superficie); border: 1px solid var(--linea); border-radius: 12px; min-height: 60px; font-size: 12.5px; color: var(--testo-2); box-shadow: var(--ombra); transition: box-shadow .15s, transform .06s, border-color .15s; }
.menu button .mi { width: 30px; height: 30px; border-radius: 9px; background: var(--sfondo); display: grid; place-items: center; font-size: 16px; }
.menu button:hover { color: var(--blu); border-color: var(--bordo-attivo); }
.menu button.attivo { background: var(--superficie); color: var(--blu); border-color: var(--bordo-attivo); box-shadow: inset 0 -3px 0 var(--acqua), var(--ombra); }
.menu button.attivo .mi { background: var(--blu-bg); }
.menu button[data-pag="scadenze"] { color: var(--rosso); }
.menu button[data-pag="scadenze"]:hover { border-color: var(--bordo-attivo-rosso); }
.menu button[data-pag="scadenze"].attivo { background: var(--superficie); color: var(--rosso); border-color: var(--bordo-attivo-rosso); box-shadow: inset 0 -3px 0 var(--rosso), var(--ombra); }
.menu button[data-pag="scadenze"] .mi, .menu button[data-pag="scadenze"].attivo .mi { background: var(--rosso-bg); }
/* Titoli */
.titolo-pagina h1 { font-size: 24px; letter-spacing: -.02em; }
.titolo-pagina .sub { font-size: 13.5px; }
/* Pulsanti */
.btn { border-radius: 10px; }
.btn-primario { background: linear-gradient(135deg, #0b2e9e, #1547d6); color: #fff; box-shadow: 0 4px 12px rgba(11,46,158,.22); border: none; }
.btn-primario:hover { filter: none; box-shadow: 0 6px 16px rgba(11,46,158,.3); transform: translateY(-1px); }
.btn-chiaro { background: var(--superficie); border-color: var(--linea); box-shadow: var(--ombra); }
.btn-acqua { background: linear-gradient(135deg, #0fc0aa, #14bee0); color: #052b26; border: none; }
.box-login .btn-primario { background: linear-gradient(135deg, #0b2e9e, #1547d6); }
/* Schede */
.card { border: none; border-radius: 16px; }
.card-testa { padding: 14px 18px 14px 32px; position: relative; }
.card-testa::before { content: ""; position: absolute; left: 16px; top: 50%; transform: translateY(-50%); width: 8px; height: 8px; border-radius: 50%; background: var(--acqua); }
/* KPI: numero grande, barra colorata a sinistra */
.kpi { border: none; border-left: none; border-radius: 16px; padding: 16px 18px; position: relative; overflow: hidden; }
.kpi::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 5px; background: var(--blu-chiaro); }
.kpi.rosso::before { background: var(--rosso); } .kpi.giallo::before { background: var(--giallo); } .kpi.viola::before { background: var(--viola); } .kpi.verde::before { background: var(--verde); } .kpi.acqua::before { background: var(--acqua); }
.kpi .etichetta { font-size: 11px; letter-spacing: .6px; }
.kpi .valore { font-size: 34px; letter-spacing: -.03em; margin: 2px 0; }
.kpi .nota { font-size: 12.5px; }
/* Scadenze: la data come foglietto di calendario */
.riga-scad { border: none; border-left: none; border-radius: 14px; padding: 10px 14px; gap: 2px 14px; }
.riga-scad.scaduta { background: var(--superficie); }
.rs-quando { background: var(--sfondo); border-right: none; border-radius: 12px; padding: 6px 4px 8px; text-align: center; min-width: 58px; overflow: hidden; border-top: 4px solid var(--blu-chiaro); }
.riga-scad.scaduta .rs-quando, .riga-scad.urgente .rs-quando { border-top-color: var(--rosso); }
.riga-scad.presto .rs-quando { border-top-color: var(--giallo); }
.riga-scad.ok .rs-quando { border-top-color: var(--acqua); }
.rs-quando .giorno { font-size: 22px; }
.conto { border-radius: 999px; padding: 4px 10px; }
/* Posizioni: cartellina più morbida */
.posizione { border: none; border-radius: 16px; margin-top: 34px; transition: box-shadow .15s, transform .15s; }
.posizione::before { width: 6px; border-radius: 16px 0 0 16px; }
.posizione .linguetta { border-radius: 12px 12px 0 0; border: none; background: var(--superficie); box-shadow: 0 -2px 8px rgba(11,46,158,.05); padding: 7px 16px; }
.posizione .linguetta::after { display: none; }
.posizione:hover { transform: translateY(-2px); box-shadow: var(--ombra-alta); }
.posizione .tit { font-size: 16px; }
.posizione .scad-legali { border-left: none; background: var(--sfondo); border-radius: 0 16px 16px 0; }
@media (max-width: 900px) { .posizione .scad-legali { border-radius: 0 0 16px 16px; } }
.badge { border-radius: 999px; padding: 3px 9px; font-size: 10.5px; letter-spacing: .4px; }
.cartella { font-size: 11.5px; letter-spacing: .8px; }
/* Scheda posizione */
.testa-pratica { border: none; border-radius: 18px; padding: 20px 22px; background: linear-gradient(180deg, var(--superficie), var(--superficie) 60%, var(--superficie-2)); }
.testa-pratica.chiuso, .testa-pratica.sospeso { border-left-width: 6px; border-left-style: solid; }
.testa-pratica h1 { font-size: 24px; letter-spacing: -.02em; }
.tab-pratica { background: var(--superficie); border-radius: 12px; padding: 4px; box-shadow: var(--ombra); border-bottom: none; gap: 2px; }
.tab-pratica button { border-radius: 9px; border: none; border-bottom: none; padding: 9px 14px; background: transparent; }
.tab-pratica button.attivo { background: var(--blu-bg); color: var(--blu); border-bottom: none; }
.tab-pratica button.attivo .n { background: var(--superficie); color: var(--blu); }
.fase { border-radius: 14px; }
.fase .corpo { border-radius: 12px; }
.fase.corrente .corpo { box-shadow: 0 0 0 2px var(--blu-bg); }
.info-voce .et { letter-spacing: .6px; }
/* Filtri e campi */
.filtri { border: none; border-radius: 16px; }
.campo input, .campo select, .campo textarea { border-radius: 10px; border-color: var(--linea); background: var(--sfondo); }
.campo input:focus, .campo select:focus, .campo textarea:focus { background: var(--superficie); border-color: var(--acqua); box-shadow: 0 0 0 3px rgba(15,192,170,.18); }
.box-login .campo input { background: #fff; }
.segmenti { border-radius: 10px; border-color: var(--linea); }
/* Vuoti */
.vuoto { padding: 28px 16px; }
.vuoto::before { content: "◌"; display: block; font-size: 28px; color: var(--acqua); margin-bottom: 6px; }
/* Documenti */
.doc { border: none; border-radius: 12px; box-shadow: var(--ombra); }
.doc .icona { border-radius: 10px; background: var(--sfondo); border: none; }
.doc.bozza { border: 1.5px dashed var(--viola); }
.doc.email { border-left: 4px solid var(--ciano); }
.doc.email.pec { border-left-color: var(--viola); }
/* Finestre */
.modale { border-radius: 20px; }
.modale-testa h2 { letter-spacing: -.01em; }
.avviso, .zona-carica, .box-ai, .ai-avvio, .faceid-invito, .bozze-avviso, .msg, .risultato-termine { border-radius: 12px; }
/* Telefono: stesse pillole, misure compatte */
@media (max-width: 720px) {
  .menu { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; padding: 8px 8px; background: transparent; }
  .menu button { min-height: 58px; font-size: 10.5px; padding: 6px 3px; }
  .menu button .mi { width: 28px; height: 28px; font-size: 16px; }
  .kpi { padding: 12px 12px; }
  .kpi .valore { font-size: 26px; }
  .kpi-griglia .kpi .valore { font-size: 26px; }
  .riga-scad { grid-template-columns: 62px 1fr; }
  .tab-pratica { padding: 4px; gap: 4px; }
  .tab-pratica button { border: none; background: transparent; border-radius: 9px; white-space: nowrap; flex: 1 1 auto; }
  .tab-pratica .n { white-space: nowrap; }
  .tab-pratica button.attivo { background: var(--blu-bg); color: var(--blu); }
  .tab-pratica button .n { background: var(--linea); }
  .tab-pratica button.attivo .n { background: var(--superficie); color: var(--blu); }
  .modale { border-radius: 16px; }
  .titolo-pagina h1 { font-size: 21px; }
  .testa-pratica { padding: 14px 14px; border-radius: 16px; }
  .testa-pratica h1 { font-size: 19px; }
  .posizione { margin-top: 32px; }
  .schede-mobile .scheda-riga { border: none; border-radius: 14px; box-shadow: var(--ombra); }
}

/* v1.10.2 — telefono: l'intestazione sta sempre dentro lo schermo (il logo si restringe, i pulsanti no) */
@media (max-width: 720px) {
  .barra-alta { padding: 0 10px; gap: 6px; }
  .barra-alta .marchio { flex: 1 1 auto; min-width: 0; max-width: 44%; display: flex; align-items: center; }
  .barra-alta .marchio img { height: auto; max-height: 30px; width: auto; max-width: 100%; object-fit: contain; }
  .barra-alta .spazio { flex: 1 1 0; min-width: 0; }
  .barra-alta .esci, .campanella, #btn-profilo-mobile:not([hidden]), #btn-avviso { flex: 0 0 auto; }
  .barra-alta .esci { padding: 7px 10px; }
  #btn-avviso, #btn-profilo-mobile:not([hidden]) { padding: 7px 8px; }
  .campanella { width: 34px; height: 34px; }
}
@media (max-width: 380px) {
  .barra-alta .marchio { max-width: 38%; }
  .barra-alta .esci { padding: 7px 8px; font-size: 12px; }
}

/* v1.10.3 — telefono: pulsanti del menu più bassi */
@media (max-width: 720px) {
  .menu { padding: 6px 8px; gap: 5px; }
  .menu button { min-height: 46px; padding: 4px 2px 5px; gap: 2px; font-size: 10px; line-height: 1.1; border-radius: 10px; }
  .menu button .mi { width: 24px; height: 24px; font-size: 14px; border-radius: 7px; }
  .menu .conta { top: -5px; right: -3px; font-size: 9.5px; }
}

/* v1.10.4 — filtri: le tendine restano allineate anche se sotto una c'è una scrittina di aiuto */
.filtri { align-items: start; }
.filtri .campo label { min-height: 18px; }
.filtri .campo .aiuto { margin-top: 4px; line-height: 1.3; }
.filtri .azioni { margin-top: 23px; }
@media (max-width: 720px) { .filtri .azioni { margin-top: 0; } }

/* v1.11.0 — da che parte stiamo: etichette, gruppi di modelli, riepilogo nel cruscotto */
.badge.lato.promosso { background: #e3f6f2; color: #0b6b5c; }
.badge.lato.subito { background: #fdecea; color: #a0301f; }
.badge.lato.autorita { background: #eceff5; color: #3b4a63; }
.badge.lato.nessuno { background: var(--linea); color: var(--testo-2); }
.gruppo-lato { margin-bottom: 14px; }
.gruppo-lato-titolo { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .6px; color: var(--testo-2); margin-bottom: 7px; display: flex; align-items: center; gap: 8px; }
.gruppo-lato-titolo::after { content: ""; flex: 1; height: 1px; background: var(--linea); }
.gruppo-lato.subito .gruppo-lato-titolo { color: #a0301f; }
.gruppo-lato.promosso .gruppo-lato-titolo { color: #0b6b5c; }
.gruppo-lato.autorita .gruppo-lato-titolo { color: #3b4a63; }
.lati-riepilogo { display: grid; gap: 8px; }
.lato-voce { display: grid; grid-template-columns: 44px 1fr auto; gap: 10px; align-items: center; text-decoration: none; color: var(--testo); border-radius: 12px; padding: 8px 10px; background: var(--sfondo); transition: box-shadow .15s; }
.lato-voce:hover { box-shadow: var(--ombra); }
.lato-voce .n { font-size: 22px; font-weight: 800; text-align: center; }
.lato-voce .v { font-size: 12.5px; color: var(--testo-2); }
.lato-voce.promosso .n { color: #0b6b5c; } .lato-voce.subito .n { color: #a0301f; } .lato-voce.autorita .n { color: #3b4a63; }

/* v1.11.0 — telefono: le finestre (es. Calcola un termine) non sbordano e non si spostano col dito */
@media (max-width: 720px) {
  .sfondo-modale { overflow-x: hidden; padding: 6px; }
  .modale { max-width: 100%; overflow-x: hidden; }
  .modale-corpo, .modale-corpo > * , .modale-corpo .campo, .modale-corpo .griglia, .modale-corpo .griglia-2 { max-width: 100%; min-width: 0; }
  .campo input[type=date], .campo input[type=time], .campo input[type=datetime-local], .campo input[type=month],
  input[type=date], input[type=time], input[type=datetime-local] { display: block; width: 100%; max-width: 100%; min-width: 0; -webkit-appearance: none; appearance: none; box-sizing: border-box; text-align: left; }
  input[type=date]::-webkit-date-and-time-value, input[type=time]::-webkit-date-and-time-value { text-align: left; }
  .modale-corpo .risultato-termine .grande { font-size: 22px; overflow-wrap: anywhere; }
  .modale-corpo label.interruttore { align-items: flex-start; }
}

/* v1.11.1 — gruppi di modelli evidenziati con un riquadro ovale colorato e titolo a pillola */
.gruppo-lato { border: 2px solid var(--linea); border-radius: 22px; padding: 14px 14px 12px; margin-bottom: 14px; background: var(--superficie-2); position: relative; }
.gruppo-lato-titolo { display: inline-flex; align-items: center; gap: 6px; margin: -26px 0 10px 4px; padding: 5px 14px; border-radius: 999px; background: var(--testo-2); color: #fff; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .6px; box-shadow: var(--ombra); }
.gruppo-lato-titolo::after { display: none; }
.gruppo-lato.subito { border-color: #e0736a; background: #fff6f5; }
.gruppo-lato.subito .gruppo-lato-titolo { background: #c0392b; color: #fff; }
.gruppo-lato.promosso { border-color: #22b39d; background: #f1fbf9; }
.gruppo-lato.promosso .gruppo-lato-titolo { background: #0b8f7a; color: #fff; }
.gruppo-lato.autorita { border-color: #7f8fb0; background: #f3f5fa; }
.gruppo-lato.autorita .gruppo-lato-titolo { background: #3b4a63; color: #fff; }
.gruppo-lato.nessuno { border-color: #c9d0da; background: #f7f8fb; }
.gruppo-lato.nessuno .gruppo-lato-titolo { background: #6b7a8c; color: #fff; }
.gruppo-lato .scelta-tipo label { background: var(--superficie); }
.gruppo-lato + .gruppo-lato { margin-top: 26px; }
.sezione-form .gruppo-lato:first-of-type { margin-top: 22px; }
:root[data-theme="dark"] .gruppo-lato.subito { background: #2a1d1c; } :root[data-theme="dark"] .gruppo-lato.promosso { background: #14302b; } :root[data-theme="dark"] .gruppo-lato.autorita { background: #1c2130; } :root[data-theme="dark"] .gruppo-lato.nessuno { background: #1d2530; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .gruppo-lato.subito { background: #2a1d1c; } :root:not([data-theme="light"]) .gruppo-lato.promosso { background: #14302b; } :root:not([data-theme="light"]) .gruppo-lato.autorita { background: #1c2130; } :root:not([data-theme="light"]) .gruppo-lato.nessuno { background: #1d2530; } }

/* ===================================================== ENOVA FISCALE v1.0 — posizioni, piani, rate, società */
.kpi .valore small { font-size: 15px; font-weight: 700; color: var(--testo-2); letter-spacing: 0; }
.barra-riga { grid-template-columns: 190px 1fr 96px; }
.barra-riga .etich { display: flex; gap: 6px; align-items: center; }
.barra-riga .traccia { display: flex; }
.barra-riga .riemp { border-radius: 0; }
.barra-riga .riemp:first-child { border-radius: 5px 0 0 5px; } .barra-riga .riemp:last-child { border-radius: 0 5px 5px 0; }
.barra-riga.cliccabile { cursor: pointer; }
.legenda { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12px; color: var(--testo-2); margin-top: 12px; }
.legenda i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 5px; vertical-align: middle; }
/* Ente: pillola con puntino colorato (usa la classe .badge.cls già esistente) */
.ente { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 700; border: 1px solid var(--linea-2); border-radius: 999px; padding: 1px 8px; color: var(--testo-2); white-space: nowrap; }
/* Cartelline delle posizioni (stessa forma dei fascicoli di ENOVA LEGALE, con la colonna importi a destra) */
.posizione { position: relative; margin: 34px 0 14px; background: var(--superficie); border-radius: 0 16px 16px 16px; box-shadow: var(--ombra); display: grid; grid-template-columns: 1fr 340px; cursor: pointer; transition: box-shadow .15s, transform .15s; }
.posizione:hover { transform: translateY(-2px); box-shadow: var(--ombra-alta); }
.posizione::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 6px; background: var(--blu-chiaro); border-radius: 16px 0 0 16px; }
.posizione.rossa::before { background: var(--rosso); } .posizione.gialla::before { background: var(--giallo); } .posizione.verde::before { background: var(--verde); } .posizione.viola::before { background: var(--viola); } .posizione.acqua::before { background: var(--acqua); }
.posizione.chiusa { opacity: .8; }
.posizione .linguetta { position: absolute; top: -28px; left: 0; height: 29px; background: var(--superficie); border-radius: 12px 12px 0 0; padding: 7px 16px; font-size: 12.5px; font-weight: 800; letter-spacing: .3px; display: flex; align-items: center; gap: 8px; color: var(--testo); max-width: calc(100% - 20px); white-space: nowrap; box-shadow: 0 -2px 8px rgba(11,46,158,.05); }
.posizione .linguetta .data { color: var(--testo-2); font-weight: 600; font-variant-numeric: tabular-nums; }
.posizione .corpo { padding: 14px 16px 14px 20px; min-width: 0; }
.posizione .tit { font-weight: 700; font-size: 16px; text-wrap: balance; margin-bottom: 6px; }
.posizione .riga-meta { font-size: 13px; color: var(--testo-2); display: flex; flex-wrap: wrap; gap: 3px 14px; align-items: center; }
.posizione .riga-meta b { color: var(--testo); font-weight: 600; }
.posizione .riga-stato { margin-top: 10px; display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.posizione .lato { background: var(--sfondo); padding: 12px 14px; border-radius: 0 16px 16px 0; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.posizione .lato .et { font-size: 10.5px; text-transform: uppercase; letter-spacing: .6px; color: var(--testo-2); font-weight: 800; }
.importi { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 10px; }
.importi .v { font-size: 12px; color: var(--testo-2); }
.importi .v b { display: block; font-size: 16px; color: var(--testo); font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.importi .v.residuo b { color: var(--blu); }
.progresso { height: 8px; background: var(--linea); border-radius: 4px; overflow: hidden; display: flex; }
.progresso i { display: block; height: 100%; background: var(--acqua); }
.progresso i.rosso { background: var(--rosso); } .progresso i.giallo { background: var(--giallo); }
.progresso-testo { font-size: 12px; color: var(--testo-2); display: flex; justify-content: space-between; gap: 8px; font-variant-numeric: tabular-nums; flex-wrap: wrap; }
.prossima { display: grid; grid-template-columns: 44px 1fr auto; gap: 8px; align-items: center; font-size: 12.5px; padding-top: 6px; border-top: 1px dashed var(--linea); }
.prossima .d { font-weight: 800; color: var(--blu); } .prossima.urg .d { color: var(--giallo); } .prossima.scad .d { color: var(--rosso); }
.prossima .t { min-width: 0; overflow-wrap: anywhere; } .prossima .e { font-weight: 800; font-variant-numeric: tabular-nums; }
@media (max-width: 900px) { .posizione { grid-template-columns: 1fr; } .posizione .lato { border-radius: 0 0 16px 16px; } }
/* Scheda: riquadri degli importi */
.riepilogo-importi { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin-bottom: 18px; }
.ri { background: var(--superficie); border-radius: 14px; padding: 12px 14px; box-shadow: var(--ombra); min-width: 0; }
.ri .e { font-size: 10.5px; text-transform: uppercase; letter-spacing: .6px; color: var(--testo-2); font-weight: 800; }
.ri .v { font-size: 20px; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; margin-top: 2px; overflow-wrap: anywhere; }
.ri.blu .v { color: var(--blu); } .ri.verde .v { color: var(--verde); } .ri.rosso .v { color: var(--rosso); } .ri.grigio .v { color: var(--testo-2); }
.ri .s { font-size: 11.5px; color: var(--testo-2); }
.regola { background: var(--blu-bg); border-radius: 12px; padding: 12px 14px; font-size: 13.5px; display: flex; gap: 10px; align-items: flex-start; margin-bottom: 14px; }
.regola b { color: var(--blu); } .regola .ico { font-size: 18px; line-height: 1.2; }
.regola.gialla { background: var(--giallo-bg); } .regola.gialla b { color: var(--giallo); }
.regola.rossa { background: var(--rosso-bg); } .regola.rossa b { color: var(--rosso); }
.decadenza { display: inline-flex; gap: 4px; align-items: center; flex-wrap: wrap; }
.decadenza i { width: 16px; height: 10px; border-radius: 3px; background: var(--linea); display: inline-block; }
.decadenza i.saltata { background: var(--rosso); }
.decadenza small { font-size: 11.5px; color: var(--testo-2); margin-left: 4px; white-space: nowrap; }
.doc.f24 { border-left: 4px solid var(--verde); }
/* Società */
.soc-griglia { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.soc { background: var(--superficie); border-radius: 16px; box-shadow: var(--ombra); padding: 16px 18px; cursor: pointer; transition: box-shadow .15s; min-width: 0; }
.soc:hover { box-shadow: var(--ombra-alta); }
.soc .testa { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.soc .testa .nome { font-weight: 700; font-size: 15px; flex: 1; min-width: 0; overflow-wrap: anywhere; }
.soc .testa .nome small { display: block; font-weight: 500; color: var(--testo-2); font-size: 12px; }
.soc .tot { font-size: 26px; font-weight: 800; letter-spacing: -.03em; font-variant-numeric: tabular-nums; color: var(--blu); line-height: 1.1; }
.soc .tot small { font-size: 12px; color: var(--testo-2); font-weight: 600; letter-spacing: 0; display: block; }
.soc .righe { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; margin: 12px 0; font-size: 12px; color: var(--testo-2); }
.soc .righe b { display: block; font-size: 14px; color: var(--testo); font-variant-numeric: tabular-nums; }
.regolarita { display: flex; flex-wrap: wrap; gap: 6px; }
.reg { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 700; border-radius: 999px; padding: 3px 9px; background: var(--linea); color: var(--testo-2); }
.reg.ok { background: var(--verde-bg); color: var(--verde); } .reg.ko { background: var(--rosso-bg); color: var(--rosso); } .reg.att { background: var(--giallo-bg); color: var(--giallo); }
/* Gruppi di tipi di atto per ente nella finestra «Nuova posizione» (stesso stile dei gruppi-lato di ENOVA LEGALE) */
.gruppo-ente { border: 2px solid var(--linea); border-radius: 22px; padding: 14px 14px 12px; margin: 26px 0 0; background: var(--superficie-2); position: relative; }
.sezione-form .gruppo-ente:first-of-type { margin-top: 22px; }
.gruppo-ente-titolo { display: inline-flex; align-items: center; gap: 6px; margin: -26px 0 10px 4px; padding: 5px 14px; border-radius: 999px; background: var(--testo-2); color: #fff; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .6px; box-shadow: var(--ombra); }
.gruppo-ente .scelta-tipo label { background: var(--superficie); }
.gruppo-ente.ader { border-color: #7f96d6; background: #f3f6fd; } .gruppo-ente.ader .gruppo-ente-titolo { background: #0b2e9e; }
.gruppo-ente.ae { border-color: #5fcfe4; background: #f1fbfd; } .gruppo-ente.ae .gruppo-ente-titolo { background: #0b8fa8; }
.gruppo-ente.inps { border-color: #7fc39a; background: #f2faf5; } .gruppo-ente.inps .gruppo-ente-titolo { background: #2e8b57; }
.gruppo-ente.adm { border-color: #e6a46a; background: #fef7f0; } .gruppo-ente.adm .gruppo-ente-titolo { background: #c2670f; }
.gruppo-ente.comune { border-color: #b39ae8; background: #f8f4fe; } .gruppo-ente.comune .gruppo-ente-titolo { background: #6d28d9; }
.gruppo-ente.def { border-color: #22b39d; background: #f1fbf9; } .gruppo-ente.def .gruppo-ente-titolo { background: #0b8f7a; }
:root[data-theme="dark"] .gruppo-ente { background: var(--superficie-2) !important; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .gruppo-ente { background: var(--superficie-2) !important; } }
.rs-destra .euro { font-size: 15px; font-weight: 800; font-variant-numeric: tabular-nums; }
.zip-tab input.r-imp, .zip-tab input.r-data { min-width: 0; }
#pi-tab input { padding: 6px 8px; font-size: 13px; min-width: 110px; }
@media (max-width: 720px) {
  .menu { grid-template-columns: repeat(3, 1fr); }
  .barra-riga { grid-template-columns: 110px 1fr 74px; font-size: 12.5px; }
  .riepilogo-importi { grid-template-columns: 1fr 1fr; }
  .ri .v { font-size: 17px; }
  .soc .righe { font-size: 11px; }
  .posizione { margin-top: 32px; }
  .posizione .linguetta { white-space: normal; max-width: 100%; line-height: 1.5; height: auto; top: -30px; }
  .posizione .corpo { padding: 12px 12px 12px 16px; }
  .importi .v b { font-size: 15px; }
}
/* Avvisi brevi (brindisi), caricamento, errori */
#brindisi { position: fixed; left: 50%; bottom: 24px; transform: translate(-50%, 20px); background: #1b2530; color: #fff; padding: 12px 18px; border-radius: 12px; font-size: 14px; font-weight: 600; box-shadow: 0 12px 30px rgba(0,0,0,.28); opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; z-index: 500; max-width: min(720px, calc(100vw - 32px)); text-align: center; }
#brindisi.mostra { opacity: 1; transform: translate(-50%, 0); }
#brindisi.errore { background: #c0392b; }
.caricamento { padding: 40px; text-align: center; color: var(--testo-2); }
.avviso.errore { background: var(--rosso-bg); color: var(--rosso); }
.testa-pratica { grid-template-columns: minmax(0, 1fr) minmax(260px, 44%); }
.testa-pratica .azioni { align-content: flex-start; }
@media (max-width: 900px) { .testa-pratica { grid-template-columns: 1fr; } }
.persona { grid-template-columns: 40px 1fr auto; }
.persona > .az { justify-self: start; }
.barra-riga .etich { white-space: normal; line-height: 1.2; overflow: visible; }