/* Bottega 2.0 — stile del banco (bozza approvata: docs/bozze/accettazione.html) */
:root {
  --nero: #141210;
  --nero-2: #221e1a;
  --oro: #c6a15b;
  --oro-chiaro: #e2c88f;
  --oro-scuro: #9c7a3a;
  --avorio: #f7f2e8;
  --avorio-2: #ede5d4;
  --avorio-3: #e2d7c1;
  --testo: #2b2520;
  --testo-tenue: #7a6f62;
  --mattone: #9e3b2b;
  --mattone-chiaro: #f3e1dc;
  --raggio: 14px;
  --serif: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
  --sans: -apple-system, "Segoe UI", system-ui, Roboto, sans-serif;
}
/* touch-action: sull'iPad due tocchi veloci (es. «1 1» nel PIN) non ingrandiscono la pagina (richiesta di Luca);
   il pizzico con due dita per ingrandire resta. */
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
html, body { margin: 0; min-height: 100%; background: var(--avorio); color: var(--testo); font-family: var(--sans); font-size: 16px; }
button, input, textarea, select { font: inherit; color: inherit; }
a { color: inherit; }
[hidden] { display: none !important; }

/* Barra superiore */
/* Richiesta di Luca (29/10): barra e menu fermi in alto mentre si scorre. */
.testata { position: sticky; top: 0; z-index: 20; }
html { scroll-padding-top: calc(var(--testata, 0px) + 8px); }  /* i salti alle sezioni non finiscono sotto la testata */
.barra { display: flex; align-items: center; gap: 14px; background: var(--nero); color: var(--avorio); padding: 10px 20px; min-height: 68px; }
.barra img { height: 48px; width: 48px; border-radius: 8px; }
.marchio { font-family: var(--serif); font-size: 21px; color: var(--oro-chiaro); text-decoration: none; }
.marchio small { display: block; font-family: var(--sans); font-size: 12px; color: #a99d8b; letter-spacing: 1.5px; text-transform: uppercase; }
/* I passi dell'accettazione (richiesta di Luca, 29/10): un percorso, non pulsanti. Fatti ✓ in verde, adesso in oro. */
.passi { margin-left: auto; display: flex; align-items: center; gap: 6px; }
.passi small { margin-right: 4px; color: #8a7f70; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; }
.passi .passo { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: #8a7f70; text-decoration: none; }
.passi .passo + .passo::before { content: ''; width: 16px; height: 2px; margin-right: 2px; background: #4a4239; }
.passi .passo i { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; border: 1.5px solid #4a4239; font-style: normal; font-size: 12px; font-weight: 800; }
.passi .passo.fatto { color: #cfc4b2; }
.passi .passo.fatto i { background: #2f7a3a; border-color: #2f7a3a; color: #fff; }
.passi .passo.attivo { color: var(--oro-chiaro); font-weight: 800; }
.passi .passo.attivo i { background: var(--oro); border-color: var(--oro); color: var(--nero); }
.passi a.passo { color: var(--oro-chiaro); text-decoration: underline; text-decoration-color: var(--oro); text-underline-offset: 3px; }
.operatore { display: flex; align-items: center; gap: 10px; margin-left: 18px; padding-left: 18px; border-left: 1px solid #3a332c; }
.passi + .operatore { margin-left: 18px; }
.barra > .operatore:first-of-type { margin-left: auto; }
.operatore .iniziali { width: 40px; height: 40px; border-radius: 50%; background: var(--nero-2); border: 1.5px solid var(--oro); color: var(--oro-chiaro); display: grid; place-items: center; font-weight: 600; }
.operatore div { font-size: 14px; line-height: 1.2; }
.operatore small { color: #a99d8b; font-size: 12px; }
.operatore form button { background: transparent; border: 1px solid #3a332c; color: #a99d8b; border-radius: 99px; padding: 7px 12px; font-size: 13px; }

/* Elementi comuni */
.pagina { max-width: 1180px; margin: 0 auto; padding: 24px; }
h1.titolo-pagina { font-family: var(--serif); font-size: 32px; font-weight: 600; margin: 0 0 16px; }
.etichetta { font-size: 12px; letter-spacing: 1.4px; text-transform: uppercase; color: var(--testo-tenue); margin: 0 0 8px; }
.bottone { display: inline-block; border: 0; border-radius: 12px; font-size: 17px; font-weight: 600; padding: 16px 22px; cursor: pointer; text-align: center; text-decoration: none; }
.bottone.largo { display: block; width: 100%; }
.bottone.oro { background: var(--oro); color: var(--nero); }
.bottone.scuro { background: var(--nero); color: var(--oro-chiaro); }
/* Richiesta di Luca (29/10): i tasti chiari si vedono bene anche sul fondo beige. */
.bottone.chiaro { background: #fff; color: var(--testo); border: 1.5px solid #c8b78f; box-shadow: 0 1px 2px rgba(0,0,0,.06); }
.bottone:disabled { opacity: .5; }
.campo { width: 100%; background: #fff; border: 1.5px solid var(--avorio-3); border-radius: 12px; padding: 14px; font-size: 17px; outline: none; }
.campo:focus { border-color: var(--oro); }
.errore { background: var(--mattone-chiaro); color: var(--mattone); border-radius: 12px; padding: 12px 14px; margin: 0 0 14px; font-weight: 600; }
.promemoria { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.promemoria span { font-size: 12px; padding: 5px 9px; border-radius: 99px; background: var(--mattone-chiaro); color: var(--mattone); }
.scheda { background: #fff; border: 1px solid var(--avorio-3); border-radius: var(--raggio); padding: 16px; }
.codice { font-family: ui-monospace, Menlo, Consolas, monospace; color: var(--oro-scuro); }

/* Accesso */
.accesso { min-height: 100vh; background: var(--nero); color: var(--avorio); display: flex; flex-direction: column; align-items: center; padding: 40px 20px; }
.accesso img { width: 120px; height: 120px; border-radius: 16px; }
.accesso h1 { font-family: var(--serif); color: var(--oro-chiaro); font-weight: 500; margin: 16px 0 28px; }
.persone { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 14px; width: 100%; max-width: 900px; }
.persona { background: var(--nero-2); border: 1px solid #3a332c; border-radius: 16px; padding: 20px 10px; text-align: center; text-decoration: none; color: var(--avorio); }
.persona .iniziali { width: 64px; height: 64px; margin: 0 auto 10px; border-radius: 50%; border: 2px solid var(--oro); color: var(--oro-chiaro); display: grid; place-items: center; font-size: 22px; font-weight: 600; }
.tastierino { display: grid; grid-template-columns: repeat(3, 84px); gap: 12px; margin-top: 18px; }
.tastierino button { height: 84px; border-radius: 50%; border: 1px solid #3a332c; background: var(--nero-2); color: var(--avorio); font-size: 28px; }
.tastierino button.vuoto { visibility: hidden; }
.puntini { display: flex; gap: 14px; height: 18px; }
.puntini i { width: 16px; height: 16px; border-radius: 50%; border: 2px solid var(--oro); }
.puntini i.pieno { background: var(--oro); }
.accesso .errore { margin-top: 16px; }
.accesso .indietro { margin-top: 24px; color: #a99d8b; }
.scelte-postazione { display: grid; gap: 12px; width: 100%; max-width: 560px; }
.scelte-postazione button { width: 100%; text-align: left; background: var(--nero-2); color: var(--avorio); border: 1px solid #3a332c; border-radius: 14px; padding: 18px; font-size: 18px; }
.scelte-postazione button small { display: block; color: #a99d8b; font-size: 14px; margin-top: 2px; }

/* Home: ricerca cliente */
.cerca-cliente { display: flex; gap: 12px; }
.cerca-cliente .campo { font-size: 22px; padding: 18px; }
.risultati { display: grid; gap: 10px; margin-top: 14px; }
.risultato { display: flex; align-items: center; gap: 14px; background: #fff; border: 1px solid var(--avorio-3); border-radius: 14px; padding: 14px 16px; }
.risultato b { font-family: var(--serif); font-size: 21px; display: block; }
.risultato .tel { color: var(--testo-tenue); }
.risultato form { margin: 0; }
.risultato .nome-cliente { text-decoration: none; }
.azioni-risultato { margin-left: auto; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.oggi-in-bottega { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 18px; }
.oggi-in-bottega a { background: #fff; border: 1px solid var(--avorio-3); border-radius: 12px; padding: 10px 12px; text-decoration: none; color: var(--testo-tenue); font-size: 14px; }
.oggi-in-bottega a b { display: block; font-family: var(--serif); font-size: 26px; color: var(--testo-tenue); }
.oggi-in-bottega a.con b { color: var(--testo); }
.oggi-in-bottega a.allarme { border-color: var(--mattone); color: var(--mattone); }
.oggi-in-bottega a.allarme b { color: var(--mattone); }
.in-corso { margin-top: 28px; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.in-corso a { text-decoration: none; }

/* Pratica */
.corpo { display: grid; grid-template-columns: 300px 1fr; min-height: calc(100vh - 68px); }
.laterale { background: var(--avorio-2); border-right: 1px solid var(--avorio-3); padding: 18px; display: flex; flex-direction: column; gap: 14px; }
.laterale-fisso { position: sticky; top: calc(var(--testata, 68px) + 18px); display: flex; flex-direction: column; gap: 14px; min-height: calc(100vh - 104px); }
.principale { padding: 20px 26px 120px; min-width: 0; }
.cliente { background: #fff; border-radius: var(--raggio); padding: 14px 16px; border: 1px solid var(--avorio-3); }
.cliente h2 { font-family: var(--serif); font-size: 24px; margin: 0 0 2px; font-weight: 600; }
.cliente .tel { color: var(--testo-tenue); font-size: 15px; }
.cliente .wa-si { color: #1f7a3d; font-weight: 600; }
.chiedi-whatsapp { margin-top: 10px; padding: 10px 12px; border-radius: 12px; background: #fffaf0; border: 1.5px solid var(--oro); }
.chiedi-whatsapp p { margin: 0 0 8px; font-weight: 600; }
.chiedi-whatsapp div { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.chiedi-whatsapp button { min-height: 44px; border-radius: 10px; border: 1px solid var(--avorio-3); background: #fff; font-weight: 600; }
.chiedi-whatsapp button[value="si"] { background: var(--nero); color: var(--oro-chiaro); border-color: var(--nero); }
.scelta-whatsapp { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.scelta-whatsapp button { min-height: 64px; padding: 12px; border-radius: 12px; border: 1px solid var(--avorio-3); background: #fff; font-size: 17px; font-weight: 600; text-align: left; }
.scelta-whatsapp button small { display: block; font-size: 13px; font-weight: 400; color: var(--testo-tenue); margin-top: 2px; }
.scelta-whatsapp button.sel { border-color: var(--oro); background: #fffaf0; box-shadow: inset 0 0 0 1.5px var(--oro); }
.elenco-articoli > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 8px; }
.elenco-articoli > summary::-webkit-details-marker { display: none; }
.apri-elenco { margin-left: auto; letter-spacing: 0; text-transform: none; font-size: 13px; font-weight: 600; color: var(--oro-scuro); }
.apri-elenco::after { content: 'mostra ›'; }
.elenco-articoli[open] .apri-elenco::after { content: 'chiudi'; }
.articoli { display: flex; flex-direction: column; gap: 8px; }
.art { display: grid; grid-template-columns: 54px 1fr auto; gap: 10px; align-items: center; background: #fff; border-radius: 12px; padding: 8px; border: 1px solid var(--avorio-3); }
.art img, .art .mini { width: 54px; height: 54px; border-radius: 9px; object-fit: cover; background: var(--avorio-3); }
.art .mini { display: grid; place-items: center; font-size: 10px; line-height: 1.1; text-align: center; color: var(--testo-tenue); }
.art b { font-size: 14px; display: block; }
.art .codice { font-size: 12px; }
.art small { font-size: 12px; color: var(--testo-tenue); display: block; }
.art .prezzo { font-weight: 600; font-size: 15px; text-align: right; }
.art .prezzo button { display: block; margin-top: 4px; background: none; border: 0; color: var(--mattone); font-size: 12px; padding: 0; }
.art .modifica-art { display: inline-block; margin-top: 4px; padding: 6px 10px; border-radius: 8px; background: var(--nero); color: var(--oro-chiaro); font-size: 12px; font-weight: 700; text-decoration: none; }
.art.in-modifica { border: 2px solid var(--oro); background: #fffaf0; }
.art { position: relative; }
.apri-art { position: absolute; inset: 0; z-index: 1; border-radius: 12px; }
.art:has(.apri-art):active { background: #fffaf0; }
.art .prezzo form { position: relative; z-index: 2; }  /* «Togli» resta un tocco a parte */
.art.in-modifica .modifica-art { visibility: hidden; }
.totale { margin-top: auto; background: var(--nero); color: var(--avorio); border-radius: var(--raggio); padding: 14px 16px; }
.totale .riga { display: flex; justify-content: space-between; font-size: 14px; color: #c9bfae; margin-bottom: 4px; }
.totale .riga.grande { font-size: 22px; color: var(--avorio); font-family: var(--serif); margin-bottom: 10px; }

.titolo { display: flex; align-items: baseline; gap: 12px; margin-bottom: 14px; }
.titolo h1 { font-family: var(--serif); font-size: 30px; margin: 0; font-weight: 600; }
.titolo span { color: var(--testo-tenue); font-size: 15px; }
.sezione { margin-bottom: 22px; }
.sezione h3 { display: flex; align-items: center; gap: 10px; font-size: 15px; margin: 0 0 10px; }
.sezione h3 i { font-style: normal; width: 26px; height: 26px; border-radius: 50%; background: var(--nero); color: var(--oro-chiaro); display: grid; place-items: center; font-size: 13px; }
.sezione h3 em { font-style: normal; font-weight: 400; color: var(--testo-tenue); font-size: 13px; }

.foto-e-giacomo { display: flex; gap: 14px; align-items: stretch; }
.foto { display: flex; flex-wrap: wrap; gap: 10px; }
.scatto { width: 120px; height: 120px; border-radius: 12px; position: relative; overflow: hidden; background: var(--avorio-3); }
.scatto img { width: 100%; height: 100%; object-fit: cover; }
.scatto small { position: absolute; left: 8px; bottom: 6px; color: #fff; font-size: 11px; text-shadow: 0 1px 2px rgba(0,0,0,.7); }
.scatto.in-etichetta { outline: 3px solid var(--oro); outline-offset: -3px; }
.scatto button { position: absolute; top: 6px; right: 6px; width: 28px; height: 28px; border-radius: 50%; border: 0; background: rgba(20,18,16,.75); color: #fff; font-size: 16px; line-height: 1; }
.nuova-foto { position: relative; overflow: hidden; width: 120px; height: 120px; border-radius: 12px; border: 2px dashed var(--oro-scuro); display: grid; place-items: center; text-align: center; color: var(--oro-scuro); font-weight: 600; font-size: 14px; background: #fffaf0; cursor: pointer; }
.nuova-foto svg { display: block; margin: 0 auto 4px; }
/* Il campo resta sopra il riquadro, invisibile ma toccabile: Safari su iPhone apre la fotocamera in modo affidabile. */
.nuova-foto input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; font-size: 0; }
.scatto.in-carica { display: grid; place-items: center; color: var(--testo-tenue); font-size: 12px; }
.scatto:not(.in-etichetta) { cursor: pointer; }

/* Giacomo: suggerimenti dalle foto */
.giacomo .stato-g { font-size: 13px; color: #c9bfae; }
.giacomo .descrizione-g { font-size: 13px; color: var(--avorio); }
.consiglio { display: flex; align-items: center; gap: 8px; background: var(--nero-2); border-radius: 10px; padding: 7px 8px 7px 10px; font-size: 13px; line-height: 1.25; }
.consiglio span { flex: 1; }
.consiglio span em { font-style: normal; color: #a99d8b; display: block; font-size: 11px; }
.consiglio button { border: 0; border-radius: 8px; background: var(--oro); color: var(--nero); font-weight: 700; font-size: 12px; padding: 8px 10px; white-space: nowrap; }
.consiglio.aggiunto button { background: transparent; color: var(--oro-chiaro); border: 1px solid var(--oro-scuro); }
.consiglio .campo-prezzo { width: 120px; padding: 8px; border-radius: 8px; border: 1.5px solid var(--oro); font-weight: 700; font-size: 14px; color: var(--testo); }
/* Prezzo da scrivere: si deve vedere subito */
.campo-prezzo.manca { width: 170px; border: 2px solid var(--mattone) !important; background: var(--mattone-chiaro); }
.campo-prezzo.manca::placeholder { color: var(--mattone); font-weight: 600; }
.preventivo-g { display: flex; justify-content: space-between; align-items: center; font-size: 13px; color: #c9bfae; border-top: 1px solid #3a332c; padding-top: 6px; }
.preventivo-g b { font-family: var(--serif); font-size: 18px; color: var(--oro-chiaro); }
.giacomo .chiedi.attivo { opacity: 1; cursor: pointer; }
.voce .g { display: inline-grid; place-items: center; width: 17px; height: 17px; border-radius: 50%; background: var(--oro); color: var(--nero); font-size: 10px; font-weight: 800; margin-left: 4px; vertical-align: 1px; font-family: var(--serif); }
.giacomo { flex: 1; min-width: 240px; background: var(--nero); color: var(--avorio); border-radius: var(--raggio); padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; }
.giacomo .testa { display: flex; align-items: center; gap: 10px; }
.giacomo .avatar { width: 34px; height: 34px; border-radius: 50%; background: var(--oro); color: var(--nero); display: grid; place-items: center; font-family: var(--serif); font-weight: 700; font-size: 18px; }
.giacomo .testa b { font-size: 15px; color: var(--oro-chiaro); }
.giacomo .testa small { display: block; font-size: 11px; color: #a99d8b; }
.giacomo p { margin: 0; font-size: 13px; color: #c9bfae; line-height: 1.35; }
.giacomo .chiedi { margin-top: auto; text-align: center; border: 1px solid var(--oro-scuro); color: var(--oro-chiaro); border-radius: 10px; padding: 9px; font-size: 14px; font-weight: 600; background: transparent; opacity: .55; }

.categorie { display: grid; grid-template-columns: repeat(7, 1fr); gap: 10px; }
.cat { background: #fff; border: 1.5px solid var(--avorio-3); border-radius: 14px; padding: 12px 6px 10px; text-align: center; font-size: 14px; font-weight: 600; cursor: pointer; }
.cat svg { display: block; margin: 0 auto 6px; stroke: var(--testo); }
.cat.scelta { background: var(--nero); border-color: var(--nero); color: var(--oro-chiaro); }
.cat.scelta svg { stroke: var(--oro-chiaro); }
.riga-campi { margin-top: 10px; display: grid; grid-template-columns: 2fr 1fr 1.4fr; gap: 10px; }
.riga-campi .campo { font-size: 16px; padding: 12px 14px; }

.reparti { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 14px; }
.reparto { background: #fff; border: 1px solid var(--avorio-3); border-radius: var(--raggio); padding: 12px; }
.reparto h4 { margin: 0 0 10px; font-size: 13px; letter-spacing: 1.2px; text-transform: uppercase; color: var(--oro-scuro); display: flex; justify-content: space-between; gap: 8px; }
.reparto h4 small { color: var(--testo-tenue); letter-spacing: 0; text-transform: none; font-weight: 400; }
.voci { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.voce { border: 1.5px solid var(--avorio-3); border-radius: 11px; padding: 10px 11px; font-size: 14px; font-weight: 600; background: var(--avorio); min-height: 48px; text-align: left; cursor: pointer; }
.voce small { display: block; font-weight: 400; color: var(--testo-tenue); font-size: 12px; margin-top: 2px; }
.voce.di-marca { border-style: dashed; border-color: var(--oro); }
.voce.scelta { background: var(--nero); color: var(--avorio); border-color: var(--nero); }
.voce.scelta small { color: var(--oro-chiaro); }
.voce .verifica { color: var(--mattone); }
.dettaglio-voce { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; background: var(--avorio-2); border-radius: 11px; padding: 8px; font-size: 13px; color: var(--testo-tenue); }
.dettaglio-voce b { margin-right: 4px; color: var(--testo); }
.dettaglio-voce .chip { padding: 9px 12px; border-radius: 9px; background: #fff; color: var(--testo); font-weight: 600; border: 1.5px solid var(--avorio-3); cursor: pointer; }
.dettaglio-voce .chip.sel { background: var(--oro); border-color: var(--oro); }
.dettaglio-voce input { width: 92px; padding: 9px; border-radius: 9px; border: 1.5px solid var(--avorio-3); font-weight: 600; }
.a-capo { flex-basis: 100%; height: 0; }
.nota-reparto { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--avorio-3); font-size: 13px; }
.nota-reparto b { color: var(--testo-tenue); margin-right: 4px; font-weight: 600; }
.nota-reparto .chip { padding: 9px 12px; border-radius: 99px; background: var(--avorio); color: var(--testo); font-weight: 600; border: 1.5px solid var(--avorio-3); cursor: pointer; }
.nota-reparto .chip.sel { background: var(--oro); border-color: var(--oro); }
.nota-reparto input { flex: 1; min-width: 150px; padding: 9px 11px; border-radius: 9px; border: 1.5px solid var(--avorio-3); font-size: 14px; }
.contatore { display: flex; align-items: center; margin-left: auto; }
.contatore button, .contatore span { height: 40px; display: grid; place-items: center; background: #fff; border: 1.5px solid var(--avorio-3); font-size: 18px; font-weight: 700; }
.contatore button { width: 40px; }
.contatore button:first-child { border-radius: 9px 0 0 9px; }
.contatore button:last-child { border-radius: 0 9px 9px 0; }
.contatore span { min-width: 100px; padding: 0 8px; font-size: 14px; border-left: 0; border-right: 0; white-space: nowrap; }
.opzioni { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; width: 100%; }
.finiture { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; width: 100%; }
.finitura { min-height: 48px; border-radius: 10px; border: 1.5px solid var(--avorio-3); background: #fff; font-size: 16px; font-weight: 700; color: var(--testo); cursor: pointer; }
.finitura.sel { background: var(--nero); color: var(--oro-chiaro); border-color: var(--nero); }
.prima-finitura { width: 100%; color: var(--mattone); font-weight: 600; }
.scelta-chiusa { display: flex; align-items: center; gap: 10px; text-align: left; padding: 8px 12px; min-width: 220px; }
.scelta-chiusa .pallino, .scelta-chiusa img { width: 34px; height: 34px; margin: 0; flex: none; }
.scelta-chiusa .cambia { margin-left: auto; color: var(--oro-scuro); font-weight: 600; }
.opzione { background: #fff; border: 1.5px solid var(--avorio-3); border-radius: 10px; padding: 6px; text-align: center; font-size: 12px; cursor: pointer; }
.opzione img { width: 100%; height: 64px; object-fit: cover; border-radius: 6px; display: block; margin-bottom: 4px; }
.opzione.sel { border-color: var(--oro); background: #fffaf0; box-shadow: inset 0 0 0 1.5px var(--oro); }
.pallino { height: 38px; border-radius: 8px; margin-bottom: 4px; border: 1px solid rgba(0,0,0,.15); }
.pallino.lucida { background-image: linear-gradient(135deg, rgba(255,255,255,.6), rgba(255,255,255,0) 50%); }
.altre { display: block; width: 100%; margin-top: 8px; background: none; border: 0; font-size: 13px; color: var(--oro-scuro); font-weight: 600; }

/* Richiesta di Luca (29/10): sei giorni, i più utili, in una riga sola anche sul telefono. */
.giorni { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; }
.giorno { background: #fff; border: 1.5px solid var(--avorio-3); border-radius: 11px; text-align: center; padding: 8px 2px; cursor: pointer; }
.giorno b { display: block; font-size: 18px; font-family: var(--serif); }
.giorno small { font-size: 11px; color: var(--testo-tenue); }
.giorno.scelto { background: var(--oro); border-color: var(--oro); }
.giorno.pieno { opacity: .38; cursor: default; }
.giorno.pieno small:last-child { font-size: 10px; }
.primo-libero { margin: 0 0 8px; padding: 8px 12px; border-radius: 10px; background: #fdf0d0; color: #7a4a00; font-size: 14px; font-weight: 600; }
.giorni.in-calcolo { opacity: .6; }
.giorno.scelto small { color: var(--nero); }
.sotto-giorni { display: flex; align-items: center; gap: 12px; margin-top: 10px; }
.interruttore { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; background: none; border: 0; padding: 0; cursor: pointer; }
.interruttore i { width: 46px; height: 28px; border-radius: 99px; background: var(--avorio-3); position: relative; transition: background .15s; }
.interruttore i::after { content: ""; position: absolute; width: 22px; height: 22px; border-radius: 50%; background: #fff; top: 3px; left: 3px; box-shadow: 0 1px 3px rgba(0,0,0,.25); transition: left .15s; }
.interruttore.attivo i { background: var(--mattone); }
.interruttore.attivo i::after { left: 21px; }
.sotto-giorni .campo { flex: 1; padding: 11px 14px; font-size: 15px; }

.note { display: flex; gap: 10px; }
.voce-microfono { display: flex; align-items: center; gap: 8px; background: var(--nero); color: var(--oro-chiaro); border-radius: 12px; padding: 0 16px; font-weight: 600; font-size: 14px; white-space: nowrap; border: 0; opacity: .55; }

.piede { position: fixed; left: 300px; right: 0; bottom: 0; z-index: 10; background: rgba(247,242,232,.97); border-top: 1px solid var(--avorio-3); display: flex; align-items: center; gap: 10px; padding: 14px 26px; }
.piede .somma { font-size: 15px; color: var(--testo-tenue); }
.piede .somma b { font-family: var(--serif); font-size: 24px; color: var(--testo); margin-left: 6px; }
.piede .spinta { margin-left: auto; }
/* Il pulsante oro finale è quello decisivo (richiesta di Luca): stessa misura, ma deve saltare all'occhio. */
.piede .bottone.oro { font-weight: 800; letter-spacing: .01em; background: linear-gradient(180deg, #e3c37c, var(--oro));
  box-shadow: 0 0 0 2px var(--nero), 0 6px 16px rgba(0,0,0,.18); }
.avviso { position: fixed; left: 50%; bottom: 96px; transform: translateX(-50%); z-index: 30; background: var(--mattone); color: #fff; padding: 14px 20px; border-radius: 12px; font-weight: 600; box-shadow: 0 6px 24px rgba(0,0,0,.25); max-width: 80%; }

/* Cassa e conferma */
.cassa { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: start; }
.incasso .etichetta { margin-top: 18px; }
.conto { background: var(--nero); color: var(--avorio); border-radius: 18px; padding: 18px 22px 20px; }
.conto .riga { display: flex; justify-content: space-between; align-items: baseline; font-size: 17px; color: #cfc4b2; }
.conto .riga b { font-family: var(--serif); font-size: 24px; color: var(--avorio); font-weight: 600; }
.conto .da-incassare { margin: 14px 0 0; padding-top: 14px; border-top: 1px solid #3a332c; font-size: 13px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--oro); }
.conto .cifra { font-family: var(--serif); font-size: 64px; line-height: 1.05; color: var(--oro-chiaro); font-weight: 600; margin: 2px 0 10px; }
.importi { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.importi .importo:only-child { grid-column: 1 / -1; }
.importo { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; background: #fff; border: 1.5px solid var(--avorio-3); border-radius: 14px; padding: 14px 16px; font-size: 16px; font-weight: 600; cursor: pointer; text-align: left; }
.importo span { font-family: var(--serif); font-size: 26px; }
.importo.sel { border-color: var(--oro); background: #fffaf0; box-shadow: inset 0 0 0 1.5px var(--oro); }
.importo .consigliato { font-style: normal; font-size: 11px; font-weight: 700; background: var(--oro); color: var(--nero); padding: 2px 8px; border-radius: 99px; }
.altro-importo { margin-top: 8px; background: none; border: 0; padding: 8px 2px; color: var(--oro-scuro); font-weight: 600; font-size: 15px; cursor: pointer; }
.campo-altro { display: flex; align-items: center; gap: 8px; margin-top: 4px; }
.campo-altro span { font-family: var(--serif); font-size: 24px; }
.campo-altro .campo { max-width: 220px; font-size: 22px; padding: 10px 14px; }
.errore-importo { color: var(--mattone); font-weight: 600; margin: 6px 0 0; }
.conferma { font-size: 19px; padding: 20px; margin-top: 6px; }
.conferma:disabled { background: var(--avorio-2); color: var(--testo-tenue); border-color: var(--avorio-3); cursor: default; }
.nota-conferma { color: var(--testo-tenue); font-size: 14px; text-align: center; margin: 8px 0 0; }
/* Cassa: chi conferma dichiara di aver ricevuto i soldi (regola di Luca): il pulsante deve pesare. */
.conferma.pronta { background: linear-gradient(180deg, #e3c37c, var(--oro)); box-shadow: 0 0 0 3px var(--nero), 0 10px 24px rgba(0,0,0,.22); padding: 16px 18px 18px; line-height: 1.25; }
.conferma.pronta small { display: block; margin-bottom: 4px; font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.conferma.pronta span { font-size: 20px; font-weight: 600; }
.conferma.pronta b { font-size: 28px; font-weight: 800; text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 5px; white-space: nowrap; }
/* Chi ha gestito i soldi (regola di Luca): sempre in vista accanto a ogni incasso. */
.chi-incassa { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: 15px; }
.chi-incassa i { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--nero); color: var(--oro-chiaro); font-style: normal; font-size: 11px; font-weight: 800; }
.chi-incassa.piccolo { display: flex; margin-top: 4px; font-size: 13px; }
.chi-incassa.piccolo i { width: 22px; height: 22px; font-size: 10px; }
.per-persona { display: grid; gap: 8px; }
.riga-persona { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; padding: 10px 12px; border-radius: 10px; background: var(--avorio); border: 1px solid var(--avorio-3); }
.riga-persona .metodi-persona { flex: 1; font-size: 14px; color: var(--testo-tenue); }
.riga-persona .metodi-persona small { display: block; font-size: 12px; }
.riga-persona > b { font-family: var(--serif); font-size: 22px; }
/* Annullare un'accettazione: il motivo in un tocco (regola di Luca). */
.annulla-scheda textarea { width: 100%; margin-bottom: 10px; }
.motivi-annullamento { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 10px; }
.motivi-annullamento .bottone { width: 100%; padding: 16px 6px; font-size: 16px; }
/* Report della Direzione (solo il titolare). */
.modulo-chiave { display: grid; gap: 10px; }
.filtri-report { display: grid; gap: 12px; margin-bottom: 12px; }
.periodi-report { display: flex; flex-wrap: wrap; gap: 6px; }
.periodi-report label { cursor: pointer; }
.periodi-report input { position: absolute; opacity: 0; pointer-events: none; }
.periodi-report span { display: block; padding: 9px 14px; border-radius: 99px; border: 1.5px solid var(--avorio-3); background: #fff; font-weight: 600; }
.periodi-report input:checked + span { background: var(--nero); border-color: var(--nero); color: var(--oro-chiaro); }
.date-report { display: flex; flex-wrap: wrap; gap: 10px; }
.date-report label, .griglia-filtri label, .bonus-report label { display: grid; gap: 4px; font-size: 13px; font-weight: 700; color: var(--testo-tenue); }
.date-report[hidden] { display: none; }
.griglia-filtri { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; }
.bonus-report { display: flex; flex-wrap: wrap; align-items: end; gap: 12px; padding-top: 10px; border-top: 1px solid var(--avorio-3); }
.bonus-report .campo { width: 80px; text-align: right; }
.bonus-report .spunta-iva { display: flex; align-items: center; gap: 8px; font-size: 15px; color: var(--testo); }
.bonus-report .spunta-iva input { width: 22px; height: 22px; accent-color: var(--nero); }
.bonus-report .bottone { margin-left: auto; padding: 12px 22px; }
.totali-report { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; margin: 10px 0 14px; }
.totali-report > div { display: grid; gap: 2px; padding: 14px 16px; border-radius: var(--raggio); background: var(--nero); color: var(--oro-chiaro); }
.totali-report small { font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #fff; opacity: .7; }
.totali-report b { font-family: var(--serif); font-size: 30px; }
.totali-report span { font-size: 13px; color: #fff; opacity: .8; }
.totali-report .bonus { background: var(--oro); color: var(--nero); }
.totali-report .bonus small, .totali-report .bonus span { color: var(--nero); }
.griglia-report { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: 10px; }
.tabella-report th { text-align: right; font-size: 12px; color: var(--testo-tenue); font-weight: 700; padding-left: 10px; }
.tabella-report td + td { text-align: right; white-space: nowrap; padding-left: 10px; font-size: 14px; }
.tabella-report small { color: var(--testo-tenue); }
.schede-report { margin-bottom: 12px; width: fit-content; }
.variazione { font-weight: 800; white-space: nowrap; color: var(--testo-tenue); }
.variazione.su { color: #1f7a3a; }
.variazione.giu { color: var(--mattone); }
.totali-report .variazione { opacity: 1; color: #fff; }
.totali-report .variazione.su { color: #8fe0a6; }
.totali-report .variazione.giu { color: #ffb3a6; }
.analisi-ia { margin-bottom: 14px; border: 2px solid var(--oro); }
.testo-analisi { padding: 12px 14px; border-radius: 10px; background: #fffaf0; font-size: 16px; line-height: 1.5; }
.testo-analisi p { margin: 0 0 8px; }
.testo-analisi h4 { margin: 12px 0 6px; font-family: var(--serif); font-size: 19px; }
.testo-analisi h4:first-child { margin-top: 0; }
.testo-analisi ul { margin: 0 0 8px; padding-left: 20px; }
.testo-analisi li { margin-bottom: 4px; }
.modulo-analisi { display: grid; gap: 8px; margin-top: 10px; }
.modulo-analisi small { color: var(--testo-tenue); }
/* Fondo cassa e chiusura della sera (regole di Luca). */
.fondo-cassa, .modulo-chiusura { display: grid; gap: 10px; margin-top: 12px; }
.voce-fondo { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border-radius: 12px; background: #fff; border: 1.5px solid var(--avorio-3); }
.voce-fondo > span:first-child { font-weight: 700; }
.voce-fondo small { display: block; font-weight: 500; font-size: 13px; color: var(--testo-tenue); }
.euro-campo { display: flex; align-items: center; gap: 6px; font-family: var(--serif); font-size: 20px; }
.euro-campo .campo { width: 120px; padding: 10px; font-size: 20px; text-align: right; }
.nota-campo { display: grid; gap: 6px; font-weight: 700; }
.nota-campo small { font-weight: 500; color: var(--testo-tenue); }
.controllo-vivo { margin: 0; padding: 10px 14px; border-radius: 10px; font-weight: 800; font-size: 16px; }
.controllo-vivo.torna { background: #e3f1e6; color: #1f5f33; }
.controllo-vivo.non-torna { background: #fff3ef; color: var(--mattone); border: 2px solid var(--mattone); }
.esito-chiusura { display: grid; gap: 4px; margin-top: 12px; padding: 12px 14px; border-radius: 12px; font-size: 15px; }
.esito-chiusura > b { font-size: 18px; }
.esito-chiusura.torna { background: #e3f1e6; color: #1f5f33; }
.esito-chiusura.non-torna { background: #fff3ef; border: 2px solid var(--mattone); color: var(--testo); }
.esito-chiusura.non-torna > b { color: var(--mattone); }
.nota-chiusura { margin: 6px 0 0; padding: 8px 10px; border-radius: 8px; background: #fff; }
.nota-chiusura.verificata { background: #e3f1e6; }
.verifica-chiusura { display: grid; gap: 8px; margin-top: 8px; }
.cause-scarto { margin: 10px 0; padding: 10px 14px; border-radius: 10px; background: #fff7e6; border: 1.5px solid var(--oro); }
.cause-scarto p { margin: 6px 0 0; font-size: 14px; }
.testa-pagina .chiudi-cassa { margin-left: auto; padding: 12px 18px; }
.avviso-anticipo { display: grid; gap: 10px; border: 2px solid var(--mattone); background: #fff3ef; }
.avviso-anticipo h2 { margin: 0; font-family: var(--serif); font-size: 22px; color: var(--mattone); }
.avviso-anticipo p { margin: 0 0 6px; font-size: 17px; }
.avviso-cassa { display: block; margin: 0 0 12px; padding: 12px 16px; border-radius: 12px; background: #fff3ef; border: 2px solid var(--mattone); color: var(--mattone); font-weight: 700; text-decoration: none; }
.pagamento-art { margin: 8px 0 0; padding-top: 8px; border-top: 1px solid var(--avorio-3); font-size: 14px; }
.nota-conferma.importante { margin-top: 12px; padding: 10px 14px; border-radius: 10px; background: #fff7e6; border: 1.5px solid var(--oro); color: var(--testo); font-size: 15px; text-align: left; }
.nota-conferma.importante b { color: var(--nero); }
.nota-conferma.importante u { text-decoration-thickness: 2px; text-underline-offset: 3px; }
.metodi { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 10px; margin: 16px 0; }
.metodo { background: #fff; border: 1.5px solid var(--avorio-3); border-radius: 14px; padding: 18px; font-size: 17px; font-weight: 600; cursor: pointer; }
.metodo.sel { background: var(--nero); color: var(--oro-chiaro); border-color: var(--nero); }
.riepilogo td { padding: 8px 0; border-bottom: 1px solid var(--avorio-3); vertical-align: top; }
.riepilogo { width: 100%; border-collapse: collapse; }
.riepilogo td:last-child { text-align: right; white-space: nowrap; }
.fatto { text-align: center; padding-top: 30px; }
.fatto .spunta { width: 84px; height: 84px; border-radius: 50%; background: var(--oro); color: var(--nero); display: grid; place-items: center; font-size: 44px; margin: 0 auto 14px; }
.fatto .azioni { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; max-width: 900px; margin: 24px auto 0; }
.annulla-pratica { margin-top: 6px; text-align: center; }
.annulla-pratica button { background: none; border: 0; padding: 8px 4px; color: var(--mattone); font-weight: 600; font-size: 14px; cursor: pointer; text-decoration: underline; }
.avviso-direzione { display: block; margin-bottom: 14px; padding: 12px 16px; border-radius: 12px; background: var(--avorio-2); color: var(--testo); font-weight: 600; text-decoration: none; }
.avviso-direzione.da-vedere { background: #fdf0d0; border: 2px solid var(--oro); color: var(--oro-scuro); }  /* da fare, non urgente: oro (regola di Luca, 29/10) */
.direzione .scheda { margin-bottom: 16px; }
.direzione .vuoto { color: var(--testo-tenue); margin: 0; }
.accesso { border-top: 1px solid var(--avorio-3); padding: 10px 0; }
.accesso:first-of-type { border-top: 0; }
.accesso.nuovo .testa-accesso b { color: var(--mattone); }
.testa-accesso { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; }
.testa-accesso span { color: var(--testo-tenue); font-size: 14px; }
.testa-accesso em { font-style: normal; font-size: 12px; background: var(--mattone); color: #fff; padding: 2px 8px; border-radius: 99px; }
.accesso ul { margin: 6px 0 0; padding-left: 18px; }
.accesso li small { color: var(--testo-tenue); margin-right: 4px; }
.riga-ingresso { display: grid; grid-template-columns: 56px 1fr auto; gap: 10px; padding: 6px 0; border-top: 1px solid var(--avorio-3); }
.riga-ingresso em { font-style: normal; color: var(--mattone); font-weight: 600; }
.riga-orario { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 6px 0; }
.riga-orario b { width: 100px; }
.riga-orario input[type=time] { font-size: 16px; padding: 8px; border-radius: 9px; border: 1.5px solid var(--avorio-3); }
.orari .bottone { margin-top: 10px; }
.salvato { color: #1f5f33; font-weight: 600; }
.istruzioni-giacomo { width: 100%; min-height: 180px; font-size: 16px; line-height: 1.4; margin-bottom: 10px; resize: vertical; }
.nota-salvataggio { color: var(--testo-tenue); margin-left: 10px; }
.conversazione { border-top: 1px solid var(--avorio-3); padding: 10px 0; display: grid; gap: 6px; }
.conversazione:first-of-type { border-top: 0; }
.fumetto { max-width: 85%; padding: 8px 12px; border-radius: 12px; background: var(--avorio-2); }
.fumetto.giacomo { justify-self: end; background: #e3f1e6; }
.fumetto small { color: var(--testo-tenue); }
.fumetto em { font-style: normal; font-size: 12px; margin-left: 6px; color: var(--oro-scuro); font-weight: 600; }
.fumetto p { margin: 4px 0 0; }
.fumetto .collega { display: block; margin-top: 4px; color: var(--mattone); font-weight: 600; font-size: 13px; }
.collegamenti-direzione { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.collegamenti-direzione .avviso-direzione { margin-bottom: 0; }
.esito-ricevuta { max-width: 640px; margin: 18px auto 0; padding: 12px 16px; border-radius: 12px; font-size: 16px; }
.esito-ricevuta.wa { background: #e3f1e6; color: #1f5f33; }
.esito-ricevuta.carta { background: var(--mattone-chiaro); color: var(--mattone); font-weight: 600; }
.codici { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.codici span { background: #fff; border: 1px solid var(--avorio-3); border-radius: 99px; padding: 6px 12px; }

/* Menu delle sezioni e messaggi dopo un'operazione */
.menu { display: flex; gap: 6px; padding: 8px 20px; background: var(--nero-2); overflow-x: auto; scrollbar-width: none; }
.menu::-webkit-scrollbar { display: none; }
.menu a { flex: none; padding: 9px 16px; border-radius: 99px; color: #cfc4b2; text-decoration: none; font-weight: 600; font-size: 15px; }
.menu a.attivo { background: var(--oro); color: var(--nero); }
.messaggi { max-width: 1180px; margin: 14px auto 0; padding: 0 24px; }
.messaggio { margin: 0 0 8px; padding: 12px 16px; border-radius: 12px; font-weight: 600; background: #e3f1e6; color: #1f5f33; }
.messaggio.error { background: var(--mattone-chiaro); color: var(--mattone); }
.testa-pagina { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 16px; margin-bottom: 14px; }
.testa-pagina .titolo-pagina { margin: 0; }
.testa-pagina > .bottone { margin-left: auto; padding: 12px 18px; }
.conta { color: var(--testo-tenue); }
.conta b { color: var(--mattone); }
.campo.grande { font-size: 20px; padding: 16px; }
p.vuoto { color: var(--testo-tenue); }
.giorno-gruppo { font-family: var(--serif); font-size: 21px; font-weight: 600; margin: 22px 0 10px; display: flex; align-items: baseline; gap: 8px; }
.giorno-gruppo small { font-family: var(--sans); font-size: 13px; font-weight: 600; color: var(--testo-tenue); background: var(--avorio-2); border-radius: 99px; padding: 2px 9px; }
.schede-filtro { display: flex; gap: 8px; margin: 12px 0 4px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: none; }
.schede-filtro::-webkit-scrollbar { display: none; }
.schede-filtro a { flex: none; padding: 10px 14px; border-radius: 12px; background: #fff; border: 1.5px solid var(--avorio-3); text-decoration: none; font-weight: 600; font-size: 15px; }
.schede-filtro a b { margin-left: 4px; color: var(--testo-tenue); }
.schede-filtro a.attivo { background: var(--nero); border-color: var(--nero); color: var(--oro-chiaro); }
.schede-filtro a.attivo b { color: var(--oro); }
.schede-filtro a.allarme b { color: #fff; background: var(--mattone); border-radius: 99px; padding: 1px 7px; }
em.urgente { font-style: normal; font-size: 11px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; background: var(--mattone); color: #fff; padding: 2px 7px; border-radius: 99px; vertical-align: 2px; }

/* Clienti */
.cerca-lavori, #cerca-clienti { margin-bottom: 6px; }
.elenco-clienti { display: grid; gap: 8px; }
.riga-cliente { display: flex; align-items: center; gap: 12px; background: #fff; border: 1px solid var(--avorio-3); border-radius: 14px; padding: 12px 16px; text-decoration: none; }
.riga-cliente .chi b { display: block; font-family: var(--serif); font-size: 20px; }
.riga-cliente .tel { color: var(--testo-tenue); font-size: 15px; }
.bollini { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; margin-left: auto; }
.bollino { font-size: 12px; font-weight: 600; padding: 4px 9px; border-radius: 99px; background: var(--avorio-2); color: var(--testo); white-space: nowrap; }
.bollino.pronto { background: var(--oro); color: var(--nero); }
.bollino.wa { background: #e3f1e6; color: #1f5f33; }
.bollino.manca { background: var(--mattone-chiaro); color: var(--mattone); }
.riga-cliente .vai { font-size: 26px; color: var(--oro-scuro); }
.testa-cliente { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 12px 20px; }
.testa-cliente .titolo-pagina { margin-bottom: 4px; }
.testa-cliente .contatti { margin: 0; font-size: 17px; color: var(--testo-tenue); }
.testa-cliente .contatti a { color: var(--testo); font-weight: 600; }
.wa-si { color: #1f7a3d; font-weight: 600; }
.azioni-cliente { margin-left: auto; display: flex; flex-wrap: wrap; gap: 10px; }
.azioni-cliente .bottone { padding: 14px 18px; }
.scheda-cliente .avviso-direzione { margin: 14px 0 0; }
.da-pagare { margin: 16px 0 0; font-size: 17px; }
.da-pagare b { font-family: var(--serif); font-size: 22px; }
.pannello-dati { margin-top: 14px; padding: 12px; border-radius: var(--raggio); background: var(--avorio-2); scroll-margin-top: 80px; }
.chiedi-responsabile { display: flex; flex-direction: column; gap: 4px; margin-bottom: 10px; padding: 12px 14px; border-radius: 12px; background: #fffaf0; border: 1.5px solid var(--oro); }
.chiedi-responsabile small { color: var(--testo-tenue); font-size: 14px; }
.bloccato { margin: 0; color: var(--testo-tenue); }
.permesso-clienti { margin: -2px 0 4px 32px; font-size: 14px; font-weight: 500; color: var(--testo-tenue); }
.dati-cliente { display: grid; gap: 10px; }
.dati-cliente details > summary, .elenco-boutique details > summary { list-style: none; cursor: pointer; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.dati-cliente details > summary::-webkit-details-marker, .elenco-boutique details > summary::-webkit-details-marker { display: none; }
.dati-cliente details > summary span, .elenco-boutique details > summary span { color: var(--testo-tenue); }
.dati-cliente details > summary::after, .elenco-boutique details > summary::after { content: 'apri ›'; margin-left: auto; color: var(--oro-scuro); font-weight: 600; font-size: 14px; }
.dati-cliente details[open] > summary::after, .elenco-boutique details[open] > summary::after { content: 'chiudi'; }
.dati-cliente details[open] > summary, .elenco-boutique details[open] > summary { margin-bottom: 12px; }
.modulo-dati { display: grid; gap: 12px; }
.modulo-dati .campo { font-size: 16px; padding: 12px; }
.modulo-dati .bottone { justify-self: start; padding: 13px 20px; }
.due-campi { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.tre-campi { display: grid; grid-template-columns: 110px 1fr 80px; gap: 10px; }
.spunta { display: flex; align-items: center; gap: 10px; font-weight: 600; }
.spunta input { width: 22px; height: 22px; accent-color: var(--nero); }
.scatta-documento { position: relative; overflow: hidden; }
.scatta-documento input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; font-size: 0; cursor: pointer; }
.scelto { color: #1f5f33; font-weight: 600; }
.storico > summary { list-style: none; cursor: pointer; }
.storico > summary::-webkit-details-marker { display: none; }
.storico .apri-elenco { font-family: var(--sans); }

/* Righe degli articoli (lavori, cliente, ritiro) */
.elenco-articoli-lavori { display: grid; gap: 8px; }
/* Lavori: ogni giorno di ritiro è una fascia scura che resta in alto mentre si scorre (richiesta di Luca). */
.giorno-lavori { position: sticky; top: calc(var(--testata, 0px) + 6px); z-index: 5; display: flex; align-items: center; gap: 10px; margin: 22px 0 10px; padding: 10px 14px; border-radius: 12px; background: var(--nero); color: var(--oro-chiaro); font-family: var(--serif); font-size: 21px; font-weight: 600; box-shadow: 0 4px 10px rgba(0,0,0,.12); }
.giorno-lavori span { font-family: var(--sans); font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; padding: 3px 9px; border-radius: 99px; background: rgba(255,255,255,.12); color: #fff; }
.giorno-lavori small { margin-left: auto; font-family: var(--sans); font-size: 14px; font-weight: 800; padding: 2px 11px; border-radius: 99px; background: var(--oro); color: var(--nero); }
.giorno-lavori.oggi { background: var(--oro); color: var(--nero); }
.giorno-lavori.oggi span { background: var(--nero); color: var(--oro-chiaro); }
.giorno-lavori.oggi small { background: var(--nero); color: var(--oro-chiaro); }
.giorno-lavori.passato { background: var(--mattone); color: #fff; }
.giorno-lavori.passato small { background: #fff; color: var(--mattone); }
/* Pronti che aspettano il cliente: non è un'urgenza del laboratorio, grigio (richiesta di Luca, 29/10). */
.giorno-lavori.giacenza { background: #e6e1d8; color: var(--testo); }
.giorno-lavori.giacenza span { background: #fff; color: var(--testo-tenue); }
.giorno-lavori.giacenza small { background: #fff; color: var(--testo); }
.legenda-lavori { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 0; font-size: 13px; font-weight: 700; }
.legenda-lavori span { padding: 3px 10px; border-radius: 99px; }
.legenda-lavori .ritardo { background: var(--mattone); color: #fff; }
.legenda-lavori .oggi { background: var(--oro); color: var(--nero); }
.legenda-lavori .prossimi { background: var(--nero); color: var(--oro-chiaro); }
.legenda-lavori .giacenza { background: #e6e1d8; color: var(--testo); }
#elenco-lavori .giorno-lavori:first-child { margin-top: 8px; }
.riga-articolo { background: #fff; border: 1px solid var(--avorio-3); border-radius: 14px; overflow: hidden; }
.riga-articolo.pronto { border-color: var(--oro); box-shadow: inset 4px 0 0 var(--oro); }
.riga-articolo.da_controllare { box-shadow: inset 4px 0 0 var(--nero); }
.riga-articolo.criticita, .riga-articolo.in-ritardo { box-shadow: inset 4px 0 0 var(--mattone); }
.riga-articolo.ritirato { opacity: .7; }
.riga-link { display: flex; align-items: center; gap: 12px; padding: 10px 12px; text-decoration: none; }
.riga-link img, .riga-link .mini, .pronto-scelta img, .pronto-scelta .mini { flex: none; width: 58px; height: 58px; border-radius: 10px; object-fit: cover; background: var(--avorio-3); }
.riga-link .mini, .pronto-scelta .mini { display: grid; place-items: center; font-size: 10px; text-align: center; color: var(--testo-tenue); }
.corpo-riga { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 3px; }
.corpo-riga b { font-size: 15px; }
.prima-riga .codice { font-size: 13px; }
.di-chi { font-family: var(--serif); font-size: 17px; }
.tappe { display: flex; flex-wrap: wrap; gap: 4px; }
.tappa { font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 99px; border: 1px solid var(--avorio-3); color: var(--testo-tenue); }
.tappa::before { content: '○ '; }
.tappa.in_corso { border-color: var(--oro); color: var(--oro-scuro); }
.tappa.in_corso::before { content: '◐ '; }
.tappa.completata { background: var(--avorio-2); color: var(--testo); }
.tappa.completata::before { content: '✓ '; }
.tappa.sospesa { background: var(--mattone-chiaro); border-color: var(--mattone-chiaro); color: var(--mattone); }
.tappa.sospesa::before { content: '! '; }
.lato-riga { flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; text-align: right; max-width: 42%; }
.stato-art { font-weight: 700; font-size: 14px; }
.lato-riga small { color: var(--testo-tenue); font-size: 13px; }
.barra-avanzamento { position: relative; display: block; width: 92px; height: 18px; border-radius: 99px; background: var(--avorio-2); overflow: hidden; }
.barra-avanzamento i { position: absolute; inset: 0 auto 0 0; background: var(--oro); border-radius: 99px; }
.barra-avanzamento b { position: relative; display: block; text-align: center; font-size: 11px; line-height: 18px; color: var(--nero); }
.lato-riga small.tardi { color: var(--mattone); font-weight: 700; }
.data-ritiro { display: flex; flex-direction: column; align-items: center; min-width: 84px; padding: 4px 10px; border-radius: 10px; background: var(--nero); color: var(--oro-chiaro); line-height: 1.1; }
.data-ritiro small { font-size: 10px !important; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #fff !important; opacity: .75; }
.data-ritiro b { font-size: 18px; text-transform: capitalize; white-space: nowrap; }
.data-ritiro.oggi { background: var(--oro); color: var(--nero); }
.data-ritiro.oggi small { color: var(--nero) !important; }
.data-ritiro.tardi { background: var(--mattone); color: #fff; }
.lato-riga .saldo { color: var(--testo); font-weight: 600; }
.controllo-riga { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; padding: 10px 12px; background: var(--avorio-2); border-top: 1px solid var(--avorio-3); font-weight: 600; font-size: 14px; }
.scheda .controllo-riga { border-radius: 12px; border-top: 0; }
.controllo-riga .campo { width: 110px; padding: 10px 12px; font-size: 17px; text-transform: uppercase; }
.controllo-riga .campo::placeholder { text-transform: none; }
.controllo-riga .bottone { padding: 11px 16px; font-size: 15px; }

/* Ritiro */
.pronti { display: grid; gap: 8px; }
.pronto-scelta { display: flex; align-items: center; gap: 12px; background: #fff; border: 2px solid var(--oro); border-radius: 14px; padding: 10px 12px; cursor: pointer; }
.pronto-scelta input { width: 26px; height: 26px; flex: none; accent-color: var(--nero); }
.pronto-scelta.tolto { border-color: var(--avorio-3); opacity: .55; }
.pronto-scelta .scaffale { font-size: 17px; color: var(--nero); }
.saldo-art { margin-left: auto; font-family: var(--serif); font-size: 20px; white-space: nowrap; }

/* Reparto */
.settimana { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; margin: 10px 0 4px; }
.settimana div { background: #fff; border: 1px solid var(--avorio-3); border-radius: 12px; text-align: center; padding: 6px 2px; }
.settimana div.oggi { border: 2px solid var(--oro); }
.settimana div.zero { opacity: .5; }
.settimana b { display: block; font-family: var(--serif); font-size: 22px; }
.settimana small { font-size: 11px; color: var(--testo-tenue); }
/* Reparto: settimana a colonne con pannello di dettaglio */
.pagina-reparto { max-width: 1500px; }
.testa-reparto { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-bottom: 12px; }
.nome-reparto .titolo-pagina { margin: 0; }
.nome-reparto span { color: var(--oro-scuro); font-family: var(--serif); font-size: 17px; }
.naviga-settimana { display: flex; align-items: center; gap: 6px; background: var(--nero); color: var(--avorio); border-radius: 14px; padding: 6px; }
.naviga-settimana > a { display: grid; place-items: center; min-width: 44px; height: 44px; border-radius: 10px; color: var(--oro-chiaro); text-decoration: none; font-size: 26px; }
.naviga-settimana > span { padding: 0 8px; text-align: center; }
.naviga-settimana small { display: block; font-size: 11px; color: #a99d8b; letter-spacing: 1px; text-transform: uppercase; }
.naviga-settimana b { font-size: 16px; white-space: nowrap; }
.naviga-settimana .oggi-settimana { font-size: 15px; font-weight: 700; padding: 0 14px; background: var(--oro); color: var(--nero); }
.contatori-reparto { display: flex; gap: 8px; margin-left: auto; }
.contatori-reparto span { min-width: 104px; padding: 8px 14px; border-radius: 12px; background: var(--nero); color: #cfc4b2; font-size: 13px; }
.contatori-reparto b { display: block; font-family: var(--serif); font-size: 28px; line-height: 1.1; color: var(--oro-chiaro); }
.contatori-reparto .allarme { background: var(--mattone); color: #fff; }
.contatori-reparto .allarme b { color: #fff; }
.barra-reparto { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 6px 0 10px; }
.viste-reparto { display: flex; gap: 4px; padding: 4px; border-radius: 12px; background: var(--avorio-2); }
.viste-reparto a { padding: 10px 18px; border-radius: 9px; text-decoration: none; font-weight: 700; color: var(--testo-tenue); }
.viste-reparto a.attivo { background: var(--oro); color: var(--nero); }
.cerca-reparto { flex: 1; min-width: 220px; }
.cerca-reparto .campo { padding: 11px 14px; font-size: 16px; }
.settimane-reparto { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 4px; margin-bottom: 10px; scrollbar-width: none; }
.settimane-reparto::-webkit-scrollbar { display: none; }
.settimane-reparto a { flex: none; display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 10px; border: 1.5px solid var(--avorio-3); background: #fff; text-decoration: none; font-weight: 600; font-size: 14px; }
.settimane-reparto a b { padding: 1px 8px; border-radius: 99px; background: var(--avorio-2); }
.settimane-reparto a.zero { color: var(--testo-tenue); }
.settimane-reparto a.attivo { background: var(--nero); border-color: var(--nero); color: var(--oro-chiaro); }
.settimane-reparto a.attivo b { background: var(--oro); color: var(--nero); }
.settimana-libera { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin: 0 0 10px; padding: 12px 16px; border-radius: 12px; background: #fffaf0; border: 1.5px solid var(--oro); font-weight: 600; }
.settimana-libera .bottone { padding: 11px 16px; font-size: 15px; }
.tavola { display: grid; grid-template-columns: repeat(6, minmax(150px, 1fr)); gap: 10px; overflow-x: auto; padding-bottom: 8px; scroll-snap-type: x proximity; }
.colonna { display: flex; flex-direction: column; min-height: 220px; border-radius: var(--raggio); background: var(--avorio-2); scroll-snap-align: start; }
.colonna > header { position: relative; padding: 10px 10px 8px; text-align: center; border-bottom: 1px solid var(--avorio-3); }
.colonna > header b { display: block; font-family: var(--serif); font-size: 19px; }
.colonna > header > span { font-size: 14px; color: var(--testo-tenue); }
.colonna.oggi { background: #fffaf0; box-shadow: inset 0 0 0 2px var(--oro); }
.colonna.oggi > header > span { color: var(--oro-scuro); font-weight: 700; }
.colonna.chiusa { opacity: .55; }
.colonna.vuota .carte { opacity: .7; }
.posti-colonna { display: inline-block; margin-top: 6px; padding: 3px 12px; border-radius: 99px; background: #fff; border: 1px solid var(--avorio-3); font-style: normal; font-weight: 800; font-size: 15px; }
.posti-colonna.pieno { background: #e3f1e6; border-color: #b9dcc2; color: #1f5f33; }
.per-ritiro { display: block; margin-top: 4px; font-size: 11px; color: var(--oro-scuro); }
.carte { display: flex; flex-direction: column; gap: 6px; padding: 6px; }
.colonna-vuota { margin: 12px 0; text-align: center; font-size: 13px; color: var(--testo-tenue); }
.carta-lavoro { display: flex; align-items: flex-start; gap: 8px; width: 100%; padding: 6px; border-radius: 10px; border: 1.5px solid var(--avorio-3); background: #fff; text-align: left; cursor: pointer; color: var(--testo); }
.carta-lavoro img, .carta-lavoro .senza-foto { flex: none; width: 44px; height: 44px; border-radius: 8px; object-fit: cover; background: var(--avorio-3); }
.carta-riga { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 6px; min-width: 0; }
.carta-riga .carta-cosa { flex: 1 1 90px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.carta-testo small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.carta-segni { display: flex; flex-wrap: wrap; gap: 3px; margin-top: 2px; }
.carta-segni > span { padding: 1px 7px; border-radius: 99px; font-size: 11px; font-weight: 700; }
.chip-passa { background: var(--nero); color: var(--oro-chiaro); }
.chip-scaffale { background: var(--oro); color: var(--nero); }
.contatori-reparto .pronti-scaffale { background: var(--oro); color: var(--nero); }
.contatori-reparto .pronti-scaffale b { color: var(--nero); }
.giorni-reparto button.scaffale { border-color: var(--oro); }
.pronto-ritiro { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 12px; border-radius: 12px; background: #fffaf0; border: 2px solid var(--oro); }
.pronto-ritiro p { flex-basis: 100%; margin: 0; }
.pronto-ritiro label { display: flex; align-items: center; gap: 8px; font-weight: 700; }
.pronto-ritiro .campo { width: 90px; padding: 10px; font-size: 18px; text-align: center; text-transform: uppercase; }
.pronto-ritiro .bottone { flex: 1; padding: 13px 16px; font-size: 16px; }
.va-scaffale { font-size: 16px; }
.va-scaffale b { font-size: 20px; padding: 2px 10px; border-radius: 8px; background: var(--nero); color: var(--oro-chiaro); }
.pronto-fatto { margin: 0; padding: 10px 12px; border-radius: 10px; background: #e3f1e6; color: #1f5f33; font-weight: 600; }
.chip-urgente { background: var(--mattone); color: #fff; }
.chip-ritardo { background: var(--mattone-chiaro); color: var(--mattone); }
.passaggi-reparti { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 12px; }
.passaggi-reparti h3 { margin: 0 0 4px; font-family: var(--serif); font-size: 18px; }
.spiega-passaggi { margin: 0 0 8px; font-size: 13px; color: var(--testo-tenue); }
.riga-passaggio { display: flex; align-items: center; gap: 10px; padding: 8px 6px; border-top: 1px solid var(--avorio-3); text-decoration: none; color: var(--testo); }
.riga-passaggio .quando { flex: none; width: 96px; padding: 6px 4px; border-radius: 8px; text-align: center; font-weight: 800; font-size: 13px; line-height: 1.2; background: var(--avorio-2); }
.riga-passaggio.giallo .quando { background: #f6c443; color: var(--nero); }
.riga-passaggio.rosso .quando { background: var(--mattone-chiaro); color: var(--mattone); }
.riga-passaggio.ritardo .quando { background: var(--mattone); color: #fff; }
.riga-passaggio.rosso, .riga-passaggio.ritardo { background: #fff8f6; box-shadow: inset 4px 0 0 var(--mattone); }
.riga-passaggio > span:nth-child(2) { flex: 1; min-width: 0; }
.riga-passaggio small, .riga-arrivo small { display: block; color: var(--testo-tenue); font-size: 13px; }
.riga-passaggio .chip-stato { margin: 0; font-style: normal; }
.riga-arrivo { display: block; padding: 8px 6px; border-top: 1px solid var(--avorio-3); text-decoration: none; color: var(--testo); }
.arrivo-date { display: flex; align-items: stretch; gap: 6px; margin-top: 6px; }
.arrivo-date .freccia { align-self: center; font-weight: 800; color: var(--testo-tenue); }
.data-box { flex: 1; padding: 5px 9px; border-radius: 8px; background: var(--avorio-2); }
.data-box small { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; }
.data-box b { font-size: 15px; }
.data-box.tua { background: #fffaf0; box-shadow: inset 0 0 0 1.5px var(--oro); }
.riga-arrivo.tardi .data-box:first-child { background: var(--mattone); color: #fff; }
.riga-arrivo.tardi .data-box:first-child small { color: #fff; }
.chip-passa.giallo { background: #f6c443; color: var(--nero); }
.chip-passa.rosso, .chip-passa.ritardo { background: var(--mattone); color: #fff; }
.chip-arriva { background: var(--avorio-2); color: var(--testo-tenue); }
.chip-arriva.tardi { background: var(--mattone-chiaro); color: var(--mattone); }
.carta-lavoro.passa-giallo { box-shadow: inset 4px 0 0 #f6c443; }
.carta-lavoro.passa-rosso, .carta-lavoro.passa-ritardo { border-color: var(--mattone); box-shadow: inset 4px 0 0 var(--mattone); background: #fff8f6; }
.carta-foto { position: relative; flex: none; display: flex; }
.ordine-carta { position: absolute; top: -5px; left: -5px; min-width: 22px; height: 22px; padding: 0 5px; border-radius: 99px; background: var(--nero); color: var(--oro-chiaro); font-size: 12px; line-height: 22px; text-align: center; box-shadow: 0 0 0 2px #fff; }
.carta-lavoro.spenta, .riga-passaggio.spenta, .riga-arrivo.spenta { opacity: .22; }
.legenda-reparto { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 0 0 8px; font-size: 13px; color: var(--testo-tenue); }
.legenda-reparto .chip-passa { padding: 1px 7px; border-radius: 99px; font-size: 11px; font-weight: 700; }
.cesta { margin: 0 0 12px; padding: 12px 14px; border-radius: var(--raggio); background: #fffaf0; border: 2px solid var(--oro); }
.cesta.piena { background: #fff3ef; border-color: var(--mattone); }
.cesta-testa { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin-bottom: 8px; }
.cesta-testa b { font-family: var(--serif); font-size: 19px; }
.cesta-testa span { font-size: 14px; color: var(--testo-tenue); }
.cesta.piena .cesta-testa span { color: var(--mattone); font-weight: 700; }
.righe-cesta { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 6px; margin-bottom: 10px; }
.riga-cesta { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 10px; background: #fff; border: 1.5px solid var(--avorio-3); cursor: pointer; }
.riga-cesta input { flex: none; width: 22px; height: 22px; accent-color: var(--nero); }
.riga-cesta small { display: block; font-size: 12px; color: var(--testo-tenue); }
.posto-cesta { flex: none; min-width: 64px; padding: 4px 8px; border-radius: 8px; background: var(--nero); color: var(--oro-chiaro); font-weight: 800; font-size: 16px; text-align: center; }
.cesta .bottone { width: 100%; padding: 13px 16px; font-size: 16px; }
.cesta-vuota { margin: 0 0 12px; padding: 10px 14px; border-radius: 10px; background: #e3f1e6; color: #1f5f33; font-weight: 600; }
.velo-sera { position: fixed; inset: 0; z-index: 60; background: rgba(0,0,0,.45); }
.domanda-sera { position: fixed; z-index: 61; left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(460px, calc(100% - 32px)); padding: 22px; border-radius: 16px; background: var(--avorio); box-shadow: 0 20px 60px rgba(0,0,0,.35); border-top: 6px solid var(--mattone); }
.domanda-sera h2 { margin: 0 0 6px; font-family: var(--serif); font-size: 24px; }
.domanda-sera p { margin: 0 0 10px; font-size: 17px; }
.domanda-sera .da-fare-sera { font-size: 15px; }
.domanda-sera .bottone { width: 100%; padding: 14px; font-size: 17px; }
.velo-sera[hidden], .domanda-sera[hidden] { display: none; }
.domanda-sera form { margin: 0 0 8px; }
.domanda-sera .bottone small { display: block; font-size: 12px; font-weight: 600; opacity: .8; }
.chiedi-reparto { margin: 10px 0 0; padding: 10px 14px; border-radius: 10px; background: #fff3ef; border: 2px solid var(--mattone); color: var(--mattone); font-weight: 700; font-size: 15px; }
.giorno.da-chiedere { position: relative; }
.giorno.da-chiedere::after { content: '!'; position: absolute; top: -6px; right: -6px; width: 20px; height: 20px; border-radius: 50%; background: var(--mattone); color: #fff; font-size: 13px; font-weight: 800; line-height: 20px; text-align: center; }
.sei-sicuro > summary { list-style: none; display: block; width: 100%; padding: 14px; font-size: 17px; }
.sei-sicuro > summary::-webkit-details-marker { display: none; }
.sei-sicuro[open] > summary { display: none; }
.sei-sicuro p { margin: 4px 0 8px; padding: 10px 12px; border-radius: 10px; background: #fff7e6; border: 1.5px solid var(--oro); font-size: 16px; }
.domanda-sera.mattina { border-top-color: var(--oro); max-height: calc(100vh - 32px); overflow-y: auto; }
/* Reparti a data indicata: il giorno per cui l'accettazione prende gli articoli (regola di Luca). */
.giorni-accettazione { margin: 0 0 12px; border-radius: var(--raggio); background: #fff; border: 1.5px solid var(--avorio-3); }
.giorni-accettazione.da-decidere { border-color: var(--mattone); }
.giorni-accettazione > summary { list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 10px 14px; cursor: pointer; }
.giorni-accettazione > summary::-webkit-details-marker { display: none; }
.giorni-accettazione > summary em { margin-left: auto; font-style: normal; font-weight: 700; font-size: 14px; color: var(--oro-scuro); text-decoration: underline; }
.giorni-accettazione[open] > summary em { visibility: hidden; }
.giorno-linea { padding: 4px 10px; border-radius: 99px; background: var(--avorio-2); font-size: 14px; }
.giorno-linea small { color: var(--testo-tenue); }
.giorno-linea.pieno { background: var(--mattone); color: #fff; }
.giorno-linea.pieno small { color: #fff; }
.giorni-accettazione .scelta-giorni { padding: 0 14px 14px; }
.scelta-giorni fieldset { margin: 0 0 10px; padding: 0; border: 0; min-width: 0; }
.domanda-sera.mattina { overflow-x: hidden; }
.scelta-giorni legend { margin-bottom: 6px; font-weight: 800; }
.scelta-giorni legend small { font-weight: 500; color: var(--testo-tenue); }
.pillole-giorni { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }
.pillole-giorni::-webkit-scrollbar { display: none; }
.pillole-giorni label { flex: none; cursor: pointer; }
.pillole-giorni input { position: absolute; opacity: 0; pointer-events: none; }
.pillole-giorni span { display: flex; flex-direction: column; align-items: center; min-width: 62px; padding: 8px 10px; border-radius: 12px; border: 1.5px solid var(--avorio-3); background: #fff; font-size: 13px; text-transform: capitalize; }
.pillole-giorni span b { font-size: 17px; }
.pillole-giorni input:checked + span { background: var(--nero); border-color: var(--nero); color: var(--oro-chiaro); }
.scelta-giorni .bottone { width: 100%; padding: 13px; font-size: 17px; }
.giorno-accettazione { display: block; margin-top: 4px; font-size: 11px; font-weight: 800; color: var(--nero); background: var(--oro); border-radius: 99px; padding: 2px 8px; }
.ordine-esempio {display: inline-grid; place-items: center; min-width: 20px; height: 20px; border-radius: 99px; background: var(--nero); color: var(--oro-chiaro); font-size: 11px; font-weight: 800; }
.carta-lavoro.scelta { border-color: var(--oro); box-shadow: 0 0 0 2px var(--oro); }
.carta-lavoro.urgente { border-color: var(--mattone); }
.carta-lavoro.ritardo { background: #fff8f6; }
.carta-lavoro.stato-completata { opacity: .7; }
.carta-testo { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.colonna, .carte { min-width: 0; }
.carta-riga .codice { font-size: 13px; flex: none; }
.carta-cosa { font-weight: 700; }
.carta-testo small { font-size: 12px; color: var(--testo-tenue); line-height: 1.25; }
.carta-testo small.tardi { color: var(--mattone); font-weight: 700; }
.chip-stato { align-self: flex-start; margin-top: 4px; padding: 3px 9px; border-radius: 99px; font-size: 12px; font-weight: 700; background: #fdf0d8; color: #8a5a00; }
.stato-in_corso .chip-stato { background: #e7eefb; color: #2b4f8a; }
.stato-completata .chip-stato { background: #e3f1e6; color: #1f5f33; }
.stato-sospesa .chip-stato { background: var(--mattone); color: #fff; }
.pannello-dettaglio { position: fixed; top: 0; right: 0; bottom: 0; z-index: 40; width: min(440px, 100%); background: var(--avorio); box-shadow: -10px 0 40px rgba(0,0,0,.25); display: flex; flex-direction: column; }
.pannello-testa { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; background: var(--nero); color: var(--oro-chiaro); font-family: var(--serif); font-size: 19px; }
.pannello-testa button { width: 40px; height: 40px; border-radius: 50%; border: 1px solid #3a332c; background: transparent; color: var(--avorio); font-size: 24px; cursor: pointer; }
#pannello-corpo { flex: 1; overflow-y: auto; padding: 12px; }
#pannello-corpo .scheda-lavoro { border: 0; padding: 0; background: transparent; }
.velo { position: fixed; inset: 0; z-index: 35; background: rgba(20,18,16,.35); }
.scadenza-dettaglio { margin: 0; padding: 10px 12px; border-radius: 10px; background: #fff; border: 1px solid var(--avorio-3); }
.scadenza-dettaglio.tardi { background: var(--mattone-chiaro); color: var(--mattone); border-color: var(--mattone-chiaro); }
/* La scheda del reparto a passi (richiesta di Luca, 29/10): il passo da fare adesso in oro, i fatti in verde, i
   prossimi spenti. Il percorso è una riga da leggere, non da toccare. */
.passi-lavoro { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 8px; }
.passo { display: flex; gap: 10px; padding: 10px 12px; border-radius: 12px; border: 1.5px solid var(--avorio-3); background: #fff; }
.numero-passo { flex: none; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-weight: 800; font-size: 15px; background: var(--avorio-2); color: var(--testo-tenue); }
.corpo-passo { flex: 1; min-width: 0; display: grid; gap: 6px; align-content: start; }
.titolo-passo { font-size: 17px; line-height: 1.25; padding-top: 4px; justify-self: start; text-align: left; }
.aiuto-passo { color: var(--testo-tenue); font-size: 13px; }
.passo.ora { border: 2px solid var(--oro); background: #fffaf0; }
.passo.ora .numero-passo { background: var(--oro); color: var(--nero); }
.passo.fatto { background: #f3f9f4; border-color: #cfe5d5; }
.passo.fatto .numero-passo { background: #1f7a3d; color: #fff; }
.passo.dopo { background: transparent; border-style: dashed; }
.passo.dopo .titolo-passo { color: var(--testo-tenue); font-weight: 600; }
.passo.fermo { border-color: var(--mattone); }
.passo .pronto-ritiro { padding: 0; border: 0; background: none; }
.posa-scaffale { display: grid; gap: 8px; }
.posa-scaffale .bottone { padding: 13px 16px; font-size: 16px; }
.sigla-scaffale { display: inline-block; padding: 1px 9px; border-radius: 7px; background: var(--nero); color: var(--oro-chiaro); font-size: 16px; }
.percorso-riga { margin: 10px 2px 0; font-size: 13px; color: var(--testo-tenue); line-height: 1.6; }
.percorso-riga .giro-completata { color: #1f5f33; }
.percorso-riga .giro-qui { font-weight: 800; color: var(--testo); }
/* Le lavorazioni ancora da fare sembrano quello che sono: caselle da toccare. */
.spunta-lavorazione:not(.sola-lettura):not(.completata) { background: #fff; border: 2px solid var(--oro-scuro); }
.spunta-lavorazione:not(.sola-lettura):not(.completata) small { color: var(--oro-scuro); font-weight: 700; }
.percorso { list-style: none; margin: 0; padding: 4px 0; display: grid; gap: 2px; }
.percorso li { display: flex; align-items: center; gap: 10px; padding: 6px 4px; font-size: 15px; }
.percorso li i { flex: none; width: 22px; height: 22px; border-radius: 50%; border: 2px solid var(--avorio-3); background: #fff; display: grid; place-items: center; font-style: normal; font-size: 12px; color: #fff; }
.percorso li.completata i { background: var(--oro-scuro); border-color: var(--oro-scuro); }
.percorso li.completata i::after { content: '✓'; }
.percorso li.in_corso i { border-color: var(--oro); background: linear-gradient(90deg, var(--oro) 50%, #fff 50%); }
.percorso li.sospesa i { border-color: var(--mattone); background: var(--mattone); }
.percorso li.questo span { font-weight: 800; }
.percorso li small { margin-left: auto; color: var(--testo-tenue); font-size: 13px; }
.giorni-reparto { display: flex; gap: 8px; overflow-x: auto; padding: 4px 0 6px; margin-top: 6px; scrollbar-width: none; }
.giorni-reparto::-webkit-scrollbar { display: none; }
.giorni-reparto button { flex: none; display: flex; align-items: center; gap: 8px; padding: 12px 16px; border-radius: 12px; border: 1.5px solid var(--avorio-3); background: #fff; font-size: 16px; font-weight: 700; cursor: pointer; }
.giorni-reparto button b { min-width: 26px; padding: 2px 7px; border-radius: 99px; background: var(--avorio-2); font-size: 14px; text-align: center; }
.giorni-reparto button.attivo { background: var(--nero); border-color: var(--nero); color: var(--oro-chiaro); }
.giorni-reparto button.attivo b { background: var(--oro); color: var(--nero); }
.giorni-reparto button.ritardo, .giorni-reparto button.fermi { border-color: var(--mattone); color: var(--mattone); }
.giorni-reparto button.ritardo b, .giorni-reparto button.fermi b { background: var(--mattone); color: #fff; }
.giorni-reparto button.ritardo.attivo, .giorni-reparto button.fermi.attivo { background: var(--mattone); color: #fff; }
.giorni-reparto button.finiti { color: #1f5f33; }
p.attesa { margin: 0; }
.posti-reparto { margin-top: 18px; }
.posti-reparto > summary { list-style: none; cursor: pointer; display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; }
.posti-reparto > summary::-webkit-details-marker { display: none; }
.posti-reparto > summary span { color: var(--testo-tenue); font-size: 14px; }
.posti-reparto[open] > summary { margin-bottom: 8px; }
.riga-posti { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; padding: 8px 0; border-top: 1px solid var(--avorio-3); }
.riga-posti > b { width: 80px; }
.riga-posti label { display: flex; align-items: center; gap: 6px; font-size: 14px; }
.riga-posti label span { color: var(--testo-tenue); }
.riga-posti label em { font-style: normal; font-weight: 600; }
.riga-posti label.pieno em { color: var(--mattone); }
.riga-posti input { width: 48px; text-align: center; font-size: 17px; padding: 7px 4px; border-radius: 9px; border: 1.5px solid var(--avorio-3); }
.riga-posti .bottone { padding: 9px 14px; font-size: 14px; margin-left: auto; }
.settimana-borse { padding: 10px 0; border-top: 1px solid var(--avorio-3); }
.settimana-borse > b small { font-weight: 400; color: var(--testo-tenue); }
.settimana-borse.piena > b { color: var(--mattone); }
.giorni-borse { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 6px; margin-top: 6px; }
.giorni-borse span { display: flex; justify-content: space-between; gap: 8px; padding: 7px 10px; border-radius: 9px; background: var(--avorio-2); font-size: 14px; }
.giorni-borse em { font-style: normal; font-weight: 700; }
.giorni-borse .pieno em { color: var(--mattone); }
.giorni-borse .chiuso { opacity: .55; }
.gruppo-reparto.ritardo .giorno-gruppo, .gruppo-reparto.fermi .giorno-gruppo { color: var(--mattone); }
.gruppo-reparto.finiti { opacity: .75; }
.schede-reparto { display: grid; grid-template-columns: repeat(auto-fill, minmax(420px, 1fr)); gap: 10px; }
.scheda-lavoro { display: flex; flex-direction: column; gap: 8px; background: #fff; border: 1px solid var(--avorio-3); border-radius: var(--raggio); padding: 12px; scroll-margin-top: 90px; }
.testa-lavoro { display: flex; align-items: flex-start; gap: 12px; text-decoration: none; color: inherit; border-radius: 10px; }
.testa-lavoro:active { background: var(--avorio-2); }
.testa-lavoro img, .testa-lavoro .senza-foto { flex: none; display: grid; place-items: center; width: 96px; height: 96px; border-radius: 12px; object-fit: cover; background: var(--avorio-3); font-size: 11px; color: var(--testo-tenue); }
.apri-scheda { color: var(--oro-scuro); font-size: 13px; font-weight: 600; }
.percento { margin-left: auto; flex: none; font-family: var(--serif); font-size: 24px; font-weight: 700; color: var(--oro-scuro); }
.lavorazioni-spunta { display: grid; gap: 6px; }
.lavorazioni-spunta form { margin: 0; }
.spunta-lavorazione { width: 100%; min-height: 50px; display: flex; align-items: center; gap: 10px; padding: 9px 12px; border: 1.5px solid var(--avorio-3); border-radius: 11px; background: var(--avorio); color: var(--testo); font-size: 16px; font-weight: 600; text-align: left; cursor: pointer; }
.spunta-lavorazione > span { flex: 1; }
.spunta-lavorazione small { font-size: 12px; font-weight: 500; color: var(--testo-tenue); white-space: nowrap; }
.spunta-lavorazione i { flex: none; width: 26px; height: 26px; border-radius: 7px; border: 2px solid var(--oro-scuro); background: #fff; display: grid; place-items: center; font-style: normal; color: #fff; font-weight: 800; }
.spunta-lavorazione.in_corso i { background: linear-gradient(90deg, var(--oro) 50%, #fff 50%); }
.spunta-lavorazione.completata { background: #e3f1e6; border-color: #b9dcc2; color: #1f5f33; }
.spunta-lavorazione.completata i { background: #1f7a3d; border-color: #1f7a3d; }
.spunta-lavorazione.completata i::after { content: '✓'; }
.spunta-lavorazione.sospesa { border-color: var(--mattone); }
.spunta-lavorazione.sospesa i { border-color: var(--mattone); }
.spunta-lavorazione.sola-lettura { cursor: default; }
.scheda-lavoro:target { box-shadow: 0 0 0 3px var(--oro); }
.scheda-lavoro.urgente { border-color: var(--mattone); }
.scheda-lavoro.stato-sospesa { background: #fff8f6; border-color: var(--mattone); }
.scheda-lavoro.stato-in_corso { box-shadow: inset 4px 0 0 var(--oro); }
.foto-lavoro img, .foto-lavoro span { display: grid; place-items: center; width: 96px; height: 96px; border-radius: 12px; object-fit: cover; background: var(--avorio-3); font-size: 11px; color: var(--testo-tenue); text-decoration: none; }
.dati-lavoro { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.dati-lavoro .prima-riga { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.dati-lavoro .codice { font-size: 17px; font-weight: 700; text-decoration: none; }
.entro { font-size: 13px; font-weight: 600; color: var(--testo-tenue); }
.entro.tardi { color: var(--mattone); }
.cosa { font-size: 15px; }
.segno-art, .altri { color: var(--testo-tenue); font-size: 13px; }
.da-fare { margin: 2px 0; padding: 0; list-style: none; display: grid; gap: 3px; }
.da-fare li { font-size: 16px; font-weight: 600; }
.da-fare li::before { content: '○ '; color: var(--oro-scuro); }
.da-fare li.in_corso::before { content: '◐ '; }
.da-fare li.completata { color: var(--testo-tenue); text-decoration: line-through; }
.da-fare li.completata::before { content: '✓ '; }
.da-fare li.sospesa::before { content: '! '; color: var(--mattone); }
.nota-lavoro { margin: 0; padding: 6px 10px; border-radius: 9px; background: var(--avorio-2); font-size: 14px; }
.nota-lavoro.critica { background: var(--mattone-chiaro); color: var(--mattone); font-weight: 600; }
.nota-lavoro small { font-weight: 400; }
.azioni-lavoro { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 8px; }
.azioni-lavoro > form, .azioni-lavoro > span { flex: 1 1 160px; }
.azioni-lavoro > details { flex: 1 1 100%; }
.azioni-lavoro .bottone { width: 100%; padding: 14px 16px; }
.attesa, .finito, .stato-lettura { font-size: 13px; font-weight: 600; color: var(--testo-tenue); text-align: center; padding: 10px 6px; border-radius: 10px; background: var(--avorio-2); }
.finito { color: #1f5f33; background: #e3f1e6; }
.problema > summary { list-style: none; cursor: pointer; text-align: center; font-size: 13px; font-weight: 600; color: var(--mattone); padding: 6px; }
.problema > summary::-webkit-details-marker { display: none; }
.problema form { display: grid; gap: 6px; margin-top: 6px; }
.problema textarea { min-height: 70px; font-size: 16px; padding: 10px; }
.nota-foto > summary { color: var(--oro-scuro); }
.nota-foto .bottone { padding: 12px; font-size: 15px; }

/* Vendita al banco */
#cerca-prodotto { margin-bottom: 10px; font-size: 16px; padding: 12px; }
.prodotti { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.prodotto { position: relative; }
.prodotto .aggiungi { width: 100%; min-height: 84px; display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; gap: 6px; padding: 10px 12px; border-radius: 14px; border: 1.5px solid var(--avorio-3); background: #fff; text-align: left; cursor: pointer; }
.prodotto .aggiungi b { font-size: 15px; line-height: 1.2; }
.prodotto .aggiungi span { font-family: var(--serif); font-size: 19px; }
.prodotto .quanti { position: absolute; right: 10px; bottom: 10px; font-style: normal; font-weight: 800; font-size: 18px; color: var(--nero); }
.prodotto .togli { display: none; position: absolute; top: -8px; right: -6px; width: 34px; height: 34px; border-radius: 50%; border: 0; background: var(--mattone); color: #fff; font-size: 20px; font-weight: 700; cursor: pointer; }
.prodotto.nel-carrello .aggiungi { border-color: var(--oro); background: #fffaf0; box-shadow: inset 0 0 0 1.5px var(--oro); }
.prodotto.nel-carrello .togli { display: block; }
.altri-prodotti { margin-top: 12px; }
.altri-prodotti > summary { cursor: pointer; font-weight: 600; color: var(--oro-scuro); padding: 8px 0; list-style: none; }
.altri-prodotti > summary::-webkit-details-marker { display: none; }
.carrello { margin: 10px 0 0; padding: 0; list-style: none; color: #cfc4b2; font-size: 15px; display: grid; gap: 3px; }

/* Persone e calendario della Direzione */
.nuova-persona > summary, .persona-riga > summary { list-style: none; cursor: pointer; }
.nuova-persona > summary::-webkit-details-marker, .persona-riga > summary::-webkit-details-marker { display: none; }
.nuova-persona[open] > summary { margin-bottom: 12px; }
.elenco-persone { display: grid; gap: 8px; margin-top: 14px; }
.persona-riga > summary { display: flex; align-items: center; gap: 12px; }
.persona-riga[open] > summary { margin-bottom: 12px; }
.persona-riga.non-attiva { opacity: .6; }
.iniziali-persona { flex: none; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--nero); color: var(--oro-chiaro); font-weight: 700; }
.chi-persona { min-width: 0; flex: 1; }
.chi-persona b { display: block; font-size: 17px; }
.chi-persona small, .persona-riga .ultimo { color: var(--testo-tenue); font-size: 13px; }
.incarichi { display: grid; gap: 10px; }
.ruoli-generali { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.ruoli-reparto { border-collapse: collapse; width: 100%; max-width: 520px; }
.ruoli-reparto th { font-size: 12px; font-weight: 600; color: var(--testo-tenue); text-align: center; padding: 4px; }
.ruoli-reparto td { padding: 6px 4px; border-top: 1px solid var(--avorio-3); }
.ruoli-reparto td:not(:first-child) { text-align: center; }
.ruoli-reparto input { width: 24px; height: 24px; accent-color: var(--nero); }
.campo.pin { max-width: 200px; letter-spacing: 4px; }
.campo.pin::placeholder { letter-spacing: 0; }
.riga-pin { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; }
.riga-pin .bottone { padding: 12px 16px; font-size: 15px; }
.riga-festivita { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 8px 0; border-top: 1px solid var(--avorio-3); }
.riga-festivita b { flex: 1; min-width: 180px; }
.riga-festivita .bottone { padding: 10px 18px; font-size: 15px; }
.riga-chiusura { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; padding: 12px 16px; }
.riga-chiusura > div { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.riga-chiusura small { color: var(--testo-tenue); }
.riga-chiusura .attenzione { color: var(--mattone); font-weight: 600; }

/* Listino della Direzione */
.spiega { color: var(--testo-tenue); max-width: 780px; margin: 0 0 12px; line-height: 1.4; }
.spiega b { color: var(--testo); }
.listino { display: grid; gap: 8px; }
.voce-listino { display: grid; grid-template-columns: minmax(180px, 1.3fr) auto minmax(220px, 1.4fr); gap: 10px 16px; align-items: center; background: #fff; border: 1px solid var(--avorio-3); border-radius: 14px; padding: 10px 14px; scroll-margin-top: 90px; }
.voce-listino.della-sede { box-shadow: inset 4px 0 0 var(--oro); }
.voce-listino.non-offerta { opacity: .6; }
.nome-voce b { display: block; font-size: 16px; }
.nome-voce small { color: var(--testo-tenue); font-size: 13px; }
.segno-sede { display: none; color: var(--oro-scuro); font-weight: 600; }
.della-sede .segno-sede { display: inline; }
.tre-prezzi { display: flex; gap: 6px; }
.tre-prezzi label { display: flex; flex-direction: column; align-items: center; gap: 2px; font-size: 11px; color: var(--testo-tenue); text-transform: uppercase; letter-spacing: .5px; }
.tre-prezzi input { width: 72px; text-align: center; font-size: 17px; padding: 9px 4px; border-radius: 10px; border: 1.5px solid var(--avorio-3); background: var(--avorio); outline: none; }
.tre-prezzi label:nth-child(2) input { border-color: var(--oro); background: #fff; font-weight: 700; }
.tre-prezzi input:focus { border-color: var(--nero); }
.esito-voce { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; }
.pulsanti-voce { width: 100%; font-size: 14px; color: var(--testo-tenue); }
.pulsanti-voce b { color: var(--testo); }
.esito-voce .salva { padding: 9px 16px; font-size: 15px; }
.esito-voce .spunta { font-size: 14px; }
.torna-base { background: none; border: 0; padding: 6px 2px; color: var(--oro-scuro); font-weight: 600; font-size: 13px; text-decoration: underline; cursor: pointer; }
.esito { font-size: 13px; font-weight: 600; }
.esito.salvato { color: #1f5f33; }
.esito.errore-voce { color: var(--mattone); }
@media (max-width: 900px) { .voce-listino { grid-template-columns: 1fr auto; } .esito-voce { grid-column: 1 / -1; } }

.corto { display: none; }
.campo-con-suggerimenti { min-width: 0; }
.suggeriti { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.suggeriti button { border: 1.5px solid var(--avorio-3); background: #fff; border-radius: 99px; padding: 9px 13px; font-size: 14px; font-weight: 600; color: var(--testo); }
.suggeriti button b { color: var(--oro-scuro); }
.cerca-lavorazione { margin-bottom: 10px; padding: 11px 14px; font-size: 15px; }
.griglia-scheda { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 700px) { .griglia-scheda { grid-template-columns: 1fr; } }

@media (max-width: 900px) {
  .corpo { grid-template-columns: 1fr; }
  .piede { left: 0; }
  .laterale-fisso { position: static; min-height: 0; }
  .categorie { grid-template-columns: repeat(4, 1fr); }
  /* Scelto il tipo, resta una sola riga «Scarpa donna · cambia ›» */
  .categorie.chiuse { grid-template-columns: 1fr; }
  .categorie.chiuse .cat:not(.scelta) { display: none; }
  .categorie.chiuse .cat.scelta { display: flex; align-items: center; gap: 12px; padding: 8px 14px; text-align: left; font-size: 15px; }
  .categorie.chiuse .cat.scelta svg { margin: 0; width: 40px; height: 26px; }
  .categorie.chiuse .cat.scelta::after { content: 'cambia ›'; margin-left: auto; font-size: 13px; color: var(--oro-chiaro); opacity: .85; }
  .giorni { grid-template-columns: repeat(6, 1fr); }
  .cassa, .fatto .azioni { grid-template-columns: 1fr; }
  .passi { display: none; }
}

/* iPhone: tutto a una colonna, barra in basso sottile, riepilogo compatto in alto */
@media (max-width: 600px) {
  html, body { font-size: 15px; }
  .barra { min-height: 54px; padding: 6px 12px; gap: 10px; }
  .barra img { width: 38px; height: 38px; }
  .marchio { font-size: 16px; }
  .marchio small { font-size: 10px; letter-spacing: 1px; }
  .operatore { margin-left: auto; padding-left: 10px; gap: 6px; }
  .operatore > div:not(.iniziali) { display: none; }
  .operatore .iniziali { width: 34px; height: 34px; font-size: 13px; }
  .operatore form button { padding: 6px 10px; }
  .pagina { padding: 16px; }
  h1.titolo-pagina { font-size: 24px; }
  .cerca-cliente { flex-direction: column; }
  .cerca-cliente .campo { font-size: 18px; padding: 14px; }

  .laterale { padding: 10px 12px; border-right: 0; border-bottom: 1px solid var(--avorio-3); gap: 8px; }
  .laterale-fisso { gap: 8px; }
  .laterale .etichetta { display: none; }
  .laterale .elenco-articoli > summary.etichetta { display: flex; margin: 0; padding: 10px 12px; min-height: 44px; background: #fff; border: 1px solid var(--avorio-3); border-radius: 12px; }
  .elenco-articoli[open] > summary.etichetta { margin-bottom: 8px; }
  .cliente { padding: 10px 12px; }
  .cliente h2 { font-size: 19px; }
  .art { grid-template-columns: 40px 1fr auto; padding: 6px; }
  .art img, .art .mini { width: 40px; height: 40px; }
  .totale { padding: 10px 12px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 4px 10px; }
  .totale .riga { margin: 0; grid-column: 1; }
  .totale .riga.grande { font-size: 18px; margin: 0; }
  .totale .bottone { grid-column: 2; grid-row: 1 / span 2; margin: 0 !important; padding: 10px 14px; font-size: 15px; width: auto; }
  .totale p { grid-column: 1 / -1; margin: 0 !important; }

  .principale { padding: 14px 12px 96px; }
  .titolo h1 { font-size: 23px; }
  .titolo span { display: none; }
  .foto-e-giacomo { flex-direction: column; }
  .scatto, .nuova-foto { width: 86px; height: 86px; }
  .giacomo { min-width: 0; padding: 8px 10px; gap: 6px; }
  .giacomo .avatar { width: 28px; height: 28px; font-size: 15px; }
  .giacomo .chiedi { padding: 7px 10px; font-size: 13px; }
  .categorie { grid-template-columns: repeat(4, 1fr); gap: 8px; }
  .cat { padding: 8px 4px; font-size: 12px; border-radius: 12px; }
  .cat svg { width: 40px; height: 26px; margin-bottom: 4px; }
  .sezione { margin-bottom: 16px; }
  .sezione h3 { margin-bottom: 8px; }
  .riga-campi { grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 8px; }
  .riga-campi .campo { padding: 9px 12px; }
  .riga-campi .segno { grid-column: 1 / -1; padding: 8px 12px; }
  .cerca-lavorazione { padding: 9px 12px; margin-bottom: 8px; }
  .reparti { grid-template-columns: 1fr; gap: 10px; }
  .reparto { padding: 10px; }
  .reparto h4 { margin-bottom: 8px; font-size: 12px; }
  .voci { gap: 6px; }
  .voce { padding: 7px 9px; font-size: 13px; min-height: 42px; }
  .voce small { font-size: 11px; margin-top: 1px; }
  .giorni { grid-template-columns: repeat(6, 1fr); gap: 5px; }
  .giorno { padding: 7px 1px; }
  .sotto-giorni { flex-wrap: wrap; }
  .note { flex-direction: column; }
  .voce-microfono { padding: 12px 16px; justify-content: center; }

  .piede { padding: 8px 10px calc(8px + env(safe-area-inset-bottom)); gap: 8px; }
  .piede .somma { font-size: 12px; line-height: 1.1; }
  .piede .somma b { display: block; font-size: 19px; margin: 0; }
  .piede .bottone { padding: 12px 14px; font-size: 15px; border-radius: 10px; }
  .piede .spinta { display: none; }
  .piede .scuro { margin-left: auto; }
  .lungo { display: none; }
  .corto { display: inline; }

  .conto { padding: 14px 16px 16px; }
  .conto .cifra { font-size: 52px; }
  .importo { padding: 12px 14px; font-size: 15px; }
  .importo span { font-size: 22px; }
  .conferma { font-size: 17px; padding: 18px 12px; }
  .metodi { gap: 8px; }
  .metodo { padding: 14px 6px; font-size: 15px; }
  .fatto .spunta { width: 64px; height: 64px; font-size: 32px; }

  .oggi-in-bottega { grid-template-columns: repeat(2, 1fr); }
  .risultato { flex-wrap: wrap; }
  .azioni-risultato { width: 100%; }
  .azioni-risultato > * { flex: 1; }
  .azioni-risultato .bottone { width: 100%; padding: 13px 10px; font-size: 16px; }
  .menu { padding: 6px 10px; gap: 4px; }
  .menu a { padding: 8px 12px; font-size: 14px; }
  .messaggi { padding: 0 16px; }
  .testa-pagina > .bottone { padding: 10px 14px; font-size: 15px; }
  .campo.grande { font-size: 18px; padding: 13px; }
  .giorno-gruppo { font-size: 19px; margin: 18px 0 8px; }
  .schede-filtro a { padding: 9px 12px; font-size: 14px; }
  .riga-cliente { padding: 10px 12px; gap: 8px; flex-wrap: wrap; }
  .riga-cliente .chi b { font-size: 18px; }
  .riga-cliente .bollini { order: 3; width: 100%; justify-content: flex-start; margin-left: 0; }
  .riga-cliente .vai { margin-left: auto; }
  .azioni-cliente { width: 100%; margin-left: 0; }
  .azioni-cliente > * { flex: 1; }
  .azioni-cliente .bottone { width: 100%; }
  .due-campi { grid-template-columns: 1fr; }
  .tre-campi { grid-template-columns: 84px 1fr 64px; }
  .riga-link { padding: 8px 10px; gap: 10px; align-items: flex-start; }
  .riga-link img, .riga-link .mini, .pronto-scelta img, .pronto-scelta .mini { width: 48px; height: 48px; }
  .lato-riga { max-width: 38%; }
  .stato-art { font-size: 13px; }
  .lato-riga small { font-size: 12px; }
  .controllo-riga .campo { flex: 1; width: auto; }
  .saldo-art { font-size: 17px; }
  .settimana { gap: 4px; }
  .settimana b { font-size: 18px; }
  .schede-reparto { grid-template-columns: 1fr; }
  .contatori-reparto { margin-left: 0; width: 100%; }
  .contatori-reparto span { flex: 1; min-width: 0; padding: 6px 10px; }
  .contatori-reparto b { font-size: 22px; }
  .naviga-settimana { width: 100%; justify-content: space-between; gap: 2px; }
  .naviga-settimana > a { min-width: 36px; }
  .naviga-settimana > span { padding: 0 2px; }
  .naviga-settimana b { font-size: 14px; }
  .naviga-settimana .oggi-settimana { padding: 0 10px; font-size: 14px; }
  .tavola { grid-template-columns: repeat(6, 78vw); }
  .colonna { min-height: 160px; }
  .passaggi-reparti { grid-template-columns: 1fr; }
  .scheda-lavoro { padding: 10px; }
  .testa-lavoro img, .testa-lavoro .senza-foto { width: 72px; height: 72px; }
  .percento { font-size: 20px; }
  .da-fare li { font-size: 15px; }
  .persona-riga > summary { flex-wrap: wrap; }
  .persona-riga .ultimo { width: 100%; padding-left: 52px; }
  .riga-chiusura { flex-wrap: wrap; }
  .riga-festivita b { flex-basis: 100%; }
  .riga-festivita .bottone { flex: 1; }
  .voce-listino { grid-template-columns: 1fr; padding: 10px 12px; }
  .tre-prezzi label { flex: 1; }
  .tre-prezzi input { width: 100%; }
}

/* Spedizioni delle boutique (regole di Luca): colli in arrivo e in partenza, preaccettazione, messaggi per i gruppi */
.avviso-spedizioni { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin-top: 18px; padding: 12px 16px; border-radius: 12px; background: #fff; border: 1px solid var(--avorio-3); color: var(--testo-tenue); text-decoration: none; }
.avviso-spedizioni b { font-family: var(--serif); font-size: 18px; color: var(--testo); margin-right: auto; }
.avviso-spedizioni i { font-style: normal; font-weight: 800; font-size: 20px; color: var(--testo-tenue); margin-right: 3px; }
.avviso-spedizioni.con { border-color: var(--oro); box-shadow: inset 4px 0 0 var(--oro); }
.avviso-spedizioni.con i { color: var(--nero); }
.avviso-spedizioni em { font-style: normal; font-size: 20px; color: var(--oro-scuro); }
.pagina-reparto .avviso-spedizioni { margin: 0 0 14px; }
.testa-spedizioni { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.cerca-collo { display: flex; gap: 8px; margin: 14px 0 6px; }
.cerca-collo .campo { flex: 1; }
.elenco-colli { display: grid; gap: 8px; }
.riga-collo { display: flex; align-items: center; gap: 12px; padding: 12px 14px; background: #fff; border: 1px solid var(--avorio-3); border-radius: 14px; text-decoration: none; color: var(--testo); }
.riga-collo > .codice { flex: none; font-size: 15px; font-weight: 700; }
.riga-collo .corpo-riga small { color: var(--testo-tenue); font-weight: 400; }
.riga-collo .di-chi { font-family: var(--sans); font-size: 14px; color: var(--testo-tenue); }
.riga-collo.atteso, .riga-collo.da_preparare { box-shadow: inset 4px 0 0 var(--nero); }
.riga-collo.pronto, .riga-collo.etichetta { border-color: var(--oro); box-shadow: inset 4px 0 0 var(--oro); }
.riga-collo.partito, .riga-collo.arrivato { opacity: .75; }
.indietro { margin: 0 0 6px; }
.indietro a { color: var(--testo-tenue); text-decoration: none; font-weight: 600; }
.collo-pagina .titolo-pagina small { font-family: var(--sans); font-size: 15px; font-weight: 600; color: var(--testo-tenue); }
.stato-collo { display: inline-block; margin: 4px 0 14px; padding: 6px 12px; border-radius: 99px; background: var(--avorio-2); font-weight: 700; }
.stato-collo.pronto, .stato-collo.etichetta { background: var(--oro); color: var(--nero); }
.stato-collo.partito, .stato-collo.arrivato { background: var(--nero); color: var(--oro-chiaro); }
.nota-collo { color: var(--testo-tenue); margin-top: 0; }
.messaggio-gruppo { background: #fff; border: 1px solid var(--oro); border-radius: var(--raggio); padding: 14px 16px; margin: 0 0 18px; }
.testo-gruppo { white-space: pre-wrap; font-family: var(--sans); font-size: 15px; line-height: 1.45; margin: 6px 0 12px; padding: 10px 12px; background: var(--avorio); border-radius: 10px; }
.azioni-gruppo { display: flex; gap: 8px; flex-wrap: wrap; }
.lista-collo { display: grid; gap: 8px; margin-bottom: 16px; }
.articolo-collo { display: flex; align-items: center; gap: 12px; padding: 10px 12px; background: #fff; border: 1px solid var(--avorio-3); border-radius: 14px; }
.articolo-collo input[type=checkbox] { flex: none; width: 26px; height: 26px; accent-color: var(--oro-scuro); }
.articolo-collo img, .articolo-collo .mini { flex: none; width: 58px; height: 58px; border-radius: 10px; object-fit: cover; background: var(--avorio-3); }
.articolo-collo .mini { display: grid; place-items: center; font-size: 10px; text-align: center; color: var(--testo-tenue); }
.articolo-collo .dati-articolo { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.articolo-collo small { color: var(--testo-tenue); }
.articolo-collo.arrivato { border-color: var(--oro); }
.spuntato { flex: none; width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; background: var(--oro); color: var(--nero); font-weight: 800; }
.scaffale-collo { margin-left: auto; font-size: 14px; color: var(--testo-tenue); white-space: nowrap; }
.scaffale-collo b { font-size: 18px; color: var(--testo); }
.lista-collo.in-coda .articolo-collo { flex-wrap: wrap; gap: 4px 10px; }
.etichetta-collo { display: grid; gap: 8px; }
.in-arrivo { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 99px; background: var(--avorio-2); color: var(--oro-scuro); }
.passo-pre { display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px; margin: 22px 0 10px; font-family: var(--serif); font-size: 20px; }
.passo-pre i { font-style: normal; font-family: var(--sans); font-size: 13px; font-weight: 800; width: 26px; height: 26px; display: inline-grid; place-items: center; border-radius: 50%; background: var(--nero); color: var(--oro-chiaro); }
.passo-pre em { font-family: var(--sans); font-style: normal; font-size: 13px; font-weight: 400; color: var(--testo-tenue); }
.scelta-boutique { display: grid; gap: 12px; }
.brand-gruppo { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.brand-gruppo .etichetta { flex-basis: 100%; margin: 0; }
.brand-gruppo label { position: relative; }
.brand-gruppo input { position: absolute; opacity: 0; }
.brand-gruppo label span { display: flex; flex-direction: column; padding: 10px 16px; border: 1px solid var(--avorio-3); border-radius: 12px; background: #fff; font-weight: 700; cursor: pointer; }
.brand-gruppo label small { font-size: 12px; font-weight: 400; color: var(--testo-tenue); }
.brand-gruppo input:checked + span { background: var(--nero); border-color: var(--nero); color: var(--oro-chiaro); }
.brand-gruppo input:checked + span small { color: var(--avorio-3); }
.brand-gruppo input:focus-visible + span { outline: 2px solid var(--oro); }
.righe-pre { display: grid; gap: 8px; margin-bottom: 10px; }
.riga-pre { display: grid; grid-template-columns: 28px 1.1fr 1fr 1fr 2fr auto; gap: 8px; align-items: center; }
.riga-pre[hidden] { display: none; }
.riga-pre .numero { font-weight: 800; text-align: center; color: var(--testo-tenue); }
.foto-pre { position: relative; display: grid; place-items: center; height: 44px; padding: 0 14px; border: 1px dashed var(--avorio-3); border-radius: 10px; background: #fff; font-weight: 600; color: var(--testo-tenue); cursor: pointer; }
.foto-pre input { position: absolute; inset: 0; opacity: 0; }
.foto-pre.scelta { border-style: solid; border-color: var(--oro); color: var(--oro-scuro); }
.foto-pre.scelta span::after { content: ' ✓'; }
.nota-pre { display: block; margin: 16px 0; }
.scelta-consegna { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.scelta-consegna label { display: flex; align-items: flex-start; gap: 8px; padding: 10px 12px; border: 1px solid var(--avorio-3); border-radius: 12px; background: #fff; font-weight: 700; }
.scelta-consegna small { display: block; font-size: 12px; font-weight: 400; color: var(--testo-tenue); }
.elenco-boutique { display: grid; gap: 8px; }
.scheda.boutique.spenta { opacity: .6; }
@media (max-width: 700px) {
  .cerca-collo { flex-direction: column; }
  .riga-collo { flex-wrap: wrap; }
  .riga-collo .lato-riga { width: 100%; max-width: none; align-items: flex-start; text-align: left; }
  .riga-pre { grid-template-columns: 28px 1fr; }
  .riga-pre > .campo, .riga-pre .foto-pre { grid-column: 2; }
  .scelta-consegna { grid-template-columns: 1fr; }
  .scaffale-collo { margin-left: 0; width: 100%; }
  .articolo-collo { flex-wrap: wrap; }
}
.fatto .messaggio-gruppo { max-width: 640px; margin: 18px auto; text-align: left; }

/* Nuovo cliente: privato o brand con boutique (regola di Luca) */
.scelta-tipo { margin-bottom: 4px; }
.parte-cliente { display: grid; gap: 14px; margin: 0; padding: 0; border: 0; min-width: 0; }
.parte-cliente[hidden] { display: none; }
.parte-cliente .passo-pre { margin: 8px 0 0; }
.riga-boutique { display: grid; grid-template-columns: 1.3fr 130px 1fr; gap: 8px; }
.riga-boutique[hidden] { display: none; }
.riga-boutique .contatti-boutique { grid-column: 1 / -1; }
/* Preaccettazioni in accettazione: la foto fa riconoscere subito l'articolo */
.elenco-preaccettazioni { display: grid; gap: 8px; }
.preaccettazione-riga { display: flex; align-items: center; gap: 12px; padding: 10px 12px; background: #fff; border: 1px solid var(--avorio-3); border-radius: 14px; box-shadow: inset 4px 0 0 var(--oro); text-decoration: none; color: var(--testo); }
.foto-pre-riga { flex: none; display: flex; gap: 4px; }
.foto-pre-riga img, .foto-pre-riga .mini { width: 64px; height: 64px; border-radius: 10px; object-fit: cover; background: var(--avorio-3); }
.foto-pre-riga .mini { display: grid; place-items: center; padding: 4px; font-size: 10px; text-align: center; color: var(--testo-tenue); }
.preaccettazione-riga .di-chi { font-family: var(--sans); font-size: 14px; color: var(--testo-tenue); }
.preaccettazione-riga .codice { font-size: 13px; }
.arrivato-art { padding: 6px 10px; border: 0; border-radius: 99px; background: var(--oro); color: var(--nero); font-weight: 700; font-size: 13px; cursor: pointer; position: relative; z-index: 2; }
/* Prospetto per la fattura del brand, diviso per boutique */
.filtri-fattura { display: grid; gap: 4px; margin-bottom: 10px; }
.filtri-fattura .schede-filtro label { flex: none; padding: 10px 14px; border-radius: 12px; background: #fff; border: 1.5px solid var(--avorio-3); font-weight: 600; font-size: 15px; cursor: pointer; }
.filtri-fattura .schede-filtro label.attivo { background: var(--nero); border-color: var(--nero); color: var(--oro-chiaro); }
.filtri-fattura .schede-filtro input { position: absolute; opacity: 0; pointer-events: none; }
.azioni-fattura { display: flex; gap: 8px; margin-top: 8px; }
.periodo-fattura { color: var(--testo-tenue); font-weight: 600; }
.tabella-fattura { width: 100%; border-collapse: collapse; background: #fff; border-radius: 14px; overflow: hidden; font-size: 14px; }
.tabella-fattura th { text-align: left; padding: 8px 10px; background: var(--avorio-2); font-size: 12px; letter-spacing: .04em; text-transform: uppercase; color: var(--testo-tenue); }
.tabella-fattura td { padding: 8px 10px; border-top: 1px solid var(--avorio-2); vertical-align: top; }
.tabella-fattura td small { color: var(--testo-tenue); }
.tabella-fattura .importo { text-align: right; white-space: nowrap; font-weight: 700; }
.tabella-fattura .totale-boutique td { font-weight: 700; background: var(--avorio); }
.conto-fattura { margin-top: 18px; max-width: 420px; margin-left: auto; }
@media (max-width: 700px) {
  .riga-boutique { grid-template-columns: 1fr 110px; }
  .riga-boutique input[name^=boutique_gruppo] { grid-column: 1 / -1; }
  .preaccettazione-riga { flex-wrap: wrap; }
  .preaccettazione-riga .lato-riga { width: 100%; max-width: none; align-items: flex-start; text-align: left; }
  .tabella-fattura { display: block; overflow-x: auto; }
}.da-giacomo { font-style: normal; font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 99px; background: var(--nero); color: var(--oro-chiaro); vertical-align: middle; }
.chip-boutique { background: var(--nero); color: var(--oro-chiaro); }

/* Suggerimenti mentre si scrive, in tutte le pagine (richiesta di Luca) */
.con-suggerimenti { position: relative; display: block; min-width: 0; }
.suggeriti.tendina { position: absolute; z-index: 30; left: 0; right: 0; top: calc(100% + 4px); margin: 0; padding: 8px; background: #fff; border: 1px solid var(--avorio-3); border-radius: 12px; box-shadow: 0 8px 20px rgba(0,0,0,.12); }
/* Agenda del reparto: cosa va fatto si legge per intero (richiesta di Luca) */
.carta-da-fare { font-size: 13px; font-weight: 700; line-height: 1.25; color: var(--testo); overflow-wrap: break-word; hyphens: auto; -webkit-hyphens: auto; }
.carta-testo small.carta-chiede { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; color: var(--oro-scuro); }
.titolo-da-fare { margin: 12px 0 6px; font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--testo-tenue); }
/* Chiusure di cassa (area riservata a chi gestisce la bottega) */
.naviga-mese { display: flex; align-items: center; justify-content: space-between; gap: 12px; max-width: 360px; margin: 10px 0; }
.naviga-mese a { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: #fff; border: 1px solid var(--avorio-3); text-decoration: none; font-size: 22px; }
.naviga-mese b { font-family: var(--serif); font-size: 20px; }
.riga-chiusura-cassa { display: flex; align-items: center; gap: 12px; padding: 12px 14px; background: #fff; border: 1px solid var(--avorio-3); border-radius: 14px; box-shadow: inset 4px 0 0 var(--oro); }
.riga-chiusura-cassa.non-tornano { box-shadow: inset 4px 0 0 var(--mattone); }
.riga-chiusura-cassa.non-tornano .stato-art { color: var(--mattone); }
.riga-chiusura-cassa .di-chi { font-family: var(--sans); font-size: 14px; color: var(--testo-tenue); }
.riga-chiusura-cassa small { color: var(--testo-tenue); }
.riga-chiusura-cassa .lato-riga { gap: 6px; }
/* Prezzi concordati con un brand */
.voci-prezzi { display: grid; gap: 6px; }
.voce-prezzo { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; background: #fff; border: 1px solid var(--avorio-3); border-radius: 12px; }
.voce-prezzo.concordata { border-color: var(--oro); box-shadow: inset 4px 0 0 var(--oro); }
.voce-prezzo > span:first-child { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.voce-prezzo small { color: var(--testo-tenue); }
.campo-euro { display: flex; align-items: center; gap: 6px; font-weight: 700; flex: none; }
.campo-euro .campo { width: 96px; text-align: right; }
.piede-prezzi { position: sticky; bottom: 0; padding: 12px 0; background: var(--avorio); }
/* Agenda del reparto riordinata (richiesta di Luca): in alto nome e contatori, poi gli avvisi del giorno,
   poi una barra sola; nella settimana solo i giorni in cui il reparto consegna. */
.pagina-reparto .testa-reparto { justify-content: space-between; margin-bottom: 10px; }
.pagina-reparto .testa-reparto .titolo-pagina { margin: 0; }
.pagina-reparto .contatori-reparto { margin-left: 0; }
.pagina-reparto .contatori-reparto span { min-width: 0; padding: 6px 12px; }
.pagina-reparto .contatori-reparto b { font-size: 22px; }
.avvisi-reparto { display: grid; gap: 8px; margin: 0 0 10px; }
.avvisi-reparto:empty { display: none; }
.avvisi-reparto .giorni-accettazione, .avvisi-reparto .avviso-spedizioni, .pagina-reparto .avvisi-reparto .avviso-spedizioni { margin: 0; }
.pagina-reparto .barra-reparto { margin: 4px 0 10px; }
.pagina-reparto .barra-reparto .naviga-settimana { padding: 4px; }
.pagina-reparto .barra-reparto .naviga-settimana > a { height: 40px; }
.pagina-reparto .legenda-reparto { margin-top: 8px; }
.tavola { grid-template-columns: repeat(var(--colonne, 6), minmax(170px, 1fr)); }
@media (max-width: 700px) {
  .pagina-reparto .testa-reparto { flex-direction: column; align-items: stretch; gap: 8px; }
  .pagina-reparto .contatori-reparto span { flex: 1; text-align: center; }
  .pagina-reparto .barra-reparto .naviga-settimana { width: 100%; }
  .tavola { grid-template-columns: repeat(var(--colonne, 6), 84vw); }
}@media (max-width: 700px) {
  .pagina-reparto .cerca-reparto { min-width: 140px; }
  .pagina-reparto .viste-reparto a { padding: 10px 12px; }
}

/* Pronti in serie dal QR (regola di Luca) */
.scatta-qr { position: relative; display: grid; place-items: center; min-height: 92px; font-size: 22px; margin: 6px 0 10px; }
.scatta-qr input { position: absolute; inset: 0; opacity: 0; }
.codice-a-mano { display: flex; gap: 8px; }
.codice-a-mano .campo { flex: 1; min-width: 0; }
.conta-serie { margin: 16px 0 8px; font-family: var(--serif); font-size: 22px; font-weight: 600; }
.letture { display: grid; gap: 6px; margin-bottom: 14px; }
.lettura { display: flex; align-items: baseline; gap: 10px; padding: 12px 14px; border-radius: 12px; background: #fff; border: 1px solid var(--avorio-3); }
.lettura.pronto { border-color: var(--oro); box-shadow: inset 4px 0 0 var(--oro); }
.lettura.passa { box-shadow: inset 4px 0 0 var(--nero); }
.lettura.gia { opacity: .7; }
.lettura.errore { border-color: var(--mattone); background: var(--mattone-chiaro); color: var(--mattone); }
.lettura .codice { flex: none; font-size: 16px; }
.pronti-serie-link { white-space: nowrap; }
/* Agenda del reparto, ordine di Luca: contatori grandi, cerca + Pronti in serie, giorno dell'accettazione, settimana */
.pagina-reparto .testa-reparto { display: block; margin-bottom: 10px; }
.nome-reparto-piccolo { margin: 0 0 8px; font-family: var(--serif); font-size: 22px; font-weight: 600; color: var(--oro-scuro); }
.pagina-reparto .contatori-reparto.grossi { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 8px; margin: 0; width: 100%; }
.pagina-reparto .contatori-reparto.grossi span { min-width: 0; padding: 12px 14px; font-size: 14px; text-align: left; }
.pagina-reparto .contatori-reparto.grossi b { font-size: 40px; line-height: 1.05; }
.cerca-e-pronti { display: flex; align-items: stretch; gap: 10px; margin: 0 0 10px; }
.cerca-e-pronti .cerca-reparto { flex: 1; min-width: 0; display: flex; }
.cerca-e-pronti .cerca-reparto .campo { flex: 1; font-size: 17px; }
.pronti-serie-grande { flex: none; display: flex; align-items: center; gap: 10px; padding: 10px 20px; border-radius: 14px; background: var(--oro); color: var(--nero); text-decoration: none; font-weight: 800; font-size: 19px; line-height: 1.15; box-shadow: 0 4px 12px rgba(156, 122, 58, .35); }
.pronti-serie-grande small { display: block; font-size: 12px; font-weight: 600; color: var(--nero-2); opacity: .75; }
.pronti-serie-grande:active { transform: translateY(1px); box-shadow: 0 2px 6px rgba(156, 122, 58, .35); }
.pagina-reparto .barra-reparto { flex-wrap: wrap; }
@media (max-width: 700px) {
  .cerca-e-pronti { flex-direction: column; }
  .pronti-serie-grande { justify-content: center; min-height: 64px; font-size: 21px; }
  .pagina-reparto .contatori-reparto.grossi b { font-size: 34px; }
  .pagina-reparto .barra-reparto .viste-reparto { width: 100%; }
  .pagina-reparto .barra-reparto .viste-reparto a { flex: 1; text-align: center; }
}@media (max-width: 700px) {
  .pagina-reparto .contatori-reparto.grossi { grid-template-columns: repeat(auto-fit, minmax(90px, 1fr)); gap: 6px; }
  .pagina-reparto .contatori-reparto.grossi span { padding: 10px; font-size: 13px; }
}

/* Agenda del reparto: disposizione della bozza scelta da Luca (28/10) */
.pagina-reparto .testa-reparto { display: flex; align-items: center; justify-content: space-between; gap: 12px 18px; flex-wrap: wrap; }
.pagina-reparto .contatori-reparto.grossi { flex: 1; width: auto; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); }
.filtri-lavori { display: flex; align-items: center; gap: 8px; overflow-x: auto; padding: 2px 0 6px; margin: 4px 0 8px; scrollbar-width: none; }
.filtri-lavori::-webkit-scrollbar { display: none; }
.filtri-lavori button { flex: none; display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-radius: 12px; border: 2px solid #cdbf9f; background: #fff; font: inherit; font-weight: 700; font-size: 15px; color: var(--testo); cursor: pointer; }
.filtri-lavori button b { padding: 1px 8px; border-radius: 99px; background: var(--avorio-2); font-size: 13px; }
.filtri-lavori button.attivo { background: var(--nero); border-color: var(--nero); color: var(--oro-chiaro); }
.filtri-lavori button.attivo b { background: var(--oro); color: var(--nero); }
.filtri-lavori button.rosso { border-color: #dba79c; background: #fff6f3; color: var(--mattone); }
.filtri-lavori button.rosso b { background: var(--mattone-chiaro); color: var(--mattone); }
.filtri-lavori button.rosso.attivo { background: var(--mattone); border-color: var(--mattone); color: #fff; }
.filtri-lavori button.rosso.attivo b { background: #fff; color: var(--mattone); }
.separa-filtri { flex: none; width: 2px; height: 30px; border-radius: 2px; background: var(--avorio-3); }
.ordina-lavori { flex: none; margin-left: auto; padding: 10px 12px; border-radius: 12px; border: 2px solid #cdbf9f; background: #fff; font: inherit; font-weight: 600; color: var(--testo); }
.corpo-reparto { display: grid; grid-template-columns: minmax(0, 3fr) minmax(300px, 2fr); gap: 14px; align-items: start; }
.riquadro-reparto { background: #fff; border: 1px solid var(--avorio-3); border-radius: 18px; padding: 14px; margin-bottom: 14px; }
.testa-riquadro { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.testa-riquadro h2 { margin: 0; font-family: var(--serif); font-size: 22px; }
.testa-riquadro small { color: var(--testo-tenue); font-size: 13px; }
.conta-lavori { flex: none; color: var(--testo-tenue); font-weight: 600; font-size: 14px; }
.filtro-giorno { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0 0 8px; padding: 8px 12px; border-radius: 10px; background: var(--avorio-2); font-weight: 700; }
.filtro-giorno button { border: 0; background: none; font: inherit; font-weight: 700; color: var(--oro-scuro); cursor: pointer; }
.elenco-lavori { display: grid; gap: 6px; }
.riga-lavoro { display: grid; grid-template-columns: 64px 92px minmax(0, 1.1fr) minmax(0, 1.6fr) minmax(0, 1fr) auto 12px; align-items: center; gap: 12px; padding: 8px 10px; border-radius: 14px; border: 1.5px solid var(--avorio-3); background: #fff; cursor: pointer; }
.riga-lavoro:hover, .riga-lavoro.scelta { border-color: var(--oro); background: #fffaf0; }
.riga-lavoro.ritardo, .riga-lavoro.urgente { box-shadow: inset 4px 0 0 var(--mattone); }
.riga-lavoro.da-scaffale { box-shadow: inset 4px 0 0 var(--oro); }
.riga-lavoro.stato-completata { opacity: .6; }
.riga-foto { position: relative; width: 64px; height: 64px; }
.riga-foto img, .riga-foto .senza-foto { display: block; width: 64px; height: 64px; border-radius: 10px; object-fit: cover; background: var(--avorio-3); }
.riga-quando { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 6px 4px; border-radius: 10px; background: var(--avorio-2); text-align: center; }
.riga-quando b { font-size: 14px; white-space: nowrap; }
.riga-quando small { font-size: 12px; color: var(--testo-tenue); }
.riga-quando.vicino { background: #fdf0d0; }
.riga-quando.vicino small { color: var(--oro-scuro); font-weight: 700; }
.riga-quando.tardi { background: var(--mattone-chiaro); }
.riga-quando.tardi small, .riga-quando.tardi b { color: var(--mattone); font-weight: 700; }
.riga-articolo-rep, .riga-da-fare, .riga-dopo { display: flex; flex-direction: column; min-width: 0; }
.riga-articolo-rep .codice { font-size: 15px; }
.riga-articolo-rep span { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.riga-articolo-rep small, .riga-dopo small { color: var(--testo-tenue); font-size: 12px; }
.riga-da-fare b { font-size: 15px; line-height: 1.25; }
.riga-da-fare small { color: var(--oro-scuro); font-size: 13px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.riga-dopo { padding-left: 10px; border-left: 1.5px solid var(--avorio-3); }
.riga-dopo b { font-size: 14px; }
.riga-stato { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.riga-stato em { font-style: normal; font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 99px; white-space: nowrap; margin: 0; }
.riga-stato .chip-stato.stato-in_corso { background: #e6efe0; color: #2f6b2f; }
.riga-stato .chip-stato.stato-sospesa { background: var(--mattone-chiaro); color: var(--mattone); }
.riga-stato .chip-stato.stato-completata { background: var(--avorio-2); color: var(--testo-tenue); }
.riga-freccia { color: var(--testo-tenue); font-size: 22px; }
.carta-passaggio { display: flex; align-items: center; gap: 10px; padding: 8px; margin-bottom: 6px; border-radius: 14px; border: 1.5px solid var(--avorio-3); background: #fff; text-decoration: none; color: var(--testo); }
.carta-passaggio:hover { border-color: var(--oro); }
.carta-passaggio.rosso, .carta-passaggio.ritardo { border-color: #e2b4aa; }
.carta-passaggio img, .carta-passaggio .senza-foto { flex: none; width: 56px; height: 56px; border-radius: 10px; object-fit: cover; background: var(--avorio-3); }
.corpo-carta { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.corpo-carta small { color: var(--testo-tenue); }
.quando-carta { flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 3px; text-align: right; font-size: 13px; }
.quando-carta em { font-style: normal; font-size: 12px; font-weight: 700; padding: 3px 9px; border-radius: 99px; }
.quando-carta small { color: var(--testo-tenue); }
.calendario-reparto .testa-riquadro { align-items: center; flex-wrap: wrap; }
.calendario-reparto .naviga-settimana { background: #fff; color: var(--testo); border: 1.5px solid var(--avorio-3); padding: 4px; }
.calendario-reparto .naviga-settimana > a { color: var(--testo); height: 40px; }
.calendario-reparto .naviga-settimana b { color: var(--testo); }
.giorni-calendario { display: grid; grid-template-columns: repeat(var(--colonne, 3), minmax(0, 1fr)); gap: 8px; }
.giorno-calendario { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 12px 8px; border-radius: 14px; border: 1.5px solid var(--avorio-3); background: var(--avorio); font: inherit; color: var(--testo); cursor: pointer; }
.giorno-calendario b { font-family: var(--serif); font-size: 19px; }
.giorno-calendario > span { color: var(--testo-tenue); font-size: 14px; }
.giorno-calendario em { font-style: normal; font-weight: 800; font-size: 20px; min-width: 40px; margin: 4px 0; padding: 2px 10px; border-radius: 99px; background: #fff; }
.giorno-calendario em.pieno { background: var(--mattone); color: #fff; }
.giorno-calendario small { color: var(--testo-tenue); font-size: 12px; }
.giorno-calendario.oggi { border-color: var(--oro); background: #fffaf0; }
.giorno-calendario.scelto { border-color: var(--nero); box-shadow: inset 0 0 0 2px var(--nero); }
.giorno-calendario.chiuso { opacity: .55; }
.giorno-calendario.vuoto em { color: var(--testo-tenue); }
@media (max-width: 1000px) {
  .corpo-reparto { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .riga-lavoro { grid-template-columns: 56px minmax(0, 1fr) auto; grid-template-areas: "foto articolo quando" "foto fare fare" "dopo dopo stato"; gap: 4px 10px; }
  .riga-foto { grid-area: foto; width: 56px; height: 56px; }
  .riga-foto img, .riga-foto .senza-foto { width: 56px; height: 56px; }
  .riga-articolo-rep { grid-area: articolo; }
  .riga-quando { grid-area: quando; }
  .riga-da-fare { grid-area: fare; }
  .riga-dopo { grid-area: dopo; flex-direction: row; align-items: baseline; gap: 6px; padding-left: 0; border-left: 0; }
  .riga-stato { grid-area: stato; flex-direction: row; }
  .riga-freccia { display: none; }
  .giorni-calendario { gap: 6px; }
  .giorno-calendario { padding: 8px 4px; }
  .giorno-calendario b { font-size: 16px; }
}
/* Cerca col QR (richiesta di Luca) */
.cerca-qr { position: relative; flex: none; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 14px; border-radius: 14px; border: 2px solid #cdbf9f; background: #fff; color: var(--testo); font-weight: 700; cursor: pointer; }
.cerca-qr input { position: absolute; inset: 0; width: 100%; opacity: 0; }
.cerca-qr.in-lettura { opacity: .6; }
.cerca-qr.in-lettura span::after { content: '…'; }
.cerca-con-qr { display: flex; align-items: stretch; gap: 8px; }
.cerca-con-qr .cerca-lavori { flex: 1; min-width: 0; }

/* Telefono: la pagina del reparto compatta, niente «mattone» (richiesta di Luca) */
@media (max-width: 700px) {
  /* I riquadri neri in una striscia bassa: numero sopra, parola sotto, larghi quanto il loro testo. */
  .pagina-reparto .testa-reparto { display: block; margin-bottom: 8px; }
  .pagina-reparto .contatori-reparto.grossi { display: flex; flex-wrap: wrap; gap: 5px; }
  .pagina-reparto .contatori-reparto.grossi span { flex: 1 1 auto; min-width: 0; padding: 4px 8px; font-size: 11px; line-height: 1.15; border-radius: 8px; white-space: nowrap; text-align: left; }
  .pagina-reparto .contatori-reparto.grossi b { font-size: 18px; line-height: 1.1; }
  .cerca-e-pronti { flex-direction: row; flex-wrap: wrap; gap: 6px; }
  .cerca-e-pronti .cerca-reparto { flex: 1 1 100%; }
  .cerca-e-pronti .cerca-reparto .campo { padding: 10px 12px; font-size: 16px; }
  .cerca-e-pronti .cerca-qr, .cerca-e-pronti .pronti-serie-grande { flex: 1 1 0; min-height: 46px; padding: 6px 10px; font-size: 15px; border-radius: 12px; }
  .pronti-serie-grande small { display: none; }
  .pronti-serie-grande svg, .cerca-qr svg { width: 22px; height: 22px; }
  .avvisi-reparto { gap: 6px; margin-bottom: 8px; }
  .giorni-accettazione > summary { padding: 8px 10px; gap: 4px 6px; font-size: 13px; }
  .filtri-lavori { gap: 6px; margin: 2px 0 6px; }
  .filtri-lavori button { padding: 7px 10px; font-size: 13px; border-radius: 10px; }
  .filtri-lavori button b { font-size: 12px; padding: 0 6px; }
  .ordina-lavori { padding: 7px 8px; font-size: 13px; border-radius: 10px; }
  .riquadro-reparto { padding: 10px; border-radius: 14px; margin-bottom: 10px; }
  .testa-riquadro { margin-bottom: 6px; }
  .testa-riquadro h2 { font-size: 18px; }
  .testa-riquadro small { display: none; }
  .riga-lavoro { grid-template-columns: 48px minmax(0, 1fr) auto; padding: 7px 8px; gap: 2px 8px; border-radius: 12px; }
  .riga-foto, .riga-foto img, .riga-foto .senza-foto { width: 48px; height: 48px; }
  .riga-quando { padding: 4px 6px; }
  .riga-quando b { font-size: 13px; }
  .riga-quando small { font-size: 11px; }
  .riga-articolo-rep .codice { font-size: 13px; }
  .riga-articolo-rep span { font-size: 14px; }
  .riga-da-fare b { font-size: 14px; }
  .riga-stato em { padding: 3px 8px; font-size: 11px; }
  .carta-passaggio { padding: 6px; gap: 8px; }
  .carta-passaggio img, .carta-passaggio .senza-foto { width: 44px; height: 44px; }
  .giorno-calendario { padding: 6px 2px; }
  .giorno-calendario b { font-size: 15px; }
  .giorno-calendario em { font-size: 16px; margin: 2px 0; }
  .cerca-con-qr .cerca-qr span { display: none; }
}
.calendario-reparto.in-caricamento { opacity: .55; transition: opacity .15s; }

/* Verifica di chi ritira (regola di Luca): cellulare, poi codice della ricevuta o cognome e nome */
.regola-ricerca { margin: -4px 0 12px; color: var(--testo-tenue); font-size: 14px; }
.risultato .tel-ok { color: #2f6b2f; font-weight: 700; }
.verifica-ritiro { max-width: 620px; }
.verifica-ritiro h2 { margin: 0 0 4px; font-family: var(--serif); font-size: 24px; }
.campo-verifica { display: block; margin: 12px 0 0; }
.campo-verifica > span { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; margin-bottom: 6px; font-weight: 700; }
.campo-verifica > span > b { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--nero); color: var(--oro-chiaro); font-size: 13px; }
.campo-verifica small { font-weight: 400; color: var(--testo-tenue); }
.campo-verifica .gia-fatto { font-style: normal; font-weight: 700; color: #2f6b2f; }
.campo-verifica .campo { width: 100%; font-size: 20px; }
.senza-codice { margin: 12px 0 14px; }
.senza-codice > summary { cursor: pointer; font-weight: 700; color: var(--oro-scuro); }
.verificato-ritiro { display: inline-block; margin: 0 0 12px; padding: 8px 14px; border-radius: 99px; background: #e6efe0; color: #2f6b2f; font-weight: 700; }
/* Reparto: i lavori divisi per settimane, 1ª 2ª 3ª 4ª (richiesta di Luca) */
.settimane-lavori { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 4px 0 8px; }
.settimane-lavori button { display: flex; align-items: center; justify-content: space-between; gap: 6px; padding: 9px 12px; border-radius: 12px; border: 2px solid #cdbf9f; background: #fff; font: inherit; font-weight: 700; font-size: 15px; color: var(--testo); text-align: left; cursor: pointer; }
.settimane-lavori button span { display: flex; flex-direction: column; min-width: 0; }
.settimane-lavori button small { font-weight: 500; font-size: 12px; color: var(--testo-tenue); white-space: nowrap; }
.settimane-lavori button b { flex: none; padding: 1px 9px; border-radius: 99px; background: var(--avorio-2); font-size: 14px; }
.settimane-lavori button.attivo { background: var(--nero); border-color: var(--nero); color: var(--oro-chiaro); }
.settimane-lavori button.attivo small { color: #cfc4b2; }
.settimane-lavori button.attivo b { background: var(--oro); color: var(--nero); }
@media (max-width: 700px) {
  .settimane-lavori { gap: 5px; margin: 2px 0 6px; }
  .settimane-lavori button { flex-direction: column; align-items: flex-start; gap: 3px; padding: 6px 7px; font-size: 13px; border-radius: 10px; }
  .settimane-lavori button small { font-size: 11px; }
  .settimane-lavori button b { font-size: 12px; padding: 0 7px; }
}
/* Menu: il numerino delle preaccettazioni in arrivo; pagina Direzione divisa per argomento (richieste di Luca) */
.menu .numerino { display: inline-block; min-width: 20px; margin-left: 4px; padding: 0 6px; border-radius: 99px; background: var(--oro); color: var(--nero); font-size: 12px; line-height: 20px; text-align: center; }
.giorno-lavori .vedi-tutte { margin-left: auto; font-family: var(--sans, inherit); font-size: 14px; font-weight: 700; color: var(--oro-scuro); text-decoration: none; }
.da-vedere-direzione { margin-bottom: 16px; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); align-items: start; gap: 10px; }
.da-vedere-direzione > h2 { grid-column: 1 / -1; }
.da-vedere-direzione h2, .gruppo-direzione h2 { margin: 0 0 8px; font-family: var(--serif); font-size: 21px; }
.tutto-a-posto { display: inline-block; margin: 0 0 16px; padding: 8px 14px; border-radius: 99px; background: #e6efe0; color: #2f6b2f; font-weight: 700; }
.gruppi-direzione { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; align-items: start; }
.gruppo-direzione { padding: 14px; border-radius: 18px; border: 1px solid var(--avorio-3); background: #fff; }
.gruppo-direzione a { display: flex; flex-direction: column; gap: 2px; margin-top: 8px; padding: 12px 14px; border-radius: 12px; border: 2px solid #cdbf9f; background: var(--avorio); color: var(--testo); text-decoration: none; }
.gruppo-direzione a:hover { border-color: var(--oro); background: #fffaf0; }
.gruppo-direzione a b { font-size: 16px; }
.gruppo-direzione a b::after { content: ' ›'; color: var(--oro-scuro); }
.gruppo-direzione a small { color: var(--testo-tenue); font-size: 13px; }
/* Direzione · Sedi: le botteghe e la nuova bottega (richiesta di Luca) */
.sede-riga { border-top: 1px solid var(--avorio-3); padding: 10px 0; }
.sede-riga:first-of-type { border-top: 0; }
.sede-riga > summary { cursor: pointer; list-style: none; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; }
.sede-riga > summary b { font-family: var(--serif); font-size: 19px; }
.sede-riga > summary small { flex-basis: 100%; color: var(--testo-tenue); }
.sede-riga.appena-creata { background: #f4f9f0; border-radius: 12px; padding: 10px; }
.chip-qui, .chip-chiusa { font-style: normal; font-size: 12px; font-weight: 700; padding: 2px 9px; border-radius: 99px; background: #e6efe0; color: #2f6b2f; }
.chip-chiusa { background: var(--avorio-2); color: var(--testo-tenue); }
.passa-sede { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0; }
.modulo-sede { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px 14px; margin-top: 10px; align-items: end; }
.modulo-sede > label { display: flex; flex-direction: column; gap: 4px; }
.modulo-sede > label.spunta { flex-direction: row; align-items: center; gap: 8px; grid-column: 1 / -1; }
.modulo-sede > .orari, .modulo-sede > p, .modulo-sede > .bottone.largo { grid-column: 1 / -1; }
/* Vendita veloce: nome o codice, proposte, pulsanti veloci, righe con omaggio (regola di Luca) */
.carrello-vendita { display: grid; gap: 8px; }
.cerca-vendita { position: relative; }
.cerca-vendita .campo { width: 100%; font-size: 18px; }
.proposte-vendita { position: absolute; z-index: 20; left: 0; right: 0; top: calc(100% + 4px); margin: 0; padding: 4px; list-style: none; border-radius: 12px; border: 1.5px solid var(--oro); background: #fff; box-shadow: 0 10px 24px rgba(0,0,0,.12); }
.proposte-vendita li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0 10px; padding: 9px 10px; border-radius: 8px; cursor: pointer; }
.proposte-vendita li b { grid-column: 1; }
.proposte-vendita li small { grid-column: 1; color: var(--testo-tenue); font-size: 12px; }
.proposte-vendita li span { grid-column: 2; grid-row: 1 / span 2; align-self: center; font-weight: 800; }
.proposte-vendita li.prima, .proposte-vendita li:hover { background: #fffaf0; }
.proposte-vendita li.nessuno { display: block; color: var(--testo-tenue); cursor: default; }
.rapidi-vendita { display: flex; flex-wrap: wrap; gap: 6px; }
.rapidi-vendita:empty { display: none; }
.rapidi-vendita button { display: flex; gap: 8px; align-items: baseline; padding: 7px 11px; border-radius: 10px; border: 2px solid #cdbf9f; background: #fff; font: inherit; font-size: 14px; cursor: pointer; }
.rapidi-vendita button span { color: var(--oro-scuro); font-weight: 700; }
.righe-vendita { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.riga-vendita { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 8px 10px; border-radius: 12px; border: 1.5px solid var(--avorio-3); background: #fff; }
.riga-vendita.in-omaggio { border-color: #b9d3a8; background: #f4f9f0; }
.nome-vendita { flex: 1 1 160px; display: flex; flex-direction: column; min-width: 0; }
.nome-vendita small { color: var(--testo-tenue); font-size: 12px; }
.quantita-vendita { display: flex; align-items: center; gap: 6px; }
.quantita-vendita button, .togli-vendita { width: 34px; height: 34px; border-radius: 50%; border: 1.5px solid var(--avorio-3); background: var(--avorio); font: inherit; font-size: 18px; cursor: pointer; }
.quantita-vendita b { min-width: 20px; text-align: center; }
.omaggio-vendita { padding: 6px 10px; border-radius: 99px; border: 1.5px solid #b9d3a8; background: #fff; color: #2f6b2f; font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
.importo-vendita { min-width: 70px; text-align: right; font-weight: 800; }
.in-omaggio .importo-vendita { color: #2f6b2f; }
.vendita-in-accettazione { margin: 6px 0 18px; }
.modulo-vendita { display: grid; gap: 10px; }
.incasso-vendita { display: grid; gap: 10px; padding: 12px; border-radius: 14px; background: var(--avorio-2); }
.conto-vendita { display: flex; justify-content: space-between; align-items: baseline; font-size: 18px; }
.conto-vendita b { font-family: var(--serif); font-size: 30px; }
.vendita-in-cassa { margin: 12px 0; padding: 10px 12px; border-radius: 14px; border: 1.5px dashed #cdbf9f; background: #fff; }
.vendita-in-cassa > summary { cursor: pointer; font-weight: 700; color: var(--oro-scuro); }
.vendita-in-cassa[open] > summary { margin-bottom: 8px; }
/* Prodotti e magazzino */
.elenco-prodotti { display: grid; gap: 6px; }
.riga-prodotto { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; padding: 10px 0; border-top: 1px solid var(--avorio-3); }
.riga-prodotto:first-child { border-top: 0; }
.riga-prodotto .nome-prodotto { flex: 1 1 200px; }
.riga-prodotto.fuori-vendita { opacity: .6; }
.prezzo-prodotto { font-weight: 800; }
.giacenza { padding: 2px 10px; border-radius: 99px; background: #e6efe0; color: #2f6b2f; font-size: 13px; font-weight: 700; }
.giacenza.poca { background: #fdf0d0; color: var(--oro-scuro); }
.giacenza.a-zero { background: var(--mattone-chiaro); color: var(--mattone); }
.chip-veloce { font-style: normal; font-size: 11px; font-weight: 700; padding: 1px 8px; border-radius: 99px; background: var(--avorio-2); color: var(--oro-scuro); }
.muovi-prodotto, .modifica-prodotto { flex-basis: 100%; }
.muovi-prodotto > summary, .modifica-prodotto > summary, .nuovo-prodotto > summary { cursor: pointer; font-weight: 700; color: var(--oro-scuro); }
.muovi-prodotto form { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.muovi-prodotto .campo { width: 110px; }
/* Cassa: sconto o lavorazione offerta, facoltativi (regola di Luca) */
.sconto-omaggio { margin: 12px 0; padding: 10px 12px; border-radius: 14px; border: 1.5px dashed #cdbf9f; background: #fff; }
.sconto-omaggio > summary { cursor: pointer; font-weight: 700; color: var(--oro-scuro); }
.sconto-omaggio > summary small { font-weight: 400; color: var(--testo-tenue); }
.sconto-omaggio[open] > summary { margin-bottom: 8px; }
.motivi-sconto, .sconti, .offri-lavorazioni { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 8px; }
.motivo-sconto, .sconto { padding: 8px 12px; border-radius: 10px; border: 2px solid #cdbf9f; background: #fff; font: inherit; font-weight: 700; font-size: 14px; cursor: pointer; display: inline-flex; flex-direction: column; align-items: flex-start; }
.sconto span { font-weight: 500; font-size: 12px; color: var(--testo-tenue); }
.motivo-sconto.sel, .sconto.sel { background: var(--nero); border-color: var(--nero); color: var(--oro-chiaro); }
.sconto.sel span { color: #cfc4b2; }
.motivi-sconto .campo { flex: 1 1 180px; }
.motivi-sconto .campo.manca { border-color: var(--mattone); background: #fff6f3; }
.sconto-a-mano { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: 14px; }
.sconto-a-mano .campo { width: 90px; }
.offerta { display: inline-flex; align-items: center; gap: 8px; padding: 6px 10px; border-radius: 10px; background: #f4f9f0; color: #2f6b2f; }
/* Scheda: si esce sempre, senza salvare né cancellare (richiesta di Luca) */
.esci-scheda { display: flex; flex-direction: column; gap: 2px; margin: 0 0 12px; padding: 10px 14px; border-radius: 12px; border: 2px solid #cdbf9f; background: #fff; color: var(--testo); font-weight: 800; font-size: 17px; text-decoration: none; }
.esci-scheda small { font-weight: 500; font-size: 12px; color: var(--testo-tenue); }
.esci-scheda:hover { border-color: var(--oro); }
/* Ritiro: verifica in una riga, dentro la pagina (regola di Luca, 28/10) */
.verifica-ritiro { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; max-width: none; padding: 10px 12px; border-radius: 14px; border: 2px solid #e2b4aa; background: #fff6f3; }
.verifica-ritiro.fatta { border-color: #b9d3a8; background: #f4f9f0; }
.passo-verifica { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; }
.passo-verifica[hidden] { display: none; }
.passo-verifica .campo { width: 190px; padding: 8px 10px; font-size: 17px; }
.numero-passo { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--nero); color: var(--oro-chiaro); font-size: 13px; font-weight: 800; }
.verifica-ritiro .esito { font-weight: 700; font-size: 14px; }
.verifica-ritiro .esito.ok { color: #2f6b2f; }
.verifica-ritiro .esito.no { color: var(--mattone); }
.senza-codice { border: 0; background: none; font: inherit; font-weight: 700; font-size: 14px; color: var(--oro-scuro); cursor: pointer; text-decoration: underline; }
.spunta-nome { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 99px; border: 2px solid #b9d3a8; background: #fff; font-weight: 800; }
.spunta-nome input { width: 20px; height: 20px; }
.pronto-scelta.trovato { box-shadow: 0 0 0 3px #b9d3a8; }
/* Spedizioni: foto dell'etichetta del corriere e regola del sabato (richieste di Luca) */
.cerca-collo { display: flex; flex-wrap: wrap; gap: 8px; align-items: stretch; }
.cerca-collo .campo { flex: 1 1 320px; }
.regola-sabato { margin: 8px 0 14px; padding: 8px 12px; border-radius: 10px; background: #fdf0d0; color: var(--oro-scuro); font-size: 14px; }
/* Reparto: settimane del mese vero e mese a tendina (richiesta di Luca, 28/10) */
.testa-settimane { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin: 4px 0 6px; }
.spiega-settimane { color: var(--testo-tenue); font-size: 13px; }
.scegli-mese { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; }
.scegli-mese .campo { width: auto; padding: 8px 12px; font-size: 16px; font-weight: 700; border: 2px solid #cdbf9f; }
.settimane-lavori { grid-template-columns: repeat(var(--settimane, 4), minmax(0, 1fr)); }
.settimane-lavori button i { font-style: normal; }
.settimane-lavori button.corrente { border-color: var(--oro); box-shadow: inset 0 0 0 1px var(--oro); }
.settimane-lavori button.corrente.attivo { box-shadow: none; }
.calendario-reparto .testa-riquadro .scegli-mese span { display: none; }
@media (max-width: 700px) {
  .spiega-settimane { display: none; }
  .scegli-mese .campo { padding: 6px 10px; font-size: 15px; }
  .settimane-lavori button i { font-size: 12px; }
}
/* Dettaglio dell'articolo nel pannello: senza la striscia dello stato attaccata al testo (segnalato da Luca) */
.scheda-lavoro.in-dettaglio { box-shadow: none; border: 0; padding: 0; background: transparent; }
/* ===== Schermata di accettazione (Luca, 28/10): diretta, niente riquadri grandi. Il cliente, una riga di pulsanti
   piccoli col numero di ciò che chiede attenzione, la giornata in una riga, le accettazioni da finire. ===== */
.accettazione-banco .titolo-pagina { margin-top: 0; }
.azioni-banco { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.azioni-banco::-webkit-scrollbar { display: none; }
.azioni-banco a { flex: none; display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border-radius: 99px; background: #fff; border: 1.5px solid var(--avorio-3); text-decoration: none; color: var(--testo); font-weight: 600; font-size: 15px; white-space: nowrap; }
.azioni-banco a i { font-style: normal; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 99px; display: inline-grid; place-items: center; background: var(--oro); color: var(--nero); font-size: 13px; font-weight: 800; }
.azioni-banco a i.rosso { background: var(--mattone); color: #fff; }
.azioni-banco a:active { background: #fffaf0; }
.accettazione-banco + .azioni-banco + .oggi-in-bottega { margin-top: 10px; }
.oggi-in-bottega { grid-template-columns: repeat(4, 1fr); gap: 6px; }
.oggi-in-bottega a { padding: 6px 10px; font-size: 13px; display: flex; align-items: baseline; gap: 6px; }
.oggi-in-bottega a b { display: inline; font-size: 20px; }
.titolo-sezione-banco { margin: 18px 0 0; font-family: var(--serif); font-size: 17px; font-weight: 600; color: var(--testo-tenue); }
.titolo-sezione-banco + .in-corso { margin-top: 6px; }
.in-corso { grid-template-columns: 1fr; gap: 6px; }
.riga-in-corso { display: flex; align-items: baseline; gap: 4px 12px; flex-wrap: wrap; padding: 10px 14px; border-radius: 12px; background: #fff; border: 1px solid var(--avorio-3); }
.riga-in-corso b { font-family: var(--serif); font-size: 17px; }
.riga-in-corso small { color: var(--testo-tenue); }
.riga-in-corso em { margin-left: auto; font-style: normal; font-weight: 700; color: var(--oro-scuro); }
@media (max-width: 640px) {
  .azioni-banco a { padding: 6px 12px; font-size: 14px; }
  .oggi-in-bottega { grid-template-columns: repeat(2, 1fr); }
  .oggi-in-bottega a b { font-size: 18px; }
}
/* ===== Pagina Vendita: elenco dei prodotti da toccare, ricerca e foto del codice ===== */
.con-elenco .cerca-vendita { display: flex; gap: 8px; }
.con-elenco .cerca-vendita .campo { flex: 1; min-width: 0; }
.con-elenco .foto-codice { padding: 8px 12px; }
.elenco-vendita { list-style: none; margin: 10px 0 0; padding: 4px; max-height: 46vh; overflow-y: auto; border-radius: 12px; border: 1px solid var(--avorio-3); background: #fff; }
.elenco-vendita li + li { border-top: 1px solid var(--avorio-2); }
.elenco-vendita button { width: 100%; display: grid; grid-template-columns: 44px minmax(0, 1fr) auto 34px; gap: 10px; align-items: center; padding: 10px 8px; border: 0; background: none; text-align: left; cursor: pointer; border-radius: 8px; }
.elenco-vendita button:active, .elenco-vendita li.prima button { background: #fffaf0; }
.elenco-vendita .nome-vendita b { display: block; }
.elenco-vendita .nome-vendita small { color: var(--testo-tenue); font-size: 12px; }
.prezzo-elenco { font-weight: 800; }
.piu-elenco { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--oro); color: var(--nero); font-size: 22px; font-weight: 700; }
.elenco-vendita li.nessuno { padding: 12px; color: var(--testo-tenue); }
.titolo-carrello { margin: 16px 0 4px; }
@media (max-width: 640px) {
  .con-elenco .foto-codice span { display: none; }
  .elenco-vendita button { grid-template-columns: 40px minmax(0, 1fr) auto 30px; padding: 8px 6px; gap: 8px; }
  .elenco-vendita .piu-elenco { width: 30px; height: 30px; }
  .ordine-magazzino { padding: 12px 14px; gap: 8px; }
  .ordine-magazzino small { display: none; }
  .azioni-ordine { width: 100%; flex-wrap: nowrap; gap: 6px; }
  .azioni-ordine .bottone { padding: 9px 8px; font-size: 14px; }
}

/* ===== Magazzino a colpo d'occhio: esauriti, da riordinare, disponibili; la lista d'ordine ===== */
.filtri-magazzino { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 10px; }
.filtri-magazzino button { padding: 8px 14px; border-radius: 99px; border: 1.5px solid var(--avorio-3); background: #fff; font-weight: 600; cursor: pointer; }
.filtri-magazzino button b { margin-left: 4px; }
.filtri-magazzino .filtro-esauriti b { color: var(--mattone); }
.filtri-magazzino .filtro-riordinare b { color: #b36b00; }
.filtri-magazzino .filtro-disponibili b { color: #2f6b2f; }
.filtri-magazzino button.sel { background: var(--nero); color: var(--avorio); border-color: var(--nero); }
.filtri-magazzino button.sel b { color: var(--oro-chiaro); }
.cerca-magazzino { width: 100%; margin-bottom: 12px; }
.ordine-magazzino { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; border: 2px solid var(--oro); }
.ordine-magazzino > div:first-child { flex: 1 1 260px; }
.ordine-magazzino b { font-family: var(--serif); font-size: 19px; display: block; }
.ordine-magazzino small { color: var(--testo-tenue); }
.azioni-ordine { display: flex; flex-wrap: wrap; gap: 8px; }
.elenco-magazzino { margin-top: 6px; }
.titolo-gruppo { margin: 18px 0 6px; font-size: 15px; font-weight: 800; text-transform: uppercase; letter-spacing: .6px; }
.titolo-gruppo.gruppo-esauriti { color: var(--mattone); }
.titolo-gruppo.gruppo-riordinare { color: #b36b00; }
.titolo-gruppo.gruppo-disponibili { color: #2f6b2f; }
.titolo-gruppo.gruppo-fuori { color: var(--testo-tenue); }
.riga-magazzino { display: grid; grid-template-columns: 62px 52px minmax(0, 1fr) auto; grid-template-areas: "pezzi foto corpo ordine" "pezzi foto azioni azioni"; gap: 4px 12px; align-items: center; padding: 10px 12px; margin-bottom: 6px; border-radius: 12px; background: #fff; border: 1px solid var(--avorio-3); border-left-width: 6px; }
.riga-magazzino.gruppo-esauriti { border-left-color: var(--mattone); }
.riga-magazzino.gruppo-riordinare { border-left-color: #e0a030; }
.riga-magazzino.gruppo-disponibili { border-left-color: #8bbf7a; }
.riga-magazzino.gruppo-fuori { opacity: .6; }
.riga-magazzino.da-ordinare { background: #fffaf0; }
.pezzi-magazzino { grid-area: pezzi; display: grid; place-items: center; align-content: center; height: 56px; border-radius: 10px; background: #e6efe0; color: #2f6b2f; line-height: 1; }
.pezzi-magazzino b { font-family: var(--serif); font-size: 28px; }
.pezzi-magazzino small { font-size: 11px; font-weight: 700; }
.gruppo-esauriti .pezzi-magazzino { background: var(--mattone-chiaro); color: var(--mattone); }
.gruppo-riordinare .pezzi-magazzino { background: #fdf0d0; color: #9a5b00; }
.gruppo-fuori .pezzi-magazzino, .gruppo-reparti .pezzi-magazzino { background: var(--avorio-2); color: var(--testo-tenue); }
.corpo-magazzino { grid-area: corpo; min-width: 0; }
.corpo-magazzino b { display: block; }
.corpo-magazzino small { color: var(--testo-tenue); font-size: 13px; }
.in-ordine { grid-area: ordine; display: flex; align-items: center; gap: 6px; font-weight: 700; white-space: nowrap; cursor: pointer; }
.in-ordine input[type=checkbox] { width: 22px; height: 22px; accent-color: var(--oro-scuro); }
.in-ordine .campo { width: 58px; padding: 6px 8px; text-align: center; }
.in-ordine small { color: var(--testo-tenue); font-weight: 400; }
.azioni-magazzino { grid-area: azioni; display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 14px; }
.azioni-magazzino summary { color: var(--oro-scuro); font-weight: 600; cursor: pointer; }
.azioni-magazzino details[open] { flex-basis: 100%; }
.azioni-magazzino form { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.azioni-magazzino .modulo-sede { display: grid; }
.movimenti-magazzino summary { cursor: pointer; }
@media (max-width: 640px) {
  .riga-magazzino { grid-template-columns: 52px 46px minmax(0, 1fr); grid-template-areas: "pezzi foto corpo" "pezzi foto ordine" "azioni azioni azioni"; }
  .pezzi-magazzino { height: 50px; }
  .pezzi-magazzino b { font-size: 24px; }
  .azioni-ordine .bottone { flex: 1 1 auto; }
}
.elenco-vendita .pezzi { font-style: normal; font-weight: 700; color: #2f6b2f; }
.elenco-vendita .pezzi.poca { color: #9a5b00; }
.elenco-vendita .pezzi.a-zero { color: var(--mattone); }
/* Foto piccola dei prodotti (richiesta di Luca): si riconoscono senza leggere. */
.foto-elenco { width: 44px; height: 44px; border-radius: 8px; background: var(--avorio-2); overflow: hidden; }
.foto-elenco img, .foto-prodotto img { width: 100%; height: 100%; object-fit: cover; display: block; }
.foto-prodotto { grid-area: foto; margin: 0; }
.foto-prodotto label { position: relative; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 10px; overflow: hidden; background: var(--avorio-2); border: 1.5px dashed #cdbf9f; cursor: pointer; }
.foto-prodotto label:has(img) { border-style: solid; border-color: var(--avorio-3); }
.foto-prodotto span { font-size: 11px; font-weight: 700; color: var(--oro-scuro); text-align: center; line-height: 1.1; }
.foto-prodotto input[type=file] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
@media (max-width: 640px) { .elenco-vendita .foto-elenco { width: 40px; height: 40px; } .foto-prodotto label { width: 46px; height: 46px; } }
/* ===== Giacenze (regola di Luca): pronti e non ritirati da 15 giorni in su, con i promemoria ===== */
.spiega-giacenze { color: var(--testo-tenue); margin: -4px 0 12px; font-size: 14px; }
.filtri-giacenze .filtro-da_avvisare b { color: #b36b00; }
.filtri-giacenze .filtro-scaduto b { color: var(--mattone); }
.filtri-giacenze .filtro-pausa b { color: #3d6a8a; }
.titolo-gruppo.stato-da_avvisare { color: #b36b00; }
.titolo-gruppo.stato-scaduto { color: var(--mattone); }
.titolo-gruppo.stato-ultimo_avviso { color: var(--mattone); }
.titolo-gruppo.stato-avvisato { color: #2f6b2f; }
.titolo-gruppo.stato-pausa { color: #3d6a8a; }
.riga-giacenza { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 12px; padding: 12px; margin-bottom: 8px; border-radius: 12px; background: #fff; border: 1px solid var(--avorio-3); border-left-width: 6px; scroll-margin-top: 140px; }
.riga-giacenza.stato-da_avvisare { border-left-color: #e0a030; }
.riga-giacenza.stato-scaduto, .riga-giacenza.stato-ultimo_avviso { border-left-color: var(--mattone); }
.riga-giacenza.stato-avvisato { border-left-color: #8bbf7a; }
.riga-giacenza.stato-pausa { border-left-color: #7fa6c4; }
.giorni-giacenza { display: grid; place-items: center; align-content: center; height: 60px; border-radius: 10px; line-height: 1; background: #fdf0d0; color: #9a5b00; }
.giorni-giacenza b { font-family: var(--serif); font-size: 28px; }
.giorni-giacenza small { font-size: 11px; font-weight: 700; }
.livello-90 .giorni-giacenza, .livello-180 .giorni-giacenza { background: var(--mattone-chiaro); color: var(--mattone); }
.stato-pausa .giorni-giacenza { background: #e3edf5; color: #3d6a8a; }
.stato-avvisato .giorni-giacenza { background: #e6efe0; color: #2f6b2f; }
.corpo-giacenza { min-width: 0; }
.chi-giacenza { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.chi-giacenza a { text-decoration: none; }
.chi-giacenza a b { font-family: var(--serif); font-size: 19px; }
.chi-giacenza > span { color: var(--testo-tenue); font-size: 14px; }
.chip-canale { font-style: normal; font-size: 12px; font-weight: 700; padding: 2px 8px; border-radius: 99px; background: var(--avorio-2); color: var(--testo-tenue); }
.chip-canale.wa { background: #e6efe0; color: #2f6b2f; }
.articoli-giacenza { list-style: none; margin: 6px 0 0; padding: 0; display: grid; gap: 4px; }
.articoli-giacenza li { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; font-size: 14px; }
.articoli-giacenza img, .articoli-giacenza i { width: 32px; height: 32px; border-radius: 6px; object-fit: cover; background: var(--avorio-2); flex: none; }
.articoli-giacenza a { text-decoration: none; font-family: ui-monospace, Menlo, Consolas, monospace; }
.articoli-giacenza small { color: var(--testo-tenue); }
.stato-giacenza { margin: 8px 0 0; font-size: 14px; }
.non-partito { margin: 6px 0 0; padding: 6px 10px; border-radius: 8px; background: var(--mattone-chiaro); color: var(--mattone); font-size: 13px; font-weight: 600; }
.azioni-giacenza { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 10px; }
.azioni-giacenza form { margin: 0; }
.azioni-giacenza summary { color: var(--oro-scuro); font-weight: 600; cursor: pointer; font-size: 14px; }
.azioni-giacenza details[open] { flex-basis: 100%; }
.anteprima-giacenza pre { white-space: pre-wrap; font: 14px/1.45 var(--sans); background: #f4f7ef; border: 1px solid #d9e6cf; border-radius: 10px; padding: 10px 12px; margin: 8px 0 0; }
.nota-giacenza form { display: grid; gap: 8px; margin-top: 8px; }
.scelte-pausa { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.scelte-pausa label { display: flex; align-items: center; gap: 6px; font-size: 14px; color: var(--testo-tenue); }
.scelte-pausa input[type=date] { padding: 6px 8px; }
@media (max-width: 640px) {
  .riga-giacenza { grid-template-columns: 50px minmax(0, 1fr); gap: 10px; padding: 10px; }
  .giorni-giacenza { height: 50px; }
  .giorni-giacenza b { font-size: 22px; }
  .azioni-giacenza form, .azioni-giacenza .bottone { width: 100%; }
}
/* Lavaggio scarpe (regola di Luca): pelle liscia e camoscio contati a parte per ogni giorno. */
.materiale-giorno { display: inline-block; margin-right: 8px; white-space: nowrap; }
.materiale-giorno b { font-weight: 700; }
.materiali-pillola { display: block; margin-top: 3px; font-size: 11px; line-height: 1.3; color: var(--testo-tenue); white-space: normal; }
.materiali-riassunto { color: var(--testo-tenue); }
.materiali-domanda { display: block; margin-top: 6px; font-weight: 600; }
.dettaglio-voce b.da-scegliere { color: var(--mattone); }
.dettaglio-voce b.da-scegliere::after { content: ' · da scegliere'; font-weight: 600; }
.materiali-pillola, .materiali-riassunto, .materiali-domanda { text-transform: none; }
/* Scadenza delle preaccettazioni dei clienti (regola di Luca, 28/10): una settimana, poi l'archivio da cui si riprendono */
.preaccettazione-riga.in-scadenza { box-shadow: inset 4px 0 0 #e0a030; }
.preaccettazione-riga.scaduta { box-shadow: inset 4px 0 0 var(--mattone); background: #fffaf7; }
.preaccettazione-riga.scaduta .lato-riga small, .preaccettazione-riga.in-scadenza .lato-riga small { color: var(--mattone); font-weight: 700; }
.preaccettazione-riga .corpo-riga a { color: inherit; text-decoration: none; }
.riga-con-azione { display: grid; gap: 6px; }
.riga-con-azione > form { justify-self: end; margin: 0; }
.riga-con-azione > form .bottone, .azioni-scaduta .bottone { padding: 9px 16px; font-size: 15px; }
.conferma-tutte { margin: 0 0 10px; }
.azioni-scaduta { gap: 6px; }
.azioni-scaduta form { margin: 0; }
.gia-nostro { font-style: normal; font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 99px; background: var(--oro); color: var(--nero); vertical-align: middle; }
.avviso-direzione.scaduta { background: var(--mattone-chiaro); color: var(--mattone); }
.avviso-scaduta { margin: 8px 0 0; padding: 8px 10px; border-radius: 10px; background: var(--mattone-chiaro); color: var(--mattone); font-size: 13px; font-weight: 700; line-height: 1.35; }
.promemoria a.scaduta { font-size: 12px; font-weight: 700; padding: 5px 9px; border-radius: 99px; background: var(--nero); color: var(--oro-chiaro); text-decoration: none; }
#archivio { margin-top: 26px; }
.storico[open] > summary .apri-elenco::after { content: 'chiudi'; }
@media (max-width: 700px) {
  .riga-con-azione > form, .riga-con-azione > form .bottone, .conferma-tutte .bottone { width: 100%; }
  .azioni-scaduta { flex-direction: row; flex-wrap: wrap; }
}
/* ===== Accettazione (regola di Luca, 28/10): ricerca al centro, contatori con i bloccati, tasti delle aree, notifiche ===== */
.nuovo-cliente { display: inline-flex; align-items: center; justify-content: center; gap: 9px; padding: 0 22px; min-height: 60px; border-radius: 14px; white-space: nowrap; text-decoration: none; font-weight: 800; font-size: 17px; letter-spacing: .01em; color: var(--nero); background: linear-gradient(135deg, #f6e6b4 0%, var(--oro) 52%, #b88c3c 100%); box-shadow: 0 6px 16px rgba(160, 120, 40, .32), inset 0 1px 0 rgba(255, 255, 255, .65); }
.nuovo-cliente svg { flex: none; }
.nuovo-cliente:active { transform: translateY(1px); box-shadow: 0 3px 8px rgba(160, 120, 40, .3); }
/* Accettazione con critica (richiesta di Luca, 29/10): accanto a «Nuovo cliente», scura per distinguerla. */
.nuovo-cliente.con-critica { background: var(--nero); color: var(--oro-chiaro); box-shadow: 0 6px 16px rgba(0, 0, 0, .2); font-size: 15px; }
.oggi-in-bottega { grid-template-columns: repeat(5, 1fr); }
.tasti-banco { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-flow: dense; gap: 10px; margin: 16px 0 6px; }
.tasti-banco .tasto { display: flex; align-items: center; gap: 10px; min-height: 60px; padding: 10px 14px; border-radius: 14px; background: #fff; border: 1.5px solid var(--avorio-3); color: var(--testo); text-decoration: none; font-weight: 700; font-size: 16px; }
.tasti-banco .tasto svg { flex: none; color: var(--oro-scuro); }
.tasti-banco .tasto span { flex: 1; min-width: 0; line-height: 1.2; }
.tasti-banco .tasto i { font-style: normal; min-width: 26px; height: 26px; padding: 0 7px; border-radius: 99px; display: inline-grid; place-items: center; background: var(--oro); color: var(--nero); font-size: 14px; font-weight: 800; }
.tasti-banco .tasto i.rosso { background: var(--mattone); color: #fff; }
.tasti-banco .tasto:active { background: #fffaf0; }
.tasti-banco .tasto.cassa { grid-column: 1 / -1; justify-content: center; gap: 14px; min-height: 76px; background: var(--nero); border-color: var(--nero); color: var(--oro-chiaro); font-family: var(--serif); font-size: 24px; box-shadow: 0 6px 16px rgba(0, 0, 0, .18); }
.tasti-banco .tasto.cassa span { flex: none; }
.tasti-banco .tasto.cassa svg { color: var(--oro); }
.tasti-banco .tasto.cassa small { display: block; font-family: var(--sans); font-size: 12px; font-weight: 600; color: #cfc4b2; }
.tasti-banco .tasto.cassa:active { background: #2a2620; }
.notifiche-banco { margin-top: 6px; display: grid; gap: 6px; }
.notifica { display: flex; align-items: center; gap: 10px; padding: 11px 14px; border-radius: 12px; background: #fff; border: 1px solid var(--avorio-3); box-shadow: inset 4px 0 0 var(--avorio-3); text-decoration: none; color: var(--testo); }
.notifica span { flex: 1; min-width: 0; }
.notifica b { display: block; font-size: 15px; }
.notifica small { display: block; margin-top: 2px; font-size: 13px; color: var(--testo-tenue); }
.notifica em { font-style: normal; font-weight: 800; font-size: 18px; color: var(--oro-scuro); }
.notifica.oro { box-shadow: inset 4px 0 0 var(--oro); }
/* Regola di Luca (29/10): il rosso solo per l'urgenza, più è grave più è rosso. */
.notifica.importante { box-shadow: inset 6px 0 0 var(--mattone); border-color: var(--mattone); background: #fff6f2; }
.notifica.importante b { color: var(--mattone); }
.notifica.urgente { background: var(--mattone); border-color: var(--mattone); color: #fff; box-shadow: none; }
.notifica.urgente b, .notifica.urgente small, .notifica.urgente em { color: #fff; }
.gruppo-notifiche { display: grid; gap: 6px; padding: 10px; border-radius: 14px; background: var(--avorio); border: 1px solid var(--avorio-3); }
.gruppo-notifiche.urgente { border: 2px solid var(--mattone); }
.testa-gruppo { margin: 0 2px; display: flex; align-items: center; gap: 6px; font-weight: 800; font-size: 15px; }
.testa-gruppo b { margin-left: auto; min-width: 24px; padding: 1px 8px; border-radius: 99px; background: #fff; text-align: center; font-size: 13px; }
.gruppo-notifiche.urgente .testa-gruppo b { background: var(--mattone); color: #fff; }
.tutto-in-ordine { margin: 4px 0 0; color: #2f6b2f; font-weight: 600; }
/* L'accettazione facile (richiesta di Luca, 29/10): una domanda alla volta, scelte grandi, un solo tasto per cliente. */
.vai-facile { padding: 8px 14px; border-radius: 99px; background: #fff7e0; border: 1.5px solid var(--oro); color: var(--testo); font-weight: 800; font-size: 14px; text-decoration: none; white-space: nowrap; }
.pagina.facile { max-width: 760px; }
.titolo-facile { display: flex; align-items: center; gap: 10px; margin: 6px 0 14px; font-family: var(--serif); font-size: 26px; font-weight: 600; }
.titolo-facile > span:first-child { flex: none; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--oro); color: var(--nero); font-family: var(--sans, inherit); font-size: 17px; font-weight: 800; }
.scelte-facili { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.scelte-facili > button, .scelte-facili > a { display: grid; justify-items: center; gap: 4px; padding: 22px 14px; border-radius: 18px; border: 2px solid var(--avorio-3); background: #fff; font: inherit; color: var(--testo); text-align: center; text-decoration: none; cursor: pointer; box-shadow: 0 2px 0 var(--avorio-3); }
.scelte-facili > button:active, .scelte-facili > a:active { border-color: var(--oro); background: #fffaf0; transform: translateY(1px); }
.scelte-facili .icona-facile { font-size: 40px; line-height: 1; }
.scelte-facili b { font-size: 20px; }
.scelte-facili small { font-size: 14px; color: var(--testo-tenue); }
.scelta-fatta { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; font-size: 16px; }
.cambia-scelta { border: 0; background: none; padding: 4px; font: inherit; font-weight: 700; color: var(--oro-scuro); text-decoration: underline; cursor: pointer; }
.cerca-facile { width: 100%; font-size: 20px; padding: 14px 16px; }
.risultati-facili { display: grid; gap: 8px; margin: 8px 0 12px; }
.cliente-facile { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px; background: #fff; border: 1.5px solid var(--avorio-3); }
.chi-facile { flex: 1; min-width: 0; display: grid; color: var(--testo); text-decoration: none; }
.chi-facile b { font-size: 18px; }
.chi-facile small { color: var(--testo-tenue); font-size: 14px; }
.azione-facile form { margin: 0; }
.azione-facile .bottone { padding: 12px 16px; font-size: 16px; white-space: nowrap; }
.niente-facile { color: var(--testo-tenue); font-size: 14px; }
.nuovo-facile { display: block; text-align: center; padding: 14px; font-size: 17px; }
.pagina-completa { display: block; margin: 26px 0 8px; text-align: center; color: var(--testo-tenue); font-size: 14px; }
@media (max-width: 600px) {
  .titolo-facile { font-size: 22px; }
  .scelte-facili { gap: 8px; }
  .scelte-facili > button, .scelte-facili > a { padding: 16px 8px; }
  .scelte-facili .icona-facile { font-size: 32px; }
  .scelte-facili b { font-size: 17px; }
  .scelte-facili small { font-size: 12px; }
  .cliente-facile { flex-wrap: wrap; }
  .azione-facile { flex: 1 1 100%; }
  .azione-facile .bottone, .azione-facile form .bottone { width: 100%; text-align: center; }
}
/* La foto della persona nel tondo, al posto delle iniziali (richiesta di Luca, 29/10). */
.con-foto { overflow: hidden; padding: 0; }
.con-foto img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block; }
.persona .iniziali.con-foto { width: 84px; height: 84px; }
.iniziali-persona.grande { width: 64px; height: 64px; font-size: 22px; }
.foto-persona { align-items: center; }
.foto-persona .scatta-documento input { display: none; }
/* Ricerca del banco dalla prima lettera (richiesta di Luca, 29/10): i cognomi da toccare per completare. */
.completa-ricerca { display: flex; gap: 6px; overflow-x: auto; margin: 6px 0 4px; scrollbar-width: none; }
.completa-ricerca:empty { display: none; }
.completa-ricerca::-webkit-scrollbar { display: none; }
.completa-ricerca button { flex: none; padding: 7px 12px; border-radius: 99px; border: 1.5px solid var(--oro); background: #fffaf0; font: inherit; font-size: 15px; font-weight: 700; color: var(--testo); cursor: pointer; }
.completa-ricerca button:active { background: var(--oro); }
/* Il centro notifiche (richiesta di Luca, 29/10): una riga con quante sono per livello, gli urgenti in vista, il resto
   chiuso e ordinato (livello › categoria) finché non lo si apre. */
.centro-notifiche { display: grid; gap: 6px; margin: 10px 0 0; padding: 10px 12px; border-radius: 14px; background: var(--avorio); border: 1px solid var(--avorio-3); }
.testa-centro { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; }
.testa-centro > b { font-family: var(--serif); font-size: 18px; margin-right: 4px; }
.testa-centro .tutto-in-ordine { margin: 0; font-size: 14px; }
.conta-livello { padding: 2px 10px; border-radius: 99px; font-size: 13px; font-weight: 700; background: #fff; border: 1.5px solid var(--avorio-3); }
.conta-livello.urgenti { background: var(--mattone); border-color: var(--mattone); color: #fff; }
.conta-livello.meno-urgenti { border-color: var(--mattone); color: var(--mattone); }
.conta-livello.da-processare { border-color: var(--oro); color: var(--oro-scuro); }
.livello-notifiche { display: grid; gap: 5px; }
.altre-notifiche > summary { list-style: none; cursor: pointer; padding: 6px 2px; font-weight: 700; font-size: 14px; color: var(--oro-scuro); }
.altre-notifiche > summary::-webkit-details-marker { display: none; }
.altre-notifiche[open] > summary { margin-bottom: 4px; }
.altre-notifiche .livello-notifiche + .livello-notifiche { margin-top: 10px; }
.nome-livello { margin: 0; font-size: 12px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--testo-tenue); }
.categoria-notifiche { margin: 4px 2px 0; display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; color: var(--testo-tenue); }
.categoria-notifiche b { padding: 0 7px; border-radius: 99px; background: #fff; font-size: 12px; }
.centro-notifiche .notifica { padding: 8px 12px; }
.centro-notifiche .notifica b { font-size: 14px; }
.centro-notifiche .notifica small { font-size: 12px; }
@media (max-width: 600px) {
  .centro-notifiche { padding: 8px 10px; }
  .testa-centro > b { font-size: 16px; }
  .conta-livello { font-size: 12px; padding: 1px 8px; }
  .centro-notifiche .notifica { padding: 7px 10px; }
  .centro-notifiche .notifica b { font-size: 13px; }
}
@media (max-width: 700px) {
  .nuovo-cliente { min-height: 54px; width: 100%; }
  .oggi-in-bottega { grid-template-columns: repeat(2, 1fr); }
  .oggi-in-bottega a:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .tasti-banco { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .tasti-banco .tasto { min-height: 54px; padding: 8px 10px; gap: 8px; font-size: 15px; }
  .tasti-banco .tasto svg { width: 22px; height: 22px; }
  .tasti-banco .tasto { position: relative; }
  .tasti-banco .tasto i { position: absolute; top: -7px; right: -5px; min-width: 24px; height: 24px; font-size: 13px; box-shadow: 0 0 0 2px var(--avorio); }
  .tasti-banco .tasto.cassa { min-height: 66px; font-size: 21px; }
  .tasti-banco .tasto.cassa svg { width: 26px; height: 26px; }
}
/* Reparti (richiesta di Luca): i contatori in alto sono comandi, aprono l'elenco filtrato */
.contatori-reparto > a { display: flex; min-width: 0; flex: 1 1 auto; text-decoration: none; color: inherit; border-radius: 12px; }
.contatori-reparto > a > span { flex: 1; }
.contatori-reparto > a:active > span { filter: brightness(1.2); }
/* Etichette di un giorno (richiesta di Luca): per ristampare quella rovinata */
.scegli-giorno { display: flex; align-items: flex-end; gap: 8px; margin-bottom: 8px; }
.scegli-giorno label { flex: 1; max-width: 260px; }
.scegli-giorno .bottone { padding: 12px 18px; }
.bottone.spento { opacity: .35; pointer-events: none; }
.etichette-pratica { margin: 12px 0; padding: 10px 12px; background: #fff; border: 1px solid var(--avorio-3); border-radius: 14px; }
.etichette-pratica header { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin-bottom: 8px; }
.etichette-pratica header b { font-size: 16px; }
.etichette-pratica header small { color: var(--testo-tenue); }
.etichette-pratica header .bottone { margin-left: auto; padding: 9px 14px; font-size: 14px; }
.articoli-etichette { display: grid; gap: 6px; }
.articolo-etichetta { display: flex; align-items: center; gap: 10px; padding: 6px 8px; border-radius: 10px; background: var(--avorio); text-decoration: none; color: var(--testo); font-size: 14px; }
.articolo-etichetta img, .articolo-etichetta .mini { width: 44px; height: 44px; border-radius: 8px; object-fit: cover; background: var(--avorio-3); flex: none; }
.articolo-etichetta .mini { display: grid; place-items: center; font-size: 9px; text-align: center; }
.articolo-etichetta > span { flex: 1; min-width: 0; }
.articolo-etichetta em { font-style: normal; font-weight: 700; color: var(--oro-scuro); white-space: nowrap; }
.azioni-cassa { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 0; }
.azioni-cassa .bottone { padding: 12px 18px; font-size: 16px; }
/* Preaccettazioni (regola di Luca, 28/10): nuove, in attesa, in scadenza, scadute; clienti provvisori */
.salta-sezioni { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 6px; }
.salta-sezioni a { padding: 6px 12px; border-radius: 99px; background: #fff; border: 1.5px solid var(--avorio-3); text-decoration: none; color: var(--testo); font-weight: 600; font-size: 14px; }
.salta-sezioni a b { margin-left: 4px; color: var(--oro-scuro); }
.salta-sezioni a.rosso { border-color: var(--mattone); color: var(--mattone); }
.salta-sezioni a.rosso b { color: var(--mattone); }
.giorno-lavori .spiega-sezione { font-family: var(--sans); font-style: normal; font-size: 13px; font-weight: 500; color: #cfc4b2; }
.giorno-lavori.oggi .spiega-sezione { color: var(--nero); }
.giorno-lavori.passato .spiega-sezione { color: #fff; }
.cliente-provvisorio { padding: 2px 8px; border-radius: 99px; background: var(--avorio-2); color: var(--oro-scuro); font-size: 13px; }
@media (max-width: 700px) { .giorno-lavori .spiega-sezione { display: none; } }
/* Clienti (regola di Luca, 28/10): diretti, brand con le loro sedi, provvisori delle preaccettazioni */
.tipi-clienti { margin-bottom: 10px; }
.tipi-clienti a b { margin-left: 4px; }
.riga-cliente .chi { flex-wrap: wrap; }
.sedi-brand { display: flex; flex-wrap: wrap; gap: 4px; flex-basis: 100%; margin-top: 4px; font-size: 12px; color: var(--testo-tenue); }
.sedi-brand i { font-style: normal; padding: 2px 8px; border-radius: 99px; background: var(--avorio-2); color: var(--testo); font-weight: 600; }
/* Spedizioni (regola di Luca, 28/10): in arrivo e in partenza, con l'estremo ritardo oltre i 4 giorni da corriere */
.titolo-sezione-spedizioni { margin: 22px 0 0; font-family: var(--serif); font-size: 24px; }
.riga-collo.estremo { box-shadow: inset 4px 0 0 var(--mattone); background: #fffaf7; }
.riga-collo.estremo .stato-art { color: var(--mattone); }
/* Cassa (regola di Luca, 28/10): annullare un incasso solo con il consenso del direttore; vendita annullabile con conferma */
.riepilogo tr.annullato td { color: var(--testo-tenue); }
.motivo-annullato { margin: 4px 0 0; font-size: 13px; font-weight: 600; color: var(--mattone); }
.annulla-incasso { margin-top: 6px; }
.annulla-incasso summary { cursor: pointer; font-size: 13px; font-weight: 600; color: var(--mattone); }
.annulla-incasso form { display: grid; gap: 6px; margin-top: 6px; max-width: 420px; }
.annulla-incasso .consenso { display: grid; grid-template-columns: 1fr 120px; gap: 6px; }
.annulla-incasso .bottone { padding: 10px 14px; font-size: 15px; }
.annulla-vendita { margin-top: 8px; padding: 8px 14px; border: 1.5px solid var(--mattone); border-radius: 10px; background: #fff; color: var(--mattone); font-weight: 700; cursor: pointer; }
/* Cassa aperta (richiesta di Luca, 28/10): vendere e consegnare al cliente; chiusure da aprire con un tocco */
.testa-cassa { flex-wrap: wrap; gap: 8px 14px; }
.incassato-oggi { font-size: 16px; color: var(--testo-tenue); }
.incassato-oggi b { font-family: var(--serif); font-size: 24px; color: var(--testo); }
.testa-cassa .azioni-cassa { margin: 0 0 0 auto; }
.cassa-chiusa { align-self: center; font-weight: 700; color: #2f6b2f; }
.cassa-due { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 14px; margin-top: 12px; align-items: start; }
.riquadro-cassa { padding: 14px; background: #fff; border: 1px solid var(--avorio-3); border-radius: 16px; }
.riquadro-cassa h2 { margin: 0 0 6px; font-family: var(--serif); font-size: 21px; }
.riquadro-cassa .risultati { margin-top: 8px; display: grid; gap: 6px; }
.riquadro-cassa .risultato { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 10px; border: 1px solid var(--avorio-3); border-radius: 12px; }
.riquadro-cassa .risultato > div { display: grid; }
.riquadro-cassa .risultato .bottone { padding: 10px 14px; font-size: 15px; }
@media (max-width: 860px) { .cassa-due { grid-template-columns: 1fr; } }
.scarica-chiusure { display: flex; flex-wrap: wrap; gap: 8px; }
details.riga-chiusura-cassa > summary { display: flex; align-items: center; gap: 12px; list-style: none; cursor: pointer; }
details.riga-chiusura-cassa > summary::-webkit-details-marker { display: none; }
details.riga-chiusura-cassa { display: block; }
.apri-dettagli { color: var(--oro-scuro); font-weight: 700; }
.apri-dettagli::after { content: ' ›'; }
details[open] > summary .apri-dettagli::after { content: ' ⌄'; }
.dettagli-chiusura { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--avorio-2); display: grid; gap: 10px; }
.dettagli-chiusura .scarto { color: var(--mattone); font-weight: 700; }

/* Critiche dei clienti (regola di Luca, 28/10): accoglienza, fasi in ordine, fascicolo per l'analisi. */
.elenco-critiche { display: grid; gap: 8px; margin-bottom: 14px; }
.critica-riga { display: flex; align-items: center; gap: 12px; padding: 10px 12px; background: #fff; border: 1px solid var(--avorio-3); border-radius: 14px; box-shadow: inset 4px 0 0 var(--oro); text-decoration: none; color: var(--testo); }
.critica-riga img, .critica-riga .mini, .articolo-scelta img, .articolo-scelta .mini { width: 58px; height: 58px; flex: none; border-radius: 10px; object-fit: cover; }
.critica-riga .mini, .articolo-scelta .mini { display: grid; place-items: center; background: var(--avorio); color: var(--testo-tenue); font-size: 11px; text-align: center; }
.critica-riga .corpo-riga { flex: 1; min-width: 0; display: grid; gap: 2px; }
.critica-riga .racconto-breve { font-family: var(--serif); font-size: 15px; color: var(--testo); }
.critica-riga small { color: var(--testo-tenue); }
.critica-riga .lato-riga { text-align: right; flex: none; }
.critica-riga .entro { display: grid; }
.critica-riga .entro b { font-size: 15px; }
.critica-riga .entro.tardi, .critica-riga .entro.tardi small { color: var(--mattone); }
.critica-riga .fase-breve { font-size: 13px; font-weight: 700; color: var(--oro-scuro); }
.critica-riga.fase-accolta, .critica-riga.in-ritardo { box-shadow: inset 4px 0 0 var(--mattone); background: #fffaf7; }
.critica-riga.fase-riconsegnata { box-shadow: inset 4px 0 0 #e0a030; }
.critica-riga.fase-confermata { box-shadow: inset 4px 0 0 #5c8a5a; opacity: .85; }
@media (max-width: 560px) {
  .critica-riga { flex-wrap: wrap; }
  .critica-riga .corpo-riga { flex-basis: calc(100% - 72px); }
  .critica-riga .lato-riga { display: block; flex-basis: 100%; text-align: left; padding-left: 70px; }
  .critica-riga .entro { display: flex; gap: 6px; align-items: baseline; }
  .critica-riga .entro b { white-space: nowrap; }
}
.racconto-critica { margin: 10px 0 14px; padding: 14px 16px; border-radius: 14px; background: #fff; border: 1px solid var(--avorio-3); box-shadow: inset 4px 0 0 var(--oro); }
.racconto-critica.in-ritardo { box-shadow: inset 4px 0 0 var(--mattone); background: #fffaf7; }
.racconto-critica blockquote, .risposta-data blockquote { margin: 0; font-family: var(--serif); font-size: 20px; line-height: 1.35; }
.racconto-critica p { margin: 6px 0 0; color: var(--testo-tenue); }
.entro-critica { color: var(--testo) !important; font-size: 15px; }
.racconto-critica.in-ritardo .entro-critica { color: var(--mattone) !important; }
.fasi-critica { list-style: none; margin: 0 0 16px; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; counter-reset: fase; }
.fasi-critica li { counter-increment: fase; padding: 10px 8px; border-radius: 12px; border: 1.5px solid var(--avorio-3); background: #fff; display: grid; gap: 2px; font-size: 13px; color: var(--testo-tenue); }
.fasi-critica li::before { content: counter(fase); font-weight: 800; font-size: 12px; }
.fasi-critica li b { color: var(--testo); font-size: 14px; line-height: 1.2; }
.fasi-critica li.fatta { background: #f6faf4; border-color: #a9c7a3; }
.fasi-critica li.fatta::before { content: '✓'; color: #4f7d4b; }
.fasi-critica li.prossima { border-color: var(--oro); box-shadow: 0 0 0 2px var(--oro-chiaro); }
.fasi-critica li.finale b { color: var(--oro-scuro); }
@media (max-width: 760px) { .fasi-critica { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.prossimo-passo, .lavoro-critica { margin-bottom: 14px; display: grid; gap: 10px; }
.prossimo-passo h2, .lavoro-critica h2, .risposta-data h2 { margin: 0; font-family: var(--serif); font-size: 22px; }
.prossimo-passo form, .lavoro-critica form { display: grid; gap: 10px; }
.modulo-critica { display: grid; gap: 12px; }
.modulo-critica textarea { width: 100%; font-family: var(--sans); font-size: 16px; line-height: 1.4; }
.scelte-esito, .giorni-critica { display: flex; flex-wrap: wrap; gap: 8px; }
.scelte-esito label, .giorni-critica label { display: inline-flex; align-items: center; gap: 6px; padding: 9px 12px; border-radius: 99px; border: 1.5px solid var(--avorio-3); background: #fff; font-weight: 600; cursor: pointer; }
.scelte-esito label:has(input:checked), .giorni-critica label:has(input:checked) { border-color: var(--oro); background: #fffaf0; }
.scelte-esito small { color: var(--testo-tenue); font-weight: 400; }
.conferma-critica { padding-top: 10px; border-top: 1px solid var(--avorio-2); }
.critica-conclusa { padding: 14px 16px; border-radius: 14px; background: #f6faf4; border: 1px solid #a9c7a3; color: #3f6a3b; font-weight: 700; }
.scegli-articolo { display: grid; gap: 8px; }
.articolo-scelta { display: flex; align-items: center; gap: 12px; padding: 8px 10px; border: 1.5px solid var(--avorio-3); border-radius: 14px; background: #fff; cursor: pointer; }
.articolo-scelta:has(input:checked) { border-color: var(--oro); background: #fffaf0; }
.articolo-scelta .corpo-riga { display: grid; gap: 2px; }
.articolo-scelta small { color: var(--testo-tenue); }
.riportato { display: grid; gap: 4px; padding: 10px 12px; border-radius: 12px; background: #fffaf0; border: 1px solid var(--oro-chiaro); }
.riportato small { color: var(--testo-tenue); }
/* Accogli la critica (regola di Luca, 28/10): l'articolo in primo piano, gli altri in una finestra con la ricerca. */
.articolo-della-critica { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 1.5px solid var(--oro); border-radius: 14px; background: #fffaf0; }
.articolo-della-critica .scelto { flex: 1; min-width: 0; display: flex; align-items: center; gap: 12px; }
.articolo-della-critica .scelto img, .articolo-della-critica .scelto .mini { width: 72px; height: 72px; flex: none; border-radius: 10px; object-fit: cover; }
.articolo-della-critica .scelto .mini { display: grid; place-items: center; background: var(--avorio); color: var(--testo-tenue); font-size: 11px; text-align: center; }
.articolo-della-critica .corpo-riga { display: grid; gap: 2px; }
.articolo-della-critica small { color: var(--testo-tenue); }
.articolo-della-critica .bottone { flex: none; }
.finestra-articoli { width: min(560px, calc(100vw - 24px)); max-height: min(80vh, 720px); padding: 0; border: 0; border-radius: 16px; background: var(--avorio, #faf6ee); box-shadow: 0 18px 50px rgba(0,0,0,.35); }
.finestra-articoli::backdrop { background: rgba(20, 17, 14, .55); }
.finestra-articoli[open] { display: flex; flex-direction: column; }
.finestra-articoli .finestra-testa { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 14px; background: var(--nero); color: var(--avorio); }
.finestra-articoli .finestra-testa b { font-family: var(--serif); font-size: 19px; color: var(--oro-chiaro); }
.finestra-articoli > .campo { margin: 12px 14px 0; width: auto; }
.finestra-articoli .scegli-articolo { overflow-y: auto; padding: 12px 14px 16px; -webkit-overflow-scrolling: touch; }
.gruppo-articoli { margin: 6px 0 0; font-size: 12px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: var(--testo-tenue); }
.nessuno-trovato { margin: 6px 0; color: var(--testo-tenue); }
.pronto-scelta .problema-qui { color: var(--oro-scuro); font-weight: 700; text-decoration: none; white-space: nowrap; }
.pronto-scelta .resta-qui { color: var(--mattone); }
.ha-una-critica { display: inline-block; margin-top: 10px; color: var(--oro-scuro); font-weight: 700; text-decoration: none; }
.conferma-al-ritiro { margin: -2px 0 6px 12px; padding: 8px 10px; border-radius: 10px; background: #fffaf0; border: 1px solid var(--oro-chiaro); font-size: 14px; }
.critica-articolo { margin: 8px 0 0; }
.critica-articolo a { color: var(--mattone); font-weight: 700; text-decoration: none; }
.avviso-critica { display: block; margin: 8px 0 0; padding: 8px 10px; border-radius: 10px; background: #fffaf0; border: 1px solid var(--oro); color: var(--testo); font-size: 13px; line-height: 1.35; text-decoration: none; }
.avviso-critica small { color: var(--testo-tenue); }
.collegate a { color: var(--oro-scuro); font-weight: 700; }
.risposta-data { margin-bottom: 14px; }
.risposta-data .tardi { color: var(--mattone); font-weight: 700; }
.risposta-data .analisi { margin: 10px 0 0; color: var(--testo-tenue); }
.articolo-fascicolo { margin-bottom: 10px; }
.articolo-fascicolo p { margin: 4px 0; }
.articolo-fascicolo .richiesta { font-family: var(--serif); font-size: 16px; }
.foto-fascicolo { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 6px; }
.foto-fascicolo img { width: 84px; height: 84px; object-fit: cover; border-radius: 10px; }
.storia-critica { list-style: none; margin: 0 0 24px; padding: 0; display: grid; gap: 6px; }
.storia-critica li { display: grid; grid-template-columns: 118px 1fr; gap: 10px; padding: 8px 10px; border-radius: 10px; background: #fff; border: 1px solid var(--avorio-2); font-size: 14px; }
.storia-critica li.storia-cliente { background: #fffaf0; }
.storia-critica li.storia-giacomo { background: #f7f8fb; }
.storia-critica li.storia-nota { box-shadow: inset 3px 0 0 var(--mattone); }
.storia-critica .dettaglio-storia { font-size: 13px; }
.storia-critica small { color: var(--testo-tenue); }
.quando-storia { color: var(--testo-tenue); font-size: 13px; }
.dettaglio-storia { color: var(--testo); white-space: normal; }
@media (max-width: 560px) { .storia-critica li { grid-template-columns: 1fr; gap: 2px; } }

/* Fattura: niente scontrino (regola di Luca, 28/10): ben visibile al momento del pagamento. */
.avviso-fattura { margin: 10px 0; padding: 12px 14px; border-radius: 14px; background: #fdecec; border: 2px solid var(--mattone); color: var(--testo); font-size: 15px; line-height: 1.4; }
.avviso-fattura b { display: block; color: var(--mattone); font-size: 18px; }

/* Cercato col codice dell'articolo (regola di Luca, 28/10): l'articolo in evidenza, si apre con un tocco. */
.articolo-trovato { display: block; width: fit-content; margin: 6px 0 2px; padding: 5px 12px; border-radius: 99px; background: #fffaf0; border: 1.5px solid var(--oro); color: var(--testo); font-weight: 700; text-decoration: none; }

/* Codice cliente (regola di Luca, 28/10): sempre lo stesso, sull'etichetta al posto del nome. */
.codice-cliente { display: inline-block; margin-left: 6px; padding: 1px 8px; border-radius: 99px; border: 1px solid var(--oro-chiaro); background: #fffaf0; color: var(--oro-scuro); font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 13px; font-weight: 700; vertical-align: middle; white-space: nowrap; }
.codice-cliente:empty { display: none; }
.codice-cliente.grande { font-size: 18px; padding: 3px 12px; margin-left: 0; }
h1 .codice-cliente.grande { margin-left: 8px; }

/* Clienti per la Direzione (regola di Luca, 28/10): quanti sono e da quanto non vengono. */
.clienti-direzione { margin: 0 0 18px; display: grid; gap: 10px; }
.quanti-clienti { display: flex; align-items: center; gap: 14px; padding: 14px 18px; border-radius: 16px; background: var(--nero); color: var(--avorio); text-decoration: none; }
.quanti-clienti b { font-family: var(--serif); font-size: 46px; line-height: 1; color: var(--oro-chiaro); }
.quanti-clienti span { display: grid; font-size: 20px; font-weight: 700; }
.quanti-clienti small { font-size: 13px; font-weight: 400; color: #bfb3a0; }
.quanti-clienti em { margin-left: auto; font-style: normal; font-weight: 700; color: var(--oro-chiaro); }
.fasce-clienti { display: flex; flex-wrap: wrap; gap: 8px; }
.fasce-clienti a { display: inline-flex; align-items: baseline; gap: 6px; padding: 8px 12px; border-radius: 12px; border: 1.5px solid var(--avorio-3); background: #fff; color: var(--testo); text-decoration: none; font-size: 14px; }
.fasce-clienti a b { font-size: 18px; }
.fasce-clienti a.buona b { color: #2f6b2f; }
.fasce-clienti a.persi { border-color: #e2b9a6; background: #fdf4ef; }
.fasce-clienti a.persi b { color: var(--mattone); }
.fasce-clienti a.scelta { border-color: var(--oro); background: #fffaf0; box-shadow: inset 0 0 0 1px var(--oro); }
/* Clienti della Direzione in ordine (richiesta di Luca, 29/10): tre file di fasce con il loro nome. */
.fasce-ordinate { display: grid; gap: 8px; padding: 12px; border-radius: 14px; background: var(--avorio); border: 1px solid var(--avorio-3); }
.fila-fasce { display: grid; grid-template-columns: 120px 1fr; align-items: center; gap: 10px; }
.fila-fasce .nome-fila { font-weight: 800; font-size: 13px; text-transform: uppercase; letter-spacing: .04em; color: var(--testo-tenue); }
.fasce-clienti a small { color: var(--testo-tenue); font-size: 12px; }
.fasce-clienti a.attenzione { border-color: var(--oro); background: #fffaf0; }
.fasce-clienti a.attenzione b { color: var(--oro-scuro); }
.fasce-clienti a.lontano { border-color: #e2b9a6; background: #fdf1ea; }
.fasce-clienti a.lontano b { color: var(--mattone); }
.fasce-clienti a.perso { border-color: var(--mattone); background: #f9e3d9; }
.fasce-clienti a.perso b { color: var(--mattone); }
.ordina-clienti { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0 0 10px; }
.ordina-clienti span { font-weight: 800; font-size: 13px; color: var(--testo-tenue); margin-right: 4px; }
.ordina-clienti a { padding: 7px 12px; border-radius: 99px; border: 1.5px solid var(--avorio-3); background: #fff; color: var(--testo); text-decoration: none; font-weight: 700; font-size: 14px; }
.ordina-clienti a.attivo { background: var(--nero); border-color: var(--nero); color: var(--oro-chiaro); }
@media (max-width: 640px) { .fila-fasce { grid-template-columns: 1fr; gap: 4px; } }
.cerca-clientela { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.cerca-clientela input { flex: 1 1 220px; }
.cerca-clientela select { flex: 0 1 220px; }
.elenco-clientela { display: grid; gap: 8px; }
.cliente-clientela { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 10px 14px; border-radius: 14px; background: #fff; border: 1px solid var(--avorio-2); color: var(--testo); text-decoration: none; }
.cliente-clientela .chi, .cliente-clientela .storia-cliente { display: grid; gap: 2px; }
.cliente-clientela small { color: var(--testo-tenue); }
.cliente-clientela .lontano { color: var(--mattone); }
.cliente-clientela i { font-style: normal; font-weight: 700; color: #2f6b2f; }
.cliente-clientela .speso { font-weight: 800; font-size: 17px; white-space: nowrap; }
.pagine-clientela { display: flex; align-items: center; justify-content: center; gap: 14px; margin: 16px 0; }
@media (max-width: 640px) { .cliente-clientela { grid-template-columns: 1fr auto; } .cliente-clientela .storia-cliente { grid-column: 1 / -1; grid-row: 2; } }

/* «Entra come» (regola di Luca, 28/10): si guarda soltanto. */
.guardi-come { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 20px; background: #fff3d6; border-bottom: 2px solid var(--oro); font-size: 15px; }
.guardi-come p { margin: 0; display: grid; gap: 2px; }
.guardi-come small { color: var(--testo-tenue); }
.guardi-come form { margin: 0; }
@media (max-width: 600px) { .guardi-come { padding: 8px 12px; font-size: 14px; } }
.entra-come { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 8px; margin-bottom: 14px; }
.entra-come form { margin: 0; }
.persona-entra { width: 100%; display: flex; align-items: center; gap: 12px; padding: 10px 14px; border-radius: 14px; border: 1.5px solid var(--avorio-3); background: #fff; text-align: left; font: inherit; color: var(--testo); cursor: pointer; }
.persona-entra .iniziali { width: 40px; height: 40px; flex: none; border-radius: 50%; display: grid; place-items: center; background: var(--nero); color: var(--oro-chiaro); font-weight: 700; }
.persona-entra span:not(.iniziali) { display: grid; }
.persona-entra small { color: var(--testo-tenue); }
.persona-entra em { margin-left: auto; font-style: normal; font-weight: 700; color: var(--oro-scuro); white-space: nowrap; }

/* Pareri con tre faccine (regola di Luca, 28/10): grandi, da toccare col dito, il cliente sceglie da solo. */
.faccine { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }
.faccine button, .faccine label { display: grid; justify-items: center; gap: 4px; min-width: 104px; padding: 12px 14px; border-radius: 18px; border: 2px solid var(--avorio-3); background: #fff; font: inherit; color: var(--testo); cursor: pointer; }
.faccine span { font-size: 46px; line-height: 1; }
.faccine small { font-size: 13px; color: var(--testo-tenue); font-weight: 600; }
.faccine .scelta, .faccine label:has(input:checked) { border-color: var(--oro); background: #fffaf0; box-shadow: 0 0 0 2px var(--oro); }
.faccine input { position: absolute; opacity: 0; pointer-events: none; }
.parere-tocco { margin: 18px auto 4px; max-width: 520px; padding: 14px; border-radius: 16px; background: #fff; border: 1px solid var(--avorio-2); text-align: center; }
.parere-tocco p { margin: 0 0 10px; }
.parere-tocco small { display: block; color: var(--testo-tenue); }
.parere-ritiro { max-width: 640px; margin: 0 auto; text-align: center; }
.modulo-parere { display: grid; gap: 16px; }
.modulo-parere fieldset { border: 0; margin: 0; padding: 0; display: grid; gap: 10px; }
.modulo-parere legend { font-family: var(--serif); font-size: 22px; margin-bottom: 8px; }
.modulo-parere textarea { width: 100%; font-size: 16px; }
.azioni-parere { display: grid; grid-template-columns: 2fr 1fr; gap: 10px; }
.scelta-parere { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 10px; }
.scelta-parere span { flex: 1 1 200px; font-weight: 600; }
.scelta-parere button { padding: 8px 14px; border-radius: 99px; border: 1.5px solid var(--avorio-3); background: #fff; font: inherit; cursor: pointer; }
.scelta-parere button.sel { border-color: var(--oro); background: #fffaf0; font-weight: 700; }
.parere-consenso { margin-top: 10px; }
.parere-consenso small { color: var(--testo-tenue); }
.aspetti-pareri { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; margin: 12px 0 18px; }
.aspetto-parere { padding: 14px 16px; border-radius: 16px; background: #fff; border: 1px solid var(--avorio-2); }
.aspetto-parere h2 { margin: 0 0 6px; font-family: var(--serif); font-size: 20px; }
.aspetto-parere .felici { margin: 0; font-size: 18px; }
.aspetto-parere .felici b { font-size: 32px; color: #2f6b2f; }
.aspetto-parere .felici small, .aspetto-parere .conti { color: var(--testo-tenue); }
.aspetto-parere .conti { margin: 6px 0 0; display: flex; gap: 12px; font-size: 16px; }
.persone-pareri, .parole-clienti { display: grid; gap: 8px; margin-bottom: 18px; }
.persona-parere { display: grid; grid-template-columns: 34px minmax(0, 1fr) minmax(0, 1.4fr) 54px; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 14px; background: #fff; border: 1px solid var(--avorio-2); }
.persona-parere .posizione { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: var(--nero); color: var(--oro-chiaro); font-weight: 700; }
.persona-parere .chi { display: grid; }
.persona-parere small { color: var(--testo-tenue); }
.persona-parere .parziali { display: flex; flex-wrap: wrap; gap: 4px 12px; }
.persona-parere .crescere { color: var(--oro-scuro); font-weight: 700; }
.persona-parere .punteggio { font-size: 26px; font-weight: 800; text-align: right; }
@media (max-width: 640px) { .persona-parere { grid-template-columns: 30px 1fr 48px; } .persona-parere .parziali { grid-column: 2 / -1; grid-row: 2; } }
.parere-riga { display: flex; align-items: flex-start; gap: 12px; padding: 10px 14px; border-radius: 14px; background: #fff; border: 1px solid var(--avorio-2); color: var(--testo); text-decoration: none; }
.parere-riga .faccine-date { display: flex; gap: 2px; font-size: 24px; flex: none; }
.parere-riga .cosa { display: grid; gap: 2px; }
.parere-riga i { font-family: var(--serif); font-size: 16px; }
.parere-riga small { color: var(--testo-tenue); }
/* Pareri in Direzione (richiesta di Luca, 29/10): classifica in tabella con 😍 😐 😞, pareri da cercare e dividere. */
.riquadro-pareri { margin: 0 0 18px; padding: 14px 16px; border-radius: var(--raggio); background: #fff; border: 1px solid var(--avorio-3); }
.riquadro-pareri .titolo-sezione-banco { margin-top: 0; }
.filtri-pareri-reparto { display: flex; gap: 6px; overflow-x: auto; margin: 0 0 10px; padding-bottom: 2px; scrollbar-width: none; }
.filtri-pareri-reparto::-webkit-scrollbar { display: none; }
.filtri-pareri-reparto button { flex: none; display: flex; align-items: center; gap: 6px; padding: 7px 12px; border-radius: 99px; border: 1.5px solid var(--avorio-3); background: #fff; font: inherit; font-size: 14px; font-weight: 700; color: var(--testo); cursor: pointer; }
.filtri-pareri-reparto button b { padding: 0 7px; border-radius: 99px; background: var(--avorio-2); font-size: 12px; }
.filtri-pareri-reparto button.attivo { background: #fff7e0; border-color: var(--oro); box-shadow: inset 0 0 0 1px var(--oro); }
.classifica-pareri { width: 100%; border-collapse: collapse; }
.classifica-pareri th { padding: 6px 8px; font-size: 12px; color: var(--testo-tenue); text-align: left; border-bottom: 1.5px solid var(--avorio-3); }
.classifica-pareri td { padding: 8px; border-bottom: 1px solid var(--avorio-2); vertical-align: middle; }
.classifica-pareri tbody tr { cursor: pointer; }
.classifica-pareri tbody tr:hover { background: #fffaf0; }
.classifica-pareri tr.pochi { opacity: .6; }
.classifica-pareri .posizione { width: 28px; font-weight: 800; color: var(--testo-tenue); }
.classifica-pareri .chi { display: table-cell; }
.classifica-pareri .chi b { display: block; }
.classifica-pareri .chi small { display: block; font-size: 12px; color: var(--testo-tenue); }
.classifica-pareri .crescere { color: var(--oro-scuro); font-weight: 700; }
.classifica-pareri .voti { width: 54px; text-align: center; }
.classifica-pareri .voti b { display: block; font-size: 17px; }
.classifica-pareri .voti small { font-size: 11px; color: var(--testo-tenue); }
.classifica-pareri .voti.tristi b { color: var(--mattone); }
.classifica-pareri .punteggio { display: inline-block; min-width: 44px; padding: 4px 8px; border-radius: 10px; background: var(--nero); color: var(--oro-chiaro); font-size: 18px; font-weight: 800; text-align: center; }
.cerca-pareri { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 10px; }
.cerca-pareri input { flex: 2 1 260px; }
.cerca-pareri select { flex: 1 1 160px; }
.parere-riga .chi-parere { color: var(--oro-scuro); font-weight: 600; }
@media (max-width: 600px) {
  .riquadro-pareri { padding: 10px; }
  .classifica-pareri th, .classifica-pareri td { padding: 6px 4px; }
  .classifica-pareri .voti { width: 38px; }
  .classifica-pareri .voti b { font-size: 15px; }
  .classifica-pareri .punteggio { min-width: 36px; font-size: 15px; padding: 3px 6px; }
  .classifica-pareri .chi small.parziali { display: none; }
  .parere-riga .faccine-date { font-size: 19px; }
}
.operatore .io { color: inherit; text-decoration: none; }
@media (max-width: 600px) { .operatore .io { display: none; } }

/* Più semplice del biglietto (regola di Luca, 28/10): la voce in evidenza; il contatore solo vicino al limite. */
.detta { align-self: flex-start; justify-self: start; margin: 0 0 4px; padding: 4px 10px; border-radius: 99px; border: 1px solid var(--oro-chiaro); background: #fffaf0; color: var(--oro-scuro); font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
.detta.ascolta { background: var(--mattone); border-color: var(--mattone); color: #fff; animation: ascolta 1.2s ease-in-out infinite; }
@keyframes ascolta { 50% { opacity: .7; } }
.note-rapide { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0; }
.note-rapide button { padding: 7px 12px; border-radius: 99px; border: 1.5px solid var(--avorio-3); background: #fff; font: inherit; font-size: 14px; cursor: pointer; }
.note-rapide button.scelta { border-color: var(--oro); background: #fffaf0; font-weight: 700; }
.contatore { display: block; margin-top: 2px; font-size: 12px; color: var(--testo-tenue); text-align: right; }
.contatore.vicino { color: var(--mattone); font-weight: 700; }

/* Chiusura LAD (regola di Luca, 28/10): dato interno, separato dai conti. */
.lad-chiusura { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 10px 0; padding: 10px 12px; border-radius: 12px; background: #f7f8fb; border: 1px dashed var(--avorio-3); }
.lad-chiusura > span:first-child { flex: 1 1 260px; }
.lad-chiusura small { color: var(--testo-tenue); }
.lad-chiusura .campo { width: 120px; }
.voce-lad { border-top: 1px dashed var(--avorio-3); padding-top: 10px; }
.lad-vivo { margin: -4px 0 6px; font-weight: 700; color: var(--testo-tenue); }

/* L'incassato diviso per lavoro (regola di Luca, 28/10). */
.per-lavoro { margin-top: 12px; overflow-x: auto; }
.tabella-lavoro th { font-size: 12px; text-transform: uppercase; letter-spacing: .5px; color: var(--testo-tenue); text-align: right; padding: 4px 6px; }
.tabella-lavoro td + td { text-align: right; white-space: nowrap; }
.tabella-lavoro tr.totale td { border-top: 1.5px solid var(--avorio-3); font-weight: 700; }
.per-lavorazione { margin: 8px 0 12px; }
.per-lavorazione summary { cursor: pointer; color: var(--oro-scuro); font-weight: 700; }

/* «‹ Indietro» nella barra (richiesta di Luca, 28/10): grande abbastanza per il dito, sempre allo stesso posto. */
.barra .indietro { flex: none; min-height: 40px; display: inline-flex; align-items: center; padding: 6px 14px; margin-left: 4px; border-radius: 99px; border: 1.5px solid var(--oro-scuro); color: var(--oro-chiaro); font-weight: 700; font-size: 15px; text-decoration: none; white-space: nowrap; }
.barra .indietro:active { background: #2a2620; }
@media (max-width: 560px) { .barra .marchio small { display: none; } .barra .indietro { padding: 6px 10px; } }

/* Il foglio (regola di Luca, 28/10: meno passaggi): la scheda si apre sopra la pagina e si chiude tornando lì. */
.foglio { position: fixed; inset: 0; z-index: 100; background: rgba(20, 18, 16, .55); display: flex; align-items: flex-end; justify-content: center; padding: 18px 12px 0; }
.foglio[hidden] { display: none; }
.foglio-carta { width: min(980px, 100%); height: calc(100% - 10px); background: var(--avorio); border-radius: 18px 18px 0 0; display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 -8px 30px rgba(0, 0, 0, .25); }
.foglio-testa { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 14px; background: var(--nero); }
.foglio-intera { color: var(--oro-chiaro); font-weight: 700; text-decoration: none; font-size: 14px; }
.foglio-chiudi { min-height: 44px; padding: 8px 18px; border-radius: 99px; border: 0; background: var(--oro); color: var(--nero); font-weight: 800; font-size: 16px; }
.foglio iframe { flex: 1; width: 100%; border: 0; background: var(--avorio); }
body.con-foglio { overflow: hidden; }
body.nel-foglio .pagina { padding-top: 14px; }
.pronto-scelta .foto-scheda { display: contents; }
.pronto-scelta .apri-scheda { flex: none; padding: 8px 12px; border-radius: 99px; border: 1.5px solid var(--oro); color: var(--oro-scuro); font-weight: 700; font-size: 14px; text-decoration: none; background: #fff; }
.apri-cliente { color: inherit; text-decoration: underline; text-decoration-color: var(--oro); text-underline-offset: 4px; }
.risultato .nome-cliente { color: var(--testo); text-decoration: underline; text-decoration-color: var(--oro); text-underline-offset: 3px; }

/* Chi ha fatto cosa nella scheda dell'articolo (regola di Luca, 28/10). */
.foto-con-nome { margin: 0; display: inline-grid; gap: 3px; vertical-align: top; }
.foto-con-nome figcaption { font-size: 12px; color: var(--testo-tenue); max-width: 150px; line-height: 1.25; }
.chi-lavorazione { display: block; margin-top: 2px; font-size: 13px; color: var(--testo-tenue); }
.chi-lavorazione b { color: var(--testo); }
.registro-articolo summary { cursor: pointer; display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; }
.registro-articolo summary small { color: var(--testo-tenue); }
.registro-articolo .storia-critica { margin: 12px 0 0; }

/* Prodotti di vendita: fornitori e ordini divisi per fornitore (regola di Luca, 28/10). */
.sezioni-prodotti { display: flex; gap: 6px; flex-wrap: wrap; margin: 4px 0 14px; }
.sezioni-prodotti a { padding: 9px 14px; border-radius: 99px; border: 1.5px solid var(--avorio-3); background: #fff; color: var(--testo); text-decoration: none; font-weight: 700; }
.sezioni-prodotti a.attiva { background: var(--nero); border-color: var(--nero); color: var(--oro-chiaro); }
.vai-ordini { display: flex; text-decoration: none; color: var(--testo); box-shadow: inset 4px 0 0 var(--oro); }
.vai-ordini small { display: block; color: var(--testo-tenue); }
.elenco-ordini { display: grid; gap: 8px; margin-bottom: 14px; }
.riga-ordine { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px; background: #fff; border: 1px solid var(--avorio-3); box-shadow: inset 4px 0 0 #e0a030; text-decoration: none; color: var(--testo); }
.riga-ordine span { flex: 1; color: var(--testo-tenue); font-size: 14px; }
.riga-ordine em { font-style: normal; font-weight: 800; color: var(--oro-scuro); }
.riga-ordine.fatto { box-shadow: inset 4px 0 0 var(--avorio-3); }
.ordine-fornitore { margin-bottom: 14px; }
.ordine-fornitore form { display: grid; gap: 8px; }
.testa-ordine h2 { margin: 0; font-family: var(--serif); font-size: 22px; }
.testa-ordine small { color: var(--testo-tenue); }
.riga-da-ordinare { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 12px; border: 1.5px solid var(--avorio-2); background: #fff; cursor: pointer; }
.riga-da-ordinare:has(input[type=checkbox]:checked) { border-color: var(--oro); background: #fffaf0; }
.riga-da-ordinare input[type=checkbox] { width: 22px; height: 22px; flex: none; }
.riga-da-ordinare img, .riga-da-ordinare .mini { width: 44px; height: 44px; flex: none; border-radius: 8px; object-fit: cover; }
.riga-da-ordinare .mini { display: grid; place-items: center; background: var(--avorio); color: var(--testo-tenue); font-size: 11px; }
.riga-da-ordinare .corpo-magazzino { flex: 1; min-width: 0; display: grid; }
.riga-da-ordinare small { color: var(--testo-tenue); }
.riga-da-ordinare b.finito { color: var(--mattone); }
.riga-da-ordinare b.poco { color: #b7791f; }
.pezzi-ordine { width: 64px; text-align: center; padding: 8px 6px; }
.riga-senza-fornitore { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px 12px; border-radius: 12px; background: #fff; border: 1px solid var(--avorio-3); }
.riga-senza-fornitore .corpo-magazzino { flex: 1 1 200px; display: grid; }
.riga-senza-fornitore small { color: var(--testo-tenue); }
.riga-senza-fornitore select, .riga-senza-fornitore input { flex: 1 1 150px; }
.manda-ordine, .arrivo-ordine { margin-bottom: 14px; display: grid; gap: 10px; }
.manda-ordine h2, .arrivo-ordine h2 { margin: 0; font-family: var(--serif); font-size: 21px; }
.testo-ordine { margin: 0; padding: 10px 12px; border-radius: 10px; background: var(--avorio); font-family: var(--sans); font-size: 14px; white-space: pre-wrap; }
.elenco-fornitori { display: grid; gap: 8px; }
.fornitore summary { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; cursor: pointer; }
.fornitore summary span { color: var(--testo-tenue); font-size: 14px; }
.fornitore.spenta { opacity: .6; }
.contatti-fornitore { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0; }
.prodotti-fornitore { display: flex; flex-wrap: wrap; gap: 6px; }
.prodotti-fornitore span { padding: 5px 10px; border-radius: 99px; background: var(--avorio); font-size: 13px; }

/* Servizio online per i privati (regola di Luca, 28/10): i passi del pacco di ritorno, a colpo d'occhio. */
.pacco-online { padding: 12px 14px; background: #fff; border: 1px solid var(--avorio-3); border-radius: 14px; box-shadow: inset 4px 0 0 var(--nero); }
.pacco-online.pronto { border-color: var(--oro); box-shadow: inset 4px 0 0 var(--oro); }
.pacco-online.partito { opacity: .75; }
.testa-pacco { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.testa-pacco .codice { font-weight: 700; }
.testa-pacco small { color: var(--testo-tenue); }
.testa-pacco .stato-art { margin-left: auto; }
.pacco-online .di-chi { margin: 4px 0 0; font-size: 14px; color: var(--testo-tenue); }
.passi-pacco { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 6px; }
.passi-pacco li { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 6px 10px; border-radius: 10px; background: var(--avorio); }
.passi-pacco li > span { flex: none; width: 82px; font-weight: 800; font-size: 14px; }
.passi-pacco li.fatto { background: #eef6ec; }
.passi-pacco li.fatto > span::after { content: ' ✓'; color: #2f7a3a; }
.passi-pacco em { font-style: normal; color: var(--testo-tenue); font-size: 14px; }
.passi-pacco form { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 0; }
.passi-pacco form.affida .campo { flex: 1 1 180px; }

/* Chiusura di cassa (richiesta di Luca, 29/10): un'immagine e un colore per ogni voce, si capisce senza leggere. */
.voce-contanti { --colore-voce: #2f7a3a; --fondo-voce: #e6f3e6; }
.voce-pos { --colore-voce: #1f5fa8; --fondo-voce: #e3edf9; }
.voce-pos-bcc { --colore-voce: #7a3fa0; --fondo-voce: #f1e6f8; }
.voce-lad { --colore-voce: #6b6358; --fondo-voce: #eeeae3; }
.voce-domani { --colore-voce: #a8650f; --fondo-voce: #fdefd2; }
.icona-voce { flex: none; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 12px; background: var(--fondo-voce, var(--avorio)); color: var(--colore-voce, var(--testo)); }
.icona-voce svg { width: 30px; height: 30px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.voce-fondo.con-icona { justify-content: flex-start; border-left: 6px solid var(--colore-voce); }
.voce-fondo.con-icona > span:nth-child(2) { flex: 1; color: var(--colore-voce); font-size: 18px; }
.voce-fondo.con-icona.voce-lad { border-top: 1.5px dashed var(--avorio-3); padding-top: 10px; background: #faf8f4; }
.da-far-tornare { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 10px 0; }
.cifra-cassa { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px; background: var(--fondo-voce); border: 2px solid var(--colore-voce); }
.cifra-cassa > span { display: grid; }
.cifra-cassa small { color: var(--testo-tenue); font-size: 13px; }
.cifra-cassa b { font-family: var(--serif); font-size: 28px; color: var(--colore-voce); line-height: 1.1; }
.come-si-arriva summary { cursor: pointer; font-weight: 700; color: var(--testo-tenue); }
.come-si-arriva[open] summary { margin-bottom: 8px; }
.controllo-vivo { display: flex; flex-wrap: wrap; gap: 8px; }
.controllo-vivo span { padding: 8px 12px; border-radius: 10px; }
.controllo-vivo span.si { background: #e3f1e6; color: #1f5f33; }
.controllo-vivo span.no { background: #fff3ef; color: var(--mattone); border: 2px solid var(--mattone); }
.controllo-vivo.torna, .controllo-vivo.non-torna { background: none; border: 0; padding: 0; }
@media (max-width: 560px) { .da-far-tornare { grid-template-columns: 1fr; } .cifra-cassa b { font-size: 24px; } }

/* Cassa del giorno: quanto è entrato per tipo di lavoro, scarpe, borse e altro (regola di Luca, 28-29/10). */
.tessere-lavoro { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 8px; }
.tessera-lavoro { display: grid; gap: 4px; padding: 12px 14px; border-radius: 12px; background: #fff; border: 1.5px solid var(--avorio-3); box-shadow: inset 4px 0 0 var(--oro); }
.tessera-lavoro .nome-lavoro { font-weight: 800; font-size: 15px; }
.tessera-lavoro b { font-family: var(--serif); font-size: 26px; line-height: 1.1; }
.tessera-lavoro.prodotti { box-shadow: inset 4px 0 0 var(--avorio-3); }
.divisione, .totali-colonne { display: flex; flex-wrap: wrap; gap: 6px; }
.divisione span, .totali-colonne span { padding: 3px 9px; border-radius: 99px; font-size: 13px; font-weight: 700; }
.totali-colonne { margin: 10px 0 0; }
.col-scarpe { background: #e3edf9; color: #1f5fa8; }
.col-borse { background: #f1e6f8; color: #7a3fa0; }
.col-altro { background: #eeeae3; color: #6b6358; }

/* Clienti della Direzione: le faccine e le critiche di ognuno (richiesta di Luca, 29/10). */
.voce-cliente { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding-top: 6px; border-top: 1px dashed var(--avorio-2); font-size: 14px; }
.voce-cliente .faccina { padding: 2px 9px; border-radius: 99px; background: var(--avorio); font-weight: 700; }
.voce-cliente .parole { color: var(--testo-tenue); font-style: italic; }
.voce-cliente .parole.triste { color: var(--mattone); }
/* Spedizioni: dentro le sezioni, i gruppi per come viaggiano e per boutique (richiesta di Luca, 29/10). */
.sottogruppo { display: flex; align-items: center; gap: 6px; margin: 6px 2px 0; font-weight: 800; font-size: 14px; }
.sottogruppo small { color: var(--testo-tenue); font-weight: 600; }
.sottogruppo b { margin-left: auto; min-width: 24px; padding: 1px 8px; border-radius: 99px; background: var(--avorio-2); text-align: center; font-size: 13px; }

/* L'anteprima del messaggio che riceve il cliente (nuova data, richiesta di Luca, 29/10). */
.anteprima-messaggio { padding: 12px 14px; border-radius: 14px; background: #e7f3e6; font-size: 15px; line-height: 1.45; max-width: 520px; }

/* Una guida piccola, a richiesta (richiesta di Luca, 29/10). */
.guida-breve { margin-left: auto; }
.guida-breve summary { cursor: pointer; font-weight: 700; font-size: 14px; color: var(--oro-scuro); text-decoration: underline; list-style: none; }
.guida-breve summary::-webkit-details-marker { display: none; }
.guida-breve p { margin: 8px 0 0; max-width: 560px; padding: 10px 12px; border-radius: 10px; background: var(--avorio); font-size: 14px; color: var(--testo-tenue); }

/* La conversazione della critica con Giacomo (richiesta di Luca, 29/10). */
.conversazione-critica h2 { margin: 0 0 8px; font-family: var(--serif); font-size: 20px; }
.chat-critica { display: grid; gap: 6px; max-height: 420px; overflow-y: auto; padding: 4px; }
.battuta { max-width: 82%; padding: 8px 12px; border-radius: 14px; }
.battuta p { margin: 2px 0 0; font-size: 15px; }
.battuta small { color: var(--testo-tenue); font-size: 12px; }
.battuta.cliente { justify-self: start; background: #fff; border: 1px solid var(--avorio-3); }
.battuta.giacomo { justify-self: end; background: #e7f3e6; }
.battuta .allegati { color: var(--testo-tenue); font-size: 13px; }

/* Critica riconsegnata: come ce lo fa sapere il cliente (domanda di Luca, 29/10). */
.come-conferma { margin: 10px 0; padding: 10px 12px; border-radius: 12px; background: #fdf0d0; display: grid; gap: 8px; }
.come-conferma p { margin: 0; }
.come-conferma form { margin: 0; }
.riapri-critica { margin-top: 10px; }
.riapri-critica > summary { list-style: none; display: inline-block; cursor: pointer; }
.riapri-critica > summary::-webkit-details-marker { display: none; }
.riapri-critica[open] > summary { margin-bottom: 8px; }

/* Buongiorno del reparto (richiesta di Luca, 29/10): giorni tutti uguali, quello scelto in oro con «✓ scelto». */
.carte-giorni { display: flex; gap: 8px; overflow-x: auto; padding: 2px 2px 4px; scrollbar-width: none; }
.carte-giorni::-webkit-scrollbar { display: none; }
.carta-giorno { flex: none; position: relative; display: grid; grid-template-rows: auto auto 1fr auto; justify-items: center; gap: 2px; width: 128px; min-height: 132px; padding: 10px 8px; border-radius: 14px; border: 2px solid var(--avorio-3); background: #fff; text-align: center; cursor: pointer; }
.carta-giorno input { position: absolute; opacity: 0; pointer-events: none; }
.carta-giorno .giorno-nome { font-size: 16px; font-weight: 700; text-transform: capitalize; }
.carta-giorno .giorno-data { font-family: var(--serif); font-size: 26px; line-height: 1.1; }
.carta-giorno .giorno-lavori-gia { align-self: start; font-size: 13px; line-height: 1.35; color: var(--testo-tenue); }
.carta-giorno .giorno-lavori-gia .materiale-giorno { display: block; margin: 0; white-space: normal; }
.carta-giorno .giorno-scelto { visibility: hidden; padding: 2px 10px; border-radius: 99px; background: var(--oro); color: var(--nero); font-size: 13px; font-weight: 800; }
.carta-giorno:has(input:checked) { border-color: var(--oro); background: #fff7e0; box-shadow: 0 0 0 2px var(--oro); }
.carta-giorno:has(input:checked) .giorno-scelto { visibility: visible; }
.giorni-accettazione .da-scegliere { padding: 2px 10px; border-radius: 99px; background: var(--mattone); color: #fff; font-size: 13px; font-weight: 700; }
.domanda-sera.mattina { width: min(720px, calc(100% - 32px)); }
.voce-cliente .critiche-cliente { padding: 2px 9px; border-radius: 99px; background: #fff3ef; color: var(--mattone); font-weight: 700; }

/* Fermi in reparto (regola di Luca, 29/10): la finestra al banco e la risposta al reparto, rimandabili ma che tornano. */
.fermo-finestra { width: min(560px, calc(100% - 32px)); max-height: calc(100vh - 32px); overflow-y: auto; }
.fermo-finestra.deciso { border-top-color: #3f7d4e; }
.fermi-elenco { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 8px; }
.fermi-elenco li { display: grid; gap: 4px; padding: 10px 12px; border-radius: 12px; background: #fff; border: 1.5px solid var(--avorio-3); }
.fermi-elenco li.altro { border-color: var(--mattone-chiaro); }
.fermi-elenco .fermo-chi { font-size: 14px; color: var(--testo-tenue); }
.fermi-elenco .fermo-chi b { color: var(--testo); }
.fermi-elenco .fermo-cosa { font-size: 16px; }
.fermi-elenco .fermo-decisione { font-weight: 800; font-size: 17px; color: #2f6b3d; }
.fermi-elenco li.altro .fermo-decisione { color: var(--mattone); }
.fermi-elenco q { font-style: italic; color: var(--testo); }
.fermi-elenco .bottone, .fermi-elenco form { margin: 4px 0 0; }
.fermi-altri { font-size: 14px; color: var(--testo-tenue); }
/* La pagina del fermo: le tre strade come tessere, una aperta alla volta. */
.fermo-problema { padding: 12px 14px; border-radius: 12px; background: #fff; border: 1.5px solid var(--avorio-3); box-shadow: inset 4px 0 0 var(--mattone); }
.fermo-problema q { display: block; margin: 6px 0 0; font-size: 18px; font-style: italic; }
.strade-fermo { display: grid; gap: 10px; }
.strada-fermo { border-radius: 14px; border: 2px solid var(--avorio-3); background: #fff; }
.strada-fermo > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 10px; padding: 14px 16px; font-size: 18px; font-weight: 800; }
.strada-fermo > summary::-webkit-details-marker { display: none; }
.strada-fermo > summary small { display: block; font-size: 13px; font-weight: 600; color: var(--testo-tenue); }
.strada-fermo > summary .icona-strada { font-size: 26px; }
.strada-fermo[open] { border-color: var(--oro); box-shadow: 0 0 0 2px var(--oro); }
.strada-fermo form { display: grid; gap: 10px; padding: 0 16px 16px; }
.strada-fermo label { display: grid; gap: 4px; font-weight: 700; }
.strada-fermo textarea { min-height: 84px; }
.scelte-decisione { display: flex; flex-wrap: wrap; gap: 8px; }
.scelte-decisione label { display: flex; align-items: center; gap: 6px; padding: 8px 12px; border-radius: 99px; border: 1.5px solid var(--avorio-3); font-weight: 700; cursor: pointer; }
.scelte-decisione label:has(input:checked) { border-color: var(--oro); background: #fff7e0; }
.fermo-in-attesa { padding: 10px 12px; border-radius: 12px; background: #fdf0d0; }/* Il fermo sulla scheda del reparto: a che punto è la decisione del banco. */
.fermo-scheda { display: grid; gap: 4px; padding: 10px 12px; border-radius: 12px; background: #fdf0d0; }
.fermo-scheda.procedi, .fermo-scheda.nuova_data { background: #e7f3e6; }
.fermo-scheda.altro { background: var(--mattone-chiaro); }
.fermo-scheda small { color: var(--testo-tenue); font-size: 13px; }
.fermo-scheda q { font-style: italic; }
.fermo-scheda form { margin: 4px 0 0; }/* «Cosa si fa» del fermo, con parole chiare (richiesta di Luca, 29/10): tre scelte una sotto l'altra; toccata la nuova
   data, i giorni del calendario compaiono subito sotto. */
.scelte-decisione { display: grid; gap: 8px; }
.scelte-decisione label { align-items: flex-start; border-radius: 12px; padding: 10px 12px; background: #fff; }
.scelte-decisione label input { margin-top: 4px; }
.scelte-decisione label span { display: grid; gap: 2px; }
.scelte-decisione label small { font-weight: 500; font-size: 13px; color: var(--testo-tenue); }
.scelte-decisione label.blocca:has(input:checked) { border-color: var(--mattone); background: var(--mattone-chiaro); }
.giorni-fermo { display: none; gap: 6px; padding: 10px 12px; border-radius: 12px; background: #fff7e0; }
form:has(input[name="decisione"][value="nuova_data"]:checked) .giorni-fermo { display: grid; }
.giorno-completo { display: inline-flex; align-items: center; gap: 6px; padding: 9px 12px; border-radius: 99px; border: 1.5px dashed var(--avorio-3); color: var(--testo-tenue); font-weight: 600; }
.giorno-completo small { font-size: 12px; }.strada-fermo .giorni-critica label { display: inline-flex; font-weight: 700; }
/* «Apri la scheda completa» si vede bene (Luca, 29/10: non l'aveva notato): un tasto, non una scritta piccola. */
.apri-scheda { display: inline-flex; align-items: center; justify-self: start; width: fit-content; margin-top: 4px; padding: 6px 12px; border-radius: 99px; border: 1.5px solid var(--oro); background: #fff7e0; color: var(--oro-scuro); font-size: 14px; font-weight: 800; }
.scheda-lavoro.in-dettaglio .apri-scheda { padding: 9px 16px; font-size: 15px; background: var(--oro); border-color: var(--oro); color: var(--nero); }
.foglio-intera { padding: 7px 14px; border-radius: 99px; background: var(--oro); color: var(--nero); font-weight: 800; }/* Etichette man mano durante l'accettazione (regola di Luca, 29/10, «fondamentale»). */
.etichetta-subito { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin: 0 0 12px; padding: 12px 14px; border-radius: 14px; background: #fff7e0; border: 2px solid var(--oro); }
.etichetta-subito span { display: grid; gap: 2px; font-size: 17px; }
.etichetta-subito small { font-size: 13px; color: var(--testo-tenue); }
.etichetta-subito .bottone { padding: 12px 18px; font-size: 17px; }
.etichetta-subito.fatta { background: #e7f3e6; border-color: #9cc59f; }
.et-stampa { position: relative; z-index: 2; display: inline-block; padding: 3px 9px; border-radius: 99px; background: var(--oro); color: var(--nero); font-size: 12px; font-weight: 800; text-decoration: none; }
.et-ok { position: relative; z-index: 2; font-size: 12px; font-weight: 700; color: #2f6b3d; }
.et-mancano { color: var(--oro-scuro); font-weight: 800; }
.et-tutte { display: block; margin-top: 10px; padding: 10px 12px; border-radius: 12px; background: #fff7e0; border: 1.5px solid var(--oro); color: var(--testo); font-weight: 800; text-align: center; text-decoration: none; }
.etichette-mancanti { display: grid; gap: 10px; max-width: 520px; margin: 16px auto; padding: 14px 16px; border-radius: 14px; background: #fff7e0; border: 2px solid var(--oro); text-align: center; font-size: 17px; }
.fatto .codice.senza-etichetta { outline: 2px dashed var(--oro); }
.bottone.disattivo { opacity: .55; cursor: not-allowed; }/* Le tessere della cassa si aprono con un tocco: quanti di ogni lavorazione, quali prodotti (Luca, 29/10). */
details.tessera-lavoro { display: block; align-self: start; }
details.tessera-lavoro > summary { display: grid; gap: 4px; list-style: none; cursor: pointer; }
details.tessera-lavoro > summary::-webkit-details-marker { display: none; }
details.tessera-lavoro[open] { grid-column: 1 / -1; box-shadow: inset 4px 0 0 var(--oro), 0 0 0 2px var(--oro); }
.apri-tessera { font-size: 12px; font-weight: 700; color: var(--oro-scuro); }
details.tessera-lavoro[open] .apri-tessera { display: none; }
.voci-tessera { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 2px; columns: 2 260px; column-gap: 24px; }
.voci-tessera li { display: flex; justify-content: space-between; gap: 10px; padding: 5px 0; border-bottom: 1px dashed var(--avorio-3); font-size: 15px; break-inside: avoid; }
.voci-tessera li b { font-family: var(--serif); font-size: 18px; }
.voci-tessera small { color: var(--testo-tenue); }.voci-tessera { display: block; }
/* Report dei prodotti in vendita (richiesta di Luca, 29/10). */
.tessere-prodotti { margin: 0 0 14px; }
.tessere-prodotti .nome-prodotto { font-size: 20px; line-height: 1.2; }
.tessere-prodotti .tessera-lavoro small { color: var(--testo-tenue); font-size: 13px; }
.tessere-prodotti .piu { box-shadow: inset 4px 0 0 #3f7d4e; }
.tessere-prodotti .meno { box-shadow: inset 4px 0 0 var(--oro-chiaro); }
.tessere-prodotti .fermi { box-shadow: inset 4px 0 0 var(--avorio-3); }
.griglia-prodotti { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 14px; }
.classifica { margin: 0; padding: 0 0 0 20px; display: grid; gap: 2px; }
ul.classifica { list-style: none; padding: 0; }
.classifica li { display: flex; justify-content: space-between; gap: 10px; padding: 6px 0; border-bottom: 1px dashed var(--avorio-3); font-size: 15px; }
.classifica li b { font-family: var(--serif); font-size: 18px; }/* Revisione della notte (29/10): sull'iPad la ricerca, cuore del banco, ha una riga tutta sua; i due tasti sotto. */
.cerca-cliente .campo { flex: 1 1 auto; min-width: 0; }
@media (max-width: 1100px) {
  .cerca-cliente { flex-wrap: wrap; }
  .cerca-cliente .campo { flex: 1 0 100%; }
  .cerca-cliente .nuovo-cliente { flex: 1 1 0; min-height: 54px; }
}/* L'esito di ogni azione sempre visibile, sopra le schede aperte (revisione della notte): sparisce da solo o con un tocco. */
.messaggi { position: fixed; z-index: 80; left: 50%; top: calc(var(--testata, 64px) + 8px); transform: translateX(-50%); width: min(620px, calc(100% - 24px)); max-width: none; margin: 0; padding: 0; cursor: pointer; transition: opacity .35s, transform .35s; }
.messaggi .messaggio { box-shadow: 0 10px 28px rgba(0, 0, 0, .18); font-size: 16px; }
.messaggi.via { opacity: 0; transform: translate(-50%, -10px); pointer-events: none; }
/* Le conferme: una pillola piccola in basso, che non copre niente e lascia passare i tocchi (richiesta di Luca, 29/10). */
.messaggi.lieve { top: auto; bottom: calc(16px + env(safe-area-inset-bottom)); width: auto; max-width: min(560px, calc(100% - 24px)); pointer-events: none; }
.messaggi.lieve .messaggio { margin: 0; padding: 7px 14px; border-radius: 99px; background: rgba(30, 26, 22, .9); color: #f3ead8; font-size: 13px; font-weight: 600; line-height: 1.3; box-shadow: 0 6px 18px rgba(0, 0, 0, .22); }
.messaggi.lieve.via { transform: translate(-50%, 10px); }
/* «C'è un problema»: un tasto vero, non una scritta piccola. */
.problema.c-e-un-problema > summary { display: block; padding: 12px 14px; min-height: 48px; border-radius: 12px; border: 1.5px solid var(--mattone-chiaro); background: #fff; font-size: 16px; font-weight: 800; text-align: center; }
.spunta-lavorazione small { white-space: normal; }/* Regola d'oro 5 (revisione della notte): la scelta fatta in oro con ✓, mai il nero, che sembra «pieno». */
.cat.scelta, .voce.scelta, .finitura.sel, .metodo.sel, .motivo-sconto.sel, .sconto.sel { background: #fff7e0; border-color: var(--oro); color: var(--nero); box-shadow: 0 0 0 2px var(--oro); }
.cat.scelta svg { stroke: var(--oro-scuro); }
.voce.scelta small, .sconto.sel span { color: var(--oro-scuro); }
.finitura.sel::after, .metodo.sel::after, .motivo-sconto.sel::after, .sconto.sel::after { content: ' ✓'; font-weight: 800; color: var(--oro-scuro); }
.cat.scelta { position: relative; }
.cat.scelta::before { content: '✓'; position: absolute; top: 6px; right: 8px; font-weight: 900; color: var(--oro-scuro); }
.voce.scelta { position: relative; }
.voce.scelta::before { content: '✓'; position: absolute; top: 4px; right: 7px; font-size: 13px; font-weight: 900; color: var(--oro-scuro); }
.categorie.chiuse .cat.scelta::after { color: var(--oro-scuro); }
.spunta input, .ruoli-reparto input { accent-color: var(--oro-scuro); }
/* Tasti della lista degli articoli dell'accettazione: grandi abbastanza per il dito, «Togli» non in rosso. */
.et-stampa, .et-ok { display: inline-flex; align-items: center; gap: 4px; min-height: 36px; padding: 6px 12px; border-radius: 99px; text-decoration: none; }
.et-ok { border: 1.5px solid #9cc59f; background: #e7f3e6; }
.et-ok small { font-size: 11px; font-weight: 700; color: var(--testo-tenue); }
.art .prezzo form button { min-height: 36px; padding: 6px 10px; color: var(--testo-tenue); }
.etichetta-subito { max-width: 1180px; margin: 12px auto; }
.etichetta-subito small a { color: inherit; font-weight: 700; }
.bottone small { display: block; font-size: 12px; font-weight: 600; opacity: .8; }.categorie.chiuse .cat.scelta::before { content: none; }
.categorie.chiuse .cat.scelta::after { content: '✓ cambia ›'; }
/* Pagine d'errore (revisione della notte): sempre il motivo e la strada per tornare. */
.pagina-errore { display: grid; place-items: center; min-height: 80vh; }
.errore-riquadro { max-width: 520px; padding: 28px; border-radius: 18px; background: #fff; box-shadow: 0 10px 30px rgba(0,0,0,.08); text-align: center; }
.icona-errore { font-size: 44px; margin: 0; }
.azioni-errore { display: grid; gap: 10px; margin-top: 18px; }/* Le buone notizie (concluse, partiti) mai in rosso: il rosso è solo per l'urgenza (revisione della notte). */
.giorno-lavori.fatto { background: #e7f3e6; color: #2f6b3d; }
.giorno-lavori.fatto small { background: #fff; color: #2f6b3d; }/* Reparto (revisione della notte): i fermi in scuro (il rosso è per l'urgenza), un giorno pieno «Completo» in oro;
   sul telefono tasti da 44 px e menu a 16 px (iOS non ingrandisce la pagina). */
.contatori-reparto span.fermi { background: var(--nero); color: var(--oro-chiaro); border-color: var(--nero); }
.contatori-reparto span.fermi b { color: #fff; }
.filtri-lavori button, .naviga-settimana a, #chiudi-pannello { min-height: 44px; }
#chiudi-pannello { min-width: 44px; }
@media (max-width: 700px) {
  .pagina-reparto select, .scegli-mese select, .ordine-lavori select { font-size: 16px; }
}.giorno-calendario em.pieno, .giorno-linea.pieno { background: var(--oro); color: var(--nero); }
.giorno-linea.pieno small { color: var(--nero); }
.giorni-borse .pieno em, .riga-posti label.pieno em { color: var(--oro-scuro); }.verifica-subito { align-self: start; display: inline-block; margin-top: 4px; padding: 6px 12px; border-radius: 99px; background: var(--oro); color: var(--nero); font-weight: 800; font-size: 14px; text-decoration: none; }
/* Ritiro (revisione della notte, regola d'oro 12): i tasti scritti grandi abbastanza per il dito; l'area di tocco si
   allarga senza spostare niente. */
button.senza-codice { min-height: 44px; padding: 0 8px; }
.pronto-scelta .problema-qui { padding: 12px 8px; margin: -12px -8px; }
.ha-una-critica { padding: 12px 0; margin: -2px 0 -12px; }
.vendita-in-cassa > summary { padding: 12px 0; }
.guida-breve summary, .per-lavorazione > summary { padding: 12px 0; margin: -12px 0; }
.verifica-subito { min-height: 40px; display: inline-flex; align-items: center; }
/* «🎤 Detta» e l'interruttore «Urgente»: anche loro grandi abbastanza per il dito. */
.detta { min-height: 38px; padding: 6px 14px; font-size: 14px; }
.interruttore { min-height: 44px; }
@media (max-width: 900px) {
  .elenco-articoli > summary.etichetta { display: flex; align-items: center; min-height: 44px; }
}
.sconto-omaggio > summary { padding-top: 12px; padding-bottom: 12px; }
.problema > summary { min-height: 44px; padding: 12px 6px; }
p.contatti a, p.indietro a { padding: 12px 0; }
.guida-breve[open] summary { margin-bottom: 0; }
/* Ordini dei prodotti (regola di Luca, 29/10): chi chiede, per quale reparto; «Cosa ti serve?» semplice come un biglietto. */
.chiesto-da { display: block; margin-top: 3px; color: var(--oro-scuro); font-weight: 600; }
.cerca-richiesta { width: 100%; margin: 4px 0 12px; font-size: 17px; }
.gruppo-richieste { margin-bottom: 12px; }
.riga-richiesta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px dashed var(--avorio-3); }
.riga-richiesta:last-child { border-bottom: 0; }
.nome-richiesta { flex: 1 1 200px; font-size: 16px; }
.nome-richiesta small { display: block; color: var(--oro-scuro); font-weight: 700; font-size: 13px; }
.quanti-richiesta { display: flex; align-items: center; gap: 6px; }
.quanti-richiesta button { width: 44px; height: 44px; border-radius: 10px; border: 1.5px solid var(--avorio-3); background: #fff; font-size: 22px; font-weight: 800; }
.quanti-richiesta .campo { width: 64px; text-align: center; font-size: 18px; font-weight: 800; }
.riga-richiesta .bottone { min-height: 44px; }
.stato-richiesta.aperta { color: var(--oro-scuro); font-weight: 700; }
.stato-richiesta.arrivata { color: #1f5f33; font-weight: 700; }
.manda-ordine.mancano { box-shadow: inset 4px 0 0 var(--mattone); }
.uso-prodotto { border: 1px solid var(--avorio-3); border-radius: 12px; padding: 8px 12px; display: grid; gap: 6px; }
.reparti-uso { display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: center; }
.ordini-per-reparto { display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: center; margin: -2px 0 6px 28px; }
.ordini-per-reparto small { flex: 1 1 100%; color: var(--testo-tenue); }
/* I reparti si scelgono solo per chi chiede i prodotti: senza la spunta non si vedono. */
.permesso-ordini:not(:has(input[name=ordini_prodotti]:checked)) .ordini-per-reparto { display: none; }
.voce-report { color: inherit; text-decoration: none; display: inline-block; padding: 8px 0; margin: -8px 0; }
.voce-report b { text-decoration: underline; text-decoration-color: var(--oro); }
/* Il gradimento dei clienti sul reparto (richiesta di Luca, 29/10): piccolo, motivante, a colpo d'occhio. */
.pagina-reparto .testa-reparto .contatori-reparto { flex: 1 1 100%; }
.gradimento-reparto { flex: 1 1 100%; display: flex; align-items: center; gap: 12px; margin-top: 10px; padding: 10px 14px; border-radius: 14px; background: #fff; border: 1.5px solid var(--avorio-3); color: inherit; text-decoration: none; box-shadow: inset 4px 0 0 var(--oro); }
.gradimento-reparto .faccina-reparto { font-size: 34px; line-height: 1; }
.gradimento-reparto b { display: block; font-size: 15px; }
.gradimento-reparto small { display: block; color: var(--testo-tenue); font-size: 13px; margin-top: 2px; }
/* I reparti dell'articolo a parole, grandi; il fermo con il problema e a chi chiedere (richiesta di Luca, 29/10). */
.tappe { gap: 6px; margin-top: 4px; }
.tappa { font-size: 14px; padding: 4px 10px; }
.tappa small { font-size: 13px; font-weight: 700; }
.tappa::before, .tappa.in_corso::before, .tappa.completata::before, .tappa.sospesa::before { content: none; }
.tappa.sospesa { font-weight: 800; }
.fermo-riga { display: grid; gap: 2px; margin-top: 6px; padding: 8px 10px; border-radius: 10px; background: var(--mattone-chiaro); color: var(--mattone); font-size: 14px; line-height: 1.35; }
.fermo-riga span { color: var(--testo); font-size: 14px; }
/* Il proprio nome apre la tendina: i miei risultati e il passaggio a un altro reparto (richiesta di Luca, 29/10). */
.menu-persona { position: relative; }
.menu-persona > summary { list-style: none; cursor: pointer; min-height: 44px; display: flex; flex-direction: column; justify-content: center; }
.menu-persona > summary::-webkit-details-marker { display: none; }
.menu-persona > summary small { color: var(--oro-chiaro); font-weight: 700; }
.tendina-persona { position: absolute; right: 0; top: calc(100% + 10px); z-index: 120; min-width: 270px; padding: 8px; border-radius: 14px; background: #fff; box-shadow: 0 14px 36px rgba(0, 0, 0, .28); display: grid; gap: 4px; }
.tendina-persona a, .operatore .tendina-persona form button { display: flex; align-items: center; gap: 6px; width: 100%; min-height: 48px; padding: 0 14px; border-radius: 10px; border: 0; background: var(--avorio); color: var(--nero); font: inherit; font-size: 16px; font-weight: 600; text-decoration: none; text-align: left; }
.tendina-persona a:active, .operatore .tendina-persona form button:active { background: #fff7e0; }
@media (max-width: 600px) {
  .operatore .menu-persona > summary.io { display: flex; font-size: 0; }
  .operatore .menu-persona > summary.io small { font-size: 11px; }
}
/* Le pagine dei lavori del reparto (richiesta di Luca, 29/10): quanti per pagina e si sfoglia. */
.pagine-lavori { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--avorio-3); }
.pagine-lavori label { display: flex; align-items: center; gap: 8px; font-weight: 700; color: var(--testo-tenue); }
.pagine-lavori select { min-height: 44px; padding: 0 10px; border-radius: 10px; border: 1.5px solid var(--avorio-3); background: #fff; font: inherit; font-size: 16px; font-weight: 700; }
.pagine-lavori .sfoglia { display: flex; align-items: center; gap: 10px; }
.pagine-lavori .sfoglia .bottone { min-height: 44px; padding: 0 16px; }
.pagine-lavori .sfoglia .bottone:disabled { opacity: .4; }
#pagina-numero { font-weight: 700; color: var(--testo-tenue); }
/* Cassa · un tipo di lavoro (richiesta di Luca, 29/10): solo quel reparto, in ordine, articolo per articolo. */
a.tessera-lavoro { color: inherit; text-decoration: none; }
a.tessera-lavoro:active { box-shadow: inset 4px 0 0 var(--oro), 0 0 0 2px var(--oro); }
.cassa-lavoro .griglia-scheda { margin-top: 14px; }
.cassa-lavoro .conto .divisione { margin: 8px 0 0; }
.righe-cassa-lavoro { display: grid; gap: 8px; }
.riga-cassa-lavoro { display: flex; gap: 12px; align-items: flex-start; padding: 10px 12px; border-radius: 12px; background: #fff; border: 1px solid var(--avorio-3); }
.riga-cassa-lavoro .ora { flex: 0 0 52px; font-weight: 800; font-size: 14px; color: var(--testo-tenue); padding-top: 3px; }
.riga-cassa-lavoro .dati-riga { flex: 1; display: grid; gap: 3px; min-width: 0; }
.riga-cassa-lavoro .dati-riga a { color: inherit; text-decoration: none; padding: 8px 0; margin: -8px 0; }
.riga-cassa-lavoro .dati-riga small { color: var(--testo-tenue); font-size: 13px; }
.riga-cassa-lavoro .quota { font-family: var(--serif); font-size: 20px; white-space: nowrap; }
.cliente-cassa { font-weight: 700; text-decoration: underline !important; text-decoration-color: var(--oro) !important; }
.chip-nuovo, .chip-di-casa { display: inline-block; margin-left: 6px; padding: 2px 9px; border-radius: 99px; font-size: 12px; font-style: normal; font-weight: 700; }
.chip-nuovo { background: #fff7e0; color: var(--oro-scuro); box-shadow: inset 0 0 0 1.5px var(--oro); }
.chip-di-casa { background: var(--avorio-2); color: var(--testo-tenue); }
/* «Tocca ancora…» (revisione della notte): il secondo tocco conferma, al posto delle finestre del browser. */
[data-due-tocchi].da-confermare { background: var(--mattone-chiaro) !important; color: var(--mattone) !important; border-color: var(--mattone) !important; font-weight: 800; white-space: normal; }

/* La cesta: l'elenco si apre con un tocco (sul computer è già aperto). */
.lista-cesta > summary { list-style: none; cursor: pointer; margin: 0 0 8px; font-weight: 700; font-size: 14px; color: var(--oro-scuro); }
.lista-cesta > summary::-webkit-details-marker { display: none; }
.lista-cesta[open] > summary { display: none; }

/* Telefono: gli avvisi del reparto puliti e piccoli (richiesta di Luca, 29/10, provando con Emanuele). Le domande
   (buongiorno, giorno pieno, cesta, sera) salgono dal fondo come un foglio basso; i giorni sono pillole piccole. */
@media (max-width: 600px) {
  .domanda-sera, .domanda-sera.mattina { left: 0; right: 0; top: auto; bottom: 0; transform: none; width: 100%; max-height: 82vh;
    overflow-y: auto; padding: 12px 14px calc(12px + env(safe-area-inset-bottom)); border-radius: 16px 16px 0 0; border-top-width: 4px; }
  .domanda-sera h2 { font-size: 19px; margin: 0 0 2px; }
  .domanda-sera p { font-size: 14px; margin: 0 0 8px; line-height: 1.35; }
  .domanda-sera .da-fare-sera { font-size: 13px; }
  .domanda-sera form { margin: 0 0 6px; }
  .domanda-sera .bottone { padding: 10px 12px; font-size: 15px; }
  .domanda-sera .bottone small { display: inline; margin-left: 6px; font-size: 11px; }
  .scelta-giorni fieldset { margin: 0 0 8px; }
  .scelta-giorni legend { margin-bottom: 4px; font-size: 13px; }
  .carte-giorni { gap: 6px; padding: 6px 2px 2px; }
  .carta-giorno { width: auto; min-width: 70px; min-height: 0; padding: 5px 8px; gap: 0; border-radius: 10px; border-width: 1.5px; grid-template-rows: auto auto auto; }
  .carta-giorno .giorno-nome { font-size: 11px; font-weight: 600; }
  .carta-giorno .giorno-data { font-size: 17px; }
  .carta-giorno .giorno-lavori-gia { font-size: 11px; line-height: 1.25; }
  .carta-giorno .giorno-scelto { display: none; }
  .carta-giorno:has(input:checked)::after { content: '✓'; position: absolute; top: -6px; right: -6px; width: 18px; height: 18px; border-radius: 50%;
    background: var(--oro); color: var(--nero); font-size: 11px; font-weight: 800; display: grid; place-items: center; }
  .scelta-giorni .bottone { padding: 10px; font-size: 15px; }
  /* In cima alla pagina: righe sottili, non riquadri. */
  .gradimento-reparto { gap: 8px; margin-top: 6px; padding: 6px 10px; border-radius: 10px; }
  .gradimento-reparto .faccina-reparto { font-size: 22px; }
  .gradimento-reparto b { font-size: 13px; }
  .gradimento-reparto small { font-size: 11px; margin-top: 0; }
  .giorno-linea { padding: 2px 8px; font-size: 12px; }
  .giorni-accettazione .da-scegliere { padding: 1px 8px; font-size: 11px; }
  .giorni-accettazione > summary em { font-size: 12px; }
  .avvisi-reparto .avviso-spedizioni { padding: 8px 10px; gap: 2px 10px; font-size: 13px; }
  .avvisi-reparto .avviso-spedizioni b { font-size: 15px; }
  .avvisi-reparto .avviso-spedizioni i, .avvisi-reparto .avviso-spedizioni em { font-size: 15px; }
  .cesta { padding: 8px 10px; margin-bottom: 8px; border-width: 1.5px; }
  .cesta-testa { margin-bottom: 4px; }
  .cesta-testa b { font-size: 16px; }
  .cesta-testa span { font-size: 12px; }
  .righe-cesta { grid-template-columns: 1fr; gap: 4px; }
  .riga-cesta { padding: 6px 8px; gap: 8px; }
  .posto-cesta { min-width: 54px; font-size: 14px; }
  .cesta .bottone { padding: 10px 12px; font-size: 15px; }
  .cesta-vuota { padding: 6px 10px; font-size: 13px; }
  /* Il messaggio dopo un tocco: una riga piccola, non un cartello. */
  .messaggi .messaggio { padding: 8px 12px; font-size: 14px; border-radius: 10px; }
  /* Le settimane: una striscia di pillole basse che scorre, non quattro riquadri alti. */
  .pagina-reparto .settimane-lavori { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
  .pagina-reparto .settimane-lavori::-webkit-scrollbar { display: none; }
  .pagina-reparto .settimane-lavori button { flex: none; flex-direction: row; align-items: center; gap: 6px; padding: 5px 9px; font-size: 12px; }
  .pagina-reparto .settimane-lavori button span { flex-direction: row; gap: 4px; align-items: baseline; }
  .pagina-reparto .settimane-lavori button small { font-size: 11px; }
  .pagina-reparto .filtri-lavori button { padding: 6px 9px; font-size: 12px; border-width: 1.5px; }
}


/* Richiesta di Luca (29/10): il paio o una scarpa sola, in un tocco; se Giacomo non capisce quale, si chiede. */
.paio-o-una { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 10px; padding: 8px; border-radius: 11px; background: var(--avorio-2); font-size: 13px; }
.paio-o-una b { margin-right: 4px; color: var(--testo); }
.paio-o-una .chip { padding: 9px 12px; border-radius: 9px; background: #fff; color: var(--testo); font-weight: 600; font-size: 14px; border: 1.5px solid var(--avorio-3); cursor: pointer; }
.paio-o-una .chip.sel { background: var(--oro); border-color: var(--oro); }
.paio-o-una.da-scegliere { background: #fdf0d0; box-shadow: inset 0 0 0 2px var(--mattone); }
.paio-o-una.da-scegliere [data-scarpe="destra"], .paio-o-una.da-scegliere [data-scarpe="sinistra"] { border-color: var(--mattone); }
.quale-scarpa { flex-basis: 100%; color: var(--mattone); font-weight: 700; font-size: 13px; }
.una-sola { display: inline-block; padding: 1px 8px; border-radius: 99px; background: var(--nero); color: var(--oro-chiaro); font-style: normal; font-size: 12px; font-weight: 700; white-space: nowrap; }
.una-sola.grande { font-size: 15px; padding: 3px 12px; margin-left: 8px; vertical-align: middle; }
.scarpa-g { font-weight: 700; color: var(--testo); }

/* Richiesta di Luca (29/10): «Urgente» al centro, nel suo riquadro rosso; acceso diventa tutto rosso. */
.sotto-giorni { justify-content: center; flex-wrap: wrap; }
.sotto-giorni .campo { flex-basis: 100%; }
.riquadro-urgente { border: 2px solid var(--mattone); border-radius: 14px; padding: 10px 22px; min-height: 52px; background: #fff5f1; color: var(--mattone); font-size: 17px; font-weight: 800; }
.riquadro-urgente.attivo { background: var(--mattone); color: #fff; box-shadow: 0 4px 14px rgba(158,59,43,.3); }
.riquadro-urgente.attivo i { background: rgba(255,255,255,.4); }

/* Richiesta di Luca (29/10): i due tasti in fondo dicono cosa succede. Salvano e stampano l'etichetta tutti e due,
   poi: un altro articolo dello stesso cliente, oppure era l'ultimo e si va alla cassa. */
.piede .salva-poi { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; line-height: 1.15; text-align: left; }
.piede .salva-poi small { font-size: 12px; font-weight: 600; opacity: .8; letter-spacing: 0; }
@media (max-width: 600px) {
  .piede .salva-poi { flex: 1 1 0; min-width: 0; padding: 7px 10px; font-size: 14px; }
  .piede .salva-poi span { white-space: nowrap; }
  .piede .scuro.salva-poi { margin-left: 0; }
  .piede .salva-poi small { font-size: 11px; }
  .paio-o-una .chip { padding: 8px 10px; font-size: 13px; }
  .riquadro-urgente { font-size: 16px; padding: 8px 20px; }
}

/* Regola di Luca (29/10): al ritiro la verifica la sceglie l'operatore; il cliente che conosce passa con zero tocchi. */
.chi-ritira { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 10px; }
.chi-ritira > b { margin-right: 4px; }
.chi-ritira label { position: relative; cursor: pointer; }
.chi-ritira input { position: absolute; opacity: 0; pointer-events: none; }
.chi-ritira label span { display: inline-block; padding: 10px 14px; border-radius: 99px; border: 1.5px solid var(--avorio-3); background: #fff; font-weight: 600; font-size: 14px; }
.chi-ritira label.sel span { background: var(--nero); border-color: var(--nero); color: var(--oro-chiaro); }
.chi-ritira input:focus-visible + span { outline: 2px solid var(--oro); outline-offset: 2px; }
.verifica-ritiro:not(.per-altra-persona) .del-cliente { display: none; }
.ritirato-da { margin: 10px 0 0; font-size: 14px; color: var(--testo-tenue); }
.ritirato-da b { color: var(--testo); }
@media (max-width: 600px) {
  .chi-ritira label span { padding: 8px 11px; font-size: 13px; }
}

/* Richiesta di Luca (29/10): più articoli in una foto, Giacomo crea le pre-schede. */
.piu-articoli { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin: 0 0 14px; padding: 10px 12px; border: 1.5px dashed var(--oro); border-radius: 14px; background: #fffaf0; }
.piu-articoli > small { color: var(--testo-tenue); font-size: 13px; flex: 1; min-width: 200px; }
.scatta-piu { cursor: pointer; font-size: 15px; padding: 10px 14px; }
.piu-risultato { flex-basis: 100%; }
.piu-schede { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; margin: 8px 0 10px; }
.piu-scheda { position: relative; display: flex; flex-direction: column; gap: 4px; padding: 6px; border-radius: 12px; background: #fff; border: 1.5px solid var(--avorio-3); cursor: pointer; }
.piu-scheda:has(input:checked) { border-color: var(--oro); box-shadow: 0 0 0 2px var(--oro); }
.piu-scheda input { position: absolute; top: 10px; left: 10px; width: 22px; height: 22px; accent-color: var(--oro-scuro); }
.piu-scheda img { width: 100%; height: 110px; object-fit: cover; border-radius: 8px; background: var(--avorio-2); }
.piu-scheda span { display: flex; flex-direction: column; font-size: 14px; line-height: 1.25; }
.piu-scheda small { color: var(--testo-tenue); font-size: 12px; }
.piu-scheda .lavori-g { color: var(--oro-scuro); font-weight: 600; }
.pre-scheda-nota { margin: -4px 0 12px; padding: 8px 12px; border-radius: 10px; background: #fff7e0; font-size: 14px; color: var(--testo); }
@media (max-width: 600px) {
  .piu-schede { grid-template-columns: 1fr 1fr; }
  .piu-scheda img { height: 96px; }
}

/* La foto del dopo (richiesta di Luca, 29/10): facoltativa, più consigliata per lavaggi, borse e spedizioni. */
.foto-dopo { display: flex; align-items: center; gap: 8px; margin: -2px 0 8px 8px; font-size: 13px; color: var(--testo-tenue); }
.foto-dopo label { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border-radius: 99px; border: 1.5px solid var(--avorio-3); background: #fff; color: var(--testo); font-weight: 600; cursor: pointer; }
.foto-dopo.consigliata label { border-color: var(--oro); background: #fffaf0; }
.foto-dopo .consiglio { color: var(--oro-scuro); font-weight: 600; }
.foto-dopo img { width: 38px; height: 38px; object-fit: cover; border-radius: 8px; }
.foto-dopo.fatta label { border-color: #2f7a46; color: #1f5f33; }
.promemoria-foto { margin: 10px 0 8px; padding: 9px 12px; border-radius: 10px; background: #fff7e0; color: var(--testo); font-size: 14px; }
.art .da-completare { color: var(--mattone); }
/* iPad verticale: il fondo della scheda su una riga, senza testi spezzati. */
@media (min-width: 601px) and (max-width: 900px) {
  .piede { gap: 8px; padding: 10px 14px; }
  .piede .somma { font-size: 13px; line-height: 1.1; }
  .piede .somma b { display: block; margin: 0; font-size: 21px; }
  .piede .bottone { padding: 10px 14px; font-size: 15px; }
  .piede .salva-poi span { white-space: nowrap; }
}
/* Accettazione facile: il cliente nuovo si registra qui (richiesta di Luca, 29/10). */
.facile .nuovo-facile { margin: 10px 0 4px; }
.modulo-nuovo-facile { display: flex; flex-direction: column; gap: 12px; }
.modulo-nuovo-facile label { display: flex; flex-direction: column; gap: 4px; font-weight: 600; font-size: 15px; }
.modulo-nuovo-facile .campo { font-size: 18px; padding: 14px; }
.domanda-whatsapp { margin: 4px 0 0; font-weight: 700; font-size: 16px; }
.domanda-whatsapp small { font-weight: 400; color: var(--testo-tenue); font-size: 13px; }
.due-tasti-facili { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.due-tasti-facili .bottone { padding: 16px 10px; font-size: 17px; }
.dopo-facile { color: var(--testo-tenue); font-size: 13px; }
/* Persone: modifiche non salvate, ricordate in basso, mai una finestra che blocca (richiesta di Luca, 29/10). */
.non-salvate { position: sticky; bottom: 12px; z-index: 20; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin-top: 14px; padding: 10px 14px; border-radius: 14px; background: #fff7e0; border: 2px solid var(--oro); box-shadow: 0 6px 18px rgba(0,0,0,.15); font-size: 15px; }
.non-salvate span { flex: 1; min-width: 180px; }
.non-salvate.avvisa { animation: avvisa-non-salvate .5s ease-in-out 3; border-color: var(--mattone); }
@keyframes avvisa-non-salvate { 50% { transform: scale(1.03); } }
/* Segnalare cosa sta finendo e confermare gli ordini: due incarichi distinti (richiesta di Luca, 29/10). */
.permesso-ordini.invia { margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--avorio-3); }
.nota-ordini { display: block; margin: 2px 0 0 30px; color: var(--testo-tenue); font-size: 12px; }
/* Accettazione facile (richiesta di Luca, 29/10): da ogni passo «‹ Torna indietro» e le altre scelte a un tocco;
   in fondo «‹ Torna alla home». Ordinata e spaziata, come una scrivania in ordine. */
.pagina.facile { display: flex; flex-direction: column; gap: 18px; }
.barra-facile { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 16px; background: #fff; border: 1.5px solid var(--avorio-3); }
.indietro-facile { padding: 10px 16px; border-radius: 12px; border: 1.5px solid var(--testo); background: var(--nero); color: var(--oro-chiaro); font: inherit; font-weight: 800; font-size: 15px; cursor: pointer; }
.altre-scelte { display: flex; flex-wrap: wrap; gap: 8px; margin-left: auto; }
.altre-scelte > button, .altre-scelte > a { padding: 9px 13px; border-radius: 99px; border: 1.5px solid var(--avorio-3); background: var(--avorio); color: var(--testo); font: inherit; font-weight: 700; font-size: 14px; text-decoration: none; cursor: pointer; }
.altre-scelte > .sel { background: #fff7e0; border-color: var(--oro); box-shadow: 0 0 0 2px var(--oro); }
.facile .passo-facile { display: flex; flex-direction: column; gap: 12px; }
.facile .passo-facile[hidden] { display: none; }
.facile .titolo-facile { margin: 0; }
.torna-home { align-self: center; margin-top: 10px; padding: 12px 22px; font-size: 16px; }
@media (max-width: 600px) {
  .barra-facile { padding: 8px; gap: 8px; }
  .altre-scelte { margin-left: 0; gap: 6px; }
  .altre-scelte > button, .altre-scelte > a { padding: 8px 10px; font-size: 13px; }
  .indietro-facile { padding: 9px 12px; font-size: 14px; }
}

/* Home dell'accettazione (richiesta di Luca, 29/10): una scrivania in ordine, quattro blocchi col loro nome. */
.blocco-home + .blocco-home { margin-top: 22px; }
.titolo-blocco { margin: 0 0 8px; font-size: 12px; letter-spacing: 1.2px; text-transform: uppercase; color: var(--oro-scuro); font-weight: 800; }
.accettazione-banco .testa-pagina { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.accettazione-banco .testa-pagina .vai-facile { margin-left: auto; }
.accettazione-banco .testa-pagina { position: relative; }
.info-servizio > summary { list-style: none; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: var(--oro); color: var(--nero); font-weight: 900; font-size: 17px; cursor: pointer; }
.info-servizio > summary::-webkit-details-marker { display: none; }
.info-servizio[open] > summary { background: var(--nero); color: var(--oro-chiaro); }
.info-servizio > p { position: absolute; z-index: 15; top: calc(100% + 4px); left: 0; width: min(360px, 100%); margin: 0; padding: 10px 12px; border-radius: 12px; background: #fff; border: 1.5px solid var(--oro); box-shadow: 0 8px 20px rgba(0,0,0,.15); font-size: 14px; line-height: 1.35; }
.azioni-home { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 12px; }
.azioni-home .nuovo-cliente { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; min-height: 84px; padding: 10px 8px; white-space: normal; text-align: center; line-height: 1.15; font-size: 16px; }
.azioni-home .nuovo-cliente.cassa { background: var(--nero); color: var(--oro-chiaro); box-shadow: 0 6px 16px rgba(0,0,0,.2); border: 2px solid var(--oro); }
.azioni-home .nuovo-cliente.cassa svg { color: var(--oro); }
.azioni-home .nuovo-cliente span small { display: block; margin-top: 2px; font-size: 12px; font-weight: 600; opacity: .8; }
.accettazione-banco .risultati:not(:empty), .accettazione-banco .completa-ricerca:not(:empty) { margin-top: 12px; }
.oggi-in-bottega { margin-top: 0; }
.tasti-banco { margin-top: 0; }
@media (max-width: 600px) {
  .azioni-home { gap: 8px; }
  .azioni-home .nuovo-cliente { min-height: 76px; padding: 8px 4px; font-size: 14px; border-radius: 14px; }
  .azioni-home .nuovo-cliente svg { width: 24px; height: 24px; }
  .blocco-home + .blocco-home { margin-top: 18px; }
  .oggi-in-bottega { grid-template-columns: repeat(3, 1fr); }
  .oggi-in-bottega a { flex-direction: column; align-items: flex-start; gap: 0; padding: 6px 9px; font-size: 12px; line-height: 1.2; }
  .oggi-in-bottega a:last-child:nth-child(odd) { grid-column: auto; }
}
/* La tastiera non nasconde mai quello che serve (static/banco/tastiera.js, richiesta di Luca, 29/10): mentre si scrive
   c'è spazio sotto la pagina, così il campo può salire subito sotto la barra in alto. */
body.con-tastiera main { padding-bottom: 70vh; }
@media (max-width: 600px) {  /* con la tastiera aperta, più clienti in vista: nome e tasto sulla stessa riga */
  body.con-tastiera .cliente-facile { flex-wrap: nowrap; padding: 8px 10px; }
  body.con-tastiera .azione-facile { flex: none; }
  body.con-tastiera .azione-facile .bottone, body.con-tastiera .azione-facile form .bottone { width: auto; padding: 10px 12px; font-size: 14px; }
}
@media (max-width: 600px) {
  body.con-tastiera .risultato { padding: 8px 10px; gap: 6px; }
  body.con-tastiera .risultato .bottone { padding: 9px 12px; font-size: 14px; min-height: 0; }
}

/* Revisione dal vivo (regola di Luca, 29/10): Luca le borse di lusso, Leandro le cuciture difficili. */
.revisione-scelta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 10px; padding: 8px; border-radius: 11px; background: var(--avorio-2); font-size: 13px; }
.revisione-scelta b { margin-right: 4px; color: var(--testo); }
.revisione-scelta .chip { padding: 9px 12px; border-radius: 9px; background: #fff; color: var(--testo); font-weight: 600; font-size: 14px; border: 1.5px solid var(--avorio-3); cursor: pointer; }
.revisione-scelta .chip.sel { background: var(--oro); border-color: var(--oro); }
.revisione-scelta .chip[data-revisione=""].sel { background: #fff; border-color: var(--oro); }
.perche-revisione { flex-basis: 100%; color: var(--oro-scuro); font-weight: 700; }
.revisione-attesa { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0 0 14px; padding: 12px 14px; border-radius: 14px; background: #fff7e0; border: 2px solid var(--oro); font-size: 15px; }
.revisione-attesa form { display: flex; flex-wrap: wrap; gap: 8px; flex: 1 1 320px; }
.revisione-attesa .campo { flex: 1; min-width: 180px; padding: 10px 12px; }
.revisione-fatta { margin: 0 0 14px; color: var(--testo-tenue); font-size: 14px; }
.revisione-segno { display: inline-block; padding: 1px 8px; border-radius: 99px; background: #fff7e0; border: 1.5px solid var(--oro); color: var(--testo); font-style: normal; font-size: 12px; font-weight: 700; white-space: nowrap; }
.avviso-revisioni { padding: 10px 14px; border-radius: 12px; background: #fff7e0; border: 2px solid var(--oro); }
.avviso-revisioni summary { cursor: pointer; display: flex; align-items: center; gap: 8px; }
.avviso-revisioni summary i { font-style: normal; min-width: 24px; height: 24px; padding: 0 7px; border-radius: 99px; display: inline-grid; place-items: center; background: var(--oro); font-weight: 800; }
.avviso-revisioni summary em { margin-left: auto; font-style: normal; }
.avviso-revisioni a { display: block; padding: 8px 0; border-top: 1px dashed var(--avorio-3); color: var(--testo); text-decoration: none; }