/* ============================================================
   GESTIONALE v3 — Design system "Clinica" (docs/02-design-system.md)
   Due temi obbligatori: [data-theme="light"] e [data-theme="dark"]
   ============================================================ */

:root{
  --primary:#2563EB; --primary-soft:#EFF4FF; --accent:#059669; --accent-soft:#ECFDF5;
  --warn:#D97706; --warn-soft:#FFFBEB; --danger:#DC2626; --danger-soft:#FEF2F2;
  --bg:#F8FAFC; --surface:#FFFFFF; --fg:#0F172A; --fg-2:#475569; --fg-3:#94A3B8;
  --border:#E2E8F0; --border-soft:#F1F5F9; --ring:#2563EB;
  --chart-grid:#EEF2F7; --chart-compare:#CBD5E1; --tooltip-bg:#0F172A; --tooltip-fg:#FFFFFF;
  --radius:16px; --shadow:0 1px 2px rgba(15,23,42,.04),0 4px 16px rgba(15,23,42,.05);
  --surface-2:#FBFCFE;
  --viola:#7C3AED; --viola-soft:#F5F3FF; --info:#0891B2; --info-soft:#ECFEFF;
  /* Scala di elevazione a 3 livelli (restyling 2026) */
  --elev-1:0 1px 2px rgba(15,23,42,.05);
  --elev-2:0 1px 3px rgba(15,23,42,.05),0 8px 24px -8px rgba(15,23,42,.10);
  --elev-3:0 2px 6px rgba(15,23,42,.06),0 16px 40px -12px rgba(37,99,235,.18);
}
[data-theme="dark"]{
  --primary:#60A5FA; --primary-soft:rgba(96,165,250,.14); --accent:#34D399; --accent-soft:rgba(52,211,153,.13);
  --warn:#FBBF24; --warn-soft:rgba(251,191,36,.13); --danger:#F87171; --danger-soft:rgba(248,113,113,.13);
  --bg:#0B1220; --surface:#151E31; --fg:#E6EDF7; --fg-2:#A8B6CC; --fg-3:#64748B;
  --border:#26314A; --border-soft:#1D2840; --ring:#60A5FA;
  --chart-grid:#1F2A42; --chart-compare:#3B4A66; --tooltip-bg:#E6EDF7; --tooltip-fg:#0B1220;
  --shadow:0 1px 2px rgba(0,0,0,.25),0 4px 16px rgba(0,0,0,.25);
  --surface-2:#182238;
  --viola:#A78BFA; --viola-soft:rgba(167,139,250,.14); --info:#22D3EE; --info-soft:rgba(34,211,238,.13);
  --elev-1:0 1px 2px rgba(0,0,0,.3);
  --elev-2:0 1px 3px rgba(0,0,0,.3),0 8px 24px -8px rgba(0,0,0,.45);
  --elev-3:0 2px 6px rgba(0,0,0,.35),0 16px 40px -12px rgba(0,0,0,.5);
}

*{margin:0;padding:0;box-sizing:border-box}
html{height:100%}
body{font-family:'Figtree',system-ui,sans-serif;background:var(--bg);color:var(--fg);
  font-size:15px;line-height:1.5;min-height:100%;transition:background .25s,color .25s}
svg{flex-shrink:0}
a{color:var(--primary)}
button{font-family:inherit;cursor:pointer}
:focus-visible{outline:3px solid var(--ring);outline-offset:2px;border-radius:6px}
.num{font-variant-numeric:tabular-nums}

/* ─── Layout shell ─── */
.layout{display:grid;grid-template-columns:248px 1fr;min-height:100vh}
.main{padding:24px 32px 40px;min-width:0}

/* ─── Sidebar ─── */
.side{background:var(--surface);border-right:1px solid var(--border);padding:20px 14px;
  display:flex;flex-direction:column;gap:4px;position:sticky;top:0;height:100vh;overflow-y:auto;
  transition:background .25s,border-color .25s}
.brand{display:flex;align-items:center;gap:10px;padding:6px 10px 20px}
.brand-mark{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,#2563EB,#3B82F6);
  display:grid;place-items:center;color:#fff;font-weight:800;font-size:15px}
.brand b{font-size:16px;font-weight:700}
.brand span{display:block;font-size:11.5px;color:var(--fg-3);font-weight:500}
.nav-label{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-3);padding:14px 10px 6px}
.nav-item{display:flex;align-items:center;gap:11px;padding:9px 10px;border-radius:9px;color:var(--fg-2);
  font-weight:500;text-decoration:none;font-size:14px;cursor:pointer;border:none;background:transparent;
  width:100%;text-align:left;transition:background .15s,color .15s}
.nav-item:hover{background:var(--bg);color:var(--fg)}
.nav-item.active{background:var(--primary-soft);color:var(--primary);font-weight:600}
.nav-item .badge{margin-left:auto;background:var(--danger);color:#fff;font-size:11px;font-weight:700;padding:1px 7px;border-radius:99px}
[data-theme="dark"] .nav-item .badge{color:#1A0505}

/* ─── Topbar ─── */
.topbar{display:flex;align-items:center;gap:14px;margin-bottom:26px;flex-wrap:wrap}
.topbar h1{font-size:22px;font-weight:700}
.topbar .sotto{color:var(--fg-2);font-size:13.5px}
.spazio{margin-left:auto}
.search{display:flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--border);
  border-radius:10px;padding:8px 14px;width:260px;color:var(--fg-3);font-size:13.5px}
.avatar{width:36px;height:36px;border-radius:99px;background:var(--primary-soft);color:var(--primary);
  display:grid;place-items:center;font-weight:700;font-size:13px;border:none}

/* ─── Selettore tema (obbligatorio su ogni schermata) ─── */
.theme-switch{display:flex;align-items:center;background:var(--surface);border:1px solid var(--border);border-radius:99px;padding:3px}
.theme-switch button{border:none;background:transparent;color:var(--fg-3);width:32px;height:28px;border-radius:99px;
  display:grid;place-items:center;transition:background .2s,color .2s}
.theme-switch button.on{background:var(--primary-soft);color:var(--primary)}

/* ─── Bottoni ─── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--primary);color:#fff;
  border:none;border-radius:10px;padding:10px 16px;font-size:14px;font-weight:600;box-shadow:var(--elev-2);transition:filter .15s,transform .15s}
[data-theme="dark"] .btn{color:#08101F}
.btn:hover{filter:brightness(1.08);transform:translateY(-1px)}
.btn:active{transform:translateY(0) scale(.98)}
.btn:disabled{opacity:.55;cursor:not-allowed}
.btn-secondario{background:var(--surface);color:var(--fg);border:1px solid var(--border);box-shadow:none}
[data-theme="dark"] .btn-secondario{color:var(--fg)}
.btn-pericolo{background:var(--danger)}

/* ─── Card ─── */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  box-shadow:var(--elev-1);padding:20px;transition:background .25s,border-color .25s}
.card.primaria{box-shadow:var(--elev-2)}
.card h2{font-size:15.5px;font-weight:700;display:flex;align-items:center;gap:8px}
.card .sub{font-size:12.5px;color:var(--fg-3);margin-bottom:14px}
.card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}

/* ─── KPI ─── */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-bottom:20px}
.kpi .k-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.kpi .k-title{font-size:12.5px;font-weight:600;color:var(--fg-2);text-transform:uppercase;letter-spacing:.04em}
.kpi .k-ico{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;transition:opacity .18s}
.kpi .k-val{font-size:28px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1.15}
.kpi .k-sub{font-size:12.5px;color:var(--fg-3);margin-top:3px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
/* KPI eroe cliccabile (dashboard restyling): si solleva e mostra la freccia */
.kpi.cliccabile{position:relative;box-shadow:var(--elev-2);cursor:pointer;overflow:hidden;
  transition:transform .18s,box-shadow .18s,border-color .18s,background .25s}
.kpi.cliccabile:hover{transform:translateY(-3px);box-shadow:var(--elev-3);border-color:var(--primary)}
.kpi .k-vai{position:absolute;top:16px;right:16px;opacity:0;transform:translateX(-4px);
  transition:opacity .18s,transform .18s;color:var(--primary)}
.kpi.cliccabile:hover .k-vai{opacity:1;transform:none}
.kpi.cliccabile:hover .k-ico{opacity:0}
.kpi .k-spark{height:34px;margin:8px -6px -6px}
.delta{display:inline-flex;align-items:center;gap:3px;font-size:12px;font-weight:700;padding:1px 8px;border-radius:99px}
.delta.su{color:var(--accent);background:var(--accent-soft)}
.delta.giu{color:var(--danger);background:var(--danger-soft)}
.su{color:var(--accent);font-weight:700}
.giu{color:var(--danger);font-weight:700}
.ico-primary{background:var(--primary-soft);color:var(--primary)}
.ico-accent{background:var(--accent-soft);color:var(--accent)}
.ico-warn{background:var(--warn-soft);color:var(--warn)}
.ico-danger{background:var(--danger-soft);color:var(--danger)}
.ico-viola{background:var(--viola-soft);color:var(--viola)}
.ico-info{background:var(--info-soft);color:var(--info)}
.ico-neutro{background:var(--border-soft);color:var(--fg-2)}

/* ─── Chip di stato ─── */
.chip{display:inline-block;font-size:11px;font-weight:700;padding:2px 8px;border-radius:99px}
.chip-primary{background:var(--primary-soft);color:var(--primary)}
.chip-accent{background:var(--accent-soft);color:var(--accent)}
.chip-warn{background:var(--warn-soft);color:var(--warn)}
.chip-danger{background:var(--danger-soft);color:var(--danger)}
.chip-neutro{background:var(--border-soft);color:var(--fg-2)}
.chip-viola{background:var(--viola-soft);color:var(--viola)}
.chip-info{background:var(--info-soft);color:var(--info)}
[data-theme="dark"] .chip-neutro{background:var(--surface-2)}

/* ─── Tabelle ─── */
.tabella-scroll{overflow-x:auto}
table{width:100%;border-collapse:collapse}
th{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--fg-3);
  text-align:left;padding:8px 10px;border-bottom:1px solid var(--border);white-space:nowrap}
td{padding:11px 10px;font-size:13.5px;border-bottom:1px solid var(--border-soft);font-variant-numeric:tabular-nums}
tr:last-child td{border-bottom:none}
.riga-click{cursor:pointer}
.riga-click:hover td{background:var(--border-soft)}

/* ─── Form ─── */
.campo{margin-bottom:16px}
.campo label{display:block;font-size:13px;font-weight:600;color:var(--fg-2);margin-bottom:6px}
.campo input,.campo select,.campo textarea{width:100%;background:var(--bg);border:1px solid var(--border);
  border-radius:10px;padding:10px 12px;font-family:inherit;font-size:14.5px;color:var(--fg);transition:border-color .15s}
.campo input:focus,.campo select:focus,.campo textarea:focus{border-color:var(--ring);outline:none}
.campo .aiuto{font-size:12px;color:var(--fg-3);margin-top:4px}
.campo .errore-campo{font-size:12.5px;color:var(--danger);margin-top:4px;font-weight:600}

/* ─── Login ─── */
.login-sfondo{min-height:100vh;display:grid;place-items:center;padding:20px;position:relative}
.login-card{width:100%;max-width:400px}
.login-brand{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:22px;text-align:center}
.login-brand .brand-mark{width:52px;height:52px;border-radius:15px;font-size:22px}
.login-brand h1{font-size:21px;font-weight:800}
.login-brand p{font-size:13px;color:var(--fg-3)}
.login-tema{position:absolute;top:18px;right:18px}
.avviso-errore{background:var(--danger-soft);color:var(--danger);border-radius:10px;padding:10px 14px;
  font-size:13.5px;font-weight:600;margin-bottom:14px}

/* ─── Pill group (selettori periodo/tab) ─── */
.pill-group{display:flex;gap:4px;background:var(--bg);padding:3px;border-radius:8px;flex-wrap:wrap}
.pill{border:none;background:transparent;font-family:inherit;font-size:12px;font-weight:600;color:var(--fg-2);padding:4px 10px;border-radius:6px;cursor:pointer}
.pill.on{background:var(--surface);color:var(--primary);box-shadow:0 1px 2px rgba(15,23,42,.08)}

/* ─── Lista attività (Da gestire) ─── */
.task{display:flex;align-items:center;gap:12px;padding:11px 4px;border-bottom:1px solid var(--border-soft);cursor:pointer}
.task:last-child{border-bottom:none}
.task:hover{background:var(--border-soft)}
.task .t-ico{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;flex-shrink:0}
.task b{font-size:13.5px;font-weight:600;display:block}
.task span{font-size:12.5px;color:var(--fg-3)}
.task .chip{margin-left:auto;flex-shrink:0}

/* ─── Modali ─── */
.velo{position:fixed;inset:0;background:rgba(8,15,30,.55);display:grid;place-items:center;z-index:500;padding:20px}
.modale{background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.3);
  width:100%;max-width:440px;max-height:90vh;overflow-y:auto;padding:22px}
.modale h3{font-size:17px;font-weight:700;margin-bottom:4px}
.modale .m-sub{font-size:13px;color:var(--fg-3);margin-bottom:16px}
.modale .m-azioni{display:flex;gap:10px;justify-content:flex-end;margin-top:18px}
.modale-larga{max-width:640px}
.scelta-blocco{display:flex;gap:10px;margin-bottom:14px}
.scelta-blocco label{flex:1;border:1.5px solid var(--border);border-radius:12px;padding:12px;cursor:pointer;font-weight:600;font-size:13.5px;text-align:center;color:var(--fg-2)}
.scelta-blocco input{display:none}
.scelta-blocco input:checked + span{color:var(--primary)}
.scelta-blocco label:has(input:checked){border-color:var(--primary);background:var(--primary-soft)}
.scelto-chip{display:inline-flex;align-items:center;gap:6px;background:var(--primary-soft);color:var(--primary);
  font-size:12.5px;font-weight:600;border-radius:99px;padding:4px 6px 4px 12px;margin:3px 4px 3px 0}
.scelto-chip button{border:none;background:transparent;color:inherit;font-weight:800;font-size:13px;line-height:1;padding:2px 6px}

/* ─── Toast ─── */
.toasts{position:fixed;bottom:20px;right:20px;display:flex;flex-direction:column;gap:8px;z-index:1000}
.toast{background:var(--tooltip-bg);color:var(--tooltip-fg);border-radius:10px;padding:11px 16px;
  font-size:13.5px;font-weight:600;box-shadow:var(--shadow);animation:toast-in .2s ease-out}
@keyframes toast-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ─── Placeholder "in costruzione" ─── */
.costruzione{display:grid;place-items:center;padding:60px 20px;text-align:center}
.costruzione .ico{width:64px;height:64px;border-radius:18px;background:var(--primary-soft);color:var(--primary);
  display:grid;place-items:center;margin:0 auto 16px}
.costruzione h2{font-size:18px;font-weight:700;margin-bottom:6px}
.costruzione p{font-size:14px;color:var(--fg-3);max-width:440px}

/* ─── Grafici SVG a tema (stessi nomi della demo Clinica) ─── */
.ch-grid{stroke:var(--chart-grid)}
.ch-axis{fill:var(--fg-3)}
.ch-line{stroke:var(--primary)}
.ch-dot{fill:var(--primary)}
.ch-dot-ring{stroke:var(--surface)}
.ch-compare{stroke:var(--chart-compare)}
.ch-tip-bg{fill:var(--tooltip-bg)}
.ch-tip-tx{fill:var(--tooltip-fg)}

