/* GestAdmin, foglio di stile 2.0 (20/10/2026): palette grigio, blu e bianco perla.
   Tutte le classi usate dalle viste restano valide; nessuno stile in linea (CSP). */

:root {
  --perla: #f5f6f8;
  --perla-scura: #eceef2;
  --bianco: #ffffff;
  --grigio-100: #e9ecf0;
  --grigio-200: #d9dee5;
  --grigio-300: #c3cad4;
  --grigio-400: #98a2b0;
  --grigio-600: #5c6775;
  --grigio-800: #2a3340;
  --blu-50: #eef4fb;
  --blu-100: #dce8f6;
  --blu-200: #b9d0ec;
  --blu-400: #4a86c8;
  --blu-500: #2e6cb0;
  --blu-700: #1d4e86;
  --blu-900: #0f2b4c;
  --rosso: #b3261e;
  --rosso-chiaro: #fbe9e7;
  --verde: #1e7a4c;
  --verde-chiaro: #e6f4ec;
  --ambra: #9a6700;
  --ambra-chiaro: #fff4d6;
  --testo: #1f2630;
  --ombra-1: 0 1px 2px rgba(15, 43, 76, .06), 0 1px 3px rgba(15, 43, 76, .08);
  --ombra-2: 0 6px 18px rgba(15, 43, 76, .10), 0 2px 6px rgba(15, 43, 76, .06);
  --raggio: 10px;
  --raggio-s: 6px;
  --transizione: 160ms ease;
  /* alias per il codice esistente */
  --blu: var(--blu-700);
  --grigio: var(--grigio-100);
  --giallo: var(--ambra-chiaro);
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 15px; line-height: 1.5; color: var(--testo); background: var(--perla);
}
a { color: var(--blu-500); text-decoration: none; transition: color var(--transizione); }
a:hover { color: var(--blu-700); text-decoration: underline; text-underline-offset: 2px; }
h2 { font-size: 1.45rem; font-weight: 650; letter-spacing: -.01em; color: var(--blu-900); margin: 0 0 1rem; padding-left: .8rem; position: relative; }
h2::before { content: ""; position: absolute; left: 0; top: .25em; bottom: .25em; width: 4px; border-radius: 2px; background: linear-gradient(180deg, var(--blu-400), var(--blu-700)); }
h3 { font-size: 1.05rem; font-weight: 650; color: var(--grigio-800); margin: 1.4rem 0 .6rem; }
code { font-family: "SF Mono", Menlo, Consolas, monospace; font-size: .86em; background: var(--grigio-100); padding: .05rem .35rem; border-radius: 4px; color: var(--grigio-800); }
small { color: var(--grigio-600); }

/* ---------- Cornice ---------- */
.banner { background: var(--blu-900); color: var(--blu-200); font-size: .78rem; letter-spacing: .02em; text-align: center; padding: .3rem 1rem; }
header.testata {
  background: linear-gradient(90deg, var(--blu-900) 0%, var(--blu-700) 60%, var(--blu-500) 100%);
  color: var(--bianco); padding: 0 1.4rem; height: 60px;
  display: flex; justify-content: space-between; align-items: center; box-shadow: var(--ombra-2); position: relative; z-index: 3;
}
header.testata h1 { margin: 0; font-size: 1.15rem; font-weight: 600; letter-spacing: .02em; display: flex; align-items: center; gap: .8rem; }
/* Logo dell'ente (21/10/2026): toro a linee bianche marcate su fondo trasparente, direttamente sulla testata scura. */
header.testata h1 .logo { display: inline-flex; align-items: center; transition: transform var(--transizione); }
header.testata h1 .logo:hover { transform: scale(1.05); text-decoration: none; }
header.testata h1 .logo img { display: block; height: 46px; width: auto; filter: drop-shadow(0 2px 4px rgba(0,0,0,.35)); }
header.testata h1 .sottotitolo { display: inline; margin-left: .7rem; font-size: .7rem; font-weight: 400; color: var(--blu-200); letter-spacing: .08em; text-transform: uppercase; }
form.uscita { margin: 0; display: flex; gap: .9rem; align-items: center; }
form.uscita span { font-size: .88rem; color: var(--blu-100); }
form.uscita .chip {
  display: inline-flex; font-size: .88rem; text-decoration: none; align-items: center; gap: .5rem; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.22);
  padding: .3rem .75rem .3rem .4rem; border-radius: 999px; color: var(--bianco);
}
form.uscita .chip .iniziale { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--bianco); color: var(--blu-700); font-weight: 700; font-size: .85rem; }
form.uscita button { background: transparent; border: 1px solid rgba(255,255,255,.45); color: var(--bianco); }
form.uscita button:hover { background: var(--bianco); color: var(--blu-700); border-color: var(--bianco); }

nav.aree {
  background: var(--bianco); padding: 0 1rem; display: flex; gap: .1rem; align-items: stretch; flex-wrap: nowrap; overflow-x: auto;
  border-bottom: 1px solid var(--grigio-200); box-shadow: var(--ombra-1); position: relative; z-index: 2;
}
nav.aree a {
  position: relative; color: var(--grigio-600); font-weight: 500; font-size: .88rem; padding: .8rem .8rem; white-space: nowrap;
  border-radius: 0; transition: color var(--transizione), background var(--transizione);
}
nav.aree a::after { content: ""; position: absolute; left: .8rem; right: .8rem; bottom: 0; height: 3px; border-radius: 3px 3px 0 0; background: var(--blu-500); transform: scaleX(0); transition: transform var(--transizione); }
nav.aree a:hover { color: var(--blu-700); background: var(--blu-50); text-decoration: none; }
nav.aree a.attiva { color: var(--blu-700); font-weight: 650; }
nav.aree a.attiva::after, nav.aree a:hover::after { transform: scaleX(1); }

.corpo { display: flex; min-height: calc(100vh - 60px - 44px - 24px); }
aside.laterale {
  width: 200px; flex: 0 0 200px; background: var(--perla-scura); border-right: 1px solid var(--grigio-200); padding: 1rem .6rem 1.5rem;
}
aside.laterale h2 { font-size: .72rem; margin: 0 .5rem .7rem; padding: 0; color: var(--grigio-600); text-transform: uppercase; letter-spacing: .12em; font-weight: 700; }
aside.laterale h2::before { display: none; }
aside.laterale ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
aside.laterale li { position: relative; border-radius: var(--raggio-s); transition: background var(--transizione), box-shadow var(--transizione); }
aside.laterale li a { display: block; padding: .42rem .7rem .42rem .9rem; color: var(--grigio-800); font-size: .88rem; line-height: 1.3; border-radius: var(--raggio-s); }
aside.laterale li a:hover { text-decoration: none; color: var(--blu-700); }
aside.laterale li:hover { background: var(--bianco); box-shadow: var(--ombra-1); }
aside.laterale li.attiva { background: var(--bianco); box-shadow: var(--ombra-1); }
aside.laterale li.attiva::before { content: ""; position: absolute; left: 0; top: 6px; bottom: 6px; width: 4px; border-radius: 0 3px 3px 0; background: var(--blu-500); }
aside.laterale li.attiva a { color: var(--blu-700); font-weight: 650; }
aside.laterale li.ni a { color: var(--grigio-400); }
aside.laterale li small { display: block; color: var(--grigio-400); font-size: .68rem; padding: 0 .95rem .4rem; margin-top: -.35rem; letter-spacing: .04em; text-transform: uppercase; }

