/* FrantoioFacile - nessuna risorsa esterna: solo font di sistema.
   Bahnschrift (Windows 10+) per titoli e cifre: e' il carattere tipo DIN
   dei display e delle etichette industriali, adatto a pesi e quintali. */

:root {
  --pietra: #E6E9E0;
  --carta: #FBFCF8;
  --inchiostro: #232B17;
  --grigio: #5E6652;
  --oliva: #4B5A1E;
  --oliva-scura: #2C3610;
  --foglia: #B9C29B;
  --olio: #E3B52C;
  --errore: #9E2A1C;
  --ok: #3F6B2A;
  --attenzione: #8A5A00;

  --f-titoli: Bahnschrift, "DIN Alternate", "Roboto Condensed", "Arial Narrow", sans-serif;
  --f-testo: "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", sans-serif;
  --raggio: 6px;
}

*, *::before, *::after { box-sizing: border-box; }

html { font-size: 100%; -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: var(--f-testo);
  font-size: 1rem;
  line-height: 1.5;
  color: var(--inchiostro);
  background: var(--pietra);
}

h1, h2 {
  font-family: var(--f-titoli);
  font-weight: 600;
  line-height: 1.15;
  margin: 0 0 .75rem;
}
h1 { font-size: 2rem; }
h2 { font-size: 1.3rem; }

a { color: var(--oliva); }
a:hover { color: var(--oliva-scura); }

:focus-visible {
  outline: 3px solid var(--olio);
  outline-offset: 2px;
}

/* ---------------------------------------------------------- struttura */
/* Barra laterale scura con il marchio dell'azienda, contenuto a destra. */

:root {
  --lato: #26300F;
  --lato-2: #1E260B;
  --lato-testo: #DCE3C8;
  --lato-tenue: #9DA885;
  --lato-linea: rgba(255, 255, 255, .09);
}