/* ─── Restyling 2026: fascia azioni "Da gestire" ─── */
.fascia-azioni{margin-top:20px}
.fascia-testa{display:flex;align-items:baseline;gap:10px;margin-bottom:10px}
.fascia-testa h2{font-size:15px;font-weight:700}
.fascia-testa .conta{font-size:12.5px;font-weight:700;color:var(--danger);background:var(--danger-soft);padding:1px 9px;border-radius:99px}
.fascia-testa a{margin-left:auto;font-size:13px;font-weight:600;color:var(--primary);text-decoration:none;cursor:pointer}
/* colonne per tipo (mini kanban di sola lettura) */
.dg-colonne{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}
.dg-col{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:10px;box-shadow:var(--elev-1)}
.dg-col-testa{display:flex;align-items:center;gap:7px;padding:2px 4px 8px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.dg-col-testa i{width:8px;height:8px;border-radius:99px;display:inline-block}
.dg-col-testa .n{margin-left:auto;color:var(--fg-3);font-weight:700}
.dg-mini{background:var(--surface-2);border:1px solid var(--border-soft);border-radius:10px;padding:9px 11px;margin-bottom:7px;cursor:pointer;
  transition:transform .15s,box-shadow .15s,border-color .15s;animation:entra .4s ease-out backwards}
.dg-mini:hover{transform:translateY(-2px);box-shadow:var(--elev-2);border-color:var(--primary)}
.dg-mini:last-child{margin-bottom:0}
.dg-mini b{display:block;font-size:12.5px;line-height:1.3}
.dg-mini span{display:block;font-size:11.5px;color:var(--fg-3)}
.dg-vuota{font-size:12px;color:var(--fg-3);padding:8px 4px;text-align:center}
@keyframes entra{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ─── Restyling 2026: grafico interattivo + drill-down ─── */
.area-grafico{position:relative;height:280px}
.suggerimento-drill{font-size:11.5px;color:var(--fg-3);margin-top:8px}
.drill{overflow:hidden;max-height:0;opacity:0;transition:max-height .35s ease,opacity .3s ease,margin .3s}
.drill.aperto{max-height:300px;opacity:1;margin-top:14px}
.drill-in{background:var(--surface-2);border:1px solid var(--border-soft);border-radius:12px;padding:14px 16px}
.drill-testa{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.drill-testa b{font-size:13.5px}
.drill-testa .chiudi{margin-left:auto;border:none;background:transparent;color:var(--fg-3);padding:4px;border-radius:6px;cursor:pointer}
.drill-testa .chiudi:hover{background:var(--bg);color:var(--fg)}
.drill-riga{display:flex;align-items:center;gap:10px;padding:7px 0;border-top:1px solid var(--border-soft);font-size:13px}
.drill-riga b{font-weight:600}
.drill-riga .imp{margin-left:auto;font-weight:700}
.drill-vai{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:700;color:var(--primary);text-decoration:none;margin-top:8px;cursor:pointer}

/* ─── Restyling 2026: lista scadenze con conto alla rovescia ─── */
.scad{display:flex;gap:12px;align-items:center;padding:11px 8px;margin:0 -8px;border-radius:10px;cursor:pointer;transition:background .15s}
.scad:hover{background:var(--surface-2)}
.scad + .scad{border-top:1px solid var(--border-soft)}
.scad .giorni{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;flex-direction:column;flex-shrink:0;font-weight:800;font-size:15px;line-height:1}
.scad .giorni small{font-size:9.5px;font-weight:600;letter-spacing:.03em;margin-top:2px}
.g-rosso{background:var(--danger-soft);color:var(--danger)}
.g-ambra{background:var(--warn-soft);color:var(--warn)}
.g-blu{background:var(--primary-soft);color:var(--primary)}
.scad b{display:block;font-size:13.5px;line-height:1.3}
.scad span{display:block;font-size:12px;color:var(--fg-3)}
.scad .chip{margin-left:auto;flex-shrink:0}

/* ─── Restyling 2026: centro operativo "Da gestire" (Pianificazione) ─── */
.btn-riga{border:none;background:var(--primary-soft);color:var(--primary);font-size:12.5px;font-weight:700;padding:6px 12px;
  border-radius:8px;cursor:pointer;transition:filter .15s;white-space:nowrap}
.btn-riga:hover{filter:brightness(.94)}
[data-theme="dark"] .btn-riga:hover{filter:brightness(1.15)}
/* campanella notifiche */
.campana{position:relative}
.campana > button{width:38px;height:38px;border-radius:11px;border:1px solid var(--border);background:var(--surface);color:var(--fg-2);
  display:grid;place-items:center;cursor:pointer;transition:border-color .15s,color .15s}
.campana > button:hover{border-color:var(--primary);color:var(--primary)}
.campana .pallino{position:absolute;top:-4px;right:-4px;background:var(--danger);color:#fff;font-size:10.5px;font-weight:800;
  min-width:18px;height:18px;border-radius:99px;display:grid;place-items:center;border:2px solid var(--bg);pointer-events:none}
.campana-menu{position:absolute;right:0;top:calc(100% + 8px);width:330px;background:var(--surface);border:1px solid var(--border);
  border-radius:14px;box-shadow:var(--elev-3);z-index:600;display:none;overflow:hidden}
.campana-menu.aperto{display:block;animation:entra .15s ease-out}
.campana-testa{padding:12px 16px;border-bottom:1px solid var(--border-soft);font-size:13.5px;font-weight:700;display:flex;align-items:center;gap:8px}
.campana-testa small{margin-left:auto;color:var(--fg-3);font-weight:600}
.campana-corpo{max-height:340px;overflow-y:auto}
.campana-piede{padding:10px 16px;font-size:12px;color:var(--fg-3);background:var(--surface-2)}
/* toolbar del calendario */
.navmese{display:flex;align-items:center;gap:4px;background:var(--surface);border:1px solid var(--border);border-radius:11px;padding:3px}
.navmese button{border:none;background:transparent;color:var(--fg-2);width:30px;height:30px;border-radius:8px;display:grid;place-items:center;cursor:pointer}
.navmese button:hover{background:var(--bg);color:var(--primary)}
.navmese .oggi-btn{width:auto;padding:0 12px;font-size:12.5px;font-weight:700}
.navmese .etichetta{font-size:14px;font-weight:800;padding:0 10px;min-width:150px;text-align:center;text-transform:capitalize}
.legenda-cal{display:flex;gap:12px;font-size:12px;color:var(--fg-2);flex-wrap:wrap}
.legenda-cal span{display:inline-flex;align-items:center;gap:5px}
.legenda-cal i{width:9px;height:9px;border-radius:99px;display:inline-block}
/* layout Regia: mappa+flusso a sinistra, mini-calendario+avvisi a destra */
.centro-colonne{display:grid;grid-template-columns:1fr 330px;gap:16px;align-items:start}
@media (max-width:1200px){.centro-colonne{grid-template-columns:1fr}}
/* mappa grande del territorio */
.mappa-testa{display:flex;align-items:center;gap:10px;padding:13px 18px;flex-wrap:wrap}
.mappa-testa .titolo{font-size:15px;font-weight:700;display:flex;align-items:center;gap:8px}
.mappa-testa small{margin-left:auto;font-size:11px;color:var(--fg-3);font-weight:600;text-align:right}
#mappa-centro{height:430px;width:100%;background:var(--surface-2);z-index:0}
.mappa-filtri{display:flex;gap:6px;padding:12px 18px 13px;flex-wrap:wrap}
.mf{border:1px solid var(--border);background:var(--surface);color:var(--fg-2);font-size:12px;font-weight:700;padding:5px 12px;
  border-radius:99px;display:inline-flex;align-items:center;gap:6px;cursor:pointer;transition:all .15s}
.mf i{width:9px;height:9px;border-radius:99px;display:inline-block}
.mf.on{border-color:var(--primary);background:var(--primary-soft);color:var(--primary)}
.mf .n{opacity:.7}
/* flusso del periodo (timeline con rotaia) */
.fl-riga{display:grid;grid-template-columns:52px 22px 1fr;gap:0 10px;margin-bottom:12px}
.fl-riga:last-child{margin-bottom:0}
.fl-ora{text-align:right;font-weight:800;font-size:13px;padding-top:14px}
.fl-ora small{display:block;font-weight:600;color:var(--fg-3);font-size:10.5px}
.fl-rail{position:relative}
.fl-rail::before{content:'';position:absolute;left:50%;top:0;bottom:-12px;width:2px;background:var(--border);transform:translateX(-50%)}
.fl-riga:last-child .fl-rail::before{bottom:auto;height:100%}
.fl-rail .punto{position:absolute;left:50%;top:18px;transform:translateX(-50%);width:11px;height:11px;border-radius:99px;
  background:var(--pallino,var(--primary));border:2.5px solid var(--surface);box-shadow:0 0 0 2px var(--border)}
.fl-sep{font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--fg-3);margin:14px 0 8px}
.evento{background:var(--surface-2);border:1px solid var(--border-soft);border-radius:12px;padding:11px 14px;transition:border-color .15s,box-shadow .15s}
.evento:hover{border-color:var(--primary);box-shadow:var(--elev-1)}
.evento.lampeggia{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}
.ev-testa{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.ev-num{width:24px;height:24px;border-radius:99px;color:#fff;font-weight:800;font-size:12px;display:grid;place-items:center;border:none;flex-shrink:0;cursor:pointer}
.ev-num.senza{background:var(--fg-3);cursor:default}
.ev-testa b{font-size:13.5px}
.ev-testa .codice{font-size:11.5px;color:var(--fg-3)}
.ev-corpo{display:flex;gap:5px 18px;flex-wrap:wrap;font-size:12.5px;color:var(--fg-3);margin-top:6px}
.ev-azioni{display:flex;gap:7px;margin-top:9px;flex-wrap:wrap}
/* mini calendario */
.minical-testa{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.minical-testa b{font-size:13.5px;text-transform:capitalize}
.minical-testa button{border:none;background:transparent;color:var(--fg-3);width:26px;height:26px;border-radius:7px;display:grid;place-items:center;cursor:pointer}
.minical-testa button:hover{background:var(--bg);color:var(--primary)}
.minical{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;font-size:12px;text-align:center}
.minical .dow{font-size:10px;font-weight:800;color:var(--fg-3);text-transform:uppercase;padding:3px 0}
.minical .giorno{position:relative;border:none;background:transparent;color:var(--fg-2);font-weight:600;font-size:12px;aspect-ratio:1;
  border-radius:9px;display:grid;place-items:center;cursor:pointer;transition:background .15s}
.minical .giorno:hover{background:var(--bg)}
.minical .giorno.oggi{outline:1.5px solid var(--primary);outline-offset:-1.5px}
.minical .giorno.sel{background:var(--primary);color:#fff;font-weight:800}
[data-theme="dark"] .minical .giorno.sel{color:#08101F}
.minical .giorno .puntini{position:absolute;bottom:3px;left:50%;transform:translateX(-50%);display:flex;gap:2px}
.minical .giorno .puntini i{width:4px;height:4px;border-radius:99px;display:inline-block}
.marker-num{display:grid;place-items:center;width:26px;height:26px;border-radius:99px;color:#fff;font-weight:800;font-size:12px;
  border:2.5px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.35);font-family:'Figtree',sans-serif}
.marker-dot{width:14px;height:14px;border-radius:99px;border:2.5px solid #fff;box-shadow:0 1px 6px rgba(0,0,0,.35)}
.leaflet-popup-content-wrapper{border-radius:12px;font-family:'Figtree',system-ui,sans-serif;background:var(--surface);color:var(--fg);box-shadow:var(--elev-2)}
.leaflet-popup-tip{background:var(--surface)}
.leaflet-popup-content{margin:11px 14px;font-size:12.5px;line-height:1.45}
.leaflet-container{font-family:'Figtree',system-ui,sans-serif}
/* tema notte: zoom e attribuzione con i colori del tema (di default Leaflet li lascia bianchi) */
[data-theme="dark"] .leaflet-container .leaflet-bar{border-color:var(--border);box-shadow:var(--elev-2)}
[data-theme="dark"] .leaflet-container .leaflet-bar a{background-color:var(--surface);color:var(--fg);border-bottom-color:var(--border)}
[data-theme="dark"] .leaflet-container .leaflet-bar a:hover,[data-theme="dark"] .leaflet-container .leaflet-bar a:focus{background-color:var(--surface-2)}
[data-theme="dark"] .leaflet-container .leaflet-bar a.leaflet-disabled{background-color:var(--surface-2);color:var(--fg-3)}
[data-theme="dark"] .leaflet-container .leaflet-control-attribution{background:rgba(21,30,49,.85);color:var(--fg-3)}
[data-theme="dark"] .leaflet-container .leaflet-control-attribution a{color:var(--primary)}
/* pannello In arrivo / notifiche */
.arrivo,.notifica{display:flex;gap:10px;padding:9px 8px;cursor:pointer;align-items:flex-start;border-radius:10px;transition:background .15s}
.arrivo{margin:0 -8px}
.arrivo:hover,.notifica:hover{background:var(--surface-2)}
.arrivo + .arrivo{border-top:1px solid var(--border-soft);border-radius:0 0 10px 10px}
.notifica{padding:11px 16px;border-radius:0;border-bottom:1px solid var(--border-soft)}
.notifica:last-child{border-bottom:none}
.a-ico{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;flex-shrink:0;margin-top:1px}
.arrivo b,.notifica b{display:block;font-size:12.5px;line-height:1.35}
.arrivo span.s,.notifica span.s{display:block;font-size:11.5px;color:var(--fg-3)}
.fra{margin-left:auto;flex-shrink:0;font-size:10.5px;font-weight:800;padding:2px 8px;border-radius:99px;white-space:nowrap}

/* ════════════════════════════════════════════════════════════
   Restyling 2026: vista NOLEGGI — elenco «Radar» + scheda «Fascicolo»
   (demo approvata: v3/demo/noleggi-radar-fascicolo.html, a tutto schermo)
   ════════════════════════════════════════════════════════════ */
/* ─── Strisce di messa a fuoco ─── */
.strisce{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.striscia{flex:1;min-width:170px;background:var(--surface);border:1px solid var(--border);border-radius:13px;
  padding:12px 15px;cursor:pointer;position:relative;overflow:hidden;box-shadow:var(--elev-1);text-align:left;
  transition:transform .16s,box-shadow .16s,border-color .16s}
.striscia::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--tono,var(--primary))}
.striscia:hover{transform:translateY(-2px);box-shadow:var(--elev-2);border-color:var(--tono)}
.striscia.on{border-color:var(--tono);box-shadow:var(--elev-2)}
.striscia .et{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--fg-3)}
.striscia .vl{font-size:25px;font-weight:800;letter-spacing:-.02em;line-height:1.25;color:var(--tono);font-variant-numeric:tabular-nums}
.striscia .nt{font-size:11.5px;color:var(--fg-3)}

/* ─── Barra vista (ricerca + pill + azioni) ─── */
.barra-vista{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:16px}
.ricerca{display:flex;align-items:center;gap:9px;background:var(--surface);border:1px solid var(--border);border-radius:11px;
  padding:9px 14px;flex:1;min-width:230px;max-width:520px;color:var(--fg-3);transition:border-color .15s,box-shadow .15s}
.ricerca:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}
.ricerca input{border:none;background:transparent;font-family:inherit;font-size:14px;color:var(--fg);width:100%;outline:none}
.ricerca input::placeholder{color:var(--fg-3)}
.btn-piccolo{padding:6px 12px;font-size:12.5px;border-radius:9px}
.btn-icona{width:32px;height:32px;border-radius:9px;border:1px solid var(--border);background:var(--surface);color:var(--fg-2);
  display:grid;place-items:center;cursor:pointer;text-decoration:none;transition:border-color .15s,color .15s,background .15s}
.btn-icona:hover{border-color:var(--primary);color:var(--primary);background:var(--primary-soft)}

/* ─── Corsie per stato ─── */
.corsia{margin-bottom:14px;animation:entra .3s ease-out backwards}
.corsia-testa{display:flex;align-items:center;gap:10px;padding:9px 4px;cursor:pointer;user-select:none;
  border:none;background:transparent;width:100%;text-align:left;color:inherit;font-family:inherit}
.corsia-testa i{width:10px;height:10px;border-radius:99px;display:inline-block;background:var(--tono);flex-shrink:0}
.corsia-testa b{font-size:14.5px;font-weight:800;letter-spacing:-.01em}
.corsia-testa .n{font-size:12px;font-weight:800;color:var(--fg-3);background:var(--surface-2);border:1px solid var(--border-soft);
  border-radius:99px;padding:1px 9px}
.corsia-testa .sold{margin-left:auto;font-size:12.5px;color:var(--fg-3);font-weight:600}
.corsia-testa .frec{transition:transform .2s;color:var(--fg-3);display:flex}
.corsia.chiusa .frec{transform:rotate(-90deg)}
.corsia.chiusa .corsia-corpo{display:none}
.corsia-corpo{border:1px solid var(--border);border-radius:14px;overflow:hidden;background:var(--surface);box-shadow:var(--elev-1)}

/* ─── Riga noleggio ─── */
.rg{display:grid;grid-template-columns:26px 46px 1.5fr 1.3fr 150px 128px minmax(310px,1fr);gap:14px;align-items:center;
  padding:11px 18px;border-bottom:1px solid var(--border-soft);cursor:pointer;transition:background .13s}
.rg:last-child{border-bottom:none}
.rg:hover{background:var(--surface-2)}
.rg.scelta{background:var(--primary-soft)}
/* casella di selezione (come la v2: seleziona e poi agisci dalla barra in basso) */
.rg .sel{width:18px;height:18px;border-radius:6px;border:1.5px solid var(--border);background:var(--surface);
  display:grid;place-items:center;color:transparent;cursor:pointer;transition:background .15s,border-color .15s,color .15s;padding:0}
.rg:hover .sel{border-color:var(--primary)}
.rg .sel.on{background:var(--primary);border-color:var(--primary);color:#fff}
[data-theme="dark"] .rg .sel.on{color:#08101F}
/* coda della riga: l'economia arriva al bordo e scorre a sinistra per far posto ai pulsanti */
.rg .coda{position:relative;display:flex;align-items:center;justify-content:flex-end;min-width:0;overflow:hidden}
.rg .sold{text-align:right;min-width:150px;transition:transform .2s ease}
.rg:hover .sold,.rg.scelta .sold,.rg:focus-within .sold{transform:translateX(-152px)}
.rg .az{position:absolute;right:0;display:flex;gap:5px;opacity:0;transform:translateX(10px);
  transition:opacity .18s,transform .18s;pointer-events:none}
.rg:hover .az,.rg.scelta .az,.rg:focus-within .az{opacity:1;transform:none;pointer-events:auto}
.semaforo{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;flex-direction:column;
  font-weight:800;font-size:14px;line-height:1;font-variant-numeric:tabular-nums}
.semaforo small{font-size:9px;font-weight:700;letter-spacing:.04em;opacity:.9}
.s-rosso{background:var(--danger-soft);color:var(--danger)}
.s-ambra{background:var(--warn-soft);color:var(--warn)}
.s-verde{background:var(--accent-soft);color:var(--accent)}
.s-blu{background:var(--primary-soft);color:var(--primary)}
.s-grigio{background:var(--border-soft);color:var(--fg-3)}
[data-theme="dark"] .s-grigio{background:var(--surface-2)}
.rg .chi b{font-size:14px;font-weight:700;display:block;line-height:1.3}
.rg .chi span{font-size:11.5px;color:var(--fg-3)}
.rg .cosa{font-size:12.5px;color:var(--fg-2);min-width:0}
.rg .cosa .l1{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rg .cosa small{display:block;color:var(--fg-3);font-size:11.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rg .zona{font-size:12.5px;color:var(--fg-2);min-width:0}
.rg .zona b{display:block;font-weight:700;color:var(--fg);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rg .zona small{color:var(--fg-3);font-size:11.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}
.rg .qd{font-size:12.5px;color:var(--fg-2);white-space:nowrap}
.rg .qd b{display:block;font-weight:700;color:var(--fg);font-size:13px}
.rg .sold{text-align:right}
.rg .sold b{font-size:14px;font-weight:800;display:block;line-height:1.2;font-variant-numeric:tabular-nums}
.rg .sold .barra{margin-top:5px;width:100%}
@media (max-width:1400px){.rg{grid-template-columns:26px 46px 1.5fr 1.2fr 128px minmax(300px,1fr)}.rg .zona{display:none}}
@media (max-width:1100px){.rg{grid-template-columns:26px 46px 1.4fr 120px minmax(290px,1fr)}.rg .cosa{display:none}}
@media (max-width:820px){
  .rg{grid-template-columns:26px 46px 1fr auto}
  .rg .qd{display:none}.rg .sold{min-width:0}
  .rg:hover .sold,.rg.scelta .sold,.rg:focus-within .sold{transform:none}
  .rg .az{position:static;opacity:1;transform:none;pointer-events:auto}
}

/* piede del blocco: quanti se ne vedono, «mostra altri» */
.piede-blocco{display:flex;align-items:center;gap:10px;padding:10px 18px;border-top:1px solid var(--border-soft);
  background:var(--surface-2);font-size:12.5px;color:var(--fg-3);flex-wrap:wrap}
.piede-blocco b{color:var(--fg)}

/* barra delle azioni sulla selezione (bulkbar della v2) */
.selbar{position:fixed;left:50%;bottom:22px;transform:translateX(-50%) translateY(160%);z-index:400;
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--border);
  border-radius:14px;box-shadow:var(--elev-3);padding:10px 14px;transition:transform .25s ease;max-width:calc(100vw - 24px)}
.selbar.su{transform:translateX(-50%) translateY(0)}
.selbar .conta{font-size:13px;font-weight:800;margin-right:4px}
.selbar .btn{padding:8px 13px;font-size:13px}
.selbar .btn:disabled{opacity:.45;cursor:not-allowed;transform:none;filter:none}

/* ─── modale «Modifica noleggio» a schede (demo approvata: demo/modifica-a.html) ─── */
.modale-mod{background:var(--surface);border:1px solid var(--border);border-radius:18px;box-shadow:0 24px 70px rgba(0,0,0,.35);
  width:100%;max-width:880px;max-height:92vh;display:flex;flex-direction:column;overflow:hidden;animation:entra .18s ease-out}
.mm-testa{padding:18px 22px 0;flex-shrink:0}
.mm-testa .riga1{display:flex;align-items:flex-start;gap:14px}
.mm-testa h3{font-size:19px;font-weight:800;letter-spacing:-.01em}
.mm-testa .sotto{font-size:13px;color:var(--fg-3);margin-top:2px}
.mm-chiudi{border:none;background:transparent;color:var(--fg-3);width:34px;height:34px;border-radius:10px;
  display:grid;place-items:center;cursor:pointer}
.mm-chiudi:hover{background:var(--bg);color:var(--fg)}
.mm-tabs{display:flex;gap:2px;border-bottom:1px solid var(--border);margin-top:16px;overflow-x:auto}
.mm-tab{border:none;background:transparent;font-family:inherit;font-size:13.5px;font-weight:700;color:var(--fg-3);
  padding:11px 16px;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap;
  display:flex;align-items:center;gap:8px;cursor:pointer}
.mm-tab:hover{color:var(--fg)}
.mm-tab.on{color:var(--primary);border-bottom-color:var(--primary)}
.mm-tab .pallino{width:7px;height:7px;border-radius:99px;background:var(--warn);display:none}
.mm-tab.toccata .pallino{display:block}
.mm-tab .conta-tab{font-size:11px;font-weight:800;background:var(--border-soft);color:var(--fg-2);border-radius:99px;padding:1px 7px}
.mm-tab.on .conta-tab{background:var(--primary-soft);color:var(--primary)}
[data-theme="dark"] .mm-tab .conta-tab{background:var(--surface-2)}
.mm-corpo{padding:18px 22px;overflow-y:auto;flex:1}
.mm-piede{display:flex;align-items:center;gap:10px;padding:14px 22px;border-top:1px solid var(--border);
  background:var(--surface-2);flex-shrink:0;flex-wrap:wrap}
.mm-piede .stato{font-size:12.5px;color:var(--fg-3)}

/* righe modificabili: dispositivi, addebiti, pagamenti */
.riga-editabile{display:grid;grid-template-columns:1fr 150px 150px 34px;gap:10px;align-items:center;padding:8px 0;
  border-bottom:1px solid var(--border-soft)}
.riga-editabile.quattro{grid-template-columns:150px 1fr 130px 76px}
.riga-editabile.testa{border-bottom:1px solid var(--border);padding-bottom:6px;font-size:11px;font-weight:800;
  text-transform:uppercase;letter-spacing:.05em;color:var(--fg-3)}
.riga-editabile b{font-size:13.5px;font-weight:700;display:block}
.riga-editabile input,.riga-editabile select{background:var(--bg);border:1px solid var(--border);border-radius:9px;
  padding:7px 10px;font-family:inherit;font-size:13px;color:var(--fg);width:100%}
.riga-editabile input:focus,.riga-editabile select:focus{border-color:var(--ring);box-shadow:0 0 0 3px var(--primary-soft);outline:none}
.riga-editabile .num{text-align:right;font-variant-numeric:tabular-nums}
/* i bottoni tondi non si schiacciano mai: nella colonna dei comandi ce ne stanno due da 32px e
   basta, e un terzo li riduceva tutti a 22px lasciando storte le righe accanto. Chi non ci sta
   va dentro la cella del campo, come la graffetta dei pagamenti e la ↺ delle proroghe. */
.riga-editabile .btn-icona{flex:none}
.riga-editabile .cella-comando{display:flex;align-items:center;gap:6px;min-width:0}
.riga-editabile .cella-comando input{flex:1;min-width:0}
.btn-icona.pericolo:hover{border-color:var(--danger);color:var(--danger);background:var(--danger-soft)}
.aggiungi-riga{display:grid;grid-template-columns:1fr 150px auto;gap:10px;align-items:center;padding:12px 0 4px}
.aggiungi-riga.quattro{grid-template-columns:150px 1fr 130px auto}
.aggiungi-riga select,.aggiungi-riga input{background:var(--bg);border:1px dashed var(--border);border-radius:9px;
  padding:7px 10px;font-family:inherit;font-size:13px;color:var(--fg);width:100%}
.vuoto-riga{font-size:13px;color:var(--fg-3);padding:12px 0;text-align:center}
.totali-conto{display:flex;gap:22px;justify-content:flex-end;padding:14px 0 2px;margin-top:10px;border-top:2px solid var(--border);flex-wrap:wrap}
.totali-conto div{text-align:right}
.totali-conto span{display:block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--fg-3)}
.totali-conto b{font-size:17px;font-weight:800;font-variant-numeric:tabular-nums}
@media (max-width:640px){
  .riga-editabile,.riga-editabile.quattro,.aggiungi-riga,.aggiungi-riga.quattro{grid-template-columns:1fr;gap:6px}
  .riga-editabile.testa{display:none}
}

/* scelta privato/azienda, consensi e blocchi indirizzo */
.scelta-riga{display:flex;gap:10px}
.scelta-blocchetto{flex:1;border:1.5px solid var(--border);border-radius:11px;padding:9px;text-align:center;cursor:pointer;
  font-size:13.5px;font-weight:700;color:var(--fg-2);transition:border-color .15s,background .15s,color .15s}
.scelta-blocchetto input{display:none}
.scelta-blocchetto.on{border-color:var(--primary);background:var(--primary-soft);color:var(--primary)}
.consensi{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:4px 16px}
.ind-blocco{border:1px solid var(--border);border-radius:13px;padding:14px 16px;margin-bottom:14px;background:var(--surface-2)}
.ind-testa{display:flex;align-items:center;gap:9px;margin-bottom:12px;flex-wrap:wrap}
.ind-testa b{font-size:14px;font-weight:700}
.ind-nota{font-size:11.5px;color:var(--fg-3);display:flex;align-items:flex-start;gap:6px;margin-top:2px}
.ind-nota svg{flex-shrink:0;margin-top:1px}

.modale-modifica{max-width:760px}
.griglia-campi{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
@media (max-width:700px){.griglia-campi{grid-template-columns:1fr}}
.griglia-campi .largo{grid-column:1/-1}
.sez-form{font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--fg-3);
  grid-column:1/-1;margin:6px 0 10px;padding-top:12px;border-top:1px solid var(--border-soft)}
.sez-form.prima{border-top:none;padding-top:0}
.interruttore{display:flex;align-items:center;gap:10px;font-size:13.5px;font-weight:600;color:var(--fg-2);cursor:pointer;padding:6px 0}
.interruttore input{appearance:none;width:38px;height:22px;border-radius:99px;background:var(--border);position:relative;
  transition:background .18s;cursor:pointer;flex-shrink:0}
.interruttore input::after{content:'';position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:99px;
  background:#fff;transition:transform .18s;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.interruttore input:checked{background:var(--primary)}
.interruttore input:checked::after{transform:translateX(16px)}
.riepilogo-mod{background:var(--surface-2);border:1px solid var(--border-soft);border-radius:11px;padding:11px 14px;
  font-size:12.5px;color:var(--fg-2);margin-bottom:16px;display:flex;gap:14px;flex-wrap:wrap}
.riepilogo-mod b{color:var(--fg)}

/* barra pagato/dovuto (riga e scheda) */
.barra{height:6px;border-radius:99px;background:var(--border-soft);overflow:hidden}
[data-theme="dark"] .barra{background:var(--surface-2)}
.barra i{display:block;height:100%;border-radius:99px;background:var(--accent);transition:width .5s ease}
.barra.parziale i{background:var(--warn)}
.barra.zero i{background:var(--danger)}

/* ─── Scadenzario per finestra temporale ─── */
.sett{margin-bottom:16px;animation:entra .3s ease-out backwards}
.sett-testa{display:flex;align-items:baseline;gap:10px;margin-bottom:8px;padding:0 4px;flex-wrap:wrap}
.sett-testa b{font-size:14.5px;font-weight:800}
.sett-testa span{font-size:12.5px;color:var(--fg-3)}
.sett-testa .tot{margin-left:auto;font-size:12.5px;font-weight:700;color:var(--fg-2)}

/* ─── Scheda «Fascicolo»: copertina ─── */
.copertina{background:var(--surface);border:1px solid var(--border);border-top:4px solid var(--stato,var(--primary));
  border-radius:16px;box-shadow:var(--elev-2);padding:20px 24px;margin-bottom:16px}
.cop-riga{display:flex;align-items:flex-start;gap:16px;flex-wrap:wrap}
.cop-riga .iniz{width:54px;height:54px;border-radius:16px;font-size:19px}
.iniz{display:grid;place-items:center;font-weight:800;font-size:13px;flex-shrink:0;border-radius:11px}
.copertina h1{font-size:25px;font-weight:800;letter-spacing:-.02em;line-height:1.2}
.cop-meta{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:6px;font-size:13px;color:var(--fg-3)}
.cop-numeri{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px;margin-top:18px;padding-top:16px;
  border-top:1px solid var(--border-soft)}
.numero .et{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--fg-3);margin-bottom:3px}
.numero .vl{font-size:21px;font-weight:800;letter-spacing:-.02em;line-height:1.15;font-variant-numeric:tabular-nums}
.numero .nt{font-size:12px;color:var(--fg-3);margin-top:2px}

/* ─── Scheda: tre colonne a tutto schermo ─── */
.sezioni{display:grid;grid-template-columns:1.1fr 1fr 330px;gap:16px;align-items:start}
@media (max-width:1500px){.sezioni{grid-template-columns:1fr 330px}}
@media (max-width:1050px){.sezioni{grid-template-columns:1fr}}
.sez{margin-bottom:16px}
.sez:last-child{margin-bottom:0}
.sez h2{font-size:15px;font-weight:800;display:flex;align-items:center;gap:8px;margin-bottom:3px}
.sez .sub{font-size:12.5px;color:var(--fg-3);margin-bottom:12px}
.dati{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}
.dato{background:var(--surface-2);border:1px solid var(--border-soft);border-radius:11px;padding:11px 13px}
.dato .et{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--fg-3);margin-bottom:3px;
  display:flex;align-items:center;gap:6px}
.dato .vl{font-size:14px;font-weight:700;line-height:1.35}
.dato .vl small{display:block;font-weight:500;font-size:12.5px;color:var(--fg-2)}
.nota-noleggio{background:var(--warn-soft);border-radius:11px;padding:12px 14px;font-size:13px;line-height:1.45;
  display:flex;gap:10px;align-items:flex-start;margin-top:12px;color:var(--fg)}
.nota-noleggio b{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--warn);margin-bottom:2px}
.nota-noleggio > svg{color:var(--warn)}
.riga-disp{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--border-soft)}
.riga-disp:last-child{border-bottom:none}
.riga-disp .ic{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;flex-shrink:0}
.riga-disp b{font-size:13.5px;display:block}
.riga-disp span{font-size:12px;color:var(--fg-3)}
.voce{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--border-soft);font-size:13.5px}
.voce:last-child{border-bottom:none}
.voce .txt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.voce .imp{margin-left:auto;font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums}
.et-sez{font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--fg-3);margin-bottom:4px}
.totale{display:flex;justify-content:space-between;padding:12px 0 0;margin-top:6px;border-top:2px solid var(--border);
  font-weight:800;font-size:15px;font-variant-numeric:tabular-nums}
.timeline{position:relative;padding-left:20px}
.timeline::before{content:'';position:absolute;left:4px;top:8px;bottom:8px;width:2px;background:var(--border)}
.tl{position:relative;padding:9px 0}
.tl::before{content:'';position:absolute;left:-20px;top:14px;width:10px;height:10px;border-radius:99px;background:var(--primary);
  border:2px solid var(--surface);box-shadow:0 0 0 2px var(--border)}
.tl b{display:block;font-size:13px;font-weight:600;line-height:1.35}
.tl span{font-size:11.5px;color:var(--fg-3)}
.azioni-sticky{position:sticky;top:18px;display:flex;flex-direction:column;gap:8px;margin-bottom:16px}
.azioni-sticky .btn{width:100%}

/* ════════════════════════════════════════════════════════════
   Restyling 2026: NUOVO NOLEGGIO — modale a passi guidati
   (demo approvata: v3/demo/nuovo-a-modale.html)
   ════════════════════════════════════════════════════════════ */
.modale-nuovo{background:var(--surface);border:1px solid var(--border);border-radius:18px;box-shadow:0 24px 70px rgba(0,0,0,.35);
  width:100%;max-width:880px;max-height:92vh;display:flex;flex-direction:column;overflow:hidden;animation:entra .18s ease-out}
.mn-testa{padding:18px 22px 14px;flex-shrink:0;border-bottom:1px solid var(--border-soft)}
.mn-testa .riga1{display:flex;align-items:flex-start;gap:14px;margin-bottom:16px}
.mn-testa h3{font-size:19px;font-weight:800;letter-spacing:-.01em}
.mn-testa .sotto{font-size:13px;color:var(--fg-3);margin-top:2px}
.mn-chiudi{border:none;background:transparent;color:var(--fg-3);width:34px;height:34px;border-radius:10px;
  display:grid;place-items:center;cursor:pointer}
.mn-chiudi:hover{background:var(--bg);color:var(--fg)}
.mn-corpo{padding:18px 22px;overflow-y:auto;flex:1}
.mn-piede{display:flex;align-items:center;gap:10px;padding:14px 22px;border-top:1px solid var(--border);
  background:var(--surface-2);flex-shrink:0;flex-wrap:wrap}
.mn-piede .riassunto{font-size:12.5px;color:var(--fg-3)}

/* barra dei passi */
.passi{display:flex;align-items:flex-start;gap:0}
.passo{flex:1;text-align:center;position:relative;padding:30px 4px 0;cursor:pointer;border:none;background:transparent;font-family:inherit}
.passo::before{content:'';position:absolute;top:13px;left:0;right:0;height:3px;background:var(--border)}
.passo:first-child::before{left:50%}
.passo:last-child::before{right:50%}
.passo.fatto::before{background:var(--accent)}
.passo .cerchio{position:absolute;top:0;left:50%;transform:translateX(-50%);width:30px;height:30px;border-radius:99px;
  background:var(--surface);border:2.5px solid var(--border);display:grid;place-items:center;font-weight:800;font-size:13px;
  color:var(--fg-3);z-index:1;transition:background .2s,border-color .2s,color .2s,box-shadow .2s}
.passo.fatto .cerchio{border-color:var(--accent);background:var(--accent);color:#fff}
.passo.ora .cerchio{border-color:var(--primary);background:var(--primary);color:#fff;box-shadow:0 0 0 5px var(--primary-soft)}
[data-theme="dark"] .passo.fatto .cerchio,[data-theme="dark"] .passo.ora .cerchio{color:#08101F}
.passo b{display:block;font-size:13.5px;font-weight:700;color:var(--fg-3)}
.passo.ora b{color:var(--primary)}
.passo.fatto b{color:var(--fg-2)}
.passo span:not(.cerchio){display:block;font-size:11.5px;color:var(--fg-3);margin-top:1px}
@media (max-width:640px){.passo span:not(.cerchio){display:none}.passo b{font-size:12px}}

.pannello-passo{animation:entra .22s ease-out}
.pannello-passo h2{font-size:18px;font-weight:800;letter-spacing:-.01em;margin-bottom:3px}
.pannello-passo .sub{font-size:13px;color:var(--fg-3);margin-bottom:18px}
.et-cat{font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--fg-3);margin:16px 0 8px}

/* ricerca e scelta del cliente */
.ris-cliente{border:1px solid var(--border);border-radius:12px;overflow:hidden;margin-top:10px}
.voce-cli{display:flex;align-items:center;gap:12px;padding:11px 14px;cursor:pointer;border-bottom:1px solid var(--border-soft)}
.voce-cli:last-child{border-bottom:none}
.voce-cli:hover{background:var(--surface-2)}
.voce-cli b{font-size:13.5px;display:block}
.voce-cli span{font-size:12px;color:var(--fg-3)}
.cli-scelto{display:flex;align-items:center;gap:12px;background:var(--primary-soft);border:1px solid var(--primary);
  border-radius:12px;padding:12px 14px;margin-top:12px}
.cli-scelto b{font-size:14.5px;display:block;color:var(--fg)}
.cli-scelto span{font-size:12.5px;color:var(--fg-2)}

/* dove si consegna (passo 1) */
.blocco-consegna{background:var(--surface-2);border:1px solid var(--border-soft);border-radius:13px;padding:14px 16px;margin-top:14px}
.bc-testa{display:flex;align-items:center;gap:8px;margin-bottom:12px;flex-wrap:wrap}
.bc-testa b{font-size:14px;font-weight:700}
.bc-testa svg{color:var(--fg-3)}
.bc-nota{font-size:11.5px;color:var(--fg-3)}
.blocco-consegna .campo{margin-bottom:0}

/* catalogo dei modelli */
.catalogo{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:10px}
.mod{border:1px solid var(--border);border-radius:12px;padding:12px 14px;cursor:pointer;background:var(--surface);
  transition:transform .15s,box-shadow .15s,border-color .15s;text-align:left;position:relative;font-family:inherit}
.mod:hover{transform:translateY(-2px);box-shadow:var(--elev-2);border-color:var(--primary)}
.mod:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}
.mod .cat{font-size:10.5px;color:var(--fg-3);text-transform:uppercase;letter-spacing:.05em;font-weight:800}
.mod b{font-size:13.5px;font-weight:700;display:block;line-height:1.3;margin-top:2px}
.mod .riga{display:flex;align-items:center;gap:8px;margin-top:8px;font-size:12.5px;color:var(--fg-2)}
.mod .riga .prezzo{margin-left:auto;font-weight:800;color:var(--fg)}
.mod .conta{position:absolute;top:10px;right:10px;background:var(--primary);color:#fff;border-radius:99px;min-width:22px;
  height:22px;display:grid;place-items:center;font-size:12px;font-weight:800}
[data-theme="dark"] .mod .conta{color:#08101F}
.kit-rapido{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.kit-btn{border:1.5px dashed var(--primary);background:var(--primary-soft);color:var(--primary);border-radius:12px;
  padding:11px 16px;font-family:inherit;font-size:13.5px;font-weight:700;cursor:pointer;text-align:left;
  display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
.kit-btn small{display:block;width:100%;font-weight:600;opacity:.85;font-size:11.5px}
.scelto{display:flex;align-items:center;gap:12px;padding:10px 12px;background:var(--surface-2);border:1px solid var(--border-soft);
  border-radius:11px;margin-bottom:8px}
.scelto b{font-size:13.5px;display:block}
.scelto span{font-size:11.5px;color:var(--fg-3)}
.scelto .prezzo{margin-left:auto;font-weight:700;font-size:13.5px;white-space:nowrap}
.aiuto-listino{font-size:12px;color:var(--fg-3);margin-top:4px}

/* riepilogo finale */
.riep{background:var(--surface-2);border:1px solid var(--border-soft);border-radius:14px;padding:18px 20px}
.riep-riga{display:flex;gap:12px;padding:9px 0;border-bottom:1px solid var(--border-soft);font-size:13.5px}
.riep-riga:last-of-type{border-bottom:none}
.riep-riga .et{width:130px;color:var(--fg-3);font-weight:600;flex-shrink:0}
.riep-riga .vl{font-weight:600}
.riep-tot{display:flex;justify-content:space-between;align-items:baseline;margin-top:14px;padding-top:14px;border-top:2px solid var(--border)}
.riep-tot span{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--fg-3)}
.riep-tot b{font-size:26px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums}

/* ════════════════════════════════════════════════════════════
   Restyling 2026: vista CLIENTI — elenco «Rubrica» + «Fascicolo cliente»
   (demo approvata: v3/demo/clienti-rubrica.html)
   Riusa strisce, corsie, copertina, sezioni e timeline della vista Noleggi.
   ════════════════════════════════════════════════════════════ */
/* ─── Riga cliente (grid diversa da .rg dei noleggi) ─── */
.rgc{display:grid;grid-template-columns:44px 1.6fr 1.25fr 1fr 152px minmax(148px,auto);gap:14px;align-items:center;
  padding:11px 18px;border-bottom:1px solid var(--border-soft);cursor:pointer;transition:background .13s}
.rgc:last-child{border-bottom:none}
.rgc:hover{background:var(--surface-2)}
.rgc .iniz{width:44px;height:44px;border-radius:13px;font-size:14px}
.rgc .chi b{font-size:14px;font-weight:700;display:block;line-height:1.3}
/* «> span»: il colore vale solo sulla riga di sottotitolo, non sui chip che contiene */
.rgc .chi > span{font-size:11.5px;color:var(--fg-3);display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:2px}
.rgc .cont{font-size:12.5px;color:var(--fg-2);min-width:0}
.rgc .cont b{display:block;font-weight:700;color:var(--fg);font-size:13px;font-variant-numeric:tabular-nums}
.rgc .cont small{display:block;color:var(--fg-3);font-size:11.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rgc .stor{font-size:12.5px;color:var(--fg-2);min-width:0}
.rgc .stor b{display:block;font-weight:700;color:var(--fg);font-size:13px}
.rgc .stor small{color:var(--fg-3);font-size:11.5px}
.rgc .sold{text-align:right}
.rgc .sold b{font-size:14px;font-weight:800;display:block;line-height:1.2;font-variant-numeric:tabular-nums}
.rgc .sold .barra{margin-top:5px;width:100%}
.rgc .sold small{display:block;font-size:11px;color:var(--fg-3);margin-top:3px}
.rgc .az{display:flex;gap:5px;justify-content:flex-end;opacity:0;transition:opacity .16s}
.rgc:hover .az,.rgc:focus-within .az{opacity:1}
@media (max-width:1400px){.rgc{grid-template-columns:44px 1.6fr 1.25fr 152px minmax(148px,auto)}.rgc .stor{display:none}}
@media (max-width:1100px){.rgc{grid-template-columns:44px 1.4fr 152px minmax(148px,auto)}.rgc .cont{display:none}}
@media (max-width:820px){.rgc{grid-template-columns:44px 1fr auto}.rgc .sold{display:none}.rgc .az{opacity:1}}

/* ─── Fascicolo cliente: consensi, dati mancanti, indirizzi, card noleggio ─── */
.cons-chip{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:700;border-radius:8px;
  padding:4px 10px;margin:0 6px 6px 0}
.cons-chip.si{background:var(--accent-soft);color:var(--accent)}
.cons-chip.no{background:var(--border-soft);color:var(--fg-2)}
[data-theme="dark"] .cons-chip.no{background:var(--surface-2)}
.manca{background:var(--danger-soft);border-radius:11px;padding:12px 14px;font-size:13px;line-height:1.45;color:var(--fg);
  display:flex;gap:10px;align-items:flex-start;margin-top:12px}
.manca b{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--danger);margin-bottom:2px}
.manca > svg{color:var(--danger)}
.ind-scheda{background:var(--surface-2);border:1px solid var(--border-soft);border-radius:11px;padding:12px 14px;margin-bottom:10px}
.ind-scheda .tit{display:flex;align-items:center;gap:7px;font-size:11px;font-weight:800;text-transform:uppercase;
  letter-spacing:.05em;color:var(--fg-3);margin-bottom:5px}
.ind-scheda .via{font-size:14px;font-weight:700;line-height:1.4}
.ind-scheda .via small{display:block;font-weight:500;color:var(--fg-2);font-size:12.5px}
.nol-card{border:1px solid var(--border);border-radius:13px;padding:13px 15px;margin-bottom:11px;cursor:pointer;
  background:var(--surface);transition:border-color .15s,box-shadow .15s,transform .15s}
.nol-card:hover{border-color:var(--primary);box-shadow:var(--elev-2);transform:translateY(-1px)}
.nol-card .t1{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.nol-card .t1 b{font-size:13.5px;font-weight:800;font-variant-numeric:tabular-nums}
.nol-card .per{font-size:12.5px;color:var(--fg-2);margin-top:5px;display:flex;align-items:center;gap:6px}
.nol-card .dsp{font-size:12px;color:var(--fg-3);margin-top:3px}
.nol-card .eco{display:flex;align-items:center;gap:10px;margin-top:8px;font-size:12.5px}
.nol-card .eco .barra{flex:1}
.vuoto-vista{text-align:center;color:var(--fg-3);padding:34px;font-size:13.5px}

/* ════════════════════════════════════════════════════════════
   Restyling 2026: vista FLOTTA — «Magazzino» + calendario disponibilità
   (demo approvata: v3/demo/flotta-magazzino.html + calendario di flotta-disponibilita.html)
   ════════════════════════════════════════════════════════════ */
/* ─── Riquadri per modello: quanti ne ho liberi ─── */
.modelli{display:grid;grid-template-columns:repeat(auto-fill,minmax(232px,1fr));gap:12px;margin-bottom:20px}
.mod{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:14px 16px;cursor:pointer;
  box-shadow:var(--elev-1);transition:transform .16s,box-shadow .16s,border-color .16s;text-align:left;position:relative;
  font-family:inherit;color:inherit;width:100%}
.mod:hover{transform:translateY(-2px);box-shadow:var(--elev-2);border-color:var(--primary)}
.mod.on{border-color:var(--primary);box-shadow:var(--elev-2)}
.mod .cat{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--fg-3)}
.mod .nome{font-size:14px;font-weight:800;line-height:1.25;margin:2px 0 10px}
.mod .grande{display:flex;align-items:baseline;gap:7px}
.mod .grande b{font-size:30px;font-weight:800;letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}
.mod .grande span{font-size:12px;color:var(--fg-3);font-weight:600}
.mod .grande.zero b{color:var(--danger)}
.mod .grande.pochi b{color:var(--warn)}
.mod .grande.ok b{color:var(--accent)}
.mod .barra{margin:10px 0 7px}
.mod .barra i{background:var(--warn)}
.mod .righe{display:flex;gap:10px;flex-wrap:wrap;font-size:11.5px;color:var(--fg-2)}
.mod .righe b{font-weight:800}
.mod .avviso{position:absolute;top:12px;right:14px;font-size:10.5px;font-weight:800;color:var(--danger)}

/* ─── Riga esemplare (la prima colonna è la casella di selezione) ─── */
.rd{display:grid;grid-template-columns:26px 52px 1.1fr 128px 1.4fr 150px 112px minmax(112px,auto);gap:13px;align-items:center;
  padding:10px 18px;border-bottom:1px solid var(--border-soft);cursor:pointer;transition:background .13s}
.rd:last-child{border-bottom:none}
.rd:hover{background:var(--surface-2)}
.rd.scelta{background:var(--primary-soft)}
.rd .sel{width:18px;height:18px;border-radius:6px;border:1.5px solid var(--border);background:var(--surface);
  display:grid;place-items:center;color:transparent;cursor:pointer;padding:0;transition:background .15s,border-color .15s,color .15s}
.rd:hover .sel{border-color:var(--primary)}
.rd .sel.on{background:var(--primary);border-color:var(--primary);color:#fff}
[data-theme="dark"] .rd .sel.on{color:#08101F}
.rd .targa{width:52px;height:44px;border-radius:11px;display:grid;place-items:center;font-weight:800;font-size:12.5px;
  letter-spacing:.02em;font-variant-numeric:tabular-nums}
.rd .cosa b{font-size:13.5px;font-weight:700;display:block;line-height:1.3}
.rd .cosa span{font-size:11.5px;color:var(--fg-3)}
.rd .dove{font-size:12.5px;color:var(--fg-2);min-width:0}
.rd .dove b{display:block;font-weight:700;color:var(--fg);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rd .dove small{color:var(--fg-3);font-size:11.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}
.rd .quando{font-size:12px;color:var(--fg-3);white-space:nowrap}
.rd .quando b{display:block;font-weight:700;color:var(--fg);font-size:13px}
.rd .resa{text-align:right;font-size:11.5px;color:var(--fg-3)}
.rd .resa b{display:block;font-size:13.5px;font-weight:800;color:var(--fg);font-variant-numeric:tabular-nums}
.rd .az{display:flex;gap:5px;justify-content:flex-end;opacity:0;transition:opacity .16s}
.rd:hover .az,.rd:focus-within .az{opacity:1}
@media (max-width:1450px){.rd{grid-template-columns:26px 52px 1.1fr 128px 1.4fr 150px minmax(112px,auto)}.rd .resa{display:none}}
@media (max-width:1150px){.rd{grid-template-columns:26px 52px 1.1fr 128px 1.3fr minmax(112px,auto)}.rd .quando{display:none}}
@media (max-width:860px){.rd{grid-template-columns:26px 52px 1fr auto}.rd .dove{display:none}.rd .az{opacity:1}}

/* ─── Calendario delle disponibilità (dalla demo «Disponibilità») ─── */
.cal-flotta{overflow-x:auto}
.cal-griglia{min-width:760px}
.cal-riga{display:grid;grid-template-columns:214px 1fr;gap:10px;align-items:center;margin-bottom:5px}
.cal-riga.testa{margin-bottom:8px}
.cal-mod{font-size:12.5px;font-weight:700;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  cursor:pointer;border:none;background:transparent;text-align:left;font-family:inherit;color:inherit;padding:0}
.cal-mod:hover{color:var(--primary)}
.cal-mod small{display:block;font-weight:500;font-size:11px;color:var(--fg-3)}
.celle{display:grid;gap:2px}
.cella{height:26px;border-radius:5px;display:grid;place-items:center;font-size:10.5px;font-weight:800;
  font-variant-numeric:tabular-nums;transition:transform .1s}
.cella:hover{transform:scale(1.16);z-index:2;box-shadow:var(--elev-2)}
.c0{background:var(--danger);color:#fff}
.c1{background:color-mix(in srgb,var(--warn) 70%,transparent);color:#fff}
.c2{background:color-mix(in srgb,var(--warn) 35%,transparent);color:var(--fg-2)}
.c3{background:color-mix(in srgb,var(--accent) 30%,transparent);color:var(--fg-2)}
.c4{background:color-mix(in srgb,var(--accent) 60%,transparent);color:#fff}
[data-theme="dark"] .c0,[data-theme="dark"] .c1,[data-theme="dark"] .c4{color:#08101F}
.cal-giorni{display:grid;gap:2px;font-size:9.5px;color:var(--fg-3);text-align:center;font-weight:700}
.cal-giorni span{overflow:hidden;white-space:nowrap}
.cal-legenda{display:flex;gap:14px;flex-wrap:wrap;font-size:11.5px;color:var(--fg-3);margin-top:12px;align-items:center}
.cal-legenda i{width:14px;height:14px;border-radius:4px;display:inline-block;vertical-align:-3px;margin-right:5px}

/* ─── Nuovo dispositivo: anteprima dei codici che verranno creati ─── */
.anteprima-codici{background:var(--primary-soft);border:1px solid color-mix(in srgb,var(--primary) 30%,transparent);
  border-radius:12px;padding:12px 14px;margin:4px 0 16px}
.anteprima-codici b{display:block;font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;
  color:var(--primary);margin-bottom:7px}
.anteprima-codici span{font-size:12px;color:var(--fg-2)}
.anteprima-codici .codici{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:7px}
.cod-pill{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:3px 10px;font-size:12.5px;
  font-weight:800;font-variant-numeric:tabular-nums}
.cod-pill.doppio{border-color:var(--danger);color:var(--danger);text-decoration:line-through}

/* ─── Conferme su più esemplari: cosa succede pezzo per pezzo ─── */
.elenco-scelti{max-height:200px;overflow-y:auto;border:1px solid var(--border-soft);border-radius:11px;padding:10px 12px;
  background:var(--surface-2);margin-bottom:14px}
.riga-scelto{display:flex;align-items:center;gap:9px;padding:6px 0;border-bottom:1px solid var(--border-soft);font-size:13px}
.riga-scelto:last-child{border-bottom:none}
.riga-scelto .num{font-weight:800;font-variant-numeric:tabular-nums}
.riga-scelto .esito{margin-left:auto;font-size:11.5px;font-weight:700;text-align:right}
.avviso-flotta{border-radius:11px;padding:12px 14px;font-size:13px;line-height:1.45;display:flex;gap:10px;
  align-items:flex-start;margin-bottom:4px;color:var(--fg)}
.avviso-flotta.rosso{background:var(--danger-soft)}
.avviso-flotta.rosso b,.avviso-flotta.rosso > svg{color:var(--danger)}
.avviso-flotta.ambra{background:var(--warn-soft)}
.avviso-flotta.ambra b,.avviso-flotta.ambra > svg{color:var(--warn)}
.avviso-flotta b{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.05em;margin-bottom:3px}

/* ─── Fascicolo esemplare: targa grande e riquadro QR ─── */
.targa-gr{width:78px;height:64px;border-radius:16px;display:grid;place-items:center;font-weight:800;font-size:19px;
  letter-spacing:.02em;font-variant-numeric:tabular-nums;flex-shrink:0}
.qr-box{display:flex;align-items:center;gap:14px;background:var(--surface-2);border:1px solid var(--border-soft);
  border-radius:12px;padding:13px 15px;margin-top:12px}
.qr-finto{width:64px;height:64px;border-radius:10px;flex-shrink:0;border:3px solid var(--surface);
  background:repeating-conic-gradient(var(--fg) 0% 25%, var(--surface) 0% 50%) 50%/12px 12px}
.riga-nol{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--border-soft);cursor:pointer}
.riga-nol:last-child{border-bottom:none}
.riga-nol:hover b{color:var(--primary)}
.riga-nol b{font-size:13.5px;display:block;line-height:1.3}
.riga-nol span{font-size:11.5px;color:var(--fg-3)}
.riga-nol .gg{margin-left:auto;text-align:right;font-size:12px;color:var(--fg-3);white-space:nowrap}

/* ════════════════════════════════════════════════════════════
   Restyling 2026: vista MANUTENZIONI — «Lavagna»
   (demo approvata: v3/demo/manutenzioni-lavagna.html)
   Quattro colonne: Fermi · Da fare · In mano · Fatto di recente.
   ════════════════════════════════════════════════════════════ */
.avviso-fermi{display:flex;align-items:center;gap:12px;background:var(--danger-soft);
  border:1px solid color-mix(in srgb,var(--danger) 35%,transparent);border-radius:14px;padding:12px 16px;
  margin-bottom:16px;flex-wrap:wrap}
.avviso-fermi .n{font-size:26px;font-weight:800;color:var(--danger);line-height:1;font-variant-numeric:tabular-nums}
.avviso-fermi b{font-size:14px;display:block}
.avviso-fermi span{font-size:12.5px;color:var(--fg-2)}
.avviso-fermi .pezzi{display:flex;gap:6px;flex-wrap:wrap;margin-left:auto}
.pz{background:var(--surface);border:1px solid var(--border);border-radius:9px;padding:4px 10px;font-size:12px;
  font-weight:800;font-variant-numeric:tabular-nums;color:var(--fg);cursor:pointer;text-align:center}
.pz:hover{border-color:var(--danger);color:var(--danger)}
.pz small{display:block;font-weight:600;font-size:10.5px;color:var(--fg-3)}

.lavagna{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;align-items:start;margin-bottom:18px}
@media (max-width:1250px){.lavagna{grid-template-columns:repeat(2,1fr)}}
@media (max-width:760px){.lavagna{grid-template-columns:1fr}}
.col-mn{background:var(--surface-2);border:1px solid var(--border-soft);border-radius:15px;padding:11px;
  animation:entra .3s ease-out backwards}
[data-theme="dark"] .col-mn{background:rgba(255,255,255,.02)}
.col-mn .col-testa{display:flex;align-items:center;gap:8px;padding:3px 5px 10px}
.col-mn .col-testa i{width:9px;height:9px;border-radius:99px;background:var(--tono)}
.col-mn .col-testa b{font-size:13.5px;font-weight:800}
.col-mn .col-testa .n{font-size:11.5px;font-weight:800;color:var(--fg-3);background:var(--surface);
  border:1px solid var(--border);border-radius:99px;padding:1px 8px}
.col-mn .col-nota{font-size:11.5px;color:var(--fg-3);padding:0 5px 10px;margin-top:-6px;line-height:1.35}
.col-mn .col-corpo{display:flex;flex-direction:column;gap:9px;min-height:60px}
.col-vuota{padding:20px 10px;text-align:center;font-size:12.5px;color:var(--fg-3);border:1px dashed var(--border);border-radius:12px}

/* card di lavoro */
.cw{background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--tono);border-radius:12px;
  padding:11px 13px;box-shadow:var(--elev-1);transition:transform .15s,box-shadow .15s}
.cw:hover{transform:translateY(-2px);box-shadow:var(--elev-2)}
.cw .t1{display:flex;align-items:center;gap:9px;margin-bottom:7px}
.cw .targa{width:44px;height:36px;border-radius:10px;display:grid;place-items:center;font-weight:800;font-size:12px;
  font-variant-numeric:tabular-nums;background:color-mix(in srgb,var(--tono) 14%,transparent);color:var(--tono);flex-shrink:0}
.cw .t1 b{font-size:13px;font-weight:700;display:block;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cw .t1 span{font-size:11px;color:var(--fg-3);display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cw .descr{font-size:12.5px;color:var(--fg-2);line-height:1.4;margin-bottom:8px}
.cw .meta{display:flex;align-items:center;gap:7px;flex-wrap:wrap;font-size:11px;color:var(--fg-3)}
.cw .fermo-badge{background:var(--border-soft);color:var(--fg-2);border-radius:7px;padding:2px 7px;font-weight:800;font-size:10.5px}
[data-theme="dark"] .cw .fermo-badge{background:var(--surface-2)}
.cw .fermo-badge.grave{background:var(--danger-soft);color:var(--danger)}
.cw .fermo-badge.medio{background:var(--warn-soft);color:var(--warn)}
.cw .azioni{display:flex;gap:6px;margin-top:9px;padding-top:9px;border-top:1px solid var(--border-soft);flex-wrap:wrap}
.cw .azioni .btn-riga{flex:1;justify-content:center;padding:5px 8px;font-size:11.5px}
.cw .azioni .btn-riga:disabled{opacity:.5;cursor:not-allowed}
.cw .azioni .btn-icona{width:28px;height:28px;flex-shrink:0}

/* piede: controlli in scadenza e spesa */
.piede-lavagna{display:grid;grid-template-columns:1.6fr 1fr;gap:14px;align-items:start}
@media (max-width:1000px){.piede-lavagna{grid-template-columns:1fr}}
.riga-scad{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--border-soft);font-size:13px}
.riga-scad:last-of-type{border-bottom:none}
.riga-scad > b{font-weight:800;cursor:pointer}
.riga-scad > b:hover{color:var(--primary)}
.riga-scad .mod{color:var(--fg-2);font-size:12.5px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.riga-scad .mod small{display:block;font-size:11px;color:var(--fg-3)}
.riga-scad .quando{margin-left:auto;font-size:12px;font-weight:700;white-space:nowrap}
.piu-scad{font-size:12px;color:var(--fg-3);padding-top:9px}
.riga-costo{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--border-soft);font-size:13px}
.riga-costo:last-child{border-bottom:none}
.riga-costo .imp{margin-left:auto;font-weight:800;font-variant-numeric:tabular-nums}
.vuoto-mn{font-size:12.5px;color:var(--fg-3);line-height:1.5;padding:6px 0}

/* elenco dei piani nella modale */
.elenco-piani{display:flex;flex-direction:column;gap:8px;max-height:340px;overflow-y:auto}
.riga-piano{display:flex;align-items:center;gap:10px;background:var(--surface-2);border:1px solid var(--border-soft);
  border-radius:11px;padding:10px 12px}
.riga-piano b{font-size:13.5px;display:block}
.riga-piano span{font-size:11.5px;color:var(--fg-3);display:block}
.riga-piano small{font-size:11.5px;color:var(--fg-2);display:block;margin-top:2px}

/* ════════════════════════════════════════════════════════════
   Restyling 2026: vista INCASSI — «Scadenzario»
   (demo approvata: v3/demo/incassi-scadenzario.html + selettore «per blocco»)
   ════════════════════════════════════════════════════════════ */
.eroe-cassa{display:grid;grid-template-columns:340px 1fr;gap:14px;margin-bottom:16px}
@media (max-width:1050px){.eroe-cassa{grid-template-columns:1fr}}
.eroe-num{background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:var(--elev-2);padding:18px 20px;
  display:flex;flex-direction:column;justify-content:center;gap:4px}
.eroe-num .et{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--fg-3)}
.eroe-num .vl{font-size:36px;font-weight:800;letter-spacing:-.03em;line-height:1;color:var(--danger);font-variant-numeric:tabular-nums}
.eroe-num .nt{font-size:12.5px;color:var(--fg-2);margin-top:4px}
.eroe-num .riga{display:flex;gap:16px;margin-top:12px;padding-top:12px;border-top:1px solid var(--border-soft)}
.eroe-num .riga div{flex:1}
.eroe-num .riga b{display:block;font-size:17px;font-weight:800;font-variant-numeric:tabular-nums}
.eroe-num .riga span{font-size:11px;color:var(--fg-3);text-transform:uppercase;letter-spacing:.04em;font-weight:700}
.andamento-cassa{padding:14px 18px 8px}
.andamento-cassa .testa{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:4px}
.andamento-cassa h2{font-size:14.5px;font-weight:800}
.andamento-cassa .testa > span{font-size:12px;color:var(--fg-3)}
.andamento-cassa .testa .big{margin-left:auto;font-size:18px;font-weight:800;color:var(--accent);font-variant-numeric:tabular-nums}
.andamento-cassa .testa .big small{font-size:11px;color:var(--fg-3);font-weight:600;margin-left:6px}
.andamento-cassa .canvas-box{height:118px;position:relative}

.tabs-cassa{display:flex;gap:2px;align-items:center;border-bottom:1px solid var(--border);margin-bottom:16px}
.tabs-cassa .tab{border:none;background:transparent;font-family:inherit;font-size:14px;font-weight:700;color:var(--fg-3);
  padding:11px 16px;border-bottom:2px solid transparent;margin-bottom:-1px;display:flex;align-items:center;gap:8px;cursor:pointer}
.tabs-cassa .tab:hover{color:var(--fg)}
.tabs-cassa .tab.on{color:var(--primary);border-bottom-color:var(--primary)}
.tabs-cassa .tab .n{font-size:11px;background:var(--border-soft);color:var(--fg-2);border-radius:99px;padding:1px 7px;font-weight:800}
.tabs-cassa .tab.on .n{background:var(--primary-soft);color:var(--primary)}
.tabs-cassa .tab .n.rosso{background:var(--danger-soft);color:var(--danger)}
[data-theme="dark"] .tabs-cassa .tab .n{background:var(--surface-2)}
.tabs-cassa .btn{margin-bottom:6px}

/* riga saldo aperto */
.rgs{display:grid;grid-template-columns:44px 1.4fr 1.3fr 150px 150px auto;gap:14px;align-items:center;padding:11px 18px;
  border-bottom:1px solid var(--border-soft);cursor:pointer;transition:background .13s}
.rgs:last-child{border-bottom:none}
.rgs:hover{background:var(--surface-2)}
.rgs .iniz{width:44px;height:44px;border-radius:13px;font-size:14px}
.rgs .chi b{font-size:14px;font-weight:700;display:block;line-height:1.3}
.rgs .chi span{font-size:11.5px;color:var(--fg-3)}
.rgs .cosa{font-size:12.5px;color:var(--fg-2);min-width:0}
.rgs .cosa b{display:block;font-size:13px;color:var(--fg);font-weight:700}
.rgs .cosa small{display:block;color:var(--fg-3);font-size:11.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rgs .quando{font-size:12px;color:var(--fg-3);white-space:nowrap}
.rgs .quando b{display:block;font-size:13px;color:var(--fg);font-weight:700}
.rgs .saldo{text-align:right}
.rgs .saldo b{font-size:15px;font-weight:800;color:var(--danger);display:block;font-variant-numeric:tabular-nums}
.rgs .saldo small{font-size:11px;color:var(--fg-3)}
.rgs .saldo .barra{margin-top:4px}
.rgs .az{display:flex;gap:5px;justify-content:flex-end}
@media (max-width:1300px){.rgs{grid-template-columns:44px 1.4fr 150px 150px auto}.rgs .cosa{display:none}}
@media (max-width:900px){.rgs{grid-template-columns:44px 1fr 150px auto}.rgs .quando{display:none}}

/* registro del mese */
.mese-nav{display:inline-flex;align-items:center;gap:2px;background:var(--surface);border:1px solid var(--border);border-radius:11px;padding:3px}
.mese-nav button{border:none;background:transparent;width:30px;height:30px;border-radius:8px;color:var(--fg-2);display:grid;place-items:center;cursor:pointer}
.mese-nav button:hover{background:var(--bg);color:var(--fg)}
.mese-nav b{font-size:13.5px;font-weight:800;padding:0 8px;min-width:150px;text-align:center;text-transform:capitalize}
.mese-lay{display:grid;grid-template-columns:1fr 300px;gap:16px;align-items:start}
@media (max-width:1100px){.mese-lay{grid-template-columns:1fr}}
.sep-giorno{padding:6px 18px;background:var(--surface-2);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;
  color:var(--fg-3);border-bottom:1px solid var(--border-soft);display:flex;gap:10px}
.sep-giorno span{margin-left:auto;font-weight:700;text-transform:none;letter-spacing:0;color:var(--fg-2)}
.ric{display:grid;grid-template-columns:56px 1.4fr 130px 110px 120px;gap:12px;align-items:center;padding:10px 18px;
  border-bottom:1px solid var(--border-soft);cursor:pointer;transition:background .13s}
.ric:last-child{border-bottom:none}
.ric:hover{background:var(--surface-2)}
.ric .giorno{text-align:center;line-height:1.05}
.ric .giorno b{font-size:17px;font-weight:800;display:block;font-variant-numeric:tabular-nums}
.ric .giorno span{font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--fg-3)}
.ric .chi b{font-size:13.5px;font-weight:700;display:block;line-height:1.3}
.ric .chi span{font-size:11.5px;color:var(--fg-3)}
.ric .reg{font-size:11.5px;color:var(--fg-3)}
.ric .imp{text-align:right;font-size:14.5px;font-weight:800;font-variant-numeric:tabular-nums;color:var(--accent)}
@media (max-width:1400px){.ric{grid-template-columns:56px 1.4fr 120px 120px}.ric .reg{display:none}}
.laterale-cassa{position:sticky;top:18px;display:flex;flex-direction:column;gap:12px}
.laterale-cassa .card h2{font-size:14px;font-weight:800;margin-bottom:2px}
.laterale-cassa .card .sub{font-size:12px;color:var(--fg-3);margin-bottom:10px}
.riga-q{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--border-soft);font-size:13px}
.riga-q:last-child{border-bottom:none}
.riga-q i{width:10px;height:10px;border-radius:99px;flex-shrink:0}
.riga-q .imp{margin-left:auto;font-weight:800;font-variant-numeric:tabular-nums}
.riga-q .pct{font-size:11.5px;color:var(--fg-3);width:38px;text-align:right}
.tot-mese{display:flex;justify-content:space-between;padding-top:10px;margin-top:6px;border-top:2px solid var(--border);font-weight:800;font-size:15px}

/* modale «Registra incasso» */
.importo-grande{font-size:24px !important;font-weight:800;font-variant-numeric:tabular-nums}
.riep-mod{background:var(--surface-2);border:1px solid var(--border-soft);border-radius:12px;padding:10px 14px;margin-bottom:14px;font-size:13px}
.riep-mod .riga-q{padding:5px 0}

/* ─── vista FATTURAZIONE «Scrivania» (demo/fatturazione-scrivania.html) ─── */
.eroe-fatt .vl{color:var(--fg)}
.eroe-num .riga button{flex:1;border:none;background:transparent;font-family:inherit;text-align:left;color:inherit;
  border-radius:8px;padding:2px 4px;margin:-2px -4px;cursor:pointer;transition:background .15s}
.eroe-num .riga button:hover{background:var(--surface-2)}
.tabs-cassa .tab .n.giallo{background:var(--warn-soft);color:var(--warn)}
.tabs-cassa .btn-secondario{margin-bottom:6px;padding:7px 12px;font-size:13px}
.avviso-storico{display:flex;align-items:center;gap:12px;background:var(--warn-soft);border:1px solid color-mix(in srgb,var(--warn) 35%,transparent);
  border-radius:14px;padding:11px 16px;margin-bottom:14px;flex-wrap:wrap;font-size:13px;color:var(--fg-2)}
.avviso-storico svg{color:var(--warn);flex-shrink:0}
.avviso-storico b{color:var(--fg)}
.avviso-storico .btn{margin-left:auto}
/* riga «da fatturare»: casella · iniziali · chi · cosa (voci) · quando · importo · azioni */
.rft{display:grid;grid-template-columns:22px 44px 1.3fr 1.5fr 150px 165px auto;gap:14px;align-items:center;padding:11px 18px;
  border-bottom:1px solid var(--border-soft);cursor:pointer;transition:background .13s}
.rft:last-child{border-bottom:none}
.rft:hover{background:var(--surface-2)}
.rft.scelta{background:var(--primary-soft)}
.rft .sel{width:18px;height:18px;border-radius:6px;border:1.5px solid var(--border);background:var(--surface);
  display:grid;place-items:center;color:transparent;cursor:pointer;transition:background .15s,border-color .15s,color .15s;padding:0}
.rft:hover .sel{border-color:var(--primary)}
.rft .sel.on{background:var(--primary);border-color:var(--primary);color:#fff}
[data-theme="dark"] .rft .sel.on{color:#08101F}
.rft .iniz{width:44px;height:44px;border-radius:13px;font-size:14px}
.rft .chi{min-width:0}
.rft .chi b{font-size:14px;font-weight:700;display:block;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rft .chi > span{font-size:11.5px;color:var(--fg-3);display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rft .chi .manca{color:var(--danger);font-weight:700}
.rft .cosa{min-width:0}
.rft .cosa b{display:block;font-size:12.5px;color:var(--fg);font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rft .cosa .voci{display:flex;gap:4px;flex-wrap:wrap;margin-top:3px}
.rft .quando{font-size:12px;color:var(--fg-3);white-space:nowrap}
.rft .quando b{display:block;font-size:13px;color:var(--fg);font-weight:700}
.rft .imp{text-align:right}
.rft .imp b{font-size:15px;font-weight:800;display:block;font-variant-numeric:tabular-nums}
.rft .imp small{font-size:11px;color:var(--fg-3);display:block;white-space:nowrap}
.rft .imp .pag{font-size:11px;font-weight:700;margin-top:2px;color:var(--fg-3)}
.rft .imp .pag.su{color:var(--accent)}
.rft .az{display:flex;gap:5px;justify-content:flex-end}
@media (max-width:1400px){.rft{grid-template-columns:22px 44px 1.3fr 150px 165px auto}.rft .cosa{display:none}}
/* sotto ~1150 px la corsia è larga meno di 850 px: con «quando» + importo + azioni la colonna cliente collassava a pochi px */
@media (max-width:1150px){.rft{grid-template-columns:22px 44px 1fr 165px auto}.rft .quando{display:none}}
/* riga documento (proforma / fattura): giorno · titolo+cliente · stato · importo · azioni */
.rfd{display:grid;grid-template-columns:56px 1fr auto 120px auto;gap:12px;align-items:center;padding:10px 18px;
  border-bottom:1px solid var(--border-soft);cursor:pointer;transition:background .13s}
.rfd:last-child{border-bottom:none}
.rfd:hover{background:var(--surface-2)}
.rfd .giorno{text-align:center;line-height:1.05}
.rfd .giorno b{font-size:17px;font-weight:800;display:block;font-variant-numeric:tabular-nums}
.rfd .giorno span{font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--fg-3)}
.rfd .doc{min-width:0}
.rfd .doc b{font-size:13.5px;font-weight:700;display:block;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rfd .doc b em{font-style:normal;color:var(--fg-2);font-weight:600}
.rfd .doc > span{font-size:11.5px;color:var(--fg-3);display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rfd .imp{text-align:right;font-size:14.5px;font-weight:800;font-variant-numeric:tabular-nums}
.rfd .imp small{display:block;font-size:11px;color:var(--fg-3);font-weight:500;white-space:nowrap}
.rfd .az{display:flex;gap:5px;justify-content:flex-end;opacity:.35;transition:opacity .15s}
.rfd:hover .az,.rfd:focus-within .az{opacity:1}
@media (max-width:1000px){.rfd{grid-template-columns:56px 1fr 120px auto}.rfd .st{display:none}}
/* riga eccedenza */
.rfe{display:grid;grid-template-columns:44px 1.3fr 110px 110px 120px 1.6fr auto;gap:12px;align-items:center;padding:11px 18px;
  border-bottom:1px solid var(--border-soft);cursor:pointer;transition:background .13s}
.rfe:last-child{border-bottom:none}
.rfe:hover{background:var(--surface-2)}
.rfe .chi b{font-size:14px;font-weight:700;display:block;line-height:1.3}
.rfe .chi span{font-size:11.5px;color:var(--fg-3)}
.rfe .num{text-align:right;font-variant-numeric:tabular-nums;font-size:13.5px}
.rfe .num small{display:block;font-size:10.5px;color:var(--fg-3);text-transform:uppercase;letter-spacing:.04em;font-weight:700}
.rfe .num.ecc{font-weight:800;color:var(--danger);font-size:15px}
.rfe .note{font-size:12px;color:var(--fg-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:1250px){.rfe{grid-template-columns:44px 1.3fr 120px auto}.rfe .num:not(.ecc),.rfe .note{display:none}}
/* pezzi delle modali */
.passo-ft{display:flex;gap:10px;align-items:flex-start;padding:7px 0;font-size:12.5px;color:var(--fg-2);line-height:1.4}
.passo-ft i{width:20px;height:20px;border-radius:99px;background:var(--primary-soft);color:var(--primary);font-style:normal;font-weight:800;
  font-size:11px;display:grid;place-items:center;flex-shrink:0}
.nota-ft{font-size:12px;color:var(--fg-3);line-height:1.45;margin:10px 0 4px}
.riep-ft{display:block;margin-bottom:12px}
.riep-ft .testa-riep{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:4px;font-size:13px}
.riep-ft .testa-riep b{font-size:14px}
.riep-ft .testa-riep span{font-size:12px;color:var(--fg-3)}
.riep-ft .voce-pf{cursor:pointer;gap:9px}
.riep-ft .voce-pf input{accent-color:var(--primary);width:15px;height:15px;flex-shrink:0}
.riep-ft .voce-pf > span:first-of-type{flex:1;min-width:0}
.riep-ft .tot-pf{border-top:1px solid var(--border);margin-top:4px;padding-top:8px;font-weight:800;font-size:14px}
.riep-ft .tot-pf .dett{font-weight:500;color:var(--fg-3);font-size:12px;margin-left:6px}

/* ─── vista MESSAGGI «Studio» (demo/messaggi-studio.html) ─── */
/* ─── anteprima EMAIL: identica alla cornice reale email_template() ─── */
.ant-email{background:#EDF4F6;border-radius:14px;padding:16px 14px 18px;font-family:-apple-system,'Segoe UI',Roboto,Arial,sans-serif}
[data-theme="dark"] .ant-email{background:#111A2C;border:1px solid var(--border)}
.ant-busta{display:flex;flex-direction:column;gap:2px;font-size:11.5px;color:#4E6E78;margin:0 0 12px 4px}
[data-theme="dark"] .ant-busta{color:var(--fg-3)}
.ant-busta b{font-weight:700;color:#0F3A44}
[data-theme="dark"] .ant-busta b{color:var(--fg-2)}
.ant-mail{max-width:460px;margin:0 auto}
.ant-testa{background:linear-gradient(140deg,#0A6E80,#0E8FA3 45%,#0FA36B);border-radius:16px 16px 0 0;padding:16px 20px}
.ant-testa .b1{color:#fff;font-size:17px;font-weight:800}
.ant-testa .b2{color:rgba(255,255,255,.8);font-size:10.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.ant-corpo{background:#fff;border-radius:0 0 16px 16px;padding:20px 20px;color:#0F3A44}
.ant-corpo h4{margin:0 0 12px;font-size:16px;letter-spacing:-.02em;font-weight:700}
.ant-corpo p{margin:0;font-size:13.5px;line-height:1.55}
.ant-corpo mark{background:#FFF3C4;color:inherit;border-radius:3px;padding:0 2px}
.ant-allegato{display:inline-flex;align-items:center;gap:6px;margin-top:14px;background:#EDF4F6;border:1px solid #CFE0E5;border-radius:8px;padding:5px 10px;font-size:12px;font-weight:600;color:#0A6E80}
.ant-pie{margin-top:18px;font-size:11px;color:#66858F;line-height:1.5}

/* ─── anteprima WHATSAPP: il telefono del cliente ─── */
.ant-wa{display:flex;justify-content:center;padding:14px 10px 18px}
.ant-tel{width:300px;background:#E5DDD5;border:8px solid #1B1B1F;border-radius:32px;overflow:hidden;box-shadow:var(--elev-3);font-family:-apple-system,'Segoe UI',Roboto,Arial,sans-serif}
[data-theme="dark"] .ant-tel{background:#0B141A;border-color:#2C2C33}
.ant-tel-testa{background:#075E54;color:#fff;padding:12px 14px 10px;display:flex;align-items:center;gap:10px}
[data-theme="dark"] .ant-tel-testa{background:#1F2C34}
.ant-tel-testa .av{width:32px;height:32px;border-radius:99px;background:#CFD8DC;color:#37474F;font-size:12px;font-weight:800;display:grid;place-items:center}
.ant-tel-testa b{display:block;font-size:13.5px;font-weight:700;line-height:1.2}
.ant-tel-testa span{font-size:11px;opacity:.8}
.ant-chat{padding:14px 12px 22px;min-height:180px;background-image:radial-gradient(circle at 20% 30%,rgba(0,0,0,.03) 0 2px,transparent 3px)}
.ant-data{text-align:center;font-size:10.5px;color:#54656F;background:#F1F1F1;width:max-content;margin:0 auto 12px;padding:2px 10px;border-radius:8px}
[data-theme="dark"] .ant-data{background:#182229;color:#8696A0}
.ant-bolla{background:#DCF8C6;color:#111;border-radius:10px 10px 10px 2px;padding:8px 10px 18px;font-size:13px;line-height:1.45;position:relative;max-width:92%;box-shadow:0 1px 1px rgba(0,0,0,.12);word-wrap:break-word}
[data-theme="dark"] .ant-bolla{background:#005C4B;color:#E9EDEF}
.ant-bolla .ora{position:absolute;right:8px;bottom:4px;font-size:10px;color:#667781}
[data-theme="dark"] .ant-bolla .ora{color:#8696A0}
.ant-bolla mark{background:rgba(255,220,0,.45);color:inherit;border-radius:3px;padding:0 2px}

/* ─── editor del template ─── */
.editor-msg{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;align-items:start}
@media (max-width:1250px){.editor-msg{grid-template-columns:1fr}}
.ed-col h3{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--fg-3);margin-bottom:8px;display:flex;align-items:center;gap:8px}
.ed-col h3 .spazio{margin-left:auto}
.editor-msg textarea{min-height:190px;line-height:1.5;resize:vertical}
.contatore{font-size:11.5px;color:var(--fg-3);text-align:right;margin-top:-8px;margin-bottom:10px}
.contatore.oltre{color:var(--danger);font-weight:700}
.segnaposto{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.sp-chip{border:1px solid var(--border);background:var(--surface);color:var(--fg-2);border-radius:99px;padding:4px 10px;font-size:12px;font-weight:700;cursor:pointer;font-family:ui-monospace,Menlo,Consolas,monospace;transition:border-color .12s,color .12s,background .12s}
.sp-chip:hover{border-color:var(--primary);color:var(--primary);background:var(--primary-soft)}
.sp-chip small{font-family:'Figtree',system-ui,sans-serif;font-weight:600;color:var(--fg-3);margin-left:5px}
mark.sp{background:var(--primary-soft);color:var(--primary);border-radius:4px;padding:0 3px;font-weight:700}
mark.sp-err{background:var(--danger-soft);color:var(--danger)}
.avviso-sp{font-size:12.5px;color:var(--danger);font-weight:600;margin-bottom:10px}
.ant-barra{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.ant-barra select{background:var(--surface);border:1px solid var(--border);border-radius:9px;padding:6px 10px;font-family:inherit;font-size:12.5px;font-weight:600;color:var(--fg)}
.ant-barra .btn-riga{margin-left:auto}
.canale-sw{display:inline-flex;background:var(--bg);border:1px solid var(--border);border-radius:9px;padding:3px;gap:3px}
.canale-sw button{border:none;background:transparent;font-family:inherit;font-size:12.5px;font-weight:700;color:var(--fg-2);padding:5px 12px;border-radius:7px;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.canale-sw button.on{background:var(--surface);color:var(--primary);box-shadow:var(--elev-1)}
.riga-toggle{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:600;color:var(--fg-2)}
.toggle{width:38px;height:22px;border-radius:99px;background:var(--border);position:relative;cursor:pointer;transition:background .15s;flex-shrink:0;border:none}
.toggle::after{content:'';position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:99px;background:#fff;transition:transform .15s;box-shadow:0 1px 2px rgba(0,0,0,.25)}
.toggle.on{background:var(--accent)}
.toggle.on::after{transform:translateX(16px)}

.strisce-msg{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px}
@media (max-width:1100px){.strisce-msg{grid-template-columns:repeat(2,1fr)}}
.strisce-msg .striscia{flex:none;min-width:0;text-align:left;font-family:inherit;color:inherit;cursor:pointer;display:flex;flex-direction:column;gap:2px;padding:12px 16px}
.strisce-msg .striscia .vl small{font-size:14px;color:var(--fg-3);font-weight:700}
.strisce-msg .striscia .nt{color:var(--fg-2);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.log-msg{background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:14px;font-size:12px;line-height:1.6;overflow-x:auto;margin:0 0 16px;font-family:ui-monospace,Menlo,Consolas,monospace;color:var(--fg-2)}
.tabs-cassa .btn-secondario{margin-bottom:6px}
/* studio: elenco riordinato + foglio dell'editor */
.studio-msg{display:grid;grid-template-columns:300px 1fr;gap:16px;align-items:start}
@media (max-width:1100px){.studio-msg{grid-template-columns:1fr}}
.elenco-msg{background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:var(--elev-1);overflow:hidden;position:sticky;top:16px}
.el-mom{padding:12px 14px 6px;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--fg-3);display:flex;align-items:center;gap:8px;border-top:1px solid var(--border-soft)}
.el-mom:first-child{border-top:none}
.el-mom i{width:9px;height:9px;border-radius:99px;background:var(--tono);display:inline-block}
.el-mom .n{margin-left:auto;font-size:10.5px;background:var(--surface-2);border:1px solid var(--border-soft);border-radius:99px;padding:0 7px;color:var(--fg-3)}
.mit{display:grid;grid-template-columns:1fr auto;gap:8px 10px;align-items:center;padding:8px 14px 8px 17px;cursor:pointer;border-left:3px solid transparent;transition:background .12s}
.mit:hover{background:var(--surface-2)}
.mit.on{background:var(--primary-soft);border-left-color:var(--primary)}
.mit .tt{min-width:0}
.mit .tt b{display:block;font-size:13.5px;font-weight:700;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mit .tt span{display:flex;align-items:center;gap:5px;font-size:11.5px;color:var(--fg-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mit .tt span svg{flex-shrink:0;width:12px;height:12px}
.mit .can{display:flex;gap:4px}
.mit .can button{border:1px solid var(--border);background:var(--surface);color:var(--fg-3);width:30px;height:28px;border-radius:8px;display:grid;place-items:center;cursor:pointer;transition:border-color .12s,color .12s,background .12s;position:relative;padding:0}
.mit .can button svg{width:15px;height:15px}
.mit .can button:hover{border-color:var(--primary);color:var(--primary)}
.mit .can button.on{background:var(--primary);border-color:var(--primary);color:#fff}
[data-theme="dark"] .mit .can button.on{color:#08101F}
.mit .can button.spento::after{content:'';position:absolute;top:-3px;right:-3px;width:8px;height:8px;border-radius:99px;background:var(--fg-3);border:2px solid var(--surface)}
.el-legenda{padding:8px 14px;font-size:11px;color:var(--fg-3);display:flex;gap:12px;flex-wrap:wrap;border-top:1px solid var(--border-soft);align-items:center}
.el-legenda span{display:inline-flex;align-items:center;gap:4px}
.el-legenda svg{width:12px;height:12px}
.el-legenda i{display:inline-block;width:8px;height:8px;border-radius:99px}
.foglio-msg{background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:var(--elev-2);padding:18px 20px 16px;min-width:0}
.foglio-msg .testa{display:flex;align-items:flex-start;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.foglio-msg .testa h2{font-size:17px;font-weight:800;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.foglio-msg .testa .sub{font-size:12.5px;color:var(--fg-3);margin-top:2px}
.foglio-msg .testa .dx{margin-left:auto;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.usato-da{font-size:12px;color:var(--fg-2);background:var(--surface-2);border:1px solid var(--border-soft);border-radius:10px;padding:8px 12px;margin-bottom:12px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.usato-da b{color:var(--fg)}
.usato-da svg{flex-shrink:0;color:var(--fg-3)}
.piede-ed{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:14px;padding-top:14px;border-top:1px solid var(--border-soft)}
.piede-ed .spazio{margin-left:auto}
.piede-ed .salvato{font-size:12px;color:var(--fg-3)}
/* registro */
.rmsg{display:grid;grid-template-columns:44px 1.2fr 2fr 150px auto;gap:12px;align-items:center;padding:10px 18px;border-bottom:1px solid var(--border-soft);cursor:pointer;transition:background .13s}
.rmsg:last-child{border-bottom:none}
.rmsg:hover{background:var(--surface-2)}
.rmsg .ic{width:36px;height:36px;border-radius:11px;display:grid;place-items:center}
.rmsg .chi{min-width:0}
.rmsg .chi b{display:block;font-size:13.5px;font-weight:700;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rmsg .chi span{display:block;font-size:11.5px;color:var(--fg-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rmsg .cosa{min-width:0;font-size:12.5px;color:var(--fg-2)}
.rmsg .cosa b{display:block;font-size:13px;color:var(--fg);font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rmsg .cosa span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--fg-3);font-size:12px}
.rmsg .quando{font-size:12px;color:var(--fg-3);min-width:0}
.rmsg .quando b{display:block;color:var(--fg);font-size:12.5px;font-weight:700;white-space:nowrap}
.rmsg .quando span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rmsg .az{display:flex;gap:5px;justify-content:flex-end}
@media (max-width:1200px){.rmsg{grid-template-columns:44px 1.2fr 150px auto}.rmsg .cosa{display:none}}
/* automazioni */
.ram{display:grid;grid-template-columns:44px 1.3fr 1.5fr 1fr auto auto;gap:12px;align-items:center;padding:11px 18px;border-bottom:1px solid var(--border-soft)}
.ram:last-child{border-bottom:none}
.ram .ic{width:36px;height:36px;border-radius:11px;display:grid;place-items:center}
.ram b.mom{display:block;font-size:13.5px;font-weight:700}
.ram .qd{font-size:12.5px;color:var(--fg-2)}
.ram .qd small{display:block;color:var(--fg-3);font-size:11.5px}
.ram .tpl{font-size:12.5px;color:var(--fg-2);display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.ram .tpl a{font-weight:700;text-decoration:none}
.ram .az{display:flex;gap:5px}
.ram.spenta{opacity:.6}
@media (max-width:1200px){.ram{grid-template-columns:44px 1.3fr 1.5fr auto auto}.ram .tpl{display:none}}
.nota-cron{font-size:12.5px;color:var(--fg-3);margin-bottom:12px;line-height:1.5}
.griglia-imp-msg{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
@media (max-width:1100px){.griglia-imp-msg{grid-template-columns:1fr}}

/* ─── Restyling 2026: skeleton ─── */
.skl{border-radius:10px;background:linear-gradient(90deg,var(--border-soft) 25%,var(--border) 50%,var(--border-soft) 75%);
  background-size:200% 100%;animation:brilla 1.2s infinite linear}
@keyframes brilla{from{background-position:200% 0}to{background-position:-200% 0}}

/* ─── Utilità ─── */
.caricamento{display:grid;place-items:center;padding:80px 0;color:var(--fg-3);font-size:14px}
.spinner{width:22px;height:22px;border:3px solid var(--border);border-top-color:var(--primary);
  border-radius:99px;animation:gira .7s linear infinite;margin:0 auto 10px}
@keyframes gira{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important}
}
@media (max-width: 1100px){
  .griglia-dash{grid-template-columns:1fr !important}
}
@media (max-width: 900px){
  .layout{grid-template-columns:1fr}
  .side{position:static;height:auto;flex-direction:row;flex-wrap:wrap;border-right:none;border-bottom:1px solid var(--border)}
  .main{padding:18px 16px 32px}
}

/* ═══════════ vista REPORT — «Cruscotto» (demo report-cruscotto.html) + «Resoconto» in modale (demo report-foglio.html) ═══════════ */
.rep-periodo{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.rep-periodo .nt{font-size:12.5px;color:var(--fg-3)}
.rep-periodo .pill{font-size:12.5px;padding:5px 12px}
/* eroe: 4 numeri con sparkline */
.rep-eroe{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:14px}
@media (max-width:1150px){.rep-eroe{grid-template-columns:repeat(2,1fr)}}
.rep-kn{background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:var(--elev-2);padding:16px 18px 12px;position:relative;overflow:hidden;cursor:pointer;
  transition:transform .18s,box-shadow .18s,border-color .18s,background .25s}
.rep-kn:hover{transform:translateY(-3px);box-shadow:var(--elev-3);border-color:var(--primary)}
.rep-kn .et{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--fg-3)}
.rep-kn .vl{font-size:30px;font-weight:800;letter-spacing:-.03em;line-height:1.1;font-variant-numeric:tabular-nums;margin-top:4px}
.rep-kn .vl small{font-size:14px;color:var(--fg-3);font-weight:700}
.rep-kn .nt{font-size:12.5px;color:var(--fg-2);margin-top:4px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.rep-kn .spark{height:46px;margin:8px -18px -12px;position:relative}
.rep-kn .spark canvas{width:100% !important;height:100% !important}
/* grafico grande */
.rep-grande{padding:16px 18px 10px;margin-bottom:16px}
.rep-grande .testa{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:4px}
.rep-grande h2{font-size:15px;font-weight:800}
.rep-grande .testa > span{font-size:12px;color:var(--fg-3)}
.rep-grande .canvas-box{height:210px;position:relative}
/* sei riquadri */
.rep-bento{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:14px}
@media (max-width:1250px){.rep-bento{grid-template-columns:repeat(2,1fr)}}
@media (max-width:760px){.rep-bento{grid-template-columns:1fr}}
.rep-riq{background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:var(--elev-1);padding:16px 18px 14px;cursor:pointer;position:relative;
  display:flex;flex-direction:column;gap:8px;transition:transform .18s,box-shadow .18s,border-color .18s,background .25s;animation:entra .3s ease-out backwards}
.rep-riq:hover{transform:translateY(-3px);box-shadow:var(--elev-3);border-color:var(--primary)}
.rep-riq.on{border-color:var(--primary);box-shadow:var(--elev-3)}
.rep-riq.on::after{content:"";position:absolute;left:50%;bottom:-9px;width:16px;height:16px;background:var(--surface);border-right:1px solid var(--primary);border-bottom:1px solid var(--primary);transform:translateX(-50%) rotate(45deg)}
.rep-riq .titolo{display:flex;align-items:center;gap:9px}
.rep-riq .titolo i{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;flex-shrink:0}
.rep-riq .titolo b{font-size:14.5px;font-weight:800;line-height:1.2}
.rep-riq .titolo small{display:block;font-size:11.5px;color:var(--fg-3);font-weight:600}
.rep-riq .frase{font-size:12.5px;color:var(--fg-2);line-height:1.45;min-height:36px}
.rep-riq .mini{height:96px;position:relative}
.rep-riq .mini canvas{width:100% !important;height:100% !important}
.rep-riq .vuoto-mini{display:flex;align-items:center;justify-content:center;gap:8px;font-size:12.5px;color:var(--accent);font-weight:700;background:var(--accent-soft);border-radius:12px}
.rep-riq .apri{font-size:12.5px;font-weight:700;color:var(--primary);display:flex;align-items:center;gap:4px;margin-top:auto}
.rep-riq .apri svg{transition:transform .18s}
.rep-riq:hover .apri svg{transform:translateX(3px)}
.rep-riq .num-grande{font-size:26px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1}
.rep-riq .nt2{font-size:12px;color:var(--fg-3);margin-top:4px}
.rep-riq .due{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:center}
/* pannello «focus» */
.rep-focus{background:var(--surface);border:1px solid var(--primary);border-radius:16px;box-shadow:var(--elev-3);padding:20px 22px;margin-bottom:16px;animation:entra .22s ease-out}
.rep-focus .testa{display:flex;align-items:flex-start;gap:12px;margin-bottom:14px}
.rep-focus .testa > i{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;flex-shrink:0}
.rep-focus h2{font-size:18px;font-weight:800}
.rep-focus .testa p{font-size:13px;color:var(--fg-2);margin-top:2px}
.rep-focus .chiudi{margin-left:auto;border:none;background:var(--bg);color:var(--fg-2);width:32px;height:32px;border-radius:9px;display:grid;place-items:center;flex-shrink:0;cursor:pointer}
.rep-focus .griglia{display:grid;grid-template-columns:1.6fr 1fr;gap:18px;align-items:start}
.rep-focus .griglia > div{min-width:0}
@media (max-width:1150px){.rep-focus .griglia{grid-template-columns:1fr}}
.rep-focus .lato{position:sticky;top:18px;display:flex;flex-direction:column;gap:14px}
.rep-focus h3{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--fg-3);margin-bottom:8px}
.rep-focus .graf-lato{height:220px;position:relative}
.rep-focus .graf-sopra{height:240px;position:relative;margin-bottom:14px}
.rep-focus .graf-lato canvas,.rep-focus .graf-sopra canvas{width:100% !important;height:100% !important}
.rep-focus .come{font-size:12px;color:var(--fg-3);line-height:1.5;padding-top:10px;border-top:1px dashed var(--border);margin-top:10px}
/* pezzi condivisi (tabelle, consigli, dati) */
.tab-rep td{vertical-align:middle}
.tab-rep td:first-child b{white-space:nowrap}
.tab-rep .mini{font-size:11.5px;color:var(--fg-3);font-weight:500}
.barra-rel{height:5px;border-radius:99px;background:var(--border-soft);margin-top:5px;overflow:hidden;max-width:220px}
[data-theme="dark"] .barra-rel{background:var(--surface-2)}
.barra-rel i{display:block;height:100%;border-radius:99px;transition:width .5s}
.rep-focus .riga-q .pct,.foglio .riga-q .pct{margin-left:auto}
.rep-focus .riga-q .pct + .imp,.foglio .riga-q .pct + .imp{margin-left:0;min-width:70px;text-align:right}
.nota-rep{font-size:12px;color:var(--fg-3);margin-top:10px;line-height:1.5}
.vuoto-rep{font-size:13px;color:var(--fg-3);padding:14px;background:var(--surface-2);border:1px dashed var(--border);border-radius:12px;line-height:1.5}
.consigli{display:flex;flex-direction:column;gap:8px}
.consiglio{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:12px;font-size:13px;line-height:1.45;background:var(--surface-2);border:1px solid var(--border-soft)}
.consiglio i{width:9px;height:9px;border-radius:99px;flex-shrink:0;margin-top:6px;background:var(--fg-3)}
.consiglio.tono-accent i{background:var(--accent)}.consiglio.tono-warn i{background:var(--warn)}.consiglio.tono-danger i{background:var(--danger)}
.griglia-3n{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media (max-width:900px){.griglia-3n{grid-template-columns:repeat(2,1fr)}}
.dato-rep{background:var(--surface-2);border:1px solid var(--border-soft);border-radius:12px;padding:12px 14px;min-width:0}
.dato-rep span{display:block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--fg-3)}
.dato-rep b{display:block;font-size:20px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;margin-top:2px}
.dato-rep small{display:block;font-size:11.5px;color:var(--fg-3);margin-top:2px}

/* ─── Resoconto: modale grande col foglio ─── */
.velo-resoconto{align-items:start;padding-top:18px}
.modale-resoconto{max-width:1180px;max-height:calc(100vh - 36px)}
.res-strumenti{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 0 14px;border-top:1px solid var(--border-soft);margin-top:14px}
.res-strumenti .nt{font-size:12.5px;color:var(--fg-3)}
.res-strumenti select.sel{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:8px 12px;font-family:inherit;font-size:13.5px;font-weight:600;color:var(--fg);min-width:220px}
.res-corpo{background:var(--bg);padding:20px 22px}
.res-lay{display:grid;grid-template-columns:1fr 220px;gap:20px;align-items:start}
@media (max-width:1000px){.res-lay{grid-template-columns:1fr}.res-sommario{display:none}}
.foglio{background:var(--surface);border:1px solid var(--border);border-radius:6px;box-shadow:var(--elev-3);padding:40px 46px 34px;min-width:0}
@media (max-width:900px){.foglio{padding:24px 20px}}
.foglio .intest{display:flex;align-items:flex-start;gap:16px;padding-bottom:20px;border-bottom:2px solid var(--fg);margin-bottom:24px}
.foglio .marca{width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,#2563EB,#3B82F6);display:grid;place-items:center;color:#fff;font-weight:800;font-size:19px;flex-shrink:0}
.foglio h1{font-size:25px;font-weight:800;letter-spacing:-.02em;line-height:1.15;margin:0}
.foglio .intest .sotto{font-size:13px;color:var(--fg-2);margin-top:3px}
.foglio .intest .meta{margin-left:auto;text-align:right;font-size:12px;color:var(--fg-3);line-height:1.6;flex-shrink:0}
.foglio .intest .meta b{color:var(--fg);display:block;font-size:13px}
.foglio .inbreve{background:var(--surface-2);border:1px solid var(--border);border-left:5px solid var(--primary);border-radius:12px;padding:18px 22px;margin-bottom:32px}
.foglio .inbreve h2{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--primary);margin-bottom:12px}
.foglio .num4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}
@media (max-width:900px){.foglio .num4{grid-template-columns:repeat(2,1fr)}}
.foglio .num4 b{display:block;font-size:24px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1.1}
.foglio .num4 span{font-size:11.5px;color:var(--fg-3);font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.foglio .num4 small{display:block;font-size:12px;color:var(--fg-2)}
.foglio .inbreve ul{list-style:none;display:flex;flex-direction:column;gap:6px;margin:0;padding:0}
.foglio .inbreve li{font-size:13.5px;line-height:1.5;display:flex;gap:10px;align-items:flex-start}
.foglio .inbreve li i{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;flex-shrink:0;font-style:normal;font-size:11px;font-weight:800;margin-top:1px}
.foglio .inbreve li a{color:inherit;text-decoration:none;border-bottom:1px dotted var(--fg-3)}
.foglio .inbreve li a:hover{color:var(--primary);border-color:var(--primary)}
.foglio .cap{margin-bottom:36px;scroll-margin-top:16px}
.foglio .cap .titolo{display:flex;align-items:center;gap:12px;margin-bottom:6px}
.foglio .cap .titolo i{width:30px;height:30px;border-radius:99px;background:var(--fg);color:var(--surface);display:grid;place-items:center;font-style:normal;font-weight:800;font-size:13px;flex-shrink:0}
.foglio .cap h2{font-size:19px;font-weight:800;letter-spacing:-.01em;margin:0}
.foglio .cap .testo{font-size:14px;line-height:1.6;color:var(--fg-2);margin:8px 0 14px;max-width:760px}
.foglio .cap .testo b{color:var(--fg)}
.foglio .graf{height:230px;position:relative;margin:6px 0 16px}
.foglio .graf canvas{width:100% !important;height:100% !important}
.foglio .did{font-size:11.5px;color:var(--fg-3);margin-top:-8px;margin-bottom:14px;font-style:italic}
.foglio .affianco{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
.foglio .affianco > div{min-width:0}
@media (max-width:900px){.foglio .affianco{grid-template-columns:1fr}}
.foglio h4{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--fg-3);margin:12px 0 6px}
.foglio .conf{margin-top:14px}
.foglio td{padding:9px 7px;font-size:13px}.foglio th{padding:7px 7px;font-size:11px}
.foglio .piede-foglio{border-top:1px solid var(--border);padding-top:14px;font-size:11.5px;color:var(--fg-3);display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}
.res-sommario{position:sticky;top:0}
.res-sommario .card{padding:14px 16px}
.res-sommario h3{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.07em;color:var(--fg-3);margin-bottom:8px}
.res-sommario a{display:flex;align-items:center;gap:9px;padding:6px 4px;font-size:13px;color:var(--fg-2);text-decoration:none;border-radius:8px}
.res-sommario a:hover{background:var(--bg);color:var(--fg)}
.res-sommario a.on{color:var(--primary);font-weight:700}
.res-sommario a i{width:20px;height:20px;border-radius:99px;background:var(--border-soft);display:grid;place-items:center;font-style:normal;font-size:10.5px;font-weight:800;flex-shrink:0}
.res-sommario a.on i{background:var(--primary-soft);color:var(--primary)}
@media print{
  body.stampa-resoconto .layout,body.stampa-resoconto .tk-layout,body.stampa-resoconto .toasts{display:none !important}
  .velo-resoconto{position:static;padding:0;background:transparent;display:block}
  .modale-resoconto{max-width:none;max-height:none;box-shadow:none;border:none;overflow:visible}
  .modale-resoconto .mm-testa,.res-sommario{display:none !important}
  .res-corpo{padding:0;background:#fff;overflow:visible}
  .res-lay{grid-template-columns:1fr}
  .foglio{border:none;box-shadow:none;padding:0}
  .foglio .cap{break-inside:avoid}
}

/* ═══════════ vista IMPOSTAZIONI — «Pannello» (demo impostazioni-pannello.html): menù a sinistra, sezione a destra ═══════════ */
.imp-lay{display:grid;grid-template-columns:300px 1fr;gap:18px;align-items:start}
.imp-lay > div{min-width:0}
@media (max-width:1000px){.imp-lay{grid-template-columns:1fr}}
.imp-menu{position:sticky;top:18px;display:flex;flex-direction:column;gap:6px}
.imp-voce{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:11px 13px;cursor:pointer;display:flex;gap:11px;align-items:flex-start;box-shadow:var(--elev-1);position:relative;
  transition:transform .15s,border-color .15s,box-shadow .15s,background .25s;animation:entra .3s ease-out backwards}
.imp-voce:hover{transform:translateX(3px);border-color:var(--primary)}
.imp-voce.on{border-color:var(--primary);box-shadow:var(--elev-3)}
.imp-voce.on::before{content:"";position:absolute;left:-1px;top:12px;bottom:12px;width:3px;border-radius:0 3px 3px 0;background:var(--primary)}
.imp-voce i.ic{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;flex-shrink:0}
.imp-voce .tx{min-width:0;flex:1}
.imp-voce b{font-size:13.5px;font-weight:800;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.imp-voce .st{font-size:11.5px;color:var(--fg-3);line-height:1.4;margin-top:2px;display:flex;gap:6px;align-items:flex-start}
.imp-voce .st i{width:7px;height:7px;border-radius:99px;flex-shrink:0;margin-top:5px;background:var(--accent)}
.imp-voce .st i.no{background:var(--warn)}
.lucchetto{font-size:10px;font-weight:800;color:var(--viola);background:var(--viola-soft);border-radius:99px;padding:1px 7px;white-space:nowrap;margin-left:auto}
.imp-pagina{background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:var(--elev-2);padding:22px 24px;min-width:0;animation:entra .22s ease-out}
.imp-pagina .intest{display:flex;align-items:center;gap:12px;margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid var(--border-soft)}
.imp-pagina .intest i.ic{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;flex-shrink:0}
.imp-pagina h2{font-size:19px;font-weight:800;letter-spacing:-.01em}
.imp-pagina .intest p{font-size:13px;color:var(--fg-3);margin-top:2px}
.avviso-titolare{border-left:4px solid var(--viola);padding:12px 16px;font-size:13px;margin-bottom:14px}
.testa-sez{display:flex;align-items:flex-start;gap:14px;margin-bottom:14px;flex-wrap:wrap}
.testa-sez p{flex:1;min-width:260px;font-size:13px;line-height:1.5}
.testa-sez .chip{margin-top:4px}
.imp-pagina .nt,.modale .nt,.tkm .nt{font-size:12.5px;color:var(--fg-3)}
.griglia-campi{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.azioni-form{display:flex;align-items:center;gap:10px;margin-top:4px;flex-wrap:wrap}
.spunta{display:flex;gap:8px;align-items:center;font-size:13.5px;margin-bottom:12px}
/* blocchi con righe (listino, accessori) */
.blocco-imp{border:1px solid var(--border);border-radius:14px;overflow:hidden;background:var(--surface);box-shadow:var(--elev-1);margin-bottom:14px}
.blocco-imp.pad{padding:16px 18px}
.int-blocco{padding:9px 16px;background:var(--surface-2);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--fg-2);border-bottom:1px solid var(--border-soft);display:flex;gap:10px;align-items:baseline}
.int-blocco.nudo{padding:0 0 8px;background:transparent;border:none}
.int-blocco .nt{text-transform:none;letter-spacing:0;font-weight:600}
.rl{display:grid;grid-template-columns:1.5fr 170px 1.4fr 110px auto;gap:14px;align-items:center;padding:11px 16px;border-bottom:1px solid var(--border-soft);transition:background .13s}
.rl:last-child{border-bottom:none}
.rl:hover{background:var(--surface-2)}
.rl.senza{background:var(--warn-soft)}
[data-theme="dark"] .rl.senza{background:rgba(251,191,36,.06)}
.rl .chi{min-width:0}
.rl .chi b{font-size:14px;font-weight:700;display:block;line-height:1.3}
.rl .chi span{font-size:11.5px;color:var(--fg-3);display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rl .prezzo b{font-size:15px;font-weight:800;font-variant-numeric:tabular-nums}
.rl .prezzo small{font-size:11.5px;color:var(--fg-3);font-weight:600}
.rl .extra{font-size:12.5px;color:var(--fg-2)}
.rl .quando{font-size:12px;color:var(--fg-3);white-space:nowrap}
.rl .az{display:flex;gap:6px;justify-content:flex-end}
/* il listino vive nella colonna destra di .imp-lay (menù 300 px): fra 1250 e 1400 px le colonne fisse mangiavano tutto e il modello restava a 22 px */
@media (max-width:1400px){.rl{grid-template-columns:1.5fr 170px auto}.rl .extra,.rl .quando{display:none}}
.btn-riga.rosso{background:var(--danger-soft);color:var(--danger)}
/* utenti */
.elenco-ru{border:1px solid var(--border);border-radius:14px;overflow:hidden;background:var(--surface);box-shadow:var(--elev-1)}
.ru{display:grid;grid-template-columns:40px 1.6fr 130px 150px auto;gap:14px;align-items:center;padding:11px 16px;border-bottom:1px solid var(--border-soft);transition:background .13s}
.ru:last-child{border-bottom:none}
.ru:hover{background:var(--surface-2)}
.ru.spento{opacity:.6}
.ru .iniz{width:40px;height:40px;border-radius:12px}
.ico-neutro{background:var(--border-soft);color:var(--fg-2)}
[data-theme="dark"] .ico-neutro{background:var(--surface-2)}
.ru .chi{min-width:0}
.ru .chi b{font-size:14px;font-weight:700;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.ru .chi span{font-size:11.5px;color:var(--fg-3);display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ru .quando{font-size:12px;color:var(--fg-3)}
.ru .quando b{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.04em;font-weight:700}
.ru .az{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap}
@media (max-width:1250px){.ru{grid-template-columns:40px 1.6fr 130px auto}.ru .quando{display:none}}
.scelta-ruolo{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.blocco-ruolo{border:1.5px solid var(--border);border-radius:12px;padding:10px 12px;cursor:pointer;display:block}
.blocco-ruolo input{display:none}
.blocco-ruolo b{display:block;font-size:13.5px}
.blocco-ruolo span{font-size:11.5px;color:var(--fg-3);line-height:1.4}
.blocco-ruolo.on{border-color:var(--primary);background:var(--primary-soft)}
.campi-pw{grid-template-columns:1fr 120px}
/* dati e ambiente */
.due-col-imp{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
.due-col-imp > div{min-width:0}
@media (max-width:1000px){.due-col-imp{grid-template-columns:1fr}}
.log-rigenera{background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:14px;font-size:12px;line-height:1.6;overflow-x:auto;margin-top:12px;max-height:320px}
.canali{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:10px}
.canali .chip{font-size:12px;padding:4px 10px;display:inline-flex;align-items:center;gap:6px}
.canali .chip.spento{opacity:.5;text-decoration:line-through}
.canali .x-canale{border:none;background:transparent;color:var(--fg-3);cursor:pointer;font-size:12px;padding:0 2px;line-height:1}
.canali .x-canale:hover{color:var(--danger)}
.imp-pagina .lnk{font-size:12px;font-weight:700;margin-left:6px}

/* ═══════════ NAVBAR — scheda utente in fondo alla sidebar + menù account (demo navbar-rinnovata.html, solo questo pezzo) ═══════════ */
.utente-nav{display:flex;align-items:center;gap:10px;padding:8px 8px;border-radius:12px;cursor:pointer;border:1px solid transparent;background:transparent;width:100%;text-align:left;font-family:inherit;color:var(--fg);margin-top:6px}
.utente-nav:hover{background:var(--bg);border-color:var(--border)}
.utente-nav .iniz{width:36px;height:36px;border-radius:11px;font-size:13px}
.utente-nav .tx{min-width:0;flex:1}
.utente-nav .tx b{font-size:13.5px;display:block;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.utente-nav .tx span{font-size:11.5px;color:var(--fg-3);display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.utente-nav > svg{color:var(--fg-3);flex-shrink:0}
.pop-utente{position:fixed;z-index:650;background:var(--surface);border:1px solid var(--border);border-radius:14px;box-shadow:var(--elev-3);width:280px;overflow:hidden;animation:entra .15s ease-out}
.pop-utente .pop-testa{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--border-soft)}
.pop-utente .pop-testa .iniz{width:34px;height:34px;border-radius:10px;font-size:12px}
.pop-utente .pop-testa b{font-size:13.5px;display:block}
.pop-utente .pop-testa span{font-size:11.5px;color:var(--fg-3);display:block}
.pop-utente .pop-riga{display:flex;align-items:center;gap:10px;padding:10px 14px;font-size:13px;font-weight:600;color:var(--fg-2);cursor:pointer;border:none;border-bottom:1px solid var(--border-soft);background:transparent;width:100%;text-align:left;font-family:inherit}
.pop-utente .pop-riga:hover{background:var(--surface-2);color:var(--fg)}
.pop-utente .pop-riga.tema{cursor:default;color:var(--fg-2)}
.pop-utente .pop-riga.tema:hover{background:transparent}
.pop-utente .pop-riga.rosso{color:var(--danger);font-weight:700}
.pop-utente .pop-piede{padding:8px 14px;font-size:11.5px;color:var(--fg-3);background:var(--surface-2)}

/* ═══════════ NOTE DEGLI OPERATORI — pannello laterale a conversazione (demo note-conversazione.html) ═══════════ */
/* riga dell'elenco: «💬 3» dopo il codice, rosso se ci sono note nuove per me */
.rg .chi .n-note{display:inline-flex;align-items:center;gap:3px;font-weight:700;color:var(--fg-3);vertical-align:-1px}
.rg .chi .n-note svg{width:12px;height:12px}
.rg .chi .n-note.nuove{color:var(--danger)}
/* copertina: pulsante col numero + bollino, banda della nota fissata, ultima nota in una riga */
.btn-note{position:relative;background:var(--surface-2);color:var(--fg);border:1px solid var(--border)}
.btn-note .nuove{position:absolute;top:-7px;right:-7px;background:var(--danger);color:#fff;font-size:10.5px;font-weight:800;padding:1px 6px;border-radius:99px;box-shadow:0 0 0 2px var(--surface)}
[data-theme="dark"] .btn-note .nuove{color:#1A0505}
.fissata-band{margin-top:14px;background:var(--warn-soft);border-left:3px solid var(--warn);border-radius:0 11px 11px 0;
  padding:10px 14px;display:flex;gap:10px;align-items:flex-start;font-size:13px;line-height:1.45;cursor:pointer;white-space:pre-line}
.fissata-band .ico{color:var(--warn);flex-shrink:0;margin-top:1px}
.fissata-band b.et{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--warn);margin-bottom:2px}
.fissata-band small{display:block;font-size:11.5px;color:var(--fg-3);margin-top:3px}
.ultima-nota{margin-top:14px;display:flex;gap:10px;align-items:flex-start;background:var(--surface-2);border:1px solid var(--border-soft);border-radius:12px;padding:10px 13px;cursor:pointer;transition:border-color .15s}
.ultima-nota:hover,.ultima-nota:focus-visible{border-color:var(--primary);outline:none}
[data-theme="dark"] .ultima-nota{background:var(--bg)}
.ultima-nota .et{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--fg-3);margin-bottom:2px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.ultima-nota .t{font-size:13px;line-height:1.45;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;white-space:pre-line}
.ultima-nota .apri{margin-left:auto;font-size:12.5px;font-weight:700;color:var(--primary);white-space:nowrap;align-self:center}
/* pezzi comuni */
.avatar-nota{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;font-weight:800;font-size:12px;flex-shrink:0;letter-spacing:.02em}
.avatar-nota.piccolo{width:24px;height:24px;border-radius:8px;font-size:10px}
.chi-nota{display:flex;align-items:baseline;gap:7px;flex-wrap:wrap;font-size:12.5px}
.chi-nota b{font-weight:800;font-size:13px}
.chi-nota .tu{font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--primary);background:var(--primary-soft);padding:0 6px;border-radius:99px}
.chi-nota .quando{color:var(--fg-3)}
.chi-nota .quando b{font-weight:600;color:var(--fg-2)}
.testo-nota{font-size:13.5px;line-height:1.5;white-space:pre-line;word-break:break-word;margin-top:3px}
.fissata-tag{display:inline-flex;align-items:center;gap:4px;font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--warn);background:var(--warn-soft);padding:1px 7px;border-radius:99px}
.az-nota{display:flex;gap:2px;opacity:0;transition:opacity .15s}
.az-nota button{border:none;background:transparent;color:var(--fg-3);cursor:pointer;width:24px;height:24px;border-radius:7px;display:grid;place-items:center;font-family:inherit}
.az-nota button:hover{background:var(--border-soft);color:var(--fg)}
[data-theme="dark"] .az-nota button:hover{background:var(--surface-2)}
.az-nota button.on{color:var(--warn)}
.vuoto-note{font-size:13px;color:var(--fg-3);padding:40px 10px;text-align:center;line-height:1.5}
/* pannello */
.velo-note{position:fixed;inset:0;background:rgba(8,15,30,.35);z-index:440;opacity:0;pointer-events:none;transition:opacity .2s}
.velo-note.on{opacity:1;pointer-events:auto}
.pannello-note{position:fixed;top:0;right:0;bottom:0;width:min(460px,100vw);background:var(--surface);border-left:1px solid var(--border);
  box-shadow:-18px 0 50px rgba(0,0,0,.18);z-index:441;display:flex;flex-direction:column;transform:translateX(100%);transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.pannello-note.on{transform:none}
.pan-testa{display:flex;align-items:center;gap:10px;padding:16px 18px;border-bottom:1px solid var(--border-soft)}
.pan-testa h3{font-size:16px;font-weight:800;display:flex;align-items:center;gap:8px;margin:0}
.pan-testa .sub{font-size:12px;color:var(--fg-3)}
.pan-testa .chiudi{margin-left:auto;border:1px solid var(--border);background:var(--surface);color:var(--fg-2);width:32px;height:32px;border-radius:9px;display:grid;place-items:center;cursor:pointer;flex-shrink:0}
.pan-testa .chiudi:hover{color:var(--fg);border-color:var(--fg-3)}
.pan-corpo{flex:1;overflow-y:auto;padding:16px 18px;display:flex;flex-direction:column;gap:12px;background:var(--bg)}
.msg{display:flex;gap:9px;align-items:flex-end;max-width:92%}
.msg.mia{align-self:flex-end;flex-direction:row-reverse}
.msg .bolla{background:var(--surface);border:1px solid var(--border);border-radius:14px 14px 14px 4px;padding:9px 12px;box-shadow:var(--elev-1);position:relative;min-width:0}
.msg.mia .bolla{background:var(--primary);color:#fff;border-color:transparent;border-radius:14px 14px 4px 14px}
[data-theme="dark"] .msg.mia .bolla{color:#08101F}
.msg.fissata .bolla{background:var(--warn-soft);border-color:transparent}
.msg.mia.fissata .bolla{background:var(--warn-soft);color:var(--fg)}
.msg .bolla .chi-nota{margin-bottom:2px}
.msg.mia .bolla .chi-nota b,.msg.mia .bolla .chi-nota .quando b,.msg.mia .bolla .chi-nota .quando{color:inherit;opacity:.9}
.msg.mia.fissata .bolla .chi-nota b,.msg.mia.fissata .bolla .chi-nota .quando b{color:var(--fg);opacity:1}
.msg.mia .bolla .chi-nota .tu{background:rgba(255,255,255,.22);color:#fff}
[data-theme="dark"] .msg.mia .bolla .chi-nota .tu{color:#08101F;background:rgba(8,16,31,.18)}
.msg.mia.fissata .bolla .chi-nota .tu{background:var(--primary-soft);color:var(--primary)}
.msg .testo-nota{font-size:13.5px;margin-top:2px}
.msg .az-nota{position:absolute;top:-12px;right:8px;background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:1px;box-shadow:var(--elev-1)}
.msg.mia .az-nota{right:auto;left:8px}
.msg:hover .az-nota,.msg:focus-within .az-nota{opacity:1}
.sep-nuove{display:flex;align-items:center;gap:10px;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--danger)}
.sep-nuove::before,.sep-nuove::after{content:'';flex:1;height:1px;background:var(--danger);opacity:.4}
.sep-data{text-align:center;font-size:11px;font-weight:700;color:var(--fg-3);text-transform:uppercase;letter-spacing:.06em;padding:4px 0}
.pan-scrivi{border-top:1px solid var(--border-soft);padding:12px 18px 14px;background:var(--surface)}
.scrivi-nota{display:flex;gap:10px;align-items:flex-start}
.scrivi-nota textarea{flex:1;width:100%;min-height:44px;max-height:220px;resize:none;background:var(--bg);border:1px solid var(--border);
  border-radius:11px;padding:10px 12px;font-family:inherit;font-size:13.5px;line-height:1.45;color:var(--fg);outline:none;transition:border-color .15s,box-shadow .15s}
.scrivi-nota textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}
.scrivi-nota textarea::placeholder{color:var(--fg-3)}
.scrivi-nota .btn-invia{width:44px;height:44px;border-radius:12px;padding:0;flex-shrink:0}
.scrivi-piede{display:flex;align-items:center;gap:10px;margin-top:8px;font-size:12px;color:var(--fg-3);flex-wrap:wrap}
.scrivi-piede label{display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-weight:600;color:var(--fg-2)}
.scrivi-piede label input{accent-color:var(--warn)}
@media print{.velo-note,.pannello-note{display:none}}

/* ═══════════ «Registra incasso» con vendite extra (demo incasso-extra.html, variante B «Righe libere») ═══════════ */
/* «Come»: griglia 3×2 con iconcina, etichette su una riga — prima era una fila che sbordava dalla modale */
.scelta-griglia{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.scelta-griglia .scelta-blocchetto{padding:9px 6px;font-size:13px;white-space:nowrap;display:flex;align-items:center;justify-content:center;gap:6px}
.scelta-griglia .scelta-blocchetto svg{flex-shrink:0}
/* riga di controllo sotto l'importo: Saldo + extra = entrato ✓ */
.somma-ci{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:12.5px;color:var(--fg-3);margin:-8px 0 14px;min-height:0}
.somma-ci:empty{display:none}
.somma-ci b{font-variant-numeric:tabular-nums;color:var(--fg)}
.somma-ci .ok{color:var(--accent);font-weight:700}
.somma-ci .warn{color:var(--warn);font-weight:700}
/* riquadro vendite extra */
.extra-ci{border:1px dashed var(--border);border-radius:12px;padding:12px 14px;margin-bottom:16px}
.extra-ci:empty{display:none}
.extra-ci .et{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--fg-2);flex-wrap:wrap}
.extra-ci .et .nt{font-weight:500;color:var(--fg-3);font-size:12px}
.extra-ci .tog-btn{margin-left:auto}
.tog-btn{border:1px solid var(--border);background:var(--surface);color:var(--fg-2);font-family:inherit;font-weight:700;font-size:12.5px;border-radius:99px;padding:5px 11px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.tog-btn:hover{border-color:var(--accent);color:var(--accent)}
.tog-btn.on{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}
.righe-extra{margin-top:10px;display:flex;flex-direction:column;gap:6px}
.riga-extra{display:grid;grid-template-columns:1fr 92px 28px;gap:8px;align-items:center}
.riga-extra input{width:100%;background:var(--bg);border:1px solid var(--border);border-radius:9px;padding:7px 10px;font-family:inherit;font-size:13px;color:var(--fg)}
.riga-extra input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}
.riga-extra input.imp{text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
.riga-extra .x{border:none;background:transparent;color:var(--fg-3);cursor:pointer;width:28px;height:28px;border-radius:7px;display:grid;place-items:center}
.riga-extra .x:hover{background:var(--danger-soft);color:var(--danger)}
.aggiungi-riga{border:none;background:transparent;color:var(--primary);font-family:inherit;font-weight:700;font-size:12.5px;cursor:pointer;padding:6px 0;text-align:left}
.aggiungi-riga:hover{text-decoration:underline}
.tot-extra{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;color:var(--fg-3);margin-top:8px;padding-top:8px;border-top:1px solid var(--border-soft)}
.tot-extra b{color:var(--accent);font-variant-numeric:tabular-nums;white-space:nowrap}