/* ============================================================================
   Nightsheet — foglio di lavoro della notte. Interfaccia densa, piatta, leggibile
   al buio e a due del mattino: una barra sola, tab a striscia, contenitori senza
   ornamenti, numeri in monospazio tabellare come su un foglio cassa.
   I COLORI stanno solo nelle variabili: i temi (ns_temi) le sovrascrivono.
   ============================================================================ */
/* Il carattere delle Club Facts: sta con noi, non su Google, cosi' la frase si vede
   anche quando il tablet e' senza linea. */
@font-face{font-family:"Monstral";src:url("../fonts/DxMonstral-Smooth.woff2") format("woff2");
  font-weight:400;font-style:normal;font-display:swap}
:root{
  /* tema classico "Notte in Maremma": carbone caldo + ottone. Vedi app.css.pre-restyle. */
  --bg:#131210;--panel:#1b1813;--panel2:#232019;--line:#37322a;
  --txt:#f4efe6;--muted:#a89e8c;--accent:#cda349;--accent2:#a6552e;--on-accent:#1a1508;
  --ok:#3fa06a;--bad:#e5484d;--warn:#e0a13a;
  /* derivati dell'accento (i temi li sovrascrivono tutti insieme) */
  --accent-hover:#dcb25e;--login-glow:#2c1e10;--header-a:#1b1813;--header-b:#241a12;--accent-glow:rgba(205,163,73,.18);
  /* TIPOGRAFIA (rifatta 17/9/2026). Tre voci con mestieri diversi:
     - display Syne: marchio e titoli. Ha molta personalita', quindi sta SOLO li'.
     - ui Manrope: tutto il resto. Piu' aperta di Plex, si legge meglio a 13-14px.
     - mono JetBrains: i NUMERI (soldi, orari, codici), con le cifre incolonnate.
     Il peso del corpo non scende sotto 400: sul fondo scuro il chiaro si allarga
     otticamente e i tratti sottili sbavano — al banco, di notte, si paga. */
  --ui:"Manrope",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --display:"Syne","Manrope","Segoe UI",system-ui,-apple-system,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;--scritta:"Monstral","Bradley Hand",ui-rounded,cursive;
  /* misure */
  --r:10px;--r-s:7px;--hdr:44px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--ui);background:var(--bg);color:var(--txt);font-size:14px;line-height:1.4;font-feature-settings:"tnum" 1}
.hidden{display:none!important}
h1,h2,h3{margin:0 0 6px;font-family:var(--display);font-weight:700;letter-spacing:-.02em;line-height:1.14}
h1{font-size:22px}h2{font-size:18px}h3{font-size:15px}
.muted{color:var(--muted)}
.err{color:var(--bad);font-size:13px;margin-top:6px}
.hint{font-size:12.5px;color:var(--muted);margin-top:5px;line-height:1.45}
.hint code{font-family:var(--mono);font-size:12px;background:var(--panel2);padding:0 4px;border-radius:4px}

/* Controlli: stessa altezza (32px), stesso raggio, bordo che si accende al focus */
input,select,button,textarea{font:inherit;color:var(--txt)}
input,select,textarea{background:var(--panel2);border:1px solid var(--line);border-radius:var(--r-s);padding:6px 9px;min-height:32px;transition:border-color .12s}
input:focus,select:focus,textarea:focus{border-color:var(--accent);outline:none}
input[type=number]{text-align:right;font-family:var(--mono);font-size:13.5px}
input[type=checkbox],input[type=radio]{min-height:0;accent-color:var(--accent)}
input[type=file]{background:transparent;border:1px dashed var(--line);padding:6px}
button{background:var(--panel2);border:1px solid var(--line);border-radius:var(--r-s);padding:6px 11px;min-height:32px;cursor:pointer;font-weight:500;font-size:13.5px;line-height:1.2;transition:border-color .12s,background .12s,color .12s}
button:hover{border-color:var(--accent)}
button:disabled{opacity:.5;cursor:default}
button.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent);font-weight:700}
button.primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}
button.ghost{background:transparent;border-color:transparent;color:var(--muted)}
button.ghost:hover{color:var(--txt);border-color:var(--line);background:var(--panel2)}
button.danger{border-color:transparent;color:var(--bad);background:transparent}
button.danger:hover{border-color:var(--bad);background:transparent}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}

/* Login: la sola cosa al centro, con il logo del locale */
.login{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:16px;background:radial-gradient(1100px 560px at 50% -12%,var(--login-glow),var(--bg))}
.login-card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:26px 24px;width:340px;display:flex;flex-direction:column;gap:10px}
.login-card input{width:100%;min-height:38px}
.login-card button.primary{min-height:38px;margin-top:4px}
.login-card .brand{font-size:24px;font-weight:700;font-family:var(--display)}
.login-logo{display:block;width:220px;max-width:80%;margin:0 auto 6px}
.login-card .sub{color:var(--muted);margin-bottom:6px;text-align:center;font-size:12px;text-transform:uppercase;letter-spacing:.18em}
.header-logo{height:22px;width:auto;display:block;flex:0 0 auto}
.brand b{color:var(--accent)}
.uhead{margin-bottom:0;padding-bottom:2px;border-bottom:1px solid var(--line)}
.uhead .uh{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.11em}
td.ucalc{font-weight:600;text-align:center;font-family:var(--mono);color:var(--accent)}