.corpo main { flex: 1 1 auto; padding: 1.2rem 1.5rem 2rem; min-width: 0; }
main.solo { padding: 2rem 1rem; max-width: 1100px; margin: 0 auto; }
footer { color: var(--grigio-400); font-size: .76rem; padding: .9rem 1rem; text-align: center; border-top: 1px solid var(--grigio-200); background: var(--bianco); }

/* ---------- Avvisi ---------- */
.errore, ul.errori { background: var(--rosso-chiaro); color: var(--rosso); border: 1px solid #f1c3bd; border-left: 4px solid var(--rosso); padding: .7rem .9rem; border-radius: var(--raggio-s); margin: 0 0 1rem; }
ul.errori { padding-left: 1.9rem; }
.avviso { background: var(--ambra-chiaro); color: #5c4300; border: 1px solid #f0dca0; border-left: 4px solid var(--ambra); padding: .7rem .9rem; border-radius: var(--raggio-s); margin: 0 0 1rem; }
.vuoto { color: var(--grigio-400); font-style: italic; }
.nullo { display: none; color: var(--ambra); font-family: "SF Mono", Menlo, Consolas, monospace; font-size: .82em; background: var(--ambra-chiaro); padding: 0 .3rem; border-radius: 3px; font-style: normal; }
code.col { display: none; color: var(--grigio-400); background: transparent; font-weight: 400; font-size: .74em; margin-left: .35rem; letter-spacing: .01em; }

/* ---------- Pulsanti ---------- */
button, .bottone, a.bottone, .azioni a.bottone {
  position: relative; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
  font: inherit; font-size: .9rem; font-weight: 600; line-height: 1.1; padding: .55rem 1rem; border-radius: var(--raggio-s);
  cursor: pointer; text-decoration: none; white-space: nowrap; border: 1px solid transparent;
  transition: background var(--transizione), color var(--transizione), border-color var(--transizione), box-shadow var(--transizione), transform var(--transizione);
}
button::after, .bottone::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,0)); opacity: 0; transition: opacity var(--transizione); pointer-events: none; }
button:hover::after, .bottone:hover::after { opacity: 1; }
button:active, .bottone:active { transform: translateY(1px); }
button:focus-visible, .bottone:focus-visible, a:focus-visible { outline: 3px solid var(--blu-200); outline-offset: 2px; }

button { background: linear-gradient(180deg, var(--blu-500), var(--blu-700)); color: var(--bianco); box-shadow: var(--ombra-1); }
button:hover { background: linear-gradient(180deg, var(--blu-400), var(--blu-500)); box-shadow: var(--ombra-2); color: var(--bianco); transform: translateY(-1px); }
button.secondario { background: var(--grigio-600); }
button.secondario:hover { background: var(--grigio-800); }

.bottone, a.bottone, .azioni a.bottone { background: var(--bianco); color: var(--blu-700); border-color: var(--blu-200); box-shadow: var(--ombra-1); }
.bottone:hover, a.bottone:hover { background: var(--blu-500); color: var(--bianco); border-color: var(--blu-500); text-decoration: none; box-shadow: var(--ombra-2); transform: translateY(-1px); }

button.pericolo, a.bottone.pericolo, .bottone.pericolo { background: var(--bianco); color: var(--rosso); border-color: #e7b3ad; }
button.pericolo:hover, a.bottone.pericolo:hover { background: var(--rosso); color: var(--bianco); border-color: var(--rosso); }
button.piccolo, a.bottone.piccolo, .bottone.piccolo { padding: .3rem .6rem; font-size: .8rem; }
.azioni { display: flex; gap: .55rem; align-items: center; flex-wrap: wrap; margin: .9rem 0; }
.azioni .vuoto { margin-left: .3rem; }
td.azioni-cella a, td a.bottone { margin-right: .35rem; }

/* ---------- Moduli ---------- */
label { display: block; margin: .6rem 0 .25rem; font-weight: 600; font-size: .86rem; color: var(--grigio-800); }
label.inline { display: inline; font-weight: 500; margin-right: 1rem; }
small.aiuto { display: block; color: var(--grigio-600); font-weight: 400; font-size: .78rem; margin-top: .1rem; }
input[type=text], input[type=password], input[type=date], input[type=number], input[type=email], input[type=search], input[type=file], select, textarea {
  width: 100%; padding: .5rem .65rem; border: 1px solid var(--grigio-300); border-radius: var(--raggio-s); font: inherit; font-size: .95rem;
  background: var(--bianco); color: var(--testo); transition: border-color var(--transizione), box-shadow var(--transizione);
}
input:hover, select:hover, textarea:hover { border-color: var(--grigio-400); }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--blu-400); box-shadow: 0 0 0 3px var(--blu-100); }
input[readonly], input[disabled], select[disabled] { background: var(--perla); color: var(--grigio-600); }
input[type=checkbox], input[type=radio] { width: 1rem; height: 1rem; margin-right: .35rem; accent-color: var(--blu-500); vertical-align: -2px; }
textarea { min-height: 6rem; }
.maiuscolo { text-transform: uppercase; }
form.modulo { max-width: 1100px; }
form.modulo fieldset { border: 1px solid var(--grigio-200); border-radius: var(--raggio); padding: .4rem 1.1rem 1.1rem; margin: 0 0 1.1rem; background: var(--bianco); box-shadow: var(--ombra-1); }
form.modulo legend { font-weight: 700; font-size: .8rem; letter-spacing: .1em; text-transform: uppercase; color: var(--blu-700); padding: 0 .5rem; }
.griglia { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: .25rem 1.1rem; }
.griglia .largo { grid-column: 1 / -1; }
.ricerca { display: flex; gap: .7rem; align-items: flex-end; flex-wrap: wrap; background: var(--bianco); border: 1px solid var(--grigio-200); border-radius: var(--raggio); padding: .6rem 1rem 1rem; box-shadow: var(--ombra-1); margin-bottom: 1rem; }
.ricerca > div { flex: 1 1 200px; }
.ricerca > div:last-child { flex: 0 0 auto; display: flex; gap: .6rem; align-items: center; padding-bottom: .15rem; }
.ricerca label { margin-top: .4rem; }
.scelte label { display: block; margin: .2rem 0; font-weight: 500; }

/* ---------- Tabelle ---------- */
/* Le tabelle occupano la larghezza della pagina e i testi vanno a capo; i pulsanti di azione restano su una riga.
   Solo una tabella con moltissime colonne fa scorrere l'area principale in orizzontale. */
.corpo main { overflow-x: auto; }
table { border-collapse: separate; border-spacing: 0; width: 100%; margin-top: .8rem; background: var(--bianco); border: 1px solid var(--grigio-200); border-radius: var(--raggio); overflow: hidden; box-shadow: var(--ombra-1); font-size: .9rem; }
th, td { padding: .5rem .6rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--grigio-100); overflow-wrap: break-word; }
th { background: var(--perla-scura); color: var(--grigio-600); font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; border-bottom: 1px solid var(--grigio-200); }
th code.col { text-transform: none; letter-spacing: 0; }
tbody tr:nth-child(even) td { background: #fafbfc; }
tbody tr:hover td { background: var(--blu-50); }
tbody tr:last-child td { border-bottom: 0; }
tr.disattivo td { color: var(--grigio-400); font-style: italic; }
tr.evidenza td { background: var(--ambra-chiaro) !important; }
tr.rosso td { color: var(--rosso); }
.totali td { font-weight: 700; background: var(--blu-50) !important; border-top: 2px solid var(--blu-200); }
td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; }
td.si { color: var(--verde); font-weight: 600; }
td.no { color: var(--rosso); }
td.azioni form, td.azioni-cella form, td form.inline { display: inline; }
/* Una cella "azioni" non è un blocco di pulsanti: niente flex (la regola .azioni vale per i div). */
td.azioni { display: table-cell; }
td.azioni-cella, td.azioni, td:last-child:has(> .bottone), td:last-child:has(> form) { white-space: nowrap; width: 1%; }
td.num, td.data, td.nw { white-space: nowrap; }
table .bottone, table button { box-shadow: none; }

