:root{
  --navy:#0E2A3D; --navy2:#123A54; --blu:#0E93C9; --blu-chiaro:#E4F4FB;
  --fondo:#EEF2F5; --carta:#FFFFFF; --linea:#D8E0E7; --testo:#0F2333; --muto:#5B6B78;
  --verde:#12915B; --verde-bg:#E3F5EC; --giallo:#8A5A00; --giallo-bg:#FFF4DC; --rosso:#C62828; --rosso-bg:#FDECEC;
  --raggio:12px; --ombra:0 1px 2px rgba(15,35,51,.06),0 4px 14px rgba(15,35,51,.06);
  --f:-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--fondo);color:var(--testo);font:15px/1.45 var(--f);-webkit-font-smoothing:antialiased}
button{font:inherit;cursor:pointer}
input,select,textarea{font:inherit;color:inherit}
[hidden]{display:none!important}
.num{font-variant-numeric:tabular-nums}

/* barra in alto */
.barra{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:18px;background:var(--navy);color:#fff;padding:10px max(16px,env(safe-area-inset-left,0px)) 10px max(16px,env(safe-area-inset-right,0px))}
.marchio{font-weight:800;letter-spacing:.02em;white-space:nowrap}
.marchio span{color:#5BC2E7}
.porte{display:flex;gap:8px;flex:1;justify-content:center}
.porta{border:0;border-radius:10px;padding:9px 22px;font-weight:700;background:var(--navy2);color:#BFD3E0}
.porta.on{background:#fff;color:var(--navy)}
.porta[disabled]{opacity:.55;cursor:default}
.io{display:flex;align-items:center;gap:10px;font-size:13px;color:#BFD3E0;white-space:nowrap}
.io button{background:transparent;border:1px solid #3B5A70;color:#fff;border-radius:8px;padding:6px 10px}

/* impaginazione cassa */
.cassa{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(340px,1fr);gap:18px;max-width:1400px;margin:0 auto;padding:18px max(16px,env(safe-area-inset-left,0px)) 40px max(16px,env(safe-area-inset-right,0px))}
@media (max-width:900px){.cassa{grid-template-columns:1fr}}
.card{background:var(--carta);border:1px solid var(--linea);border-radius:var(--raggio);box-shadow:var(--ombra);padding:16px 18px;min-width:0}
.card h2{margin:0 0 12px;font-size:20px}
.colonna{display:grid;gap:18px;align-content:start;min-width:0}

/* ricerca */
.cerca{display:flex;gap:10px}
.cerca input{flex:1;min-width:0;border:2px solid var(--blu);border-radius:10px;padding:14px 16px;font-size:17px;background:#fff;outline:none}
.cerca input:focus{box-shadow:0 0 0 4px #CDEBF7}
.bt{border:1px solid var(--linea);background:#fff;border-radius:10px;padding:10px 14px;font-weight:700;color:var(--testo)}
.bt:hover{border-color:#B9C6D1}
.bt.pr{background:var(--verde);border-color:var(--verde);color:#fff}
.bt.blu{background:var(--blu);border-color:var(--blu);color:#fff}
.bt.ko{color:var(--rosso)}
.bt.grande{padding:16px 18px;font-size:18px;width:100%}
.bt[disabled]{opacity:.5;cursor:not-allowed}
.risultati{margin-top:12px;display:grid;gap:14px}
.gruppo h3{margin:0 0 6px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muto)}
.voce{display:flex;align-items:center;gap:12px;width:100%;text-align:left;border:1px solid var(--linea);background:#fff;border-radius:10px;padding:10px 12px;margin-bottom:6px}
.voce:hover,.voce.sel{border-color:var(--blu);box-shadow:0 0 0 2px #CDEBF7}
.voce .t{flex:1;min-width:0}
.voce b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.voce small{color:var(--muto)}
.voce .p{font-weight:800;white-space:nowrap}
.tag{display:inline-block;font-size:11.5px;font-weight:800;padding:2px 7px;border-radius:999px;margin-left:6px;vertical-align:1px}
.tag.v{background:var(--verde-bg);color:var(--verde)}
.tag.g{background:var(--giallo-bg);color:var(--giallo)}
.tag.r{background:var(--rosso-bg);color:var(--rosso)}
.tag.b{background:var(--blu-chiaro);color:#0B6E96}
.vuoto{color:var(--muto);text-align:center;padding:18px 8px}

/* conti in attesa */
.attesa .riga{display:flex;align-items:center;gap:10px;border-top:1px solid var(--linea);padding:9px 0}
.attesa .riga:first-of-type{border-top:0}
.attesa .riga .t{flex:1;min-width:0}
.attesa small{color:var(--muto)}

/* conto */
.conto{position:sticky;top:76px}
.cliente-testa{display:flex;align-items:flex-start;gap:10px;justify-content:space-between;padding-bottom:12px;border-bottom:1px solid var(--linea)}
.cliente-testa .et{font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muto);font-weight:700}
.cliente-testa b{font-size:17px}
.striscia{margin-top:10px;border-radius:10px;padding:9px 12px;font-weight:600;font-size:13.5px}
.striscia.si{background:var(--verde-bg);color:var(--verde)}
.striscia.no{background:var(--giallo-bg);color:var(--giallo)}
.righe{margin:8px 0;display:grid}
.rc{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:8px;align-items:center;padding:10px 0;border-bottom:1px solid #EEF2F5}
.rc .n b{display:block;font-size:14.5px}
.rc .n small{color:var(--muto);display:block}
.rc .q{display:flex;align-items:center;gap:4px}
.rc .q button{width:40px;height:40px;border:1px solid var(--linea);background:#fff;border-radius:8px;font-weight:800}
.rc .prz{border:1px solid var(--linea);background:#fff;border-radius:8px;padding:6px 9px;font-weight:800;white-space:nowrap;min-width:84px;text-align:right}
.rc .prz s{color:var(--muto);font-weight:400;margin-right:4px;font-size:12.5px}
.rc .x{border:0;background:var(--rosso-bg);color:var(--rosso);border-radius:8px;width:40px;height:40px;font-weight:800}
.prima{border:1px solid #F1D49A;background:#FFF9EC;border-radius:10px;padding:12px;margin:10px 0}
.prima h4{margin:0 0 8px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--giallo)}
.prima .op{display:flex;align-items:center;gap:8px;padding:6px 0}
.prima .op .t{flex:1;min-width:0;font-size:14px}
.prima .op s{color:var(--muto)}
.totale{display:flex;justify-content:space-between;align-items:baseline;margin:14px 0 12px}
.totale b{font-size:32px}
.totale small{color:var(--verde);font-weight:700}
.azioni2{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.azioni2 .bt{flex:1}
.avviso{background:var(--rosso-bg);color:var(--rosso);border-radius:10px;padding:9px 12px;font-weight:600;font-size:13.5px;margin:8px 0}

/* cornice delle operazioni */
.velo{position:fixed;inset:0;z-index:50;background:rgba(9,25,37,.55);display:flex;align-items:flex-start;justify-content:center;padding:5vh max(12px,env(safe-area-inset-left,0px)) 12px}
.op-box{width:min(640px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.op-testa{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 20px;border-bottom:1px solid var(--linea)}
.op-testa h2{margin:0;font-size:19px}
.passi{display:flex;gap:6px;padding:10px 20px 0;list-style:none;margin:0}
.passi li{flex:1;font-size:12px;font-weight:700;color:var(--muto);border-top:3px solid var(--linea);padding-top:6px}
.passi li.ora{color:var(--blu);border-color:var(--blu)}
.passi li.ok{color:var(--verde);border-color:var(--verde)}
.op-corpo{padding:16px 20px}
.op-piede{display:flex;gap:10px;justify-content:flex-end;padding:14px 20px;border-top:1px solid var(--linea);background:#FAFBFC;border-radius:0 0 16px 16px}
.campo{display:grid;gap:5px;margin-bottom:12px}
.campo label{font-size:13px;font-weight:700}
.campo label .o{color:var(--rosso)}
.campo input,.campo select,.campo textarea{border:1px solid #C9D3DC;border-radius:9px;padding:11px 12px;font-size:16px;background:#fff;width:100%}
.campo.err input,.campo.err select,.campo.err textarea{border-color:var(--rosso);box-shadow:0 0 0 3px #F8D7D7}
.campo .m{color:var(--rosso);font-size:13px;font-weight:600}
.griglia2{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
@media (max-width:560px){.griglia2{grid-template-columns:1fr}}
.scelte{display:flex;gap:8px;flex-wrap:wrap}
.scelte button{border:1px solid #C9D3DC;background:#fff;border-radius:10px;padding:12px 16px;font-weight:700;flex:1}
.scelte button.on{border-color:var(--blu);background:var(--blu-chiaro);color:#0B6E96}
.scelte.err button{border-color:var(--rosso)}
.fine{text-align:center;padding:10px 0}
.fine .spunta{width:64px;height:64px;border-radius:50%;background:var(--verde);color:#fff;font-size:34px;line-height:64px;margin:0 auto 10px}
.fine h3{margin:0 0 6px;font-size:22px}
.riepilogo{text-align:left;border:1px solid var(--linea);border-radius:10px;padding:10px 12px;margin-top:14px;font-size:14px}
.riepilogo .r{display:flex;justify-content:space-between;gap:10px;padding:4px 0}
.chiedi{position:fixed;inset:0;z-index:70;background:rgba(9,25,37,.45);display:flex;align-items:center;justify-content:center;padding:16px}
.chiedi div{background:#fff;border-radius:14px;padding:18px 20px;max-width:420px;width:100%;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.chiedi p{margin:6px 0 14px;color:var(--muto)}
.chiedi .r{display:flex;gap:8px;justify-content:flex-end}

#toast{position:fixed;left:50%;top:18px;transform:translateX(-50%);z-index:90;background:var(--navy);color:#fff;padding:12px 18px;border-radius:10px;font-weight:700;box-shadow:0 8px 24px rgba(0,0,0,.3);max-width:calc(100% - 32px)}

/* accesso */
.accesso{max-width:420px;margin:10vh auto;padding:0 16px}
.accesso .card{padding:24px}
.accesso h1{margin:0 0 4px;font-size:24px}
.accesso p{margin:0 0 18px;color:var(--muto)}

/* telefono: barra su due righe, ricerca a tutta larghezza */
@media (max-width:640px){
  .barra{flex-wrap:wrap;gap:8px 12px}
  .marchio{flex:1}
  .porte{order:3;flex-basis:100%;justify-content:stretch}
  .porta{flex:1;padding:8px 2px;min-width:0;font-size:12px;letter-spacing:-.01em;white-space:normal;line-height:1.15;hyphens:manual}
  .cerca{flex-direction:column}
  .conto{position:static}
  .rc{grid-template-columns:minmax(0,1fr) auto auto;}
  .rc .q{grid-column:1}
}
body{overflow-x:hidden}

/* laboratorio */
.lab{max-width:1400px;margin:0 auto;padding:18px max(16px,env(safe-area-inset-left,0px)) 40px max(16px,env(safe-area-inset-right,0px))}
.lab-testa{display:grid;gap:10px}
.lab-testa h2{margin:0}
.schede{display:flex;gap:6px;margin:14px 0 4px;border-bottom:1px solid var(--linea)}
.schede button{border:0;background:none;padding:9px 12px;font-weight:700;color:var(--muto);border-bottom:3px solid transparent}
.schede button.on{color:var(--blu);border-color:var(--blu)}
.colonne{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:12px}
@media (max-width:1100px){.colonne{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.colonne{grid-template-columns:1fr}}
.col{background:#F6F8FA;border-radius:10px;padding:10px;min-width:0}
.col h3{margin:2px 0 8px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muto)}
.voce.rip small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lavoro{display:grid;grid-template-columns:minmax(0,1fr) 110px auto;gap:8px;align-items:start}
.lavoro .campo{margin-bottom:8px}
.lavoro .x{border:0;background:var(--rosso-bg);color:var(--rosso);border-radius:8px;width:36px;height:44px;font-weight:800}
.istr{padding-left:20px}.istr li{margin:8px 0}
.istr a.bt{display:inline-block;text-decoration:none}
.eventi{display:grid;gap:8px;margin-top:8px;font-size:14px}
.eventi small{color:var(--muto)}
.campo input[type=checkbox]{width:20px;height:20px;padding:0;margin:0 8px 0 0;vertical-align:-4px;accent-color:var(--verde)}
.campo label:has(input[type=checkbox]){font-size:15px;cursor:pointer}

/* negozio */
.tab-scorri{overflow-x:auto;margin-top:10px}
.tab{width:100%;border-collapse:collapse;font-size:14.5px}
.tab th{text-align:left;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muto);padding:8px 10px;border-bottom:1px solid var(--linea)}
.tab td{padding:10px;border-bottom:1px solid #EEF2F5;vertical-align:top}
.tab td small{color:var(--muto)}
.tab .e{text-align:right;white-space:nowrap}
.tab .rosso{color:var(--rosso);font-weight:700}
.tab tbody tr[data-prodotto]{cursor:pointer}
.tab tbody tr[data-prodotto]:hover,.tab tbody tr[data-prodotto]:focus{background:var(--blu-chiaro);outline:none}
.rb{border:1px solid var(--linea);border-radius:10px;padding:10px 12px;margin-bottom:10px}
.rb.tel{border-color:#B9DCEC;background:#F7FBFD}
.rb.nuovo{border-color:#F1D49A;background:#FFFCF4}
.rb-t{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px}
.rb .x{border:0;background:var(--rosso-bg);color:var(--rosso);border-radius:8px;width:30px;height:30px;font-weight:800}
.griglia3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 10px}
@media (max-width:640px){.griglia3{grid-template-columns:1fr 1fr}}
.rb .campo{margin-bottom:8px}
.rb .campo input,.rb .campo select{padding:9px 10px;font-size:15px}
.op-box.largo{width:min(920px,100%)}

/* niente scorrimento di lato: i figli delle griglie possono stringersi */
.colonna>*,.risultati,.gruppo,.voce .t{min-width:0}
.voce{max-width:100%}
.rb .x{width:40px;height:40px}
.schede{overflow-x:auto;scrollbar-width:none}
.schede button{white-space:nowrap;flex:none}
.nome-cli{border:0;background:none;padding:0;font-size:17px;font-weight:800;color:var(--testo);text-align:left;cursor:pointer}
.nome-cli:hover{color:var(--blu)}
h3.sez{margin:18px 0 6px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muto)}
.r-s{padding:7px 0;border-bottom:1px solid #EEF2F5;font-size:14px}.r-s small{color:var(--muto)}

/* telefono: tasti per il dito, schede che vanno a capo, nomi interi */
@media (max-width:640px){
  .bt,.porta,.scelte button{min-height:44px}
  .schede{flex-wrap:wrap;overflow:visible}
  .voce b{white-space:normal}
  .tab{font-size:13.5px}
  .tab td small{word-break:break-all}
  .tab th,.tab td{padding:8px 6px}
}

.io button{min-height:40px;min-width:44px}

/* firme con codice SMS */
.firma-box{background:var(--blu-chiaro);color:#0B4F6C;border-radius:10px;padding:12px 14px;margin-bottom:12px}
.cod{font-size:28px!important;font-weight:800;letter-spacing:.35em;text-align:center}
.stato-firma{font-weight:700;color:var(--giallo);margin:14px 0 0}
.segno{display:grid;grid-template-columns:repeat(3,56px);gap:14px;margin-top:10px}
.segno button{width:56px;height:56px;border-radius:50%;border:2px solid #C9D3DC;background:#fff;font-weight:800;font-size:18px}
.segno button.on{background:var(--navy);border-color:var(--navy);color:#fff}
.link{border:0;background:none;color:var(--blu);font-weight:700;padding:0;cursor:pointer}
/* Ricevute come nel vecchio: controllo del telefono, aiuti, riconoscimento */
.aiuto{font-weight:400;color:var(--muto);font-size:12.5px}
label .aiuto{margin-left:4px}
.chk-r{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:7px 0;border-top:1px solid var(--linea);flex-wrap:wrap}
.chk-r>span{min-width:0;flex:1 1 160px;font-weight:600}.chk-r>span .aiuto{display:block;margin:0}
.chk-r.gua>span{color:var(--rosso)}
.chk-b{display:flex;gap:6px;flex-wrap:wrap}
.chk-b button{border:1px solid #C9D3DC;background:#fff;border-radius:8px;padding:8px 10px;font-weight:700;font-size:13px;min-height:40px}
.chk-b button.on.ok{background:var(--verde-bg);border-color:var(--verde);color:var(--verde)}
.chk-b button.on.ko{background:var(--rosso-bg);border-color:var(--rosso);color:var(--rosso)}
.chk-b button.on.nv{background:#EEF2F5;border-color:var(--muto);color:var(--testo)}
.campo.chk.err{outline:2px solid var(--rosso);outline-offset:4px;border-radius:8px}
.riconosci{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-start;background:var(--blu-chiaro);border-radius:10px;padding:10px 12px;margin-top:10px}
.riconosci-b{display:flex;flex-direction:column;gap:6px}.riconosci-b .bt{text-decoration:none;text-align:center;font-size:13px}
@media(max-width:560px){.chk-b{width:100%}.chk-b button{flex:1}.riconosci-b{width:100%}}

/* ——— riparazioni (come il vecchio) ——— */
.pallino{display:inline-block;min-width:20px;padding:0 6px;margin-left:6px;border-radius:999px;background:#E0453A;color:#fff;font-size:12px;line-height:20px}
.pallino[hidden]{display:none}
.lab-testa .aiuto{max-width:640px}
.contatori{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 12px}
.contatori span{background:var(--blu-chiaro);color:#0B6E96;border-radius:999px;padding:5px 12px;font-size:13.5px}
.contatori span.r{background:var(--rosso-bg);color:var(--rosso)}
.sms-box{background:var(--giallo-bg);color:var(--giallo);border-radius:10px;padding:10px 12px;margin:0 0 12px;font-size:13.5px}
.sms-box .r{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px}
.lab-riga{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px;align-items:center;border:1px solid var(--linea);background:#fff;border-radius:10px;padding:10px 12px;margin-bottom:6px;cursor:pointer}
.lab-riga:hover{border-color:var(--blu)}
.lab-riga .t b{display:block}
.lab-riga .t small{color:var(--muto);display:block}
.lab-riga .p{font-weight:800;white-space:nowrap}
.lab-riga .tag{margin-left:0}
.pz{font-size:13px;border-radius:8px;padding:5px 8px;margin-top:5px;font-weight:600}
.pz.g{background:var(--giallo-bg);color:var(--giallo)} .pz.r{background:var(--rosso-bg);color:var(--rosso)} .pz.b{background:var(--blu-chiaro);color:#0B6E96} .pz.v{background:var(--verde-bg);color:var(--verde)}
.bt.mini{padding:5px 10px;font-size:13px}
.stati{display:flex;flex-wrap:wrap;gap:4px;margin:0 0 10px}
.stati span{font-size:12.5px;padding:4px 9px;border-radius:999px;background:#EEF2F5;color:var(--muto);font-weight:700}
.stati span.ok{background:var(--verde-bg);color:var(--verde)}
.stati span.on{background:var(--navy);color:#fff}
.banner-gar{background:var(--blu-chiaro);color:#0B4F6C;border-radius:10px;padding:10px 12px;margin:0 0 10px;font-size:14px}
.cassa-box{border:1px solid var(--linea);border-radius:10px;padding:10px 12px;margin-top:12px}
.cassa-box h4{margin:0 0 6px}
.lavoro-sparo{border-top:1px solid #EEF2F5;padding-top:8px;margin-top:8px}
.lavoro-sparo:first-of-type{border-top:0}
.sp-esito .mag{max-height:260px;overflow:auto;margin-top:6px}
.marche button{flex:0 1 auto}
.fasce{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px}
.fascia{display:flex;flex-direction:column;gap:3px;text-align:left;border:1px solid #C9D3DC;background:#fff;border-radius:10px;padding:10px 12px}
.fascia.on{border-color:var(--blu);background:var(--blu-chiaro)}
.fascia > span{font-size:18px;font-weight:800}
.fascia small{color:var(--muto)}
.fascia small .tag{margin-left:0}
.box-prezzo{border:1px solid var(--linea);border-radius:10px;padding:10px 12px;margin-top:12px}
.euro{display:flex;align-items:center;gap:6px;max-width:220px}
.euro input{font-size:20px;font-weight:800}
.marg{position:relative;margin:8px 0 4px;font-size:13px;font-weight:700}
.marg i{display:block;height:6px;border-radius:3px;margin-top:4px;background:var(--verde)}
.marg.g i{background:#D99A00} .marg.r i{background:var(--rosso)} .marg.r span{color:var(--rosso)} .marg.g span{color:var(--giallo)} .marg.v span{color:var(--verde)}
.marg em{position:absolute;bottom:-2px;width:2px;height:10px;background:var(--testo)}
.messe{border:1px solid var(--linea);border-radius:10px;padding:10px 12px;margin-bottom:10px}
.messe h4{margin:0 0 6px}
.messe .r{display:flex;align-items:center;gap:8px;padding:3px 0}
.messe .r b{margin-left:auto}
.messe .x{border:0;background:var(--rosso-bg);color:var(--rosso);border-radius:8px;width:30px;height:30px;font-weight:800}
.messe .tot{border-top:1px solid var(--linea);margin-top:4px;padding-top:6px}
pre.msg{white-space:pre-wrap;font-family:inherit;background:#F6F9FB;border:1px solid var(--linea);border-radius:10px;padding:10px 12px;font-size:14px;margin:0 0 10px}
.riquadro{border:1px dashed #B8C6D1;border-radius:10px;padding:10px 12px;margin-top:12px}
.riquadro p{margin:4px 0 8px;color:var(--muto);font-size:13.5px}
.nota-box{background:var(--giallo-bg);color:var(--giallo);border-radius:10px;padding:10px 12px;margin-top:8px;font-size:14px}
.scelte button small{display:block;font-weight:400;font-size:12px;color:var(--muto)}
.mod-riga{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1.2fr) 110px auto;gap:8px;align-items:end;border-bottom:1px solid #EEF2F5;padding-bottom:6px;margin-bottom:6px}
.mod-riga .x{border:0;background:var(--rosso-bg);color:var(--rosso);border-radius:8px;width:36px;height:42px;font-weight:800;margin-bottom:8px}
.mod-riga small{grid-column:1/-1}
.elimina{margin-top:12px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.bt.dr{position:fixed;left:14px;bottom:14px;z-index:40;background:var(--navy);color:#fff;border-color:var(--navy);box-shadow:0 6px 20px rgba(0,0,0,.2)}
.bt.dr[hidden]{display:none}
/* Sui telefoni «Da fare oggi» è una striscia in cima alla pagina, non un tasto fisso che copre i bottoni (secondo collaudo cassa, difetto 10) */
.bt.dr.in-alto{position:static;display:flex;justify-content:space-between;align-items:center;width:100%;border-radius:0;box-shadow:none;border:0;border-bottom:1px solid rgba(255,255,255,.15);padding:10px 16px;font-size:15px}
small.rosso{color:var(--rosso)!important}
@media (max-width:640px){
  .lab-riga{grid-template-columns:minmax(0,1fr) auto}
  .lab-riga > .bt{grid-column:1/-1}
  .mod-riga{grid-template-columns:1fr 1fr}
  .fasce{grid-template-columns:1fr 1fr}
}
/* Telefono (collaudo 10/11): i tasti in fondo alle finestre vanno a capo, a tutta larghezza, il principale per primo. */
@media (max-width:640px){
  .op-piede{flex-wrap:wrap;justify-content:stretch;gap:8px;padding:12px 14px}
  .op-piede > .bt,.op-piede > a.bt{flex:1 1 100%;width:100%;text-align:center;white-space:normal}
  .op-piede > .bt.pr{order:-1}
  .op-piede > span{flex:1 1 100%}
  .azioni2{flex-wrap:wrap}
  .riconosci-b{flex-wrap:wrap}
}
/* Riga di riparazione o caparra nel conto: il prezzo viene dalla scheda, non si tocca (collaudo 10/11, punto 5) */
.prz.fisso{cursor:default;border-color:transparent;background:transparent}
/* Il tasto «Da fare oggi» in basso non copre l'ultima riga a 390 px (collaudo 10/11, punto 11) */
@media (max-width:700px){main,.cassa,#conto{padding-bottom:72px}}
/* Barra «cosa fare dopo» (682): in basso al centro, blu notte, cerchio verde, 14 secondi */
.cfd{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:70;width:max-content;max-width:min(720px,calc(100vw - 32px));display:flex;gap:12px;align-items:flex-start;background:#0B2A3C;color:#fff;border-radius:14px;padding:12px 12px 12px 14px;font-size:14.5px;line-height:1.4;box-shadow:0 10px 30px rgba(0,0,0,.28);animation:cfd-su .2s ease-out}
.cfd-ok{flex:0 0 26px;height:26px;border-radius:50%;background:#1FA971;color:#fff;display:grid;place-items:center;font-weight:800}
.cfd-t b{display:block;color:#9FE3C4;font-size:13px}
.cfd button{background:none;border:0;color:#fff;font-size:22px;line-height:1;cursor:pointer;padding:0 4px;opacity:.85}
@keyframes cfd-su{from{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translate(-50%,0)}}
@media (prefers-reduced-motion:reduce){.cfd{animation:none}}
@media (max-width:600px){.cfd{bottom:18px;font-size:14px}}
/* «Operazione conclusa»: la riga verde (766) */
.fine .verde{color:#12915B;font-weight:700;margin-top:10px}
/* «Da fare oggi» (741): numerino rosso, verde se 0 */
.bt.dr .n{display:inline-block;min-width:22px;margin-left:6px;padding:1px 7px;border-radius:999px;background:#C62828;color:#fff;font-size:13px;text-align:center}
.bt.dr .n.zero{background:#1E8E5A}
.ferma{border:1px solid var(--linea);border-left:4px solid #D98A1C;border-radius:10px;padding:10px 12px;margin:8px 0;background:#fff}
.ferma.rossa{border-left-color:#D2342B}
.ferma-t{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.ferma-t small{color:var(--muto)}
.passo-d{background:#FCE9E7;color:#7a1d16;border-radius:8px;padding:6px 9px;margin:6px 0;font-weight:700}
.scelte.filtri button.ko{border-color:#D2342B;color:#D2342B}
/* «Da fare oggi»: filtri a misura del testo, con il numero di ognuno (revisione della guida) */
.scelte.filtri button{flex:0 1 auto;padding:10px 14px;white-space:nowrap}
.ultime{margin:4px 0 8px;font-size:13.5px}.ultime summary{cursor:pointer;font-weight:700;color:var(--muto)}.ultime div{padding:3px 0;border-bottom:1px solid var(--linea)}

/* ——— cassa: promemoria «vendita senza scontrino» (567), documento, Cassa veloce, PIN (409), quadratura (410) ——— */
.senza{background:var(--rosso-bg);color:var(--rosso);border-bottom:2px solid #F3B4B4;padding:10px max(16px,env(safe-area-inset-left,0px));font-size:14px}
.senza-r{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:#fff;border-radius:10px;padding:8px 10px;margin-top:8px;color:var(--testo)}
.senza-r small{color:var(--muto)}
.az-badge{display:inline-block;background:var(--navy);color:#fff;font-weight:800;font-size:12px;letter-spacing:.06em;border-radius:6px;padding:3px 8px}
.fattura-box b{font-size:15px}
.cv{border:1px solid var(--linea);border-radius:10px;padding:12px;margin:10px 0;background:#F7FAFC}
.cv b{display:block}.cv small{color:var(--muto)}.rosso{color:var(--rosso)}
#toast .t-ann{margin-left:10px;background:#fff;color:var(--navy);border:0;border-radius:8px;padding:4px 10px;font-weight:800}
.kpi{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:8px 0}
.kpi>div{background:#F7FAFC;border:1px solid var(--linea);border-radius:10px;padding:10px}
.kpi b{display:block;font-size:18px}.kpi small{color:var(--muto)}.kpi .rosso b{color:var(--rosso)}
@media (max-width:640px){.kpi{grid-template-columns:repeat(2,minmax(0,1fr))}}
.accesso.pin{max-width:460px;text-align:center}
.marchio-pin{color:var(--muto);font-weight:700;letter-spacing:.04em}
.operatori{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;margin:16px 0}
.operatore{display:flex;flex-direction:column;align-items:center;gap:6px;border:1px solid var(--linea);background:#fff;border-radius:12px;padding:14px 8px;font-weight:700}
.operatore .av{width:44px;height:44px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;font-size:18px}
.puntini{display:flex;gap:12px;justify-content:center;margin:14px 0}
.puntini span{width:16px;height:16px;border-radius:50%;border:2px solid var(--navy)}
.puntini span.on{background:var(--navy)}
.tastierino{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:280px;margin:0 auto 12px}
.tastierino button{height:56px;border-radius:12px;border:1px solid var(--linea);background:#fff;font-size:22px;font-weight:700}
.link{background:none;border:0;color:var(--blu);font-weight:700;margin-top:6px}
.fermo{position:fixed;inset:0;z-index:95;background:rgba(9,25,37,.7);display:grid;place-items:center;padding:16px}
.fermo>div{background:#fff;border-radius:16px;padding:24px;max-width:420px;width:100%;text-align:center}
.fermo b{font-size:20px;display:block}.fermo .conta{font-size:40px;font-weight:800;margin:8px 0}
.fermo .spunta{width:64px;height:64px;border-radius:50%;background:var(--verde);color:#fff;font-size:34px;display:grid;place-items:center;margin:0 auto 10px}

/* Ordine dal sito: i campi in alto non si allungano accanto alle scelte del pagamento */
.griglia2.alto{align-items:start}

/* Liste «IVA da verificare» e «IMEI da sistemare» a 390 px: una riga sotto l'altra, il campo largo (collaudo finale, punto 11) */
@media (max-width:600px){.tab.iva-ver thead{display:none}.tab.iva-ver tr{display:block;border-bottom:1px solid var(--linea);padding:8px 0}.tab.iva-ver td{display:block;border:0;padding:4px 0}.tab.iva-ver td.e{text-align:left}.tab.iva-ver input{width:100%}}
.avviso.dentro{margin-top:10px}

/* Negozio in 5 gruppi (collaudo indipendente): gruppi su una riga anche a 390 px, sottoschede a chip che scorrono */
.gruppi-neg{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;margin:14px 0 8px;background:#EEF2F5;border-radius:12px;padding:4px}
.gruppi-neg button{border:0;background:none;border-radius:9px;padding:9px 6px;font-weight:700;color:var(--muto);min-height:44px;min-width:0;display:flex;align-items:center;justify-content:center;gap:6px;cursor:pointer}
.gruppi-neg button.on{background:#fff;color:var(--blu);box-shadow:0 1px 2px rgba(17,17,31,.08)}
.gruppi-neg button:focus-visible,.chip-neg button:focus-visible{outline:3px solid #9DD6EE;outline-offset:1px}
.gruppi-neg .corto{display:none}
.gruppi-neg .pall{background:var(--rosso);color:#fff;border-radius:999px;font-size:11px;min-width:18px;height:18px;line-height:18px;padding:0 5px;text-align:center}
.chip-neg{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:0 0 12px;padding-bottom:2px}
.chip-neg button{flex:none;white-space:nowrap;border:1px solid var(--linea);background:#fff;border-radius:999px;padding:7px 12px;font-weight:600;font-size:14px;color:var(--testo);cursor:pointer}
.chip-neg button.on{background:var(--blu);border-color:var(--blu);color:#fff}
@media (max-width:760px){.gruppi-neg .lungo{display:none}.gruppi-neg .corto{display:inline}.gruppi-neg button{font-size:13px;padding:8px 2px;flex-direction:column;gap:2px}.chip-neg button{min-height:40px}}
/* Telefono (revisione finale della guida, 10/11): ogni tasto si prende col pollice, almeno 40 px di altezza
   (nome del cliente nel conto, contatore dei consensi, link del PIN, «Annulla» nel messaggio, tasti piccoli, tendine e caselle con l'etichetta). */
@media (max-width:640px){
  .nome-cli,.link,.cm-pill,.t-ann,.bt.mini,select{min-height:40px}
  .nome-cli,.link{padding:8px 0}
  label:has(> input[type="checkbox"]),label:has(> input[type="radio"]){min-height:40px;display:flex;align-items:center;gap:8px}
}
@media (max-width:640px){
  /* niente testo tagliato: sul telefono i nomi lunghi vanno a capo; le colonne del modulo non escono dallo schermo */
  .voce b,.voce.rip small{white-space:normal;overflow-wrap:anywhere}
  .griglia2>*,.griglia3>*{min-width:0}
  .griglia2 input,.griglia3 input,.griglia2 select,.griglia3 select{min-width:0;max-width:100%}
  .rq-tutte{min-height:40px}
  a.bt.mini,a.mini,.tab a.bt,.tab a{min-height:40px;display:inline-flex;align-items:center}
  input[type="checkbox"]:not(label > input){width:36px;height:36px}
}