/* Shell: UNA barra di 44px con tutto in riga; sotto, la striscia delle tab */
header{position:sticky;top:0;z-index:20;min-height:var(--hdr);background:linear-gradient(90deg,var(--header-a),var(--header-b));border-bottom:1px solid var(--line);box-shadow:0 1px 0 var(--accent-glow);padding:5px 14px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
header .brand{font-weight:600;font-family:var(--display);letter-spacing:.06em;font-size:12px;text-transform:uppercase;color:var(--muted)}
header button{padding:5px 9px;min-height:30px;font-size:13px}
header button.ghost{color:var(--muted)}
header .field{flex-direction:row;align-items:center;gap:6px}
header .field label{margin:0}
header select{min-width:220px;min-height:30px;padding:4px 8px;font-weight:600}
#whoami{font-size:12px}
.grow{flex:1}
.field{display:flex;flex-direction:column;gap:3px}
.field label{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.11em;font-weight:500}
.tabs{display:flex;gap:2px;padding:0 14px;flex-wrap:wrap;background:var(--bg);position:sticky;top:var(--hdr);z-index:10;border-bottom:1px solid var(--line)}
.tabs button{background:transparent;border:none;border-radius:0;min-height:0;padding:9px 10px;color:var(--muted);font-weight:600;font-size:13px;opacity:1;box-shadow:inset 0 -2px 0 transparent;transition:color .12s,box-shadow .12s}
.tabs button:hover{color:var(--txt)}
.tabs button.active{color:var(--txt);background:transparent;font-weight:700;box-shadow:inset 0 -2px 0 var(--accent)}
/* Menu a tendina dei gruppi di tab */
.tabgroup{position:relative;display:inline-block}
.tabmenu{position:absolute;top:100%;left:0;min-width:220px;background:var(--panel);border:1px solid var(--line);border-radius:0 0 var(--r) var(--r);box-shadow:0 14px 34px rgba(0,0,0,.5);display:flex;flex-direction:column;padding:4px;z-index:30}
.tabmenu button{border-radius:6px;width:100%;text-align:left;margin:0;padding:7px 10px;box-shadow:none;font-weight:500}
.tabmenu button:hover{background:var(--panel2)}
.tabmenu-sub{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted,#9a9080);padding:8px 10px 2px;border-top:1px solid var(--line);margin-top:4px}
.tabmenu button.sub{padding-left:22px}
.tabmenu button.active{background:var(--panel2);color:var(--txt);font-weight:700;box-shadow:inset 3px 0 0 var(--accent)}
main{padding:14px 20px 40px;max-width:1280px;margin:0 auto}
/* La tab PR ha tabelle larghe: su schermi grandi usa quasi tutta la larghezza + celle compatte */
body[data-tab="pr"] main{max-width:min(1600px,97vw)}
body[data-tab="pr"] .grid-table td,body[data-tab="pr"] .grid-table th{padding:5px 6px}
/* WhatsApp: su schermo largo la casella usa lo spazio (lista piu' larga, bolle piu' lunghe). */
body[data-tab="whatsapp"] main{max-width:min(1800px,97vw)}
@media (min-width:1280px){
  body[data-tab="whatsapp"] .wa-wrap{grid-template-columns:400px minmax(0,1fr)}
  body[data-tab="whatsapp"] .wa-bolla{max-width:min(72%,760px)}
  body[data-tab="whatsapp"] .wa-msgs{padding:16px 28px}
}

/* Contenitori: piatti, un bordo sottile, poco spazio perso */
.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;margin-bottom:12px}
.panel.tcard{padding:8px 12px;margin-bottom:6px}  /* card tavoli: lista fitta */
.panel>h2:first-child,.panel>h3:first-child{margin-bottom:8px}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.pills{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.pill{padding:5px 11px;border-radius:999px;border:1px solid var(--line);background:var(--panel2);cursor:pointer;font-weight:600;font-size:13px;line-height:1.3}
.pill.active{background:var(--accent);border-color:transparent;color:var(--on-accent)}
.pill .badge{font-size:11px;margin-left:6px;padding:1px 6px;border-radius:999px;background:rgba(0,0,0,.3);font-family:var(--mono)}

/* Tabelle: il foglio cassa. Righe sottili, intestazioni piccole, numeri monospazio */
table{width:100%;border-collapse:collapse}
th{font-weight:600}
table.denom td,table.denom th{padding:3px 6px;border-bottom:1px solid var(--line);text-align:right}
table.denom th{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.11em}
table.denom td{font-family:var(--mono);font-size:13.5px}
table.denom td:first-child{text-align:left;color:var(--muted);font-family:var(--ui)}
table.denom input{width:76px;padding:4px 7px;min-height:28px}
table.denom tfoot td{font-weight:700;border-top:2px solid var(--line);border-bottom:none;padding-top:7px}
.denoms{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:680px){.denoms{grid-template-columns:1fr}}

/* --- Header a scomparsa sul TELEFONO: chiuso mostra solo la serata --- */
#hdrBar{display:none}
@media(max-width:760px){
  body{font-size:15px}
  /* Sul telefono ogni pixel orizzontale conta: contenuto quasi a filo bordo. */
  main{padding:8px 6px 32px}
  .tabs{padding:0 4px;gap:0}
  .tabs button{padding:9px 8px}
  header{padding:6px 10px}
  header .field{flex-direction:column;align-items:stretch;gap:3px}
  #hdrBar{display:flex;width:100%;align-items:center;gap:10px;cursor:pointer;
          padding:2px 0;-webkit-tap-highlight-color:transparent}
  #hdrBar #hdrSerata{font-weight:700;font-size:16px;flex:1;
          white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #hdrBar #hdrChev{color:var(--accent);font-size:18px}
  /* Chiuso: si vede solo la barra compatta. Aperto: tutto (i pulsanti nascosti
     per ruolo restano nascosti dal loro style inline). */
  header:not(.open)>*:not(#hdrBar){display:none!important}
  header.open{padding-bottom:10px;gap:6px}
  header.open .grow{display:none}
  header.open .field{width:100%}
  header.open #serataSel{width:100%;min-width:0}
  header.open button{min-height:34px}
  #btnBell{display:none!important}   /* su telefono la campanella sta nella barra compatta (btnBellM) */
  /* Le tab sotto l'header compatto: riallinea lo sticky. */
  .tabs{top:auto}
  /* Tabelle larghe: scorre il contenitore, non la pagina (la barra e le tab restano ferme) */
  .panel{padding:12px 12px;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .recon{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}
  .stat{padding:8px 10px}
  .stat .v{font-size:19px}
  .row{gap:8px}
  .row .field{flex:1 1 140px;min-width:0}
  .row .field input,.row .field select{width:100%;min-width:0}
  button,input,select,textarea{min-height:36px}
}

/* Riquadri di sintesi: etichetta piccola, numero grande in monospazio */
.recon{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:10px;margin-top:8px}   /* 7 riquadri in una riga a 1280 */
/* Il numero sta sempre in basso: con etichette di lunghezza diversa i valori
   della stessa riga restano allineati tra loro (la griglia rende i box alti uguali). */
.stat{background:var(--panel2);border:1px solid var(--line);border-radius:var(--r-s);padding:10px 12px;display:flex;flex-direction:column;gap:4px}
.stat .k{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.11em;line-height:1.3}
.stat .k .muted{display:block;text-transform:none;letter-spacing:0;font-size:11px;opacity:.85}
.stat .v{font-size:21px;font-weight:600;font-family:var(--mono);margin-top:auto;letter-spacing:-.02em;line-height:1.15;white-space:nowrap}
.v.ok{color:var(--ok)}.v.bad{color:var(--bad)}.v.warn{color:var(--warn)}

.grid-table th{padding:6px 8px;border-bottom:1px solid var(--line);text-align:right;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.11em}
.grid-table td{padding:6px 8px;border-bottom:1px solid var(--line);text-align:right;font-family:var(--mono);font-size:13px}
.grid-table td:first-child,.grid-table th:first-child{text-align:left}
.grid-table td:first-child{font-family:var(--ui);font-size:13.5px}
.grid-table tbody tr:hover td{background:rgba(255,255,255,.025)}
/* righe evidenziate (fuori soglia): sfondo chiaro + testo scuro, leggibile anche in tema scuro */
.grid-table tr.rowbad td{background:#fde8e8;color:#8a1c1c}
.grid-table tr.rowbad td.bad{color:#c0392b;font-weight:700}
.linelist{display:flex;flex-direction:column;gap:6px}
/* Campo «trova» con l'elenco che si restringe mentre si scrive (ricetta dell'articolo: scegliere un ingrediente fra centinaia). */
.trova{margin-top:8px}
.trova>input{width:100%;min-height:44px;font-size:16px}
.trova-lista{margin-top:4px;max-height:min(46vh,340px);overflow-y:auto;border:1px solid var(--line);border-radius:var(--r-s);background:var(--panel2);overscroll-behavior:contain}
.trova-voce{display:flex;justify-content:space-between;align-items:center;gap:10px;width:100%;min-height:44px;padding:8px 12px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;color:inherit;text-align:left;font:inherit;cursor:pointer;touch-action:manipulation}
.trova-voce:last-of-type{border-bottom:0}
.trova-voce .n{flex:1;min-width:0;overflow-wrap:anywhere}
.trova-voce .d{flex:none;color:var(--muted);font-size:.85em;white-space:nowrap}
.trova-voce.on,.trova-voce:hover{background:rgba(255,255,255,.07)}
.trova-voce.on{box-shadow:inset 3px 0 0 var(--accent)}
.trova-voce:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.trova-voce.nuovo .n{color:var(--accent);font-weight:600}
.trova-vuoto{padding:10px 12px;color:var(--muted);font-size:.9em}
.lineitem{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.lineitem input,.lineitem select{flex:1;min-width:90px}
.lineitem input.amt{flex:0 0 110px}
.tag{font-size:11px;padding:2px 8px;border-radius:999px;background:var(--panel2);border:1px solid var(--line);color:var(--muted);font-family:var(--mono);letter-spacing:.02em}

.toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%) translateY(40px);background:var(--panel);border:1px solid var(--line);padding:10px 16px;border-radius:var(--r-s);opacity:0;transition:.2s;z-index:1000;box-shadow:0 10px 30px rgba(0,0,0,.55);font-size:13.5px;max-width:min(92vw,520px)}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.toast.ok{border-color:var(--ok)}.toast.bad{border-color:var(--bad)}

.frozen-banner{background:#3a1d22;border-bottom:1px solid var(--bad);color:#ffb3b3;padding:6px 16px;text-align:center;font-weight:600;font-size:13px}
/* Serata bloccata = sola lettura, TRANNE per l'admin (che puo' correggere). */
body.frozen:not(.role-admin):not(.role-pr):not(.frozen-scrive) main input,body.frozen:not(.role-admin):not(.role-pr):not(.frozen-scrive) main select,body.frozen:not(.role-admin):not(.role-pr):not(.frozen-scrive) main textarea{pointer-events:none;opacity:.55}
body.frozen:not(.role-admin):not(.role-pr):not(.frozen-scrive) main button:not(.noprint){pointer-events:none;opacity:.4}
/* Ruoli e permessi: sezione in sola lettura (livello «Lettura»), stessa grafica della serata bloccata. */
body.sola-lettura main input,body.sola-lettura main select,body.sola-lettura main textarea{pointer-events:none;opacity:.55}
body.sola-lettura main button:not(.noprint){pointer-events:none;opacity:.4}

#print-area{display:none}

/* Lineup: pallino LIVE lampeggiante come le radio, e barre della vista timeline */
.live-dot{display:inline-block;width:.62em;height:.62em;border-radius:50%;background:#ff3b30;margin-right:.35em;vertical-align:middle;animation:liveblink 1s steps(2,start) infinite;box-shadow:0 0 8px #ff3b30}
@keyframes liveblink{50%{opacity:.12}}
.lu-bar{height:12px;border-radius:6px;background:#3a3a45;overflow:hidden;min-width:20px}
.lu-bar>i{display:block;height:100%;border-radius:6px;background:var(--accent)}
.lu-live{outline:2px solid #ff3b30;outline-offset:2px;border-radius:10px}
/* Voci di lineup gia' passate: ingrigite e depennate, restano in elenco */
/* Orologio Lineup: alone d'ottone che pulsa lento (stile Ibiza) */
.lu-clock{background:linear-gradient(180deg,#f6e7b2,#cda349 52%,#9c6f2c);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:clockGlow 2s ease-in-out infinite}
@keyframes clockGlow{0%,100%{text-shadow:0 0 20px rgba(214,176,90,.45),0 0 54px rgba(205,163,73,.22)}50%{text-shadow:0 0 30px rgba(245,227,165,.95),0 0 62px rgba(214,176,90,.72),0 0 115px rgba(205,163,73,.48)}}
.lu-past{opacity:.4}
.lu-past .lu-time{text-decoration:line-through;text-decoration-thickness:2px}
.lu-past .lu-nm{text-decoration:line-through}

@media print{
  header,.tabs,.noprint,.frozen-banner{display:none!important}
  body{background:#fff;color:#000}
  .panel,.stat{background:#fff!important;color:#000!important;border-color:#ccc!important}
  /* Stampa lista agenzia: mostra solo #print-area */
  body.printing>*:not(#print-area){display:none!important}
  /* Margine su due livelli, come per il listino: il @page vale per OGNI
     pagina (indispensabile sui documenti lunghi come il foglio firme, che
     va su piu' fogli), il padding interno e' la rete di sicurezza quando
     nella finestra di stampa i margini sono su "Nessuno" e il @page viene
     scavalcato. Il padding pero' agisce solo a inizio blocco: dalla seconda
     pagina in poi resta il @page a fare il lavoro. */
  @page{size:A4;margin:14mm}
  body.printing #print-area{display:block!important;color:#000;box-sizing:border-box;
    /* Margine DENTRO il contenuto: se la finestra di stampa e' su "Nessun margine"
       scavalca il @page e il contenuto finirebbe a filo carta. 14/15mm = margine
       sicuro anche a bordi azzerati (il listino ha il suo blocco .listino). */
    padding:14mm 15mm;font-family:Arial,Helvetica,sans-serif;font-size:13px}
  #print-area h1{font-size:20px;margin:0 0 2px}
  #print-area h2{font-size:16px;margin:0 0 4px}
  #print-area .sub{color:#333;margin:0 0 16px}
  #print-area table{border-collapse:collapse;width:100%;margin-top:6px}
  #print-area th,#print-area td{border:1px solid #999;padding:6px 8px;text-align:left}
  #print-area th{background:#e6e6e6}
  #print-area td.r,#print-area th.r{text-align:right}
  #print-area td.c,#print-area th.c{text-align:center}
  #print-area h2{margin-top:22px}
  #print-area td.ore,#print-area th.ore{font-weight:bold;background:#eee}
  #print-area tfoot td{font-weight:bold;background:#f2f2f2}
  #print-area .nota{font-size:12px;color:#333;font-style:italic;margin-top:8px}
  #print-area .sez-sicurezza{margin-top:44px;padding-top:16px;border-top:3px solid #000}
  #print-area .hint{font-size:11px;color:#555;margin:0 0 6px}
  #print-area .firma{margin-top:56px;display:flex;justify-content:space-between;gap:40px}
  #print-area .firma div{border-top:1px solid #000;padding-top:6px;width:45%;font-size:12px}
  /* Foglio firme di arrivo: righe alte per scrivere ora e firma a mano */
  #print-area tr.firmarow td{height:34px}
  #print-area td.box,#print-area th.box{text-align:center;width:70px}
}

/* --- Pop-up griglia tagli (fondo / prelievi / conteggio) --- */
.mdl-back{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:300;display:flex;align-items:center;justify-content:center;padding:16px}
.mdl{background:var(--panel,#16161c);border:1px solid var(--line,#2a2a35);border-radius:12px;max-width:440px;width:100%;max-height:88vh;display:flex;flex-direction:column}
.mdl-head{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line,#2a2a35)}
.mdl-head h3{margin:0;flex:1;font-size:16px}
.mdl-body{padding:12px 14px;overflow:auto}
.mdl-foot{padding:10px 14px;border-top:1px solid var(--line,#2a2a35);display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap}
/* Riquadri cliccabili col totale */
.cashbox{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.cashbox .cb{flex:1;min-width:150px;background:var(--panel2,#1d1d27);border:1px solid var(--line,#2a2a35);
  border-radius:var(--r-s);padding:10px 12px;cursor:pointer;text-align:left}
.cashbox .cb:hover{border-color:var(--accent)}
.cashbox .cb{display:flex;flex-direction:column}
.cashbox .cb .k{font-size:12px;color:var(--muted,#9a9aa8)}
.cashbox .cb .v{margin-top:auto}
.cashbox .cb .v{font-size:24px;font-weight:600;font-family:var(--mono);margin-top:2px;letter-spacing:-.02em}
.cashbox .cb .h{font-size:11px;color:var(--muted,#9a9aa8);margin-top:4px}
/* Conteggi, casse bar: righe «Atteso» e «Conteggio» con i riquadri allineati per colonna, come quelli qui sopra.
   Il segno fra due riquadri (+ − =) sta nel vuoto alla sinistra del riquadro (data-op). */
.quadro{margin-top:14px}
.quadro .q-tit{font-size:11px;text-transform:uppercase;letter-spacing:.11em;color:var(--muted);margin:14px 0 6px}
.quadro .q-tit .muted{text-transform:none;letter-spacing:0;font-size:12px}
.quadro .q-riga{display:grid;gap:10px 24px}
.quadro .qb{position:relative;min-width:0;background:var(--panel2);border:1px solid var(--line);border-radius:var(--r-s);padding:10px 12px;display:flex;flex-direction:column}
.quadro .qb .k{font-size:12px;color:var(--muted)}
.quadro .qb .v{font-size:22px;font-weight:600;font-family:var(--mono);letter-spacing:-.02em;margin-top:2px;white-space:nowrap}
.quadro .qb .h{font-size:11px;color:var(--muted);margin-top:4px;line-height:1.35}
.quadro .qb .h b{color:var(--txt);font-weight:600}
.quadro .qb input[type=number]{width:100%;margin-top:4px;font-size:20px;font-weight:600;letter-spacing:-.02em;min-height:38px}
.quadro .qb .d{font-size:12px;margin-top:6px;min-height:16px}
.quadro .qb .d .ok,.quadro .qb .d .bad,.quadro .qb .d .warn{font-family:var(--mono);font-weight:600}
.quadro .d .ok{color:var(--ok)}.quadro .d .bad{color:var(--bad)}.quadro .d .warn{color:var(--warn)}
.quadro .d a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.quadro .qb[data-op]::before{content:attr(data-op);position:absolute;left:-17px;top:50%;transform:translateY(-50%);font-family:var(--mono);font-size:15px;color:var(--muted)}
.quadro .qb.tot{border-color:var(--accent)}
.quadro .qb.quadra .v{font-size:24px}
.quadro .qb.vuoto{visibility:hidden}
@media (max-width:760px){
  .quadro .q-riga{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:10px}
  .quadro .qb[data-op]::before{display:none}
  .quadro .qb.vuoto{display:none}
  .quadro .qb .v{font-size:19px}
}

/* --- LISTINO A4 da appendere alla porta (stampa) --- */
@media print{
  /* Tre alfabeti a scelta. Il default e' un neo-grottesco (Helvetica Neue):
     presente su ogni Mac, quindi niente font da scaricare in stampa. */
  /* Il margine sta DENTRO il contenuto, non solo nel @page: la finestra di
     stampa del Mac ha una sua voce "Margini" che, se messa su Nessuno,
     scavalca il @page e manda il listino a filo dei bordi. Un padding
     interno non lo puo' scavalcare nessuno. */
  #print-area.listino{color:#000;text-align:center;
    box-sizing:border-box;padding:16mm 15mm 10mm;
    font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}
  #print-area.listino.f-sistema{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",Roboto,sans-serif}
  #print-area.listino.f-classico{font-family:Georgia,"Times New Roman",serif}
  /* Si usa logo-nero.png, una copia del logo coi pixel gia' neri. Il logo
     normale e' bianco (sta su fondo scuro) e su carta sparirebbe; risolverlo
     con filter:brightness(0) funzionava nell'anteprima ma NON nel PDF salvato
     dalla finestra di stampa del Mac, che scarta i filtri CSS. Un'immagine
     gia' nera non dipende da nessun filtro e si comporta uguale ovunque. */
  #print-area.listino .lg{display:block;margin:0 auto 6mm;max-width:78mm;max-height:42mm;object-fit:contain;
    -webkit-print-color-adjust:exact;print-color-adjust:exact}
  #print-area.listino h1{font-size:32pt;letter-spacing:-.015em;margin:0 0 1.5mm;font-weight:700;text-transform:uppercase}
  #print-area.listino.f-classico h1{font-size:30pt;letter-spacing:.14em}
  #print-area.listino .serata{font-size:17pt;font-weight:700;text-transform:uppercase;letter-spacing:.11em;
    margin:0 0 2mm;color:#000}
  #print-area.listino .occhiello{font-size:13pt;letter-spacing:.34em;text-transform:uppercase;color:#444;margin:0 0 7mm}
  #print-area.listino .riga{display:flex;align-items:baseline;gap:5mm;padding:3mm 0;border-bottom:1px solid #bbb;text-align:left}
  #print-area.listino .riga:last-of-type{border-bottom:none}
  /* min-width:0 : senza, un nome lungo non si restringe e spinge il prezzo
     oltre il bordo destro invece di andare a capo. */
  #print-area.listino .voce{flex:1;min-width:0;overflow-wrap:break-word;
    font-size:34pt;font-weight:700;text-transform:uppercase;letter-spacing:-.01em;line-height:1.05}
  #print-area.listino .quando{display:block;font-size:13pt;font-weight:400;letter-spacing:0;color:#555;
    text-transform:none;margin-top:1.2mm;line-height:1.2}
  #print-area.listino.f-classico .quando{font-style:italic}
  #print-area.listino .prezzo{font-size:34pt;font-weight:700;white-space:nowrap;letter-spacing:-.02em;line-height:1.05}
  #print-area.listino .sezione{margin-top:6mm;font-size:12pt;letter-spacing:.24em;text-transform:uppercase;color:#444;
    border-top:2px solid #000;padding-top:3mm;text-align:left}
  /* Con molte voci il corpo doppio sfonderebbe l'A4: si rientra in proporzione
     invece di finire a pagina 2. */
  #print-area.listino.molte .voce{font-size:26pt}
  #print-area.listino.molte .prezzo{font-size:26pt}
  #print-area.listino.molte .quando{font-size:11pt}
  #print-area.listino.molte .riga{padding:2.2mm 0}
  #print-area.listino.molte .lg{max-height:32mm;margin-bottom:4mm}
  #print-area.listino.tante .voce{font-size:20pt}
  #print-area.listino.tante .prezzo{font-size:20pt}
  #print-area.listino.tante .quando{font-size:10pt}
  #print-area.listino.tante .riga{padding:1.8mm 0}
  #print-area.listino.tante .lg{max-height:26mm;margin-bottom:3mm}
  #print-area.listino .cond{margin-top:10mm;padding-top:3mm;border-top:1px solid #999;
    font-size:9pt;line-height:1.5;text-align:center;color:#333;letter-spacing:.02em}
  /* Il listino occupa il foglio da solo */
  body.printing-listino>*:not(#print-area){display:none!important}
  body.printing-listino #print-area{display:block!important}
  /* Margini: 14mm ai lati venivano tagliati da alcune stampanti, che hanno
     un'area non stampabile piu' larga del previsto. In alto se ne mette di
     piu' che in basso: a occhio un blocco centrato geometricamente sembra
     spostato in alto, e va abbassato per apparire in equilibrio. */
  @page{size:A4;margin:12mm}
}

/* --- TAGLIANDI DRINK (stampa) --- */
@media print{
  body.printing-drink>*:not(#print-area){display:none!important}
  body.printing-drink #print-area{display:block!important}
  #print-area.drink{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;color:#000}
  #print-area.drink .tg{width:80mm;box-sizing:border-box;padding:5mm 4mm;text-align:center;
    page-break-after:always;break-after:page;display:flex;flex-direction:column;justify-content:center}
  #print-area.drink .tg.pr{height:120mm}
  #print-area.drink .tg.staff,#print-area.drink .tg.soft{height:60mm;padding:3mm}
  #print-area.drink .lg{display:block;margin:0 auto 3mm;max-width:52mm;max-height:20mm;object-fit:contain}
  #print-area.drink .tg.pr .lg{max-width:64mm;max-height:30mm;margin-bottom:5mm}
  /* STAFF/ANALCOLICA = chit interno: fascia nera piena e dominante in alto,
     a tutta larghezza (i margini negativi annullano il padding da 3mm). */
  #print-area.drink .banda{background:#000;color:#fff;font-weight:800;letter-spacing:.2em;
    padding:3.5mm 0;margin:-3mm -3mm 3mm;font-size:20pt;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  #print-area.drink .tg.soft .banda{font-size:16pt;letter-spacing:.12em}
  /* PR = voucher ospite: righe di separazione sopra/sotto il 1 DRINK gigante */
  #print-area.drink .tg.pr .rule{height:0;border-top:.6mm solid #000;width:64mm;margin:2.5mm auto}
  #print-area.drink .big{font-weight:800;letter-spacing:-.02em;line-height:1}
  #print-area.drink .tg.pr .big{font-size:58pt;margin:3mm 0}
  #print-area.drink .tg.staff .big,#print-area.drink .tg.soft .big{font-size:26pt;margin:2mm 0}
  #print-area.drink .data{font-weight:700;letter-spacing:.06em}
  #print-area.drink .tg.pr .data{font-size:15pt;margin-bottom:3mm}
  #print-area.drink .tg.staff .data,#print-area.drink .tg.soft .data{font-size:11pt;margin-bottom:1.5mm}
  #print-area.drink .chi{font-weight:700;text-transform:uppercase}
  #print-area.drink .tg.pr .chi{font-size:14pt}
  #print-area.drink .tg.staff .chi,#print-area.drink .tg.soft .chi{font-size:12pt}
  #print-area.drink .ruolo{font-size:8.5pt;color:#444;margin-top:.6mm}
  #print-area.drink .bc{margin:3mm auto 0;height:9mm;display:flex;align-items:stretch;justify-content:center}
  #print-area.drink .bc i{display:block;height:100%;background:#000;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  #print-area.drink .bc i.w{background:transparent}
  #print-area.drink .pie{font-size:7pt;color:#555;margin-top:2mm}
  @page{size:80mm auto;margin:0}
}

/* Stampa LINEUP: grande e ad alto contrasto, leggibile in consolle al buio. */
@media print{
  body.printing-lineup>*:not(#print-area){display:none!important}
  body.printing-lineup #print-area{display:block!important}
  #print-area.lineup-print{color:#000;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;padding:12mm}
  #print-area.lineup-print h1{font-size:42pt;margin:0 0 2mm;letter-spacing:.02em;font-weight:800}
  #print-area.lineup-print .sub{font-size:17pt;margin:0 0 8mm;color:#000}
  #print-area.lineup-print .r{display:flex;align-items:baseline;gap:10mm;border-bottom:3px solid #000;padding:5mm 0}
  #print-area.lineup-print .t{font-size:36pt;font-weight:800;min-width:54mm}
  #print-area.lineup-print .n{font-size:30pt;font-weight:700}
  #print-area.lineup-print .n em{font-size:15pt;font-style:normal;text-transform:uppercase;color:#333;letter-spacing:.1em}
  #print-area.lineup-print .nt{font-size:16pt;margin:1mm 0 3mm 54mm;color:#000;font-style:italic}
  @page{size:A4;margin:0}
}

/* --- CASSA (mod_pos.js): tasti grandi, comanda a destra, tastierino --- */
.pos-wrap{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:10px;align-items:start}
.pos-top{grid-column:1 / -1;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.pos-top select{font-weight:600;min-height:36px}
.pos-sx{min-width:0}
.pos-cats{margin-bottom:8px}
.pos-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));grid-auto-rows:minmax(78px,96px);align-content:start;gap:8px;max-height:calc(100vh - 190px);overflow:auto;padding-bottom:6px}
.pos-btn{min-height:78px;border-radius:10px;border:1px solid var(--line);background:var(--panel2);color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.65);display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;padding:8px 9px;text-align:left;font-weight:700;font-size:14px;line-height:1.15;-webkit-user-select:none;user-select:none;touch-action:manipulation}
.pos-btn:active{transform:scale(.97)}
/* Il nome usa tutte le righe che il tasto ha davvero: con tre righe fisse due bottiglie
   della stessa casa sembravano uguali, perche' si perdeva proprio la coda del nome. */
.pos-btn .n{overflow:hidden;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical}
.pos-wrap.kiosk .pos-btn .n{-webkit-line-clamp:5}
/* Nomi lunghi: qualche punto in meno di corpo, cosi' ci stanno piu' lettere per riga. */
.pos-btn.lungo{font-size:12.5px;line-height:1.1}
.pos-wrap.kiosk .pos-btn.lungo{font-size:14px}
.pos-btn .p{font-family:var(--mono);font-size:13px;font-weight:600;align-self:flex-end;opacity:.95}
.pos-cart{position:sticky;top:calc(var(--hdr) + 44px);display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:10px;overflow:hidden;max-height:calc(100vh - 110px)}
.pos-cart-head{display:flex;gap:8px;align-items:center;padding:8px 10px;border-bottom:1px solid var(--line);font-size:13.5px}
.pos-lines{flex:1;overflow:auto;min-height:120px}
.pos-line{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:8px;align-items:center;padding:5px 8px;border-bottom:1px solid var(--line)}
.pos-line .t{min-width:0;font-size:13.5px;cursor:pointer}
.pos-line .i{font-family:var(--mono);font-size:13.5px;white-space:nowrap}
.pos-line .v{font-size:12.5px;color:var(--accent);font-weight:600;margin-top:1px}
.pos-qty{display:flex;align-items:center;gap:2px}
.pos-qty button{min-width:32px;min-height:32px;padding:0;font-size:16px}
.pos-qty .q{min-width:22px;text-align:center;font-family:var(--mono);font-weight:700}
.pos-tot{display:flex;justify-content:space-between;align-items:flex-end;padding:8px 10px;border-top:1px solid var(--line)}
.pos-tot .k{font-size:11px;text-transform:uppercase;letter-spacing:.11em;color:var(--muted)}
.pos-tot .v{font-family:var(--mono);font-size:26px;font-weight:600;letter-spacing:-.02em}
.pos-sco{font-size:12px;color:var(--warn)}
.pos-paglist{padding:4px 10px;border-top:1px solid var(--line)}
.pos-pag{display:flex;gap:8px;align-items:center;justify-content:space-between;font-size:13px;padding:3px 0}
/* Correggi il conto (pagamenti/reparti a parita' di incasso) */
.pos-corr h4{margin:12px 0 4px;font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.pos-corr-riga{display:flex;gap:6px;align-items:center;margin:4px 0}
.pos-corr-riga select{flex:1;min-width:0}
.pos-corr-riga input{width:92px;text-align:right}
.pos-corr-tot{font-size:13px;margin:6px 0;color:var(--muted)}
.pos-corr-tot.bad{color:var(--bad);font-weight:600}
.pos-corr-avviso{background:rgba(224,161,58,.14);border:1px solid var(--warn);color:var(--warn);border-radius:8px;padding:6px 10px;margin:6px 0;font-size:13px;line-height:1.4}
.pos-corr-no{background:rgba(224,80,80,.12);border:1px solid var(--bad);color:var(--bad);border-radius:8px;padding:8px 10px;margin:8px 0;font-weight:600}
.pos-corr-rep{margin:10px 0}.pos-corr-rep summary{cursor:pointer;font-size:13px;color:var(--muted)}.pos-corr-rep table{margin-top:6px}
.pos-actions{display:flex;gap:6px;padding:6px 8px 0}
.pos-actions button{flex:1}
.pos-pay{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;padding:8px}
.pos-pay button{min-height:52px;font-size:15px;font-weight:700}
.pos-disp{font-family:var(--mono);font-size:34px;text-align:right;padding:8px 12px;background:var(--panel2);border-radius:8px;margin-bottom:6px;min-height:56px}
.pos-keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:8px}
.pos-keypad button{min-height:54px;font-size:22px;font-family:var(--mono)}
.pos-rapidi{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.pos-rapidi button{flex:1;min-height:40px;font-family:var(--mono)}
.pos-incassa{width:100%;min-height:54px;margin-top:8px;font-size:17px}
.pos-esito{text-align:center}
.pos-esito .big{font-size:18px;font-weight:700}
.pos-esito .v{font-family:var(--mono);font-size:40px;font-weight:600;margin:6px 0}
.pos-esito .resto{font-size:22px;color:var(--ok)}
.pos-esito .resto b{display:block;font-family:var(--mono);font-size:46px;line-height:1.1}
.pos-sw{display:inline-block;width:14px;height:14px;border-radius:4px;border:1px solid var(--line);vertical-align:middle}
.pos-ritiro .pos-res{margin-top:12px;border-radius:12px;padding:22px 16px;text-align:center;background:var(--panel2);border:2px solid var(--line);min-height:120px}
.pos-res .t{font-size:30px;font-weight:800;letter-spacing:.04em}
.pos-res .n{font-size:20px;margin-top:6px}
.pos-res.ok{border-color:var(--ok);background:rgba(0,200,120,.12)}.pos-res.ok .t{color:var(--ok)}
.pos-res.usato{border-color:var(--bad);background:rgba(255,50,80,.14)}.pos-res.usato .t{color:var(--bad)}
.pos-res.no{border-color:var(--warn);background:rgba(255,200,0,.10)}.pos-res.no .t{color:var(--warn)}
.pos-hist{display:flex;gap:8px;font-size:13px;padding:4px 8px;border-left:3px solid var(--line)}
.pos-hist.ok{border-color:var(--ok)}.pos-hist.usato{border-color:var(--bad)}.pos-hist.no{border-color:var(--warn)}
@media(max-width:900px){
  .pos-wrap{grid-template-columns:1fr}
  .pos-grid{max-height:none}
  .pos-cart{position:static;max-height:none}
}
.grid-table td.t{font-family:var(--ui);font-size:13.5px}

/* --- CASSA v2: kiosk a schermo intero (tablet), PIN, layout fisso, modificatori --- */
body.kiosk{overflow:hidden}
body.kiosk #app{display:none}
body.kiosk main#kiosk{padding:8px 10px;max-width:none;height:100vh;height:100dvh;box-sizing:border-box;display:flex;flex-direction:column}
.pos-wrap.kiosk{grid-template-columns:minmax(0,1fr) 400px;grid-template-rows:auto minmax(0,1fr);align-content:start;height:100%;min-height:0}
.pos-wrap.kiosk .pos-sx{display:flex;flex-direction:column;min-height:0;height:100%}
.pos-wrap.kiosk .pos-grid{flex:1;max-height:none;overflow:auto;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));grid-auto-rows:minmax(96px,124px)}
/* icone del set: quadrate, colore ereditato */
.ico{display:inline-flex;width:1.15em;height:1.15em;vertical-align:-.2em;margin-right:.35em}
.ico svg{width:100%;height:100%;display:block}
/* maschera a passi: barra a frecce in basso */
.pren-wiz{display:flex;flex-direction:column;min-height:min(62vh,520px)}
.pren-wiz-body{flex:1;min-height:0}
.pren-steps{display:flex;gap:2px;margin-top:14px;border-top:1px solid var(--line);padding-top:12px}
.pren-step{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:2px;border:1px solid var(--line);background:var(--panel2);color:var(--muted);
  padding:9px 16px 9px 22px;font:600 12.5px var(--sans);white-space:nowrap;overflow:hidden;cursor:pointer;
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 50%,calc(100% - 12px) 100%,0 100%,12px 50%)}
.pren-step:first-child{clip-path:polygon(0 0,calc(100% - 12px) 0,100% 50%,calc(100% - 12px) 100%,0 100%);padding-left:14px;border-radius:8px 0 0 8px}
.pren-step:last-child{clip-path:polygon(0 0,100% 0,100% 100%,0 100%,12px 50%);border-radius:0 8px 8px 0}
.pren-step .t{overflow:hidden;text-overflow:ellipsis}
.pren-step.done{color:var(--ok);border-color:var(--ok)}
.pren-step.on{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.pren-nav{display:flex;gap:8px;margin-top:10px}
.pren-nav button{flex:1;min-height:46px;font-size:15px;font-weight:700}
.pren-pax{display:flex;gap:8px;align-items:center}
.pren-pax input{flex:1;text-align:center;font:700 22px var(--mono);min-height:48px}
.pren-pax button{min-width:52px;min-height:48px;font-size:22px}
.pren-sugg-i{display:flex;gap:8px;align-items:flex-start}
@media(max-width:560px){ .pren-step .t{display:none} .pren-step{padding:9px 10px 9px 18px} }
.pren-sez{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--accent);font-weight:700;border-bottom:1px solid var(--line);padding-bottom:4px;margin:14px 0 8px}
.pren-sez:first-child{margin-top:0}
.pos-mtav.scelto{outline:3px solid var(--accent);outline-offset:2px}
.pren-tab tr.attesa td{background:rgba(224,161,58,.10)}
.pren-tab tr.stornato td{opacity:.5;text-decoration:line-through}
.pren-tab tr.stornato td:last-child,.pren-tab tr.stornato td:nth-child(10){text-decoration:none}
.pren-sugg{display:none;position:absolute;z-index:40;left:0;right:0;top:100%;background:var(--panel);border:1px solid var(--accent);border-radius:10px;box-shadow:0 12px 30px rgba(0,0,0,.5);max-height:260px;overflow:auto}
.pren-sugg.on{display:block}
.pren-sugg-i{padding:8px 10px;cursor:pointer;border-bottom:1px solid var(--line)}
.pren-sugg-i:last-child{border-bottom:0}
.pren-sugg-i:hover{background:var(--panel2)}
.menu-banner-prev{height:120px;border-radius:10px;background:var(--panel2) center/cover no-repeat;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:13px;margin-bottom:8px}
/* Anteprima dell'avviso del menu: verticale, come si vedra' sul telefono. */
.menu-avviso-prev{width:120px;aspect-ratio:3/4;border-radius:10px;background:var(--panel2) center/cover no-repeat;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--muted);font-size:12px;margin:6px 0 8px;border:1px solid var(--line)}
.chip-ck{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;color:var(--muted);white-space:nowrap}
.menu-thumb{width:76px;height:38px;border-radius:6px;background:var(--panel2) center/contain no-repeat;display:inline-flex;align-items:center;justify-content:center;color:var(--muted);font:600 11px var(--mono);cursor:pointer;border:1px dashed var(--line);vertical-align:middle}
.menu-foto{white-space:nowrap}
.menu-tab tr.menu-cat td{background:var(--panel2);text-align:left;padding:8px 10px}
.pos-scan{display:flex;gap:6px;margin:8px 0 4px}
.pos-scan input{flex:1;font-size:17px;min-height:48px;font-family:var(--mono)}
.pos-scan button{min-width:52px;min-height:48px;font-size:18px}
.pos-filtri{gap:6px;flex-wrap:wrap;margin:8px 0}
.pos-tblwrap{overflow-x:auto}
.pos-tconti td,.pos-tconti th{white-space:nowrap}
.pos-tconti tr.stornato td{opacity:.55;text-decoration:line-through}
.pos-tconti tr.stornato td:last-child,.pos-tconti tr.stornato td:nth-child(8){text-decoration:none}
.tag.ok{color:var(--ok);border-color:var(--ok)}
.tag.bad{color:var(--bad);border-color:var(--bad)}
.pos-fast{display:flex;gap:6px;padding:6px 8px 0}
.pos-fast button{flex:1;min-height:44px;font-family:var(--mono);font-weight:700;font-size:15px}
.pos-fast button.ghost{flex:0 0 auto;min-width:52px;font-family:inherit}
.pos-wrap.kiosk .pos-fast button{min-height:52px;font-size:16px}
.pos-pay button small{display:block;font-size:11px;font-weight:500;opacity:.8;line-height:1}
.pos-qmul{margin-left:auto;display:flex;gap:6px;align-self:center}
.pos-qmul .pill{font-family:var(--mono);min-width:44px;text-align:center}
.pos-scontrino{position:relative;background:#fff;color:#111;font-family:var(--mono);font-size:12.5px;line-height:1.35;white-space:pre;overflow-x:auto;text-align:left;padding:14px 16px 18px;margin:12px auto 0;max-width:360px;border-radius:3px;box-shadow:0 10px 28px rgba(0,0,0,.45);border-bottom:6px dotted #ccc}
.pos-stampe{display:flex;gap:14px;overflow-x:auto;align-items:flex-start;padding:10px 4px 6px;margin-top:8px;scroll-snap-type:x proximity}
.mdl.wide .pos-stampe{flex-wrap:wrap;justify-content:center;overflow:visible}
.pos-stampe .pos-scontrino{margin:0;flex:0 0 auto;width:340px;scroll-snap-align:center}
/* Facsimile della comanda: piu' larga del tagliando perche' la si legge di
   corsa e di lato, e con la carta leggermente calda per distinguerla a colpo
   d'occhio dallo scontrino bianco. */
.pos-comanda{width:264px;background:#fffdf5;border-left:4px solid #E7A81E}
.pos-comanda .tg-drink{font-size:15px;letter-spacing:.02em}
.pos-tagliando{flex:0 0 auto;width:236px;background:#fff;color:#111;font-family:var(--mono);font-size:11px;line-height:1.3;text-align:center;padding:12px 10px 16px;border-radius:3px;box-shadow:0 10px 28px rgba(0,0,0,.45);border-bottom:6px dotted #ccc;scroll-snap-align:center;animation:pos-stampa 1s ease-out both}
.pos-tagliando img{max-width:72%;max-height:60px;display:block;margin:0 auto 6px}
.pos-tagliando .brand{font-size:18px;font-weight:800;margin-bottom:4px}
.pos-tagliando .rule{overflow:hidden;white-space:nowrap;letter-spacing:-1px;margin:4px 0}
.pos-tagliando .nome{font-size:21px;font-weight:800;line-height:1.05;margin:6px 0 2px;word-break:break-word}
.pos-tagliando .qta{font-size:15px;font-weight:700;margin-bottom:2px}
.pos-tagliando .bc{display:block;width:88%;height:52px;margin:8px auto 4px;fill:#000}
.pos-tagliando .cod{font-size:10px;color:#666;margin-bottom:6px}
.pos-tagliando .cod span{color:#b33}
.pos-tagliando .prova{display:inline-block;background:#000;color:#fff;font-weight:800;font-size:17px;padding:2px 10px;margin:4px 0}
.pos-scontrino{animation:pos-stampa 1s ease-out both}
@keyframes pos-stampa{from{clip-path:inset(0 0 100% 0);transform:translateY(-10px)}to{clip-path:inset(0 0 0 0);transform:none}}
@media (prefers-reduced-motion:reduce){.pos-tagliando,.pos-scontrino{animation:none}}
.pos-scontrino .sim{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:900 44px/1 var(--sans,sans-serif);color:rgba(200,30,30,.16);transform:rotate(-24deg);letter-spacing:.1em;pointer-events:none}
.pos-wrap.kiosk .pos-cart{position:static;max-height:100%;height:100%}
.pos-wrap.kiosk .pos-btn{min-height:92px;font-size:16px}
.pos-wrap.kiosk .pos-cats .pill{min-height:42px;padding:8px 16px;font-size:14px}
.pos-wrap.kiosk .pos-pay button{min-height:60px;font-size:17px}
.pos-wrap.kiosk .pos-tot .v{font-size:32px}
.pos-wrap.kiosk .pos-line{padding:8px 10px}
.pos-wrap.kiosk .pos-qty button{min-width:38px;min-height:38px}
.pos-postbtn{font-size:14px}
.pos-serata{font-size:12.5px}
.pos-badge.bad{color:var(--bad);border-color:var(--bad)}
.pos-grid.fixed{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:minmax(80px,124px);gap:8px}
.pos-grid.fixed .pos-btn{min-height:0;height:100%}
.pos-btn.fun{background:var(--panel);border-style:dashed;color:var(--txt);text-shadow:none;justify-content:center;align-items:center;text-align:center;font-weight:600}
.pos-btn .opt{opacity:.8;font-weight:400}
.pos-qtybig{margin-bottom:10px;gap:10px}
.pos-qtybig .q{font-size:22px;min-width:36px}
.pos-qtybig button{min-width:44px;min-height:44px;font-size:20px}
.pos-modgrp{margin:8px 0}
.pos-modgrp .k{font-size:11px;text-transform:uppercase;letter-spacing:.11em;color:var(--muted);margin-bottom:4px}
.pos-modopts{display:flex;gap:6px;flex-wrap:wrap}
.pos-modopts button{min-height:44px}
.pos-modopts button .p{font-family:var(--mono);font-size:12px;opacity:.85}
.pos-tip{display:flex;gap:8px;align-items:center;font-size:13px;margin:6px 0;text-transform:none;visibility:hidden}
.ns-sospesa{background:#7a1f1f;color:#fff;text-align:center;padding:8px 12px;font-weight:600;position:sticky;top:0;z-index:50}
.pos-serate{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px;margin:10px 0}
.pos-serate .pos-serata-b{min-height:64px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;padding:10px 14px;text-align:left}
.pos-serate .pos-serata-b span{font-size:12.5px;opacity:.8;font-weight:500}
.pos-pinwrap{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center}
.pos-gestbtn{display:inline-flex;align-items:center;min-height:36px;padding:0 10px;border:1px solid var(--line);border-radius:8px;text-decoration:none;color:var(--txt);font-weight:600;font-size:13px}
.pos-lock{position:fixed;inset:0;z-index:5000;background:var(--bg);display:flex;align-items:center;justify-content:center}
.pos-lock .pos-pinwrap{min-height:0;width:100%}
.pos-pin .logo{display:block;max-width:220px;max-height:84px;margin:0 auto 10px}
.pos-pindisp.wait{opacity:.6}
.pos-pindisp.no{animation:pos-shake .4s}
.pos-pinavviso{margin:0 0 12px;padding:10px 12px;border:1px solid var(--warn,#d9a441);border-radius:10px;background:color-mix(in srgb,var(--warn,#d9a441) 14%,transparent);color:var(--txt);font-size:14px;line-height:1.4;text-align:left}
@keyframes pos-shake{0%,100%{transform:none}20%,60%{transform:translateX(-8px)}40%,80%{transform:translateX(8px)}}
.pos-pin .sub2{font-size:12.5px;color:var(--muted);margin:-4px 0 10px}
.pos-pin{width:320px;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:22px 20px;text-align:center}
.pos-pin .brand{font-size:20px;font-weight:700}
.pos-pin .sub{color:var(--muted);font-size:13px;margin:2px 0 12px}
.pos-pindisp{font-family:var(--mono);font-size:30px;letter-spacing:.3em;min-height:46px;background:var(--panel2);border-radius:8px;padding:6px;margin-bottom:10px}
.pos-pin .pos-keypad button{min-height:58px;font-size:22px}
.mdl .pos-pinwrap{min-height:0}
.mdl .pos-pin{width:100%;border:none;padding:6px 0 0}
.pos-funmenu button{font-size:15px}
@media(max-width:900px){ .pos-wrap.kiosk{grid-template-columns:1fr;height:auto} body.kiosk{overflow:auto} body.kiosk main#kiosk{height:auto} .pos-wrap.kiosk .pos-cart{height:auto} }
.pos-layed{margin-top:10px}
.pos-cell{border:1px dashed var(--line);border-radius:8px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:13px;font-weight:600;cursor:pointer;padding:4px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.6);min-height:0}
.pos-cell:not(.full){color:var(--muted);text-shadow:none;background:transparent}
.pos-cell.full{border-style:solid;background:var(--panel2)}
/* --- Cassa: scelta tavolo dalla mappa e conto tavolo --- */
.pos-tavchip{font-size:14px}
.pos-tavchip .muted{color:inherit;opacity:.8;font-family:var(--mono);font-weight:500}
.pos-tavchip .pos-tavcambia{font-size:11.5px;font-weight:600;opacity:.85;margin-left:4px;text-decoration:underline}
.pos-borsinfo{margin:0 10px 6px}
/* Giro del cameriere (solo carta): senza tavolo il conto e' bloccato su «Scegli un tavolo» */
.pos-serve-tav{padding:22px 14px;text-align:center}
.pos-serve-tav-t{font-size:20px;font-weight:800;margin-bottom:6px}
.pos-wrap.stretto .pos-ling-inc.pos-ling-tav{flex:1 1 auto}
/* Scelta del tavolo, elenco: prenotazioni senza tavolo (in grigio, non si scelgono) e chi ha gia' il tavolo */
.pos-picker .pos-tav-da-t{margin:12px 0 4px;text-transform:uppercase;letter-spacing:.08em;font-size:11px}
.pos-picker .pos-tav-da{width:100%;min-height:44px;display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:8px 12px;border:1px dashed var(--line);border-radius:10px;color:var(--muted);opacity:.6;cursor:not-allowed;background:transparent;margin:4px 0}
.pos-picker .pos-tav-chi{background:var(--panel2);color:var(--txt)}
/* Tavolo in uso ADESSO su un'altra cassa (13/10/2026): in elenco il lucchetto col nome, non toccabile (admin e manager
   possono, e lo prendono loro); in mappa il tavolo e' tratteggiato e la didascalia porta il lucchetto. */
.pos-picker .pos-tav-uso{background:rgba(220,40,60,.18);color:var(--bad);border:1px solid var(--bad)}
.pos-picker button.pos-tav-bloccato{opacity:.55;cursor:not-allowed}
.pos-mtav.in-uso{border-style:dashed;border-color:var(--bad);box-shadow:0 0 0 2px rgba(220,40,60,.35)}
.sala-wrap{width:100%;display:flex;justify-content:center}
.pos-mappa{position:relative;width:100%;aspect-ratio:16/10;background:#0e0f14 center/100% 100% no-repeat;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.pos-mtav{position:absolute;width:36px;height:36px;min-width:0;min-height:0;box-sizing:border-box;border-radius:6px;border:2px solid rgba(255,255,255,.55);background:rgba(14,15,20,.55);color:var(--txt);display:flex;align-items:center;justify-content:center;padding:0;font-weight:800;line-height:1;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.45);text-shadow:0 1px 2px rgba(0,0,0,.8)}
.pos-mcap{position:absolute;transform:translate(-50%,0);pointer-events:none;white-space:nowrap;max-width:110px;overflow:hidden;text-overflow:ellipsis;background:rgba(0,0,0,.65);color:var(--txt);padding:1px 5px;border-radius:4px;font-weight:600}
.pos-mtav.tondo{border-radius:50%}
.pos-mtav .c{font-size:1em}
.pos-mtav .n{font-size:clamp(8px,1vw,11px);font-weight:500;color:var(--muted);max-width:95%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pos-mtav .r{font-size:clamp(8px,1vw,11px);font-family:var(--mono);color:var(--accent)}
.pos-mtav.libero{background:rgba(14,15,20,.25);border-color:rgba(255,255,255,.45)}
.pos-mtav.prenotato{border-color:var(--accent);background:rgba(205,163,73,.35)}
.pos-mtav.entrati{border-color:var(--ok);background:rgba(0,150,90,.25)}
.pos-mtav.aperto{border-color:var(--bad);background:rgba(220,40,60,.28)}
.pos-mtav.aperto .r{color:var(--bad)}
.pos-conto-head{display:flex;gap:12px;align-items:baseline;margin-bottom:8px}
.pos-conto-head .tv{font-size:26px;font-weight:800}
.pos-conto-head .nm{font-size:16px;font-weight:600}
.pos-movs{max-height:34vh;overflow:auto;margin:8px 0;border:1px solid var(--line);border-radius:8px}
.pos-mov{display:grid;grid-template-columns:44px 1fr auto;gap:8px;padding:5px 8px;border-bottom:1px solid var(--line);font-size:13px}
.pos-mov .o{color:var(--muted);font-family:var(--mono)}
.pos-mov .i{font-family:var(--mono)}
.pos-mov .i.neg{color:var(--bad)}.pos-mov .i.pos{color:var(--ok)}
.pos-mov .pos-mov-art{display:block}.pos-mov .pos-mov-mod{display:block;padding-left:14px;font-size:.88em;color:var(--muted)}
.pos-mov.void{opacity:.45;text-decoration:line-through}
.mdl.wide{max-width:760px}

/* SCHERMI BASSI: il tablet della cassa in orizzontale. Con l'altezza di un monitor
   la finestra del pagamento ci sta; con 600 px il tastierino da solo e' piu' alto del
   corpo della finestra, e il tasto "Incassa" finiva sotto il bordo -- invisibile a chi
   non sapeva gia' che c'era. Qui tutta la finestra si stringe: meno bordo, testa e
   piede piu' bassi, tasti piu' piccoli. Vale per ogni finestra della cassa, non solo
   per il pagamento. Si guarda l'ALTEZZA, non la larghezza: e' quella che manca. */
@media (max-height:760px){
  .mdl-back{padding:8px}
  .mdl{max-height:94vh}
  .mdl-head{padding:8px 12px}
  .mdl-head h3{font-size:15px}
  .mdl-body{padding:8px 12px}
  .mdl-foot{padding:6px 12px}
  .mdl-foot button{min-height:40px}   /* si preme col dito: sotto i 40 px si sbaglia */
  .mdl .pos-disp{font-size:26px;min-height:42px;padding:5px 10px;margin-bottom:4px}
  .mdl .pos-keypad{gap:5px;margin-top:6px}
  .mdl .pos-keypad button{min-height:44px;font-size:19px}
  .mdl .pos-rapidi{gap:5px;margin-top:6px}
  .mdl .pos-rapidi button{min-height:34px}
  .mdl .pos-tip{margin:4px 0;font-size:12.5px}
  .mdl .pos-incassa{min-height:46px;margin-top:6px;font-size:16px}
}
/* ...e se c'e' larghezza da vendere (tablet in ORIZZONTALE), il tastierino si
   sposta di fianco invece di allungare la finestra: l'altezza si dimezza e i tasti
   restano grandi quanto bastano al dito. */
@media (max-height:760px) and (min-width:680px){
  .mdl:has(.pos-tast){max-width:560px}
  .pos-tast{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:12px;align-items:start;
    grid-template-areas:"disp pad" "info pad" "tip pad" "rap pad" "ok pad"}
  .pos-tast .pos-disp{grid-area:disp}
  .pos-tast .pos-tast-info{grid-area:info}
  .pos-tast .pos-tip{grid-area:tip}
  .pos-tast .pos-rapidi{grid-area:rap}
  .pos-tast .pos-keypad{grid-area:pad;margin-top:0}
  .pos-tast .pos-keypad button{min-height:48px;font-size:20px}
  .pos-tast .pos-incassa{grid-area:ok;min-height:52px;font-size:17px}
}
.pos-actions2{padding-top:6px}
.pos-actions2 button{min-height:46px;font-size:14.5px;font-weight:700}
.pos-wrap.kiosk .pos-actions2 button{min-height:54px;font-size:16px}

/* --- Marchio del prodotto e avviso di versione -----------------------------
   Il gestionale e' un prodotto (Nightsheet) installato presso il locale: la
   barra in alto resta del locale, il marchio del prodotto sta in piccolo
   accanto e nel piede. La targhetta "beta" dice che il software e' in
   sviluppo attivo. Il marchio usa currentColor, cosi' segue l'accento del
   tema scelto dal locale. */
.ns-mark{flex:0 0 auto;display:inline-flex;color:var(--accent)}
.ns-mark svg{display:block}
.ns-beta{display:inline-flex;align-items:center;flex:0 0 auto;font-family:var(--mono);
  font-size:9.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--accent);border:1px solid var(--accent);border-radius:20px;padding:1px 6px;line-height:1.6}
.ns-foot{display:flex;align-items:center;gap:9px;flex-wrap:wrap;
  padding:14px 14px 26px;margin-top:10px;border-top:1px solid var(--line);
  color:var(--muted);font-size:12px}
.ns-foot b{color:var(--txt);font-weight:600}
.ns-foot__note{opacity:.85;flex:1 1 320px;min-width:0;line-height:1.45}
/* RITORNO ALLA CASSA. Compare solo sul tablet autorizzato come cassa: e' la strada
   indietro per chi ha premuto "Gestionale" e si e' trovato davanti al login. Grande
   quanto un tasto vero, perche' si preme col dito e di fretta. */
.login-cassa{display:flex;flex-direction:column;align-items:center;gap:2px;margin-top:2px;
  min-height:44px;justify-content:center;padding:6px 10px;border:1px solid var(--line);border-radius:10px;
  background:var(--panel2);color:var(--txt);text-decoration:none;font-weight:700;font-size:14px}
.login-dimenticata{background:none;border:0;color:var(--muted);font-size:13px;text-decoration:underline;text-underline-offset:3px;cursor:pointer;padding:6px;margin:2px auto 0;min-height:36px}
.login-dimenticata:hover{color:var(--txt)}
.rec-esito{margin-top:8px;padding:12px 14px;border-radius:var(--r-s);background:var(--panel2);border:1px solid var(--ok);font-size:14px;line-height:1.5;text-align:left}
.rec-contatti{max-width:420px;width:100%;display:flex;flex-direction:column;gap:6px}
.rec-contatti h2{margin:0}.rec-contatti input{width:100%;box-sizing:border-box}
.rec-lab{font-size:13px;color:var(--muted);margin-top:6px}
.rec-contatti .primary{margin-top:12px;min-height:46px}
.login-cassa span{font-weight:500;font-size:11.5px;color:var(--muted);letter-spacing:.06em;text-transform:uppercase}
.login-cassa:active{transform:scale(.98)}
.login-foot{display:flex;align-items:center;justify-content:center;gap:8px;
  margin-top:12px;padding-top:12px;border-top:1px solid var(--line);
  font-size:11.5px;color:var(--muted)}
.login-foot b{color:var(--txt);font-weight:600}
@media(max-width:760px){
  .ns-foot{padding:12px 10px 22px;font-size:11.5px;gap:7px}
  .ns-foot__note{flex-basis:100%}
}
/* Documento commerciale (RT) in cassa */
.pos-fisc{margin:10px 0 0;padding:9px 12px;border-radius:8px;border:1px solid var(--line);background:var(--panel2);font-weight:600}
.pos-fisc.wait{color:var(--muted)}
.pos-fisc.ok{border-color:var(--ok);color:var(--ok)}
.pos-fisc.bad{border-color:var(--bad);color:var(--txt);background:rgba(220,40,60,.12)}
.pos-fiscprob .big{font-size:20px;font-weight:800;margin-bottom:6px}
.pos-battitura{margin-top:10px}
.pos-battitura table{width:100%}

/* Facsimile del biglietto della consegna digitale (stampa a video) */
.pos-biglietto .tg-qr{background:#fff;padding:8px;margin:8px auto 4px;max-width:180px}
.pos-biglietto .tg-qr svg{width:100%;height:auto;display:block}
.pos-biglietto .tg-cod{font-family:var(--mono);font-size:26px;font-weight:800;letter-spacing:.16em;margin:2px 0 6px}
.pos-biglietto .tg-hint{font-size:10.5px;line-height:1.35;opacity:.75}

/* «?» in ogni tab: apre il capitolo dell'help (help.php?tab=…). Fisso in basso a destra. */
.help-tab{position:fixed;right:18px;bottom:18px;z-index:50;width:42px;height:42px;border-radius:50%;background:#E0B64A;color:#0B0B0D;
  font:700 20px/42px system-ui,sans-serif;text-align:center;text-decoration:none;box-shadow:0 4px 14px rgba(0,0,0,.4);opacity:.92}
.help-tab:hover{opacity:1;transform:scale(1.06)}
@media print{.help-tab{display:none}}

/* Comanda a video: lo spazio per appendere e il tavolo in fondo, come sulla carta. */
.pos-comanda .tg-appendi{height:34px;display:flex;align-items:center;justify-content:center;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#9a9a9a;border-bottom:1px dashed #bdbdbd;margin-bottom:8px}
.pos-comanda .tg-vuoto{height:14px}
/* Le opzioni rientrate sotto l'articolo, come i 4 spazi della carta. */
.pos-comanda .tg-opz{text-align:left;padding-left:4ch}
.pos-comanda .tg-dove{margin-top:10px;padding-top:8px;border-top:2px solid #222;text-align:center;line-height:1.1}
.pos-comanda .tg-dove span{display:block;font-size:12px;letter-spacing:.14em}
.pos-comanda .tg-dove b{display:block;font-size:34px;font-weight:800;letter-spacing:.02em}

/* La parola della serata: in cassa accanto alla data, e nella schermata del barman. */
/* Cassa delle chiusure disattivata: la postazione non batte, e lo dice. */
.pos-cassa-spenta{grid-column:1/-1;margin:24px auto;max-width:620px;padding:22px 24px;border:1px solid var(--bad);border-radius:14px;background:var(--panel);display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.pos-cassa-spenta-t{font-size:22px;font-weight:800;color:var(--bad)}
.pos-cassa-spenta-m{font-size:15px;line-height:1.5}
.pos-cassa-spenta button{min-height:48px;padding:0 22px;font-size:15px}
/* Versione dell'app del tablet nella barra della cassa; quando c'e' un aggiornamento diventa un pulsante acceso. */
.pos-appver{font-family:var(--mono);font-size:12px;padding:5px 9px;opacity:.7;white-space:nowrap}
.pos-appver.nuova{opacity:1;background:var(--warn);border:1px solid var(--warn);color:#1a1508;font-family:inherit;font-weight:800;font-size:13.5px;
  padding:9px 14px;border-radius:999px;cursor:pointer;animation:posAppPulsa 1.6s ease-in-out infinite}
@keyframes posAppPulsa{0%,100%{box-shadow:0 0 0 0 rgba(224,182,74,.0)}50%{box-shadow:0 0 0 7px rgba(224,182,74,.28)}}
@media (prefers-reduced-motion:reduce){.pos-appver.nuova{animation:none}}
.pos-appagg{max-width:460px}
.pos-appagg-t{font-size:18px;margin-bottom:8px}
.pos-appagg .hint{margin-top:8px;line-height:1.45}
.pos-parola{display:inline-block;margin-left:8px;padding:3px 10px;border:1px solid var(--accent);border-radius:999px;
  color:var(--accent);font-family:var(--mono);font-size:12.5px;font-weight:700;letter-spacing:.14em;vertical-align:middle}

/* ---------- CLUB FACTS ----------
   La frase del turno, scritta a mano in fondo all'area dei pulsanti: si legge di
   sfuggita e non compete con prodotti, totale e pagamenti. Se i pulsanti arrivano
   fin la' ci passano sopra: e' voluto, non deve rubare spazio al lavoro. */
.pos-sx{position:relative}
/* Nel gestionale (tab Vendita) la griglia dei tasti non arriva in fondo allo schermo:
   la striscia sta IN FILA sotto i pulsanti. A schermo intero invece si appoggia al
   fondo dell'area, dove i tasti eventualmente le passano sopra. */
.pos-fact{display:flex;align-items:flex-end;gap:10px;padding:8px 10px 2px;pointer-events:none}
/* A schermo intero la frase sta CENTRATA nell'area dei pulsanti, un po' staccata dal
   fondo: cosi' non sembra appoggiata al bordo dello schermo. */
.pos-wrap.kiosk .pos-fact{position:absolute;left:2px;right:2px;bottom:22px;z-index:0;padding:10px 12px;
  justify-content:center;align-items:center}
.pos-wrap.kiosk .pos-fact .pos-fact-t{flex:0 1 auto;max-width:min(72ch,74%);text-align:center}
.pos-fact[hidden]{display:none}
.pos-fact-t{flex:1;min-width:0;font-family:var(--scritta),var(--ui);font-size:20px;line-height:1.28;
  color:var(--muted);opacity:.78;letter-spacing:.02em;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pos-fact-k{color:var(--accent);opacity:.9;font-size:12px;letter-spacing:.08em;margin-right:6px;white-space:nowrap;
  text-transform:uppercase;font-family:var(--ui)}
.pos-fact-x{pointer-events:auto;background:none;border:0;color:var(--muted);opacity:.55;font-size:17px;line-height:1;
  padding:4px 6px;border-radius:8px;cursor:pointer}
.pos-fact-x:hover{opacity:1}
/* Sul tastierino del PIN sta FUORI dalla scheda, staccata sotto: si legge aspettando. */
.pos-fact.pin{position:static;margin:18px auto 0;padding:0 8px;justify-content:center;text-align:center;max-width:420px}
.pos-fact.pin .pos-fact-t{-webkit-line-clamp:2;font-size:18px;opacity:.72}
@media (max-width:760px){ .pos-fact{display:none} }   /* schermi stretti: prima il lavoro */
/* TABLET DA CASSA. I 150 px di lato vengono da un monitor da banco: su un tablet da
   dieci pollici diventano tre tasti enormi per riga, con mezzo schermo vuoto sotto.
   Qui i tasti scendono di misura -- una colonna in piu', e si leggono lo stesso -- e
   la frase del turno smette di galleggiare sopra i pulsanti: si mette in fila sotto
   la griglia, dove non copre niente. Il layout fisso non si tocca: le sue colonne le
   ha scelte il locale. Sui monitor grandi (oltre 1400) non cambia nulla. */
@media (max-width:1400px){
  .pos-wrap.kiosk .pos-grid:not(.fixed){grid-template-columns:repeat(auto-fill,minmax(132px,1fr));grid-auto-rows:minmax(84px,106px);gap:7px}
  .pos-wrap.kiosk .pos-btn{font-size:13.5px;padding:7px 8px}
  .pos-wrap.kiosk .pos-btn.lungo{font-size:12.5px}
  .pos-wrap.kiosk .pos-btn .n{-webkit-line-clamp:4}
  .pos-wrap.kiosk .pos-fact{position:static;padding:6px 8px 3px;justify-content:center;align-items:center}
  /* Due righe, non una: una frase lunga tagliata a meta' non si legge. */
  .pos-wrap.kiosk .pos-fact .pos-fact-t{font-size:15px;line-height:1.24;-webkit-line-clamp:2;max-width:min(72ch,96%)}
}
@media (max-width:1100px){
  .pos-wrap.kiosk .pos-grid:not(.fixed){grid-template-columns:repeat(auto-fill,minmax(118px,1fr));grid-auto-rows:minmax(78px,98px);gap:6px}
  .pos-wrap.kiosk .pos-btn{font-size:12.5px;padding:6px 7px;min-height:78px}
  .pos-wrap.kiosk .pos-btn.lungo{font-size:11.5px}
  .pos-wrap.kiosk .pos-btn .p{font-size:12px}
  .pos-wrap.kiosk .pos-btn .n{-webkit-line-clamp:3}
  .pos-wrap.kiosk .pos-fact .pos-fact-t{font-size:13.5px}
}

/* ---------- CASSA: MODIFICATORI (barra, pannello, riga selezionata) ----------
   Si lavora al tatto, su un tablet, al buio. Tre regole:
   1. NIENTE SALTA. La barra sta fra le categorie e i tasti ed e' alta sempre uguale (anche vuota, anche col
      testo guida): i tasti degli articoli non scendono mai sotto il dito. Il pannello di un gruppo non riserva
      spazio e non spinge niente: e' appeso alla barra e si apre SOPRA i tasti, come uno strato. Riservargli
      posto fisso costerebbe una o due file di tasti per sempre, e i modificatori servono a un tocco su dieci.
      Sotto il pannello i tasti sono coperti da un velo: un tocco fuori lo chiude e basta, non batte l'articolo
      che c'e' sotto (un articolo in piu' nel conto costa piu' di un tocco in piu').
   2. BERSAGLI DA 44 px in su per tutto quello che si tocca (pulsanti dei gruppi, − e +, ✕ delle sottorighe).
   3. LO STATO SI LEGGE SEMPRE: sul pulsante del gruppo la scelta o il contatore («4/6»), in rosso se manca.
   Su telefono (una colonna) la barra resta attaccata in alto mentre si scorre fino al conto. */
.pos-area{position:relative;min-width:0}
.pos-wrap.kiosk .pos-area{flex:1;min-height:0;display:flex;flex-direction:column}
.pos-velo{display:none;position:absolute;inset:0;z-index:4;background:rgba(8,7,6,.55);border-radius:10px;cursor:pointer}
.pos-wrap.mod-aperto .pos-velo{display:block}
.pos-modbar{position:relative;z-index:6;height:56px;box-sizing:border-box;margin-bottom:8px;background:var(--panel);border:1px solid var(--line);border-radius:10px}
.pos-modbar.sel{border-color:var(--accent)}
.pos-modbar.inc{border-color:var(--bad)}
.pos-modbar-in{height:100%;display:flex;align-items:center;gap:6px;padding:0 6px;min-width:0}
.pos-mod-guida{color:var(--muted);font-size:13px;padding:0 8px;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pos-mod-chi{flex:0 1 auto;max-width:28%;min-width:72px;padding:0 6px;line-height:1.2;overflow:hidden}
.pos-mod-chi b{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pos-mod-chi span{display:block;font-size:11.5px;color:var(--muted);font-family:var(--mono);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pos-mod-grp{flex:1;min-width:0;height:100%;display:flex;align-items:center;gap:6px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.pos-mod-grp::-webkit-scrollbar{display:none}
.pos-mod-b{flex:0 0 auto;height:44px;min-width:72px;max-width:210px;padding:2px 12px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:1px;text-align:left;line-height:1.1;border-radius:9px;touch-action:manipulation;-webkit-user-select:none;user-select:none}
.pos-mod-b small{font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.pos-mod-b b{font-size:14.5px;font-weight:700;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.pos-mod-b.cnt b{font-family:var(--mono);font-size:16px;letter-spacing:.02em}
.pos-mod-b.aperto{border-color:var(--accent);box-shadow:inset 0 -3px 0 var(--accent)}
.pos-mod-b.on{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.pos-mod-b.on small{color:var(--on-accent);opacity:.85}
.pos-mod-b.bad{border-color:var(--bad)}
.pos-mod-b.bad small,.pos-mod-b.bad b{color:var(--bad)}
.pos-mod-az{flex:0 0 44px;width:44px;height:44px;min-height:44px;padding:0;font-size:19px;border-radius:9px;touch-action:manipulation}
.pos-mod-az.on{border-color:var(--accent);color:var(--accent)}
.pos-mod-az.aperto{box-shadow:inset 0 -3px 0 var(--accent)}
.pos-modbar button:focus-visible,.pos-modpan button:focus-visible,.pos-mods button:focus-visible,.pos-nt:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* il pannello: appeso sotto la barra, sopra i tasti */
.pos-modpan{position:absolute;left:-1px;right:-1px;top:calc(100% + 5px);z-index:7;box-sizing:border-box;max-height:min(62vh,440px);overflow:auto;overscroll-behavior:contain;background:var(--panel);border:1px solid var(--accent);border-radius:10px;box-shadow:0 18px 44px rgba(0,0,0,.65);padding:8px 10px 10px}
.pos-modpan[hidden]{display:none}
.pos-modpan.entra{animation:pos-modpan .13s ease-out both}
@keyframes pos-modpan{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.pos-modpan-h{display:flex;align-items:center;gap:10px;min-height:44px;margin-bottom:8px;flex-wrap:wrap}
.pos-modpan-h b{font-size:16px}
.pos-modpan-h .cnt{font-family:var(--mono);font-size:18px;font-weight:700;color:var(--ok)}
.pos-modpan-h .cnt.bad{color:var(--bad)}
.pos-modpan-h .reg{font-size:12.5px;color:var(--muted)}
.pos-modpan-h .reg.bad{color:var(--bad);font-weight:600}
.pos-modpan-h .grow{flex:1}
.pos-modpan-h button{min-height:44px;min-width:76px;font-size:14.5px;font-weight:700}
.pos-modpan-o{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.pos-modpan-o.qta{grid-template-columns:repeat(auto-fill,minmax(232px,1fr))}
.pos-mod-o{min-height:54px;padding:6px 12px;display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:left;font-size:15px;font-weight:700;line-height:1.15;border-radius:10px;touch-action:manipulation;-webkit-user-select:none;user-select:none}
.pos-mod-o.on{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.pos-mod-o .p,.pos-mod-q .p{font-family:var(--mono);font-size:12.5px;font-weight:600;opacity:.85;white-space:nowrap}
.pos-mod-q{display:grid;grid-template-columns:minmax(0,1fr) 48px 34px 48px;align-items:center;gap:4px;min-height:54px;box-sizing:border-box;padding:3px 3px 3px 12px;border:1px solid var(--line);border-radius:10px;background:var(--panel2)}
.pos-mod-q.on{border-color:var(--accent)}
.pos-mod-q .nm{min-width:0;display:flex;flex-direction:column;gap:2px;font-size:15px;font-weight:700;line-height:1.15}
.pos-mod-q .nm span:first-child{overflow:hidden;text-overflow:ellipsis}
.pos-mod-q .n{text-align:center;font-family:var(--mono);font-size:20px;font-weight:700;color:var(--muted)}
.pos-mod-q.on .n{color:var(--accent)}
.pos-mod-q button{width:48px;height:46px;min-height:46px;padding:0;font-size:24px;font-weight:700;line-height:1;border-radius:9px;background:var(--panel);touch-action:manipulation}
.pos-mod-q button:disabled{opacity:.28}
.pos-ambito{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.pos-ambito button{flex:1 1 130px;min-height:52px;font-size:15.5px;font-weight:700}
.pos-ambito button.ghost{flex:0 0 auto;font-weight:600}
.pos-ambito .hint{flex:1 1 100%;margin:0}
.pos-modpan-n{display:flex;gap:8px;flex-wrap:wrap}
.pos-modpan-n input{flex:1 1 220px;min-height:48px;font-size:16px;padding:8px 12px}
.pos-modpan-n button{min-height:48px;font-size:14.5px;font-weight:600}
/* il conto: riga selezionata, sottorighe dei modificatori, riga incompleta */
.pos-line{cursor:pointer}
.pos-line.sel{background:rgba(205,163,73,.14);background:color-mix(in srgb,var(--accent) 14%,transparent);box-shadow:inset 4px 0 0 var(--accent)}
.pos-line.inc{background:rgba(229,72,77,.10);box-shadow:inset 4px 0 0 var(--bad);outline:1px solid var(--bad);outline-offset:-1px}
.pos-line .t .n{font-weight:600}
.pos-nt{float:right;width:44px;height:44px;min-height:44px;padding:0;margin:-4px -4px -4px 2px;font-size:15px;opacity:.6;touch-action:manipulation}
.pos-line.sel .pos-nt{opacity:1}
.pos-mods{grid-column:2 / -1;min-width:0;margin-top:-3px}
.pos-mod-l{display:flex;align-items:center;gap:6px;min-height:44px;padding-left:2px;border-top:1px dashed var(--line);font-size:13.5px;font-weight:600;color:var(--accent)}
.pos-mod-l .mn{flex:1;min-width:0;overflow-wrap:anywhere}
.pos-mod-l .mp{font-family:var(--mono);font-size:12.5px;font-weight:500;color:var(--muted);white-space:nowrap}
.pos-mod-l button{flex:0 0 44px;width:44px;height:44px;min-height:44px;padding:0;font-size:15px;touch-action:manipulation}
.pos-mod-l.no{color:var(--warn)}
.pos-mod-l.nota{color:var(--muted);font-weight:500;font-style:italic}
.pos-manca{display:flex;align-items:center;min-height:44px;padding:0 2px;border-top:1px dashed var(--bad);color:var(--bad);font-size:13.5px;font-weight:700}
.pos-mods .pos-ambito{padding:6px 0;border-top:1px dashed var(--line)}
/* le righe NON selezionate si leggono soltanto: sottorighe strette e senza pulsanti (si toglie un modificatore dalla riga
   selezionata o dalla barra). Cosi' il conto sta in vista: una bottiglia con tre soft passa da 190 a 110 px circa. */
.pos-line:not(.sel) .pos-mod-l{min-height:22px;border-top:0;font-size:13px}
.pos-line:not(.sel) .pos-mod-l button{display:none}
.pos-line:not(.sel) .pos-manca{min-height:26px;border-top:0}
.pos-line:not(.sel) .pos-mods{margin-top:-6px}
.pos-lines>.hint{padding:4px 10px}
.pos-mods .pos-ambito button{min-height:44px;font-size:14px}
.pos-incavviso{padding:8px 10px;border-top:1px solid var(--bad);background:rgba(229,72,77,.12);color:var(--bad);font-size:12.5px;font-weight:700;line-height:1.3;cursor:pointer}
/* nel gestionale (tab Vendita, non a schermo intero) la griglia ha un'altezza massima: con la barra ne ha 64 px in meno */
@media(min-width:901px){ .pos-wrap.has-mod:not(.kiosk) .pos-grid{max-height:calc(100vh - 254px)} }
/* tablet bassi: la barra tiene i suoi 44 px di bersaglio, il pannello prende meno schermo */
@media (max-height:760px){ .pos-modbar{height:52px;margin-bottom:6px} .pos-modpan{max-height:min(66vh,400px)} .pos-mod-o,.pos-mod-q{min-height:50px} }
/* TELEFONO (una colonna): le parti della colonna dei tasti diventano figlie dirette della pagina della cassa, cosi' la
   barra resta attaccata in alto anche quando si e' scesi fino al conto, e dice quale riga sta cambiando. Due file
   fisse: sopra la riga (nome, ✎, ↺), sotto i gruppi, che scorrono di lato. */
@media(max-width:900px){
  .pos-wrap .pos-sx,.pos-wrap.kiosk .pos-sx{display:contents}
  .pos-modbar{position:sticky;top:var(--pos-stick,0px);z-index:9;height:104px;margin-bottom:0;box-shadow:0 8px 18px rgba(0,0,0,.45)}
  .pos-modbar-in{flex-wrap:wrap;align-content:center;row-gap:4px;padding:4px 6px}
  .pos-mod-chi{order:1;flex:1 1 0;max-width:none}
  .pos-mod-az{order:2}
  .pos-mod-grp{order:3;flex:0 0 100%;height:46px}
  .pos-modbar.vuota .pos-mod-guida{white-space:normal;line-height:1.35}
  .pos-modpan{max-height:calc(100vh - var(--pos-stick,0px) - 150px);max-height:calc(100dvh - var(--pos-stick,0px) - 150px)}
  .pos-modpan-o{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
  .pos-modpan-o.qta{grid-template-columns:1fr}
  .pos-modpan-h{gap:8px}
  .pos-modpan-h .reg{order:9;flex:1 1 100%}   /* la regola va a capo: titolo, contatore e «Fatto» restano sulla prima fila */
  .pos-modpan-h button{min-width:64px}
}
@media (prefers-reduced-motion:reduce){ .pos-modpan.entra{animation:none} }

/* ---------- CASSA: SCHERMO STRETTO (palmare da 5–6 pollici, telefono in piedi) ----------
   Chi la usa e' un venditore volante o un cameriere: in piedi, al buio, spesso con una mano sola. mod_pos.js mette
   la classe `stretto` sulla pagina della cassa sotto i 560 px di larghezza (o con ?stretto=1) e `pos-stretto` sul
   body, per le finestre. TUTTO quello che segue sta sotto una di quelle due classi: tablet e PC non cambiano.
   (Sola eccezione il QR a tutto schermo del drink digitale, .pos-qrpieno, che e' un pezzo nuovo e vale ovunque.)
   1. IL CONTO E' UN FOGLIO. In fondo allo schermo c'e' sempre la LINGUETTA: pezzi, totale grande in monospazio,
      «Incassa». Un tocco (o un dito verso l'alto) e la pagina passa al conto (classe `conto`): via barra in alto,
      categorie e tasti; restano la testata con «Articoli», la barra dei modificatori e il conto intero.
   2. NIENTE SCORRE DI LATO tranne le due strisce fatte per farlo (categorie, gruppi della barra): 3 colonne di
      tasti alti 80 px, i tasti fissi in ordine di lettura.
   3. BERSAGLI: 44 px tutto, 56–64 px quello che si usa di continuo (Incassa, metodi, tastierino). Testo da 14 px.
   4. LO STATO SI LEGGE SEMPRE: totale, riga rossa («N da completare») e rete assente stanno sulla linguetta.
   5. LE FINESTRE salgono dal basso, dove arriva il pollice; tastierino e conto del tavolo a tutto schermo. */
body.pos-stretto.kiosk{overflow:hidden}
body.pos-stretto.kiosk main#kiosk{height:100vh;height:100dvh;padding:0}
body.pos-stretto.pos-conto{overflow:hidden}
.pos-wrap.stretto{display:flex;flex-direction:column;align-items:stretch;gap:0;box-sizing:border-box;width:100%;max-width:560px;margin:0 auto;font-size:15px}
.pos-wrap.stretto>*{min-width:0}
.pos-wrap.stretto.kiosk{height:100%;min-height:0;padding-top:env(safe-area-inset-top,0px)}
body.pos-stretto:not(.kiosk){padding-bottom:calc(86px + env(safe-area-inset-bottom,0px))}   /* nel gestionale la pagina scorre: in fondo resta il posto della linguetta */
.pos-wrap.stretto .pos-sx{display:contents}
.pos-wrap.stretto button,.pos-wrap.stretto .pill,body.pos-stretto .mdl button{touch-action:manipulation}
.pos-wrap.stretto .pos-fact{display:none}
/* l'ordine dei pezzi nella colonna */
.pos-wrap.stretto>.pos-top{order:1}
.pos-wrap.stretto>.pos-fg-testa{order:2}
.pos-wrap.stretto .pos-cats{order:3}
.pos-wrap.stretto .pos-modbar{order:4}
.pos-wrap.stretto .pos-area{order:5}
.pos-wrap.stretto>.pos-cassa-spenta{order:5;margin:16px 10px}
.pos-wrap.stretto>.pos-cart{order:6}
.pos-wrap.stretto>.pos-ling{order:7}
/* BARRA IN ALTO: cassa, Tavolo, Cerca, «⋯» e gli avvisi (rete, cassa o app da aggiornare, ognuno su una riga sua) */
.pos-wrap.stretto .pos-top{flex:0 0 auto;gap:6px;padding:6px 8px;align-items:center;flex-wrap:wrap;background:var(--panel);border-bottom:1px solid var(--line)}
.pos-wrap.stretto .pos-top .pos-largo,.pos-wrap.stretto .pos-top .pos-serata,.pos-wrap.stretto .pos-top .pos-parola,.pos-wrap.stretto .pos-top .pos-oper,
.pos-wrap.stretto .pos-top .pos-lockbtn,.pos-wrap.stretto .pos-top .pos-gestbtn,.pos-wrap.stretto .pos-top .pos-appver:not(.nuova){display:none!important}
.pos-wrap.stretto .pos-top>button,.pos-wrap.stretto .pos-top>select{min-height:48px;font-size:15px;white-space:nowrap}
.pos-wrap.stretto .pos-top>.pos-postbtn,.pos-wrap.stretto .pos-top>select{flex:1 1 0;min-width:64px;overflow:hidden;text-overflow:ellipsis;text-align:left;padding:0 8px;color:var(--txt)}
.pos-wrap.stretto .pos-top>.pos-tavchip{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;font-size:15px}
.pos-wrap.stretto .pos-top>.pos-badge{order:9;flex:1 1 100%;font-size:14px;padding:4px 10px;text-align:center}
.pos-wrap.stretto .pos-top>.grow{display:none}
.pos-wrap.stretto .pos-top>.pos-cercabtn{order:5;display:inline-flex;align-items:center;padding:0 12px;border-color:var(--line);color:var(--txt)}
.pos-wrap.stretto.cerca .pos-top>.pos-cercabtn{border-color:var(--accent);color:var(--accent)}
.pos-wrap.stretto .pos-top>.pos-funbtn{order:6;min-width:52px;padding:0 10px;font-size:24px;line-height:1;border-color:var(--line);color:var(--txt)}
.pos-wrap.stretto .pos-top>.pos-fun-n:not(:empty){order:7;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-width:22px;height:22px;margin:-30px 0 0 -22px;padding:0 5px;border-radius:11px;background:var(--accent);color:var(--on-accent);font:700 14px/1 var(--mono);pointer-events:none;position:relative;z-index:1}
.pos-wrap.stretto .pos-top>.pos-appver.nuova{order:10;flex:1 1 100%;min-height:48px;font-size:15px;border-radius:10px}
.pos-wrap.stretto .pos-top>input.pos-cerca{display:none}
.pos-wrap.stretto.cerca .pos-top>input.pos-cerca{display:block;order:20;flex:1 0 100%;max-width:none!important;min-height:48px;font-size:16px;padding:8px 12px}
/* CATEGORIE: una riga che scorre di lato (il bordo destro sfuma: ce ne sono altre) */
.pos-wrap.stretto .pos-cats{flex:0 0 auto;flex-wrap:nowrap;gap:6px;margin:0;padding:8px 28px 6px 8px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;
  -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 30px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 30px),transparent)}
.pos-wrap.stretto .pos-cats::-webkit-scrollbar{display:none}
.pos-wrap.stretto .pos-cats .pill{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 16px;font-size:15px;white-space:nowrap}
.pos-wrap.stretto .pos-cats .pos-qmul{flex:0 0 auto;margin-left:6px}
.pos-wrap.stretto .pos-cats>.hint{font-size:14px;margin:0}
/* BARRA DEI MODIFICATORI: una fila sola, alta sempre uguale; a sinistra la riga (resta ferma), poi gruppi, nota e «di serie» che scorrono */
.pos-wrap.stretto .pos-modbar{flex:0 0 auto;position:relative;top:auto;z-index:9;height:56px;margin:0 8px 6px;box-shadow:none}
.pos-wrap.stretto:not(.kiosk) .pos-modbar{position:sticky;top:var(--pos-stick,0px);box-shadow:0 8px 18px rgba(0,0,0,.45)}
.pos-wrap.stretto.conto .pos-modbar{margin-top:6px}
.pos-wrap.stretto .pos-modbar-in{flex-wrap:nowrap;align-content:normal;gap:6px;padding:0 6px 0 0;border-radius:9px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.pos-wrap.stretto .pos-modbar-in::-webkit-scrollbar{display:none}
.pos-wrap.stretto .pos-mod-chi{order:0;flex:0 0 auto;width:100px;max-width:none;min-width:0;align-self:stretch;display:flex;flex-direction:column;justify-content:center;padding:0 6px 0 10px;position:sticky;left:0;z-index:1;background:var(--panel);border-radius:9px 0 0 9px;box-shadow:8px 0 8px -6px rgba(0,0,0,.7)}
.pos-wrap.stretto .pos-mod-chi b{font-size:14px}
.pos-wrap.stretto .pos-mod-chi span{font-size:14px}
.pos-wrap.stretto .pos-mod-grp{order:0;flex:0 0 auto;height:100%;overflow:visible}
.pos-wrap.stretto .pos-mod-az{order:0}
.pos-wrap.stretto .pos-mod-b{min-width:84px;max-width:190px}
.pos-wrap.stretto .pos-mod-b small{font-size:14px;letter-spacing:.02em;line-height:1.05}
.pos-wrap.stretto .pos-mod-b b{font-size:15px}
.pos-wrap.stretto .pos-mod-guida{white-space:normal;font-size:14px;line-height:1.3;padding:0 10px}
/* TASTI: tre colonne, alti 80 px (crescono se il nome e' lungo: niente nomi tagliati) */
.pos-wrap.stretto .pos-area{min-width:0}
.pos-wrap.stretto.kiosk .pos-area{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
/* righe a `min-content` (il minimo di 80 px lo da' il tasto): con `minmax(80px,auto)` a schermo intero, dove la griglia ha
   un'altezza definita e scorre, le righe restavano a 80 px e il prezzo di un nome lungo usciva dal tasto */
.pos-wrap.stretto .pos-area .pos-grid{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:min-content;gap:6px;max-height:none;padding:0 8px 10px;align-content:start}
.pos-wrap.stretto.kiosk .pos-area .pos-grid{flex:1 1 auto;min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.pos-wrap.stretto:not(.kiosk) .pos-area .pos-grid{overflow:visible}
.pos-wrap.stretto .pos-area .pos-btn{min-height:80px;height:auto;padding:8px 8px 7px;font-size:14px;line-height:1.15}
.pos-wrap.stretto .pos-area .pos-btn.lungo{font-size:14px;line-height:1.12}
.pos-wrap.stretto .pos-area .pos-btn .n{flex:0 0 auto;-webkit-line-clamp:6;overflow-wrap:anywhere;margin-bottom:4px}
.pos-wrap.stretto .pos-area .pos-btn .p{font-size:14px}
.pos-wrap.stretto .pos-area .pos-btn.fun{font-size:14.5px}
.pos-wrap.stretto .pos-area .pos-grid>.hint{grid-column:1 / -1;font-size:14px}
/* LINGUETTA: sempre in fondo. A sinistra il conto (si apre), a destra Incassa */
.pos-wrap.stretto>.pos-ling{display:flex;flex-wrap:wrap;align-items:stretch;gap:8px;flex:0 0 auto;box-sizing:border-box;padding:8px 8px calc(8px + env(safe-area-inset-bottom,0px));background:var(--panel);border-top:1px solid var(--line);box-shadow:0 -10px 24px rgba(0,0,0,.5)}
.pos-wrap.stretto:not(.kiosk)>.pos-ling{position:fixed;left:0;right:0;bottom:0;z-index:30;max-width:560px;margin:0 auto}
.pos-wrap.stretto .pos-ling-rete{flex:0 0 100%;padding:0 4px;text-align:center;font-size:14px;font-weight:700;line-height:1.25;color:var(--bad);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pos-wrap.stretto .pos-ling-conto{flex:1 1 0;min-width:0;min-height:62px;display:flex;align-items:center;gap:12px;padding:5px 12px;text-align:left;border-radius:12px;background:var(--panel2);border:1px solid var(--line)}
.pos-wrap.stretto .pos-ling-conto .su{flex:0 0 auto;width:10px;height:10px;margin:6px 2px 0 4px;border-left:2px solid var(--accent);border-top:2px solid var(--accent);transform:rotate(45deg)}
.pos-wrap.stretto .pos-ling-conto .sx{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:0;line-height:1.15}
.pos-wrap.stretto .pos-ling-conto .k{font-size:14px;font-weight:600;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pos-wrap.stretto .pos-ling-conto .k b{color:var(--bad);font-weight:700}
.pos-wrap.stretto .pos-ling-conto .v{font-family:var(--mono);font-size:27px;font-weight:700;letter-spacing:-.02em;line-height:1.1;white-space:nowrap;color:var(--txt)}
.pos-wrap.stretto .pos-ling-conto .v small{font-family:var(--ui);font-size:14px;font-weight:600;letter-spacing:0;color:var(--warn)}
.pos-wrap.stretto .pos-ling-conto.vuoto .v{color:var(--muted)}
.pos-wrap.stretto .pos-ling-conto.inc{border-color:var(--bad);background:rgba(229,72,77,.10)}
.pos-wrap.stretto .pos-ling-inc{flex:0 0 auto;min-width:112px;min-height:62px;padding:0 14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;font-size:19px;font-weight:800;line-height:1.1;border-radius:12px}
.pos-wrap.stretto .pos-ling-inc small{font-size:14px;font-weight:600;opacity:.85}
.pos-wrap.stretto .pos-ling-inc:not(.primary){border-color:var(--accent);color:var(--accent)}
.pos-wrap.stretto .pos-ling-inc.fermo{opacity:.5}
.pos-wrap.stretto .pos-ling button:focus-visible,.pos-wrap.stretto .pos-fg-giu:focus-visible{outline:2px solid var(--txt);outline-offset:2px}
/* IL CONTO APERTO: testata («Articoli» richiude), barra dei modificatori, righe, totale, azioni, pagamenti */
.pos-wrap.stretto.conto>.pos-top,.pos-wrap.stretto.conto .pos-cats,.pos-wrap.stretto.conto .pos-area,.pos-wrap.stretto.conto>.pos-ling{display:none}
.pos-wrap.stretto.conto:not(.kiosk){position:fixed;left:0;right:0;top:0;bottom:0;z-index:70;background:var(--bg)}
.pos-wrap.stretto.conto>.pos-fg-testa{display:flex;align-items:center;gap:10px;flex:0 0 auto;position:relative;padding:14px 8px 8px;background:var(--panel);border-bottom:1px solid var(--line)}
.pos-wrap.stretto .pos-fg-testa::before{content:"";position:absolute;top:5px;left:50%;width:38px;height:4px;margin-left:-19px;border-radius:2px;background:var(--line)}
.pos-wrap.stretto .pos-fg-giu{flex:0 0 auto;display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 14px 0 12px;font-size:15px;font-weight:700}
.pos-wrap.stretto .pos-fg-giu .giu{width:9px;height:9px;margin-top:-5px;border-right:2px solid var(--accent);border-bottom:2px solid var(--accent);transform:rotate(45deg)}
.pos-wrap.stretto .pos-fg-t{flex:1 1 auto;min-width:0;line-height:1.2}
.pos-wrap.stretto .pos-fg-t b{display:block;font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pos-wrap.stretto .pos-fg-t span{display:block;font-size:14px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pos-wrap.stretto .pos-fg-testa .tag{font-size:14px;padding:4px 10px}
.pos-wrap.stretto:not(.conto)>.pos-cart{display:none}
.pos-wrap.stretto.conto>.pos-cart{display:flex;flex:1 1 auto;min-height:0;position:static;height:auto;max-height:none;border:0;border-radius:0}
.pos-wrap.stretto.fg-entra>.pos-fg-testa,.pos-wrap.stretto.fg-entra>.pos-cart{animation:nsm-su .2s cubic-bezier(.2,.8,.2,1) both}
.pos-wrap.stretto .pos-cart-head{display:none}
.pos-wrap.stretto .pos-cart-head.tav{display:flex;flex-wrap:nowrap;gap:8px;padding:4px 8px 4px 10px;font-size:15px}
.pos-wrap.stretto .pos-cart-head.tav>b,.pos-wrap.stretto .pos-cart-head.tav>.muted{display:none}   /* tavolo e nome stanno gia' nella testata */
.pos-wrap.stretto .pos-cart-head.tav .tag{order:-1;font-size:14px;white-space:nowrap}
.pos-wrap.stretto .pos-cart-head.tav button{min-height:44px;min-width:48px;font-size:15px;border-color:var(--line);color:var(--txt)}
.pos-wrap.stretto .pos-lines{min-height:92px;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.pos-wrap.stretto .pos-lines>.hint{padding:10px 12px;font-size:14px}
/* una riga: − n + | nome | importo | omaggio. La nota non ha il suo tasto sulla riga: sta sulla barra (✎) e sotto il nome */
.pos-wrap.stretto .pos-line{grid-template-columns:auto minmax(0,1fr) auto auto;gap:6px;padding:6px 6px 6px 4px}
.pos-wrap.stretto .pos-line .t{font-size:15px;line-height:1.2}
.pos-wrap.stretto .pos-line .t .n{overflow-wrap:anywhere}
.pos-wrap.stretto .pos-line .i{font-size:15px;text-align:right}
.pos-wrap.stretto .pos-line .v{font-size:14px}
.pos-wrap.stretto .pos-line .pos-nt{display:none}
.pos-wrap.stretto .pos-qty{gap:0}
.pos-wrap.stretto .pos-qty button{min-width:44px;min-height:44px;font-size:22px;border-color:var(--line);color:var(--txt)}
.pos-wrap.stretto .pos-qty .q{min-width:26px;font-size:17px}
.pos-wrap.stretto .pos-line .pos-om{min-width:44px;min-height:44px;padding:0}
.pos-wrap.stretto .pos-omaggio{font-size:14px}
.pos-wrap.stretto .pos-mods{grid-column:1 / -1;padding-left:10px;margin-top:0}
.pos-wrap.stretto .pos-line:not(.sel) .pos-mods{margin-top:-2px}
.pos-wrap.stretto .pos-mod-l{font-size:15px}
.pos-wrap.stretto .pos-line:not(.sel) .pos-mod-l{font-size:14px;min-height:22px}
.pos-wrap.stretto .pos-mod-l .mp{font-size:14px}
.pos-wrap.stretto .pos-mod-l button{flex:0 0 48px;width:48px;font-size:17px;border-color:var(--line);color:var(--txt)}
.pos-wrap.stretto .pos-manca{font-size:14.5px}
.pos-wrap.stretto .pos-mods .pos-ambito button{min-height:48px;font-size:15px}
.pos-wrap.stretto .pos-incavviso{padding:10px 12px;font-size:14px}
.pos-wrap.stretto .pos-tot{padding:4px 12px 2px;align-items:center}
.pos-wrap.stretto .pos-tot .k{font-size:14px;letter-spacing:.06em}
.pos-wrap.stretto .pos-tot .v{font-size:30px;font-weight:700}
.pos-wrap.stretto .pos-sco,.pos-wrap.stretto .pos-borsinfo{font-size:14px}
.pos-wrap.stretto .pos-borsinfo{margin:0 12px 2px;line-height:1.3}
.pos-wrap.stretto .pos-paglist{padding:2px 10px}
.pos-wrap.stretto .pos-paglist .hint{font-size:14px;margin:0 0 2px}
.pos-wrap.stretto .pos-pag{font-size:15px;padding:0}
.pos-wrap.stretto .pos-pag button{min-width:44px;min-height:44px;font-size:17px}
.pos-wrap.stretto .pos-actions{gap:6px;padding:6px 8px 0}
.pos-wrap.stretto .pos-actions button{flex:1 1 auto;min-width:0;min-height:46px;padding:0 4px;font-size:14px;font-weight:600;white-space:nowrap;border-color:var(--line);color:var(--txt)}
.pos-wrap.stretto .pos-actions2 button{min-height:48px;font-size:15px;font-weight:700}
.pos-wrap.stretto .pos-fast{gap:6px;padding:6px 8px 0}
.pos-wrap.stretto .pos-fast button{min-width:0;min-height:52px;padding:0 4px;font-size:15px}
.pos-wrap.stretto .pos-fast button.ghost{flex:0 0 auto;min-width:76px;padding:0 8px;font-size:14px;border-color:var(--line);color:var(--txt)}
/* i metodi: due per riga da 60 px; quando sono tre giusti (Contanti, POS, Altro) stanno in una riga sola */
.pos-wrap.stretto .pos-cart>.pos-pay{grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;padding:6px 8px calc(8px + env(safe-area-inset-bottom,0px))}
.pos-wrap.stretto .pos-cart>.pos-pay>button{grid-column:span 3;min-width:0;min-height:60px;padding:0 4px;font-size:16.5px}
.pos-wrap.stretto .pos-cart>.pos-pay.tre>button{grid-column:span 2;font-size:15.5px}
.pos-wrap.stretto .pos-pay button small,body.pos-stretto .mdl .pos-pay button small{font-size:14px}
/* IL PANNELLO DI UN GRUPPO: un foglio dal basso, sopra tutto; dietro, un velo a tutto schermo (un tocco fuori chiude e basta).
   La nota invece scende dall'alto: in basso finirebbe sotto la tastiera del telefono. */
.pos-wrap.stretto .pos-velo{display:none!important}
.pos-wrap.stretto.mod-aperto>.pos-velo-s{display:block;position:fixed;left:0;right:0;top:0;bottom:0;z-index:80;background:rgba(8,7,6,.66);cursor:pointer}
.pos-wrap.stretto.mod-aperto .pos-modbar{z-index:81}
.pos-wrap.stretto .pos-modpan{position:fixed;left:0;right:0;top:auto;bottom:0;max-width:560px;margin:0 auto;max-height:82vh;max-height:82dvh;border-width:1px 0 0;border-radius:16px 16px 0 0;padding:10px 12px calc(12px + env(safe-area-inset-bottom,0px));box-shadow:0 -14px 40px rgba(0,0,0,.6)}
.pos-wrap.stretto .pos-modpan.entra{animation:nsm-su .18s cubic-bezier(.2,.8,.2,1) both}
.pos-wrap.stretto .pos-modpan[data-k$=":nota"]{top:0;bottom:auto;border-width:0 0 1px;border-radius:0 0 16px 16px;padding:calc(10px + env(safe-area-inset-top,0px)) 12px 12px;box-shadow:0 14px 40px rgba(0,0,0,.6);animation:none}
.pos-wrap.stretto .pos-modpan-h{gap:8px;margin-bottom:10px}
.pos-wrap.stretto .pos-modpan-h b{font-size:17px}
.pos-wrap.stretto .pos-modpan-h .reg{order:9;flex:1 1 100%;font-size:14px}
.pos-wrap.stretto .pos-modpan-h button{min-height:48px;min-width:72px;font-size:15px}
.pos-wrap.stretto .pos-modpan-o{grid-template-columns:repeat(2,minmax(0,1fr))}
.pos-wrap.stretto .pos-modpan-o.qta{grid-template-columns:minmax(0,1fr)}
.pos-wrap.stretto .pos-mod-o{min-height:56px;font-size:15.5px}
.pos-wrap.stretto .pos-mod-o span:first-child{min-width:0;overflow-wrap:anywhere}
.pos-wrap.stretto .pos-mod-o .p,.pos-wrap.stretto .pos-mod-q .p{font-size:14px}
.pos-wrap.stretto .pos-mod-q{grid-template-columns:minmax(0,1fr) 52px 36px 52px;min-height:58px}
.pos-wrap.stretto .pos-mod-q .nm{font-size:15.5px}
.pos-wrap.stretto .pos-mod-q button{width:52px;height:48px;min-height:48px}
.pos-wrap.stretto .pos-modpan .pos-ambito button{min-height:56px;font-size:16px}
.pos-wrap.stretto .pos-modpan .hint{font-size:14px}
.pos-wrap.stretto .pos-modpan-n input{flex:1 1 100%;min-height:52px;font-size:16px}
.pos-wrap.stretto .pos-modpan-n button{flex:1 1 auto;min-height:48px;font-size:15px}
/* LE FINESTRE (stanno nel body): salgono dal basso a tutta larghezza; «Chiudi» in fondo non e' il tasto principale */
body.pos-stretto .mdl-back{padding:0;align-items:flex-end}
body.pos-stretto .mdl{width:100%;max-width:560px;max-height:100vh;max-height:100dvh;border-radius:16px 16px 0 0;border-bottom:0;font-size:15px}
body.pos-stretto .mdl.wide,body.pos-stretto .mdl.pos-pieno{max-width:560px;height:100vh;height:100dvh;border:0;border-radius:0}
body.pos-stretto .mdl-head{padding:6px 6px 6px 14px}
body.pos-stretto .mdl.wide .mdl-head,body.pos-stretto .mdl.pos-pieno .mdl-head{padding-top:calc(6px + env(safe-area-inset-top,0px))}
body.pos-stretto .mdl-head h3{font-size:17px;overflow-wrap:anywhere}
body.pos-stretto .mdl-head button{flex:0 0 auto;min-width:48px;min-height:48px;font-size:19px;color:var(--txt)}
body.pos-stretto .mdl-body{flex:1 1 auto;padding:10px 12px;overscroll-behavior:contain}
body.pos-stretto .mdl-foot{padding:8px 12px calc(8px + env(safe-area-inset-bottom,0px))}
body.pos-stretto .mdl-foot button{flex:1 1 auto;min-height:48px;font-size:15px}
body.pos-stretto .mdl-foot button.primary:only-child{background:var(--panel2);border-color:var(--line);color:var(--txt);font-weight:600}
body.pos-stretto .mdl-body button{min-height:44px;font-size:15px}
body.pos-stretto .mdl-body button.pos-mtav{min-height:0;font-size:13.5px}   /* i tavoli della mappa hanno la loro misura */
body.pos-stretto .mdl-body button small{font-size:14px}
body.pos-stretto .mdl .pos-keypad button{min-height:56px;font-size:24px}
body.pos-stretto .mdl .hint{font-size:14px}
body.pos-stretto .mdl .field label{font-size:14px;letter-spacing:.04em}
body.pos-stretto .mdl input:not([type=checkbox]):not([type=radio]),body.pos-stretto .mdl select{min-height:48px;font-size:16px}
body.pos-stretto .mdl .row button,body.pos-stretto .mdl .linelist button{min-height:48px;font-size:15px}
body.pos-stretto .mdl .tcard .row{gap:2px}
body.pos-stretto .mdl .tcard .row button{padding:0 8px}
body.pos-stretto .mdl .tag{font-size:14px}
body.pos-stretto .mdl .pos-funmenu button{min-height:52px!important;font-size:15.5px;margin:3px 0!important}
body.pos-stretto .pos-fun-info{margin:0 0 6px;font-size:14px;line-height:1.5;color:var(--muted);overflow-wrap:anywhere}
body.pos-stretto .pos-fun-info b{color:var(--txt)}
body.pos-stretto .pos-fun-info .pos-parola{font-size:14px;margin-left:4px}
body.pos-stretto .mdl .pos-qtybig button{min-width:52px;min-height:52px}
body.pos-stretto .mdl .pos-righe{font-size:14px}
body.pos-stretto .mdl .pos-pin{font-size:15px}
body.pos-stretto .mdl .pos-pin .sub,body.pos-stretto .mdl .pos-pin .sub2{font-size:14px}
/* INCASSO: metodi su due colonne da 64 px, tagli e tastierino sotto */
body.pos-stretto .mdl .pos-pay{grid-template-columns:1fr 1fr;gap:8px}
body.pos-stretto .mdl .pos-pay>button{min-height:64px!important;font-size:18px}
body.pos-stretto .mdl .pos-pay>.hint{grid-column:1 / -1}
body.pos-stretto .mdl .pos-fast{gap:8px;padding:0}
body.pos-stretto .mdl .pos-fast button{min-width:0;min-height:56px;padding:0 4px;font-size:16px}
body.pos-stretto .mdl .pos-fast button.ghost{flex:0 0 auto;min-width:76px;padding:0 8px;font-size:15px;border-color:var(--line);color:var(--txt)}
body.pos-stretto .mdl .pos-paglist{padding:4px 0}
body.pos-stretto .mdl .pos-pag{font-size:15px}
body.pos-stretto .mdl .pos-pag button{min-width:44px;min-height:44px}
body.pos-stretto .mdl.pos-m-pagatav .mdl-body>div>button.primary{min-height:60px!important;font-size:17px}
/* TASTIERINO a tutto schermo: importo e resto in alto, tasti e «Incassa» in fondo sotto il pollice */
body.pos-stretto .mdl.pos-m-tast .mdl-foot{display:none}
body.pos-stretto .mdl.pos-m-tast .mdl-body{display:flex;flex-direction:column;padding-bottom:calc(10px + env(safe-area-inset-bottom,0px))}
body.pos-stretto .pos-tast{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
body.pos-stretto .pos-tast .pos-disp{font-size:40px;line-height:1.2;min-height:64px;padding:8px 14px;margin:0 0 6px}
body.pos-stretto .pos-tast .pos-tast-info{margin:0;min-height:30px;font-size:16px;line-height:1.5;color:var(--txt)}
body.pos-stretto .pos-tast .pos-tast-info b{font-family:var(--mono);font-size:18px}
body.pos-stretto .pos-tast .pos-tast-info b.ok{font-size:24px;color:var(--ok)}
body.pos-stretto .pos-tast .pos-tast-info .bad{color:var(--bad);font-weight:700}
body.pos-stretto .pos-tast .pos-tip{min-height:44px;margin:0;font-size:15px}
body.pos-stretto .pos-tast .pos-tip input{width:22px;height:22px}
body.pos-stretto .pos-tast .pos-rapidi{gap:6px;margin-top:2px}
body.pos-stretto .pos-tast .pos-rapidi button{flex:1 1 30%;min-height:48px;font-size:15px;border-color:var(--line);color:var(--txt)}
body.pos-stretto .pos-tast .pos-keypad{flex:0 1 auto;grid-auto-rows:minmax(56px,76px);gap:6px;margin-top:auto;padding-top:10px}
body.pos-stretto .pos-tast .pos-keypad button{min-height:56px;font-size:26px}
body.pos-stretto .pos-tast .pos-incassa{flex:0 0 auto;min-height:64px;margin-top:8px;font-size:20px;font-weight:800}
/* ESITO, TAVOLI */
body.pos-stretto .mdl .pos-esito .hint{font-size:14px}
body.pos-stretto .mdl .pos-esito .row button{min-height:56px;font-size:16px}
body.pos-stretto .mdl .pos-fisc{font-size:14.5px}
body.pos-stretto .mdl.wide .mdl-body{display:flex;flex-direction:column}
body.pos-stretto .mdl.wide .mdl-body>*{flex:0 0 auto}
body.pos-stretto .mdl .pos-picker .row{flex-wrap:nowrap}
body.pos-stretto .mdl .pos-picker .linelist button{min-height:56px!important;font-size:15.5px}
body.pos-stretto .mdl .pos-picker .pills .pill{min-height:44px;display:inline-flex;align-items:center;padding:0 14px;font-size:15px}
body.pos-stretto .mdl.wide .mdl-body>.pos-conto{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
body.pos-stretto .pos-conto-head{flex-wrap:wrap;gap:2px 12px;margin-bottom:4px}
body.pos-stretto .pos-conto .recon{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
body.pos-stretto .pos-conto .stat{flex:1 1 30%;min-width:0;padding:6px 8px;gap:2px}
body.pos-stretto .pos-conto .stat .k{font-size:14px;line-height:1.2;text-transform:none;letter-spacing:0}
body.pos-stretto .pos-conto .stat .v{font-size:17px}
body.pos-stretto .pos-conto .stat:last-child{flex:1 1 100%;flex-direction:row;align-items:center;justify-content:space-between}
body.pos-stretto .pos-conto .stat:last-child .k{font-size:15px;font-weight:700;color:var(--txt)}
body.pos-stretto .pos-conto .stat:last-child .v{margin-top:0;font-size:26px}
body.pos-stretto .pos-conto .pos-movs{flex:1 1 auto;min-height:76px;max-height:none;margin:8px 0 0;overscroll-behavior:contain}
body.pos-stretto .pos-conto .pos-movs>.hint{padding:8px 10px}
body.pos-stretto .pos-conto .pos-mov{grid-template-columns:48px minmax(0,1fr) auto;padding:8px 10px;font-size:14.5px}
body.pos-stretto .pos-conto .pos-mov .pos-mov-mod{font-size:14px}
body.pos-stretto .pos-conto>.pos-pay{flex:0 0 auto;padding:8px 0 0!important}
/* i messaggi escono IN ALTO: in basso ci sono sempre il totale e i tasti che contano (linguetta, pagamenti, «Registra»); nel gestionale i pulsanti tondi in basso lasciano il posto alla linguetta */
body.pos-stretto .toast{top:calc(8px + env(safe-area-inset-top,0px));bottom:auto;transform:translateX(-50%) translateY(-60px);width:max-content;max-width:calc(100vw - 16px);box-sizing:border-box;font-size:15px;line-height:1.3;text-align:center}
body.pos-stretto .toast.show{transform:translateX(-50%) translateY(0)}
body.pos-stretto .help-tab,body.pos-stretto .as-fab{bottom:calc(96px + env(safe-area-inset-bottom,0px))}
/* «Metti il gestionale sulla Home» sta fisso in fondo, proprio sopra la linguetta: mentre si vende non si mostra (torna nelle altre tab) */
body.pos-stretto .ns-installa{display:none}
@media (prefers-reduced-motion:reduce){ .pos-wrap.stretto.fg-entra>.pos-fg-testa,.pos-wrap.stretto.fg-entra>.pos-cart,.pos-wrap.stretto .pos-modpan.entra{animation:none} }
/* DRINK DIGITALE: il QR a tutto schermo da far inquadrare al cliente. Fondo bianco pieno (al buio un QR su fondo scuro
   non si legge), del biglietto restano solo QR e codice corto. Vale su ogni schermo: dove non c'e' la stampante dei
   tagliandi lo mostra anche il tablet. */
.pos-qrpieno{position:fixed;left:0;right:0;top:0;bottom:0;z-index:1200;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;gap:8px;overflow:auto;
  padding:calc(14px + env(safe-area-inset-top,0px)) 16px calc(14px + env(safe-area-inset-bottom,0px));background:#fff;color:#111;text-align:center;font-family:var(--ui)}
.pos-qrp-t{flex:0 0 auto}
.pos-qrp-t b{display:block;font-family:var(--display);font-size:23px;font-weight:800;line-height:1.15;letter-spacing:-.01em}
.pos-qrp-t span{display:block;margin-top:4px;font-size:16px;font-weight:600;color:#444}
.pos-qrpieno .pos-biglietto{flex:1 1 auto;min-height:0;width:100%;max-width:none;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0;background:none;border:0;border-radius:0;box-shadow:none;animation:none}
.pos-qrpieno .pos-biglietto>*{display:none}
.pos-qrpieno .pos-biglietto>.tg-qr{display:block;box-sizing:border-box;width:min(100%,54vh);max-width:440px;margin:0;padding:0}
.pos-qrpieno .pos-biglietto>.tg-cod{display:block;margin:2px 0 0;font-size:30px;color:#111}
.pos-qrp-b{flex:0 0 auto;display:flex;flex-wrap:wrap;justify-content:center;gap:2px 14px;max-height:66px;overflow:hidden;font-size:16px;font-weight:700;line-height:1.35}
.pos-qrp-p{flex:0 0 auto;width:100%;max-width:520px;display:flex;flex-direction:column;gap:8px}
.pos-qrp-resto{font-size:18px;font-weight:700;color:#0a6b3c}
.pos-qrp-resto b{font-family:var(--mono);font-size:26px}
.pos-qrp-ok{width:100%;min-height:64px;border:0;border-radius:12px;background:#111;color:#fff;font-size:20px;font-weight:800;touch-action:manipulation}
.pos-qrp-ok:hover{background:#111;border:0}
.pos-qrp-ok:focus-visible{outline:3px solid #b8860b;outline-offset:3px}

/* OCCHIO SULLE PASSWORD — una password che non si puo' rileggere si sbaglia, e
   sui tablet si sbaglia sempre. Lo mette app.js su ogni campo, anche su quelli
   creati dopo: qui c'e' solo il vestito. */
.pw-wrap{position:relative;display:inline-flex;align-items:stretch}
.pw-wrap > input{width:100%;padding-right:32px}
.pw-occhio{position:absolute;right:1px;top:50%;transform:translateY(-50%);width:28px;height:28px;
  display:flex;align-items:center;justify-content:center;background:none;border:0;padding:0;margin:0;
  color:var(--muted);font-size:13px;line-height:1;cursor:pointer;border-radius:8px;opacity:.75}
.pw-occhio:hover{opacity:1;color:var(--txt);background:transparent;border:0}
.pw-occhio:focus-visible{outline:2px solid var(--accent);outline-offset:1px}

/* ===== TAB UTENTI (mod_utenti.js): righe pulite + finestra a pagine ===== */
.dip-sez{grid-column:1/-1;font-weight:700;color:var(--accent);margin-top:10px;text-transform:uppercase;font-size:12px;letter-spacing:.5px}
.panel.utenti{padding:14px 14px 10px}
.utesta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.utesta h3{margin:0;flex:1;display:flex;align-items:baseline;gap:6px}
.utesta .ucnt{font-family:var(--mono);font-size:13px;color:var(--muted);font-weight:500}
.uazioni{display:flex;gap:6px;flex-wrap:wrap}
.ufiltri{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.ufiltri .usrc{flex:1 1 220px;min-width:0}
.ufiltri select{flex:0 1 auto;min-width:0}
.ubanner{background:#3a2f14;border:1px solid var(--warn);color:#f4d38a;border-radius:10px;padding:10px 12px;margin:0 0 10px;font-weight:600}
.ulist{display:flex;flex-direction:column;gap:4px}
.usez{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.11em;padding:10px 4px 2px}
.usez:first-child{padding-top:0}
.urow{display:flex;align-items:center;gap:12px;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r);background:var(--panel2);cursor:pointer;min-height:56px;transition:border-color .12s,background .12s}
.urow:hover,.urow:focus-visible{border-color:var(--accent);outline:none}
.urow.attesa{border-color:var(--warn);background:#2a2413}
.urow.off{opacity:.62}
.uava{flex:0 0 38px;width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;letter-spacing:.02em;font-family:var(--display);color:#fff;background:#4b4b58}
.uava.f-dir{background:#8b6b1f}.uava.f-cassa{background:#2f6f5a}.uava.f-porta{background:#2e5a8a}.uava.f-bar{background:#5a3f8a}.uava.f-sala{background:#7a4a2e}.uava.f-pr{background:#a13c66}.uava.f-stage{background:#3c7a8a}.uava.f-attesa{background:#8a6a1a}.uava.f-tec{background:#3a3a44;color:var(--muted)}
.umain{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.uname{font-weight:700;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.uname .uuser{font-family:var(--mono);font-weight:500;font-size:12px;color:var(--muted);margin-left:8px}
.umeta{display:flex;gap:5px;flex-wrap:wrap;align-items:center}
.ubadge{font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;text-transform:uppercase;letter-spacing:.06em;background:rgba(255,255,255,.08);color:var(--txt)}
.ubadge.f-dir{background:rgba(205,163,73,.22);color:#f0d38a}.ubadge.f-cassa{background:rgba(63,160,106,.2);color:#8fe0b0}.ubadge.f-porta{background:rgba(70,130,200,.22);color:#9fc6f0}.ubadge.f-bar{background:rgba(139,69,255,.2);color:#c9b0ff}.ubadge.f-sala{background:rgba(200,110,60,.22);color:#f0b98f}.ubadge.f-pr{background:rgba(220,80,140,.2);color:#f5a6c8}.ubadge.f-stage{background:rgba(60,150,170,.22);color:#9fe0ea}.ubadge.f-attesa{background:rgba(224,161,58,.25);color:#f4d38a}
.upill{font-size:11px;padding:2px 8px;border-radius:999px;border:1px solid var(--line);color:var(--muted);background:transparent;white-space:nowrap}
.upill.ok{color:var(--ok);border-color:rgba(63,160,106,.5)}
.upill.warn{color:var(--warn);border-color:rgba(224,161,58,.55)}
.upill.bad{color:var(--bad);border-color:rgba(229,72,77,.5)}
.upill.muted{opacity:.7}
.uside{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.ulast{font-family:var(--mono);font-size:12px;color:var(--muted);white-space:nowrap}
.uchev{color:var(--muted);font-size:22px;line-height:1}
.uvuoto{padding:18px 4px;text-align:center}
.umenu{display:flex;flex-direction:column;gap:4px;min-width:260px}
.umenu button{text-align:left;justify-content:flex-start;min-height:42px}
/* --- la finestra --- */
.uform{display:flex;flex-direction:column;gap:12px;min-width:0}
.useg{display:flex;gap:2px;background:var(--panel2);border:1px solid var(--line);border-radius:999px;padding:3px;position:sticky;top:-12px;z-index:2}
.useg button{flex:1;border-radius:999px;min-height:34px;padding:6px 8px;font-weight:600}
.useg button.on{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
.upane{display:flex;flex-direction:column;gap:10px}
.upane[hidden],.ubanner[hidden],.uvuoto[hidden]{display:none}
.ugrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:8px 14px;width:100%}
.ugrid input,.ugrid select,.ugrid textarea{width:100%;box-sizing:border-box;min-width:0}
.uswitch{display:flex;gap:8px;flex-wrap:wrap;margin-top:2px}
.uchip{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border:1px solid var(--line);border-radius:999px;background:var(--panel2);cursor:pointer;font-size:13px;user-select:none}
.uchip input{margin:0;width:16px;height:16px;min-height:0;flex:none}
.uchip:has(input:checked){border-color:var(--accent);color:var(--txt)}
.uinfo{display:flex;flex-direction:column;gap:4px;font-size:13px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r);background:rgba(255,255,255,.02)}
.uinfo .k,.ureg .k{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.11em;margin-right:6px}
.uquick{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.uquick a{color:var(--txt);background:var(--panel2)}
.uazioni2{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.uazioni2 select{min-width:0;max-width:100%}
.ureg{font-size:12px;color:var(--muted);font-family:var(--mono);display:flex;flex-direction:column;gap:2px;margin-top:4px}
.udocs{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px}
.udoc{border:1px solid var(--line);border-radius:12px;padding:12px}
.udoc .t{font-weight:700;margin-bottom:6px}
.ustat{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.utab{width:100%;border-collapse:collapse;font-size:12.5px;font-variant-numeric:tabular-nums}
.utab th{text-align:left;color:var(--muted);padding:4px 8px;font-weight:500}
.utab td{padding:4px 8px;border-top:1px solid var(--line)}
.utab .r{text-align:right}
.upiede{position:sticky;bottom:-12px;background:var(--panel);padding:10px 0 2px;border-top:1px solid var(--line);display:flex;justify-content:flex-end;margin-top:4px}
.upiede button{min-height:40px;min-width:140px}
@media(max-width:760px){
  .panel.utenti{padding:10px 8px 8px;overflow:visible}
  .utesta h3{flex:1 1 100%}
  .uazioni{width:100%}
  .uazioni button{flex:1 1 auto}
  .ufiltri select{flex:1 1 40%}
  .urow{gap:10px;padding:8px}
  .uname{font-size:14.5px;white-space:normal}
  .uname .uuser{display:block;margin:1px 0 0}
  .uside{flex-direction:column;align-items:flex-end;gap:0}
  .ulast{font-size:11px}
  .uchev{font-size:18px}
  .mdl-back{padding:0;align-items:stretch}
  .mdl.wide{max-width:none;border-radius:0;max-height:100vh;max-height:100dvh;height:100dvh}
  .mdl.wide .mdl-body{flex:1 1 auto}
  .useg{top:-8px}
  .useg button{padding:6px 4px;font-size:12.5px}
  .ugrid{grid-template-columns:1fr 1fr;gap:8px 10px}
  .ugrid .field:has(input[type=email]),.ugrid .field:has(select),.ugrid .field:has(textarea){grid-column:1/-1}
  .upiede{bottom:-8px}
  .upiede button{width:100%}
}

/* ---- Libro paga (mod_paga.js) ---- */
.paga-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}
.paga-periodo{display:flex;gap:6px;align-items:center;margin-left:auto}
.paga-tab{width:100%;border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums}
.paga-tab th{text-align:left;color:var(--muted);padding:6px 8px;font-weight:500}
.paga-tab td{padding:6px 8px;border-top:1px solid var(--line)}
.paga-tab th.n,.paga-tab td.n{text-align:right;white-space:nowrap}
.paga-click tbody tr{cursor:pointer}
.paga-click tbody tr:hover{background:var(--panel2)}
.paga-tab tr.paga-previsto{opacity:.55}
.paga-tab tr.paga-totali td{font-weight:600;border-top:2px solid var(--line)}
.paga-td-azioni{white-space:nowrap;text-align:right}
.paga-td-azioni button{padding:3px 8px;min-height:0;font-size:12px}
.paga-badge{display:inline-block;border:1px solid var(--line);border-radius:6px;padding:1px 6px;font-size:11px;white-space:nowrap}
.paga-badge.ok{color:var(--ok)}.paga-badge.warn{color:var(--warn)}.paga-badge.rett{color:var(--warn);border-color:var(--warn)}
.paga-archiviato{opacity:.6}
.paga-accordi,.paga-form{display:flex;flex-direction:column;gap:6px;margin:8px 0}
.paga-accordi h4{margin:0;font-size:13px;color:var(--muted)}
.paga-accordo{font-size:13px}
.paga-azioni{display:flex;gap:8px;margin:10px 0;flex-wrap:wrap}
.pos-blocco-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:8px 12px;margin:0 0 10px;border:1px solid var(--accent,var(--line));border-radius:10px;background:var(--panel2);position:sticky;top:env(safe-area-inset-top,0px);z-index:3}
.grid-table th.pos-sel,.grid-table td.pos-sel{width:32px;text-align:center}
.pos-art-tab tbody tr:nth-child(even) td{background:color-mix(in srgb,var(--txt) 5%,transparent)}
.pos-art-tab tbody tr:hover td{background:color-mix(in srgb,var(--txt) 9%,transparent)}
.grid-table.pos-art-tab tbody tr.pos-selez td,.grid-table tr.pos-selez td{background:color-mix(in srgb,var(--accent,#6aa0ff) 12%,transparent)}
.pos-blocco-riga{display:grid;grid-template-columns:minmax(150px,210px) 1fr;gap:10px;align-items:center;padding:6px 0;border-top:1px solid var(--line)}
.pos-blocco-riga>label{display:flex;gap:8px;align-items:center;text-transform:none;font-size:13px;font-weight:600;margin:0}
.pos-blocco-ctrl{min-width:0}.pos-blocco-ctrl select,.pos-blocco-ctrl input:not([type=checkbox]):not([type=color]){max-width:100%}
@media (max-width:520px){.pos-blocco-riga{grid-template-columns:1fr}}
.paga-griglia-scroll{overflow-x:auto;max-width:100%}
.paga-griglia{width:auto;min-width:100%;font-size:12px}
.paga-griglia th,.paga-griglia td{padding:4px 6px;white-space:nowrap}
.paga-griglia th.fix,.paga-griglia td.fix{position:sticky;left:0;background:var(--panel);z-index:1;text-align:left;min-width:170px}
.paga-griglia thead tr.sub th{padding-top:0;font-size:11px}
.paga-griglia th.sep,.paga-griglia td.sep{border-left:1px solid var(--line)}
.paga-griglia tr.paga-gruppo td{background:var(--panel2);font-weight:600;color:var(--muted);font-size:11px;letter-spacing:.04em;text-transform:uppercase}
.paga-griglia td.dapagare{background:color-mix(in srgb,var(--warn) 14%,transparent)}
.paga-griglia tbody tr:not(.paga-gruppo):not(.paga-totali):hover td{background:var(--panel2)}
.paga-griglia .warn{color:var(--warn)}
.paga-totali{margin-top:8px;font-weight:600}
.paga-stampa-titolo{margin:8px 0}
/* La persona in beta: la riga si vede, la cifra no (e il server manda cifre arrotondate). */
.paga-beta{filter:blur(5px);user-select:none;pointer-events:none}
.paga-beta-banner{background:rgba(224,161,58,.15);border:1px solid var(--warn);border-radius:8px;padding:8px 12px;margin-bottom:8px;font-size:13px}
/* Stampa del libro paga: SOLO quando e' il libro paga a stampare (body.printing-paga).
   La versione generica "body *{visibility:hidden}" spegneva anche il foglio firme, il
   riepilogo, il documento agenzia e ogni altra stampa che passa da #print-area. */
@media print{ body.printing-paga *{visibility:hidden} body.printing-paga .paga-stampa,body.printing-paga .paga-stampa *{visibility:visible} body.printing-paga .paga-stampa{position:absolute;left:0;top:0;width:100%;color:#000} .paga-stampa .paga-tab td,.paga-stampa .paga-tab th{border-color:#999;color:#000} }
/* Logo del locale in testa alle stampe di Personale & Spese */
@media print{ #print-area img.logo-stampa{display:block;max-height:22mm;max-width:70mm;margin:0 0 8px} }

/* Categorie a orario del menu QR: una riga per giorno, le fasce vanno a capo da sole */
.orari-box{display:flex;flex-direction:column;gap:10px;min-width:0}
.orari-lista{display:flex;flex-direction:column;gap:6px}
.orari-riga{display:flex;gap:10px;align-items:flex-start;padding:7px 10px;border:1px solid var(--line);border-radius:var(--r);background:var(--panel2)}
.orari-giorno{flex:0 0 108px;display:flex;align-items:center;gap:6px;font-weight:600;min-height:32px}
.orari-giorno input{width:16px;height:16px;min-height:0;margin:0}
.orari-fasce{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.orari-fasce.spenta{opacity:.45}
.orari-fascia{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.orari-lbl{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.orari-ora{width:96px;min-width:0;padding:4px 6px;font-family:var(--mono)}
.orari-nota{font-size:12px;color:var(--accent);white-space:nowrap}
.orari-fasce button{align-self:flex-start;padding:3px 8px;min-height:28px;font-size:12px}
@media(max-width:560px){ .orari-riga{flex-direction:column;gap:6px} .orari-giorno{flex:none} }

/* Menu QR, «Cosa c'è nel menu»: righe semplici, tutto il resto nella finestra dell'articolo */
.mlist{display:flex;flex-direction:column;gap:4px;margin-top:10px}
.mcat{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:8px 10px;background:var(--panel2);border-radius:var(--r);margin-top:12px}
.mcat>b{font-size:15px}
.mcat input[type=text]{flex:1 1 200px;min-width:0}
.mcat input[type=checkbox]{width:18px;height:18px;min-height:0;margin:0}
.mrow{display:flex;gap:10px;align-items:center;padding:6px 8px;border:1px solid var(--line);border-radius:var(--r);cursor:pointer;min-height:56px;transition:border-color .12s}
.mrow:hover{border-color:var(--accent)}
.mrow.fuori{opacity:.5}
.mrow input[type=checkbox]{width:18px;height:18px;min-height:0;margin:0;flex:none}
.mrow .menu-thumb{flex:0 0 52px;width:52px;height:52px;border-radius:8px;font-size:11px}
.mrow .mmain{flex:1;min-width:0}
.mrow .mnome{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mrow .mmeta{display:flex;gap:4px;flex-wrap:wrap;margin-top:3px;align-items:center}
.mrow .mdesc{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.mprezzo{font-family:var(--mono);font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums}
.mprezzo s{color:var(--muted);font-weight:500;margin-right:4px}
.mprezzo.big{font-size:22px}
.mrow .mchev{color:var(--muted);font-size:22px;line-height:1}
.mform{display:flex;flex-direction:column;gap:10px;min-width:0}
.mtesta{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.mfoto{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap}
.menu-thumb.big{width:120px;height:160px;border-radius:10px;flex:none}
.mfoto-bt{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
@media(max-width:560px){ .mrow{gap:8px;padding:6px} .mrow .menu-thumb{flex-basis:44px;width:44px;height:44px} .mrow .mchev{display:none} }

/* Banner «metti sulla Home» (mod_installa.js) e finestra delle notifiche */
.ns-installa{position:fixed;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom,0px));z-index:900;background:var(--panel);border:1px solid var(--accent);border-radius:14px;padding:12px 14px;box-shadow:0 12px 34px rgba(0,0,0,.55);display:flex;flex-direction:column;gap:10px;animation:nsInstUp .25s ease-out}
@keyframes nsInstUp{from{transform:translateY(20px);opacity:0}to{transform:none;opacity:1}}
@media(prefers-reduced-motion:reduce){.ns-installa{animation:none}}
.ns-installa-t{display:flex;flex-direction:column;gap:4px;font-size:14px;line-height:1.4}
.ns-installa-t span{color:var(--muted);font-size:13px}
.ns-installa-t .ns-ico{vertical-align:-3px;color:var(--accent);margin:0 2px}
.ns-installa-a{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}
.ns-installa-a button{min-height:40px}
@media(min-width:700px){.ns-installa{left:auto;right:16px;max-width:420px}}
.ns-push{display:flex;flex-direction:column;gap:10px;font-size:14px;line-height:1.45}
.ns-push p{margin:0}
.ns-push-ico{font-size:40px;text-align:center}

/* Ultimi conti: gli articoli del conto in una riga, per capire cosa si storna */
.pos-righe{font-size:12.5px;color:var(--txt);opacity:.85;line-height:1.35;margin:2px 0 4px;white-space:normal;font-family:var(--ui)}
.pos-righe.grande{font-size:14px;font-weight:600;opacity:1;margin:8px 0 10px;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-s);background:var(--panel2)}

/* ---- Debug casse: una linguetta per RT, cadute del collegamento, righe dei documenti ---- */
.tag.warn{color:var(--warn);border-color:var(--warn)}
.dc-casse{flex-wrap:wrap;gap:6px;margin-top:10px}
.dc-tab td.dc-motivo{max-width:340px;white-space:normal;font-family:var(--ui)}
.dc-tab td.bad,.grid-table td .bad{color:var(--bad)}
.dc-dett .big{font-size:18px;font-weight:700;margin-bottom:8px}
.dc-dett h4{margin:14px 0 6px;font-size:12px;text-transform:uppercase;letter-spacing:.11em;color:var(--muted)}
.dc-dett .grid-table td{white-space:normal}
.dc-dett tr.dc-att td{background:rgba(255,255,255,.04)}

/* ---- Personale & Spese: compensi compatti ---- */
.lp-barra{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:6px 0 8px}
.linelist.compatta{gap:2px}
.linelist.compatta .lineitem{gap:4px;padding:2px 4px;border-radius:6px}
.linelist.compatta .lineitem:nth-child(even){background:rgba(255,255,255,.035)}
.linelist.compatta .lineitem input,.linelist.compatta .lineitem select{min-height:28px;padding:3px 7px;font-size:13px}
.linelist.compatta .lineitem input.amt{flex:0 0 84px;font-size:13px}
.linelist.compatta .lineitem .lp-tot{flex:0 0 84px;position:relative;display:flex}
.linelist.compatta .lineitem .lp-tot input{flex:1;min-width:0;width:100%;padding-left:16px}
.lp-fonte{position:absolute;left:6px;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:var(--warn);pointer-events:auto}
.lp-fonte.ok{background:var(--ok)}
.lp-ric,.lp-ana{flex:0 0 auto;padding:2px 6px;min-height:26px}
.lp-azslot{flex:0 0 34px;width:34px;display:flex;justify-content:center;align-items:center}
.lp-azslot>.lp-ric,.lp-azslot>.lp-ana{margin:0}
.amt.lp-calc{background:transparent;border-style:dashed;color:var(--muted);cursor:default}
.amt.lp-calc.lp-busta{color:var(--txt);font-weight:700}
/* Ruolo di una riga legata a una scheda (nota spese): viene dal menu «persona · ruolo», non si scrive */
.lineitem input.lp-ro{background:rgba(127,127,127,.14);color:var(--muted);cursor:default}
.linelist.compatta .lineitem button.danger{padding:2px 7px;min-height:26px}
.lp-totriga{display:flex;gap:18px;align-items:baseline;flex-wrap:wrap;margin:6px 0 2px;padding:6px 8px;border-top:1px solid var(--line);font-family:var(--mono);font-size:13px}
.lp-totriga .k{font-family:var(--ui);font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.11em}
.lp-totriga b{font-family:var(--ui);font-weight:600;color:var(--muted);font-size:12px;margin-right:4px}
.lp-totriga .lp-somma{font-weight:700}
.lp-tab{max-width:560px}
.lp-tab tr.lp-gran td{font-weight:700;border-top:2px solid var(--line)}

/* Archivio delle serate (selettore in alto → «Serate precedenti…») */
.serate-arch-bar{display:flex;gap:8px;flex-wrap:wrap}
.serate-arch-bar input{flex:1 1 220px;min-width:0}
.serate-arch-lista{max-height:60vh;overflow:auto;margin-top:10px}
.serate-arch-lista h4{margin:12px 0 4px;color:var(--muted,#999);font-size:12px;letter-spacing:.08em}
.serate-arch-voce{display:block;width:100%;text-align:left;margin:2px 0}

/* --- Magazzino (tab «Magazzino»: prodotti, fornitori, documenti, inventari) ---
   Solo variabili del tema: vale nel tema scuro e in quello chiaro. Prefisso .mag- */
.mag-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-top:8px;max-width:100%}
.mag-bar{gap:8px;align-items:center;margin-bottom:8px}
/* Solo i campi messi DIRETTAMENTE nella barra: dentro un .field (colonna con l'etichetta) quel flex-basis diventerebbe un'altezza di 200 px. */
.mag-bar>input[type=text],.mag-bar>input:not([type]){flex:1 1 200px;min-width:0}
.mag-bar .field>input{flex:0 0 auto;min-width:200px}
.mag-check{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
.mag-tab{width:100%;min-width:560px}
.mag-tab td.mag-txt{font-family:var(--ui);text-align:left;font-size:13px}
.mag-tab th{white-space:nowrap}
.mag-tab .ok,.mag-totriga .ok,.mag-ul .ok{color:var(--ok)}
.mag-tab .bad,.mag-totriga .bad,.mag-ul .bad{color:var(--bad)}
.mag-tab .warn,.mag-totriga .warn,.mag-ul .warn{color:var(--warn)}
.mag-click-rows tbody tr{cursor:pointer}
.mag-click{cursor:pointer}
.mag-click:hover{border-color:var(--accent)}
.mag-link{color:var(--accent);text-decoration:none;border-bottom:1px dotted var(--accent)}
.mag-link:hover{color:var(--accent-hover,var(--accent))}
.mag-badge{display:inline-block;font-size:11px;padding:1px 7px;border-radius:999px;border:1px solid var(--line);background:var(--panel2);color:var(--muted);font-family:var(--mono);letter-spacing:.02em;vertical-align:middle;white-space:nowrap}
.mag-badge.ok{color:var(--ok);border-color:var(--ok)}
.mag-badge.bad{color:var(--bad);border-color:var(--bad)}
.mag-badge.warn{color:var(--warn);border-color:var(--warn)}
/* riepilogo: avvisi con l'elenco delle cose da fare */
.mag-avviso{border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:var(--r-s);padding:10px 12px;margin-top:10px;background:var(--panel2)}
.mag-avviso.bad{border-left-color:var(--bad)}
.mag-avviso.warn{border-left-color:var(--warn)}
.mag-lista{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.mag-chip{display:inline-flex;align-items:center;gap:4px;padding:5px 10px;border-radius:999px;border:1px solid var(--line);background:var(--panel);font-size:12.5px;cursor:pointer;min-height:30px}
.mag-chip:hover{border-color:var(--accent)}
/* scheda fornitore e testa del documento */
.mag-testa{display:flex;gap:10px;align-items:flex-start;flex-wrap:wrap;margin-bottom:10px}
.mag-testa>div:first-child{flex:1 1 240px;min-width:0}
.mag-testa-doc{gap:8px}
.mag-testa-doc .field{flex:1 1 130px;min-width:0}
.mag-testa-doc .field:first-child,.mag-testa-doc .field:nth-child(2){flex-basis:200px}
.mag-testa-doc .field input,.mag-testa-doc .field select{width:100%;min-width:0}
.mag-bozza h4{margin:14px 0 4px}
.mag-ddt-aperti{border:1px dashed var(--line);border-radius:var(--r-s);padding:8px 10px;margin-top:8px}
/* tabelle con campi dentro: celle strette, campi delle misure giuste */
.mag-edit td{padding:4px 5px;vertical-align:top}
.mag-edit input,.mag-edit select{min-height:34px;padding:4px 7px;font-size:13px}
.mag-w-cod{width:90px}
.mag-w-des{width:200px;min-width:160px}
.mag-w-prod{max-width:200px;min-width:150px}
.mag-w-num{width:82px;text-align:right}
.mag-w-iva{width:60px;text-align:right}
.mag-w-nota{width:140px}
.mag-w-ddt{max-width:260px;min-width:170px}
.mag-calc{font-family:var(--mono);white-space:nowrap;text-align:left!important;font-size:12.5px;color:var(--muted)}
.mag-calc b{color:var(--txt)}
.mag-righe{min-width:1180px}
.mag-righe td{text-align:left}
/* stato della riga: da confermare in giallo, confermata in verde, ignorata spenta, doppione in arancio */
.mag-tab tr.mag-st-proposta td:first-child{box-shadow:inset 3px 0 0 var(--warn)}
.mag-tab tr.mag-st-confermata td:first-child{box-shadow:inset 3px 0 0 var(--ok)}
.mag-tab tr.mag-st-ignorata td{opacity:.55}
.mag-tab tr.mag-st-ignorata td:last-child,.mag-tab tr.mag-st-ignorata td:nth-last-child(2),.mag-tab tr.mag-st-ignorata td:nth-last-child(3){opacity:1}
.mag-tab tr.mag-riga-dopp td{background:color-mix(in srgb,var(--warn) 14%,transparent)}
.mag-tab tr.mag-riga-nuova td{background:color-mix(in srgb,var(--accent) 10%,transparent)}
.mag-totriga{display:flex;gap:16px;flex-wrap:wrap;align-items:baseline;margin-top:8px;padding:8px 10px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}
.mag-totriga b{color:var(--txt)}
.mag-ul{margin:6px 0 0;padding-left:20px;line-height:1.6}
@media(max-width:760px){
  .mag-tab{min-width:0}
  .mag-righe{min-width:1100px}
  .mag-bar button{min-height:40px}
  .mag-edit button{min-height:36px}
  .mag-chip{min-height:36px}
  .mag-totriga{gap:10px}
}

.mag-da-abbinare td{background:color-mix(in srgb,var(--warn) 12%,transparent)}
.mag-badge.warn{color:var(--warn);border-color:var(--warn)}

.mag-anteprime{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.mag-anteprima{width:96px;height:96px;object-fit:cover;border-radius:8px;border:1px solid var(--line)}

/* ---- Assistente del magazzino (chat laterale) ---- */
.mag-chat-apri{margin-left:auto}
.mag-chat{position:fixed;right:16px;bottom:16px;width:min(420px,calc(100vw - 32px));height:min(640px,calc(100vh - 32px));display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:16px;box-shadow:0 18px 48px rgba(0,0,0,.35);z-index:250;overflow:hidden}
.mag-chat-testa{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid var(--line);background:var(--panel2)}
.mag-chat-testa .row{gap:4px}
.mag-chat-lista{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px}
.mag-bolla{max-width:88%;padding:10px 12px;border-radius:14px;font-size:14px;line-height:1.45;position:relative}
.mag-bolla.io{align-self:flex-end;background:color-mix(in srgb,var(--accent,#6aa0ff) 22%,var(--panel2));border-bottom-right-radius:4px}
.mag-bolla.lui{align-self:flex-start;background:var(--panel2);border:1px solid var(--line);border-bottom-left-radius:4px}
.mag-bolla.mag-attesa .mag-bolla-testo{letter-spacing:.2em;animation:magPulse 1s infinite}
@keyframes magPulse{0%,100%{opacity:.35}50%{opacity:1}}
.mag-bolla-costo{font-size:10px;color:var(--muted);margin-top:4px;text-align:right;font-family:var(--mono)}
.mag-azione{display:block;margin-top:8px;width:100%;text-align:left;border:1px solid var(--accent,#6aa0ff);background:transparent;color:var(--txt);border-radius:10px;padding:8px 10px;font-size:13px}
.mag-azione:hover{background:color-mix(in srgb,var(--accent,#6aa0ff) 15%,transparent)}
.mag-azione:disabled{opacity:.6;border-style:dashed}
.mag-chat-chips{display:flex;flex-wrap:wrap;gap:6px;padding:8px 14px 0}
.mag-chip{font-size:12px;padding:4px 10px;border-radius:999px}
.mag-chat-piede{display:flex;gap:8px;padding:10px 14px 14px;border-top:1px solid var(--line);align-items:flex-end}
.mag-chat-piede textarea{flex:1;resize:none;border-radius:12px;min-height:44px}
.mag-chat-piede button{min-height:44px}
@media (max-width:520px){.mag-chat{right:8px;left:8px;bottom:8px;width:auto;height:calc(100vh - 16px)}}
@media (prefers-reduced-motion:reduce){.mag-bolla.mag-attesa .mag-bolla-testo{animation:none}}

/* ---- Magazzino a livelli (fase 6): prelievi dal telefono, conteggio del bar sui prodotti,
   colonne per deposito. Solo variabili del tema: vale in chiaro e in scuro. Prefisso .mag- */
.mag-livelli-apri{margin-left:auto}
.mag-livelli-apri+.mag-chat-apri{margin-left:0}
.mag-tab th.mag-dep,.mag-tab td.mag-dep{font-size:12.5px;color:var(--muted);white-space:nowrap}
.mag-tab td.mag-dep .hint{font-size:10.5px}
.mag-tab tr.mag-tot td{border-top:2px solid var(--line)}
.mag-bars{margin-top:10px}
/* prelievi: una colonna, tasti grandi, pensata per il telefono */
.mag-prel{display:flex;flex-direction:column;gap:10px;max-width:560px}
.mag-prel .field{margin:0}
.mag-prel input,.mag-prel select{min-height:44px;font-size:16px}
.mag-prel-ris{display:flex;flex-direction:column;gap:4px;margin-top:4px}
.mag-prel-voce{display:block;width:100%;text-align:left;min-height:44px;padding:8px 12px;border:1px solid var(--line);border-radius:var(--r-s,10px);background:var(--panel2)}
.mag-prel-voce:hover{border-color:var(--accent)}
.mag-prel-righe{display:flex;flex-direction:column;gap:6px}
.mag-prel-riga{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-s,10px);background:var(--panel2)}
.mag-prel-nome{flex:1 1 auto;min-width:0}
.mag-prel-nome b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mag-prel-qta{display:flex;align-items:center;gap:4px;flex:0 0 auto}
.mag-prel-qta input{width:72px;text-align:center;min-height:40px;padding:4px}
.mag-prel-qta button{min-width:40px;min-height:40px;padding:0;font-size:18px;font-weight:700}
.mag-prel-qta .muted{font-size:12px;max-width:70px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mag-prel-riga>button.danger{min-height:40px;min-width:40px;padding:0}
.mag-prel-riep{font-size:13px;color:var(--muted);line-height:1.5}
.mag-prel-riep b{color:var(--txt)}
.mag-prel-reg{min-height:48px;font-size:16px}
.mag-prel-oggi{margin-top:14px}
.mag-prel-fatto{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--line);font-size:14px}
.mag-prel-fatto>div{flex:1 1 auto;min-width:0}
.mag-prel-fatto button{flex:0 0 auto;min-height:36px}
/* conteggio del bar sui prodotti (capobarman e bar manager) */
.mag-inv{width:100%;min-width:520px}
.mag-inv th{white-space:nowrap}
.mag-inv td{vertical-align:top}
.mag-inv td.mag-inv-nome{text-align:left;font-family:var(--ui);font-size:13px;min-width:140px}
.mag-inv td .hint{font-size:10.5px;margin-top:2px}
.mag-inv input.mag-w-num{width:74px;min-height:38px;font-size:15px;text-align:right}
.mag-inv .ok{color:var(--ok)}
.mag-inv .bad{color:var(--bad)}
.mag-inv-tot{display:flex;gap:16px;flex-wrap:wrap;margin-top:8px;padding:8px 10px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}
.mag-inv-tot b{color:var(--txt)}
.mag-inv-azioni{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
/* Il ricarico del bar a inizio serata: davanti il consumato (in bottiglie), poi la casella delle bottiglie da caricare. */
.mag-ric{display:flex;align-items:center;gap:8px;justify-content:flex-end}
.mag-ric-cons{min-width:42px;text-align:right;font-variant-numeric:tabular-nums;color:var(--muted);font-size:14px}
.mag-inv input.mag-ric-in{width:64px;font-weight:700;border-color:var(--accent)}
.mag-ric-td .hint{text-align:right;margin:2px 0 0}
.mag-ric-fm{display:flex;flex-direction:column;gap:4px;align-items:flex-end}
.mag-ric-f{display:flex;align-items:center;gap:6px;cursor:text}
.mag-ric-f .hint{margin:0;white-space:nowrap}
.mag-ric-f.rif .hint{font-weight:700}
.mag-ric-f:not(.rif) input.mag-ric-in{font-weight:400;border-color:var(--line)}
.mag-dot{font-size:11px;line-height:1;margin-left:2px;cursor:help}
.mag-dot.bad{color:var(--bad)}
.mag-dot.warn{color:var(--warn)}
.mag-sort th{cursor:pointer;user-select:none}
.mag-sort th:hover{color:var(--accent)}
.mag-scorte-bar{display:flex;flex-wrap:wrap;gap:8px}
.mag-scorta-bar{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
.mag-ordine-forn{margin-top:12px;padding-top:8px;border-top:1px solid var(--line)}
.mag-ordine-forn h4{margin:0 0 6px}
.mag-ric-box{margin-top:10px;padding:10px 12px;border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:var(--r-s);background:var(--panel2)}
.mag-ric-box .hint{margin:0}
.mag-ric-box .ok{color:var(--ok)}
.mag-inv select.mag-causale{display:block;min-height:36px;font-size:12.5px;max-width:170px;border-color:var(--warn)}
/* Inventario del bar piu' compatto (13/10/2026): tutto leggermente piu' piccolo, il nome a capo invece che tagliato. */
.mag-inv th,.mag-inv td{padding:5px 5px;font-size:13px}
.mag-inv th{font-size:10.5px}
.mag-inv .mag-inv-nome{max-width:170px;white-space:normal;overflow-wrap:anywhere}
.mag-inv .mag-inv-nome b{font-size:13.5px}
.mag-inv .mag-inv-nome .hint{font-size:11px;line-height:1.3}
.mag-inv input.mag-w-num{width:58px;min-height:34px;font-size:14px;padding:0 6px}
.mag-inv .mag-interi{display:flex;gap:4px;flex-wrap:wrap}
.mag-inv .mag-interi-c .hint,.mag-inv td>.hint{font-size:10.5px}
.mag-inv input.mag-ric-in{width:52px}
.mag-ric{gap:5px}
.mag-ric-cons{min-width:30px;font-size:13px}
.mag-inv input:disabled{opacity:.75;background:var(--panel2)}
@media (max-width:600px){
  .mag-inv th,.mag-inv td{padding:4px 3px}
  .mag-inv .mag-inv-nome{max-width:120px}
  .mag-inv .mag-inv-nome .hint{display:none}
  .mag-inv input.mag-w-num{width:48px;min-height:32px;font-size:13px}
  .mag-inv input.mag-ric-in{width:44px}
}
.mag-inv .mag-tot .hint{margin:2px 0 0;font-size:11.5px}
/* Sul telefono il ricarico deve stare a schermo senza scorrere di lato: via la colonna «Contato» (e' la somma di interi e aperto) e caselle piu' strette. */
/* Da PC (21/10/2026, il titolare): la finestra del conteggio/ricarico/rettifica era stretta (760 px) con scritte grandi.
   Sopra i 700 px si allarga fino a 1180 px e tutto si fa piu' compatto: etichette e hint 12-13 px, numeri 14-15 px,
   celle piu' basse. Sotto i 700 px (telefono) resta tutto com'era. */
@media (min-width:700px){
  .mdl.wide:has(> .mdl-body > .mag-inv-box){max-width:min(1180px,calc(100vw - 32px))}
  .mdl.wide:has(> .mdl-body > .mag-inv-box) .mdl-head h3{font-size:15px}
  .mdl.wide:has(> .mdl-body > .mag-inv-box) .mdl-body>.mag-inv-box>.hint,.mdl.wide:has(> .mdl-body > .mag-inv-box) .mag-ric-box .hint{font-size:12.5px;line-height:1.4}
  .mag-inv-box .mag-inv th{font-size:11px;padding:4px 6px}
  .mag-inv-box .mag-inv td{padding:3px 6px;font-size:13px}
  .mag-inv-box .mag-inv .mag-inv-nome{max-width:260px;font-size:12.5px}
  .mag-inv-box .mag-inv .mag-inv-nome b{font-size:13px}
  .mag-inv-box .mag-inv .mag-inv-nome .hint,.mag-inv-box .mag-inv td .hint,.mag-inv-box .mag-inv .mag-interi-c .hint,.mag-inv-box .mag-inv td>.hint,.mag-inv-box .mag-inv .mag-tot .hint{font-size:11px}
  .mag-inv-box .mag-inv input.mag-w-num{min-height:30px;font-size:14px;width:62px}
  .mag-inv-box .mag-inv input.mag-ric-in{width:56px}
  .mag-inv-box .mag-inv select.mag-causale{min-height:30px;font-size:12px}
  .mag-inv-box .mag-inv .mag-interi{gap:6px}
  .mag-inv-box .mag-ric-cons{font-size:13px}
  .mag-inv-box .mag-inv-tot{font-size:12.5px;padding:6px 8px}
  .mag-inv-box .mag-ric-box{padding:8px 10px}
  .mag-inv-box .mag-inv-azioni button{min-height:36px;font-size:13.5px}
}
@media (max-width:600px){
  .mag-inv.mag-con-ric th:nth-child(4),.mag-inv.mag-con-ric td:nth-child(4){display:none}
  .mag-inv.mag-con-ric th,.mag-inv.mag-con-ric td{padding-left:4px;padding-right:4px}
  .mag-inv.mag-con-ric input.mag-w-num{width:54px}
  .mag-inv.mag-con-ric input.mag-ric-in{width:50px}
  .mag-inv.mag-con-ric .mag-ric{gap:5px}
  .mag-inv.mag-con-ric .mag-ric-cons{min-width:30px;font-size:13px}
  .mag-inv.mag-con-ric .mag-inv-nome{max-width:128px}
}
@media (max-width:430px){
  .mag-inv.mag-con-ric .mag-inv-nome{max-width:98px}
  .mag-inv.mag-con-ric .mag-inv-nome .hint{display:none}
  .mag-inv.mag-con-ric input.mag-w-num{width:48px}
  .mag-inv.mag-con-ric input.mag-ric-in{width:46px}
}
.mag-inv-azioni button{min-height:44px}
.mag-inv-scheda{margin-top:8px}
.mag-inv-scheda .mag-inv{min-width:420px}
@media(max-width:760px){
  .mag-inv{min-width:480px}
  .mag-inv input.mag-w-num{width:64px;min-height:42px;font-size:16px}
  .mag-prel{max-width:none}
  .mag-livelli-apri{margin-left:0}
}

.mag-ant-w{position:relative;display:inline-block}
.mag-ant-x{position:absolute;top:-6px;right:-6px;padding:0 6px;min-height:0;font-size:12px;background:var(--panel)}

/* Finestre larghe (documenti del magazzino): quasi tutto lo schermo, tabelle con barra visibile */
.mdl.xwide{max-width:min(1560px,calc(100vw - 32px));max-height:94vh}
.mdl.xwide .mdl-body{flex:1 1 auto}
.mag-scroll{scrollbar-width:thin;padding-bottom:6px}
.mag-scroll::-webkit-scrollbar{height:10px}
.mag-scroll::-webkit-scrollbar-thumb{background:var(--muted);border-radius:6px}
.mag-scroll::-webkit-scrollbar-track{background:var(--panel2);border-radius:6px}
.mdl.xwide .mag-tab{min-width:100%}

/* Formati multipli per prodotto (scheda prodotto, abbinamenti, bozza, carico bar, conteggi) */
.mag-formati{display:flex;flex-direction:column;gap:6px;margin:4px 0 6px}
.mag-formato{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:6px 8px;border:1px solid var(--line);border-radius:var(--r-s,10px);background:var(--panel2)}
.mag-formato.spento{opacity:.55}
.mag-formato .mag-fmt-n{font-size:11px;color:var(--muted);min-width:64px;text-transform:uppercase;letter-spacing:.04em}
.mag-formato input.mag-fmt-nome{flex:1 1 140px;min-width:120px}
.mag-formato input.mag-w-num{width:90px}
.mag-formato .mag-check{display:inline-flex;align-items:center;gap:4px;font-size:13px;white-space:nowrap}
.mag-formato button{min-height:32px;padding:0 8px}
.mag-fmt-sel{max-width:180px;min-width:120px}
.mag-prel-fmt{min-height:40px;max-width:150px;font-size:14px;padding:4px 6px}
.mag-interi{display:flex;align-items:flex-end;gap:6px;flex-wrap:wrap}
.mag-interi-c{display:inline-flex;flex-direction:column;align-items:flex-start;gap:2px;font-weight:normal}
.mag-interi-c input.mag-w-num{width:70px}
.mag-interi-c .hint{font-size:10.5px;max-width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mag-interi-tot{align-self:center;white-space:nowrap;font-size:13px;color:var(--muted);padding-bottom:4px}
.mag-interi-tot b{color:var(--txt)}
.mag-inv .mag-interi{flex-wrap:nowrap}
@media(max-width:760px){
  .mag-formato .mag-fmt-n{min-width:0;width:100%}
  .mag-inv .mag-interi{flex-wrap:wrap}
}

/* ---- Magazzino: tabelle compatte da PC (righe basse, carattere piccolo, campi stretti) ---- */
.mdl.xwide .mag-tab,.mag-tab.mag-edit{font-size:12px}
.mdl.xwide .mag-tab th{font-size:10px;letter-spacing:.06em;padding:4px 5px;white-space:normal;line-height:1.15;max-width:90px;vertical-align:bottom}
.mdl.xwide .mag-tab td{padding:2px 4px;font-size:12px}
.mdl.xwide .mag-tab td.mag-txt{font-size:12px}
.mag-edit td{padding:2px 3px}
.mag-edit input,.mag-edit select{min-height:26px;height:26px;padding:2px 5px;font-size:12px;border-radius:6px}
.mag-edit .mag-w-cod{width:70px}
.mag-edit .mag-w-des{width:170px;min-width:120px}
.mag-edit .mag-w-prod{max-width:170px;min-width:120px}
.mag-edit .mag-w-num{width:60px}
.mag-edit .mag-w-iva{width:46px}
.mag-edit .mag-w-nota{width:110px}
.mag-edit .mag-w-ddt{max-width:210px;min-width:140px}
.mag-edit .mag-fmt-sel{max-width:120px;font-size:12px}
.mdl.xwide .mag-calc{font-size:11px}
.mdl.xwide .mag-tab button{min-height:26px;padding:2px 7px;font-size:12px}
.mdl.xwide .mag-badge{font-size:10px;padding:0 5px}
.mdl.xwide .mag-tab td .hint{font-size:10.5px}
@media (max-width:760px){.mag-edit input,.mag-edit select{min-height:34px;height:auto;font-size:14px}.mdl.xwide .mag-tab td{font-size:13px}}

.mag-edit input.mag-ro{background:transparent;border-color:transparent;color:var(--muted);cursor:default}

/* --- Crediti IA (mod_ia.js): pillola nell'intestazione e finestra «Crediti IA» --- */
header .ia-pill{display:inline-flex;align-items:center;gap:7px;padding:4px 9px;border:1px solid var(--line);border-radius:999px;color:var(--muted);font-weight:600}
header .ia-pill:hover{color:var(--txt);border-color:var(--accent)}
.ia-pill .ia-lbl{font-size:12px;letter-spacing:.04em;white-space:nowrap}
.ia-pill .ia-bar{display:block;width:44px;height:5px;border-radius:3px;background:var(--line);overflow:hidden;flex:0 0 auto}
.ia-pill .ia-bar i{display:block;height:100%;width:100%;background:var(--ok);border-radius:3px;transition:width .3s}
.ia-pill .ia-num{font-family:var(--mono);font-size:12.5px;font-variant-numeric:tabular-nums}
.ia-pill.basso{color:var(--warn);border-color:var(--warn)}
.ia-pill.basso .ia-bar i{background:var(--warn)}
.ia-pill.critico,.ia-pill.esaurito{color:var(--bad);border-color:var(--bad)}
.ia-pill.critico .ia-bar i,.ia-pill.esaurito .ia-bar i{background:var(--bad)}
.ia-pill.esaurito .ia-bar i{width:0!important}
.ia-box{min-width:0}
/* Le tabelle dei crediti stanno nella finestra (prima la allargavano oltre i 440px: testo tagliato e scorrimento orizzontale) */
.ia-box .ia-tab{width:100%;min-width:0;table-layout:auto}
.ia-box .ia-tab td,.ia-box .ia-tab th{white-space:normal;overflow-wrap:anywhere}
/* Il collegamento alla guida: il blu di serie del browser sul fondo scuro non si leggeva */
.ia-guida a{color:var(--accent);font-weight:700;text-decoration:none}
.ia-guida a:hover{text-decoration:underline}
.ia-box h4{margin:16px 0 6px;font-size:12px;text-transform:uppercase;letter-spacing:.11em;color:var(--muted)}
.ia-saldo{padding:8px 0 4px}
.ia-saldo-n{font-size:40px;font-weight:800;line-height:1.05;font-family:var(--mono);font-variant-numeric:tabular-nums;color:var(--ok)}
.ia-saldo.basso .ia-saldo-n{color:var(--warn)}
.ia-saldo.critico .ia-saldo-n,.ia-saldo.esaurito .ia-saldo-n{color:var(--bad)}
.ia-saldo-l{font-size:12.5px;color:var(--muted);margin-top:2px}
.ia-avviso{border:1px solid var(--bad);border-left-width:4px;border-radius:var(--r-s);padding:9px 12px;margin:10px 0;font-size:13.5px;background:rgba(229,72,77,.08)}
.ia-avviso.warn{border-color:var(--warn);background:rgba(224,161,58,.08)}
.ia-azioni{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:12px 0 4px}
.ia-azioni .hint{margin:0}
.ia-tab{width:100%}
.ia-tab tr.ia-scade td{color:var(--warn)}
.ia-tab tr.ia-scaduto td{color:var(--muted);text-decoration:line-through}
.ia-tab tr.ia-scaduto td .mag-badge{text-decoration:none}
.ia-tab tr.ia-tot td{border-top:2px solid var(--line);border-bottom:none;font-weight:700}
.ia-guida{margin-top:14px}
@media(max-width:760px){
  /* Sul telefono la pillola sta nel menu dell'intestazione (si apre dalla barra della serata). */
  header.open .ia-pill{min-height:34px}
  .ia-box{min-width:0}
  .ia-saldo-n{font-size:34px}
}

/* --- Assistente del locale (mod_assistente.js): pulsante fisso e pannello laterale --- */
/* Il pulsante sta a sinistra del «?» dell'aiuto (che e' a 18 px dal bordo, 42 px largo) e sparisce
   sotto le finestre modali e con il pannello aperto: non copre mai un «Salva». */
.as-fab{position:fixed;right:70px;bottom:20px;z-index:60;display:inline-flex;align-items:center;gap:7px;min-height:42px;padding:0 14px 0 12px;border-radius:999px;background:var(--accent);border:1px solid var(--accent);color:var(--on-accent);font-weight:700;font-size:13.5px;box-shadow:0 4px 14px rgba(0,0,0,.4);cursor:pointer;transition:transform .12s,opacity .12s,background .12s}
.as-fab:hover{background:var(--accent-hover);border-color:var(--accent-hover);transform:translateY(-1px)}
/* «Vivo»: un alone che gira piano dietro al pulsante (gradiente conico sfocato) e un respiro
   lento dell'ombra; la stellina scintilla. Tutto spento con prefers-reduced-motion e quando
   l'assistente non e' pronto (.off). */
.as-fab:not(.off){animation:asRespiro 3.2s ease-in-out infinite;isolation:isolate}
.as-fab:not(.off)::before{content:"";position:absolute;inset:-4px;border-radius:inherit;z-index:-1;
  background:linear-gradient(115deg,#7c5cff,#2dd4bf 45%,#ff6ec7 80%,#7c5cff);
  filter:blur(8px);opacity:.85;animation:asColori 8s linear infinite,asOnda 3.2s ease-in-out infinite}
.as-fab:not(.off)::after{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;background:var(--accent)}
.as-fab:not(.off):hover::after{background:var(--accent-hover)}
.as-fab:not(.off){background:transparent;border-color:transparent}
.as-fab:not(.off) .as-fab-ico{display:inline-block;animation:asScintilla 2.4s ease-in-out infinite;transform-origin:50% 55%}
/* Niente rotazione geometrica (a 90° si vedeva lo spigolo): i colori scorrono con hue-rotate e l'alone si gonfia appena. */
@keyframes asColori{to{filter:blur(8px) hue-rotate(360deg)}}
@keyframes asOnda{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
@keyframes asRespiro{0%,100%{box-shadow:0 4px 14px rgba(0,0,0,.4),0 0 0 0 rgba(124,92,255,0)}50%{box-shadow:0 5px 16px rgba(0,0,0,.42),0 0 8px 1px rgba(124,92,255,.22)}}
@keyframes asScintilla{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.12);opacity:.85}}
.as-fab:focus-visible{outline:2px solid var(--txt);outline-offset:3px}
.as-fab .as-fab-ico{font-size:16px;line-height:1}
.as-fab.off{background:var(--panel2);border-color:var(--line);color:var(--muted)}
.as-fab.off:hover{border-color:var(--accent);color:var(--txt)}
body:has(.mdl-back) .as-fab,body:has(.pos-lock) .as-fab,body.kiosk .as-fab{display:none}
body:has(.ns-installa) .as-fab{bottom:calc(120px + env(safe-area-inset-bottom,0px))}
.as-panel{position:fixed;top:0;right:0;bottom:0;width:min(380px,100vw);max-width:100vw;display:none;flex-direction:column;background:var(--panel);border-left:1px solid var(--line);box-shadow:-12px 0 36px rgba(0,0,0,.35);z-index:250;overflow:hidden}
.as-panel.aperto{display:flex;animation:asEntra .18s ease-out}
@keyframes asEntra{from{transform:translateX(100%)}to{transform:none}}
.as-testa{display:flex;flex-direction:column;gap:2px;padding:8px 8px 6px 12px;border-bottom:1px solid var(--line);background:var(--panel2)}
.as-testa-r{display:flex;justify-content:space-between;align-items:center;gap:8px;min-width:0}
.as-testa-r .as-titolo-k{min-width:0;overflow:hidden;text-overflow:ellipsis}
.as-testa-r .as-titolo-t{flex:1;min-width:0}
.as-titolo-k{font-family:var(--display);font-weight:700;font-size:13px;letter-spacing:.01em;color:var(--accent);white-space:nowrap}
.as-titolo-t{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.as-testa-az{display:flex;gap:2px;flex:0 0 auto}
.as-testa-az button{padding:6px 8px;font-size:12.5px;white-space:nowrap}
.as-testa-az .as-chiudi{font-size:15px}
.as-prec{border-bottom:1px solid var(--line);background:var(--panel2);max-height:42vh;overflow-y:auto;padding:6px 8px}
.as-prec .hint{margin:4px 6px 6px}
.as-prec-riga{display:flex;align-items:stretch;gap:2px}
.as-prec-apri{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:1px;text-align:left;padding:7px 8px;color:var(--txt)}
.as-prec-t{font-size:13px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.as-prec-m{font-size:11px;color:var(--muted);font-family:var(--mono)}
.as-prec-del{flex:0 0 auto;min-width:36px}
.as-lista{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:14px 12px;display:flex;flex-direction:column;gap:10px;scroll-behavior:smooth}
.as-bolla{max-width:90%;padding:10px 12px;border-radius:14px;font-size:14px;line-height:1.45;position:relative;overflow-wrap:anywhere}
.as-bolla.io{align-self:flex-end;background:color-mix(in srgb,var(--accent,#cda349) 22%,var(--panel2));border-bottom-right-radius:4px}
.as-bolla.lui{align-self:flex-start;background:var(--panel2);border:1px solid var(--line);border-bottom-left-radius:4px}
.as-bolla.as-errore{border-color:var(--bad)}
.as-bolla.as-motivo{border-color:var(--warn)}
.as-bolla.as-attesa .as-bolla-testo{letter-spacing:.2em;animation:asPulse 1s infinite}
@keyframes asPulse{0%,100%{opacity:.35}50%{opacity:1}}
.as-bolla-meta{font-size:10.5px;color:var(--muted);margin-top:4px;text-align:right;font-family:var(--mono)}
.as-azione{display:block;margin-top:8px;width:100%;text-align:left;border:1px solid var(--accent,#cda349);background:transparent;color:var(--txt);border-radius:10px;padding:8px 10px;font-size:13px;min-height:40px}
.as-azione:hover{background:color-mix(in srgb,var(--accent,#cda349) 15%,transparent)}
.as-azione:disabled{opacity:.6;border-style:dashed}
.as-azione-testo{margin-top:8px;padding:8px 10px;border:1px dashed var(--line);border-radius:10px;font-size:12.5px}
.as-chips{display:flex;flex-wrap:wrap;gap:6px;padding:0 12px 8px}
.as-chip{font-size:12.5px;padding:5px 11px;border-radius:999px;border:1px solid var(--line);background:var(--panel2);color:var(--txt);min-height:34px}
.as-chip:hover{border-color:var(--accent)}
.as-piede{display:flex;gap:8px;padding:10px 12px calc(12px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line);align-items:flex-end;background:var(--panel)}
.as-piede textarea{flex:1;resize:none;border-radius:12px;min-height:44px;max-height:160px}
.as-piede button{min-height:44px}
@media (max-width:760px){
  /* Telefono: pannello a tutto schermo; il pulsante resta compatto, sopra la barra di sistema. */
  .as-fab{right:68px;bottom:calc(18px + env(safe-area-inset-bottom,0px));padding:0 12px;min-height:42px}
  .as-fab .as-fab-lbl{display:none}
  .as-panel{width:100vw;border-left:0;padding-top:env(safe-area-inset-top,0px)}
  .as-testa-az button{padding:6px 7px;font-size:12px}
  .as-testa-az .as-chiudi{min-width:40px;font-size:17px}
  .as-bolla{max-width:94%}
}
@media (prefers-reduced-motion:reduce){
  .as-fab{transition:none}
  .as-fab:not(.off),.as-fab:not(.off)::before,.as-fab:not(.off) .as-fab-ico{animation:none}
  .as-fab:not(.off)::before{opacity:.45}
  .as-panel.aperto{animation:none}
  .as-bolla.as-attesa .as-bolla-testo{animation:none}
  .as-lista{scroll-behavior:auto}
}
@media print{.as-fab,.as-panel{display:none!important}}
/* Schermo largo: con l'assistente aperto la pagina si stringe e non finisce sotto il pannello (29/10/2026). */
@media (min-width:1280px){ body.as-aperto #app{margin-right:380px} }
/* Impostazioni Casse e Catalogo: le tabelle larghe (Articoli 948 punti, Stampanti 1.104) scorrono nel riquadro
   invece di allargare tutta la pagina, come gia' sul telefono. */
.pos-adm .panel{overflow-x:auto}
.mag-chat-ovunque{padding:6px 14px 0;margin:0}
.as-voto{display:inline-flex;gap:2px;margin-left:8px;vertical-align:middle}
.as-voto-b{background:transparent;border:1px solid transparent;border-radius:6px;padding:0 4px;font-size:13px;line-height:20px;cursor:pointer;opacity:.45;filter:grayscale(1)}
.as-voto-b:hover,.as-voto-b.on{opacity:1;filter:none;border-color:var(--line)}
.as-voto-b.on{background:var(--panel2)}

/* Ingredienti e ricette → lista del magazzino: trova, filtri per gruppo e UM, colonne ordinabili */
.ing-filtri{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:8px 0}
.ing-filtri input[type=search]{flex:1 1 220px;min-width:0}
.ing-tab th.ing-ord{cursor:pointer;user-select:none;white-space:nowrap}
.ing-tab th.ing-ord:hover{color:var(--accent,#cda349)}

/* Ordini Tavoli → scheda del tavolo (2/10/2026): nome, pillole, tre numeri, PR e nota piccoli */
.bt-card .bt-nome{font-size:24px;font-weight:800;line-height:1.15}
.bt-card .bt-pills{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.bt-card .bt-numeri{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
.bt-card .bt-lbl{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.bt-card .bt-val{font-size:22px;font-weight:800;font-variant-numeric:tabular-nums}
.bt-card .bt-val .muted{font-size:16px;font-weight:600}
.bt-card .bt-pr{font-size:13px;color:var(--muted);margin-top:10px}
.bt-card .bt-nota{font-size:13px;color:var(--warn,#E0A526);margin-top:6px}
.bt-card .bt-azioni{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.bt-card .bt-azioni button{flex:1 1 auto;padding:10px 12px;font-size:14px;font-weight:700}
.bt-omaggio{font-size:12px;color:var(--warn,#E0A526);font-weight:700}
/* Cassa: omaggio di riga (2/10/2026) */
.pos-omaggio{color:var(--warn,#E0A526);font-weight:700;font-size:12px;white-space:nowrap}
.pos-line .pos-om{padding:2px 8px;font-size:15px;line-height:1;align-self:center}
/* QR per abilitare un telefono alla vendita: l'SVG senza larghezza propria va dimensionato qui */
.pos-telqr{display:inline-block;background:#fff;padding:8px;border-radius:8px;width:min(280px,72vw);box-sizing:border-box}
.pos-telqr svg{display:block;width:100%;height:auto}
/* Dashboard sala (2/10/2026): numeri della sala, tavoli da incassare e da ordinare */
.sala-num{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin-bottom:12px}
.sala-k{background:var(--panel);border:1px solid var(--line,var(--bord));border-radius:10px;padding:10px 12px}
.sala-k.bad .sala-v{color:var(--bad)}
.sala-v{font-size:22px;font-weight:800;font-variant-numeric:tabular-nums}
.sala-t{cursor:pointer;margin-bottom:8px}
.sala-t-top{display:flex;align-items:baseline;gap:10px}
.sala-t-nome{flex:1;min-width:0;font-size:18px;font-weight:800;overflow:hidden;text-overflow:ellipsis}
.sala-t-eur{font-size:20px;font-weight:800;font-variant-numeric:tabular-nums}
.sala-inc{border:2px solid var(--bad)}
.sala-inc .sala-t-eur{color:var(--bad)}
.sala-ord .sala-t-eur{color:var(--ok)}
.bt-banner{cursor:pointer;font-size:14px;border:1px solid var(--warn,#E0A526)}
/* Ordini Tavoli, le due regole della cassa (14/10/2026): scheda grigia (senza tavolo, in uso da un altro, terminata), «🔒 in uso da» rosso */
.tcard.bt-fuori{opacity:.6}
.tcard.bt-fuori[aria-disabled=true]{cursor:not-allowed}
.tcard .bt-uso{background:rgba(220,40,60,.18);color:var(--bad);border:1px solid var(--bad)}
.bt-niente-ordine{border:1px solid var(--bad);margin-bottom:8px}
/* Bacheca del personale (2/10/2026): notizie, conferma di lettura, commenti; editor e report */
.bch{max-width:760px;margin:0 auto}
.bch-testa{display:flex;align-items:center;gap:10px;justify-content:space-between;flex-wrap:wrap;margin-bottom:6px}
.bch-testa h2{margin:0}
.bch-card{scroll-margin-top:80px}
.bch-card.bch-importante{border:2px solid var(--accent)}
.bch-card.bch-evidenza{box-shadow:0 0 0 3px var(--accent)}
.bch-meta{font-size:12px;color:var(--muted);display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.bch-titolo{margin:6px 0 4px;font-size:20px;line-height:1.25}
.bch-titolo-s{font-weight:800;font-size:16px;margin:4px 0 2px}
.bch-testo{white-space:pre-wrap;font-size:15px;line-height:1.5;overflow-wrap:anywhere}
.bch-testo a{color:var(--accent)}
.bch-media{margin-top:10px}
.bch-media img,.bch-media video{display:block;max-width:100%;max-height:70vh;border-radius:10px;background:#000}
.bch-media img.bch-mini{max-height:180px;max-width:240px}
.bch-scarica{display:inline-block;margin-top:6px;font-size:14px;font-weight:700;color:var(--accent);text-decoration:none}
.bch-conferma{width:100%;margin-top:12px;padding:14px;font-size:17px;font-weight:800}
.bch-confermata{margin-top:10px;font-size:14px;color:var(--ok);font-weight:700}
.bch-tag-imp{background:var(--accent);color:#000;border-color:var(--accent)}
.bch-tag-nuova{color:var(--ok);border-color:var(--ok)}
.bch-tag-conf{color:var(--warn,#E0A526);border-color:var(--warn,#E0A526)}
.bch-bcom{margin-top:10px}
.bch-commenti{margin-top:8px;border-top:1px solid var(--line);padding-top:8px}
.bch-com{display:flex;gap:8px;align-items:flex-start;padding:6px 0}
.bch-av{flex:0 0 30px;height:30px;border-radius:50%;background:var(--panel2,#222);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px}
.bch-com-corpo{flex:1;min-width:0;font-size:14px}
.bch-del{padding:2px 8px;font-size:12px}
.bch-scrivi{margin-top:8px}
.bch-scrivi textarea{width:100%;box-sizing:border-box;font-size:15px;padding:8px;resize:vertical}
.bch-emoji{display:flex;flex-wrap:wrap;gap:2px;margin:4px 0}
.bch-emoji button{padding:2px 6px;font-size:18px;line-height:1.2;border:0}
.bch-scrivi-az{display:flex;gap:8px;justify-content:space-between;margin-top:6px}
.bch-prev{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:6px}
.bch-prog{width:200px;height:6px;border-radius:3px;background:var(--line);overflow:hidden}
.bch-prog i{display:block;height:100%;background:var(--accent);transition:width .2s}
.bch-dest{margin-top:8px}
.bch-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}
.bch-form label.bch-radio,.bch-radio{display:flex;gap:6px;align-items:center;flex-wrap:wrap;text-transform:none;font-size:14px;margin:6px 0}
.bch-radio select{max-width:100%}
.bch-persone{max-height:260px;overflow:auto;border:1px solid var(--line);border-radius:8px;padding:6px;margin-top:6px}
.bch-form label.bch-persona,.bch-persona{display:flex;gap:6px;align-items:center;text-transform:none;font-size:14px;padding:3px 0}
.bch-riass{margin-top:8px;font-size:13px}
.bch-form label.bch-opz,.bch-opz{display:flex;gap:8px;align-items:center;text-transform:none;font-size:14px;margin:6px 0}
.bch-date{gap:12px;flex-wrap:wrap}
.bch-num{display:flex;flex-wrap:wrap;gap:12px;font-size:13px;margin-top:6px}
.bch-barra{height:5px;border-radius:3px;background:var(--line);overflow:hidden;margin-top:6px}
.bch-barra i{display:block;height:100%;background:var(--ok)}
.bch-az{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.bch-az button{padding:6px 10px;font-size:13px}
.bch-riga.bch-st-ritirata,.bch-riga.bch-st-scaduta{opacity:.6}
.bch-stato{text-transform:uppercase;font-size:10px;letter-spacing:.06em}
.bch-st-in-onda .bch-stato{color:var(--ok);border-color:var(--ok)}
.bch-st-programmata .bch-stato{color:var(--warn,#E0A526);border-color:var(--warn,#E0A526)}
.bch-avviso-back{position:fixed;inset:0;background:rgba(0,0,0,.65);z-index:2000;display:flex;align-items:center;justify-content:center;padding:16px}
.bch-avviso{max-width:420px;width:100%;text-align:center}
/* Messaggio a chi lavora la serata (mod_avvisi.js) */
.avv-testa{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px}
.avv-testa h3{margin:0}
.avv-lista{display:flex;flex-direction:column;gap:10px;margin-top:10px}
.avv-riga{border:1px solid var(--line);border-radius:var(--r-s);padding:10px 12px}
.avv-su{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.avv-testo{white-space:pre-wrap;overflow-wrap:anywhere;font-size:14.5px;flex:1;min-width:0;max-height:7.5em;overflow:hidden}
.avv-chip{flex:0 0 auto;font-size:12px;padding:3px 9px;border-radius:999px;border:1px solid var(--warn);color:var(--warn);font-variant-numeric:tabular-nums}
.avv-chip.ok{border-color:var(--ok);color:var(--ok)}
.avv-meta{font-size:12.5px;color:var(--muted);margin-top:4px}
.avv-barra{height:4px;border-radius:2px;background:var(--line);margin-top:8px;overflow:hidden}
.avv-barra i{display:block;height:100%;background:var(--ok)}
.avv-det{margin-top:6px}.avv-det summary{cursor:pointer;font-size:13px;color:var(--muted);padding:4px 0}
.avv-dest{display:flex;flex-direction:column;gap:2px;margin-top:4px}
.avv-d{display:flex;flex-wrap:wrap;gap:2px 10px;font-size:13px;padding:5px 0;border-bottom:1px dashed var(--line)}
.avv-d b{flex:0 0 160px;font-weight:600;overflow-wrap:anywhere}.avv-d span{color:var(--muted)}.avv-d.letto span{color:var(--ok)}
.avv-d small{flex-basis:100%;color:var(--warn)}
.avv-az{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.avv-form{display:flex;flex-direction:column;gap:6px;min-width:0}
.avv-form textarea,.avv-form select{width:100%;max-width:100%;box-sizing:border-box}
.avv-form textarea{font:inherit;font-size:15px;line-height:1.45;resize:vertical}
.avv-lab{font-size:13px;color:var(--muted);margin-top:6px}
.avv-conta{font-size:12px;color:var(--muted);text-align:right;font-variant-numeric:tabular-nums}
.avv-ris{margin-top:10px;padding:10px 12px;border-radius:var(--r-s);background:var(--panel2);font-size:13.5px;line-height:1.5}
.avv-costo{margin-top:4px;color:var(--muted)}.avv-costo.warn{color:var(--warn)}
.avv-popup{max-width:460px;width:100%}
.avv-popup-testo{white-space:pre-wrap;overflow-wrap:anywhere;font-size:16.5px;line-height:1.5;margin:10px 0;max-height:55vh;overflow:auto}
.avv-popup .primary{width:100%;min-height:48px;margin-top:12px}
@media (max-width:520px){.avv-d b{flex-basis:100%}}
.bch-avviso-ico{font-size:44px}
.bch-avviso h2{margin:6px 0}
.bch-avviso-az{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.bch-avviso-az .primary{padding:14px;font-size:17px;font-weight:800}

/* ---------- ORDINI TAVOLI: MODIFICATORI (6/10/2026: carrello a sottorighe, pannello dal basso, conto) ----------
   Chi lo usa e' un cameriere in piedi, al buio, col telefono in una mano. Quattro regole:
   1. IL POLLICE. Il pannello (window.NSModUI, assets/js/pos_mod_ui.js) e' un foglio che sale dal basso a tutta
      larghezza: «✓ Fatto» sta in fondo, dove arriva il pollice, e i gruppi stanno TUTTI in colonna (niente schede,
      niente finestre a catena). Su schermo largo diventa una scheda al centro.
   2. BERSAGLI DA 44 px in su per tutto quello che si tocca (− e +, 🎁, Modifica, opzioni, interruttori, ✕).
   3. LO STATO SI LEGGE SEMPRE: contatore «4 di 6» verde, ROSSO finche' manca; riga del carrello incompleta rossa
      con scritto cosa manca; ADDEBITA spento finche' c'e' una riga rossa.
   4. NIENTE SCORRE DI LATO a 360 px: i nomi lunghi vanno a capo, i prezzi no.
   Il foglio sta sopra le finestre dell'app (300) e sopra il toast (1000): un messaggio rimasto in fondo allo schermo
   non deve coprire «✓ Fatto». */
/* il carrello */
.bt-car{margin-bottom:8px;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--panel2)}
.bt-riga{padding:10px 10px 8px;border-bottom:1px solid var(--line)}
.bt-riga.inc{background:rgba(229,72,77,.10);box-shadow:inset 4px 0 0 var(--bad)}
.bt-riga-t{display:flex;align-items:baseline;gap:10px}
.bt-riga-n{flex:1;min-width:0;font-size:16px;font-weight:700;line-height:1.2;overflow-wrap:anywhere}
.bt-riga-p{flex:0 0 auto;font-size:16px;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
.bt-riga-m{margin-top:4px;padding-left:2px}
.bt-riga-m.tocca{min-height:44px;display:flex;flex-direction:column;justify-content:center;cursor:pointer;-webkit-tap-highlight-color:transparent}
.bt-mod{display:flex;align-items:baseline;gap:8px;min-height:24px;font-size:14px;font-weight:600;line-height:1.3;color:var(--accent)}
.bt-mod .mn{flex:1;min-width:0;overflow-wrap:anywhere}
.bt-mod .mp{font-family:var(--mono);font-size:12.5px;font-weight:500;color:var(--muted);white-space:nowrap}
.bt-mod.no{color:var(--warn)}
.bt-manca{padding:2px 0;color:var(--bad);font-size:14px;font-weight:700;line-height:1.3}
.bt-riga>.bt-omaggio{margin-top:4px;font-size:13px}
.bt-riga-az{display:flex;align-items:center;gap:6px;margin-top:8px}
.bt-riga-az button{flex:0 0 auto;min-width:44px;min-height:44px;padding:0 10px;font-size:19px;font-weight:700;line-height:1;border-radius:9px;background:var(--panel);touch-action:manipulation}
.bt-riga-az button.primary{background:var(--accent)}
.bt-riga-az .q{min-width:28px;text-align:center;font-size:17px;font-weight:800;font-variant-numeric:tabular-nums}
.bt-riga-az .bt-modifica{margin-left:auto;padding:0 14px;font-size:14.5px;color:var(--accent);border-color:var(--accent)}
.bt-riga-az .bt-modifica.bad{color:var(--bad);border-color:var(--bad)}
.bt-car-tot{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:12px 10px;font-size:15px;font-weight:700}
.bt-car-tot span:last-child{white-space:nowrap;font-variant-numeric:tabular-nums}
.bt-haimod{color:var(--muted);font-weight:700}
/* sopra ADDEBITA: la riga da completare e il motivo dell'ultimo rifiuto del server */
.bt-incavviso{display:block;width:100%;min-height:44px;margin-top:8px;padding:10px 12px;text-align:left;border:1px solid var(--bad);border-radius:var(--r-s);background:rgba(229,72,77,.12);color:var(--bad);font-size:14px;font-weight:700;line-height:1.3;touch-action:manipulation}
.bt-rifiuto{margin-top:8px;padding:10px 12px;border:1px solid var(--bad);border-radius:var(--r-s);background:rgba(229,72,77,.12);font-size:14px;line-height:1.35;overflow-wrap:anywhere}
.bt-rifiuto b{color:var(--bad)}
.bt-rifiuto .poi{margin-top:4px;font-size:13px;color:var(--muted)}
button.primary.bt-fermo{opacity:.45}
/* Il messaggio in fondo allo schermo (.toast) si mangiava i tocchi: per i 2 secondi in cui si vede e, peggio, anche
   DOPO, quando e' sparito ma resta li' invisibile sui 20 px piu' bassi, al centro. Su un telefono da 360×740 ADDEBITA,
   arrivato sul fondo, non rispondeva (visto in prova). E' solo testo, non ha niente da toccare: i tocchi gli passano
   attraverso. Vale per tutta l'app. */
.toast{pointer-events:none}
.bt-riga button:focus-visible,.bt-incavviso:focus-visible,.nsm-foglio button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.nsm-foglio button.primary:focus-visible,.nsm-foglio button.on:focus-visible,.bt-riga button.primary:focus-visible{outline-color:var(--txt)}
/* il conto del tavolo: sotto l'articolo un modificatore per riga */
.bt-dett{overflow-wrap:anywhere}
.bt-dett-a{font-weight:600;line-height:1.3}
.bt-dett-a.comp{padding-left:14px;font-weight:500;color:var(--muted)}
.bt-dett-m{padding-left:14px;font-size:13.5px;line-height:1.4;color:var(--accent)}
.bt-dett-m.no{color:var(--warn)}
.bt-dett-n{margin-top:2px;font-size:12.5px;font-style:italic;color:var(--muted)}
.bt-dett .via{text-decoration:line-through;opacity:.6}
/* il foglio dei modificatori */
.nsm-velo{position:fixed;inset:0;z-index:1100;display:flex;align-items:flex-end;justify-content:center;background:rgba(8,7,6,.66);overscroll-behavior:contain;animation:nsm-velo .14s ease-out both}
.nsm-foglio{position:relative;display:flex;flex-direction:column;box-sizing:border-box;width:100%;max-width:560px;max-height:90vh;max-height:90dvh;background:var(--panel);border:1px solid var(--line);border-bottom:0;border-radius:16px 16px 0 0;box-shadow:0 -14px 40px rgba(0,0,0,.6);outline:none;animation:nsm-su .18s cubic-bezier(.2,.8,.2,1) both}
.nsm-foglio.inc{border-color:var(--bad)}
.nsm-presa{flex:0 0 auto;width:38px;height:4px;margin:8px auto 2px;border-radius:2px;background:var(--line)}
.nsm-testa{flex:0 0 auto;display:flex;align-items:center;gap:8px;padding:4px 8px 10px 16px;border-bottom:1px solid var(--line)}
.nsm-chi{flex:1;min-width:0}
.nsm-chi b{display:block;font-size:18px;font-weight:800;line-height:1.2;overflow-wrap:anywhere}
.nsm-prezzo{display:block;margin-top:3px;font-family:var(--mono);font-size:15px;font-weight:600;color:var(--accent)}
.nsm-x{flex:0 0 44px;width:44px;height:44px;min-height:44px;padding:0;font-size:18px;touch-action:manipulation}
.nsm-corpo{flex:1 1 auto;min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;display:flex;flex-direction:column;gap:14px;padding:12px 12px 10px}
.nsm-corpo>*{flex:0 0 auto}
.nsm-g{min-width:0}
.nsm-g-h{display:flex;align-items:center;flex-wrap:wrap;column-gap:10px;min-height:44px;margin-bottom:4px}
.nsm-g-h b{font-size:16px;font-weight:800;overflow-wrap:anywhere}
.nsm-g.bad .nsm-g-h b{color:var(--bad)}
.nsm-cnt{font-family:var(--mono);font-size:17px;font-weight:700;color:var(--ok);white-space:nowrap}
.nsm-cnt.bad{color:var(--bad)}
.nsm-reg{font-size:13px;color:var(--muted)}
.nsm-reg.bad{color:var(--bad);font-weight:600}
.nsm-azz{margin-left:auto;min-height:44px;padding:0 12px;font-size:14px;font-weight:600;touch-action:manipulation}
.nsm-o{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.nsm-o.qta{grid-template-columns:minmax(0,1fr)}
.nsm-b{min-height:54px;padding:8px 12px;display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:left;font-size:15.5px;font-weight:700;line-height:1.15;border-radius:10px;touch-action:manipulation;-webkit-user-select:none;user-select:none}
.nsm-b span:first-child{min-width:0;overflow-wrap:anywhere}
.nsm-b.on{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.nsm-b:disabled{opacity:.35}
.nsm-b .p,.nsm-q .p,.nsm-sw .p{font-family:var(--mono);font-size:12.5px;font-weight:600;opacity:.85;white-space:nowrap}
.nsm-q{display:grid;grid-template-columns:minmax(0,1fr) 52px 36px 52px;align-items:center;gap:4px;min-height:58px;box-sizing:border-box;padding:4px 4px 4px 12px;border:1px solid var(--line);border-radius:10px;background:var(--panel2)}
.nsm-q.on{border-color:var(--accent)}
.nsm-q .nm{min-width:0;display:flex;flex-direction:column;gap:2px;font-size:15.5px;font-weight:700;line-height:1.15}
.nsm-q .nm span:first-child{overflow-wrap:anywhere}
.nsm-q .n{text-align:center;font-family:var(--mono);font-size:21px;font-weight:700;color:var(--muted)}
.nsm-q.on .n{color:var(--accent)}
.nsm-q button{width:52px;height:48px;min-height:48px;padding:0;font-size:25px;font-weight:700;line-height:1;border-radius:9px;background:var(--panel);touch-action:manipulation}
.nsm-q button:disabled{opacity:.28}
.nsm-sw{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:54px;padding:6px 12px;text-align:left;font-size:15.5px;font-weight:700;line-height:1.2;border-radius:10px;touch-action:manipulation;-webkit-user-select:none;user-select:none}
.nsm-sw .nm{min-width:0;overflow-wrap:anywhere}
.nsm-sw.on{border-color:var(--accent)}
.nsm-sw.bad{border-color:var(--bad)}
.nsm-lev{flex:0 0 46px;position:relative;width:46px;height:26px;border-radius:13px;background:var(--line);transition:background .12s}
.nsm-lev::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:var(--muted);transition:transform .12s,background .12s}
.nsm-sw.on .nsm-lev{background:var(--accent)}
.nsm-sw.on .nsm-lev::after{transform:translateX(20px);background:var(--on-accent)}
.nsm-domanda{display:flex;flex-direction:column;gap:10px}
.nsm-dom-t{font-size:16px;font-weight:700}
.nsm-domanda button{min-height:58px;font-size:17px;font-weight:800;touch-action:manipulation}
.nsm-domanda .hint{margin:0;font-size:13px}
.nsm-piede{flex:0 0 auto;padding:8px 12px 10px;padding-bottom:max(10px,env(safe-area-inset-bottom));border-top:1px solid var(--line)}
.nsm-manca{margin-bottom:8px;color:var(--bad);font-size:14px;font-weight:700;line-height:1.3;overflow-wrap:anywhere}
.nsm-az{display:flex;gap:8px}
.nsm-def{flex:0 0 auto;min-height:54px;padding:0 14px;font-size:14.5px;font-weight:600;touch-action:manipulation}
.nsm-fatto{flex:1 1 auto;width:100%;min-height:54px;font-size:17px;font-weight:800;touch-action:manipulation}
/* col foglio aperto, sul telefono, la pagina sotto non scorre (sul PC resterebbe senza barra e salterebbe di lato) */
@media (hover:none){ html.nsm-aperto{overflow:hidden} }
@keyframes nsm-su{from{transform:translateY(28px);opacity:0}to{transform:none;opacity:1}}
@keyframes nsm-velo{from{opacity:0}to{opacity:1}}
@media(min-width:700px){
  .nsm-velo{align-items:center;padding:16px}
  .nsm-foglio{max-height:86vh;border-bottom:1px solid var(--line);border-radius:16px}
  .nsm-foglio.inc{border-color:var(--bad)}
  .nsm-presa{visibility:hidden;margin:4px auto 0}
}
@media (prefers-reduced-motion:reduce){ .nsm-velo,.nsm-foglio{animation:none} .nsm-lev,.nsm-lev::after{transition:none} }

/* ---------- OMAGGI INGRESSO (mod_omaggi.js, 9/10/2026): la lista omaggi nominativa della serata ----------
   Si usa dal telefono, in piedi, a serata in corso: ogni bersaglio e' alto almeno 44 px, i campi sono a 16 px
   (sotto, iOS ingrandisce lo schermo a ogni tocco), il fuoco da tastiera si vede, niente vive solo col mouse.
   I colori sono solo quelli delle variabili del tema. */
.omg button,.omg a.omg-b,.omg-mdl button,.omg-mdlbox .mdl-foot button,.omg-mdlbox .mdl-head button{min-height:44px;min-width:44px;touch-action:manipulation}
.omg input:not([type=checkbox]),.omg select,.omg-mdl input:not([type=checkbox]),.omg-mdl select,.omg-mdl textarea{min-height:44px;font-size:16px;font-family:var(--ui);text-align:left}
.omg input:focus-visible,.omg select:focus-visible,.omg-mdl input:focus-visible,.omg-mdl select:focus-visible,.omg-mdl textarea:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.omg [hidden],.omg-mdl [hidden]{display:none!important}
.omg-carico{color:var(--muted);padding:18px 0;text-align:center}
.omg-b{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:0 14px;font-weight:600;white-space:nowrap}
a.omg-b{border:1px solid var(--line);background:var(--panel2);border-radius:var(--r-s);color:var(--txt);text-decoration:none;font-size:13.5px}
a.omg-b:hover{border-color:var(--accent)}
.omg span.bad,.omg-mdl span.bad,.omg-nota-campo.bad,.omg-agg-ora.bad{color:var(--bad)}.omg span.warn,.omg-mdl span.warn{color:var(--warn)}
/* testa: serata, contatori, tetti, regola di stasera */
.omg-testa-su{display:flex;justify-content:space-between;align-items:flex-start;gap:8px 16px;flex-wrap:wrap}
.omg-testa-su h3{margin:0;font-size:17px}
.omg-serata{color:var(--muted);font-size:13.5px;margin-top:2px}
.omg-stato{display:flex;align-items:center;justify-content:flex-end;gap:6px 8px;font-size:12.5px;color:var(--muted);flex:none}
.omg-testa-su>div:first-child{flex:1 1 180px;min-width:0}
.omg-agg-ora{font-size:12.5px;color:var(--muted);margin-top:2px}
.omg-vivo{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;border:1px solid var(--ok);color:var(--ok);font-weight:700;white-space:nowrap}
.omg-vivo i{width:8px;height:8px;border-radius:50%;background:var(--ok);animation:liveblink 1.6s steps(2,start) infinite}
.omg-num{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}
.omg-n{background:var(--panel2);border:1px solid var(--line);border-radius:var(--r-s);padding:8px 12px;display:flex;flex-direction:column;gap:2px;min-width:0}
.omg-n b{font:600 26px/1.1 var(--mono);letter-spacing:-.02em}
.omg-n>span{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.09em;line-height:1.3}
.omg-n.entrati b{color:var(--ok)}
.omg-barra{height:6px;border-radius:99px;background:var(--line);overflow:hidden;margin-top:5px}
.omg-barra i{display:block;height:100%;background:var(--accent);border-radius:99px;transition:width .25s}
.omg-barra.ok i{background:var(--ok)}.omg-barra.warn i{background:var(--warn)}.omg-barra.bad i{background:var(--bad)}
.omg-tetti{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px 18px;margin-top:12px}
.omg-tetto-t{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:13px;flex-wrap:wrap}
.omg-tetto-t span{color:var(--muted)}
.omg-tetto.poco .omg-tetto-t b{color:var(--warn)}.omg-tetto.pieno .omg-tetto-t b{color:var(--bad)}
.omg-regola{display:flex;justify-content:space-between;align-items:center;gap:8px 14px;flex-wrap:wrap;margin:0 0 12px;padding:8px 16px;border:1px dashed var(--line);border-radius:var(--r);font-size:13.5px;line-height:1.45}
.omg-regola>div{flex:1 1 260px;min-width:0}
.omg-regola-eti{color:var(--muted)}
/* avvisi */
.omg-avviso{border:1px solid var(--line);border-left:4px solid var(--muted);background:var(--panel2);border-radius:var(--r-s);padding:10px 12px;margin-bottom:10px;font-size:13.5px;line-height:1.5}
.omg-avviso.bad{border-left-color:var(--bad)}.omg-avviso.warn{border-left-color:var(--warn)}.omg-avviso.ok{border-left-color:var(--ok)}.omg-avviso.info{border-left-color:var(--accent)}
.omg-avviso>.omg-b{display:flex;margin-top:8px}
.omg-avviso.omg-spento{border:2px solid var(--bad);font-size:14.5px;background:var(--panel2);background:color-mix(in srgb,var(--bad) 14%,var(--panel2))}   /* freno d'emergenza: la porta non riceve niente */
.omg-avviso-cosa{margin-top:4px;color:var(--muted)}
.omg-lotto{display:flex;justify-content:space-between;align-items:center;gap:8px 14px;flex-wrap:wrap}
.omg-lotto>span{flex:1 1 240px}.omg-lotto>.omg-b{margin-top:0}
.omg-mdl p{margin:0 0 10px;line-height:1.5}
/* aggiungi in fretta */
.omg-agg h3{font-size:15px}
.omg-campo{display:flex;flex-direction:column;gap:3px;min-width:0}
.omg-campo>label{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.09em;font-weight:500}
.omg-campo input:not([type=checkbox]),.omg-campo select,.omg-campo textarea{width:100%;min-width:0}
.omg-nota-campo{font-size:12.5px;color:var(--muted);line-height:1.4}
.omg-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 12px;align-items:end}
.omg-form .c-nome{grid-column:1}.omg-form .c-piu{grid-column:2}
.omg-form .c-nome input{font-size:17px;font-weight:600}
.omg-form .c-nome{position:relative}
.omg-rubrica{position:absolute;left:0;right:0;top:100%;z-index:20;margin-top:4px;background:var(--panel);border:1px solid var(--accent);border-radius:var(--r-s);box-shadow:0 12px 30px rgba(0,0,0,.5);max-height:320px;overflow:auto}
.omg-rub-t{padding:7px 12px;font-size:11.5px;color:var(--muted);border-bottom:1px solid var(--line)}
.omg-rub-v{display:flex;flex-direction:column;align-items:flex-start;gap:1px;width:100%;min-height:52px;padding:8px 12px;background:none;border:0;border-bottom:1px solid var(--line);border-radius:0;color:inherit;text-align:left;cursor:pointer}
.omg-rub-v:last-child{border-bottom:0}
.omg-rub-v:hover,.omg-rub-v:focus-visible{background:var(--panel2)}
.omg-rub-v b{font-size:15px}
.omg-rub-v span{font-size:13px;color:var(--muted);overflow-wrap:anywhere}
.omg-rub-v small{font-size:11.5px;color:var(--muted)}
.omg-apri{display:none}
.omg-sotto{display:contents}
.omg-altri{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.9fr) minmax(0,1fr) minmax(0,1.2fr);gap:10px 12px;align-items:start}
.omg-form-az{grid-column:1/-1;display:flex;gap:8px;flex-wrap:wrap}
.omg-vai{padding:0 26px;font-size:15px;justify-self:start;min-width:150px}
.omg-incolla{justify-self:end}
.omg-piu-riga{display:flex;align-items:center;gap:10px}
.omg-posti{font:500 13px var(--mono);color:var(--muted);white-space:nowrap;min-width:74px}
.omg-pmbox{display:inline-flex;flex:none;align-self:flex-start;align-items:stretch;border:1px solid var(--line);border-radius:var(--r-s);overflow:hidden;background:var(--panel2)}
.omg-pmbox .omg-pm{flex:none;min-width:44px;min-height:44px;border:0;border-radius:0;background:transparent;font-size:22px;line-height:1;padding:0;font-weight:500}
.omg-pmbox .omg-pm:focus-visible{outline-offset:-2px}
.omg-campo .omg-pmbox input.omg-pm-n,.omg-pmbox input.omg-pm-n{flex:none;width:50px;min-width:50px;min-height:44px;border:0;border-left:1px solid var(--line);border-right:1px solid var(--line);border-radius:0;text-align:center;font:600 18px var(--mono);padding:0;background:transparent;-moz-appearance:textfield;appearance:textfield}
.omg-pmbox .omg-pm-n:focus-visible{outline-offset:-2px}
.omg-pm-n::-webkit-outer-spin-button,.omg-pm-n::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.omg-manda{display:flex;align-items:center;gap:8px;min-height:44px;font-size:13.5px;cursor:pointer;line-height:1.35}
.omg-manda input{width:20px;height:20px;flex:none}
.omg-err{color:var(--bad);font-size:14px;font-weight:600;margin-top:10px;padding:10px 12px;border:1px solid var(--bad);border-radius:var(--r-s);line-height:1.45;overflow-wrap:anywhere}
.omg-esito{margin-top:10px;padding:10px 12px;border:1px solid var(--ok);border-left-width:4px;border-radius:var(--r-s);background:var(--panel2);font-size:13.5px;line-height:1.5}
.omg-esito.warn{border-color:var(--warn);color:inherit}
.omg-esito>b{font-size:14.5px}
.omg-esito-porta{font-weight:600}
.omg-esito>.omg-b{margin:8px 8px 0 0}
.omg-fermo{margin-bottom:12px}
.omg-invito{margin-top:14px;padding-top:12px;border-top:1px dashed var(--line)}
.omg-invito-su{display:flex;align-items:center;gap:8px 14px;flex-wrap:wrap}
.omg-invito-su>.omg-nota-campo{flex:1 1 240px}
.omg-invito-vai{font-weight:700;min-height:44px}
.omg-invito-az{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.omg-invito-az>.omg-b{margin:0}
.omg-inviti{margin-top:12px;border:1px solid var(--line);border-radius:var(--r-s);overflow:hidden}
.omg-inviti-t{padding:8px 12px;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.09em;font-weight:500;border-bottom:1px solid var(--line)}
.omg-invito-riga{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px;padding:10px 12px;border-bottom:1px solid var(--line)}
.omg-invito-riga:last-child{border-bottom:0}
.omg-invito-riga.s-scaduto,.omg-invito-riga.s-annullato{opacity:.7}
.omg-invito-chi{flex:1 1 220px;min-width:0;font-size:13.5px;overflow-wrap:anywhere}
.omg-invito-chi span{color:var(--muted)}
.omg-invito-riga>.omg-invito-az{flex-basis:100%;margin-top:2px}
.omg-invito-opz{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;margin-bottom:10px}
.omg-invito-usi{display:inline-flex;align-items:center;gap:8px;font-size:14px}
.omg-invito-n{width:72px;min-height:40px;text-align:center;font-variant-numeric:tabular-nums}
.omg-invito-appr{display:inline-flex;align-items:center;gap:8px;min-height:40px;font-size:14px;cursor:pointer}
.omg-invito-appr input{width:20px;height:20px;margin:0;accent-color:var(--accent)}
.omg-invito-chip{display:inline-flex;flex-wrap:wrap;align-items:center;gap:6px}
.omg-rich{border-color:var(--warn)}
.omg-rich-su{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.omg-rich-su h3{margin:0}
.omg-rich-su>.omg-b{margin-left:auto}
.omg-rich>.omg-nota-campo{margin:6px 0 0}
.omg-rich-meta{margin-top:2px;font-size:12.5px;color:var(--muted)}
.omg-rich-riga.s-rifiutata .omg-invito-chi{opacity:.75}
.omg-rich-fatte{margin-top:12px}
.omg-rich-fatte>summary{cursor:pointer;font-size:13px;color:var(--muted);padding:4px 0}
/* elenco */
.omg-el-testa h3{font-size:15px}
.omg-strumenti{display:flex;gap:8px 12px;flex-wrap:wrap;align-items:center;margin-bottom:10px}
.omg-filtri{display:flex;gap:6px;flex-wrap:wrap}
.omg-filtro{border-radius:999px;padding:0 14px;display:inline-flex;align-items:center;gap:7px;font-weight:600}
.omg-filtro.on{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.omg-filtro-n{font:600 12px var(--mono);opacity:.8}
input.omg-cerca{flex:1 1 220px;min-width:0}
body.sola-lettura main input.omg-cerca,body.frozen:not(.role-admin):not(.role-pr):not(.frozen-scrive) main input.omg-cerca{pointer-events:auto;opacity:1}
.omg-lista{border:1px solid var(--line);border-radius:var(--r-s);overflow:hidden}
.omg-riga{border-bottom:1px solid var(--line);border-left:4px solid transparent}
.omg-riga:last-child{border-bottom:0}
.omg-riga.v-entrato{border-left-color:var(--ok)}.omg-riga.v-parziale{border-left-color:var(--warn)}.omg-riga.v-tolto{border-left-color:var(--muted)}.omg-riga.irregolare{border-left-color:var(--bad)}
.omg-riga.aperta{background:var(--panel2)}
.omg-riga.nuovo{animation:omgNuovo 2.4s ease-out 1}
@keyframes omgNuovo{0%{background:var(--accent-glow)}100%{background:transparent}}
.omg .omg-riga-t{display:grid;width:100%;min-height:54px;text-align:left;background:transparent;border:0;border-radius:0;padding:8px 10px;gap:3px 14px;align-items:center;font-weight:400;font-size:13.5px;color:inherit;
  grid-template-columns:minmax(0,2fr) minmax(0,1.5fr) minmax(0,1.25fr) 112px minmax(132px,auto) 14px;grid-template-areas:"nome chi ins mail stato fr"}
.omg .omg-riga-t:focus-visible{outline-offset:-2px}
.omg-r-nome{grid-area:nome;display:flex;align-items:baseline;gap:8px;min-width:0;font-weight:700;font-size:15px}
.omg-r-nn{overflow-wrap:anywhere}
.omg-r-piu{flex:none;font:700 12.5px var(--mono);padding:1px 7px;border-radius:999px;background:var(--accent);color:var(--on-accent)}
.omg-r-chi{grid-area:chi}.omg-r-ins{grid-area:ins}
.omg-r-chi,.omg-r-ins{display:flex;gap:2px 8px;flex-wrap:wrap;align-items:center;min-width:0;font-size:12.5px;color:var(--muted);overflow-wrap:anywhere}
.omg-r-nota{font-style:italic}
.omg-segno{color:var(--warn);border:1px solid var(--warn);border-radius:999px;padding:0 7px;font-size:11px;font-weight:600;white-space:nowrap}
.omg-r-mail{grid-area:mail;font-size:12.5px;white-space:nowrap;color:var(--muted)}
.omg-r-mail.ok{color:var(--ok)}
.omg-r-stato{grid-area:stato;display:flex;flex-direction:column;align-items:flex-end;gap:2px;min-width:0}
.omg-r-freccia{grid-area:fr;color:var(--muted);font-size:14px;text-align:center}
.omg-chip{display:inline-block;padding:3px 10px;border-radius:999px;border:1px solid var(--line);font-size:12.5px;font-weight:700;white-space:nowrap;color:var(--txt)}
.omg-chip.ok{border-color:var(--ok);color:var(--ok)}.omg-chip.warn{border-color:var(--warn);color:var(--warn)}
.omg span.omg-chip.bad{border-color:var(--bad);background:var(--bad);color:#fff}
.omg-chip.tolto,.omg-chip.spento{color:var(--muted);border-style:dashed}
.omg-riga.v-tolto .omg-r-nn{text-decoration:line-through;color:var(--muted)}
.omg-r-ora{font-size:12.5px;color:var(--muted);white-space:nowrap}
.omg-riga-d{display:grid;gap:7px;padding:4px 12px 14px}
.omg-riga-d .omg-avviso{margin:0}
.omg-d-voce{display:grid;grid-template-columns:104px minmax(0,1fr);gap:8px;font-size:13.5px;line-height:1.45}
.omg-d-k{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.09em;padding-top:2px}
.omg-d-v{overflow-wrap:anywhere}.omg-d-voce.muto .omg-d-v{color:var(--muted)}
.omg-cod{font-family:var(--mono);letter-spacing:.06em;-webkit-user-select:all;user-select:all}
.omg-azioni{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.omg .omg-togli{color:var(--bad);border-color:var(--bad);background:transparent}
.omg-mdlbox .omg-pericolo{background:var(--bad);border-color:var(--bad);color:#fff;font-weight:700}
.omg-nota-az{font-size:13px;color:var(--muted);line-height:1.5}
.omg-nota-az .omg-b{display:flex;margin-top:6px}
.omg-vuoto{padding:22px 12px;text-align:center;color:var(--muted);line-height:1.5}
.omg-vuoto b{color:var(--txt);display:block;margin-bottom:4px}
.omg-vuoto .omg-b{margin-top:10px}
.omg-conta{font-size:12.5px;color:var(--muted);margin-top:6px;min-height:1em}
/* riepiloghi e impostazioni */
.omg-riep{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:0 12px}
.omg-riep h3{font-size:15px}
.omg-imp{padding-top:0;padding-bottom:0}
.omg-imp[open]{padding-bottom:14px}
.omg-imp>summary{cursor:pointer;min-height:48px;display:flex;align-items:center;gap:8px;font:700 15px var(--display);list-style:none}
.omg-imp>summary::-webkit-details-marker{display:none}
.omg-imp>summary::before{content:"▸";color:var(--muted);font-family:var(--ui)}
.omg-imp[open]>summary::before{content:"▾"}
.omg-imp-form h4{margin:14px 0 8px;font:700 13.5px var(--display)}
.omg-imp-griglia{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px 12px;margin-bottom:8px;align-items:start}
.omg-imp-form .omg-form-az{margin-top:12px}
/* finestre */
.omg-mdl .omg-campo{margin-bottom:10px}
.omg-mdl .omg-avviso{margin-bottom:12px}
.omg-mdlbox .mdl-head h3{overflow-wrap:anywhere}
.omg-mdlbox:not(.wide){align-self:center}   /* sul telefono le finestre si stirano a tutta altezza: queste restano alte quanto serve */
.omg-inc-ta{width:100%;min-height:190px;line-height:1.5;resize:vertical}
.omg-inc-comuni{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:0 12px;align-items:start}
.omg-inc-righe{border:1px solid var(--line);border-radius:var(--r-s);max-height:42vh;overflow:auto;margin:10px 0}
.omg-inc-r{display:grid;grid-template-columns:26px minmax(0,1fr) minmax(0,auto);gap:2px 10px;padding:8px 10px;border-bottom:1px solid var(--line);align-items:baseline;font-size:13.5px;line-height:1.4}
.omg-inc-r:last-child{border-bottom:0}
.omg-inc-n{font:500 12px var(--mono);color:var(--muted)}
.omg-inc-wa{display:flex;gap:10px;align-items:flex-start;margin:10px 0;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-s);background:var(--panel2);font-size:13.5px;line-height:1.45;cursor:pointer}
.omg-inc-wa input{width:22px;height:22px;flex:0 0 auto;margin:1px 0 0;accent-color:var(--accent)}
.omg-inc-chi{display:flex;gap:2px 8px;flex-wrap:wrap;align-items:baseline;min-width:0;overflow-wrap:anywhere}
.omg-inc-cont{color:var(--muted);font-size:12.5px;flex-basis:100%}
.omg-inc-esito{font-weight:600;text-align:right}
.omg-inc-r.ok .omg-inc-esito{color:var(--ok)}.omg-inc-r.ko .omg-inc-esito{color:var(--bad)}
.omg-inc-r.ko{border-left:3px solid var(--bad)}
.omg-lotto-nomi{list-style:none;margin:0 0 10px;padding:0;max-height:34vh;overflow:auto;border:1px solid var(--line);border-radius:var(--r-s)}
.omg-lotto-nomi li{display:flex;justify-content:space-between;gap:2px 12px;flex-wrap:wrap;padding:8px 10px;border-bottom:1px solid var(--line);font-size:13.5px}
.omg-lotto-nomi li:last-child{border-bottom:0}
.omg-lotto-nomi li span{color:var(--muted);overflow-wrap:anywhere}
.omg-lotto-stato:empty{display:none}
/* tablet in piedi: la riga dell'elenco su due linee */
@media(max-width:1023px){
  .omg .omg-riga-t{grid-template-columns:minmax(0,1.5fr) minmax(0,1.2fr) auto 14px;grid-template-areas:"nome chi stato fr" "ins mail stato fr"}
  .omg-r-mail{justify-self:start}
  .omg-altri{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* telefono: il nome prima di tutto, «Aggiungi» accanto al contatore, gli altri dati dietro un tasto */
@media(max-width:760px){
  .omg-num{gap:6px}
  .omg-n{padding:8px 9px}.omg-n b{font-size:24px}.omg-n>span{font-size:10.5px;letter-spacing:.05em}
  .omg-aggiorna span{display:none}
  .omg-aggiorna{font-size:19px;padding:0}
  .omg-regola{padding:8px 12px}
  .omg-mdlbox:not(.wide){margin:8px;width:calc(100% - 16px)}
  .omg-form{grid-template-columns:auto minmax(0,1fr);grid-template-areas:"nome nome" "piu vai" "sotto sotto" "altri altri"}
  .omg-sotto{grid-area:sotto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}
  .omg-form .c-nome{grid-area:nome}.omg-form .c-piu{grid-area:piu}
  .omg-vai{grid-area:vai;justify-self:stretch;min-width:0;padding:0 10px}
  .omg-incolla{justify-self:stretch}
  .omg-apri{display:inline-flex}
  .omg-r-porta{display:none}
  .omg-apri,.omg-incolla{padding:0 8px;font-size:13px}
  .omg-altri{grid-area:altri;display:none;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .omg-altri.aperti{display:grid}
  .omg-altri .c-email,.omg-altri .c-tel{grid-column:1/-1}
  .omg-posti{min-width:0}
  .omg-filtri{flex:1 1 100%}
  .omg-filtro{padding:0 12px}
  .omg .omg-riga-t{grid-template-columns:minmax(0,1fr) auto 12px;grid-template-areas:"nome stato fr" "chi chi fr" "ins mail fr";padding:9px 8px;gap:3px 8px}
  .omg-r-chi:empty{display:none}
  .omg-r-mail{justify-self:end}
  .omg-d-voce{grid-template-columns:86px minmax(0,1fr)}
  .omg-azioni .omg-b{flex:1 1 calc(50% - 8px)}
  .omg-riga-d{padding:4px 10px 12px}
  .omg-inc-r{grid-template-columns:22px minmax(0,1fr)}
  .omg-inc-esito{grid-column:2;text-align:left}
  .omg-mdlbox .mdl-foot button{flex:1 1 auto}
}

/* ============================================================================================================
   TAP TO PAY SU iPHONE — i requisiti di Apple (docs/APPLE-TAP-TO-PAY-REQUISITI.md). Tutto qui sotto vale solo dove la
   pagina mette queste classi: nell'app per iPhone, su una postazione con la carta sul telefono (Stripe). Altrove niente.
   ============================================================================================================ */
/* Il simbolo di Apple (lo da' l'app come immagine): fa da sagoma e prende il colore del testo del tasto. */
.pos-tap-simb{display:inline-block;flex:0 0 auto;width:1.35em;height:1.35em;vertical-align:-.28em;margin-right:.4em;background-color:currentColor;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain}
/* Il tasto: simbolo e scritta su una riga, mai spento. Dove ci sono piu' metodi sta da solo in cima, largo quanto il conto. */
.pos-pay button.pos-tap,.pos-ling-inc.pos-tap,.pos-pag button.pos-tap{display:inline-flex;align-items:center;justify-content:center;gap:0;white-space:nowrap}
.pos-pay button.pos-tap{border-color:var(--accent);font-weight:800}
.pos-pay.pos-tap-su{grid-template-columns:1fr;padding-bottom:0}
.pos-pay.pos-tap-su>button{min-height:60px;font-size:18px}
.pos-wrap.stretto .pos-cart>.pos-pay.pos-tap-su{grid-template-columns:1fr;padding:6px 8px 0}
.pos-wrap.stretto .pos-cart>.pos-pay.pos-tap-su>button{grid-column:1 / -1;min-height:58px;font-size:18px}
body.pos-stretto .mdl .pos-pay>button.pos-tap{font-size:19px}
.pos-wrap.stretto .pos-ling-inc.pos-tap{flex-direction:row;gap:0}
.pos-wrap.stretto .pos-ling-inc.pos-tap .pos-tap-simb{width:1.5em;height:1.5em;margin-right:.3em}
.pos-wrap.stretto .pos-ling-inc.pos-tap small{margin-left:.28em;font-size:inherit;font-weight:inherit;opacity:1}
/* Il richiamo «c'e' e non e' ancora attivato»: una riga sopra la linguetta, richiudibile. */
.pos-wrap.stretto .pos-ling-tap{flex:0 0 100%;display:flex;align-items:center;gap:6px;box-sizing:border-box;padding:2px 2px 2px 6px;font-size:14.5px;font-weight:600;line-height:1.25}
.pos-wrap.stretto .pos-ling-tap .t{flex:1 1 auto;min-width:0}
.pos-wrap.stretto .pos-ling-tap button{flex:0 0 auto;min-height:40px;padding:0 12px;font-size:14.5px;font-weight:700}
.pos-wrap.stretto .pos-ling-tap button.ghost{min-width:40px;padding:0 8px}
/* La finestra dello stato (quando l'app non ha ancora la sua schermata). */
.pos-tap-st{margin:4px 0 8px;font-size:18px;font-weight:800}
.pos-tap-st.ok{color:var(--ok)}.pos-tap-st.no{color:var(--warn,#d68910)}
/* L'ESITO A TUTTO SCHERMO (Apple 5.9): sopra a tutto, anche al QR dei drink; i messaggi brevi restano leggibili sopra. */
.mdl-back.pos-tapesito{z-index:1300;padding:0;align-items:stretch;justify-content:stretch;background:var(--bg)}
.mdl-back.pos-tapesito>.mdl{width:100%;max-width:none;height:100%;max-height:none;margin:0;border:0;border-radius:0;box-shadow:none;display:flex;flex-direction:column;background:var(--bg);
  padding:env(safe-area-inset-top,0px) 0 env(safe-area-inset-bottom,0px)}
.mdl-back.pos-tapesito>.mdl>.mdl-head{flex:0 0 auto;justify-content:center;text-align:center;border-bottom:0}
.mdl-back.pos-tapesito>.mdl>.mdl-head h3{font-size:16px;font-weight:600;opacity:.75}
.mdl-back.pos-tapesito>.mdl>.mdl-body{flex:1 1 auto;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;max-height:none;overflow:auto;padding:16px 18px 18px}
.mdl-back.pos-tapesito .pos-palm-stato{display:flex;flex-direction:column;align-items:center;gap:10px;margin:0!important;font-size:inherit!important}
.pos-tape-i{display:flex;align-items:center;justify-content:center;width:104px;height:104px;border-radius:50%;font-size:60px;font-weight:800;line-height:1;color:#fff;background:var(--ok)}
.mdl-back.pos-tapesito.ko .pos-tape-i{background:var(--bad)}
.mdl-back.pos-tapesito.dubbio .pos-tape-i{background:var(--warn,#d68910)}
.pos-tape-t{font-family:var(--display);font-size:29px;font-weight:800;line-height:1.15;letter-spacing:-.01em;text-align:center}
.mdl-back.pos-tapesito.ok .pos-tape-t{color:var(--ok)}.mdl-back.pos-tapesito.ko .pos-tape-t{color:var(--bad)}.mdl-back.pos-tapesito.dubbio .pos-tape-t{color:var(--warn,#d68910)}
.pos-tape-v{font-family:var(--mono);font-size:46px;font-weight:600;line-height:1.1}
.mdl-back.pos-tapesito .pos-palm-sotto{max-width:460px;font-size:17px;line-height:1.4;text-align:center;color:var(--txt)}
.mdl-back.pos-tapesito .pos-pay{width:100%;max-width:520px;box-sizing:border-box;margin-top:auto;padding:14px 0 0!important;gap:8px}
.mdl-back.pos-tapesito .pos-pay>button{min-height:62px!important;font-size:18px}
body.pos-tap-aperto .toast{z-index:1400}
/* LA RICEVUTA DEL PAGAMENTO (Apple 5.10): il QR a tutto schermo su fondo bianco, sopra la schermata dell'esito. */
.pos-qrpieno.pos-tapric{z-index:1320}
.pos-tapric-qr{flex:1 1 auto;min-height:0;width:100%;display:flex;align-items:center;justify-content:center}
.pos-tapric-qr svg{display:block;width:min(100%,46vh);max-width:400px;height:auto}
.pos-tapric-n{flex:0 0 auto;font-size:15.5px;line-height:1.4;color:#333}
.pos-tapric-mail{display:flex;gap:8px}
.pos-tapric-mail input{flex:1 1 auto;min-width:0;min-height:52px;box-sizing:border-box;padding:0 12px;border:1px solid #999;border-radius:10px;background:#fff;color:#111;font-size:17px}
.pos-tapric-mail button{flex:0 0 auto;min-height:52px;padding:0 16px;border:1px solid #111;border-radius:10px;background:#fff;color:#111;font-size:16px;font-weight:700}
.pos-tapric-h{font-size:12.5px;color:#666;text-align:left}
/* Report della serata: la riga della commissione di Tap to Pay. */
.rep-tap{margin-top:6px}

/* ===================== WhatsApp: la casella delle conversazioni (mod_whatsapp.js) ===================== */
.wa-testa{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.wa-wrap{display:grid;grid-template-columns:340px minmax(0,1fr);grid-template-rows:minmax(0,1fr);gap:0;border:1px solid var(--line);border-radius:var(--r);background:var(--panel);height:calc(100dvh - 190px);min-height:480px;overflow:hidden}
/* 16/10/2026: senza la riga a minmax(0,1fr) e il min-height:0 la chat si allungava quanto il suo contenuto invece di scorrere:
   gli ultimi messaggi e la casella per scrivere restavano sotto, fuori vista (con le foto, sempre). */
.wa-wrap>.wa-conv,.wa-wrap>.wa-lista,.wa-msgs{min-height:0}
.wa-lista{display:flex;flex-direction:column;border-right:1px solid var(--line);min-width:0}
.wa-lista-testa{padding:10px 10px 6px;display:flex;flex-direction:column;gap:8px;border-bottom:1px solid var(--line)}
.wa-cerca{width:100%;min-height:36px;border-radius:999px;padding:6px 14px}
.wa-filtri{margin:0!important;gap:4px}
.wa-filtri .pill{padding:4px 9px;font-size:12.5px}
.wa-avviso{margin:8px 10px 0;padding:8px 10px;border-radius:10px;background:rgba(224,161,58,.14);border:1px solid rgba(224,161,58,.5);font-size:13px}
.wa-items{flex:1;overflow-y:auto;overscroll-behavior:contain}
.wa-vuoto{padding:24px 14px;text-align:center}
.wa-item{display:flex;gap:10px;align-items:center;padding:10px 12px;cursor:pointer;border-bottom:1px solid var(--line)}
.wa-item:hover{background:var(--panel2)}
.wa-item.active{background:var(--panel2);box-shadow:inset 3px 0 0 var(--accent)}
.wa-item-mid{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.wa-item-r1,.wa-item-r2{display:flex;align-items:center;gap:8px;min-width:0}
.wa-item-nome{flex:1;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wa-item.nonletti .wa-item-nome{font-weight:800}
.wa-item-ora{font-size:12px;color:var(--muted);font-family:var(--mono);flex:0 0 auto}
.wa-item.nonletti .wa-item-ora{color:var(--ok)}
.wa-item-ant{flex:1;font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wa-nonletti{flex:0 0 auto;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--ok);color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;font-family:var(--mono)}
.wa-dot{width:8px;height:8px;border-radius:50%;background:var(--warn);flex:0 0 auto}
.wa-item-r3{display:flex;align-items:center;gap:6px;min-width:0;font-size:12px;color:var(--muted)}
.wa-item-r3 .wa-fin{margin-left:auto;flex:0 0 auto;font-size:11.5px}
.wa-stato-da{color:var(--warn);font-weight:700}
.wa-item.darispondere .wa-item-nome{font-weight:800}
.wa-badge-da{background:var(--warn);color:#fff}
.wa-avatar{width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:18px;flex:0 0 auto;letter-spacing:.02em;text-shadow:0 1px 1px rgba(0,0,0,.3)}
.wa-conv{display:flex;flex-direction:column;min-width:0;background:var(--bg)}
.wa-conv-vuota{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:var(--muted);text-align:center;padding:20px}
.wa-conv-testa{display:flex;align-items:center;gap:10px;padding:8px 12px;border-bottom:1px solid var(--line);background:var(--panel);flex-wrap:wrap}
.wa-back{display:none;font-size:20px;padding:4px 10px}
.wa-conv-info{flex:1;min-width:0}
.wa-conv-nome{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wa-conv-sotto{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wa-fin.ok{color:var(--ok)}.wa-fin.warn{color:var(--warn)}.wa-fin.bad{color:var(--bad);font-weight:700}
.wa-conv-azioni{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.wa-assegna{min-height:30px;padding:3px 6px;font-size:12.5px;max-width:140px}
.wa-stop{padding:6px 12px;background:rgba(229,72,77,.12);border-bottom:1px solid rgba(229,72,77,.4);font-size:13px}
.wa-msgs{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:14px 16px;display:flex;flex-direction:column;gap:6px;background:radial-gradient(circle at 20% 10%,rgba(205,163,73,.05),transparent 40%),var(--bg)}
.wa-giorno{align-self:center;font-size:11.5px;color:var(--muted);background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:2px 10px;margin:8px 0 4px;text-transform:capitalize}
.wa-bolla{max-width:min(78%,560px);padding:8px 11px 5px;border-radius:14px;background:var(--panel2);border:1px solid var(--line);position:relative;line-height:1.4;font-size:14.5px;word-wrap:break-word}
.wa-bolla.loro{align-self:flex-start;border-bottom-left-radius:4px}
.wa-bolla.noi{align-self:flex-end;background:rgba(63,160,106,.18);border-color:rgba(63,160,106,.35);border-bottom-right-radius:4px}
.wa-bolla.fallito{border-color:var(--bad)}
/* Reazioni (5/11/2026): pillola sotto il bordo della bolla come su WhatsApp, tasto ☺ a lato che compare al passaggio */
.wa-bolla.con-reaz{margin-bottom:14px}
.wa-reaz{position:absolute;bottom:-13px;display:flex;gap:2px;padding:1px 6px;border-radius:12px;background:var(--panel);border:1px solid var(--line);box-shadow:0 1px 3px rgba(0,0,0,.25);font-size:14px;line-height:20px;z-index:1}
.wa-bolla.loro .wa-reaz{left:6px}
.wa-bolla.noi .wa-reaz{right:6px}
.wa-reaz-e.mia{cursor:pointer;border-radius:10px;padding:0 3px;background:rgba(63,160,106,.25);outline:1px solid rgba(63,160,106,.6)}
.wa-reagisci-b{position:absolute;top:50%;transform:translateY(-50%);width:28px;height:28px;border-radius:50%;border:1px solid var(--line);background:var(--panel);color:var(--muted);font-size:17px;line-height:1;padding:0;cursor:pointer;opacity:0;transition:opacity .15s}
.wa-bolla.loro .wa-reagisci-b{right:-36px}
.wa-bolla.noi .wa-reagisci-b{left:-36px}
.wa-bolla:hover .wa-reagisci-b,.wa-reagisci-b:focus-visible{opacity:1}
@media (hover:none){.wa-reagisci-b{opacity:.55}}
.wa-reaz-scelta{position:absolute;top:-44px;display:flex;gap:2px;padding:4px 6px;border-radius:24px;background:var(--panel);border:1px solid var(--line);box-shadow:0 4px 14px rgba(0,0,0,.35);z-index:3}
.wa-reaz-scelta.sotto{top:auto;bottom:-46px}
.wa-bolla.loro .wa-reaz-scelta{left:0}
.wa-bolla.noi .wa-reaz-scelta{right:0}
.wa-reaz-opz{width:36px;height:36px;border-radius:50%;border:0;background:transparent;font-size:22px;line-height:1;padding:0;cursor:pointer;transition:transform .1s}
.wa-reaz-opz:hover{transform:scale(1.25);background:var(--panel2)}
.wa-reaz-opz.attiva{background:rgba(63,160,106,.3)}
.wa-reaz-opz.piu{font-size:20px;color:var(--muted);border:1px dashed var(--line)}
.wa-reaz-input{width:64px;height:36px;border-radius:18px;text-align:center;font-size:20px;padding:0}
.wa-bolla img{max-width:100%;max-height:320px;border-radius:10px;display:block;margin:2px 0 6px;cursor:zoom-in}
.wa-bolla audio{width:260px;max-width:100%;display:block;margin:2px 0 6px}
.wa-testo{white-space:pre-wrap}
.wa-meta{font-size:11px;color:var(--muted);text-align:right;margin-top:3px;font-family:var(--mono)}
.wa-impara{margin-left:8px;padding:0 6px;min-height:0;font-size:11px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--muted);cursor:pointer;font-family:var(--ui);vertical-align:middle}
.wa-impara:hover{color:var(--txt);border-color:var(--accent)}
.wa-tick.letto{color:#53bdeb}.wa-tick.fallito,.wa-tick.saltato{color:var(--bad)}
.wa-errore{color:var(--bad);font-size:12px;font-family:var(--ui);text-align:left;margin-top:2px}
.wa-scrivi{padding:8px 12px 10px;border-top:1px solid var(--line);background:var(--panel);display:flex;flex-direction:column;gap:6px}
.wa-scrivi textarea{width:100%;resize:none;min-height:44px;max-height:160px;border-radius:14px;padding:10px 14px;font-size:15px;line-height:1.35;box-sizing:border-box;transition:box-shadow .3s}
.wa-scrivi textarea.suggerita{box-shadow:0 0 0 2px var(--accent)}
.wa-scrivi-barra{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.wa-scrivi-sx{display:flex;gap:4px;flex-wrap:wrap}
.wa-invia{border-radius:999px;padding:8px 18px;min-height:38px}
.wa-fuori{font-size:13.5px;color:var(--muted);line-height:1.45}
/* Modelli */
.wa-modelli{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}
.wa-modello{border:1px solid var(--line);border-radius:var(--r);padding:12px;background:var(--panel);display:flex;flex-direction:column;gap:6px}
.wa-modello.DELETED{opacity:.45}
.wa-modello-testa{display:flex;gap:6px;align-items:center;flex-wrap:wrap;font-size:13.5px}
.wa-modello-corpo{align-self:flex-start;max-width:100%;font-size:13.5px;white-space:pre-wrap}
.wa-var{background:rgba(205,163,73,.25);border-radius:4px;padding:0 3px;font-family:var(--mono);font-size:12px}
.wa-badge{font-size:11px;padding:2px 8px;border-radius:999px;border:1px solid var(--line);text-transform:uppercase;letter-spacing:.04em;font-weight:700}
.wa-badge.APPROVED{color:var(--ok);border-color:var(--ok)}.wa-badge.PENDING{color:var(--warn);border-color:var(--warn)}.wa-badge.REJECTED,.wa-badge.DISABLED,.wa-badge.FLAGGED{color:var(--bad);border-color:var(--bad)}
.wa-editor{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(260px,1fr);gap:16px;min-width:0}
/* La finestra dell'editor era larga 760 px con dentro un editor da 860: si scorreva di lato per arrivare a «Manda in approvazione». Ora la finestra si allarga lei. */
@media (min-width:761px){ .mdl.wide:has(.wa-editor){max-width:min(1100px,calc(100vw - 32px))} }
.wa-editor-sx{display:flex;flex-direction:column;gap:10px;min-width:0}
.wa-editor-dx{display:flex;flex-direction:column;gap:10px;min-width:0}
.wa-bott{display:flex;gap:4px;align-items:center;flex-wrap:wrap}
.wa-bott input{flex:1 1 120px;min-width:0}
.wa-telefono{background:#0b141a;border-radius:18px;padding:16px 12px;border:6px solid #1f2c34;display:flex;flex-direction:column;gap:6px;min-height:200px}
.wa-telefono .wa-bolla{align-self:flex-end;background:#005c4b;border-color:#005c4b;color:#e9edef;max-width:92%}
.wa-ant-bott{display:flex;flex-direction:column;gap:4px;align-self:flex-end;width:92%}
.wa-ant-b{background:#1f2c34;color:#53bdeb;text-align:center;border-radius:8px;padding:7px;font-size:13.5px}
.wa-controllo{font-size:13px;padding:8px 10px;border-radius:10px;border:1px solid var(--line);min-height:20px}
.wa-controllo.ok{color:var(--ok);border-color:var(--ok)}.wa-controllo.bad{color:var(--bad);border-color:var(--bad)}
/* Conoscenza e opzioni */
.wa-conoscenza{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:14px;margin:12px 0}
.wa-conoscenza textarea{width:100%;box-sizing:border-box;resize:vertical}
.wa-opzioni{display:flex;flex-direction:column;gap:8px;max-width:640px;margin:10px 0}
.wa-opzioni h3{margin:14px 0 2px;font-size:15px}
.wa-chk{display:flex;gap:8px;align-items:center;font-weight:normal}
.wa-opzioni textarea{width:100%;box-sizing:border-box}
/* Il pulsante «✦ Assistente» e' fisso in basso a destra e copriva «Invia»: la barra lascia il suo spazio a destra.
   Sul telefono la chat va a tutto schermo e il pulsante non c'e'. */
@media (min-width:761px){ .wa-scrivi-barra{padding-right:150px} }
/* Telefono: una schermata alla volta, a tutto schermo come un'app di messaggistica */
@media (max-width:760px){
  .wa-wrap{grid-template-columns:1fr;height:calc(100dvh - 150px);min-height:360px;border-radius:10px}
  .wa-conv{display:none}
  .wa-wrap.aperta .wa-lista{display:none}
  .wa-wrap.aperta .wa-conv{display:flex}
  .wa-back{display:inline-block}
  body.wa-fullscreen header,body.wa-fullscreen .tabs{display:none}
  /* I pulsanti flottanti (guida «?» e assistente «✦») coprivano «Invia»: nella chat a tutto schermo non ci sono. */
  body.wa-fullscreen .help-tab,body.wa-fullscreen .as-fab{display:none}
  body.wa-fullscreen main{padding:0;max-width:none}
  body.wa-fullscreen .wa-testa{display:none}
  body.wa-fullscreen .wa-wrap{position:fixed;inset:0;height:100dvh;border:none;border-radius:0;z-index:40}
  .wa-conv-testa{padding:8px 8px;padding-top:max(8px,env(safe-area-inset-top))}
  .wa-conv-azioni{width:100%;justify-content:flex-end}
  .wa-msgs{padding:10px 40px 10px 10px}
  .wa-bolla{max-width:86%}
  .wa-bolla.noi{margin-left:30px}
  .wa-scrivi{padding-bottom:max(10px,env(safe-area-inset-bottom))}
  .wa-editor{grid-template-columns:1fr;min-width:0}
  .wa-conoscenza{grid-template-columns:1fr}
}

/* WhatsApp: foto a schermo intero dentro l'app */
.wa-lightbox{position:fixed;inset:0;z-index:400;background:rgba(0,0,0,.94);display:flex;align-items:center;justify-content:center;padding:12px}
.wa-lightbox img{max-width:100%;max-height:100%;object-fit:contain;border-radius:6px}
.wa-lightbox-x{position:fixed;top:max(10px,env(safe-area-inset-top));right:12px;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.15);border:none;color:#fff;font-size:20px;line-height:1;display:flex;align-items:center;justify-content:center}

/* Telefono: un campo sotto i 16px fa INGRANDIRE la pagina a iPhone quando prende il fuoco (e l'intestazione
   con la chiusura esce dallo schermo). Assistente e chat WhatsApp: campi a 16px. */
@media (max-width:760px){
  .as-piede textarea,.as-panel input,.as-panel select{font-size:16px}
  .wa-scrivi textarea,.wa-cerca,.wa-assegna,.wa-editor input,.wa-editor textarea,.wa-editor select,
  .wa-conoscenza textarea,.wa-opzioni input,.wa-opzioni textarea{font-size:16px}
}

/* ---- DIVIDI ALLA ROMANA (15/10/2026): la domanda, le quote, il tastierino dei numeri ---- */
.pos-romana-scelta{display:grid;gap:10px;padding:4px 0}
.pos-romana-scelta button{min-height:72px;font-size:19px;font-weight:700;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.pos-romana-scelta button small{font-weight:400;font-size:13px;opacity:.8}
.mdl.pos-m-romana-scelta{max-width:420px}
.pos-romana{display:flex;flex-direction:column;gap:8px;min-height:0}
.pos-romana-rapidi{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.pos-romana-rapidi button{min-height:64px;font-size:24px;font-weight:700;font-family:var(--mono)}
.pos-romana-rapidi button.ghost{font-size:15px;font-family:inherit;font-weight:400}
.pos-romana-top{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:8px 10px;border-radius:10px;background:var(--panel2);font-size:15px;position:sticky;top:0;z-index:1}
.pos-romana-top .r b{font-family:var(--mono)}
.pos-romana-top .auto{margin-left:auto;font-size:13px;color:var(--muted)}
.pos-romana-top .pos-romana-ferma{min-height:40px;font-weight:700;background:var(--warn,#d68910);color:#fff;border-color:transparent}
.pos-romana-righe{display:flex;flex-direction:column}
.pos-romana-riga{display:grid;grid-template-columns:auto 1fr auto auto;gap:6px 8px;align-items:center;min-height:56px;padding:6px 8px;border-bottom:1px solid var(--line);border-left:4px solid transparent}
.pos-romana-riga .n{font-size:14px;color:var(--muted);white-space:nowrap}
.pos-romana-riga .imp{justify-self:start;min-height:44px;font-family:var(--mono);font-size:22px;font-weight:700;padding:4px 10px;display:inline-flex;align-items:center;gap:6px}
.pos-romana-riga .imp:disabled{opacity:1;background:transparent;border-color:transparent;padding-left:0}
.pos-romana-riga .imp.bloccata{border-style:dashed}
.pos-romana-riga .imp .lk{font-size:14px}
.pos-romana-riga .sb,.pos-romana-riga .scegli,.pos-romana-riga .rc{min-height:44px}
.pos-romana-riga .esito{grid-column:1 / 3;font-size:14px;color:var(--ok,#1e8449);font-weight:600}
.pos-romana-riga.pagata{background:color-mix(in srgb,var(--ok,#1e8449) 10%,transparent);border-left-color:var(--ok,#1e8449)}
.pos-romana-riga.pagata .imp{color:var(--ok,#1e8449)}
.pos-romana-riga.prossima{background:color-mix(in srgb,var(--accent,#2d7ff9) 9%,transparent);border-left-color:var(--accent,#2d7ff9)}
.pos-romana-riga .met{grid-column:1 / -1;display:grid;grid-template-columns:1fr 1fr auto;gap:6px}
.pos-romana-riga .met.uno{grid-template-columns:1fr auto}
.pos-romana-riga .met button{min-height:56px;font-size:16px}
.pos-romana-riga .met button.ghost{min-width:48px}
.pos-romana-piede{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-top:4px}
.pos-romana-piede button{min-height:44px}
.pos-romana-pad{display:flex;flex-direction:column;gap:6px}
.pos-romana-pad .pos-incassa{min-height:56px;font-size:18px;margin-top:4px}
.mdl.pos-m-romana{max-width:560px}
.mdl.pos-m-romana .mdl-body{overflow:auto}
@media (max-width:640px){
  .pos-romana-riga{grid-template-columns:auto 1fr auto}
  .pos-romana-riga .esito{grid-column:1 / -1}
}

/* Borsellino del tavolo in evidenza (16/10/2026): nell'intestazione del conto e in cima alla finestra del conto. */
.pos-cart-head .pos-bors{display:flex;flex-direction:column;align-items:flex-end;gap:0;min-height:48px;padding:4px 12px;border-radius:10px;border:1px solid color-mix(in srgb,var(--ok) 55%,transparent);background:color-mix(in srgb,var(--ok) 14%,transparent);color:var(--txt);cursor:pointer;line-height:1.1}
.pos-cart-head .pos-bors .k{font-size:11px;letter-spacing:.04em;text-transform:uppercase;opacity:.8}
.pos-cart-head .pos-bors .v{font-size:22px;font-weight:800;font-variant-numeric:tabular-nums}
.pos-cart-head .pos-bors.neg{border-color:color-mix(in srgb,var(--bad) 60%,transparent);background:color-mix(in srgb,var(--bad) 14%,transparent)}
.pos-wrap.stretto .pos-cart-head.tav .pos-bors{order:-1;flex:1;align-items:flex-start;min-height:52px;border-color:color-mix(in srgb,var(--ok) 55%,transparent)}
.pos-wrap.stretto .pos-cart-head.tav .pos-bors.neg{border-color:color-mix(in srgb,var(--bad) 60%,transparent)}
.pos-wrap.stretto .pos-cart-head.tav .pos-bors .v{font-size:26px}
.pos-conto-saldo{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:10px 14px;margin:2px 0 10px;border-radius:12px;background:color-mix(in srgb,var(--ok) 14%,transparent);border:1px solid color-mix(in srgb,var(--ok) 55%,transparent)}
.pos-conto-saldo.neg{background:color-mix(in srgb,var(--bad) 14%,transparent);border-color:color-mix(in srgb,var(--bad) 60%,transparent)}
.pos-conto-saldo .k{font-size:13px;text-transform:uppercase;letter-spacing:.05em}
.pos-conto-saldo .v{font-size:34px;font-weight:800;font-variant-numeric:tabular-nums}
.mdl.pos-m-conto .pos-movs{max-height:none;min-height:30vh}
body.pos-stretto .mdl.pos-m-conto .pos-movs{max-height:52vh}
body.pos-stretto .mdl.pos-m-conto .pos-mov{font-size:15px;padding:8px 10px;grid-template-columns:48px 1fr auto}
/* ============================================================================
   Scanner dei documenti del personale (assets/js/scanner_doc.js, 21/10/2026).
   Pannello a tutto schermo sopra le modali (300) e sotto i toast (1000); tasti in basso,
   alla portata del pollice, fuori dalla tacca e dalla barra di iOS (safe-area).
   ============================================================================ */
body.nsscan-aperto{overflow:hidden}
.nsscan{position:fixed;inset:0;z-index:900;display:flex;flex-direction:column;background:#000;color:var(--txt);
  height:100vh;height:100dvh}
.nsscan-testa{display:flex;align-items:center;gap:8px;padding:calc(8px + env(safe-area-inset-top,0px)) calc(10px + env(safe-area-inset-right,0px)) 8px calc(10px + env(safe-area-inset-left,0px));
  background:var(--panel);border-bottom:1px solid var(--line)}
.nsscan-titolo{flex:1;min-width:0;font-weight:700;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nsscan-fmt{max-width:46vw;min-height:40px;font-size:13px}
.nsscan-x{min-width:44px;min-height:44px;font-size:18px;background:transparent;border-color:transparent}
.nsscan-scena{position:relative;flex:1;min-height:0;overflow:hidden;touch-action:none;background:#000}
.nsscan-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#000}
/* cornice: fuori scurito (ombra enorme), dentro libero, angoli marcati con l'accento */
.nsscan-cornice{position:absolute;border:1px solid rgba(255,255,255,.55);border-radius:12px;box-shadow:0 0 0 200vmax rgba(0,0,0,.5);pointer-events:none}
.nsscan-cornice .ang{position:absolute;width:30px;height:30px;border:0 solid var(--accent)}
.nsscan-cornice .ang.tl{left:-3px;top:-3px;border-width:4px 0 0 4px;border-top-left-radius:12px}
.nsscan-cornice .ang.tr{right:-3px;top:-3px;border-width:4px 4px 0 0;border-top-right-radius:12px}
.nsscan-cornice .ang.br{right:-3px;bottom:-3px;border-width:0 4px 4px 0;border-bottom-right-radius:12px}
.nsscan-cornice .ang.bl{left:-3px;bottom:-3px;border-width:0 0 4px 4px;border-bottom-left-radius:12px}
.nsscan-guida{position:absolute;left:12px;right:12px;top:12px;text-align:center;font-weight:700;font-size:14px;color:#fff;text-shadow:0 1px 3px #000;pointer-events:none}
.nsscan-guida.solo{top:40%;font-weight:500;line-height:1.5;padding:0 12px}
.nsscan-stato{min-height:0;padding:0 14px;font-size:12.5px;color:var(--muted);background:var(--panel);text-align:center}
.nsscan-stato:not(:empty){padding:6px 14px}
.nsscan-barra{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;
  padding:12px calc(12px + env(safe-area-inset-right,0px)) calc(14px + env(safe-area-inset-bottom,0px)) calc(12px + env(safe-area-inset-left,0px));
  background:var(--panel);border-top:1px solid var(--line)}
.nsscan-b{min-height:48px;padding:10px 14px;font-size:14.5px;border-radius:var(--r)}
.nsscan-b.primario{background:var(--accent);border-color:var(--accent);color:var(--on-accent);font-weight:700}
.nsscan-toggle[aria-pressed="true"]{border-color:var(--accent);color:var(--accent);background:var(--accent-glow)}
/* «Scatta» tondo e grande; «Usa», «Ora il retro», «Riprova» con la stessa classe ma a pillola */
.nsscan-scatta{width:76px;height:76px;min-height:76px;border-radius:50%;padding:0;border:4px solid #fff;background:var(--accent);color:var(--on-accent);
  font-weight:800;font-size:13px;box-shadow:0 0 0 3px var(--accent-glow)}
.nsscan-scatta:hover{background:var(--accent-hover);border-color:#fff}
.nsscan-scatta:active{transform:scale(.94)}
.nsscan-scatta:disabled{opacity:.4}
.nsscan-scatta.nsscan-usa{width:auto;height:auto;min-height:52px;border-radius:999px;padding:12px 26px;font-size:15.5px;border-width:2px}
/* correzione: foto adattata, poligono, maniglie da 48 px (bersaglio da dito) */
.nsscan-area{position:absolute;inset:0}
.nsscan-foto{position:absolute;display:block}
.nsscan-svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.nsscan-svg polygon{fill:var(--accent-glow);stroke:var(--accent);stroke-width:2.5;stroke-linejoin:round}
.nsscan-man{position:absolute;width:48px;height:48px;min-height:48px;margin:-24px 0 0 -24px;padding:0;border-radius:50%;
  background:rgba(0,0,0,.25);border:3px solid var(--accent);box-shadow:0 0 0 2px rgba(0,0,0,.5);touch-action:none;cursor:grab}
.nsscan-man::after{content:"";position:absolute;left:50%;top:50%;width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:50%;background:var(--accent)}
.nsscan-man.presa{cursor:grabbing;background:transparent;transform:scale(1.15)}
.nsscan-man:focus-visible{outline:3px solid #fff;outline-offset:2px}
.nsscan-lente{position:absolute;display:none;width:120px;height:120px;border-radius:50%;border:3px solid var(--accent);box-shadow:0 6px 18px rgba(0,0,0,.6);pointer-events:none}
/* esito */
.nsscan-esito{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:16px}
.nsscan-anteprima{max-width:100%;max-height:70%;border-radius:10px;box-shadow:0 8px 30px rgba(0,0,0,.6);background:#fff}
.nsscan-msg{font-weight:700;font-size:15px;text-align:center}
@media (min-width:700px){ .nsscan-fmt{max-width:280px} }
@media (prefers-reduced-motion:reduce){ .nsscan-scatta:active,.nsscan-man.presa{transform:none} }
/* Inventario FINALE compatto anche sul telefono (23/10/2026, il titolare): solo interi, aperto, consumato e ricarico;
   niente larghezza minima, celle e didascalie piu' piccole. */
.mag-inv.mag-fin{min-width:0}
.mag-inv.mag-fin th,.mag-inv.mag-fin td{padding:3px 4px}
.mag-inv.mag-fin td .hint,.mag-inv.mag-fin .mag-interi-c .hint,.mag-inv.mag-fin td>.hint,.mag-inv.mag-fin .mag-ric-f .hint{font-size:9.5px;line-height:1.25}
.mag-inv.mag-fin .mag-inv-nome .hint{font-size:10px}
.mag-inv.mag-fin td.mag-cons{white-space:nowrap}
.mag-inv.mag-fin .mag-ric{gap:4px}
@media (min-width:700px){
  .mag-inv-box .mag-inv.mag-fin td .hint,.mag-inv-box .mag-inv.mag-fin .mag-interi-c .hint,.mag-inv-box .mag-inv.mag-fin td>.hint,.mag-inv-box .mag-inv.mag-fin .mag-ric-f .hint{font-size:10px}
}
@media (max-width:700px){
  .mag-inv.mag-fin th{font-size:9.5px;letter-spacing:0}
  .mag-inv.mag-fin th,.mag-inv.mag-fin td{padding:3px 2px;font-size:12px}
  .mag-inv.mag-fin .mag-inv-nome{max-width:84px;min-width:0}
  .mag-inv.mag-fin .mag-inv-nome b{font-size:12px}
  .mag-inv.mag-fin .mag-inv-nome .hint{display:none}
  .mag-inv.mag-fin input.mag-w-num{width:42px;min-height:32px;font-size:13px;padding:0 3px}
  .mag-inv.mag-fin input.mag-ric-in{width:38px}
  .mag-inv.mag-fin .mag-interi{gap:2px;flex-direction:column}
  .mag-inv.mag-fin td>.hint{font-size:9px}
  .mag-inv.mag-fin .mag-ric-cons{min-width:0;font-size:11px}
  .mag-inv.mag-fin .mag-ric-f{flex-direction:column;align-items:flex-end;gap:1px}
  .mag-inv.mag-fin .mag-ric-f .hint{white-space:normal;max-width:58px;text-align:right;font-size:8.5px;line-height:1.15}
  .mag-inv.mag-fin .mag-ric-td .hint{font-size:8.5px;max-width:70px;margin-left:auto}
  /* 23/10/2026: le caselle delle bottiglie con la virgola («15,9») devono leggersi; righe piu' basse, didascalie a capo. */
  .mag-inv.mag-fin input.mag-w-num{width:54px;min-height:30px;font-size:13px;padding:0 4px}
  .mag-inv.mag-fin input.mag-ric-in{width:40px}
  .mag-inv.mag-fin th,.mag-inv.mag-fin td{padding:2px 2px}

  .mag-inv.mag-fin .mag-ric-td>.hint{white-space:normal;overflow:visible}
  .mdl.wide:has(> .mdl-body > .mag-inv-box) .mdl-body>.mag-inv-box>.hint{font-size:11.5px;line-height:1.35;margin-bottom:2px}
  .mag-inv-box .mag-inv-tot{font-size:11.5px;padding:6px 4px;gap:10px}
  .mag-inv-box .mag-ric-box{padding:6px 8px}
  .mag-inv-box .mag-ric-box,.mag-inv-box .mag-ric-box .hint{font-size:11px;line-height:1.35}
  .mdl.wide:has(> .mdl-body > .mag-inv-box) .mdl-body{padding-left:8px;padding-right:8px}
  .mag-inv.mag-fin .mag-ric-td>.hint:not(.mag-ric-afine):not(.bad){display:none}
}
/* Il nome del formato sotto la casella delle bottiglie: intero, centrato, a capo se serve (23/10/2026, il titolare). */
.mag-inv.mag-fin .mag-interi-c{align-items:center}
.mag-inv.mag-fin .mag-interi-c .hint{max-width:76px;overflow:visible;text-overflow:clip;white-space:normal;text-align:center;line-height:1.15}
.mag-ric-f.mag-ric-uno .hint{font-weight:400}

/* Icone a un colore (icone.js) dentro un link senza classe: senza colore il browser le fa blu scuro, illeggibili sul
   fondo (27/10/2026: chiama/WhatsApp/email in Anagrafica). Prendono il colore del testo. */
a:not([class]):has(> .ns-ico){color:var(--txt)}

/* ---- ISCRIZIONE GUIDATA DELLO STAFF (assets/js/iscrizione.js, 29/10/2026): a tutto schermo, una cosa per volta ---- */
body.iscr-aperta{overflow:hidden}
.iscr-wrap{position:fixed;inset:0;z-index:300;overflow-y:auto;-webkit-overflow-scrolling:touch;background:var(--bg);
  padding:calc(14px + env(safe-area-inset-top,0px)) 16px calc(20px + env(safe-area-inset-bottom,0px))}
.iscr-card{max-width:440px;margin:0 auto;display:flex;flex-direction:column;gap:12px;min-height:100%}
.iscr-testa{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:12.5px;color:var(--muted)}
.iscr-locale{font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
.iscr-barra{height:6px;border-radius:3px;background:var(--line);overflow:hidden}
.iscr-barra i{display:block;height:100%;background:var(--accent);border-radius:3px;transition:width .3s}
.iscr-card h2{margin:8px 0 0;font-size:24px;line-height:1.2;text-wrap:balance}
.iscr-card p{margin:0;color:var(--muted);font-size:15px;line-height:1.45}
.iscr-tag{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);font-weight:700;margin-top:10px}
.iscr-campo{display:flex;flex-direction:column;gap:5px;min-width:0;position:relative}
.iscr-campo label{font-size:13.5px;color:var(--muted);font-weight:600}
.iscr-campo input,.iscr-campo select{width:100%;min-height:48px;font-size:16px;border-radius:12px;padding:10px 12px}
.iscr-campo input[aria-invalid]{border-color:var(--bad)}
.iscr-err,.iscr-errg{color:var(--bad);font-size:13.5px;min-height:0}
.iscr-errg:empty,.iscr-err:empty{display:none}
.iscr-ok{color:var(--ok);font-size:13.5px;font-weight:600}
.iscr-ok:empty{display:none}
.iscr-riga{display:grid;grid-template-columns:110px 1fr;gap:10px}
.iscr-occhio{position:absolute;right:6px;top:30px;min-height:40px;min-width:44px}
.iscr-check{display:flex;gap:10px;align-items:flex-start;font-size:15px;line-height:1.4;cursor:pointer}
.iscr-check input{width:24px;height:24px;flex:0 0 24px;margin-top:1px;accent-color:var(--accent)}
.iscr-gia{display:flex;align-items:center;gap:8px;padding:12px 14px;border:1px solid var(--ok);border-radius:12px;color:var(--txt);font-size:15px}
.iscr-gia span{color:var(--muted);font-size:13px;margin-left:auto}
.iscr-lista{display:flex;gap:10px;align-items:baseline;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--panel);font-size:14.5px;color:var(--muted)}
.iscr-lista b{color:var(--txt)}
.iscr-nota{font-size:13.5px!important}
.iscr-btns{display:flex;gap:10px;margin-top:auto;padding-top:14px;position:sticky;bottom:0;background:linear-gradient(transparent,var(--bg) 30%)}
.iscr-btns button{min-height:50px;font-size:16px;border-radius:12px}
.iscr-avanti{flex:1;font-weight:700}
.iscr-card>.iscr-avanti{flex:0 0 auto;min-height:50px;font-size:16px;border-radius:12px;margin-top:8px}
.iscr-card>button.ghost{min-height:44px}
.iscr-foto{display:flex;flex-direction:column;gap:10px}
.iscr-fotoriga{border:2px dashed var(--accent);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:8px}
.iscr-fotoriga.ok{border-style:solid;border-color:var(--ok)}
.iscr-fotot{font-weight:700;font-size:15px}
.iscr-fotoaz{display:flex;gap:8px;flex-wrap:wrap}
.iscr-fotoaz button{min-height:44px;flex:1 1 140px}
.iscr-aut{display:flex;flex-direction:column;gap:6px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.iscr-leggi{align-self:flex-start;min-height:40px;padding:6px 0;text-decoration:underline}
.iscr-testo{white-space:pre-wrap;font-size:14.5px;line-height:1.55;max-width:62ch}
@media (min-width:700px){ .iscr-wrap{padding-top:40px} }

/* VIP Park, righe dello staff (31/10/2026): accanto al nome le persone della prenotazione; sul telefono due righe
   fisse (nome · persone · auto max / entrate · note · ✕), le foto sotto se ci sono, il telefono del cliente nascosto
   (resta salvato, si vede da computer). */
.vp-row .vp-nome,.vp-head .vp-nome{flex:2;min-width:150px}
.vp-row .vp-pax,.vp-head .vp-pax{flex:0 0 64px;text-align:center;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.vp-row .vp-tel,.vp-head .vp-tel{flex:0 0 130px}
.vp-row .vp-max,.vp-head .vp-max{flex:0 0 84px;display:flex;align-items:center;gap:4px}
.vp-row .vp-max input{flex:1;min-width:0;width:100%}
.vp-row .vp-maxlbl{display:none;font-size:12px;color:var(--muted);white-space:nowrap}
.vp-row .vp-ent,.vp-head .vp-ent{flex:0 0 auto;min-width:160px;display:flex;align-items:center;gap:6px}
.vp-row .vp-ent button{white-space:nowrap}
.vp-row .vp-lbl{min-width:52px;text-align:center;font-weight:700;font-variant-numeric:tabular-nums}
.vp-row .vp-note,.vp-head .vp-note{flex:1;min-width:90px}
.vp-row .vp-foto,.vp-head .vp-foto{flex:0 0 auto;min-width:56px}
.vp-row .vp-del,.vp-head .vp-del{flex:0 0 auto}
@media (max-width:700px){
  .vp-head{display:none}
  .vp-row{display:grid;grid-template-columns:auto 1fr auto auto auto;grid-template-areas:"nome nome pax max max" "ent note note note del" "foto foto foto foto foto";gap:6px;align-items:center;padding:6px 0 10px;border-bottom:1px solid var(--line)}
  .vp-row .vp-tel{display:none}
  .vp-row .vp-nome{grid-area:nome;min-width:0;width:100%}
  .vp-row .vp-pax{grid-area:pax;min-width:0;font-size:16px}
  .vp-row .vp-max{grid-area:max;width:96px}
  .vp-row .vp-maxlbl{display:inline}
  .vp-row .vp-max input{padding-left:6px;padding-right:6px;text-align:center}
  .vp-row .vp-ent{grid-area:ent;min-width:0;gap:4px}
  .vp-row .vp-ent button{padding:8px 12px}
  .vp-row .vp-lbl{min-width:40px}
  .vp-row .vp-note{grid-area:note;min-width:0;width:100%}
  .vp-row .vp-foto{grid-area:foto;min-width:0;justify-self:start}
  .vp-row .vp-del{grid-area:del}
}