body.app { background: #EEF0E8; }

.guscio {
  display: grid;
  grid-template-columns: 16rem minmax(0, 1fr);
  min-height: 100vh;
}

.lato {
  position: sticky;
  top: 0;
  height: 100vh;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  background: linear-gradient(180deg, var(--lato) 0%, var(--lato-2) 100%);
  color: var(--lato-testo);
}
.lato-testa { padding: 1.25rem 1rem 1rem; border-bottom: 1px solid var(--lato-linea); }
.marchio { display: flex; align-items: center; gap: .75rem; color: #fff; text-decoration: none; }
.marchio:hover { color: #fff; }
.marchio-logo {
  flex: none;
  display: grid;
  place-items: center;
  width: 3.25rem;
  height: 3.25rem;
  padding: .3rem;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .25);
  color: var(--oliva-scura);
  font-family: var(--f-titoli);
  font-size: 1.2rem;
  font-weight: 700;
  overflow: hidden;
}
.marchio-logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.marchio-testo { display: flex; flex-direction: column; min-width: 0; }
.marchio-testo strong {
  font-family: var(--f-titoli);
  font-size: 1.02rem;
  font-weight: 600;
  line-height: 1.2;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.marchio-testo small { margin-top: .15rem; font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; color: var(--olio); }

.menu-mobile { flex: 1; }
.menu-mobile > summary { display: none; }
.menu { padding: .9rem .6rem 1rem; }
.menu ul { list-style: none; margin: 0; padding: 0; }
.menu li a {
  display: flex;
  align-items: center;
  gap: .7rem;
  margin: .1rem 0;
  padding: .6rem .75rem;
  border-radius: 8px;
  color: var(--lato-testo);
  text-decoration: none;
  font-size: .95rem;
  transition: background-color .12s, color .12s;
}
.menu li a .icona { flex: none; opacity: .8; }
.menu li a:hover { background: rgba(255, 255, 255, .07); color: #fff; }
.menu li a[aria-current="page"] {
  background: rgba(227, 181, 44, .14);
  color: #fff;
  font-weight: 600;
  box-shadow: inset 3px 0 0 var(--olio);
}
.menu li a[aria-current="page"] .icona { color: var(--olio); opacity: 1; }
.menu li a:focus-visible { outline: 2px solid var(--olio); outline-offset: -2px; }
.menu-gruppo {
  margin: 1.1rem .75rem .35rem;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--lato-tenue);
}
.lato-piede { margin: 0; padding: .9rem 1.1rem; border-top: 1px solid var(--lato-linea); font-size: .75rem; line-height: 1.4; color: var(--lato-tenue); }

.principale { display: flex; flex-direction: column; min-width: 0; }
.barra {
  position: sticky;
  top: 0;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .65rem 2rem;
  background: rgba(251, 252, 248, .92);
  backdrop-filter: blur(6px);
  border-bottom: 1px solid #DDE2D1;
}
.barra-titolo { font-size: .9rem; color: var(--grigio); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.account { display: flex; align-items: center; gap: .5rem; font-size: .9rem; }
.account-nome {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .3rem .7rem .3rem .3rem;
  border-radius: 999px;
  color: var(--inchiostro);
  text-decoration: none;
}
.account-nome:hover { background: #E7EBDD; color: var(--inchiostro); }
.avatar {
  display: grid;
  place-items: center;
  width: 1.9rem;
  height: 1.9rem;
  border-radius: 50%;
  background: var(--oliva);
  color: #fff;
  font-weight: 700;
  font-size: .85rem;
}
.esci { margin: 0; }
.account button.esci-pulsante {
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: .35rem;
  padding: .45rem .7rem;
  border-radius: 999px;
  color: var(--grigio);
  text-decoration: none;
}
.account button.esci-pulsante:hover { background: #E7EBDD; color: var(--inchiostro); }

.contenuto { padding: 1.75rem 2rem 3rem; max-width: 76rem; width: 100%; box-sizing: border-box; }
.contenuto.largo { max-width: none; }
h1 { letter-spacing: -.01em; }

/* ------------------------------------------------ riepilogo "pesa" */

.intestazione-pagina {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem;
  margin-bottom: 1rem;
}
.scelta-anno { display: flex; align-items: center; gap: .5rem; }
.scelta-anno select { min-width: 6rem; }

.pesa {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) repeat(2, minmax(0, 1fr));
  gap: 1px;
  background: #1E2509;
  border-radius: var(--raggio);
  overflow: hidden;
  margin-bottom: 2rem;
}
.pesa-voce {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 1rem 1.25rem 1.1rem;
  background: var(--oliva-scura);
  color: #DDE3C8;
}
.pesa-principale { grid-row: span 2; justify-content: center; }
.pesa-cifra {
  font-family: var(--f-titoli);
  font-size: 2.3rem;
  font-weight: 500;
  line-height: 1.05;
  color: var(--olio);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.pesa-principale .pesa-cifra { font-size: 3.6rem; }
.pesa-unita { font-size: .9rem; margin-top: .3rem; }

/* ------------------------------------------------------------ tabelle */

.blocco { margin-bottom: 2rem; }
.tabella-scorre { overflow-x: auto; position: relative; }
.tabella {
  width: 100%;
  border-collapse: collapse;
  background: var(--carta);
  font-variant-numeric: tabular-nums;
}
.tabella th, .tabella td {
  padding: .6rem .75rem;
  text-align: left;
  border-bottom: 1px solid var(--pietra);
}
.tabella th { font-size: .85rem; color: var(--grigio); font-weight: 600; }
.tabella .num { text-align: right; }
.vuoto { color: var(--grigio); }

/* ------------------------------------------------------------- moduli */

.modulo { display: flex; flex-direction: column; gap: .35rem; max-width: 26rem; }
.modulo.largo { max-width: 40rem; }
.modulo.secondario {
  margin-top: 2.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--foglia);
}
.modulo fieldset {
  border: 0;
  margin: 0 0 1.25rem;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .75rem;
}
.modulo legend {
  font-family: var(--f-titoli);
  font-size: 1.2rem;
  font-weight: 600;
  margin-bottom: .5rem;
}
.campo { display: flex; flex-direction: column; gap: .3rem; }
.con-unita { display: flex; align-items: center; gap: .6rem; }
.con-unita input { max-width: 14rem; }
.unita { color: var(--grigio); font-size: .9rem; }

label { font-weight: 600; font-size: .92rem; }

input[type="text"], input[type="password"], select {
  font: inherit;
  width: 100%;
  min-height: 2.75rem;
  padding: .45rem .7rem;
  color: var(--inchiostro);
  background: #fff;
  border: 1px solid #9CA487;
  border-radius: var(--raggio);
}
select { width: auto; }
.con-errore input { border-color: var(--errore); }

.spunta { display: flex; gap: .6rem; align-items: flex-start; font-weight: 400; }
.spunta input { width: 1.15rem; height: 1.15rem; margin-top: .2rem; accent-color: var(--oliva); }

button {
  font: inherit;
  font-weight: 600;
  min-height: 2.75rem;
  padding: .5rem 1.4rem;
  color: #fff;
  background: var(--oliva);
  border: 0;
  border-radius: var(--raggio);
  cursor: pointer;
  align-self: flex-start;
  margin-top: .5rem;
}
button:hover { background: var(--oliva-scura); }
button.secondario { background: transparent; color: var(--oliva); border: 2px solid var(--oliva); }
button.secondario:hover { background: var(--carta); }
button.link {
  min-height: 0; padding: 0; margin: 0;
  background: none; color: var(--oliva); font-weight: 400; text-decoration: underline;
}

.nota { font-size: .88rem; color: var(--grigio); margin: 0; max-width: 38rem; }
.errore { color: var(--errore); font-size: .9rem; margin: 0; }

.avviso {
  padding: .7rem 1rem;
  border-left: 4px solid var(--oliva);
  background: var(--carta);
  margin: 0 0 1.25rem;
  max-width: 44rem;
}
.avviso-ok { border-left-color: var(--ok); }
.avviso-attenzione { border-left-color: var(--attenzione); }
.avviso-errore { border-left-color: var(--errore); }
.avviso-info { border-left-color: #0A6E9E; }
.licenza-avviso a { font-weight: 700; white-space: nowrap; }

/* ------------------------------------------------ pagina di accesso */

body.semplice {
  display: grid;
  place-items: center;
  min-height: 100vh;
  padding: 1rem;
}
.scheda-accesso {
  width: 100%;
  max-width: 24rem;
  padding: 2rem;
  background: var(--carta);
  border-top: 6px solid var(--oliva-scura);
  border-radius: 12px;
  box-shadow: 0 18px 50px rgba(30, 37, 9, .22);
}
body.semplice { background: linear-gradient(160deg, #2C3610 0%, #1E260B 55%, #3A4716 100%); }
.accesso-marchio { text-align: center; margin-bottom: 1.25rem; }
.accesso-marchio img { width: 5rem; height: 5rem; object-fit: contain; margin-bottom: .6rem; }
.accesso-marchio h1 { font-size: 1.35rem; margin: 0 0 .25rem; color: var(--oliva-scura); }
.accesso-marchio p { margin: 0; color: var(--grigio); font-size: .9rem; }
.scheda-accesso .modulo { max-width: none; }
.scheda-accesso button { width: 100%; }
.scheda-accesso .spazio-sopra { margin-top: 1.25rem; text-align: center; }
.scheda-accesso .con-unita input { max-width: none; }

/* ---------------------------------- dentro un iframe (pagina di X5) */

.in-cornice body.app { background: transparent; }
.in-cornice .guscio { min-height: 0; }
.in-cornice .lato { height: auto; position: static; }
.in-cornice .barra { position: static; }
.in-cornice body.semplice { min-height: 0; padding: 2rem 1rem; }

/* ----------------------------------------------------- schermi stretti */

@media (max-width: 900px) {
  .guscio { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto 1fr; }
  .lato { position: sticky; top: 0; z-index: 10; display: block; height: auto; overflow: visible; }
  .lato-testa { padding: .6rem 7.5rem .6rem 1rem; border-bottom: 0; }
  .marchio-logo { width: 2.5rem; height: 2.5rem; border-radius: 8px; }
  .marchio-testo strong { -webkit-line-clamp: 1; font-size: .95rem; }
  .marchio-testo small { display: none; }
  .menu-mobile > summary {
    position: absolute; top: .7rem; right: .75rem;
    display: flex; align-items: center; gap: .4rem;
    padding: .5rem .8rem; border-radius: 8px;
    background: rgba(255, 255, 255, .08); color: #fff; font-weight: 600; cursor: pointer; list-style: none;
  }
  .menu-mobile > summary::-webkit-details-marker { display: none; }
  .menu-mobile[open] > summary { background: rgba(227, 181, 44, .2); }
  .menu-mobile:not([open]) > nav { display: none; }
  .menu { padding: .4rem .6rem .8rem; border-top: 1px solid var(--lato-linea); }
  .lato-piede { display: none; }
  .barra { position: static; padding: .5rem 1rem; }
  .barra-titolo { display: none; }
  .account { margin-left: auto; }
  .contenuto { padding: 1.25rem 1rem 2.5rem; }
}

@media (max-width: 760px) {
  .pesa { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pesa-principale { grid-row: auto; grid-column: 1 / -1; }
  .pesa-principale .pesa-cifra { font-size: 2.8rem; }
  .pesa-cifra { font-size: clamp(1.4rem, 6.5vw, 2.3rem); }
  .pesa-voce { padding: .9rem 1rem; }
  h1 { font-size: 1.6rem; }
}

@media print {
  .lato, .barra, .scelta-anno { display: none !important; }
  .guscio { display: block; }
  body { background: #fff; }
}

/* =================================================== fase 2: moduli e schede */

.bottone {
  display: inline-flex;
  align-items: center;
  min-height: 2.75rem;
  padding: .5rem 1.2rem;
  font-weight: 600;
  color: #fff;
  background: var(--oliva);
  border-radius: var(--raggio);
  text-decoration: none;
}
.bottone:hover { background: var(--oliva-scura); color: #fff; }
.bottone.secondario { background: transparent; color: var(--oliva); border: 2px solid var(--oliva); }
.bottone.secondario:hover { background: var(--carta); color: var(--oliva-scura); }
.azioni-pagina { display: flex; flex-wrap: wrap; gap: .6rem; }

.briciole { margin: 0 0 .25rem; font-size: .9rem; }
.briciole span { color: var(--grigio); margin: 0 .3rem; }
.nascosto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.conteggio { color: var(--grigio); font-size: .92rem; margin: .5rem 0 .75rem; }

.filtri {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: .75rem 1rem;
  margin-bottom: .5rem;
}
.filtri .campo { min-width: 9rem; }
.filtri .campo:has(input[type="search"]) { flex: 1 1 16rem; }
.filtri button { margin-top: 0; }
input[type="search"], input[type="email"], input[type="tel"], input[type="date"], input[type="time"], textarea {
  font: inherit;
  width: 100%;
  min-height: 2.75rem;
  padding: .45rem .7rem;
  color: var(--inchiostro);
  background: #fff;
  border: 1px solid #9CA487;
  border-radius: var(--raggio);
}
textarea { min-height: 4rem; resize: vertical; line-height: 1.45; }

.tabella td.azioni { text-align: right; white-space: nowrap; font-size: .9rem; }
.tabella tbody tr:hover { background: #F3F5EE; }

.pagine { display: flex; align-items: center; gap: 1.25rem; margin: 1rem 0; }
.pagine span { color: var(--grigio); }

.etichetta {
  display: inline-block;
  padding: .05rem .5rem;
  font-size: .8rem;
  border-radius: 999px;
  background: #F1E3BE;
  color: #5C4300;
}
.etichetta-ok { background: #DDE8D2; color: var(--ok); }
.stato-scheda { display: flex; gap: .5rem; margin: 0 0 1rem; }
.tabella td.stato-lavorazione { font-weight: 700; }
.tabella td.stato-lavorazione .etichetta { font-weight: 600; }

.griglia {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr));
  gap: .9rem 1.25rem !important;
}
.griglia legend { grid-column: 1 / -1; }
.campo-largo { grid-column: 1 / -1; }
.campo-largo .con-unita input { max-width: 32rem; }
.campo-corto input { max-width: 8.5rem; }
.obbl { color: var(--errore); }
.etichetta-campo { font-weight: 600; font-size: .92rem; }
.azioni-modulo { display: flex; align-items: center; gap: 1.25rem; margin-top: .5rem; }
.azioni-modulo button { margin-top: 0; }

.dettagli { margin: 0 0 1.25rem; }
.dettagli summary { cursor: pointer; font-weight: 600; padding: .4rem 0; }
.dettagli .griglia { margin-top: .75rem; }

.scheda-dati { margin: 0 0 2rem; display: grid; gap: .1rem; max-width: 44rem; }
.scheda-dati > div {
  display: grid;
  grid-template-columns: 12rem 1fr;
  gap: 1rem;
  padding: .45rem 0;
  border-bottom: 1px solid #D4D9C6;
}
.scheda-dati dt { color: var(--grigio); }
.scheda-dati dd { margin: 0; }

.zona-pericolo { margin-top: 2.5rem; padding-top: 1rem; border-top: 1px solid var(--foglia); }
button.pericolo { background: transparent; color: var(--errore); border: 2px solid var(--errore); }
button.pericolo:hover { background: #F7E4E1; }

/* scheda: campi a sinistra, conto fisso a destra */
.modulo-scheda {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 19rem;
  gap: 2rem;
  align-items: start;
}
.colonna-campi { display: flex; flex-direction: column; min-width: 0; }
.colonna-campi fieldset { border: 0; margin: 0 0 1.5rem; padding: 0; }
.colonna-campi legend { font-family: var(--f-titoli); font-size: 1.2rem; font-weight: 600; margin-bottom: .6rem; }
.cliente-scheda { margin: 0 0 1.25rem; font-size: 1.05rem; }

.conto {
  position: sticky;
  top: 1rem;
  padding: 1.1rem 1.25rem;
  background: var(--carta);
  border-top: 5px solid var(--oliva-scura);
  border-radius: var(--raggio);
  font-variant-numeric: tabular-nums;
}
.conto dl { margin: 0; }
.conto dl > div { display: flex; justify-content: space-between; gap: 1rem; padding: .3rem 0; }
.conto dt { color: var(--grigio); }
.conto dd { margin: 0; text-align: right; white-space: nowrap; }
.conto .conto-totale { border-top: 1px solid var(--foglia); margin-top: .3rem; padding-top: .5rem; }
.conto .conto-totale dd { font-weight: 600; }
.conto .conto-netto { padding-top: .6rem; }
.conto .conto-netto dt { color: var(--inchiostro); font-weight: 600; }
.conto .conto-netto dd {
  font-family: var(--f-titoli);
  font-size: 1.9rem;
  font-weight: 600;
  line-height: 1;
  color: var(--oliva-scura);
}
.conto-olio { margin-top: 1rem !important; padding-top: .75rem; border-top: 1px solid var(--foglia); font-size: .92rem; }
.resto { margin-top: 1rem; padding-top: .75rem; border-top: 1px solid var(--foglia); }
.resto input { max-width: 9rem; }
.resto p { margin: .5rem 0 0; }

@media (max-width: 1000px) {
  .modulo-scheda { grid-template-columns: 1fr; }
  .conto { position: static; order: -1; }
  form.modulo-scheda .conto { order: 0; }
}
@media (max-width: 760px) {
  .scheda-dati > div { grid-template-columns: 1fr; gap: 0; }
}

/* ============================================================ planner */

.naviga-settimana {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem 1.25rem;
  margin-bottom: 1rem;
}
.naviga-settimana strong { font-family: var(--f-titoli); font-size: 1.15rem; font-weight: 600; }
.vai-data { margin-left: auto; }
.vai-data input { width: auto; }

.settimana {
  display: grid;
  grid-template-columns: 3.5rem repeat(7, minmax(0, 1fr));
  grid-template-rows: auto;
  grid-auto-rows: 1.75rem;
  background: var(--carta);
  border: 1px solid #C9CFBA;
  border-radius: var(--raggio);
  overflow: hidden;
}
.angolo { background: var(--carta); border-bottom: 1px solid #C9CFBA; }
.giorno-testa {
  display: flex;
  flex-direction: column;
  padding: .5rem .5rem .45rem;
  border-bottom: 1px solid #C9CFBA;
  border-left: 1px solid #E1E5D8;
  min-width: 0;
}
.giorno-testa.oggi { background: #EEF2E2; box-shadow: inset 0 3px 0 var(--oliva); }
.giorno-nome { font-weight: 600; text-transform: capitalize; }
.giorno-riepilogo { font-size: .78rem; color: var(--grigio); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ora {
  font-size: .75rem;
  color: var(--grigio);
  text-align: right;
  padding: .1rem .45rem 0 0;
  font-variant-numeric: tabular-nums;
}
.slot {
  display: block;
  border-left: 1px solid #E1E5D8;
  border-top: 1px dotted #E6E9DF;
}
.slot.ora-piena { border-top: 1px solid #DDE1D3; }
.slot.oggi { background: #F6F8F0; }
.slot.passato { background: #F3F4EF; }
.slot:hover { background: #E4EBCF; }
.slot:focus-visible { outline-offset: -3px; }
.evento {
  z-index: 1;
  margin: 1px 3px;
  padding: .2rem .4rem;
  display: flex;
  flex-direction: column;
  gap: 0;
  overflow: hidden;
  font-size: .8rem;
  line-height: 1.25;
  color: #fff;
  background: var(--oliva);
  border-left: 4px solid var(--olio);
  border-radius: 4px;
  text-decoration: none;
}
.evento:hover { background: var(--oliva-scura); color: #fff; }
.evento.corsia-2 { margin-left: 40%; background: #6B5A1E; }
.evento.con-scheda { background: #5E6652; border-left-color: #C9CFBA; }
.evento-ora { font-variant-numeric: tabular-nums; opacity: .9; }
.evento-nome { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.evento-q { opacity: .9; }

.agenda { display: none; }
.agenda-giorno { margin-bottom: 1.25rem; }
.agenda-giorno h2 { font-size: 1.1rem; display: flex; flex-wrap: wrap; align-items: baseline; gap: .5rem; margin-bottom: .4rem; }
.agenda-giorno h2 small { font-family: var(--f-testo); font-size: .8rem; font-weight: 400; color: var(--grigio); }
.agenda-giorno.oggi h2 { color: var(--oliva); }
.agenda-evento {
  display: grid;
  grid-template-columns: 6.5rem 1fr auto;
  gap: .5rem;
  padding: .65rem .75rem;
  margin-bottom: .35rem;
  background: var(--carta);
  border-left: 4px solid var(--oliva);
  border-radius: 4px;
  text-decoration: none;
  color: var(--inchiostro);
}
.agenda-evento .evento-nome { font-weight: 600; white-space: normal; }
.agenda-nuova { display: inline-block; padding: .4rem 0; }

.scelta-cliente { list-style: none; margin: 0; padding: 0; max-width: 40rem; }
.scelta-cliente a {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: .75rem 1rem;
  margin-bottom: .35rem;
  background: var(--carta);
  border-radius: 4px;
  text-decoration: none;
  color: var(--inchiostro);
}
.scelta-cliente a:hover { background: #fff; box-shadow: inset 3px 0 0 var(--oliva); }
.scelta-cliente span { color: var(--grigio); font-size: .9rem; text-align: right; }

.conferma h2 { font-size: 1.15rem; margin-bottom: .6rem; }
.conferma h2.spazio-sopra { margin-top: 1.5rem; padding-top: 1rem; border-top: 1px solid var(--foglia); }
.conferma label { display: block; margin-bottom: .3rem; }
.conferma textarea { font-size: .9rem; }
.invii { display: flex; flex-wrap: wrap; gap: .5rem; margin: .75rem 0 .5rem; }
.invii button { margin: 0; }
.prova-mail { flex-direction: row; flex-wrap: wrap; align-items: flex-end; gap: 1rem; margin-top: 1rem; }
.prova-mail .campo { flex: 1 1 16rem; }
.prova-mail button { margin: 0; }
.bottone-wa { background: #1F7A4D; }
.bottone-wa:hover { background: #155C39; }
.nota-wa { margin: 0 0 .4rem; }
.titolo-disdetta { font-size: 1.15rem; margin: 0 0 .75rem; text-align: center; }
.riepilogo-disdetta { margin: 0 0 1.25rem; padding: .5rem 1rem; background: #F3F5EE; border-radius: 8px; }
.riepilogo-disdetta > div { display: flex; justify-content: space-between; gap: 1rem; padding: .45rem 0; border-bottom: 1px solid #DDE2D1; }
.riepilogo-disdetta > div:last-child { border-bottom: 0; }
.riepilogo-disdetta dt { color: var(--grigio); }
.riepilogo-disdetta dd { margin: 0; font-weight: 600; text-align: right; }
.scheda-accesso textarea { width: 100%; }
.scheda-accesso button.pericolo-pieno { width: 100%; }
.esito-disdetta { text-align: center; }
.esito-disdetta h2 { font-size: 1.2rem; margin: 0 0 .5rem; }
.esito-disdetta.ok h2 { color: var(--ok); }
.disdette { margin-top: 2rem; }
.stato-finale { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; margin: 0 0 1rem; padding: .8rem 1rem;
  background: #FFF8E1; border: 1px solid #E8CF7A; border-radius: 8px; }
.stato-finale label { font-weight: 600; }
.stato-auto { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .6rem; }
.stato-auto label { font-weight: 400; min-width: 14rem; }
.stato-finale select { width: auto; min-width: 14rem; }
.stato-finale button { margin: 0; }
.stato-finale .nota { flex-basis: 100%; margin: 0; }
.scelte-wa { display: grid; gap: .5rem; border: 0; padding: 0; margin: .5rem 0 1rem; }
.scelta-wa { display: flex; gap: .75rem; align-items: flex-start; padding: .75rem .9rem; background: #fff; border: 1px solid #DDE2D1; border-radius: 8px; font-weight: 400; cursor: pointer; }
.scelta-wa:has(input:checked) { border-color: var(--oliva); box-shadow: inset 3px 0 0 var(--oliva); }
.scelta-wa input { margin-top: .25rem; accent-color: var(--oliva); }
.scelta-wa > span { display: flex; flex-direction: column; }
.link-titolo { font-family: var(--f-testo); font-size: .85rem; font-weight: 400; margin-left: .5rem; }
.elenco-semplice { margin: 0; padding-left: 1.2rem; }
.elenco-semplice li { margin-bottom: .3rem; }

@media (max-width: 900px) {
  .settimana { display: none; }
  .agenda { display: block; }
  .vai-data { margin-left: 0; }
}

/* posizioni nella griglia (generate: niente stili inline per la CSP) */
.gc-1{grid-column:1}
.gc-2{grid-column:2}
.gc-3{grid-column:3}
.gc-4{grid-column:4}
.gc-5{grid-column:5}
.gc-6{grid-column:6}
.gc-7{grid-column:7}
.gc-8{grid-column:8}
.gr-1{grid-row-start:1}
.gr-2{grid-row-start:2}
.gr-3{grid-row-start:3}
.gr-4{grid-row-start:4}
.gr-5{grid-row-start:5}
.gr-6{grid-row-start:6}
.gr-7{grid-row-start:7}
.gr-8{grid-row-start:8}
.gr-9{grid-row-start:9}
.gr-10{grid-row-start:10}
.gr-11{grid-row-start:11}
.gr-12{grid-row-start:12}
.gr-13{grid-row-start:13}
.gr-14{grid-row-start:14}
.gr-15{grid-row-start:15}
.gr-16{grid-row-start:16}
.gr-17{grid-row-start:17}
.gr-18{grid-row-start:18}
.gr-19{grid-row-start:19}
.gr-20{grid-row-start:20}
.gr-21{grid-row-start:21}
.gr-22{grid-row-start:22}
.gr-23{grid-row-start:23}
.gr-24{grid-row-start:24}
.gr-25{grid-row-start:25}
.gr-26{grid-row-start:26}
.gr-27{grid-row-start:27}
.gr-28{grid-row-start:28}
.gr-29{grid-row-start:29}
.gr-30{grid-row-start:30}
.gr-31{grid-row-start:31}
.gr-32{grid-row-start:32}
.gr-33{grid-row-start:33}
.gr-34{grid-row-start:34}
.gr-35{grid-row-start:35}
.gr-36{grid-row-start:36}
.gr-37{grid-row-start:37}
.gr-38{grid-row-start:38}
.gr-39{grid-row-start:39}
.gr-40{grid-row-start:40}
.gr-41{grid-row-start:41}
.gr-42{grid-row-start:42}
.gr-43{grid-row-start:43}
.gr-44{grid-row-start:44}
.gr-45{grid-row-start:45}
.gr-46{grid-row-start:46}
.gr-47{grid-row-start:47}
.gr-48{grid-row-start:48}
.gr-49{grid-row-start:49}
.gr-50{grid-row-start:50}
.gs-1{grid-row-end:span 1}
.gs-2{grid-row-end:span 2}
.gs-3{grid-row-end:span 3}
.gs-4{grid-row-end:span 4}
.gs-5{grid-row-end:span 5}
.gs-6{grid-row-end:span 6}
.gs-7{grid-row-end:span 7}
.gs-8{grid-row-end:span 8}
.gs-9{grid-row-end:span 9}
.gs-10{grid-row-end:span 10}
.gs-11{grid-row-end:span 11}
.gs-12{grid-row-end:span 12}
.gs-13{grid-row-end:span 13}
.gs-14{grid-row-end:span 14}
.gs-15{grid-row-end:span 15}
.gs-16{grid-row-end:span 16}
.gs-17{grid-row-end:span 17}
.gs-18{grid-row-end:span 18}
.gs-19{grid-row-end:span 19}
.gs-20{grid-row-end:span 20}
.gs-21{grid-row-end:span 21}
.gs-22{grid-row-end:span 22}
.gs-23{grid-row-end:span 23}
.gs-24{grid-row-end:span 24}
.gs-25{grid-row-end:span 25}
.gs-26{grid-row-end:span 26}
.gs-27{grid-row-end:span 27}
.gs-28{grid-row-end:span 28}
.gs-29{grid-row-end:span 29}
.gs-30{grid-row-end:span 30}
.gs-31{grid-row-end:span 31}
.gs-32{grid-row-end:span 32}
.gs-33{grid-row-end:span 33}
.gs-34{grid-row-end:span 34}
.gs-35{grid-row-end:span 35}
.gs-36{grid-row-end:span 36}
.gs-37{grid-row-end:span 37}
.gs-38{grid-row-end:span 38}
.gs-39{grid-row-end:span 39}
.gs-40{grid-row-end:span 40}
.gs-41{grid-row-end:span 41}
.gs-42{grid-row-end:span 42}
.gs-43{grid-row-end:span 43}
.gs-44{grid-row-end:span 44}
.gs-45{grid-row-end:span 45}
.gs-46{grid-row-end:span 46}
.gs-47{grid-row-end:span 47}
.gs-48{grid-row-end:span 48}

/* ========================================================== pagamenti */

.contenuto.largo { max-width: none; }
.filtri-pagamenti {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
  align-items: end;
  gap: .75rem 1rem;
  padding: 1rem;
  background: var(--carta);
  border-radius: var(--raggio);
  margin-bottom: 1rem;
}
.filtri-pagamenti .campo { min-width: 0; }
.spunta-filtro { align-self: center; padding-top: 1.4rem; }
.bottoni-filtro { display: flex; align-items: center; gap: 1rem; }
.bottoni-filtro button { margin: 0; }

.riepilogo-pagamenti { display: flex; flex-wrap: wrap; gap: .5rem 2rem; margin: 0 0 .75rem; }
.riepilogo-pagamenti p { margin: 0; }
.riepilogo-pagamenti strong { font-family: var(--f-titoli); font-size: 1.15rem; }
.riepilogo-pagamenti .da-incassare strong { color: var(--errore); }

.tabella-pagamenti { font-size: .9rem; }
.tabella-pagamenti th, .tabella-pagamenti td { padding: .45rem .5rem; white-space: nowrap; }
.tabella-pagamenti thead th { white-space: normal; line-height: 1.2; vertical-align: bottom; }
.tabella-pagamenti td.nome { max-width: 13rem; overflow: hidden; text-overflow: ellipsis; }
.tabella-pagamenti td.comune { max-width: 9rem; overflow: hidden; text-overflow: ellipsis; }
.tabella-pagamenti td.mail { max-width: 11rem; overflow: hidden; text-overflow: ellipsis; }
/* il nome resta visibile quando si scorre la tabella in orizzontale */
.tabella-pagamenti td.nome, .tabella-pagamenti thead th:first-child, .tabella-pagamenti tfoot th:first-child {
  position: sticky; left: 0; z-index: 1; background: var(--carta); box-shadow: inset -1px 0 0 #E1E5D8;
}
.tabella-pagamenti thead th:first-child { z-index: 2; }
.tabella-pagamenti tbody tr:hover td.nome { background: #F3F5EE; }
.tabella-pagamenti thead th { position: sticky; top: 0; background: var(--carta); box-shadow: inset 0 -1px 0 #C9CFBA; }
.tabella-pagamenti thead th a { color: var(--grigio); text-decoration: none; }
.tabella-pagamenti thead th a:hover { color: var(--oliva); text-decoration: underline; }
.tabella-pagamenti thead th[aria-sort="ascending"] a,
.tabella-pagamenti thead th[aria-sort="descending"] a { color: var(--inchiostro); }
.tabella-pagamenti td.nome a { font-weight: 600; text-decoration: none; }
.tabella-pagamenti td.nome a:hover { text-decoration: underline; }
.tabella-pagamenti td.netto, .tabella-pagamenti tfoot .netto { font-weight: 700; }
.tabella-pagamenti td.no { color: var(--errore); font-weight: 600; }
.tabella-pagamenti td.si { color: var(--ok); }
.tabella-pagamenti tfoot th, .tabella-pagamenti tfoot td {
  border-top: 2px solid var(--inchiostro);
  border-bottom: 0;
  font-weight: 600;
  background: #F3F5EE;
}
.tabella-pagamenti input[type="checkbox"] { width: 1.15rem; height: 1.15rem; accent-color: var(--oliva); }

.barra-pagate {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: .75rem 1rem;
  margin: 1.25rem 0 0;
  padding: 1rem;
  border: 0;
  background: var(--carta);
  border-radius: var(--raggio);
}
.barra-pagate legend { float: left; width: 100%; font-weight: 600; margin-bottom: .25rem; }
.azioni-selezione { display: flex; flex-wrap: wrap; gap: 1rem; align-items: stretch; }
.azioni-selezione .barra-pagate { flex: 1 1 24rem; margin-top: 0; }
.azioni-selezione .barra-pagate .nota { flex-basis: 100%; }
.selezione { margin: 1rem 0 .5rem; font-weight: 600; }
.tabella-pagamenti td.inviata { color: var(--ok); font-size: .85rem; }
.barra-pagate .campo { min-width: 11rem; }
.barra-pagate button { margin: 0; }
.solo-stampa { display: none; }

@page { size: A4 landscape; margin: 10mm; }
@media print {
  .non-stampare, .riepilogo-pagamenti .da-incassare { display: none !important; }
  .solo-stampa { display: block; font-weight: 600; margin: 0 0 3mm; }
  .contenuto { padding: 0; }
  .intestazione-pagina h1 { font-size: 14pt; }
  .tabella-pagamenti { font-size: 8pt; }
  .tabella-pagamenti th, .tabella-pagamenti td { padding: 1mm 1.5mm; }
  .tabella-pagamenti thead th { position: static; }
  .tabella-pagamenti a { color: #000; text-decoration: none; }
  .tabella-scorre { overflow: visible; }
  .tabella-pagamenti thead { display: table-header-group; }
}

/* ======================================================== statistiche */

.filtro-attivo { margin: 0 0 1rem; }
.numeri {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
  gap: .75rem;
  margin: 0 0 2rem;
}
.numeri > div {
  display: flex;
  flex-direction: column;
  padding: .9rem 1rem;
  background: var(--carta);
  border-radius: var(--raggio);
  font-size: .88rem;
  color: var(--grigio);
}
.numeri .numero {
  font-family: var(--f-titoli);
  font-size: 1.6rem;
  font-weight: 600;
  line-height: 1.1;
  color: var(--inchiostro);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.numeri .evidenza { background: var(--oliva-scura); color: #DDE3C8; }
.numeri .evidenza .numero { color: var(--olio); }

.grafico-blocco { max-width: 64rem; }
.grafico-blocco h3 { font-family: var(--f-titoli); font-size: 1.05rem; margin: 1.5rem 0 .5rem; }
.lettura { max-width: 44rem; margin: 0 0 .75rem; }
.grafico { display: block; width: 100%; height: auto; background: var(--carta); border-radius: var(--raggio); }
.g-griglia { stroke: #E1E5D8; stroke-width: 1; }
.g-asse-linea { stroke: #9CA487; stroke-width: 1; }
.g-asse { font-family: var(--f-testo); font-size: 12px; fill: var(--grigio); }
.g-unita { font-family: var(--f-testo); font-size: 12px; font-weight: 600; fill: var(--grigio); }
.g-barra { fill: #8C9A5B; }
.g-barra:hover { fill: var(--oliva); }
.g-linea { fill: none; stroke: #B8860B; stroke-width: 2.5; stroke-linejoin: round; }
.g-linea-punto { fill: #B8860B; stroke: #fff; stroke-width: 1; }
.g-media { fill: none; stroke: var(--oliva-scura); stroke-width: 2; stroke-dasharray: 6 4; }
.g-dispersione { fill: #8C9A5B; fill-opacity: .7; stroke: var(--oliva-scura); stroke-width: .5; }
.g-dispersione:hover { fill: var(--oliva-scura); fill-opacity: 1; }
.g-tendenza { stroke: #B8860B; stroke-width: 2.5; }
.legenda { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .6rem; font-size: .85rem; color: var(--grigio); margin: .5rem 0; }
.legenda span { display: inline-block; width: 1.4rem; height: .6rem; margin-left: .6rem; }
.legenda span:first-child { margin-left: 0; }
.legenda .l-barra { background: #8C9A5B; }
.legenda .l-linea { height: 3px; background: #B8860B; }
.legenda .l-media { height: 0; border-top: 2px dashed var(--oliva-scura); }
.legenda .l-punto { width: .6rem; height: .6rem; border-radius: 50%; background: #B8860B; }
.dati-grafico { margin-top: .75rem; }
.dati-grafico summary { cursor: pointer; font-size: .9rem; }
.riga-attiva td { font-weight: 700; background: #EEF2E2; }

@media print {
  .grafico-blocco { break-inside: avoid; }
  .dati-grafico { display: none; }
}

/* ============================================================= backup */

.backup-ora {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem 2rem;
  max-width: 60rem;
  padding: 1.25rem 1.5rem;
  margin-bottom: 2rem;
  background: var(--carta);
  border-left: 5px solid var(--oliva);
  border-radius: var(--raggio);
}
.backup-ora > div { flex: 1 1 24rem; }
.backup-ora p { margin: 0 0 .4rem; }
button.grande { font-size: 1.05rem; padding: .75rem 1.6rem; margin: 0; }
form.in-linea { display: inline; margin-left: 1rem; }
button.pericolo-link { color: var(--errore); }
code { font-size: .9em; background: #EEF0E8; padding: .05rem .3rem; border-radius: 3px; }

/* ============================================================ elenchi */

.gestisci-elenco { font-size: .82rem; align-self: flex-start; }
.voce-modifica input[name="extra"].extra-importo { flex: 0 1 7rem; }
.voce-modifica .unita { align-self: center; }

/* casella "pagata": il testo cambia con lo stato */
.stato-pagamento { align-items: center; min-height: 2.75rem; font-weight: 600; }
.stato-pagamento input { width: 1.3rem; height: 1.3rem; margin: 0; }
.stato-pagamento .se-no { color: var(--errore); }
.stato-pagamento .se-si { color: var(--ok); }
.stato-pagamento input:checked ~ .se-no,
.stato-pagamento input:not(:checked) ~ .se-si { display: none; }
.aggiunta-rapida { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .6rem; margin-top: .4rem; }
.aggiunta-rapida[hidden] { display: none; }
.aggiunta-rapida input { flex: 1 1 10rem; min-width: 0; }
.aggiunta-rapida button { margin: 0; min-height: 2.4rem; padding: .3rem .9rem; }
.aggiunta-rapida .errore { flex-basis: 100%; }
.aggiunta-rapida .errore:empty { display: none; }

.elenco { max-width: 56rem; }
.voci { list-style: none; margin: 0 0 1rem; padding: 0; background: var(--carta); border-radius: var(--raggio); }
.voce {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem 1rem;
  padding: .6rem .85rem;
  border-bottom: 1px solid #E1E5D8;
}
.voce:last-child { border-bottom: 0; }
.voce-modifica { display: flex; flex-wrap: wrap; gap: .5rem; flex: 1 1 22rem; }
.voce-modifica input[name="nome"] { flex: 1 1 12rem; }
.voce-modifica input[name="extra"] { flex: 1 1 14rem; }
.voce-modifica button, .voce-nuova button { margin: 0; }
.voce .usi { font-size: .85rem; color: var(--grigio); min-width: 6rem; }
.voce-ordine button { font-size: 1rem; padding: 0 .3rem; text-decoration: none; }
.voce-ordine button:disabled { opacity: .3; cursor: default; }
.voce-elimina { font-size: .85rem; }
details.voce-elimina summary { cursor: pointer; color: var(--errore); text-decoration: underline; }
details.voce-elimina[open] { flex-basis: 100%; }
details.voce-elimina form { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; margin-top: .5rem;
  padding: .6rem .75rem; background: #FBF1EF; border-radius: var(--raggio); }
.voce-elimina label { font-weight: 400; font-size: .85rem; }
.voce-elimina select { min-height: 2.4rem; width: auto; font-size: .9rem; }
.voce-elimina button.pericolo { margin: 0; min-height: 2.4rem; padding: .3rem 1rem; }
.voce-nuova { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; }
.voce-nuova input { flex: 1 1 12rem; max-width: 22rem; }

/* ======================================================= dati azienda */

.logo-azienda { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 1.25rem; }
.logo-azienda img {
  width: 8rem; height: 8rem; object-fit: contain;
  padding: .5rem; background: #fff; border: 1px solid #C9CFBA; border-radius: var(--raggio);
}
.logo-azienda .campo { flex: 1 1 18rem; }
.logo-azienda input[type="file"] { font: inherit; }

/* ================================================ import anagrafiche */

.testo-guida { max-width: 48rem; }
.testo-guida ul { padding-left: 1.2rem; }
.testo-guida li { margin-bottom: .35rem; }
.numeri-import { max-width: 56rem; }
.numeri-import .con-errori .numero { color: var(--errore); }
.dettagli-import { max-width: 56rem; margin: 0 0 1rem; padding: .6rem .9rem; background: var(--carta); border-radius: var(--raggio); }
.dettagli-import summary { cursor: pointer; font-weight: 600; }
.dettagli-import ul { margin: .5rem 0 0; padding-left: 1.2rem; max-height: 22rem; overflow: auto; }
.errori-import summary { color: var(--errore); }
.stagione-pagata { margin-top: 2rem; }
.stagione-pagata .modulo { margin-top: .75rem; }

/* ============================================== finestra di conferma */

.finestra-conferma {
  width: min(28rem, calc(100vw - 2rem));
  padding: 0;
  border: 0;
  border-radius: 12px;
  background: var(--carta);
  color: var(--inchiostro);
  box-shadow: 0 24px 60px rgba(30, 37, 9, .28), 0 2px 8px rgba(30, 37, 9, .12);
  font-family: var(--f-testo);
}
.finestra-conferma[open] { display: flex; gap: 1rem; padding: 1.5rem 1.5rem 1.25rem; animation: finestra-entra .16s ease-out; }
.finestra-conferma::backdrop { background: rgba(35, 43, 23, .45); backdrop-filter: blur(2px); }
.finestra-icona {
  flex: none;
  display: grid;
  place-items: center;
  width: 2.6rem;
  height: 2.6rem;
  border-radius: 50%;
  background: #E4EBCF;
  color: var(--oliva);
  font-family: var(--f-titoli);
  font-size: 1.35rem;
  font-weight: 700;
}
.finestra-pericolo .finestra-icona { background: #F7E4E1; color: var(--errore); }
.finestra-corpo { flex: 1; min-width: 0; }
.finestra-corpo h2 { margin: .2rem 0 .4rem; font-size: 1.2rem; }
.finestra-corpo p { margin: 0 0 1.25rem; line-height: 1.5; }
.finestra-pulsanti { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .6rem; }
.finestra-pulsanti button { margin: 0; min-width: 6.5rem; white-space: nowrap; }
button.pericolo-pieno { background: var(--errore); color: #fff; }
button.pericolo-pieno:hover { background: #7E2014; }
@keyframes finestra-entra { from { opacity: 0; transform: translateY(8px) scale(.98); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .finestra-conferma[open] { animation: none; } }
@media (max-width: 480px) {
  .finestra-conferma[open] { flex-direction: column; align-items: flex-start; }
  .finestra-pulsanti { width: 100%; }
  .finestra-pulsanti button { flex: 1 1 auto; white-space: normal; }
}

/* ================================================ verifica in due passaggi */

.scheda-link {
  display: flex; align-items: center; gap: 1rem; max-width: 40rem; margin: 0 0 1.75rem;
  padding: 1rem 1.25rem; background: var(--carta); border-radius: 10px; color: var(--inchiostro); text-decoration: none;
  border: 1px solid #DDE2D1;
}
.scheda-link:hover { border-color: var(--oliva); color: var(--inchiostro); }
.scheda-link > span:nth-of-type(1) { flex: 1; display: flex; flex-direction: column; }
.scheda-link .freccia { font-size: 1.6rem; color: var(--grigio); }
.stato-2fa { display: flex; align-items: flex-start; gap: 1rem; max-width: 44rem; }
section.stato-2fa { margin: 0 0 1.5rem; padding: 1.1rem 1.25rem; background: var(--carta); border-radius: 10px; }
.stato-2fa .icona { flex: none; width: 2.2rem; height: 2.2rem; padding: .45rem; border-radius: 50%; background: #EEE7D3; color: #8A5A00; box-sizing: content-box; }
.stato-2fa.attivo .icona { background: #DDE8D2; color: var(--ok); }
.stato-2fa p { margin: 0 0 .25rem; }
.stato-2fa-titolo { font-family: var(--f-titoli); font-size: 1.15rem; font-weight: 600; }
.due-colonne { display: grid; grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); gap: 1rem; max-width: 60rem; }
.riquadro { padding: 1.1rem 1.25rem; background: var(--carta); border-radius: 10px; }
.riquadro h2 { font-size: 1.15rem; margin: 0 0 .25rem; }
.passi { list-style: none; counter-reset: passo; margin: 0; padding: 0; max-width: 46rem; }
.passi > li { counter-increment: passo; position: relative; padding: 0 0 1.75rem 3rem; }
.passi > li::before {
  content: counter(passo); position: absolute; left: 0; top: -.1rem; display: grid; place-items: center;
  width: 2rem; height: 2rem; border-radius: 50%; background: var(--oliva); color: #fff; font-weight: 700;
}
.passi h2 { font-size: 1.15rem; margin: 0 0 .5rem; }
.qr-e-chiave { display: flex; flex-wrap: wrap; gap: 1.25rem; align-items: center; }
.qr { width: 12rem; height: 12rem; padding: .5rem; background: #fff; border: 1px solid #DDE2D1; border-radius: 10px; }
.qr svg { display: block; width: 100%; height: 100%; }
.chiave-segreta code { font-size: 1.05rem; letter-spacing: .05em; padding: .3rem .5rem; background: #fff; border: 1px solid #DDE2D1; }
.campo-codice-grande input, .campo-codice { font-size: 1.4rem !important; letter-spacing: .25em; text-align: center; max-width: 12rem !important; }
.riquadro-evidenza { max-width: 44rem; margin: 0 0 1.75rem; padding: 1.25rem 1.5rem; background: #FFF8E1; border: 1px solid #E8CF7A; border-radius: 10px; }
.riquadro-evidenza h2 { margin: 0 0 .5rem; font-size: 1.2rem; }
.elenco-codici { columns: 2; margin: .75rem 0 1rem; padding-left: 1.5rem; }
.elenco-codici code { font-size: 1.05rem; letter-spacing: .05em; background: transparent; }
.icona-grande .icona { width: 3rem; height: 3rem; color: var(--oliva); }
.aiuto-codice summary { cursor: pointer; }
.disattiva-2fa { display: flex; gap: .5rem; justify-content: flex-end; }
.disattiva-2fa input { width: 11rem; min-height: 2.4rem; }
.disattiva-2fa button { margin: 0; min-height: 2.4rem; padding: .3rem .9rem; }
@media print {
  .codici-recupero { border: 1px solid #000; background: #fff; }
  .codici-recupero .azioni-modulo, .briciole, .attivazione-2fa, .stato-2fa, .due-colonne, form { display: none !important; }
}

/* ============================================ primi passi (nuova installazione) */

.primi-passi { max-width: 56rem; margin: 0 0 2rem; padding: 1.25rem 1.5rem; background: var(--carta); border-radius: 12px; border: 1px solid #DDE2D1; }
.primi-passi-testa { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; }
.primi-passi h2 { margin: 0 0 .2rem; }
.primi-passi-testa button { margin: 0; }
.barra-avanzamento { height: 6px; margin: .9rem 0 1rem; background: #E4E8DA; border-radius: 99px; overflow: hidden; }
.barra-avanzamento span { display: block; height: 100%; background: var(--oliva); border-radius: 99px; }
.avanzamento-0 { width: 0%; }
.avanzamento-10 { width: 10%; }
.avanzamento-20 { width: 20%; }
.avanzamento-30 { width: 30%; }
.avanzamento-40 { width: 40%; }
.avanzamento-50 { width: 50%; }
.avanzamento-60 { width: 60%; }
.avanzamento-70 { width: 70%; }
.avanzamento-80 { width: 80%; }
.avanzamento-90 { width: 90%; }
.avanzamento-100 { width: 100%; }
.elenco-passi { list-style: none; margin: 0; padding: 0; display: grid; gap: .4rem; }
.elenco-passi a { display: flex; align-items: center; gap: .9rem; padding: .7rem .8rem; border-radius: 8px; color: var(--inchiostro); text-decoration: none; }
.elenco-passi a:hover { background: #F0F3E8; }
.elenco-passi a > span:nth-of-type(2) { display: flex; flex-direction: column; }
.spunta-passo { flex: none; display: grid; place-items: center; width: 1.7rem; height: 1.7rem; border-radius: 50%; border: 2px solid #B9C29B; color: #fff; font-weight: 700; }
.elenco-passi .fatto .spunta-passo { background: var(--ok); border-color: var(--ok); }
.elenco-passi .fatto strong { color: var(--grigio); text-decoration: line-through; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* ================================================== carico del giorno */

.carico { max-width: 60rem; margin: 0 0 1.5rem; padding: 1.1rem 1.25rem; background: var(--carta); border-radius: 10px; border: 1px solid #DDE2D1; border-left: 5px solid var(--ok); }
.carico.in-eccesso { border-left-color: var(--errore); background: #FCF1EF; border-color: #EBC6C0; }
.carico-numeri { display: flex; flex-wrap: wrap; gap: .75rem 2.5rem; }
.carico-numeri > div { display: flex; flex-direction: column; }
.carico-numeri .numero { font-family: var(--f-titoli); font-size: 1.6rem; font-weight: 600; line-height: 1.1; font-variant-numeric: tabular-nums; }
.carico-numeri span:not(.numero) { font-size: .85rem; color: var(--grigio); }
.carico-totale .numero { font-size: 2.2rem; color: var(--oliva-scura); }
.in-eccesso .carico-totale .numero { color: var(--errore); }
.carico-barra { height: 8px; margin: .9rem 0 .7rem; background: #E4E8DA; border-radius: 99px; overflow: hidden; }
.carico-barra span { display: block; height: 100%; background: var(--ok); }
.in-eccesso .carico-barra span { background: var(--errore); }
.carico-avviso { margin: 0 0 .4rem; color: var(--errore); font-size: 1.05rem; }
.carico-ok { margin: 0 0 .4rem; color: var(--ok); font-weight: 600; }
.stimato { color: var(--grigio); font-style: italic; }

/* ============================================================ sicurezza */

.sicurezza { max-width: 48rem; margin: 0 0 2rem; padding: 1.1rem 1.25rem; background: var(--carta); border-radius: 10px; border: 1px solid #DDE2D1; }
.sicurezza h2 { margin: 0 0 .6rem; }
.controlli { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: .5rem; }
.controlli li { display: flex; gap: .75rem; align-items: flex-start; }
.controlli li > span:last-child { display: flex; flex-direction: column; }
.controlli .segno { flex: none; display: grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 50%; font-weight: 700; color: #fff; background: var(--ok); }
.controllo-attenzione .segno { background: var(--errore); }
.controllo-attenzione strong { color: var(--errore); }
.controllo-info .segno { background: var(--grigio); font-family: Georgia, serif; font-style: italic; }
.sicurezza form button { margin: 0 0 .75rem; }

/* ======================================================= contaminazioni */

.contaminazioni h3 { margin: 1.5rem 0 .5rem; }
.numeri-piccoli .numero { font-size: 1.6rem; }
.barra-perc { display: inline-block; vertical-align: middle; width: 7rem; height: .6rem; background: #E4E8DA; border-radius: 99px; overflow: hidden; }
.barra-perc span { display: block; height: 100%; background: #B5651D; }
td.con-barra { white-space: nowrap; font-variant-numeric: tabular-nums; }
tr.zona-critica td:first-child { font-weight: 700; color: var(--errore); }
.perc-0 { width: 0%; }
.perc-5 { width: 5%; }
.perc-10 { width: 10%; }
.perc-15 { width: 15%; }
.perc-20 { width: 20%; }
.perc-25 { width: 25%; }
.perc-30 { width: 30%; }
.perc-35 { width: 35%; }
.perc-40 { width: 40%; }
.perc-45 { width: 45%; }
.perc-50 { width: 50%; }
.perc-55 { width: 55%; }
.perc-60 { width: 60%; }
.perc-65 { width: 65%; }
.perc-70 { width: 70%; }
.perc-75 { width: 75%; }
.perc-80 { width: 80%; }
.perc-85 { width: 85%; }
.perc-90 { width: 90%; }
.perc-95 { width: 95%; }
.perc-100 { width: 100%; }

/* =========================================================== riepilogo SIAN */

.sian-testa { max-width: 60rem; margin: 0 0 1rem; }
.sian-giorno h2 { margin-bottom: .1rem; }
.codice-sian { display: inline-block; min-width: 2.2rem; padding: .1rem .4rem; border-radius: 4px; background: #E4EBCF; color: var(--oliva-scura);
  font-weight: 700; text-align: center; font-family: ui-monospace, Consolas, monospace; }
.codice-t3 { background: #F6E7B5; color: #6B4E00; }
.tabella-sian td.cf { font-family: ui-monospace, Consolas, monospace; font-size: .9rem; }
.testo-errore { color: var(--errore); font-weight: 600; }
.sian-file { max-width: 62rem; }
.sian-passo { margin: 0 0 1.2rem; padding: 1rem 1.1rem; background: var(--carta); border: 1px solid #DDE2D1; border-radius: 10px; }
.sian-passo h3 { display: flex; align-items: center; gap: .5rem; margin: 0 0 .5rem; }
.sian-num { display: inline-grid; place-items: center; width: 1.7rem; height: 1.7rem; border-radius: 50%; background: var(--oliva); color: #fff; font-size: .9rem; }
.sian-stato form { display: inline; }
.sian-cliente { margin: 1rem 0; }
.tabella-cronologia td.ora { font-variant-numeric: tabular-nums; white-space: nowrap; color: var(--grigio); }
.tabella-cronologia tr.riga-giorno th { padding-top: 1rem; background: transparent; color: var(--oliva-scura); font-size: .95rem; text-transform: none; letter-spacing: 0; }
.azione-cron { display: inline-block; padding: .05rem .45rem; border-radius: 4px; background: #EEF1E6; font-size: .85rem; white-space: nowrap; }
.gruppo-accessi .azione-cron { background: #E3ECF6; }
.tabella-cronologia tr .azione-cron:is([class]) { }
.azione-fallita { background: #F6D9D4 !important; color: var(--errore); font-weight: 600; }
.gruppo-pagamenti .azione-cron { background: #F6EEDB; }
.gruppo-config .azione-cron, .gruppo-backup .azione-cron { background: #F3E4E1; }
.gruppo-sian .azione-cron { background: #E4EBCF; }
.paginazione { display: flex; gap: 1rem; align-items: center; justify-content: center; margin: 1rem 0; }
@media print { .sian-giorno { break-inside: avoid-page; } }

/* ============================================== statistiche condivise */

.condivisione { max-width: 56rem; margin: 0 0 1rem; padding: 1rem 1.2rem; background: var(--carta); border-radius: 10px; border: 1px solid #DDE2D1; }
.condivisione.appena-creata { border-color: var(--oliva); box-shadow: 0 0 0 3px #E4EBCF; }
.condivisione.non-attiva { opacity: .7; }
.condivisione-testa { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .75rem; margin-bottom: .6rem; }
.condivisione-testa .nota { flex-basis: 100%; }
.condivisione-link, .condivisione-mail { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 .5rem; }
.condivisione-link input { flex: 1 1 20rem; font-family: ui-monospace, Consolas, monospace; font-size: .85rem; }
.condivisione-mail input { flex: 1 1 16rem; width: auto; }
.condivisione-link button, .condivisione-link .bottone, .condivisione-mail button { margin: 0; }
.condivisione-azioni { margin: 0; }
body.condivisa { background: #EEF0E8; }
.testa-condivisa { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .5rem 1rem;
  padding: .9rem 2rem; background: linear-gradient(90deg, var(--lato) 0%, var(--lato-2) 100%); color: #fff; }
.testa-condivisa .marchio-testo small { color: var(--olio); }
.condivisa-per { color: var(--lato-testo); }
.contenuto-condiviso { margin: 0 auto; }
@media print { .testa-condivisa { background: #fff; color: #000; border-bottom: 2px solid #000; } }

/* ================================================================ utenti */

.tabella-utenti .riga-gestione td { padding: 0; border: 0; }
.tabella-utenti tr.utente-disattivato td { color: var(--grigio); }
.gestione-utente[open] { padding: .75rem .5rem 1.25rem; background: #F0F3E8; }
.gestione-griglia { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: .75rem; }
.gestione-griglia .riquadro { display: flex; flex-direction: column; gap: .35rem; background: #fff; }
.gestione-griglia h3 { margin: 0 0 .3rem; font-size: 1rem; }
.gestione-griglia label { font-weight: 600; font-size: .85rem; }
.gestione-griglia button { margin: .3rem 0 0; align-self: flex-start; }
.gestione-griglia .azioni-modulo { display: flex; flex-wrap: wrap; gap: .5rem; }
.conferma-password { margin-top: .75rem; padding-top: .75rem; border-top: 1px solid #DDE2D1; }

/* ======================================================= turno nel calendario */

.turno { display: inline-block; margin-top: .2rem; padding: .05rem .4rem; border-radius: 99px; font-size: .72rem; font-weight: 700;
  background: #DDE8D2; color: var(--ok); font-variant-numeric: tabular-nums; }
.turno-quasi { background: #F6E7B5; color: #6B4E00; }
.turno-pieno { background: var(--errore); color: #fff; }
.giorno-testa.giorno-pieno { box-shadow: inset 0 -3px 0 var(--errore); }
.carico-hint { grid-column: 1 / -1; margin: 0; }
.carico-hint.liv-pieno { color: var(--errore); font-weight: 600; }
.carico-hint.liv-quasi { color: #6B4E00; }
.carico-hint.liv-libero { color: var(--ok); font-weight: 600; }
.stato-cassa { max-width: 56rem; }
.storico-socio { margin: 1.5rem 0 2rem; }
.resa-su, .resa-giu { margin-left: .35rem; font-size: .78rem; font-weight: 700; }
.resa-su { color: var(--ok); }
.resa-giu { color: var(--errore); }
.l-media { display: inline-block; width: 1.4rem; border-top: 2px dashed #6B6F5E; vertical-align: middle; margin: 0 .3rem 0 .8rem; }
.g-media { fill: none; stroke: #6B6F5E; stroke-width: 1.6; stroke-dasharray: 5 4; }

/* ============================================================ tabellone */

body.tabellone { margin: 0; min-height: 100vh; background: #1A2108; color: #F3F5EE; }
.tb { display: flex; flex-direction: column; min-height: 100vh; }
.tb-testa { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1rem clamp(1rem, 3vw, 2.5rem);
  background: linear-gradient(90deg, var(--lato) 0%, var(--lato-2) 100%); border-bottom: 3px solid var(--olio); }
.tb-testa .marchio-testo strong { font-size: clamp(1rem, 2vw, 1.5rem); }
.tb-testa .marchio-testo small { color: var(--olio); }
.tb-ora { display: flex; flex-direction: column; align-items: flex-end; font-variant-numeric: tabular-nums; }
.tb-ora span { font-size: clamp(1.6rem, 4vw, 3rem); font-weight: 700; line-height: 1; }
.tb-ora small { color: var(--lato-testo); font-size: clamp(.75rem, 1.4vw, 1rem); }
.tb-corpo { flex: 1; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(1rem, 3vw, 2.5rem);
  padding: clamp(1rem, 3vw, 2.5rem); }
.tb-adesso { display: flex; flex-direction: column; justify-content: center; padding: clamp(1.25rem, 4vw, 3rem); border-radius: 18px;
  background: radial-gradient(circle at 30% 20%, #3A4A12 0%, #263010 70%); border: 2px solid var(--olio); box-shadow: 0 0 40px rgba(227, 181, 44, .15); }
.tb-etichetta { margin: 0 0 1rem; font-size: clamp(.9rem, 1.8vw, 1.3rem); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--olio); }
.tb-etichetta::before { content: ''; display: inline-block; width: .7em; height: .7em; margin-right: .5em; border-radius: 50%; background: #6BD16B;
  box-shadow: 0 0 0 0 rgba(107, 209, 107, .7); animation: tb-pulsa 2s infinite; vertical-align: .05em; }
@keyframes tb-pulsa { 0% { box-shadow: 0 0 0 0 rgba(107, 209, 107, .6); } 70% { box-shadow: 0 0 0 .7em rgba(107, 209, 107, 0); } 100% { box-shadow: 0 0 0 0 rgba(107, 209, 107, 0); } }
@media (prefers-reduced-motion: reduce) { .tb-etichetta::before { animation: none; } }
.tb-scheda { margin: 0; font-size: clamp(1.4rem, 3.5vw, 2.6rem); color: var(--lato-testo); font-weight: 600; }
.tb-nome { margin: .2rem 0 .6rem; font-size: clamp(2.2rem, 7vw, 5.5rem); font-weight: 800; line-height: 1.05; color: #fff; word-break: break-word; }
.tb-quintali { margin: 0; font-size: clamp(1.8rem, 5vw, 4rem); font-weight: 700; color: var(--olio); font-variant-numeric: tabular-nums; }
.tb-vuoto { color: var(--lato-tenue); font-size: clamp(1.3rem, 3vw, 2.2rem); }
.tb-quintali { display: flex; flex-wrap: wrap; align-items: baseline; gap: .2rem 1.2rem; }
.tb-fine { font-size: .55em; font-weight: 500; color: var(--lato-testo); }
.tb-fine strong { color: #fff; font-weight: 700; }
.tb-coda h2 { margin: 0 0 .8rem; color: var(--lato-testo); font-size: clamp(1rem, 2vw, 1.5rem); letter-spacing: .1em; text-transform: uppercase; }
.tb-coda ol { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.tb-coda li { display: flex; align-items: center; gap: .9rem; padding: .7rem 1rem; border-radius: 10px; background: rgba(255, 255, 255, .06); }
.tb-coda li:first-child { background: rgba(227, 181, 44, .14); }
.tb-pos { flex: none; display: grid; place-items: center; width: 2.2rem; height: 2.2rem; border-radius: 50%; background: rgba(255, 255, 255, .1);
  font-weight: 700; font-size: 1.1rem; }
.tb-chi { flex: 1; display: flex; flex-direction: column; min-width: 0; font-size: clamp(1rem, 2.2vw, 1.5rem); }
.tb-chi span { color: var(--lato-testo); font-size: .85em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tb-q { display: flex; flex-direction: column; align-items: flex-end; font-weight: 700; font-size: clamp(1rem, 2.2vw, 1.5rem); color: var(--olio);
  font-variant-numeric: tabular-nums; white-space: nowrap; }
.tb-q small { color: var(--lato-testo); font-weight: 600; font-size: .7em; }
.tb-q small.tb-prenotato { color: var(--lato-tenue); font-weight: 400; font-size: .6em; }
.tb-q small.tb-anticipo { color: #9fd17a; }
.tb-avviso { display: flex; gap: clamp(.8rem, 2vw, 1.5rem); align-items: flex-start; margin: clamp(.6rem, 1.5vw, 1.1rem) clamp(1rem, 3vw, 2.5rem) 0;
  padding: clamp(.8rem, 1.6vw, 1.2rem) clamp(1.1rem, 3vw, 2.2rem); border-radius: 16px; background: #5C4A0E; border: 3px solid #E0B43A; color: #FFF6DA; }
.tb-avviso-fermo { background: #6B1D16; border-color: #F07A63; color: #FFEDEA; animation: tb-lampeggio 2.4s ease-in-out infinite; }
@keyframes tb-lampeggio { 50% { border-color: #FFC2B5; } }
@media (prefers-reduced-motion: reduce) { .tb-avviso-fermo { animation: none; } }
.tb-avviso-icona { font-size: clamp(2rem, 4vw, 3rem); line-height: 1; }
.tb-avviso p { margin: 0; }
.tb-avviso-titolo { font-weight: 800; text-transform: uppercase; letter-spacing: .08em; font-size: clamp(1.1rem, 2.2vw, 1.6rem); }
.tb-avviso-testo { margin-top: .25em !important; font-size: clamp(1rem, 1.9vw, 1.45rem); line-height: 1.35; }
.tb-avviso-ripresa { margin-top: .35em !important; font-size: clamp(.95rem, 1.7vw, 1.25rem); opacity: .95; }
.tb-sospesa { border-color: #F07A63 !important; }
.tb-sospesa .tb-etichetta { color: #F7A493; }
.tb-sospesa .tb-etichetta::before { background: #F07A63; animation: none; }
/* con l'avviso, e sugli schermi bassi (portatili), tutto deve stare in una schermata */
.tb.con-avviso .tb-nome { font-size: clamp(2rem, 5.5vw, 4.4rem); }
.tb.con-avviso .tb-adesso { padding: clamp(1rem, 3vw, 2.2rem); }
.tb.con-avviso .tb-qr-codice { width: clamp(6rem, 8vw, 8rem); }
.tb.con-avviso .tb-qr { padding-top: .8rem; }
.tb.con-avviso .tb-corpo { padding-top: clamp(.8rem, 2vw, 1.6rem); padding-bottom: clamp(.8rem, 2vw, 1.6rem); }
.tb.con-avviso .tb-coda li { padding-top: .5rem; padding-bottom: .5rem; }
@media (min-width: 761px) and (max-height: 860px) {
  .tb-testa { padding-top: .6rem; padding-bottom: .6rem; }
  .tb-corpo { padding-top: clamp(.6rem, 1.5vw, 1.2rem) !important; padding-bottom: clamp(.6rem, 1.5vw, 1.2rem) !important; }
  .tb-coda li { padding: .45rem .8rem; }
  .tb-coda ol { gap: .4rem; }
  .tb-nome { font-size: clamp(2rem, 5.5vw, 4.2rem); }
  .tb-qr-codice { width: clamp(5.5rem, 8vw, 7.5rem); }
  .tb-qr { padding-top: .6rem; }
  .tb-avviso { padding-top: .8rem; padding-bottom: .8rem; }
  .tb-piede { padding-top: .6rem; padding-bottom: .6rem; }
  .tb-q small { line-height: 1.15; }
  .tb-coda li { padding-top: .35rem; padding-bottom: .35rem; }
  .tb.con-avviso .tb-qr { display: none; }   /* sugli schermi bassi l'avviso ha la precedenza */
  .tb.con-avviso .tb-q small.tb-prenotato { display: none; }
  .tb.con-avviso .tb-nome { font-size: clamp(1.8rem, 4.5vw, 3.4rem); }
  .tb-testa .marchio-logo { width: 2.4rem; height: 2.4rem; }
  .tb-avviso-testo { font-size: 1.05rem; }
  .tb-avviso-icona { font-size: 2rem; }
  .tb.con-avviso .tb-coda h2 { margin-bottom: .4rem; }
}
.tb-altri { margin: .7rem 0 0; color: var(--lato-tenue); }
.tb-coda { display: flex; flex-direction: column; }
.tb-qr { display: flex; align-items: center; gap: 1rem; margin-top: auto; padding-top: 1.2rem; align-self: flex-end; }
.tb-qr-codice { flex: none; width: clamp(7rem, 11vw, 10rem); padding: .4rem; background: #fff; border-radius: 10px; }
.tb-qr-codice svg { display: block; width: 100%; height: auto; }
.tb-qr p { margin: 0; max-width: 12rem; color: var(--lato-testo); font-size: clamp(.85rem, 1.3vw, 1.05rem); line-height: 1.35; }
.tb-qr p strong { display: block; color: #fff; }
.tb-piede { display: flex; flex-wrap: wrap; gap: .5rem 2rem; padding: .9rem clamp(1rem, 3vw, 2.5rem); background: rgba(0, 0, 0, .25);
  font-size: clamp(.9rem, 1.6vw, 1.15rem); color: var(--lato-testo); }
.tb-piede strong { color: #fff; }
.tb-aggiornato { margin-left: auto; color: var(--lato-tenue); font-size: .85em; }
@media (max-width: 760px) {
  .tb-corpo { grid-template-columns: minmax(0, 1fr); }
  .tb-qr { display: none; }   /* sul telefono non serve */
  .tb-aggiornato { margin-left: 0; }
}
/* Molitura: scheda in molitura */
.in-molitura-adesso { background: #FFF6D9 !important; }
.btn-molitura { margin: 0; padding: .15rem .55rem; min-height: 0; font-size: .78rem; }
.avviso-orario { grid-column: 1 / -1; }
.avviso-orario p { margin: .2rem 0 .4rem; }
.orario-conflitto { color: var(--errore); font-weight: 600; font-size: .9rem; }
.orario-ok { color: var(--ok); }
.conferma-orario { grid-column: 1 / -1; color: var(--errore); font-weight: 600; }

/* ==================================================== prenotazione online */

body.prenota { margin: 0; background: #F3F5EE; }
.po-testa { display: flex; align-items: center; gap: .8rem; padding: .9rem 1.2rem; color: #fff;
  background: linear-gradient(90deg, var(--lato) 0%, var(--lato-2) 100%); border-bottom: 3px solid var(--olio); }
.po-testa > span:last-child { display: flex; flex-direction: column; }
.po-testa small { color: var(--olio); font-size: .8rem; letter-spacing: .04em; }
.po { max-width: 46rem; margin: 0 auto; padding: 1.2rem 1rem 2rem; }
.po h1 { margin: .3rem 0 .8rem; }
.po-avviso { padding: .8rem 1rem; border-left: 4px solid var(--olio); background: #FFF8E1; border-radius: 6px; }
.po-passi { display: flex; gap: .4rem; list-style: none; padding: 0; margin: 0 0 1rem; counter-reset: passo; font-size: .85rem; }
.po-passi li { flex: 1; counter-increment: passo; padding: .45rem .5rem; border-radius: 6px; background: #E4E8DA; color: var(--grigio); text-align: center; }
.po-passi li::before { content: counter(passo) ". "; font-weight: 700; }
.po-passi li.attivo { background: var(--oliva); color: #fff; font-weight: 600; }
.po-passi li.fatto { background: #CFDCB8; color: var(--oliva-scura); }
.po-riquadro { margin: 0 0 1rem; padding: 1rem 1.1rem; background: #fff; border-radius: 10px; border: 1px solid #DDE2D1; }
.po-riquadro h2 { margin: 0 0 .7rem; font-size: 1.1rem; }
.po-riga { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .7rem; margin-top: .5rem; }
.po-riga input { width: 7rem; font-size: 1.2rem; }
.po-riga button { margin: 0; }
.po-giorni { display: grid; grid-template-columns: repeat(auto-fill, minmax(5.2rem, 1fr)); gap: .5rem; }
.po-giorno { display: flex; flex-direction: column; align-items: center; padding: .5rem .3rem; border-radius: 8px; border: 2px solid #CFDCB8;
  background: #F6F9EF; color: var(--oliva-scura); text-decoration: none; line-height: 1.15; }
.po-giorno:hover, .po-giorno:focus-visible { border-color: var(--oliva); }
.po-giorno.scelto { background: var(--oliva); border-color: var(--oliva); color: #fff; }
.po-giorno.pieno { border-color: #E4E4E0; background: #F1F1EE; color: #9A9A94; }
.po-gs { font-size: .75rem; text-transform: uppercase; letter-spacing: .05em; }
.po-gn { font-size: 1.5rem; font-weight: 700; }
.po-gm { font-size: .8rem; }
.po-disp { margin-top: .2rem; font-size: .7rem; font-weight: 600; }
.po-orari { display: grid; grid-template-columns: repeat(auto-fill, minmax(4.6rem, 1fr)); gap: .45rem; }
.po-orario { padding: .6rem .3rem; border-radius: 8px; border: 2px solid #CFDCB8; background: #F6F9EF; color: var(--oliva-scura);
  text-align: center; font-weight: 700; font-size: 1.05rem; text-decoration: none; font-variant-numeric: tabular-nums; }
.po-orario:hover, .po-orario:focus-visible { border-color: var(--oliva); }
.po-orario.scelto { background: var(--oliva); border-color: var(--oliva); color: #fff; }
.po .modulo .campo input, .po .modulo .campo textarea { width: 100%; max-width: none; }
.po-riepilogo { margin: 0 0 1rem; padding: .6rem .8rem; background: #F6F9EF; border-radius: 6px; }
.po-invia { width: 100%; margin-top: 1rem; font-size: 1.1rem; padding: .8rem; }
.po-trappola { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.po-fatta { margin-top: 1rem; padding: 1.5rem; text-align: center; background: #fff; border-radius: 12px; border: 1px solid #DDE2D1; }
.po-spunta { display: inline-grid; place-items: center; width: 3.5rem; height: 3.5rem; margin: 0; border-radius: 50%; background: var(--ok);
  color: #fff; font-size: 2rem; font-weight: 700; }
.po-quando { font-size: 1.25rem; }
.po-piede { padding: 1rem; text-align: center; color: var(--grigio); font-size: .85rem; }
.evento-online { display: inline-block; margin-left: .25rem; padding: 0 .3rem; border-radius: 3px; background: var(--olio); color: #3A2C00;
  font-size: .62rem; font-weight: 700; vertical-align: middle; }

/* ============================================================ ricevuta */
/* Stessa impaginazione del PDF (app/ricevuta.php): A4, margini 15 mm. */

body.ricevuta { background: #D9DDD0; margin: 0; padding: 1.5rem 1rem 3rem; }
.comandi-stampa { max-width: 210mm; margin: 0 auto 1rem; display: flex; align-items: center; gap: .75rem 1rem; flex-wrap: wrap; }
.comandi-stampa .spazio { flex: 1; }
.comandi-stampa button, .comandi-stampa .bottone { margin: 0; }
.comandi-stampa.avviso { display: block; }
.invio-ricevuta { padding: .75rem 1rem; background: var(--carta); border-radius: var(--raggio); }
.invio-ricevuta label { font-weight: 600; }
.invio-ricevuta input { flex: 1 1 16rem; width: auto; }
.invio-fatto { flex-basis: 100%; }
.invio-scheda { margin: 0 0 1.25rem; padding: .85rem 1rem; background: var(--carta); border-radius: var(--raggio); max-width: 44rem; }
.invio-scheda label { display: block; margin-bottom: .35rem; }
.invio-riga { display: flex; flex-wrap: wrap; gap: .5rem; }
.invio-riga input { flex: 1 1 16rem; width: auto; }
.invio-riga button { margin: 0; }
.invio-scheda .nota { margin-top: .4rem; }

.foglio.rm {
  box-sizing: border-box;
  width: 210mm;
  min-height: 297mm;
  margin: 0 auto 1.5rem;
  padding: 15mm 15mm 20mm;
  position: relative;
  background: #fff;
  color: #111;
  font-family: "Segoe UI", Helvetica, Arial, sans-serif;
  font-size: 10pt;
  line-height: 1.4;
  page: ricevuta;
}
.rm p { margin: 0; }
.rm h2 {
  margin: 0 0 1mm;
  font-family: inherit;
  font-size: 7pt;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #5E6652;
}

.rm-testa {
  display: flex;
  justify-content: space-between;
  gap: 8mm;
  padding-bottom: 5mm;
  border-bottom: 0.8mm solid #4B5A1E;
}
.rm-emittente { display: flex; gap: 5mm; align-items: flex-start; font-size: 8.5pt; color: #5E6652; }
.rm-logo { max-width: 30mm; max-height: 24mm; object-fit: contain; }
.rm-azienda { font-size: 13pt; font-weight: 700; color: #2C3610; margin-bottom: 1mm !important; }
.rm-estremi { text-align: right; white-space: nowrap; }
.rm-tipo { font-size: 8pt; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #4B5A1E; }
.rm-numero { font-size: 20pt; font-weight: 700; line-height: 1.15; color: #2C3610; }
.rm-fiscale { font-size: 7.5pt; color: #5E6652; }

.rm-riquadri { display: grid; grid-template-columns: 1fr 1fr; gap: 4mm; margin: 6mm 0 8mm; }
.rm-riquadro { min-height: 34mm; padding: 3mm 4mm; background: #F3F5EE; font-size: 8.5pt; color: #333; }
.rm-titolo { font-size: 11pt; font-weight: 700; color: #111; margin-bottom: 1.5mm !important; }
.rm-pagata { color: #3F6B2A; }
.rm-da-pagare { color: #9E2A1C; }

.rm-righe { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.rm-righe th {
  padding: 0 0 2mm;
  font-size: 7.5pt;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #5E6652;
  text-align: left;
  border-bottom: .4mm solid #2C3610;
}
.rm-righe td { padding: 3mm 0; border-bottom: .2mm solid #D6DBCA; }
.rm-righe td:last-child { font-weight: 700; }
.rm-righe .num { text-align: right; white-space: nowrap; }

.rm-totali { margin: 3mm 0 0 auto; width: 90mm; font-variant-numeric: tabular-nums; }
.rm-totali > div { display: flex; justify-content: space-between; gap: 4mm; padding: 1.5mm 0; }
.rm-totali span { color: #5E6652; font-size: 9.5pt; }
.rm-totali .rm-netto {
  margin-top: 2mm;
  padding: 3.5mm 0;
  border-top: .5mm solid #2C3610;
  border-bottom: .5mm solid #2C3610;
  align-items: center;
}
.rm-totali .rm-netto span { color: #111; font-weight: 700; font-size: 10.5pt; }
.rm-totali .rm-netto strong { color: #2C3610; font-size: 16pt; }

.rm-olio { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2.25mm; margin-top: 10mm; }
.rm-olio > div { display: flex; flex-direction: column; padding: 2.5mm 3mm; background: #F3F5EE; }
.rm-olio span { font-size: 7pt; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #5E6652; }
.rm-olio strong { font-size: 13pt; color: #2C3610; }
.rm-nota-olio { margin-top: 1.5mm !important; font-size: 7.5pt; font-style: italic; color: #5E6652; }
.rm-note { margin-top: 6mm; font-size: 9pt; }

.rm-firma {
  position: absolute;
  right: 15mm;
  bottom: 30mm;
  width: 65mm;
  text-align: center;
  font-size: 8pt;
  color: #5E6652;
}
.rm-firma span { display: block; border-top: .2mm solid #777; margin-bottom: 1mm; }

@page ricevuta { size: A4 portrait; margin: 0; }
@media print {
  body.ricevuta { background: #fff; padding: 0; }
  .comandi-stampa { display: none !important; }
  .foglio.rm { margin: 0; break-after: page; }
  .foglio.rm:last-of-type { break-after: auto; }
  .rm-riquadro, .rm-olio > div { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
@media (max-width: 800px) {
  body.ricevuta { padding: .5rem; }
  .foglio.rm { width: 100%; min-height: 0; padding: 6mm 5mm 45mm; }
  .rm-testa { flex-direction: column; }
  .rm-estremi { text-align: left; }
  .rm-riquadri, .rm-olio { grid-template-columns: 1fr 1fr; }
  .rm-totali { width: 100%; }
}

/* avviso sul tabellone (Molitura, giorno di oggi) */
.avviso-tabellone { margin: 0 0 1rem; padding: .7rem 1rem; border: 1px solid var(--bordo, #D9D3BD); border-radius: 10px; background: #FBF8EE; }
.avviso-tabellone > summary { cursor: pointer; font-weight: 700; color: var(--oliva-scura, #2F3A16); }
.avviso-tabellone.attivo-fermo { background: #FCEDEA; border-color: #D9634E; }
.avviso-tabellone.attivo-fermo > summary { color: #A3271F; }
.avviso-tabellone.attivo-info { background: #FFF7DD; border-color: #D9B23A; }
.avviso-tabellone form { margin-top: .8rem; }
.avviso-tabellone .scelta-avviso { border: 0; padding: 0; margin: 0 0 .8rem; }
.avviso-tabellone .azioni-modulo { display: flex; flex-wrap: wrap; gap: .6rem; margin: .4rem 0; }

/* licenza d'uso */
.licenza-stato { display: flex; align-items: center; gap: 1rem; padding: 1.1rem 1.3rem; margin: 0 0 1.25rem; border-radius: 12px; color: #fff;
  background: linear-gradient(120deg, #3E4D18, #5C7024); max-width: 52rem; }
.licenza-stato h1 { margin: 0; color: #fff; }
.licenza-stato p { margin: .2rem 0 0; }
.licenza-prova { background: linear-gradient(120deg, #075A82, #0A86BD); }
.licenza-tolleranza { background: linear-gradient(120deg, #8A4B00, #C77A06); }
.licenza-sola_lettura { background: linear-gradient(120deg, #7E1D14, #B3311F); }
.licenza-icona { font-size: 2.2rem; line-height: 1; }
.licenza-giorni { margin-left: auto !important; text-align: right; }
.licenza-giorni strong { display: block; font-size: 2rem; line-height: 1; }
.licenza-codice { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .06em; text-transform: uppercase; }
.licenza-attiva { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }
.licenza-attiva input { max-width: 22rem; }
.licenza-attiva button { margin-top: 0; }

/* orari riservati dopo una disdetta */
.evento.evento-riservato, .agenda-evento.evento-riservato { background: repeating-linear-gradient(135deg, #F3E3C2 0 8px, #FBF3E2 8px 16px) !important;
  color: #6B4A00 !important; border: 1px dashed #C08A1E !important; }
.evento-riservato .evento-nome { font-style: italic; }
.blocco.riservati { border-left: 4px solid #C08A1E; padding-left: 1rem; }
.elenco-scalate { margin: .4rem 0 .8rem; padding-left: 1.2rem; }
form.in-riga { display: flex; flex-wrap: wrap; gap: .4rem; justify-content: flex-end; }
form.in-riga button { margin-top: 0; }