/* ---------- Schede ---------- */
dl.scheda { display: grid; grid-template-columns: minmax(220px, max-content) 1fr; gap: 0; background: var(--bianco); border: 1px solid var(--grigio-200); border-radius: var(--raggio); box-shadow: var(--ombra-1); overflow: hidden; margin: 0 0 1rem; }
dl.scheda dt { font-weight: 600; font-size: .86rem; color: var(--grigio-600); padding: .5rem 1rem; background: #fafbfc; border-bottom: 1px solid var(--grigio-100); }
dl.scheda dd { margin: 0; padding: .5rem 1rem; border-bottom: 1px solid var(--grigio-100); }
dl.scheda h3 { grid-column: 1 / -1; margin: 0; padding: .55rem 1rem; font-size: .76rem; letter-spacing: .1em; text-transform: uppercase; color: var(--blu-700); background: var(--blu-50); border-bottom: 1px solid var(--blu-100); border-top: 1px solid var(--blu-100); }
dl.scheda h3:first-child { border-top: 0; }
dd.testo-lungo { max-width: 90ch; white-space: pre-line; }

/* ---------- Riquadri ---------- */
.riquadri { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem; margin-bottom: 1.2rem; }
.riquadro { position: relative; border: 1px solid var(--grigio-200); border-radius: var(--raggio); padding: 1rem 1.1rem .9rem; background: var(--bianco); box-shadow: var(--ombra-1); transition: box-shadow var(--transizione), transform var(--transizione); }
.riquadro::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; border-radius: var(--raggio) var(--raggio) 0 0; background: linear-gradient(90deg, var(--blu-400), var(--blu-700)); }
.riquadro:hover { box-shadow: var(--ombra-2); transform: translateY(-2px); }
.riquadro h3 { margin: 0 0 .5rem; font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; color: var(--grigio-600); }
.riquadro p { margin: .25rem 0; }
.riquadro p strong { font-size: 1.15rem; color: var(--blu-900); }
.riquadro.ok::before { background: linear-gradient(90deg, #4ac184, var(--verde)); }
.riquadro.ok { background: var(--verde-chiaro); border-color: #bfe3cf; }
.riquadro.attenzione::before { background: linear-gradient(90deg, #f0c24d, var(--ambra)); }
.riquadro.attenzione { background: var(--ambra-chiaro); border-color: #efdca4; }
details summary { cursor: pointer; color: var(--blu-700); font-weight: 600; margin: .4rem 0; }

/* ---------- Pagina iniziale: cruscotto dell'operatore ---------- */
.benvenuto { display: flex; justify-content: space-between; align-items: flex-start; gap: 2rem; padding: 1.4rem 1.6rem; margin-bottom: 1.2rem; border-radius: 14px; color: var(--bianco);
  background: radial-gradient(900px 300px at 0% 0%, rgba(255,255,255,.14), transparent 60%), linear-gradient(120deg, var(--blu-900), var(--blu-700) 70%, var(--blu-500)); box-shadow: var(--ombra-2); }
.benvenuto .saluto { margin: 0; font-size: .95rem; color: var(--blu-200); letter-spacing: .04em; text-transform: uppercase; }
.benvenuto h2.nome { margin: .1rem 0 .4rem; padding: 0; color: var(--bianco); font-size: 1.9rem; font-weight: 700; }
.benvenuto h2.nome::before { display: none; }
.benvenuto .dettagli { margin: 0; color: var(--blu-100); font-size: .9rem; }
.benvenuto .frase { margin: .9rem 0 0; font-style: italic; color: var(--bianco); max-width: 70ch; opacity: .95; }
.benvenuto .frase a { color: var(--blu-200); font-style: normal; font-size: .78rem; margin-left: .4rem; }
.benvenuto .orologio { text-align: right; min-width: 200px; }
.benvenuto .orologio .ora { display: block; font-size: 2.6rem; font-weight: 300; letter-spacing: .06em; font-variant-numeric: tabular-nums; line-height: 1; }
.benvenuto .orologio .data { display: block; color: var(--blu-200); font-size: .85rem; margin-top: .35rem; }
.cruscotto { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1rem; }
.pannello { background: var(--bianco); border: 1px solid var(--grigio-200); border-radius: var(--raggio); box-shadow: var(--ombra-1); padding: 1rem 1.2rem 1.1rem; margin-bottom: 1rem; min-width: 0; }
.cruscotto .pannello { margin-bottom: 0; }
.pannello h3 { margin: 0 0 .8rem; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; color: var(--grigio-600); display: flex; align-items: center; gap: .6rem; }
.pannello h3 a.vuoto { font-size: .72rem; letter-spacing: 0; text-transform: none; font-weight: 400; margin-left: auto; }
.pannello h4 { margin: 0 0 .5rem; font-size: .85rem; color: var(--grigio-800); }
.pannello .azioni { margin: .9rem 0 0; }
.badge { display: inline-grid; place-items: center; min-width: 1.5rem; height: 1.5rem; padding: 0 .4rem; border-radius: 999px; background: var(--rosso); color: var(--bianco); font-size: .75rem; font-weight: 700; letter-spacing: 0; }
.lista-compiti { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .4rem; }
.lista-compiti a { display: flex; align-items: center; gap: .8rem; padding: .55rem .7rem; border-radius: var(--raggio-s); border: 1px solid var(--grigio-200); background: var(--perla); color: var(--grigio-800); transition: background var(--transizione), border-color var(--transizione), transform var(--transizione); }
.lista-compiti a:hover { background: var(--blu-50); border-color: var(--blu-200); text-decoration: none; transform: translateX(2px); }
.lista-compiti .conteggio { display: inline-grid; place-items: center; min-width: 2.6rem; height: 2rem; padding: 0 .5rem; border-radius: 8px; font-weight: 700; font-variant-numeric: tabular-nums; background: var(--grigio-200); color: var(--grigio-600); }
.lista-compiti li.aperto .conteggio { background: var(--blu-500); color: var(--bianco); }
.lista-compiti li.aperto.posta .conteggio { background: var(--rosso); }
.lista-compiti li.aperto.attesa .conteggio { background: var(--ambra); }
.lista-compiti li.aperto.controllo .conteggio { background: var(--grigio-600); }
.kpi { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
.kpi > div { padding: .7rem .9rem; border-radius: var(--raggio-s); background: var(--perla); border: 1px solid var(--grigio-200); display: flex; flex-direction: column; }
.kpi .valore { font-size: 1.6rem; font-weight: 700; color: var(--blu-900); font-variant-numeric: tabular-nums; line-height: 1.1; }
.kpi .etichetta { font-size: .82rem; color: var(--grigio-800); margin-top: .2rem; }
.kpi .nota { font-size: .72rem; color: var(--grigio-400); margin-top: .25rem; }
ul.posta { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
ul.posta li a { display: flex; gap: .8rem; padding: .55rem .4rem; border-bottom: 1px solid var(--grigio-100); color: var(--grigio-800); transition: background var(--transizione); }
ul.posta li:last-child a { border-bottom: 0; }
ul.posta li a:hover { background: var(--blu-50); text-decoration: none; }
ul.posta .iniziale { flex: 0 0 2.2rem; height: 2.2rem; border-radius: 50%; display: grid; place-items: center; background: var(--blu-100); color: var(--blu-700); font-weight: 700; }
ul.posta .corpo { min-width: 0; display: grid; grid-template-columns: 1fr auto; gap: 0 .6rem; }
ul.posta .mittente { font-weight: 600; }
ul.posta .quando { font-size: .75rem; color: var(--grigio-400); white-space: nowrap; }
ul.posta .anteprima { grid-column: 1 / -1; font-size: .85rem; color: var(--grigio-600); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
ul.posta li.non-letto .mittente { color: var(--blu-700); }
ul.posta li.non-letto .iniziale { background: var(--blu-500); color: var(--bianco); }
dl.mini { display: grid; grid-template-columns: max-content 1fr; gap: .3rem 1rem; margin: 0; font-size: .9rem; }
dl.mini dt { color: var(--grigio-600); font-weight: 600; }
dl.mini dd { margin: 0; }
.grafici { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
ul.barre { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .25rem; }
ul.barre li { display: grid; grid-template-columns: 4.2rem 1fr 6.5rem; align-items: center; gap: .6rem; font-size: .82rem; }
ul.barre .mese { color: var(--grigio-600); font-variant-numeric: tabular-nums; }
ul.barre .num { text-align: right; font-variant-numeric: tabular-nums; color: var(--grigio-800); }
ul.barre progress { width: 100%; height: .9rem; appearance: none; -webkit-appearance: none; border: 0; background: var(--grigio-100); border-radius: 4px; overflow: hidden; }
ul.barre progress::-webkit-progress-bar { background: var(--grigio-100); border-radius: 4px; }
ul.barre progress::-webkit-progress-value { background: linear-gradient(90deg, var(--blu-400), var(--blu-700)); border-radius: 4px; transition: width var(--transizione); }
ul.barre progress::-moz-progress-bar { background: linear-gradient(90deg, var(--blu-400), var(--blu-700)); border-radius: 4px; }
ul.barre.incassi progress::-webkit-progress-value { background: linear-gradient(90deg, #4ac184, var(--verde)); }
ul.barre.incassi progress::-moz-progress-bar { background: linear-gradient(90deg, #4ac184, var(--verde)); }
.sintesi { display: flex; flex-wrap: wrap; gap: .5rem 1.6rem; margin-top: 1rem; padding-top: .8rem; border-top: 1px solid var(--grigio-100); font-size: .88rem; color: var(--grigio-600); }
.sintesi strong { color: var(--blu-900); font-size: 1.05rem; }
details.base-dati { color: var(--grigio-400); font-size: .85rem; }
details.base-dati summary { color: var(--grigio-600); font-weight: 500; }

/* ---------- Scrivania amministrativa (hub del legacy) ---------- */
.scrivania { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; max-width: 1000px; }
.scrivania .tessera { display: flex; flex-direction: column; justify-content: center; min-height: 4.6rem; padding: .9rem 1.2rem; border-radius: var(--raggio); color: var(--bianco);
  background: linear-gradient(135deg, var(--blu-500), var(--blu-700)); box-shadow: var(--ombra-1); position: relative; overflow: hidden; transition: transform var(--transizione), box-shadow var(--transizione); }
.scrivania .tessera::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,0)); opacity: 0; transition: opacity var(--transizione); }
.scrivania .tessera:hover { text-decoration: none; transform: translateY(-2px); box-shadow: var(--ombra-2); }
.scrivania .tessera:hover::after { opacity: 1; }
.scrivania .titolo { font-weight: 700; font-size: 1rem; letter-spacing: .02em; text-transform: uppercase; }
.scrivania .rif { font-size: .72rem; color: var(--blu-100); margin-top: .2rem; }
.scrivania .tessera.attenuata { background: linear-gradient(135deg, var(--grigio-300), var(--grigio-400)); }

/* ---------- Paginazione ---------- */
.paginazione { display: flex; align-items: center; gap: .4rem; margin: .7rem 0; font-size: .88rem; }
.paginazione a { display: inline-block; padding: .3rem .7rem; border: 1px solid var(--grigio-200); border-radius: 999px; background: var(--bianco); color: var(--blu-700); box-shadow: var(--ombra-1); transition: background var(--transizione), color var(--transizione); }
.paginazione a:hover { background: var(--blu-500); color: var(--bianco); border-color: var(--blu-500); text-decoration: none; }
.paginazione span { color: var(--grigio-600); padding: 0 .4rem; }

/* ---------- Accesso ---------- */
body.accesso { background: radial-gradient(1200px 600px at 20% -10%, var(--blu-100), transparent 60%), radial-gradient(900px 500px at 110% 110%, var(--blu-100), transparent 55%), var(--perla); }
form.login { max-width: 400px; margin: 3.5rem auto; padding: 2rem 2rem 1.5rem; background: var(--bianco); border: 1px solid var(--grigio-200); border-radius: 14px; box-shadow: var(--ombra-2); }
form.login h2 { padding-left: 0; font-size: 1.35rem; }
form.login h2::before { display: none; }
form.login .marchio { display: flex; align-items: center; gap: .7rem; margin-bottom: 1.2rem; color: var(--blu-900); font-weight: 700; letter-spacing: .02em; }
form.login .marchio .logo { display: inline-grid; place-items: center; width: 42px; height: 42px; border-radius: 11px; background: linear-gradient(135deg, var(--blu-500), var(--blu-900)); color: var(--bianco); font-weight: 800; font-size: 1.35rem; box-shadow: var(--ombra-2); }
form.login button { width: 100%; padding: .7rem 1rem; font-size: 1rem; margin-top: .4rem; }
form.login p.vuoto { font-size: .8rem; text-align: center; margin-bottom: 0; }

/* ---------- Pagine di stampa (layout_stampa.php): formato A4, nessun menu ---------- */
body.stampa { min-width: 0; margin: 0; background: var(--bianco); color: #000; }
.foglio { width: 190mm; margin: 10mm auto; padding: 0; font-size: 11pt; line-height: 1.35; font-family: Georgia, "Times New Roman", serif; }
.foglio h1 { font-size: 16pt; margin: 0 0 .4rem; }
.foglio h2 { font-size: 13pt; margin: .8rem 0 .3rem; padding: 0; color: #000; }
.foglio h2::before { display: none; }
.foglio h3 { color: #000; }
.foglio table { font-size: 10pt; border-radius: 0; box-shadow: none; border: 1px solid #000; }
.foglio th, .foglio td { border-bottom: 1px solid #000; }
.foglio th { background: #eee; color: #000; text-transform: none; letter-spacing: 0; font-size: 10pt; }
.foglio tbody tr:nth-child(even) td, .foglio tbody tr:hover td { background: transparent; }
.foglio .intestazione { display: flex; justify-content: space-between; border-bottom: 2px solid #000; padding-bottom: .4rem; margin-bottom: .8rem; }
.foglio .firma { margin-top: 2.5rem; display: flex; justify-content: space-between; }
.foglio .firma div { border-top: 1px solid #000; width: 45%; padding-top: .3rem; text-align: center; }
.foglio .etichette { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4mm; }
.foglio .etichetta { border: 1px dashed #bbb; padding: 3mm; min-height: 32mm; font-size: 10pt; }
.foglio pre.testo { white-space: pre-wrap; font-family: inherit; font-size: 10.5pt; }
.foglio hr { page-break-after: always; break-after: page; border: 0; margin: 1.5rem 0; }
.foglio table.senza-bordi, .foglio table.senza-bordi th, .foglio table.senza-bordi td { border: 0; padding: .15rem .4rem; }
.foglio .carta { position: relative; width: 190mm; min-height: 269mm; }
.foglio .carta img.sfondo { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; }
.foglio .carta .campo { position: absolute; z-index: 1; }
.foglio table.totali-ridotta { width: 60mm; margin-left: auto; }
.foglio .destra { text-align: right; }
.ruotato { writing-mode: vertical-rl; transform: rotate(180deg); color: #9ca3af; font-size: .8rem; }
.non-stampare { margin: .6rem auto; width: 190mm; }
@media print {
  .non-stampare { display: none; }
  .foglio { margin: 0; width: auto; }
  .foglio .etichetta { border-color: transparent; }
  @page { size: A4; margin: 12mm; }
}
/* Casella di autorizzazione nelle eliminazioni (controllo contro i clic accidentali) */
p.conferma-eliminazione { background: var(--rosso-chiaro); border: 1px solid #f1c3bd; border-radius: var(--raggio-s); padding: .6rem .8rem; margin: .8rem 0; }
p.conferma-eliminazione label { margin: 0; font-weight: 600; color: var(--rosso); }
/* Fascicolo del corso: stati di pagamento e tabelline nei riquadri */
.stato-pag { display: inline-block; padding: .1rem .5rem; border-radius: 999px; font-size: .75rem; font-weight: 600; background: var(--grigio-100); color: var(--grigio-600); white-space: nowrap; }
.stato-pag.saldato { background: var(--verde-chiaro); color: var(--verde); }
.stato-pag.parziale { background: var(--blu-50); color: var(--blu-700); }
.stato-pag.nessun-versamento { background: var(--ambra-chiaro); color: var(--ambra); }
.stato-pag.moroso { background: var(--rosso-chiaro); color: var(--rosso); }
.riquadro table.senza-ombra { box-shadow: none; border: 0; margin-top: .2rem; background: transparent; width: 100%; min-width: 0; }
.riquadro table.senza-ombra td { padding: .2rem .3rem; border-bottom: 1px solid var(--grigio-100); font-size: .85rem; background: transparent !important; }

/* ---------- Fascicolo del corso: stampa editoriale (A4 orizzontale) ---------- */
@page orizzontale { size: A4 landscape; margin: 10mm 12mm; }
.foglio.orizzontale { width: 273mm; page: orizzontale; font-family: "Inter", -apple-system, "Segoe UI", Helvetica, Arial, sans-serif; color: #1f2630; font-size: 9pt; line-height: 1.3; }
.fascicolo-stampa .fs-testata { display: grid; grid-template-columns: 1fr 2fr auto; gap: 8mm; align-items: center; padding-bottom: 3mm; margin-bottom: 4mm; border-bottom: 1.2mm solid #1d4e86; }
.fascicolo-stampa .fs-ente { display: flex; align-items: center; gap: 3mm; }
.fascicolo-stampa .fs-marchio { display: inline-grid; place-items: center; width: 12mm; height: 12mm; border-radius: 3mm; background: linear-gradient(135deg, #2e6cb0, #0f2b4c); color: #fff; font-weight: 800; font-size: 16pt; }
.fascicolo-stampa .fs-ente-nome { font-weight: 700; font-size: 11pt; color: #0f2b4c; }
.fascicolo-stampa .fs-ente-sotto { font-size: 7pt; color: #5c6775; letter-spacing: .06em; text-transform: uppercase; }
.fascicolo-stampa .fs-eyebrow { font-size: 7.5pt; letter-spacing: .18em; text-transform: uppercase; color: #2e6cb0; font-weight: 700; }
.fascicolo-stampa .fs-titolo h1 { margin: .5mm 0 1.5mm; font-size: 17pt; font-weight: 700; color: #0f2b4c; letter-spacing: -.01em; }
.fascicolo-stampa .fs-codici { display: flex; gap: 2mm; flex-wrap: wrap; }
.fascicolo-stampa .fs-chip { display: inline-block; padding: .6mm 2.5mm; border-radius: 999px; background: #eef4fb; color: #1d4e86; font-size: 8pt; border: .3mm solid #b9d0ec; }
.fascicolo-stampa .fs-chip strong { font-weight: 700; }
.fascicolo-stampa .fs-chip-vuoto { background: #fff4d6; color: #9a6700; border-color: #efdca4; }
.fascicolo-stampa .fs-data { text-align: right; font-size: 8pt; color: #5c6775; }
.fascicolo-stampa .fs-data strong { display: block; font-size: 11pt; color: #0f2b4c; }
.fascicolo-stampa .fs-scheda dl { display: grid; grid-template-columns: repeat(6, 1fr); gap: 3mm; margin: 0 0 4mm; }
.fascicolo-stampa .fs-scheda dt { font-size: 7pt; letter-spacing: .1em; text-transform: uppercase; color: #5c6775; font-weight: 700; margin-bottom: .5mm; }
.fascicolo-stampa .fs-scheda dd { margin: 0; font-size: 9pt; color: #1f2630; }
.fascicolo-stampa .fs-muto { color: #98a2b0; font-style: italic; }
.fascicolo-stampa .fs-cifre { display: grid; grid-template-columns: repeat(5, 1fr); gap: 3mm; margin: 0 0 4mm; }
.fascicolo-stampa .fs-cifre > div { border: .3mm solid #d9dee5; border-top: 1mm solid #2e6cb0; border-radius: 2mm; padding: 2mm 3mm; background: #fafbfc; display: flex; flex-direction: column; }
.fascicolo-stampa .fs-cifre > div.fs-allerta { border-top-color: #b3261e; background: #fff7f6; }
.fascicolo-stampa .fs-num { font-size: 14pt; font-weight: 700; color: #0f2b4c; font-variant-numeric: tabular-nums; line-height: 1.1; }
.fascicolo-stampa .fs-lab { font-size: 8pt; color: #2a3340; margin-top: .5mm; }
.fascicolo-stampa .fs-sub { font-size: 7pt; color: #98a2b0; margin-top: .3mm; }
.fascicolo-stampa table.fs-tabella { width: 100%; border-collapse: collapse; border: 0; box-shadow: none; border-radius: 0; font-size: 8pt; margin: 0 0 4mm; }
.fascicolo-stampa table.fs-tabella th { background: #0f2b4c; color: #fff; font-size: 6.8pt; letter-spacing: .08em; text-transform: uppercase; padding: 1.6mm 1.8mm; border: 0; text-align: left; }
.fascicolo-stampa table.fs-tabella td { padding: 1.4mm 1.8mm; border: 0; border-bottom: .25mm solid #e2e5ea; vertical-align: top; background: transparent; }
.fascicolo-stampa table.fs-tabella tbody tr:nth-child(even) td { background: #f5f6f8; }
.fascicolo-stampa table.fs-tabella tbody tr:hover td { background: inherit; }
.fascicolo-stampa table.fs-tabella tr.fs-riga-morosa td { background: #fff4d6 !important; }
.fascicolo-stampa table.fs-tabella tfoot td { background: #eef4fb; font-weight: 700; border-top: .5mm solid #2e6cb0; border-bottom: 0; }
.fascicolo-stampa .fs-r { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.fascicolo-stampa .fs-c { text-align: center; }
.fascicolo-stampa .fs-piccolo { font-size: 7pt; color: #5c6775; }
.fascicolo-stampa .fs-stato { display: inline-block; padding: .2mm 1.8mm; border-radius: 999px; font-size: 6.8pt; font-weight: 700; background: #e9ecf0; color: #5c6775; white-space: nowrap; }
.fascicolo-stampa .fs-stato.saldato { background: #e6f4ec; color: #1e7a4c; }
.fascicolo-stampa .fs-stato.parziale { background: #eef4fb; color: #1d4e86; }
.fascicolo-stampa .fs-stato.nessun-versamento { background: #fff4d6; color: #9a6700; }
.fascicolo-stampa .fs-stato.moroso { background: #fbe9e7; color: #b3261e; }
.fascicolo-stampa .fs-ripartizioni { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4mm; margin: 0 0 4mm; page-break-inside: avoid; }
.fascicolo-stampa .fs-ripartizioni h3 { margin: 0 0 1mm; font-size: 7.5pt; letter-spacing: .1em; text-transform: uppercase; color: #2e6cb0; }
.fascicolo-stampa table.fs-mini { width: 100%; border: 0; box-shadow: none; border-radius: 0; font-size: 8pt; margin: 0; }
.fascicolo-stampa table.fs-mini td { padding: .8mm 1.2mm; border: 0; border-bottom: .25mm solid #e9ecf0; background: transparent; }
.fascicolo-stampa .fs-pie { border-top: .3mm solid #d9dee5; padding-top: 2mm; font-size: 7pt; color: #5c6775; page-break-inside: avoid; }
.fascicolo-stampa .fs-pie p { margin: 0 0 6mm; }
.fascicolo-stampa .fs-firme { display: flex; justify-content: space-between; gap: 20mm; }
.fascicolo-stampa .fs-firme div { flex: 1; border-top: .3mm solid #1f2630; padding-top: 1.5mm; text-align: center; font-size: 8pt; color: #1f2630; }
.non-stampare.orizzontale { width: 273mm; }
@media print {
  .fascicolo-stampa table.fs-tabella thead { display: table-header-group; }
  .fascicolo-stampa table.fs-tabella tr { page-break-inside: avoid; }
  .fascicolo-stampa .fs-testata, .fascicolo-stampa .fs-cifre > div, .fascicolo-stampa table.fs-tabella th, .fascicolo-stampa .fs-marchio { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* ---------- Certificati degli allievi: un foglio A4 verticale per allievo ---------- */
.foglio.certificati { font-family: Georgia, "Times New Roman", serif; color: #1f2630; }
.cert { position: relative; min-height: 255mm; padding: 8mm 10mm; border: 1.2mm double #1d4e86; border-radius: 2mm; display: flex; flex-direction: column; page-break-inside: avoid; }
.cert-testata { display: flex; justify-content: space-between; align-items: flex-start; border-bottom: .4mm solid #1d4e86; padding-bottom: 3mm; margin-bottom: 10mm; font-family: "Inter", -apple-system, "Segoe UI", Helvetica, Arial, sans-serif; }
.cert-ente { display: flex; align-items: center; gap: 3mm; }
.cert-marchio { display: inline-grid; place-items: center; width: 13mm; height: 13mm; border-radius: 3mm; background: linear-gradient(135deg, #2e6cb0, #0f2b4c); color: #fff; font-weight: 800; font-size: 17pt; }
.cert-ente-nome { font-weight: 700; font-size: 12pt; color: #0f2b4c; }
.cert-ente-sede { font-size: 7.5pt; color: #5c6775; line-height: 1.3; }
.cert-rif { text-align: right; font-size: 7.5pt; color: #5c6775; line-height: 1.5; }
.cert-titolo { text-align: center; font-size: 24pt; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #0f2b4c; margin: 0 0 2mm; }
.cert-eyebrow { text-align: center; font-family: "Inter", -apple-system, "Segoe UI", Helvetica, Arial, sans-serif; font-size: 8pt; letter-spacing: .2em; text-transform: uppercase; color: #2e6cb0; margin: 0 0 12mm; }
.cert-corpo { text-align: center; font-size: 12.5pt; line-height: 1.6; flex: 1; }
.cert-corpo p { margin: 0 0 3mm; }
.cert-nome { font-size: 22pt; font-weight: 700; color: #0f2b4c; margin: 4mm 0 !important; letter-spacing: .02em; }
.cert-corso { font-size: 15pt; font-style: italic; font-weight: 700; color: #1d4e86; margin: 4mm 0 !important; }
.cert-dati { display: flex; flex-wrap: wrap; justify-content: center; gap: 2mm 6mm; font-family: "Inter", -apple-system, "Segoe UI", Helvetica, Arial, sans-serif; font-size: 9.5pt; color: #2a3340; margin: 6mm 0 !important; }
.cert-dati strong { color: #0f2b4c; }
.cert-nota { font-size: 9pt; color: #5c6775; margin-top: 10mm !important; }
.cert-pie { display: flex; justify-content: space-between; align-items: flex-end; margin-top: 12mm; font-size: 11pt; }
.cert-firma { text-align: center; min-width: 60mm; }
.cert-firma span { display: block; border-top: .3mm solid #1f2630; margin-top: 16mm; }
.foglio.certificati hr { page-break-after: always; break-after: page; border: 0; margin: 6mm 0; }
@media print { .cert { border-color: #1d4e86; -webkit-print-color-adjust: exact; print-color-adjust: exact; } }
.fascicolo-stampa .fs-nw { white-space: nowrap; }
/* Conto economico del corso */
table.conto-voci input[type=text] { padding: .3rem .45rem; font-size: .88rem; }
table.conto-voci input.num { text-align: right; font-variant-numeric: tabular-nums; }
table.conto-voci tr.vuota td { background: var(--perla) !important; }
table.conto-prospetto td:first-child { font-weight: 600; }
.conto-corso-titolo { font-size: 1.05rem; margin: .4rem 0 .8rem; }
.foglio.conto-stampa { font-family: "Inter", -apple-system, "Segoe UI", Helvetica, Arial, sans-serif; font-size: 9.5pt; }
.foglio.conto-stampa .riquadri { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3mm; margin: 0 0 4mm; }
.foglio.conto-stampa .riquadro { padding: 2mm 3mm; box-shadow: none; }
.foglio.conto-stampa .riquadro h3 { font-size: 7pt; }
.foglio.conto-stampa .riquadro p { margin: .2mm 0; font-size: 9pt; }
.foglio.conto-stampa .riquadro p strong { font-size: 12pt; }
.foglio.conto-stampa h3 { font-size: 10pt; color: #1d4e86; margin: 4mm 0 1.5mm; }
.foglio.conto-stampa table { font-size: 8.5pt; border: .3mm solid #c3cad4; }
.foglio.conto-stampa th { background: #0f2b4c; color: #fff; font-size: 7pt; letter-spacing: .06em; }
.foglio.conto-stampa td { border-bottom: .25mm solid #e2e5ea; }
.foglio.conto-stampa tr.totali td { background: #eef4fb; font-weight: 700; }
.foglio.conto-stampa tr.rosso td { color: #b3261e; }
.foglio.conto-stampa tr.evidenza td { background: #fff4d6 !important; }
.foglio.conto-stampa .firma { margin-top: 10mm; }
.azioni a.bottone.attivo { background: var(--blu-500); color: var(--bianco); border-color: var(--blu-500); }
/* Ricerca allievi: campo grande */
.ricerca-allievi .cerca-grande { display: flex; gap: .6rem; }
.ricerca-allievi .cerca-grande input[type=search] { font-size: 1.1rem; padding: .7rem 1rem; border-radius: 10px; }
.ricerca-allievi .aiuto-ricerca { margin: .3rem 0 .6rem; }
.ricerca-allievi details { background: var(--bianco); border: 1px solid var(--grigio-200); border-radius: var(--raggio); padding: .4rem 1rem .2rem; box-shadow: var(--ombra-1); margin-bottom: 1rem; }
.titolo-con-azione { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .4rem; }
.titolo-con-azione h2 { margin: 0; }
.ricerca-allievi .filtri-rapidi { margin: .6rem 0 .4rem; }
select[multiple] { min-height: 12rem; padding: .3rem; }
ul.scelte { list-style: none; padding: 0; margin: 0; }
ul.scelte li { padding: .25rem 0; border-bottom: 1px solid var(--grigio-100); }
.numero-grande { font-size: 2rem; font-weight: 700; color: var(--blu-700, #1d3d6b); margin: .2rem 0; }
form.in-linea { display: inline; margin: 0; }
button.stato-attivo { background: #e7f6ec; color: #1e6b3a; border: 1px solid #9fd3b0; }
button.stato-attivo:hover { background: #fde8e8; color: #9b1c1c; border-color: #f0a8a8; }
button.stato-spento { background: #fde8e8; color: #9b1c1c; border: 1px solid #f0a8a8; }
button.stato-spento:hover { background: #e7f6ec; color: #1e6b3a; border-color: #9fd3b0; }
.etichetta-ruolo { display: inline-block; font-size: .78rem; padding: .05rem .45rem; border-radius: 999px; background: var(--grigio-100, #eef1f5); color: var(--blu-700, #1d3d6b); margin: 1px 0; white-space: nowrap; }
.stato-pag.ok { background: #e7f6ec; color: #1e6b3a; }

/* Bolletta su modello grafico (21/10/2026): foglio A4 senza margini, sfondo a 300 dpi, riquadri in mm misurati sul
   modello (uguali per Portici e ACIIEF). Le larghezze devono restare uguali a quelle di pagina_stampa_ricevuta(). */
.foglio.foglio-bolletta { width: 210mm; margin: 0 auto; font-family: Arial, Helvetica, sans-serif; page: bolletta; }
.carta-bolletta { position: relative; width: 210mm; height: 297mm; overflow: hidden; background: #fff; }
.carta-bolletta img.sfondo { position: absolute; left: 0; top: 0; width: 210mm; height: 297mm; z-index: 0; }
.bm-copia { position: absolute; left: 0; width: 210mm; height: 148.6mm; z-index: 1; }
.bm-alta { top: 0; }
.bm-bassa { top: 148.6mm; }
.bm-campo { position: absolute; height: 6.1mm; line-height: 6.1mm; padding-left: 1.5mm; box-sizing: border-box; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #000; }
.bm-campo.grassetto { font-weight: bold; }
.bm-numero { left: 10.7mm; width: 33.8mm; top: 39.9mm; }
.bm-data { left: 48.8mm; width: 33.8mm; top: 39.9mm; }
.bm-operatore { left: 86.9mm; width: 112.5mm; top: 39.9mm; }
.bm-allievo { left: 10.7mm; width: 128.7mm; top: 52.6mm; }
.bm-nascita { left: 143.5mm; width: 55.9mm; top: 52.6mm; }
.bm-corso { left: 10.7mm; width: 188.7mm; top: 65.3mm; }
.bm-importo { left: 10.7mm; width: 38.8mm; top: 78mm; }
.bm-causale { left: 53.6mm; width: 88.4mm; top: 78mm; }
.bm-modalita { left: 146.1mm; width: 53.3mm; top: 78mm; }
.bm-intestatario { left: 10.7mm; width: 123.4mm; top: 98.3mm; height: 5.8mm; line-height: 5.8mm; }
.bm-cfpiva { left: 138.2mm; width: 61.2mm; top: 98.3mm; height: 5.8mm; line-height: 5.8mm; }
.bm-indirizzo { left: 10.7mm; width: 116.3mm; top: 111mm; height: 5.8mm; line-height: 5.8mm; }
.bm-email { left: 131.3mm; width: 68.1mm; top: 111mm; height: 5.8mm; line-height: 5.8mm; }
.corpo-6 { font-size: 6pt; } .corpo-7 { font-size: 7pt; } .corpo-8 { font-size: 8pt; } .corpo-9 { font-size: 9pt; } .corpo-10 { font-size: 10pt; }
@page bolletta { size: A4; margin: 0; }
@media print {
  .foglio.foglio-bolletta { margin: 0; width: 210mm; }
  .carta-bolletta { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
a.bottone.secondario { background: var(--grigio-600); color: var(--bianco); border-color: var(--grigio-600); }
a.bottone.secondario:hover { background: var(--grigio-800); border-color: var(--grigio-800); }
/* Gruppo di pulsanti in una cella: vanno a capo invece di uscire dallo schermo. */
.pulsanti { display: inline-flex; flex-wrap: wrap; gap: .3rem; }
.pulsanti form { display: inline; }
td.azioni-cella .bottone + .bottone, td.azioni-cella .bottone + form, td.azioni-cella form + .bottone { margin-top: .2rem; }

/* ---------- Modalità operatore (21/10/2026) ---------- */
/* Bollini di stato al posto di 0/1 (funzioni bollino() e si_no()). */
.bollino { display: inline-block; padding: .05rem .5rem; border-radius: 999px; font-size: .76rem; font-weight: 600; line-height: 1.5; white-space: nowrap; background: var(--grigio-100); color: var(--grigio-600); font-style: normal; }
.bollino.ok { background: var(--verde-chiaro); color: var(--verde); }
.bollino.no { background: var(--rosso-chiaro); color: var(--rosso); }
.bollino.attenzione { background: var(--ambra-chiaro); color: var(--ambra); }
.bollino.info { background: var(--blu-50); color: var(--blu-700); }
/* Dettagli tecnici (riferimenti al vecchio gestionale, colonne, origine dei dati): chiusi, per l'amministratore. */
details.tecnico { margin: 1.2rem 0 .4rem; font-size: .82rem; color: var(--grigio-600); border-top: 1px dashed var(--grigio-200); padding-top: .5rem; }
details.tecnico summary { color: var(--grigio-400); font-weight: 500; font-size: .8rem; }
details.tecnico[open] summary { color: var(--grigio-600); }
details.tecnico code.col { display: inline; }

/* Schermi stretti: menu laterale sopra il contenuto, tabelle scorrevoli. */
@media (max-width: 900px) {
  header.testata { padding: 0 .8rem; }
  header.testata h1 .sottotitolo, form.uscita .chip strong { display: none; }
  .corpo { flex-direction: column; }
  aside.laterale { width: auto; flex: none; border-right: 0; border-bottom: 1px solid var(--grigio-200); padding: .5rem .6rem; }
  aside.laterale h2 { display: none; }
  aside.laterale ul { flex-direction: row; flex-wrap: wrap; gap: 4px; }
  aside.laterale li a { padding: .3rem .6rem; font-size: .82rem; }
  .corpo main { padding: 1rem; }
  table { display: block; overflow-x: auto; }
  .cruscotto, .grafici, .kpi, .scrivania { grid-template-columns: 1fr; }
  .benvenuto { flex-direction: column; gap: .8rem; }
}

/* ---------- Schede compatte (fase 2, 21/10/2026) ---------- */
.testata-scheda { display: flex; justify-content: space-between; align-items: flex-start; gap: .8rem 1.5rem; flex-wrap: wrap; margin: 0 0 1rem; }
.testata-scheda h2 { margin: 0 0 .3rem; display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.testata-scheda .fatti { display: flex; flex-wrap: wrap; gap: .2rem 1.2rem; padding-left: .8rem; color: var(--grigio-600); font-size: .9rem; }
.testata-scheda .fatti strong { color: var(--grigio-800); font-weight: 600; }
.testata-scheda .azioni { margin: 0; justify-content: flex-end; }
.blocchi { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 1rem; margin: 0 0 1.2rem; align-items: start; }
.blocco { background: var(--bianco); border: 1px solid var(--grigio-200); border-radius: var(--raggio); box-shadow: var(--ombra-1); padding: .75rem 1rem .9rem; min-width: 0; }
.blocco.largo { grid-column: 1 / -1; }
.blocco h3 { margin: 0 0 .6rem; font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--blu-700); }
dl.campi { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: .55rem 1rem; margin: 0; }
dl.campi .voce { min-width: 0; }
dl.campi .voce.largo { grid-column: 1 / -1; }
dl.campi dt { font-size: .7rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--grigio-400); }
dl.campi dd { margin: .1rem 0 0; font-size: .93rem; overflow-wrap: anywhere; }
.riquadri.compatti { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: .8rem; }
.riquadri.compatti .riquadro { padding: .7rem .9rem .6rem; }
.riquadri.compatti .riquadro h3 { font-size: .7rem; margin-bottom: .2rem; }
.riquadri.compatti .riquadro .numero-grande { font-size: 1.5rem; margin: 0; }
.riquadro.da-versare { background: var(--ambra-chiaro); border-color: #efdca4; }
.riquadro.da-versare::before { background: linear-gradient(90deg, #f0c24d, var(--ambra)); }
h3.sezione { display: flex; align-items: center; gap: .6rem; margin: 1.4rem 0 .4rem; }
h3.sezione .azioni { margin: 0 0 0 auto; }

/* Intestazioni ordinabili (fase 3) */
th a.ordina { color: inherit; text-decoration: none; display: inline-block; }
th a.ordina:hover { text-decoration: underline; }
th a.ordina.attiva { color: var(--blu-700); }

/* Fase 3, gruppo 2: contratti */
/* Nuovo contratto in una pagina: campi con ricerca mentre si scrive ed elenco dei risultati sotto il campo. */
.contratto-nuovo [hidden] { display: none !important; }
.contratto-scelte { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.contratto-nuovo .scelta { position: relative; min-width: 0; }
.contratto-nuovo .scelta-campo { display: flex; gap: .4rem; align-items: center; }
.contratto-nuovo .scelta-campo input { flex: 1 1 auto; min-width: 0; }
.contratto-nuovo .scelta.errore input { border-color: var(--rosso); }
.contratto-nuovo .scelta.errore .scelta-dettaglio { color: var(--rosso); }
.contratto-nuovo .scelta-dettaglio { min-height: 1.1rem; }
.scelta-elenco { position: absolute; left: 0; right: 0; z-index: 20; margin: .2rem 0 0; padding: .2rem 0; list-style: none; max-height: 20rem; overflow-y: auto; background: var(--bianco); border: 1px solid var(--grigio-200); border-radius: var(--raggio-s); box-shadow: var(--ombra-2); }
.scelta-elenco li { padding: .4rem .7rem; cursor: pointer; font-size: .9rem; }
.scelta-elenco li[role="option"]:hover, .scelta-elenco li[aria-selected="true"] { background: var(--blu-50); }
.scelta-elenco li .etichetta { display: block; font-weight: 600; }
.scelta-elenco li .dettaglio { display: block; font-size: .78rem; color: var(--grigio-600); }
.scelta-elenco li.vuoto { cursor: default; color: var(--grigio-600); font-style: italic; }
.contratto-nuovo-collegamenti { display: flex; gap: .5rem; flex-wrap: wrap; margin: .6rem 0 0; }
.contratto-nuovo small.listino { font-weight: 600; color: var(--blu-700); }
/* Elenco contratti: tabella compatta che sta nella pagina con le azioni visibili. */
table.contratti-elenco td.azioni-cella .bottone { padding: .25rem .5rem; font-size: .78rem; }
table.contratti-elenco td.stato .bollino { margin: 0 .2rem .15rem 0; }
table.contratti-elenco th a.ordina { white-space: nowrap; }
@media (max-width: 1100px) {
  table.contratti-elenco td.azioni-cella { white-space: normal; }
  table.contratti-elenco td.azioni-cella .bottone { display: flex; margin: 0 0 .2rem; }
  table.contratti-elenco th, table.contratti-elenco td { padding: .45rem .4rem; }
}
.contratto-nuovo #proposta { margin-bottom: 1.1rem; }

/* Fase 3, gruppo 3: elenchi */
/* Pulsanti di riga su due colonne (corsi, allievi, padrini): le tabelle restano dentro 1440 px con tutte le azioni
   visibili; un ultimo pulsante dispari (es. "Nuovo contratto") occupa tutta la riga. */
.pulsanti-griglia { display: grid; grid-template-columns: repeat(2, max-content); gap: .25rem; justify-content: start; }
.pulsanti-griglia .bottone { margin: 0; text-align: center; }
.pulsanti-griglia > .bottone:last-child:nth-child(odd) { grid-column: 1 / -1; }
td.azioni-cella .pulsanti-griglia .bottone + .bottone { margin-top: 0; }
table.elenco-corsi th, table.elenco-corsi td, table.elenco-compatto th, table.elenco-compatto td { padding-left: .45rem; padding-right: .45rem; }
table.elenco-compatto { font-size: .86rem; }
/* Celle con testi lunghi senza spazi (telefoni con note): vanno a capo dove serve, ma non sotto le 10 cifre. */
table.elenco-compatto td.spezza { overflow-wrap: anywhere; min-width: 6.5rem; }

/* Fase 3, gruppo 1: contabilità */
table.da-approvare th a.ordina, table.bollette th a.ordina, table.padrini-contabilita th a.ordina { white-space: nowrap; }
table.da-approvare th.sel, table.da-approvare td.sel { width: 1%; padding-right: 0; }
table.da-approvare td.sel input { margin: 0; }
table.riepilogo-operatori { width: auto; min-width: 32rem; }
.barra-selezione { margin: .4rem 0; }
table.padrini-contabilita td small { color: var(--grigio-600); }
@media (max-width: 1100px) {
  table.da-approvare td.azioni-cella, table.bollette td.azioni-cella, table.padrini-contabilita td.azioni-cella { white-space: normal; }
  table.da-approvare td.azioni-cella a.bottone, table.bollette td.azioni-cella a.bottone, table.padrini-contabilita td.azioni-cella a.bottone { display: block; margin: 0 0 .25rem; text-align: center; }
  table.da-approvare th, table.da-approvare td { padding-left: .4rem; padding-right: .4rem; }
}
@media (max-width: 1100px) {
  table.bollette th, table.bollette td { padding-left: .4rem; padding-right: .4rem; }
}
/* Fase 3, gruppo 3 (segue): sugli schermi stretti il catalogo corsi nasconde le colonne secondarie (livello, contratti dell'anno, tipologia) per tenere visibili le azioni. */
@media (max-width: 1100px) {
  table.elenco-corsi th:nth-child(5), table.elenco-corsi td:nth-child(5), table.elenco-corsi th:nth-child(9), table.elenco-corsi td:nth-child(9) { display: none; }
}
@media (max-width: 900px) {
  table.elenco-corsi th:nth-child(4), table.elenco-corsi td:nth-child(4) { display: none; }
}