/* LMC — Load Manager Consumption · Moesa Energia
   Interfaccia: pulita, moderna, energia (teal/emerald + navy). */
:root{
  --navy:#0a1c2e; --navy-2:#0f2940; --navy-3:#1a4063;
  --teal:#0fb0a3; --teal-d:#0a8478; --emerald:#1ea552;
  --ink:#13212e; --ink-2:#3a4d5c; --muted:#566a7a; --line:#e2e9f0; --line-2:#eef3f8;
  --bg:#f2f5f9; --card:#ffffff;
  --amber:#c87f08; --red:#d63a3a; --pos:#0b8458;
  --sh:0 1px 2px rgba(13,38,59,.05),0 10px 30px rgba(13,38,59,.07);
  --sh-sm:0 1px 3px rgba(13,38,59,.10);
  --r:14px; --r-sm:10px;
  --font-sans:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --font-head:'Space Grotesk','Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:var(--font-sans);
  color:var(--ink); background:var(--bg); font-size:14.5px; line-height:1.55; -webkit-font-smoothing:antialiased;
}
a{color:var(--teal-d);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{margin:0;font-family:var(--font-head);font-weight:700;letter-spacing:-.02em}
code{background:var(--line-2);padding:1px 6px;border-radius:6px;font-size:.86em}
.muted{color:var(--muted)}
.small{font-size:12.5px}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.r{text-align:right}

/* ---------- layout ---------- */
.app{display:flex;min-height:100vh}
.sidebar{
  width:248px;flex-shrink:0;background:linear-gradient(180deg,var(--navy),var(--navy-2));
  color:#dCE7f1;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;
}
.brand{display:flex;align-items:center;gap:12px;padding:20px 20px 18px;border-bottom:1px solid rgba(255,255,255,.07)}
.brand-mark{
  width:42px;height:42px;border-radius:11px;display:grid;place-items:center;font-size:22px;
  background:linear-gradient(140deg,var(--teal),var(--emerald));box-shadow:0 6px 16px rgba(16,182,168,.4)
}
.brand-mark.big{width:62px;height:62px;font-size:32px;margin:0 auto}
.brand-txt{display:flex;flex-direction:column;line-height:1.15}
.brand-txt strong{font-family:var(--font-head);font-weight:700;font-size:20px;color:#fff;letter-spacing:.02em}
.brand-txt span{font-size:11.5px;color:#8fb0cc;text-transform:uppercase;letter-spacing:.12em}
.nav{display:flex;flex-direction:column;gap:3px;padding:14px 12px;flex:1;min-height:0;overflow-y:auto}
.nav-item{
  display:flex;align-items:center;gap:11px;padding:11px 13px;border-radius:10px;color:#bdd2e6;
  font-weight:600;font-size:14px;transition:.15s
}
.nav-item:hover{background:rgba(255,255,255,.06);color:#fff;text-decoration:none}
.nav-item.attivo{background:linear-gradient(120deg,rgba(16,182,168,.22),rgba(34,197,94,.16));color:#fff;box-shadow:inset 0 0 0 1px rgba(16,182,168,.35)}
.nav-ico{width:22px;text-align:center;font-size:16px;opacity:.95}
.sidebar-foot{padding:14px;border-top:1px solid rgba(255,255,255,.07);display:flex;flex-direction:column;gap:10px}
.me{display:flex;align-items:center;gap:10px}
.me-dot{width:9px;height:9px;border-radius:50%;background:var(--emerald);box-shadow:0 0 0 3px rgba(34,197,94,.2)}
.me div{display:flex;flex-direction:column;line-height:1.1}
.me strong{color:#fff;font-size:13px}.me span{color:#8fb0cc;font-size:11px}
.btn-esci{text-align:center;padding:8px;border-radius:9px;background:rgba(255,255,255,.07);color:#cfe0ef;font-weight:600;font-size:13px}
.btn-esci:hover{background:rgba(239,68,68,.85);color:#fff;text-decoration:none}

.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:22px 30px;background:var(--card);border-bottom:1px solid var(--line)
}
.topbar h1{font-size:21px}
.topbar-sub{margin:2px 0 0;color:var(--muted);font-size:13px}
.content{padding:24px 30px;flex:1}
.footer{padding:16px 30px;color:var(--muted);font-size:12.5px;border-top:1px solid var(--line)}

/* ---------- card ---------- */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:20px;margin-bottom:20px}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.card-head h2{font-size:16px}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media(max-width:900px){.grid-2{grid-template-columns:1fr}}
.link{font-weight:600;font-size:13px}

/* ---------- KPI ---------- */
.kpi-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px}
@media(max-width:900px){.kpi-row{grid-template-columns:1fr 1fr}}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px;display:flex;align-items:center;gap:14px;box-shadow:var(--sh)}
.kpi-ico{
  width:46px;height:46px;border-radius:12px;display:grid;place-items:center;font-size:21px;flex-shrink:0;
  background:linear-gradient(140deg,rgba(16,182,168,.16),rgba(34,197,94,.14));color:var(--teal-d)
}
.kpi-num{font-family:var(--font-head);font-size:26px;font-weight:700;letter-spacing:-.02em;line-height:1.05;color:var(--ink)}
.kpi-sub{font-size:16px;font-weight:600;color:var(--muted)}
.kpi-lbl{color:var(--muted);font-size:12.5px;margin-top:3px}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:10px;font-weight:700;font-size:14px;border:1px solid transparent;cursor:pointer;transition:.15s}
.btn:hover{text-decoration:none;transform:translateY(-1px)}
.btn-primary{background:linear-gradient(120deg,var(--teal),var(--teal-d));color:#fff;box-shadow:0 6px 16px rgba(16,182,168,.32)}
.btn-primary:hover{box-shadow:0 8px 22px rgba(16,182,168,.42)}
.btn-ghost{background:#fff;border-color:var(--line);color:var(--ink)}
.btn-ghost:hover{border-color:var(--teal);color:var(--teal-d)}
.as-azioni{white-space:nowrap}
.as-azioni>*{vertical-align:middle}
.as-azioni .menu-dl{display:inline-block;margin-right:6px}
.btn-danger{background:#fff;border-color:#f0bfbf;color:#b42318}
.btn-danger:hover{background:#b42318;border-color:#b42318;color:#fff}
.btn-block{width:100%;justify-content:center;margin-top:6px}
.btn-icon{background:none;border:1px solid var(--line);width:32px;height:32px;border-radius:8px;cursor:pointer;font-size:14px;display:inline-grid;place-items:center;color:var(--muted);text-decoration:none}
.btn-icon:hover{border-color:var(--red);color:var(--red);text-decoration:none}
.inline{display:inline}

/* ---------- flash ---------- */
.flash{padding:12px 16px;border-radius:11px;margin-bottom:16px;font-weight:600;font-size:13.5px;border:1px solid}
.flash-ok{background:#e9f9f1;border-color:#bfead4;color:#0f7a4f}
.flash-err{background:#fdecec;border-color:#f6c6c6;color:#b42318}
.flash-warn{background:#fef6e7;border-color:#f7e0ad;color:#9a6700}
.flash-info{background:#eef5fb;border-color:#cfe0ef;color:#0a5d8f}

/* ---------- tables ---------- */
.tab-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-sm)}
.tab{width:100%;border-collapse:collapse;font-size:13.5px}
.tab th{background:var(--line-2);text-align:left;padding:11px 14px;font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700;white-space:nowrap}
.tab td{padding:11px 14px;border-top:1px solid var(--line)}
.tab tbody tr:hover{background:#fafcfe}
.tab tr.in-edit{background:#eafaf6}
.tab .pos{color:var(--pos);font-weight:700}
.azioni{display:flex;gap:6px;white-space:nowrap}
.azioni-dl{display:flex;gap:6px;flex-wrap:wrap}

/* ---------- chips / badges ---------- */
.badge{display:inline-block;background:rgba(16,182,168,.12);color:var(--teal-d);font-size:11px;font-weight:700;padding:2px 9px;border-radius:99px;vertical-align:middle;text-transform:uppercase;letter-spacing:.04em}
.chip{display:inline-block;background:var(--line-2);border:1px solid var(--line);border-radius:8px;padding:3px 9px;font-size:12px;font-weight:600;margin:2px 3px 2px 0}
.chip.vuoto{color:var(--muted);font-style:italic;background:none}
.chip-imp{background:#faf7ff;border-color:#e6dcfb;color:#7c3aed}
.riga-com{padding:12px 0;border-top:1px solid var(--line-2)}
.riga-com:first-of-type{border-top:none}
.membri-chip{margin-top:7px}
.badge-cle{background:rgba(139,92,246,.14);color:#7c3aed}
.cle-list{display:flex;flex-direction:column;gap:2px;margin-top:6px}
.cle-row{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:12px;padding:11px 0;border-top:1px solid var(--line-2)}
.cle-row .membri-chip{margin:0}
.head-azioni{display:flex;align-items:center;gap:8px}
.cle-assegna select{padding:6px 10px;font-size:12.5px;border-radius:8px;background:#faf7ff;border-color:#e6dcfb;font-weight:600;color:#7c3aed}
.nota-eredita{margin:-4px 0 12px;color:#7c3aed;font-size:12.5px;background:#faf7ff;border:1px solid #ece3fd;padding:8px 12px;border-radius:9px}

/* ---------- forms ---------- */
label{display:flex;flex-direction:column;gap:6px;font-size:12.5px;font-weight:600;color:#33495c}
input,select{
  font:inherit;padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink);width:100%;transition:.15s
}
input:focus,select:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px rgba(16,182,168,.15)}
input[readonly]{background:var(--line-2);color:var(--muted)}
.form-inline{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap}
.form-inline .grow{flex:1;min-width:180px}
.form-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.form-grid .col-2{grid-column:span 2}.form-grid .col-4{grid-column:span 4}
@media(max-width:780px){.form-grid{grid-template-columns:1fr 1fr}.form-grid .col-2,.form-grid .col-4{grid-column:span 2}}
.sub-sezione{font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;border-top:1px dashed var(--line);padding-top:14px;margin-top:4px}
.req{font-style:normal;font-size:10px;font-weight:800;color:var(--amber);text-transform:uppercase;letter-spacing:.04em;background:#fef6e7;padding:1px 6px;border-radius:5px;vertical-align:middle}
.form-azioni{display:flex;justify-content:flex-end;gap:10px}

/* ---------- upload ---------- */
.form-up{display:flex;flex-direction:column;gap:14px}
.drop{
  position:relative;border:2px dashed var(--line);border-radius:12px;padding:18px;display:flex;flex-direction:column;align-items:center;
  text-align:center;gap:3px;cursor:pointer;transition:.15s;background:#fbfdff
}
.drop:hover{border-color:var(--teal);background:#f3fcfa}
.drop input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer}
.drop-ico{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;font-size:20px;background:linear-gradient(140deg,var(--teal),var(--emerald));color:#fff}
.drop-t{font-weight:700;font-size:14px}.drop-t em{color:var(--teal-d);font-style:normal;font-weight:700}
.drop-s{color:var(--ink-2);font-size:12.5px;line-height:1.45}
.drop.has-file{border-style:solid;border-color:var(--emerald);background:#f0fdf6}
.drop-file{margin-top:8px;font-size:12.5px;color:var(--pos);line-height:1.5;word-break:break-all}
.drop-file strong{color:var(--ink);font-weight:700}
/* barra di avanzamento upload */
.up-progress{margin-top:12px}
.up-track{height:22px;background:var(--line-2);border:1px solid var(--line);border-radius:99px;overflow:hidden}
.up-fill{height:100%;width:0;border-radius:99px;background:linear-gradient(120deg,var(--teal),var(--teal-d));
  color:#fff;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:flex-end;padding-right:8px;transition:width .15s ease;min-width:24px}
/* .up-fill.elaborazione: animata come "corrente elettrica" nel blocco in fondo */
.up-label{margin-top:7px;font-size:12.5px;font-weight:600;color:#33495c;text-align:center}
/* filtro "cosa elaborare" */
.filtro-wrap{margin-top:2px}
.btn-filtra{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:11px 14px;border:1px solid var(--line);border-radius:10px;background:#fbfdff;cursor:pointer;
  font:inherit;font-weight:700;font-size:13.5px;color:var(--ink)}
.btn-filtra:hover{border-color:var(--teal)}
.btn-filtra.aperto{border-color:var(--teal);background:#f1fbf9}
.filtro{margin-top:10px;border:1px solid var(--line);border-radius:11px;padding:12px;background:#fbfdff}
.filtro-cerca{width:100%;margin-bottom:10px}
.filtro-tutti{flex-direction:row;align-items:center;gap:8px;font-weight:600;color:var(--ink);
  padding-bottom:9px;border-bottom:1px solid var(--line-2);margin-bottom:8px}
.filtro-lista{display:flex;flex-direction:column;gap:2px;max-height:230px;overflow-y:auto}
.filtro-lista.disabilitata{opacity:.45;pointer-events:none}
.filtro-item{flex-direction:row;align-items:center;gap:9px;padding:7px 8px;border-radius:8px;
  font-weight:600;color:var(--ink);cursor:pointer}
.filtro-item:hover{background:var(--line-2)}
.filtro input[type=checkbox]{width:16px;height:16px;accent-color:var(--teal-d);flex-shrink:0}
.filtro-tutti input[type=checkbox]{width:17px;height:17px;accent-color:var(--teal-d)}

.lista-out{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px}
.lista-out li{display:flex;gap:12px;align-items:flex-start}
.lista-out div{display:flex;flex-direction:column}
.lista-out strong{font-size:13.5px}.lista-out div span{color:var(--ink-2);font-size:12.5px}
.pill{display:inline-flex;align-items:center;font-size:11px;font-weight:800;padding:2px 9px;border-radius:999px;letter-spacing:.03em;white-space:nowrap;text-transform:uppercase;border:1px solid transparent;line-height:1.55}
.pill-1{background:rgba(10,132,120,.12);color:#08726a;border-color:rgba(10,132,120,.26)}
.pill-2{background:rgba(37,99,235,.12);color:#1d4ed8;border-color:rgba(37,99,235,.26)}
.pill-3{background:rgba(21,128,61,.14);color:#15803d;border-color:rgba(21,128,61,.28)}
.pill-4{background:rgba(79,70,229,.12);color:#4338ca;border-color:rgba(79,70,229,.26)}
.pill-cle{background:rgba(124,58,237,.13);color:#6d28d9;border-color:rgba(124,58,237,.28)}

/* download buttons */
.dl-row{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.dl{display:inline-flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--line);border-radius:11px;padding:11px 15px;font-weight:700;font-size:13.5px;color:var(--ink)}
.dl:hover{border-color:var(--teal);text-decoration:none;transform:translateY(-1px);box-shadow:var(--sh-sm)}
.tag-dl{display:inline-block;background:rgba(16,182,168,.12);color:var(--teal-d);border-radius:7px;padding:4px 9px;font-size:11.5px;font-weight:700}
.tag-dl:hover{background:var(--teal);color:#fff;text-decoration:none}
.tag-dl.ghost{background:var(--line-2);color:var(--muted)}
.tag-dl.ghost:hover{background:var(--navy-3);color:#fff}
.risultato h3{font-size:14px;margin:18px 0 10px}
/* controlli qualità */
.controlli{list-style:none;padding:0;margin:4px 0;display:flex;flex-direction:column;gap:8px}
.ctrl{display:flex;gap:11px;align-items:flex-start;padding:11px 13px;border-radius:10px;border:1px solid}
.ctrl div{display:flex;flex-direction:column;min-width:0}
.ctrl strong{font-size:13px}.ctrl span{font-size:12.5px;word-break:break-word}
.ctrl-ico{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:13px;flex-shrink:0;color:#fff}
.ctrl-ok{background:#f0fdf6;border-color:#cdeede;color:#0d5a3c}.ctrl-ok .ctrl-ico{background:var(--pos)}
.ctrl-warn{background:#fdf6e7;border-color:#f7e0ad;color:#7a5b00}.ctrl-warn .ctrl-ico{background:var(--amber)}
.ctrl-err{background:#fdecec;border-color:#f6c6c6;color:#a82b22}.ctrl-err .ctrl-ico{background:var(--red)}

/* steps / misc */
.passi{margin:0 0 16px;padding-left:20px;color:var(--ink-2)}
.passi li{margin-bottom:8px}
.passi strong{color:var(--ink)}
.nota-step{background:linear-gradient(120deg,#f3fcfa,#f4f9ff);border-color:#d9eef2}
.nota-step h2{font-size:15px;margin-bottom:8px}
.nota-step p{margin:0;color:#33495c}
/* pannello FTP / stato connessione */
.stato{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;font-weight:800;letter-spacing:.05em;
  padding:5px 12px;border-radius:99px;text-transform:uppercase;white-space:nowrap}
.stato .dot{width:9px;height:9px;border-radius:50%}
.stato-connesso{background:#e7f8ef;color:#0b7a50}.stato-connesso .dot{background:#0b8458;box-shadow:0 0 0 3px rgba(11,132,88,.2)}
.stato-raggiungibile{background:#fdf3e2;color:#8a5d04}.stato-raggiungibile .dot{background:#d98c0a;box-shadow:0 0 0 3px rgba(217,140,10,.2)}
.stato-offline{background:#fdecec;color:#a82b22}.stato-offline .dot{background:#d63a3a;box-shadow:0 0 0 3px rgba(214,58,58,.2)}
.ftp-msg{margin:0 0 14px;color:var(--ink-2);font-size:13.5px}
.ftp-griglia{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:14px}
.ftp-griglia>div{background:var(--line-2);border:1px solid var(--line);border-radius:10px;padding:10px 12px;min-width:0}
.ftp-griglia span{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700;margin-bottom:3px}
.ftp-griglia strong{font-size:13px;word-break:break-all;font-weight:700}
.ftp-azioni{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.ftp-auto{margin:0 0 0 4px !important;color:var(--ink-2);font-size:12.5px}
.ftp-note{border-top:1px solid var(--line-2);padding-top:13px;display:flex;flex-direction:column;gap:8px}
.ftp-note p{margin:0;color:var(--ink-2);font-size:13px}
.ftp-note .pill{display:inline-block;margin:0 2px}
@media(max-width:620px){.ftp-griglia{grid-template-columns:1fr 1fr}}
.vuoto{color:var(--muted);font-style:italic;padding:8px 0}
.btn-icon+.btn-icon{margin-left:4px}

/* ---------- login ---------- */
.login-body{position:relative;display:grid;place-items:center;min-height:100vh;background:var(--navy);padding:20px;overflow:hidden}
/* Sfondo: veduta Val Mesolcina + overlay blu; all'apertura si sfoca mentre la card entra */
.login-body::before{content:"";position:absolute;inset:-30px;z-index:0;
  background:url("img/moesa-login.jpg") center/cover no-repeat;
  animation:lmc-bg-focus 1.7s ease-out both}
.login-body::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(135deg,rgba(9,23,39,.82),rgba(13,45,74,.60) 52%,rgba(9,26,44,.86))}
.login-card{position:relative;z-index:2}
@keyframes lmc-bg-focus{0%{filter:blur(0);transform:scale(1.08)}100%{filter:blur(7px);transform:scale(1.02)}}
.login-body .login-card{animation:lmc-card-in .9s cubic-bezier(.2,.7,.3,1) .5s both}
@keyframes lmc-card-in{0%{opacity:0;transform:translateY(16px) scale(.985)}100%{opacity:1;transform:none}}
.login-credit{position:absolute;right:14px;bottom:11px;z-index:2;margin:0;color:rgba(255,255,255,.6);font-size:10.5px;letter-spacing:.02em}
.login-credit a{color:rgba(255,255,255,.8);text-decoration:underline}
@media(prefers-reduced-motion:reduce){
  .login-body::before{animation:none;filter:blur(7px);transform:scale(1.02)}
  .login-body .login-card{animation:none;opacity:1;transform:none}
}
.login-card{width:100%;max-width:380px;background:var(--card);border-radius:20px;padding:34px 30px;box-shadow:0 30px 70px rgba(4,16,28,.5)}
.login-brand{text-align:center;margin-bottom:22px}
.login-brand h1{font-size:30px;letter-spacing:.04em;margin-top:12px}
.login-ente{margin:4px 0 0;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.14em}

/* ── Cantieri: banner della data di controllo + spunta RaSi in tabella ── */
.card-evidenza{border-color:#f0c98a;box-shadow:0 1px 2px rgba(13,38,59,.04),0 10px 28px -12px rgba(196,131,26,.45)}
.card-evidenza .card-head h2{color:#8a5a09}
.muted-warn{color:#c8362f;font-weight:600}
.tab td.c,.tab th.c{text-align:center}
.check-rasi{display:inline-flex;align-items:center;justify-content:center;cursor:pointer;margin:0}
.check-rasi input[type=checkbox]{width:18px;height:18px;cursor:pointer;accent-color:var(--acc)}

/* ── Monitoraggio reti (rilevamento UFE): griglia di caselle compilabili ── */
.cella-mon{width:110px;text-align:right;padding:6px 8px;font-variant-numeric:tabular-nums}
.cella-mon::placeholder{color:var(--muted);opacity:.55}
.riga-gruppo td{background:var(--bg2,#f6f8fa);padding-top:12px}
.box-manca{border-color:#f0c98a;background:#fffaf1}
.box-manca>summary{color:#8a5a09}

/* ── Servizio supplementare «Fattura e Rifattura» ── */
.portale-nav a.nav-dis{opacity:.45;filter:grayscale(1)}
.portale-nav a.nav-dis:hover{opacity:.65}
.servizio-riservato{text-align:center;padding:40px 28px}
.servizio-riservato .sr-icona{width:56px;height:56px;margin:0 auto 14px;border-radius:50%;
  background:linear-gradient(135deg,#0f6f66,#12897c);display:flex;align-items:center;justify-content:center}
.servizio-riservato .sr-icona .ic{width:26px;height:26px;background:#fff}
.servizio-riservato h2{font-size:17px;max-width:640px;margin:0 auto 12px;line-height:1.45}
.servizio-riservato p{max-width:560px;margin:0 auto 14px}
.servizio-riservato .btn{margin:4px 6px}

/* ══ UX A+E · Stato del sistema, KPI cliccabili, spazio compatto, badge nav ══ */
.stato-card{padding:18px 20px}
.semafori{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px}
.sem{display:flex;align-items:center;gap:10px;padding:11px 13px;border:1px solid var(--line);border-radius:12px;background:#fbfdfd}
.sem-dot{width:11px;height:11px;border-radius:50%;flex:0 0 auto;box-shadow:0 0 0 3px rgba(0,0,0,.04)}
.sem-txt{min-width:0;flex:1}
.sem-txt strong{display:block;font-size:13px;line-height:1.25}
.sem-txt span{display:block;font-size:11.5px;color:var(--muted);line-height:1.35;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sem-ok   .sem-dot{background:#1ea552}
.sem-warn .sem-dot{background:#d98c0a;animation:lmc-batt 2.4s ease-in-out infinite}
.sem-err  .sem-dot{background:#d9463d;animation:lmc-batt 1.4s ease-in-out infinite}
.sem-off  .sem-dot{background:#a9b8c2}
.sem-err{border-color:#f3ccc7;background:#fdf6f5}
.sem-warn{border-color:#f0dcb4;background:#fffcf5}
@keyframes lmc-batt{0%,100%{opacity:1}50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){.sem-warn .sem-dot,.sem-err .sem-dot{animation:none}}
.da-sistemare{margin-top:12px;border-top:1px solid var(--line);padding-top:10px;display:flex;flex-direction:column;gap:7px}
.ds-riga{display:flex;align-items:center;gap:9px;font-size:12.5px;line-height:1.4;padding:7px 10px;border-radius:9px}
.ds-riga .ic{width:15px;height:15px;flex:0 0 auto}
.ds-testo{flex:1;min-width:0}
.ds-err{background:#fdf1f0;color:#8f2e27}
.ds-warn{background:#fffaf1;color:#8a5a09}
.kpi-link{text-decoration:none;color:inherit;transition:transform .12s ease,box-shadow .12s ease}
.kpi-link:hover{transform:translateY(-1px);box-shadow:0 6px 18px -8px rgba(13,38,59,.28)}
.kpi-num .kpi-sub{font-size:.55em;font-weight:600;color:var(--muted);letter-spacing:.02em}
.spazio-card{padding:0}
.spazio-card>details>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;
  padding:16px 20px;flex-wrap:wrap}
.spazio-card>details>summary::-webkit-details-marker{display:none}
.spazio-card>details[open]>summary{border-bottom:1px solid var(--line)}
.spazio-card>details>summary .ic{width:17px;height:17px}
.spazio-mini{flex:1;min-width:90px;height:6px;border-radius:99px;background:#e6edee;overflow:hidden}
.spazio-mini-fill{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#0f6f66,#12897c)}
.spazio-card .spazio-grid,.spazio-card>details>p{padding:0 20px}
.spazio-card .spazio-grid{padding-top:18px}          /* respiro fra la testa e il contenuto aperto */
.spazio-card .spazio-dett{padding-top:4px}
.spazio-card>details>p:last-child{padding-bottom:16px}
.nav-badge{margin-left:auto;min-width:19px;height:19px;padding:0 6px;border-radius:99px;
  background:#d9463d;color:#fff;font-size:11px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}

/* ══ UX B · Comunità: riepilogo a chip, pannelli a tab, password mascherata ══ */
.riepilogo-chip{display:flex;flex-wrap:wrap;gap:7px;margin:-2px 0 14px}
.pannelli{border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-bottom:14px}
.pan-tabs{display:flex;flex-wrap:wrap;gap:2px;background:#f4f7f7;padding:5px;border-bottom:1px solid var(--line)}
.pan-tab{display:inline-flex;align-items:center;gap:6px;border:0;background:transparent;cursor:pointer;
  padding:7px 12px;border-radius:8px;font-size:12.5px;font-weight:600;color:var(--muted);font-family:inherit}
.pan-tab:hover{background:rgba(15,111,102,.08);color:var(--ink)}
.pan-tab.on{background:#fff;color:var(--acc);box-shadow:0 1px 3px rgba(13,38,59,.12)}
.pan-tab .ic{width:14px;height:14px}
.pan-corpo{padding:12px 14px}
/* dentro i pannelli i box non hanno più bisogno del proprio bordo/summary */
.pan-corpo>.fattura-box,.pan-corpo>.pod-box,.pan-corpo>.resp-form{border:0;padding:0;margin:0;background:transparent}
.pan-corpo>.fattura-box>summary{display:none}
.pan-corpo>.fattura-box>form{margin-top:0}
.cred-pw{display:inline-flex;align-items:center;gap:6px}
.pw-occhio{border:0;background:transparent;cursor:pointer;padding:2px 4px;border-radius:6px;color:var(--muted);
  font-family:inherit;font-size:12px;line-height:1}
.pw-occhio:hover{background:rgba(15,111,102,.1);color:var(--acc)}
.pw-occhio .ic{width:14px;height:14px}
.pw-occhio.copiato{color:#1ea552}
.pw-occhio.copiato::after{content:' copiata';font-size:10px}

/* ══ UX C · portale: totali e variazione sotto i grafici, ancore di sezione ══ */
.leg-tot{margin-left:auto;font-size:12px;color:var(--muted)}
.leg-tot strong{color:var(--ink)}
.var{margin-left:6px;font-weight:600;font-size:11.5px;padding:1px 7px;border-radius:99px}
.var-su{background:#fdf1f0;color:#b3392f}
.var-giu{background:#eaf7ef;color:#137a3c}
.var-pari{background:#eef2f4;color:#5a7480}
.ancore{display:flex;flex-wrap:wrap;gap:6px;margin:-6px 0 16px}
.ancore a{font-size:12px;font-weight:600;color:var(--muted);text-decoration:none;
  padding:5px 11px;border:1px solid var(--line);border-radius:99px;background:#fff}
.ancore a:hover{color:var(--acc);border-color:var(--acc)}

/* ══ UX F · contrasto dei testi secondari (AA) ══ */
:root{--muted:#5a7078}
.micro.muted,.small.muted{color:#5a7078}

/* ══ UX D · tabelle a SCHEDE sul telefono ══
   Sotto i 640px ogni riga diventa una scheda. L'etichetta NON occupa piu' una colonna
   larga il 42%: sta accanto al suo valore, piccola, e i campi si mettono in fila
   andando a capo quando serve. Con l'impaginazione vecchia una riga di sette campi
   diventava sette righe alte, e una pagina come il registro lettere superava i
   centosessantamila pixel: centottanta schermate di telefono per scorrerla.
   I selettori partono da «table.» apposta: «.tab td{padding-top:12px}» sta piu' avanti
   nel foglio e a parita' di peso vincerebbe, rimettendo 24px per cella. */
@media (max-width:640px){
  table.tab-schede thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  table.tab-schede,table.tab-schede tbody,table.tab-schede tr,table.tab-schede td{width:100%}
  table.tab-schede,table.tab-schede tbody{display:block}
  table.tab-schede tr{display:flex;flex-wrap:wrap;align-items:baseline;gap:5px 14px;
    border:1px solid var(--line);border-radius:12px;padding:11px 13px;margin-bottom:9px;background:#fff}
  table.tab-schede td{display:inline-flex;align-items:baseline;gap:5px;width:auto;
    border:0;padding:0;text-align:left !important;min-width:0}
  table.tab-schede td::before{content:attr(data-lbl);flex:0 0 auto;font-size:10px;text-transform:uppercase;
    letter-spacing:.05em;color:var(--muted);font-weight:600;white-space:nowrap}
  /* Il primo campo è il titolo della scheda: riga intera, piu' grande, senza etichetta. */
  table.tab-schede tr>td:first-child{width:100%;font-size:14.5px;line-height:1.35}
  table.tab-schede tr>td:first-child::before{display:none}
  /* L'ultimo campo, se contiene comandi, va a capo e i pulsanti si dividono la riga. */
  table.tab-schede tr>td:last-child:has(.btn),
  table.tab-schede tr>td:last-child:has(button){width:100%;margin-top:7px;gap:8px}
  table.tab-schede tr>td:last-child:has(.btn)::before,
  table.tab-schede tr>td:last-child:has(button)::before{display:none}
  table.tab-schede tr>td:last-child:has(.btn) .btn,
  table.tab-schede tr>td:last-child:has(button) .btn{flex:1 1 auto;justify-content:center}
  table.tab-schede td:empty{display:none}
  table.tab-schede tfoot tr{background:#f4f7f7;font-weight:700}
  table.tab-schede tfoot th{display:inline-flex;align-items:baseline;gap:5px;width:auto;padding:0;
    text-align:left !important}
  table.tab-schede tfoot th::before{content:attr(data-lbl);flex:0 0 auto;font-size:10px;letter-spacing:.05em;
    text-transform:uppercase;color:var(--muted);font-weight:600}
  table.tab-schede tfoot th:first-child{width:100%}
  table.tab-schede tfoot th:first-child::before{display:none}
  table.tab-schede tfoot th:empty{display:none}
  .tab-wrap:has(.tab-schede){overflow:visible}
}


/* ══ SCENA DI LOGIN (accesso unico) ══
   La foto della Val Mesolcina entra a fuoco e si sfoca dietro la card, che sale in dissolvenza:
   stessa regia della vecchia pagina admin, ora sull'unico ingresso della piattaforma. */
.login-scena{position:relative;background:var(--navy);overflow:hidden}
.login-scena::before{content:"";position:absolute;inset:-30px;z-index:0;
  background:url("img/moesa-login.jpg") center/cover no-repeat;
  animation:lmc-bg-focus 1.9s cubic-bezier(.2,.7,.25,1) both}
.login-scena::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(160deg,rgba(10,32,48,.62) 0%,rgba(10,32,48,.78) 55%,rgba(6,22,34,.88) 100%)}
.login-scena>*{position:relative;z-index:2}
.login-scena .portale-top{background:transparent;border-bottom:1px solid rgba(255,255,255,.12);
  animation:lmc-top-in .8s ease-out both}
.login-scena .portale-main{display:grid;place-items:center;flex:1}
.login-scena .portale-foot{background:transparent;border-top:0;color:rgba(255,255,255,.55)}
.login-scena .portale-foot a{color:rgba(255,255,255,.75)}
.login-card-scena{animation:lmc-card-in 1s cubic-bezier(.2,.7,.3,1) .45s both;
  box-shadow:0 24px 60px -22px rgba(0,0,0,.55),0 2px 8px rgba(0,0,0,.18)}
/* i campi entrano a cascata: dà il senso di "sistema che si accende" */
.login-card-scena h1{animation:lmc-riga-in .55s ease-out .75s both}
.login-card-scena>p.muted{animation:lmc-riga-in .55s ease-out .85s both}
.login-card-scena .login-form label{animation:lmc-riga-in .55s ease-out both}
.login-card-scena .login-form label:nth-of-type(1){animation-delay:.95s}
.login-card-scena .login-form label:nth-of-type(2){animation-delay:1.03s}
.login-card-scena .login-form label:nth-of-type(3){animation-delay:1.11s}
.login-card-scena .login-form .btn{animation:lmc-riga-in .55s ease-out 1.18s both}
.login-card-scena .portale-alt{animation:lmc-riga-in .55s ease-out 1.26s both}
@keyframes lmc-riga-in{0%{opacity:0;transform:translateY(7px)}100%{opacity:1;transform:none}}
@keyframes lmc-top-in{0%{opacity:0;transform:translateY(-10px)}100%{opacity:1;transform:none}}
.login-scena .login-credit{position:absolute;right:14px;bottom:11px;z-index:3;margin:0;
  color:rgba(255,255,255,.6);font-size:10.5px;letter-spacing:.02em}
.login-scena .login-credit a{color:rgba(255,255,255,.8);text-decoration:underline}
@media (prefers-reduced-motion:reduce){
  .login-scena::before{animation:none;filter:blur(7px);transform:scale(1.02)}
  .login-card-scena,.login-card-scena *{animation:none !important;opacity:1 !important;transform:none !important}
}
@media (max-width:560px){.login-scena .login-credit{position:static;text-align:center;padding:6px 0 10px}}

/* tap target: sul telefono ogni comando deve essere premibile col pollice (≥32px) */
@media (max-width:880px){
  .mod-chip{min-height:32px;display:inline-flex;align-items:center;padding:0 12px}
  .exp-btn{min-width:32px;min-height:32px}
  .btn,.btn-mini,.btn-sm{min-height:34px}
  .btn-icon{min-width:34px;min-height:34px}
  .pan-tab{min-height:34px}
  .check-rasi input[type=checkbox]{width:22px;height:22px}
}

/* ══ ANIMAZIONI DI ESPANSIONE — tendine, righe, pannelli ══
   Ogni cosa che si apre lo fa con un movimento breve (160-260 ms) e una curva morbida:
   niente salti secchi. Sempre disattivate con prefers-reduced-motion. */
details>summary{transition:color .15s ease}
details[open]>summary~*{animation:lmc-apri .22s cubic-bezier(.2,.7,.3,1) both}
@keyframes lmc-apri{0%{opacity:0;transform:translateY(-5px)}100%{opacity:1;transform:none}}
.exp-row td>*{animation:lmc-apri .2s cubic-bezier(.2,.7,.3,1) both}
.exp-btn{transition:transform .2s cubic-bezier(.2,.7,.3,1),color .15s ease}
.exp-btn.is-open{transform:rotate(90deg)}
.pan-corpo:not([hidden]){animation:lmc-pan .24s cubic-bezier(.2,.7,.3,1) both}
@keyframes lmc-pan{0%{opacity:0;transform:translateY(6px)}100%{opacity:1;transform:none}}
.pan-tab{transition:background .15s ease,color .15s ease,box-shadow .18s ease}
.ricerca-drop:not([hidden]){animation:lmc-drop .18s cubic-bezier(.2,.7,.3,1) both}
@keyframes lmc-drop{0%{opacity:0;transform:translateY(-6px) scale(.995)}100%{opacity:1;transform:none}}
.guida-panel:not([hidden]){animation:lmc-apri .24s cubic-bezier(.2,.7,.3,1) both}
.flash,.flash-gruppo{animation:lmc-apri .26s cubic-bezier(.2,.7,.3,1) both}
.sem,.kpi-link,.stchip{transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease}
select,input[type=text],input[type=date],input[type=datetime-local],input[type=search],input[type=password],textarea{
  transition:border-color .15s ease,box-shadow .15s ease,background .15s ease}
.btn{transition:transform .12s ease,box-shadow .15s ease,background .15s ease,color .15s ease}
.btn:active{transform:translateY(1px)}
.nav-item{transition:background .16s ease,color .16s ease,padding-left .16s ease}
.nav-item:hover:not(.attivo){padding-left:20px}
@media (prefers-reduced-motion:reduce){
  details[open]>summary~*,.exp-row td>*,.pan-corpo:not([hidden]),.ricerca-drop:not([hidden]),
  .guida-panel:not([hidden]),.flash,.flash-gruppo{animation:none}
  .exp-btn,.btn,.nav-item,.sem,.kpi-link{transition:none}
}

/* ══ UX G · Storico: menu «Scarica» al posto della fila di chip ══ */
.menu-dl{position:relative;display:inline-block}
.menu-dl>summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.menu-dl>summary::-webkit-details-marker{display:none}
.menu-dl>summary::after{content:'▾';font-size:11px;opacity:.7}
.menu-dl-n{background:rgba(15,111,102,.12);color:var(--acc);border-radius:99px;padding:0 6px;font-size:11px;font-weight:700}
/* ancorato a DESTRA: la colonna è vicina al bordo, aprendo a sinistra il menu uscirebbe */
.menu-dl-box{position:absolute;top:calc(100% + 5px);right:0;z-index:40;min-width:262px;max-height:340px;overflow-y:auto;
  background:#fff;border:1px solid var(--line);border-radius:12px;padding:6px;
  box-shadow:0 14px 38px -12px rgba(13,38,59,.34),0 2px 6px rgba(13,38,59,.08)}
.menu-dl[open]>.menu-dl-box{animation:lmc-drop .18s cubic-bezier(.2,.7,.3,1) both}
.menu-dl-box a{display:flex;align-items:center;gap:8px;padding:7px 9px;border-radius:8px;
  font-size:12.5px;color:var(--ink);text-decoration:none;white-space:nowrap}
.menu-dl-box a:hover{background:rgba(15,111,102,.08);color:var(--acc)}
.menu-dl-box a .ic{width:14px;height:14px;flex:0 0 auto}
.menu-dl-tit{font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);
  font-weight:700;padding:8px 9px 4px}
@media (max-width:560px){.menu-dl-box{min-width:220px;max-width:calc(100vw - 40px)}}

/* ══ UX I · «Cosa fare oggi» nella home dei moduli ══ */
.oggi-card{margin-bottom:18px}
.oggi-lista{display:flex;flex-direction:column;gap:6px}
.oggi-riga{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;
  text-decoration:none;color:var(--ink);font-size:13px;line-height:1.4;
  border:1px solid var(--line);background:#fbfdfd;transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease}
.oggi-riga:hover{transform:translateX(2px);box-shadow:0 4px 14px -8px rgba(13,38,59,.3);border-color:var(--acc)}
.oggi-dot{width:9px;height:9px;border-radius:50%;flex:0 0 auto}
.oggi-err .oggi-dot{background:#d9463d}   .oggi-err{border-color:#f3ccc7;background:#fdf6f5}
.oggi-warn .oggi-dot{background:#d98c0a}  .oggi-warn{border-color:#f0dcb4;background:#fffcf5}
.oggi-testo{flex:1;min-width:0}
.oggi-az{font-size:12px;font-weight:700;color:var(--acc);white-space:nowrap}

/* ══ UX L · attesa a FASI durante l'elaborazione ══ */
.elab-passi{list-style:none;margin:14px 0 4px;padding:0;display:flex;flex-direction:column;gap:7px;text-align:left}
.elab-passo{display:flex;align-items:center;gap:9px;font-size:12.5px;color:rgba(255,255,255,.5);transition:color .3s ease}
.ep-dot{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.25);flex:0 0 auto;transition:background .3s ease,box-shadow .3s ease}
.elab-passo.fatto{color:rgba(255,255,255,.8)}
.elab-passo.fatto .ep-dot{background:#3fd39a}
.elab-passo.fatto .ep-txt::after{content:' ✓';color:#3fd39a}
.elab-passo.ora{color:#fff;font-weight:600}
.elab-passo.ora .ep-dot{background:#3fd39a;box-shadow:0 0 0 4px rgba(63,211,154,.22);animation:lmc-batt 1.3s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.elab-passo.ora .ep-dot{animation:none}}

/* ══ UX M · accessibilità da tastiera ══ */
.salta-al-contenuto{position:absolute;left:-9999px;top:0;z-index:999;background:var(--acc);color:#fff;
  padding:10px 16px;border-radius:0 0 10px 0;font-weight:700;font-size:13px;text-decoration:none}
.salta-al-contenuto:focus{left:0}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px;border-radius:4px}
.btn:focus-visible,.nav-item:focus-visible,.pan-tab:focus-visible,.oggi-riga:focus-visible,.kpi-link:focus-visible{
  outline:2px solid var(--acc);outline-offset:3px}
.sidebar :focus-visible{outline-color:#7fe3c8}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--acc);outline-offset:1px}
#contenuto:focus{outline:none}

/* ══ Avviso «nuova versione» dell'app installata ══ */
.agg-banner{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:950;
  display:flex;align-items:center;gap:12px;max-width:calc(100vw - 28px);
  background:#0f2b3d;color:#fff;border-radius:14px;padding:11px 12px 11px 16px;font-size:13px;
  box-shadow:0 18px 44px -14px rgba(0,0,0,.55);animation:lmc-agg-in .3s cubic-bezier(.2,.7,.3,1) both}
.agg-banner .ic{width:16px;height:16px;background:#7fe3c8;flex:0 0 auto}
.agg-banner .btn{padding:6px 14px;font-size:12.5px;white-space:nowrap}
.agg-x{background:transparent;border:0;color:rgba(255,255,255,.6);font-size:15px;cursor:pointer;
  padding:2px 4px;line-height:1;border-radius:6px}
.agg-x:hover{color:#fff;background:rgba(255,255,255,.12)}
@keyframes lmc-agg-in{0%{opacity:0;transform:translate(-50%,14px)}100%{opacity:1;transform:translate(-50%,0)}}
@media (max-width:560px){.agg-banner{left:14px;right:14px;transform:none;font-size:12.5px}
  @keyframes lmc-agg-in{0%{opacity:0;transform:translateY(14px)}100%{opacity:1;transform:none}}}
@media (prefers-reduced-motion:reduce){.agg-banner{animation:none}}

/* ══ Grafico d'andamento INTERATTIVO (dettaglio del giorno + zoom) ══ */
.grafico-int{position:relative}
.grafico-int .g-hit{fill:transparent;cursor:pointer;outline:none}
.grafico-int .g-hit:hover,.grafico-int .g-hit:focus-visible{fill:rgba(15,111,102,.06)}
.grafico-int .g-hit:focus-visible{stroke:var(--acc);stroke-width:1.5;stroke-dasharray:3 3}
.grafico-int .g-guida{stroke:var(--acc);stroke-width:1;stroke-dasharray:4 4;opacity:.55;pointer-events:none}
.grafico-int .g-pt{transition:r .15s ease,stroke-width .15s ease}
.grafico-int .g-pt.acceso{r:5.5;stroke:#fff;stroke-width:2}
.g-tip{position:absolute;top:6px;z-index:6;background:#fff;border:1px solid var(--line);border-radius:12px;
  padding:11px 14px;min-width:210px;pointer-events:none;
  box-shadow:0 14px 34px -12px rgba(13,38,59,.34),0 2px 6px rgba(13,38,59,.08);
  animation:lmc-apri .14s ease-out both}
.g-tip .gt-data{font-weight:800;font-size:12.5px;margin-bottom:7px;text-transform:capitalize}
.g-tip .gt-riga{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--ink);margin:3px 0}
.g-tip .gt-riga strong{margin-left:auto;font-variant-numeric:tabular-nums}
.g-tip .gt-bil{margin-top:7px;padding-top:7px;border-top:1px solid var(--line);font-size:11.5px;color:var(--muted);line-height:1.4}
.g-tip .gt-az{margin-top:6px;font-size:10.5px;color:var(--acc);font-weight:700;letter-spacing:.02em}
.leg-hint{color:var(--muted);font-size:11.5px;font-style:italic}
@media (max-width:560px){.g-tip{min-width:0;max-width:calc(100% - 12px);padding:9px 11px}.g-tip .gt-az{display:none}}
@media (prefers-reduced-motion:reduce){.g-tip{animation:none}.grafico-int .g-pt{transition:none}}

/* ══ Rifiniture finali: stati vuoti e scorciatoie da tastiera ══ */
.vuoto{padding:22px 18px;text-align:center;color:var(--muted);font-size:13.5px;line-height:1.6;
  background:#fbfdfd;border:1px dashed var(--line);border-radius:12px}
.vuoto a{font-weight:700}
td.vuoto{background:transparent;border:0;padding:18px}

.scorc-box{position:fixed;inset:0;z-index:900;background:rgba(10,32,48,.55);
  display:grid;place-items:center;padding:20px;animation:lmc-apri .18s ease-out both}
.scorc-in{background:#fff;border-radius:16px;padding:22px 24px;min-width:300px;max-width:420px;
  box-shadow:0 30px 70px -24px rgba(0,0,0,.5)}
.scorc-tit{font-weight:800;font-size:15px;margin-bottom:12px}
.scorc-in ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.scorc-in li{display:flex;align-items:center;gap:12px;font-size:13px;color:var(--ink)}
.scorc-in kbd{min-width:34px;text-align:center;background:#f2f6f7;border:1px solid var(--line);
  border-bottom-width:2px;border-radius:6px;padding:3px 7px;font:600 11.5px/1.4 ui-monospace,monospace;color:var(--ink)}
.scorc-pie{margin-top:14px;padding-top:10px;border-top:1px solid var(--line);
  color:var(--muted);font-size:11.5px;text-align:center}
@media (prefers-reduced-motion:reduce){.scorc-box{animation:none}}

/* ── Flash raggruppati + card numerate del flusso fatture ── */
.flash-gruppo{border:1px solid var(--line);border-radius:12px;background:#fff;padding:12px 14px;margin-bottom:14px;
  box-shadow:0 1px 2px rgba(13,38,59,.04),0 8px 22px -14px rgba(13,38,59,.2)}
.fg-tit{display:flex;align-items:center;gap:8px;font-weight:700;font-size:13px;margin-bottom:8px}
.fg-tit .ic{width:15px;height:15px;color:#1ea552}
.fg-riga{font-size:12.5px;line-height:1.45;padding:6px 10px;border-radius:8px;margin-top:4px;background:#f4f7f7}
.fg-ok{background:#eaf7ef;color:#137a3c}
.fg-warn{background:#fffaf1;color:#8a5a09}
.fg-err{background:#fdf1f0;color:#8f2e27}
.fg-info{background:#eef4f8;color:#31576e}
.pass-n{display:inline-flex;align-items:center;justify-content:center;width:21px;height:21px;border-radius:50%;
  background:linear-gradient(135deg,#0f6f66,#12897c);color:#fff;font-size:12px;font-weight:700;margin-right:7px}

/* ── Esempi di formato file (import GII + Formule & Guida) ── */
.fmt-esempio{margin-top:6px;font-weight:400}
.fmt-esempio summary{cursor:pointer;color:var(--acc);font-size:12px;font-weight:600}
.fmt-esempio pre{margin:6px 0;padding:8px 10px;background:#f4f7f7;border:1px solid var(--line);border-radius:8px;
  font-size:11px;line-height:1.5;overflow-x:auto;white-space:pre}
.guida .fmt-esempio pre{font-size:12px}
.tab-mgii .riga-gruppo strong{font-size:13px}
.login-titolo{margin:6px 0 0;font-weight:700;color:var(--ink)}
.login-sub{margin:2px 0 0;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.16em}
.login-form{display:flex;flex-direction:column;gap:14px;margin-top:8px}
.login-foot{text-align:center;color:var(--muted);font-size:11.5px;margin:18px 0 0;letter-spacing:.04em}

/* ===================== FORMULE & GUIDA ===================== */
.guida h2{font-size:18px;margin-bottom:6px}
.guida h3{font-size:15px;margin:18px 0 8px}
.guida p,.guida li{color:var(--ink-2);line-height:1.62}
.guida ul{margin:6px 0;padding-left:20px}
.guida li{margin-bottom:8px}
.guida .formula{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background:var(--navy-2);color:#cfe8ff;
  border-radius:11px;padding:14px 16px;font-size:13px;margin:11px 0;overflow-x:auto;line-height:1.75;white-space:pre-wrap}
.guida .formula b{color:#7ee0d3;font-weight:700}
.guida .nota{background:#f1fbf6;border:1px solid #cdeede;border-radius:10px;padding:11px 14px;color:#0d5a3c;font-size:13px;margin:11px 0}
.guida .esempio{background:var(--line-2);border-left:3px solid var(--teal);border-radius:0 10px 10px 0;padding:11px 14px;font-size:13px;margin:11px 0}
.guida .esempio b{color:var(--ink)}
.guida code{background:var(--line-2)}
.indice{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.indice a{background:var(--line-2);border:1px solid var(--line);border-radius:8px;padding:6px 12px;font-size:12.5px;font-weight:600;color:var(--ink)}
.indice a:hover{border-color:var(--teal);color:var(--teal-d);text-decoration:none}

/* ===================== PORTALE CLIENTI ===================== */
.portale-body{background:var(--bg);min-height:100vh;display:flex;flex-direction:column}
.portale-top{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 24px;
  background:linear-gradient(180deg,var(--navy),var(--navy-2));color:#fff}
.portale-brand{display:flex;align-items:center;gap:11px;color:#fff;text-decoration:none}
.portale-brand .brand-mark{width:38px;height:38px;font-size:20px}
.portale-brand-txt strong{font-family:var(--font-head);font-weight:700;font-size:18px;letter-spacing:.02em;margin-right:7px}
.portale-brand-txt span{color:#8fb0cc;font-size:12px}
.portale-brand:hover{text-decoration:none}
.portale-user{display:flex;align-items:center;gap:12px;font-size:13px;color:#cfe0ef;min-width:0}
.portale-user>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.portale-user .btn-esci{padding:7px 14px;border-radius:9px}
.portale-main{width:100%;max-width:860px;margin:0 auto;padding:26px 20px;flex:1}
.portale-foot{padding:18px 24px;text-align:center;color:var(--muted);font-size:12px;border-top:1px solid var(--line)}
.portale-card{max-width:444px;margin:26px auto;background:var(--card);border:1px solid var(--line);border-radius:18px;
  padding:32px 30px;box-shadow:var(--sh)}
.portale-card h1{font-size:24px;margin-bottom:6px}
.portale-card .login-form{margin-top:18px}
.portale-alt{text-align:center;margin:18px 0 0;font-size:13.5px;color:var(--ink-2)}
.portale-benvenuto{margin:6px 0 18px}
.portale-benvenuto h1{font-size:27px}
.consumo-card .kpi-row{margin-bottom:8px;grid-template-columns:repeat(auto-fit,minmax(185px,1fr))}
.kpi-verde{background:linear-gradient(135deg,#eafaf2,#fff);border-color:#bfead4}
.kpi-num small{font-size:13px;font-weight:600;color:var(--muted)}
.consumo-frase{background:#f1fbf6;border:1px solid #cdeede;border-radius:11px;padding:13px 15px;color:#0d5a3c;font-size:14px;margin:8px 0 0}
.grafico-wrap{overflow-x:auto;margin:6px 0 6px;padding:4px 0}
.grafico{height:250px;width:auto;max-width:100%;display:block}
.g-val{fill:var(--ink);font-size:11px;font-weight:700;font-family:var(--font-sans)}
.g-lab{fill:var(--muted);font-size:10.5px;font-weight:600;font-family:var(--font-sans)}
.g-grid{stroke:var(--line);stroke-width:1}
.g-axis{fill:var(--muted);font-size:10px;font-family:var(--font-sans)}
.grafico rect{transition:opacity .12s}.grafico rect:hover{opacity:.82}
.legenda{display:flex;flex-wrap:wrap;gap:16px;margin:0 0 14px;font-size:12.5px;color:var(--ink-2)}
.leg{display:inline-flex;align-items:center;gap:7px}
.sw{width:13px;height:13px;border-radius:3px;display:inline-block;flex-shrink:0}
.sw-com{background:#1ea552}.sw-rete{background:#9fb4c4}.sw-cond{background:#0a8478}.sw-imm{background:#d98c0a}
.consumo-card h3{font-size:14px;margin:18px 0 10px}
.codice{font-family:ui-monospace,Menlo,Consolas,monospace;font-weight:700;letter-spacing:.14em;background:var(--line-2);
  border:1px solid var(--line);border-radius:7px;padding:4px 11px;font-size:13.5px;color:var(--ink)}
.badge-ok{background:rgba(31,165,82,.14);color:#0b7a50}
.badge-warn{background:#fdf3e2;color:#8a5d04}
.btn-mini{padding:6px 12px;font-size:12.5px;border-radius:8px}
.card-attesa{border-color:#f7e0ad;background:linear-gradient(120deg,#fffaf0,#fff)}
.captcha-lbl{background:#f3fcfa;border:1px solid #d9eef2;border-radius:10px;padding:11px 13px}
.captcha-lbl strong{font-size:16px;color:var(--teal-d)}
.cod-input{text-transform:uppercase;letter-spacing:.14em}
.otp-input{font-size:24px;letter-spacing:10px;text-align:center;font-weight:700;font-family:ui-monospace,Menlo,Consolas,monospace}
.link-btn{display:inline;background:none;border:none;color:var(--teal-d);font:inherit;font-weight:600;cursor:pointer;padding:0;text-decoration:underline}
.link-btn:hover{color:var(--teal)}
@media(max-width:560px){
  .portale-top{padding:12px 14px;gap:10px}
  .portale-brand-txt span{display:none}
  .portale-card{padding:26px 20px}
  /* Su 375px l'intestazione usciva dallo schermo e la pagina scorreva in orizzontale:
     il marchio si comprime, il numero di contratto sparisce (è già dentro la pagina) e
     «Installa app» resta solo l'icona — il bottone Esci deve restare raggiungibile. */
  .portale-brand{min-width:0;flex:1 1 auto}
  .portale-brand-txt strong{font-size:15px;white-space:nowrap}
  .portale-user{flex:0 0 auto;gap:8px}
  .portale-user>span{display:none}
  .portale-user .btn-install-top{padding:7px 9px}
  .portale-user .btn-install-top span:not(.ic){display:none}
}

/* ===================== RESPONSIVE ===================== */
.mobile-bar{display:none}
.sidebar-overlay{display:none}
body.no-scroll{overflow:hidden}

@media(max-width:880px){
  .sidebar{position:fixed;left:0;top:0;height:100vh;width:264px;transform:translateX(-100%);
    transition:transform .26s ease;z-index:70;overflow-y:auto;box-shadow:0 0 50px rgba(4,12,20,.5)}
  .sidebar.open{transform:translateX(0)}
  .sidebar-overlay{position:fixed;inset:0;background:rgba(8,18,28,.55);z-index:65;
    opacity:0;pointer-events:none;transition:opacity .26s;display:block}
  .sidebar-overlay.show{opacity:1;pointer-events:auto}
  .main{width:100%;min-width:0}
  .mobile-bar{display:flex;align-items:center;gap:12px;padding:11px 16px;color:#fff;
    background:linear-gradient(180deg,var(--navy),var(--navy-2));position:sticky;top:0;z-index:50}
  .hamburger{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.14);color:#fff;
    width:44px;height:40px;border-radius:10px;font-size:18px;cursor:pointer;flex-shrink:0;line-height:1}
  .hamburger:active{background:rgba(255,255,255,.24)}
  .mobile-brand{display:flex;align-items:baseline;gap:8px;min-width:0}
  .mobile-brand strong{font-family:var(--font-head);font-weight:700;font-size:18px;letter-spacing:.02em}
  .mobile-mark{font-size:17px}
  .mobile-sub{color:#8fb0cc;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .topbar{padding:16px 18px}
  .topbar h1{font-size:19px}
  .content{padding:16px 18px}
  .footer{padding:14px 18px}
  .kpi-row{grid-template-columns:1fr 1fr;gap:12px}
  .kpi{padding:15px}
  .card{padding:16px}
}
@media(max-width:560px){
  .topbar{flex-wrap:wrap;gap:10px;align-items:flex-start}
  .topbar .btn-primary{display:none}                 /* azione già nel menu */
  .kpi-row{grid-template-columns:1fr}
  .form-grid{grid-template-columns:1fr}
  .form-grid .col-2,.form-grid .col-4{grid-column:span 1}
  .form-inline{flex-direction:column;align-items:stretch}
  .form-inline label,.form-inline .grow{min-width:0;width:100%}
  .form-inline .btn{width:100%;justify-content:center}
  .cle-row{grid-template-columns:1fr;gap:9px}
  .card-head{flex-wrap:wrap;gap:8px}
  .login-card{padding:28px 22px}
}

/* --- Responsabile RCPV/CLE (Comunità & Contatori) --- */
.resp-box{margin-top:10px;padding-top:12px;border-top:1px dashed var(--line)}
.cle-row .resp-box{grid-column:1 / -1;margin-top:6px}
.resp-form{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.resp-form label{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:600;color:var(--muted);flex:1;min-width:180px}
.resp-form input{font:inherit;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:#fff;color:var(--ink)}
.btn-sm{padding:7px 12px;font-size:13px}
.resp-cred{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:8px;font-size:13px}
.cred{background:var(--line-2);border:1px solid var(--line);border-radius:8px;padding:3px 9px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12.5px}
.cred strong{color:var(--teal-d);letter-spacing:.03em}
.badge-resp{background:rgba(139,92,246,.14);color:#7c3aed}

/* --- Forza invio AET per periodo (Dashboard) --- */
.forza-form{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;margin-top:8px;padding:12px 14px;background:var(--line-2);border:1px solid var(--line);border-radius:var(--r-sm)}
.forza-tit{flex:1 0 100%;font-size:12.5px;font-weight:700;color:var(--ink-2)}
.campo-mini{display:flex;flex-direction:column;gap:4px;font-size:11.5px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.campo-mini input{font:inherit;padding:7px 9px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);text-transform:none;letter-spacing:0}

/* --- Utenti: password visibile + subentro --- */
.tab .pwd strong{color:var(--teal-d);letter-spacing:.05em}
.micro{font-size:10.5px}
.sub-form{display:flex;gap:6px;align-items:center}
.sub-form input{font:inherit;padding:5px 7px;border:1px solid var(--line);border-radius:7px}
.lista-spunta{margin:6px 0 0;padding-left:18px}
.lista-spunta li{margin:5px 0}
.prog-stato{display:flex;gap:8px;align-items:center;margin-top:10px;padding-top:10px;border-top:1px dashed var(--line)}

/* --- Pagina Database --- */
.dest-tit{margin:18px 0 8px;display:flex;align-items:center;gap:8px}
.badge-dest{background:rgba(15,176,163,.13);color:var(--teal-d);font-size:12px;padding:3px 11px}
.kupload{margin:6px 0 10px}
.drop-slim{padding:14px 16px}
.kupload-azioni{display:flex;gap:12px;align-items:center;margin-top:10px;flex-wrap:wrap}
.kelabora{margin-bottom:14px}
.cle-flux-tit{margin:16px 0 7px;font-size:14.5px;display:flex;align-items:center;gap:8px}

/* --- POD RCPV/CLE + lettura attuale --- */
.pod-box{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin-top:8px;padding-top:10px;border-top:1px dashed var(--line)}
.cle-row .pod-box{grid-column:1 / -1}
.pod-box label{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:600;color:var(--muted);flex:1;min-width:240px}
.pod-box input{font:inherit;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:#fff;color:var(--ink)}
.pod-len{font-size:11.5px;font-weight:700}
.pod-len.ok{color:#0b7a50}
.pod-len.ko{color:#9a6700}
.attuale{color:#0b7a50;font-size:11.5px;font-weight:700;margin-top:2px}

/* --- Vista responsabile: conguaglio --- */
.conguaglio-nota{background:var(--line-2);border:1px solid var(--line);border-radius:11px;padding:11px 14px;color:var(--ink-2);font-size:13.5px;margin:0 0 14px}
.kpi-inc{background:linear-gradient(135deg,#eafaf2,#fff);border-color:#bfead4}
.kpi-rim{background:linear-gradient(135deg,#fdf3e6,#fff);border-color:#f3dcb4}
.tab-conguaglio .col-inc{background:rgba(31,165,82,.07)}
.tab-conguaglio .col-rim{background:rgba(217,140,10,.08)}
.tab-conguaglio .col-inc strong{color:#0b7a50}
.tab-conguaglio .col-rim strong{color:#9a6700}
.tab-conguaglio tfoot .tot-row td{border-top:2px solid #d2dde8;font-weight:700;background:#f7fafc}
.tab-conguaglio thead th .micro{font-weight:600;letter-spacing:0;text-transform:none;color:var(--muted)}
.badge-consumatore{background:rgba(159,180,196,.28);color:#3a4d5c}
.badge-produttore{background:rgba(31,165,82,.16);color:#0b7a50}
.badge-misto{background:rgba(139,92,246,.16);color:#7c3aed}

/* --- Portale: badge comunità di provenienza --- */
.badge-com{background:rgba(31,165,82,.13);color:#0b7a50;font-size:11px;font-weight:700;vertical-align:middle;margin-left:6px}

/* === Bottone esterno nel menu (Report Mensile) === */
.nav-sep{height:1px;background:rgba(255,255,255,.09);margin:10px 12px}
.nav-mod{font-size:10px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:#6f8aa6;padding:12px 12px 4px}
.nav-mod:first-child{padding-top:2px}
.nav-ext{position:relative}
.nav-ext .nav-ext-ico{margin-left:auto;font-size:12px;opacity:.6}
.nav-ext:hover{background:linear-gradient(120deg,rgba(16,182,168,.18),rgba(34,197,94,.12))}

/* === Monitor spazio hosting === */
.spazio-grid{display:grid;grid-template-columns:auto 1fr;gap:26px;align-items:center}
.spazio-gauge{display:flex;flex-direction:column;align-items:center;gap:12px;min-width:150px}
.donut{width:140px;height:140px;display:block}
.donut-pct{font-family:var(--font-head);font-weight:700;font-size:22px;fill:var(--ink)}
.donut-sub{font-size:11px;fill:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.spazio-num{display:flex;gap:18px;flex-wrap:wrap;justify-content:center}
.spazio-num div{text-align:center}
.spazio-num strong{display:block;font-family:var(--font-head);font-size:16px;color:var(--ink)}
.spazio-num span{font-size:11px;color:var(--muted)}
.spazio-dett-tit{font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:10px}
.spazio-barra{display:grid;grid-template-columns:120px 1fr 72px;align-items:center;gap:10px;margin:5px 0}
.sb-lab{font-size:13px;color:var(--ink-2)}
.sb-track{height:9px;background:var(--line-2);border-radius:6px;overflow:hidden}
.sb-fill{display:block;height:100%;background:linear-gradient(90deg,var(--teal),var(--teal-d));border-radius:6px}
.sb-val{font-size:12px;color:var(--muted);text-align:right;font-variant-numeric:tabular-nums}
@media(max-width:680px){.spazio-grid{grid-template-columns:1fr}.spazio-barra{grid-template-columns:90px 1fr 64px}}

/* === Liste pigre: bottone «Espandi» === */
.lazy-more{margin:10px 0 2px;text-align:center}
.espandi{display:inline-flex;align-items:center;gap:8px;padding:8px 18px;border-radius:9px;
  background:#fff;border:1px solid var(--line);color:var(--teal-d);font-weight:700;font-size:13px;cursor:pointer}
.espandi:hover{border-color:var(--teal);background:#f1fbf9;text-decoration:none}
.espandi.carico{opacity:.6;pointer-events:none}

/* === Ricerca globale (lente predittiva nella topbar) === */
.topbar{flex-wrap:wrap}
.topbar-tit,.topbar-cta{flex:0 0 auto}
.ricerca{position:relative;flex:1 1 300px;max-width:560px;margin-left:auto}
.ricerca-ico{position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:14px;opacity:.55;pointer-events:none}
.ricerca-input{width:100%;padding:10px 14px 10px 36px;border:1px solid var(--line);border-radius:10px;
  background:var(--bg);font:inherit;font-size:14px;color:var(--ink);transition:.15s}
.ricerca-input::placeholder{color:#90a1b0}
.ricerca-input:focus{outline:none;border-color:var(--teal);background:#fff;box-shadow:0 0 0 3px rgba(16,182,168,.14)}
.ricerca-drop{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:60;background:#fff;
  border:1px solid var(--line);border-radius:12px;box-shadow:var(--sh);overflow:hidden;max-height:62vh;overflow-y:auto}
.ricerca-item{display:flex;align-items:center;gap:12px;padding:10px 14px;border-bottom:1px solid var(--line-2);color:var(--ink)}
.ricerca-item:last-child{border-bottom:0}
.ricerca-item:hover,.ricerca-item.sel{background:#f1fbf9;text-decoration:none}
.ri-ic{width:26px;height:26px;flex:0 0 26px;display:grid;place-items:center;border-radius:7px;background:var(--line-2);font-size:14px}
.ri-main{flex:1;min-width:0}
.ri-l{display:block;font-weight:600;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ri-s{display:block;font-size:12px;color:var(--muted);font-family:ui-monospace,Menlo,monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ri-t{flex:0 0 auto;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--teal-d);background:rgba(16,182,168,.1);padding:3px 8px;border-radius:6px}
.ricerca-item mark{background:rgba(245,200,66,.55);color:inherit;border-radius:3px;padding:0 1px}
.ricerca-vuoto{padding:14px;color:var(--muted);font-size:13px}
@media(max-width:880px){.ricerca{order:3;flex-basis:100%;max-width:none;margin-left:0}}

/* evidenziazione del risultato dopo il salto dalla ricerca (#ancora) */
tr[id]:target>td{animation:evid 2.4s ease}
.card[id]:target,section[id]:target{animation:evid 2.4s ease;box-shadow:0 0 0 2px var(--teal)}
@keyframes evid{0%,45%{background:rgba(245,200,66,.32)}100%{background:transparent}}

/* === Ruoli / Team === */
.ruolo-chip{display:inline-block;font-size:11px;font-weight:700;padding:2px 8px;border-radius:6px;white-space:nowrap;vertical-align:middle}
.ruolo-amministratore{background:rgba(11,93,143,.14);color:#0a5d8f}
.ruolo-membro{background:rgba(16,182,168,.16);color:#0a8478}
.ruolo-visualizzatore{background:rgba(139,92,246,.16);color:#7c3aed}
.sidebar-foot .ruolo-chip{margin-top:3px}
.ruoli-legenda{display:flex;flex-direction:column;gap:6px;background:var(--line-2);border-radius:10px;padding:12px 14px;margin:12px 0;font-size:13px;color:var(--ink-2)}
.riga-radice{background:rgba(11,93,143,.04)}
.form-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:4px}
/* sola lettura: disabilita i bottoni d'azione dei form (il server blocca comunque i POST) */
.sola-lettura form button,.sola-lettura .btn-icon,.sola-lettura .toggle-edit{opacity:.4;pointer-events:none;cursor:not-allowed}
.sola-lettura select[name]{pointer-events:none;opacity:.6}

/* === Fatturazione FV === */
.form-grid .col-3{grid-column:span 3}
.fattura-box{margin:10px 0 4px;border:1px solid var(--line);border-radius:10px;background:var(--line-2);padding:0 14px}
.fattura-box>summary{cursor:pointer;padding:11px 2px;font-weight:600;color:var(--ink-2);list-style:none}
.fattura-box>summary::-webkit-details-marker{display:none}
.fattura-box>summary::before{content:'▸ ';color:var(--teal-d)}
.fattura-box[open]>summary::before{content:'▾ '}
.fattura-box .form-grid{padding:4px 0 14px}
.portale-nav{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 18px}
.portale-nav a{padding:9px 16px;border-radius:9px;font-weight:600;color:var(--muted);background:var(--card);border:1px solid var(--line)}
.portale-nav a:hover{color:var(--teal-d);text-decoration:none}
.portale-nav a.on{background:linear-gradient(120deg,var(--teal),var(--teal-d));color:#fff;border-color:transparent}
.stato-fat{font-size:12px;font-weight:700;white-space:nowrap}
.stato-aperta{color:var(--amber)}.stato-pagata{color:var(--pos)}.stato-rimborsata{color:var(--teal-d)}

/* ====== Direzione A · chip di stato semantiche (pallino + etichetta) ====== */
.stchip{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;padding:3px 9px;
  border-radius:99px;border:1px solid transparent;white-space:nowrap;line-height:1.4;vertical-align:middle}
.stchip .dot{width:7px;height:7px;border-radius:50%;flex:0 0 auto}
.st-open{background:#fbf1de;color:#a9720a;border-color:#f0dcb0}.st-open .dot{background:#c8920a}
.st-paid{background:#e6f6ee;color:#0b8458;border-color:#bfe6cf}.st-paid .dot{background:#12a866}
.st-ref{background:#eef4fb;color:#2563c9;border-color:#cfe0f3}.st-ref .dot{background:#2f6fe0}
.st-null{background:#f6f0f0;color:#8a4a44;border-color:#e6d2d0;text-decoration:line-through}.st-null .dot{background:#b06a62}
.st-warn{background:#fbe9e7;color:#c8362f;border-color:#f3ccc7}.st-warn .dot{background:#d9463d}
.st-ok{background:#e6f6ee;color:#0b8458;border-color:#bfe6cf}.st-ok .dot{background:#12a866}

/* ====== Direzione A · stat-strip (numeri chiave compatti nelle pagine operative) ====== */
.statstrip{display:flex;background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  overflow:hidden;box-shadow:var(--sh);margin-bottom:20px}
.statstrip .cell{flex:1;padding:13px 16px;border-left:1px solid var(--line-2);display:flex;flex-direction:column;gap:2px;min-width:0}
.statstrip .cell:first-child{border-left:0}
.statstrip .v{font-family:var(--font-head);font-size:20px;font-weight:700;font-variant-numeric:tabular-nums;
  color:var(--ink);line-height:1.1;letter-spacing:-.01em;display:flex;align-items:baseline;gap:5px;flex-wrap:wrap}
.statstrip .v small{font-size:11px;font-weight:700;color:var(--muted)}
.statstrip .v.inc{color:#0b7a50}.statstrip .v.rim{color:#9a6700}
.statstrip .k{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.statstrip .accent{margin-top:6px;height:3px;border-radius:2px;background:linear-gradient(90deg,var(--teal),var(--emerald));opacity:.4}
@media(max-width:640px){.statstrip{flex-wrap:wrap}.statstrip .cell{flex:1 1 50%;border-top:1px solid var(--line-2)}
  .statstrip .cell:nth-child(1),.statstrip .cell:nth-child(2){border-top:0}}

/* ====== Direzione A · tabella contatori a riga espandibile ====== */
.tab-cont .exp-cell{width:34px;padding-left:10px;padding-right:0;text-align:center}
.exp-btn{width:22px;height:22px;border-radius:6px;border:1px solid var(--line);background:#fff;color:var(--muted);
  font-size:11px;cursor:pointer;display:inline-grid;place-items:center;transition:transform .15s,border-color .15s,color .15s;line-height:1}
.exp-btn:hover{border-color:var(--teal);color:var(--teal-d)}
.exp-btn.is-open{transform:rotate(90deg);border-color:var(--teal);color:var(--teal-d);background:#f1fbf9}
.tab-cont .exp-row td{background:#f7fbfd;border-top:1px dashed var(--line);padding-top:10px;padding-bottom:12px}
.cont-det{display:flex;gap:24px;flex-wrap:wrap}
.cont-det > div{display:flex;flex-direction:column;gap:2px}
.cont-det .k{font-size:10px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.cont-det .k .muted{font-weight:600;letter-spacing:0;text-transform:none}
.cont-det .n{font-size:13.5px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
@media(prefers-reduced-motion:reduce){.exp-btn{transition:none}}
.azioni-fat{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.azioni-fat .stampa-fat{display:flex;gap:4px;align-items:center}
.azioni-fat select{padding:6px 8px;border:1px solid var(--line);border-radius:8px;font:inherit;font-size:13px;background:#fff}
.badge-resp{background:rgba(139,92,246,.16);color:#7c3aed;font-size:11px;font-weight:700;padding:2px 8px;border-radius:6px}

/* === Sottosezioni (schede) di Comunità & Contatori ===
   Barra "segmented control": viste (con contatore numerico) + azioni di creazione separate. */
.sub-tabs{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 18px;background:var(--card);
  border:1px solid var(--line);border-radius:14px;padding:8px;box-shadow:0 1px 4px rgba(10,40,60,.06)}
.st-gruppo{display:flex;gap:6px;flex-wrap:wrap}
.st-azioni{margin-left:auto;padding-left:12px;border-left:1px dashed var(--line)}
.sub-tab{display:inline-flex;align-items:center;gap:7px;padding:9px 14px;border-radius:10px;font-weight:700;
  font-size:14px;color:var(--muted);border:1px solid transparent;transition:background .15s,color .15s,border-color .15s}
.sub-tab .st-ico{font-size:15px;line-height:1;opacity:.85}
.sub-tab:hover{color:var(--teal-d);background:var(--line-2);text-decoration:none}
.sub-tab.on{color:#fff;background:linear-gradient(135deg,var(--teal),var(--teal-d));
  box-shadow:0 3px 10px rgba(16,182,168,.35);border-color:transparent}
.sub-tab.on .st-ico{opacity:1}
.sub-tab .st-n{min-width:22px;height:22px;padding:0 7px;border-radius:11px;display:inline-flex;align-items:center;
  justify-content:center;font-size:12px;font-weight:800;background:var(--line-2);color:var(--muted)}
.sub-tab.on .st-n{background:rgba(255,255,255,.28);color:#fff}
.sub-tab-crea{border:1.5px dashed var(--line);color:var(--teal-d);font-weight:600}
.sub-tab-crea:hover{border-color:var(--teal);background:rgba(16,182,168,.08);color:var(--teal-d)}
.sub-tab-crea.on{border-style:solid}
@media(max-width:760px){
  .sub-tabs{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding:6px;gap:8px}
  .st-gruppo{flex-wrap:nowrap}
  .st-azioni{padding-left:8px}
  .sub-tab{white-space:nowrap;padding:9px 12px}
}
.storico-pod{border-left:4px solid var(--teal)}
.storico-pod .riga-attuale td{background:rgba(16,182,168,.09);font-weight:600}

/* === Rifiniture mobile (audit responsive) === */
@media(max-width:560px){
  /* target tap più grandi (~40-44px) nelle tabelle */
  .btn-icon{width:40px;height:40px}
  .azioni{gap:8px}
  .tag-dl,.btn-mini{padding:9px 13px}
  /* dropdown ricerca: più compatto, nascondi la chip-tipo per dare spazio al nome */
  .ricerca-drop{max-height:70vh}
  .ricerca-item{padding:11px 14px}
  .ri-t{display:none}
}
@media(max-width:480px){
  /* barre "spazio hosting": la track va a tutta larghezza sotto l'etichetta, non schiacciata */
  .spazio-barra{grid-template-columns:1fr auto;gap:4px 10px}
  .sb-lab{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .sb-track{grid-column:1 / -1;order:3;height:8px}
  .sb-val{text-align:left}
}

/* ====== Sidebar minimizzabile (desktop): resta a sinistra, si richiude per allargare lo schermo ====== */
.sidebar{transition:margin-left .24s ease}
.sidebar-collapse{display:none;margin-left:auto;flex-shrink:0;width:30px;height:30px;border:0;border-radius:8px;cursor:pointer;
  background:rgba(255,255,255,.08);color:#bdd2e6;font-size:17px;line-height:1;place-items:center;transition:.15s}
.sidebar-collapse:hover{background:rgba(255,255,255,.18);color:#fff}
.sidebar-open{display:none;flex:0 0 auto;width:38px;height:38px;border:1px solid var(--line);border-radius:9px;cursor:pointer;
  background:var(--card);color:var(--muted);font-size:17px;line-height:1;place-items:center;transition:.15s}
.sidebar-open:hover{border-color:var(--teal);color:var(--teal-d)}
@media(min-width:881px){
  .sidebar-collapse{display:inline-grid}
  .app.sidebar-min .sidebar{margin-left:-248px}
  .app.sidebar-min .sidebar-open{display:inline-grid}
}
@media(prefers-reduced-motion:reduce){.sidebar{transition:none}}
/* ====== Set icone SVG monocrome (ereditano currentColor, via mask · CSP-safe) ====== */
.ic{display:inline-block;width:1.05em;height:1.05em;vertical-align:-.16em;background-color:currentColor;flex:0 0 auto;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain}
.ic-edit{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7'/%3E%3Cpath d='M18.5 2.5a2.12 2.12 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7'/%3E%3Cpath d='M18.5 2.5a2.12 2.12 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z'/%3E%3C/svg%3E")}
.ic-copy{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='14' height='14' x='8' y='8' rx='2' ry='2'/%3E%3Cpath d='M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='14' height='14' x='8' y='8' rx='2' ry='2'/%3E%3Cpath d='M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2'/%3E%3C/svg%3E")}
.ic-trash{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'/%3E%3Cpath d='M10 11v6M14 11v6'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'/%3E%3Cpath d='M10 11v6M14 11v6'/%3E%3C/svg%3E")}
.ic-book{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z'/%3E%3Cpath d='M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z'/%3E%3Cpath d='M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z'/%3E%3C/svg%3E")}
.ic-refresh{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M23 4v6h-6M1 20v-6h6'/%3E%3Cpath d='M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M23 4v6h-6M1 20v-6h6'/%3E%3Cpath d='M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15'/%3E%3C/svg%3E")}
.ic-undo{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 4v6h6'/%3E%3Cpath d='M3.51 15a9 9 0 1 0 2.13-9.36L1 10'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 4v6h6'/%3E%3Cpath d='M3.51 15a9 9 0 1 0 2.13-9.36L1 10'/%3E%3C/svg%3E")}
.ic-search{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='M21 21l-4.35-4.35'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='M21 21l-4.35-4.35'/%3E%3C/svg%3E")}
.ic-user{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E")}
.ic-users{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M23 21v-2a4 4 0 0 0-3-3.87M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M23 21v-2a4 4 0 0 0-3-3.87M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E")}
.ic-sliders{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21v-7M4 10V3M12 21v-9M12 8V3M20 21v-5M20 12V3M1 14h6M9 8h6M17 16h6'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21v-7M4 10V3M12 21v-9M12 8V3M20 21v-5M20 12V3M1 14h6M9 8h6M17 16h6'/%3E%3C/svg%3E")}
.ic-invoice{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 2v6h6M9 13h6M9 17h6M9 9h1'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 2v6h6M9 13h6M9 17h6M9 9h1'/%3E%3C/svg%3E")}
.ic-archive{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 8v13H3V8'/%3E%3Cpath d='M1 3h22v5H1z'/%3E%3Cpath d='M10 12h4'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 8v13H3V8'/%3E%3Cpath d='M1 3h22v5H1z'/%3E%3Cpath d='M10 12h4'/%3E%3C/svg%3E")}
.ic-chart{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 20V10M12 20V4M6 20v-6'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 20V10M12 20V4M6 20v-6'/%3E%3C/svg%3E")}
.ic-home{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z'/%3E%3Cpath d='M9 22V12h6v10'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z'/%3E%3Cpath d='M9 22V12h6v10'/%3E%3C/svg%3E")}
.ic-sun{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2v2M12 20v2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M2 12h2M20 12h2M6.3 17.7l-1.4 1.4M19.1 4.9l-1.4 1.4'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2v2M12 20v2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M2 12h2M20 12h2M6.3 17.7l-1.4 1.4M19.1 4.9l-1.4 1.4'/%3E%3C/svg%3E")}
.ic-check{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E")}
.ic-download{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4M7 10l5 5 5-5M12 15V3'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4M7 10l5 5 5-5M12 15V3'/%3E%3C/svg%3E")}
.ic-reply{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 17l-5-5 5-5'/%3E%3Cpath d='M4 12h11a5 5 0 0 1 0 10h-1'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 17l-5-5 5-5'/%3E%3Cpath d='M4 12h11a5 5 0 0 1 0 10h-1'/%3E%3C/svg%3E")}
.ic-upload{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4M17 8l-5-5-5 5M12 3v12'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4M17 8l-5-5-5 5M12 3v12'/%3E%3C/svg%3E")}
.ic-printer{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9V2h12v7M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2'/%3E%3Cpath d='M6 14h12v8H6z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9V2h12v7M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2'/%3E%3Cpath d='M6 14h12v8H6z'/%3E%3C/svg%3E")}
.ic-eye{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E")}
.ic-plus{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E")}
.ic-grid{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='1'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='1'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1'/%3E%3C/svg%3E")}
.ic-network{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='18' cy='5' r='3'/%3E%3Ccircle cx='6' cy='12' r='3'/%3E%3Ccircle cx='18' cy='19' r='3'/%3E%3Cpath d='M8.6 13.5l6.8 4M15.4 6.5l-6.8 4'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='18' cy='5' r='3'/%3E%3Ccircle cx='6' cy='12' r='3'/%3E%3Ccircle cx='18' cy='19' r='3'/%3E%3Cpath d='M8.6 13.5l6.8 4M15.4 6.5l-6.8 4'/%3E%3C/svg%3E")}
.ic-database{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cellipse cx='12' cy='5' rx='9' ry='3'/%3E%3Cpath d='M3 5v14a9 3 0 0 0 18 0V5M3 12a9 3 0 0 0 18 0'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cellipse cx='12' cy='5' rx='9' ry='3'/%3E%3Cpath d='M3 5v14a9 3 0 0 0 18 0V5M3 12a9 3 0 0 0 18 0'/%3E%3C/svg%3E")}
.ic-history{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3v5h5'/%3E%3Cpath d='M3.05 13A9 9 0 1 0 6 5.3L3 8'/%3E%3Cpath d='M12 7v5l4 2'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3v5h5'/%3E%3Cpath d='M3.05 13A9 9 0 1 0 6 5.3L3 8'/%3E%3Cpath d='M12 7v5l4 2'/%3E%3C/svg%3E")}
.ic-sigma{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 4H6l7 8-7 8h12'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 4H6l7 8-7 8h12'/%3E%3C/svg%3E")}
.ic-shield{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z'/%3E%3C/svg%3E")}
.ic-table{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='2'/%3E%3Cpath d='M3 9h18M3 15h18M9 3v18M15 3v18'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='2'/%3E%3Cpath d='M3 9h18M3 15h18M9 3v18M15 3v18'/%3E%3C/svg%3E")}
.ic-zap{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 2L3 14h9l-1 8 10-12h-9z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 2L3 14h9l-1 8 10-12h-9z'/%3E%3C/svg%3E")}
.ic-external{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6M15 3h6v6M10 14L21 3'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6M15 3h6v6M10 14L21 3'/%3E%3C/svg%3E")}
.ic-save{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z'/%3E%3Cpath d='M17 21v-8H7v8M7 3v5h8'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z'/%3E%3Cpath d='M17 21v-8H7v8M7 3v5h8'/%3E%3C/svg%3E")}

/* ====== Pulizia design (B tabelle · D card · E label) ====== */
/* B · tabelle più leggere: header senza fondo grigio, solo linea; più respiro */
.tab th{background:transparent;border-bottom:1.5px solid var(--line);color:var(--muted);padding-top:12px;padding-bottom:12px}
.tab td{padding-top:12px;padding-bottom:12px}
.tab-wrap{border-color:var(--line-2)}
.tab tbody tr:hover{background:var(--line-2)}
/* D · card a cornice singola: ombra morbida che definisce il bordo, niente doppia cornice */
.card{border-color:transparent;box-shadow:0 1px 2px rgba(13,38,59,.04),0 8px 24px -10px rgba(13,38,59,.16)}
/* E · etichette maiuscole coerenti + icone allineate nei titoli/bottoni */
.tab th,.kpi-lbl,.statstrip .k,.cont-det .k,.sub-sezione{letter-spacing:.05em}
.card-head h2,.btn,.nav-item,.dl,.portale-nav a{display:inline-flex;align-items:center;gap:8px}
.card-head h2{gap:9px}
.nav-item .ic{width:1.15em;height:1.15em}
.btn .ic,.btn-icon .ic{width:1.05em;height:1.05em}
.btn-icon{font-size:15px}

/* ============================================================
   Sistema di micro-animazioni "Corrente condivisa"
   Puro CSS · CSP-safe (nessun JS inline) · solo palette.
   Il moto perpetuo è riservato alle superfici che significano
   "sto lavorando" (barra elaborazione, contatore connesso).
   ============================================================ */

/* (1) CORRENTE ELETTRICA — barra di avanzamento elaborazione.
   Una banda di luce bianca traslucida scorre sulla base emerald→teal:
   luce che passa in un cavo. ~2.2s = "sta calcolando". */
.up-fill.elaborazione{
  background:
    linear-gradient(100deg,
      rgba(255,255,255,0)   38%,
      rgba(255,255,255,.55) 50%,
      rgba(255,255,255,0)   62%) -60% 0 / 220% 100% no-repeat,
    linear-gradient(120deg, var(--emerald), var(--teal-d));
  animation:lmc-current 2.2s linear infinite;
}
@keyframes lmc-current{ from{background-position:-60% 0,0 0} to{background-position:160% 0,0 0} }

/* (2) LOGO "ENERGIZE" — anello di carica sul brand-mark (hover;
   un saluto una-tantum sul mark grande del login). */
.brand-mark{position:relative}
.brand-mark::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:0 0 0 0 rgba(15,176,163,0)}
.brand-mark:hover::after{animation:lmc-charge 1.4s ease-out}
.brand-mark.big::after{animation:lmc-charge 2s ease-out 1}
@keyframes lmc-charge{
  0%{box-shadow:0 0 0 0 rgba(15,176,163,.30)}
  60%{box-shadow:0 0 0 7px rgba(15,176,163,0)}
  100%{box-shadow:0 0 0 0 rgba(15,176,163,0)}
}

/* (3) ICONA NAV ATTIVA — comparsa "carica" one-shot. */
.nav-item.attivo .nav-ico .ic{animation:lmc-nav-charge .5s ease-out backwards}
@keyframes lmc-nav-charge{ 0%{opacity:.55;transform:translateX(-2px)} 100%{opacity:1;transform:translateX(0)} }

/* (4) SHEEN BOTTONE PRIMARIO — su hover e su focus da tastiera. */
.btn-primary{position:relative;overflow:hidden}
.btn-primary::after{content:"";position:absolute;top:0;left:-60%;width:45%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.32),transparent);
  transform:skewX(-18deg);opacity:0;pointer-events:none}
.btn-primary:hover::after,.btn-primary:focus-visible::after{animation:lmc-btn-sheen .7s ease-out}
@keyframes lmc-btn-sheen{ 0%{left:-60%;opacity:0} 25%{opacity:1} 100%{left:130%;opacity:0} }

/* (5) ACCENT STATSTRIP "POWER-ON" — draw-in scaleX one-shot. */
.statstrip .cell .accent{transform-origin:left center;animation:lmc-poweron .6s cubic-bezier(.22,.61,.36,1) both}
@keyframes lmc-poweron{ 0%{transform:scaleX(0);opacity:0} 100%{transform:scaleX(1);opacity:.4} }

/* (6) ENTRATA KPI / CARD — sollevamento calmo, KPI sfalsati. */
.kpi,.card{animation:lmc-rise .5s cubic-bezier(.2,.7,.3,1) backwards}
.kpi:nth-child(2){animation-delay:.06s}
.kpi:nth-child(3){animation-delay:.12s}
.kpi:nth-child(4){animation-delay:.18s}
@keyframes lmc-rise{ 0%{opacity:0;transform:translateY(6px)} 100%{opacity:1;transform:translateY(0)} }

/* (7) DROPZONE — anello di carica mentre si trascina il file. */
.drop-ico{position:relative;transition:transform .15s ease}
.drop-ico::before{content:"";position:absolute;inset:-6px;border-radius:50%;box-shadow:0 0 0 0 rgba(15,176,163,0);pointer-events:none}
.drop:hover .drop-ico{transform:translateY(-1px)}
.drop:hover .drop-ico::before{animation:lmc-ico-charge 1.8s ease-in-out infinite}
@keyframes lmc-ico-charge{ 0%,100%{box-shadow:0 0 0 0 rgba(15,176,163,0)} 50%{box-shadow:0 0 0 6px rgba(15,176,163,.14)} }

/* (8) BATTITO "CONNESSO" — solo il contatore Kamstrup connesso pulsa. */
.stato-connesso .dot{animation:lmc-live-beat 2.6s ease-in-out infinite}
@keyframes lmc-live-beat{ 0%,100%{box-shadow:0 0 0 3px rgba(11,132,88,.22)} 50%{box-shadow:0 0 0 5px rgba(11,132,88,.08)} }

/* --- prefers-reduced-motion: stati finali statici, on-brand --- */
@media (prefers-reduced-motion: reduce){
  .up-fill.elaborazione{background:linear-gradient(120deg,var(--emerald),var(--teal-d));animation:none}
  .brand-mark::after,.brand-mark:hover::after,.brand-mark.big::after{animation:none;box-shadow:none}
  .nav-item.attivo .nav-ico .ic{animation:none;opacity:1;transform:none}
  .btn-primary::after,.btn-primary:hover::after,.btn-primary:focus-visible::after{animation:none;opacity:0}
  .statstrip .cell .accent{animation:none;transform:none;opacity:.4}
  .kpi,.card{animation:none;opacity:1;transform:none}
  .drop-ico::before,.drop:hover .drop-ico::before{animation:none;box-shadow:none}
  .drop:hover .drop-ico{transform:none}
  .stato-connesso .dot{animation:none;box-shadow:0 0 0 3px rgba(11,132,88,.2)}
}

/* ============================================================
   PWA — bottone "Installa app" + modale istruzioni iPhone/Android
   ============================================================ */
.nav-install{margin:6px 0 2px;background:rgba(255,255,255,.05);border:1px dashed rgba(255,255,255,.16);color:#cfe0ef;cursor:pointer;font:inherit;font-weight:600;width:100%;text-align:left}
.nav-install:hover{background:rgba(16,182,168,.16);border-color:rgba(16,182,168,.5);color:#fff}
.btn-install-top{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:9px;padding:7px 12px;font-size:13px;font-weight:600;cursor:pointer}
.btn-install-top:hover{background:rgba(255,255,255,.18)}
.btn-install-top .ic{width:1.05em;height:1.05em}
.pwa-modal{position:fixed;inset:0;z-index:130;display:grid;place-items:center;padding:20px}
.pwa-modal[hidden]{display:none}
.pwa-ov{position:absolute;inset:0;background:rgba(6,14,22,.55)}
.pwa-card{position:relative;background:var(--card);border-radius:18px;max-width:430px;width:100%;padding:26px 24px 22px;box-shadow:0 30px 70px -18px rgba(4,12,20,.6);animation:pwaIn .22s ease}
@keyframes pwaIn{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
.pwa-x{position:absolute;top:12px;right:12px;width:30px;height:30px;border:0;background:var(--line-2);border-radius:8px;color:var(--muted);cursor:pointer;font-size:14px;line-height:1}
.pwa-x:hover{background:var(--line);color:var(--ink)}
.pwa-mark{width:52px;height:52px;border-radius:14px;background:linear-gradient(140deg,var(--teal),var(--emerald));display:grid;place-items:center;margin-bottom:14px;box-shadow:0 8px 20px rgba(16,182,168,.35);color:#fff}
.pwa-mark svg{width:30px;height:30px}
.pwa-card h3{font-family:var(--font-head);font-size:19px;margin:0 0 4px;color:var(--ink)}
.pwa-card>p{margin:0 0 8px;color:var(--muted);font-size:13.5px}
.pwa-os{margin-top:14px;padding:13px 15px;border:1px solid var(--line);border-radius:12px;background:var(--line-2)}
.pwa-os>strong{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--ink);margin-bottom:7px}
.pwa-os ol{margin:0;padding-left:18px;color:var(--ink-2);font-size:13px;line-height:1.75}
.pwa-os b{color:var(--ink)}
.pwa-key{display:inline-block;min-width:18px;text-align:center;padding:0 5px;border:1px solid var(--line);border-radius:5px;background:#fff;font-weight:700;font-size:12px}
/* modale consapevole del dispositivo: mostra solo i passi del sistema rilevato */
.pwa-modal.pwa-ios .pwa-os-android{display:none}
.pwa-modal.pwa-android .pwa-os-ios{display:none}
.pwa-safari-note{display:none;margin-top:12px;padding:10px 12px;border:1px solid #e7c473;background:#fef6e7;border-radius:10px;font-size:12.5px;color:#7a5b06;line-height:1.5}
.pwa-safari-note .ic{flex:none;margin-top:2px}
.pwa-modal.pwa-notsafari .pwa-safari-note{display:flex;gap:7px;align-items:flex-start}
@media(prefers-reduced-motion:reduce){.pwa-card{animation:none}}

/* --- Logo "Nodo" dentro i quadrati brand + barra mobile --- */
.brand-mark svg{width:58%;height:58%;display:block;color:#fff}
.brand-mark.big svg{width:56%;height:56%}
.mobile-brand{align-items:center}
.mobile-mark{display:inline-flex;align-items:center;font-size:0}
.mobile-mark svg{width:20px;height:20px;color:#fff}

/* --- Badge modulo (Registro modifiche, Team) --- */
.mod-badge{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.04em;padding:2px 7px;border-radius:6px;text-transform:uppercase;white-space:nowrap}
.mod-lmc{background:rgba(16,182,168,.14);color:#0a7a70}
.mod-impianti{background:rgba(37,99,235,.12);color:#1d4ed8}
.mod-edm{background:rgba(124,58,237,.13);color:#6d28d9}
.mod-accesso,.badge-sys{background:var(--line-2);color:var(--muted)}
/* checkbox moduli in Team */
.moduli-pick{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.moduli-pick label{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:9px;padding:7px 11px;font-size:13px;font-weight:600;cursor:pointer;background:#fff}
.moduli-pick label:hover{border-color:var(--teal)}
.moduli-pick input{width:auto;margin:0}
.moduli-pick .mp-desc{color:var(--muted);font-weight:400;font-size:11.5px}
.moduli-row{display:inline-flex;flex-wrap:wrap;gap:5px;align-items:center}
.mod-check{display:inline-flex;align-items:center;gap:3px;font-size:11px;font-weight:700;border:1px solid var(--line);border-radius:6px;padding:2px 6px;cursor:pointer}
.mod-check input{width:auto;margin:0}

/* ═══ NAVIGAZIONE HUB → MODULO (home a card + sidebar per modulo) ═══ */
/* Home: card dei moduli */
.home-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:18px;margin:6px 0 20px}
.home-card{display:flex;flex-direction:column;gap:10px;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r);padding:22px 22px 18px;text-decoration:none;color:var(--ink);box-shadow:var(--sh-sm);
  position:relative;overflow:hidden;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.home-card::before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:linear-gradient(180deg,var(--teal),var(--emerald))}
.home-card:hover{transform:translateY(-3px);box-shadow:var(--sh);border-color:var(--teal);text-decoration:none}
.home-card h2{font-family:var(--font-head);font-size:18px;margin:0;color:var(--navy);line-height:1.25}
.hc-head{display:flex;align-items:center;gap:10px}
.hc-sigla{font-family:var(--font-head);font-size:11.5px;font-weight:700;letter-spacing:.1em;color:var(--teal-d);
  background:rgba(15,176,163,.1);border:1px solid rgba(15,176,163,.3);border-radius:20px;padding:3px 11px}
.hc-ico{margin-left:auto;font-size:22px;color:var(--teal);opacity:.85}
.hc-warn{font-size:11px;font-weight:800;color:#a9720a;background:#fbf1de;border:1px solid #f0dcb0;border-radius:20px;padding:3px 10px}
.hc-desc{font-size:13px;color:var(--muted);margin:0;min-height:38px}
.hc-kpis{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13px;color:var(--ink-2);padding:10px 0;border-top:1px solid var(--line-2)}
.hc-kpis strong{font-family:var(--font-head);font-size:17px;color:var(--navy);font-variant-numeric:tabular-nums;margin-right:3px}
.hc-kpis .hc-rim strong{color:var(--amber)}
.hc-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto}
.hc-cta{font-weight:700;font-size:13.5px;color:var(--teal-d);white-space:nowrap}
.home-card:hover .hc-cta{color:var(--teal)}

/* Sidebar modulo: torna ai moduli + selettore + intestazione modulo corrente */
.nav-item.nav-home{color:#9fb4c9;font-size:12.5px;padding-top:8px;padding-bottom:8px}
.mod-chips{display:flex;gap:6px;padding:2px 12px 10px;flex-wrap:wrap}
.mod-chip{font-family:var(--font-head);font-size:10.5px;font-weight:700;letter-spacing:.08em;color:#9fb4c9;
  border:1px solid rgba(255,255,255,.16);border-radius:20px;padding:3px 10px;text-decoration:none;transition:all .15s}
.mod-chip:hover{color:#fff;border-color:var(--teal);text-decoration:none}
.mod-chip.on{color:#04211e;background:var(--teal);border-color:var(--teal)}
.mod-cur{display:flex;align-items:center;gap:9px;font-family:var(--font-head);font-size:12.5px;font-weight:700;
  color:#e7f4f2;padding:10px 12px;margin:2px 0 6px;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08);line-height:1.3}
.mod-cur-ico{color:var(--teal);font-size:15px;flex:0 0 auto}
.nav-item.nav-sec{font-size:12.5px;opacity:.85}

/* Sidebar piattaforma: mini indicatore spazio */
/* Riquadro «spazio» della barra laterale. Nome PROPRIO e non .spazio-mini: quella è la
   barretta sottile della dashboard e porta flex:1, che qui — dentro una colonna flessibile —
   faceva allungare il riquadro fino a riempire tutto il vuoto sotto il menu. */
.spazio-nav{margin:12px 12px 4px;padding:10px 12px;border:1px solid rgba(255,255,255,.1);
  border-radius:10px;flex:0 0 auto}
.spazio-nav .sm-top{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:#9fb4c9;margin-bottom:7px}
.spazio-nav .sm-top strong{color:#e7f4f2;font-variant-numeric:tabular-nums}
.spazio-nav .sm-track{height:5px;border-radius:3px;background:rgba(255,255,255,.12);overflow:hidden}
.spazio-nav .sm-fill{display:block;height:100%;border-radius:3px;background:linear-gradient(90deg,var(--teal),var(--emerald))}
.spazio-nav .sm-fill.pieno{background:linear-gradient(90deg,#c87f08,#d63a3a)}
@media(max-width:640px){.home-cards{grid-template-columns:1fr}}

/* ═══ GESTIONALE IMPIANTI: avvisi, cantieri, CRUD ═══ */
.btn-mini{padding:4px 10px;font-size:11.5px;border-radius:8px}
.chip-doc{display:inline-block;font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:12px;
  background:var(--line-2);color:var(--ink-2);border:1px solid var(--line);margin:1px 0}
.chip-doc-warn{background:#fbe9e7;color:#c8362f;border-color:#f3ccc7}
.check-inline{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:500;cursor:pointer}
.check-inline input[type=checkbox]{width:15px;height:15px;accent-color:var(--teal)}

/* ═══ SUGGERITORE CONTRATTO (form avvisi) ═══ */
.sugg-box{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:7px}
.sugg-lbl{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.sugg-item{font:inherit;font-size:12.5px;font-weight:600;color:var(--teal-d);background:rgba(15,176,163,.07);
  border:1px solid rgba(15,176,163,.35);border-radius:20px;padding:4px 12px;cursor:pointer;transition:all .15s}
.sugg-item:hover{background:var(--teal);color:#fff;border-color:var(--teal)}
.sugg-item.forte{border-width:2px;font-weight:700}

/* ═══ UX: Da fare oggi · guida contestuale · benvenuto · assistente ═══ */
.dafare{border-left:4px solid var(--teal)}
.df-lista{display:flex;flex-direction:column;gap:6px}
.df-riga{display:flex;align-items:center;gap:12px;padding:10px 14px;border:1px solid var(--line-2);border-radius:10px;
  text-decoration:none;color:var(--ink);transition:all .15s;background:var(--card)}
.df-riga:hover{border-color:var(--teal);transform:translateX(3px);text-decoration:none}
.df-n{min-width:34px;height:26px;border-radius:13px;display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--font-head);font-weight:700;font-size:13px;padding:0 8px}
.df-1 .df-n{background:#fbe9e7;color:#c8362f}
.df-2 .df-n{background:#fbf1de;color:#a9720a}
.df-3 .df-n{background:#eef4fb;color:#2563c9}
.df-txt{flex:1;font-size:13.5px;font-weight:600}
.df-vai{color:var(--teal-d);font-weight:700;opacity:0;transition:opacity .15s}
.df-riga:hover .df-vai{opacity:1}

.guida-btn{width:34px;height:34px;border-radius:50%;border:1.5px solid var(--line);background:var(--card);
  color:var(--teal-d);font-weight:800;font-size:15px;cursor:pointer;flex:0 0 auto;transition:all .15s}
.guida-btn:hover,.guida-btn[aria-expanded="true"]{background:var(--teal);border-color:var(--teal);color:#fff}
.guida-panel{position:relative;margin:0 0 14px;background:var(--card);border:1px solid var(--line);border-left:4px solid var(--teal);
  border-radius:var(--r-sm);padding:14px 18px;box-shadow:var(--sh-sm);font-size:13.5px}
.guida-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}
.guida-head strong{font-family:var(--font-head);font-size:14.5px;color:var(--navy)}
.guida-x{border:0;background:none;color:var(--muted);font-size:14px;cursor:pointer;padding:4px}
.guida-x:hover{color:var(--ink)}
.guida-cos{color:var(--ink-2);margin:0 0 8px;max-width:75ch}
.guida-fai{margin:0 0 10px;padding-left:20px}
.guida-fai li{margin:3px 0;color:var(--ink-2)}
.guida-passo{margin:0;padding:8px 12px;background:rgba(16,182,168,.07);border-radius:8px;color:var(--teal-d)}

.benvenuto-banner{display:flex;align-items:center;gap:16px;background:linear-gradient(135deg,var(--navy),var(--navy-3));
  color:#e7f4f2;border-radius:var(--r);padding:16px 20px;margin:0 0 18px;box-shadow:var(--sh)}
.benvenuto-banner strong{color:#fff}
.bb-punti{display:block;margin-top:4px;font-size:13px;color:#b7cbd9;line-height:1.7}
.bb-punti strong{color:var(--teal)}
.bb-x{margin-left:auto;flex:0 0 auto;border:1.5px solid rgba(255,255,255,.3);background:rgba(255,255,255,.08);color:#fff;
  border-radius:10px;padding:8px 16px;font-weight:700;font-size:13px;cursor:pointer;transition:all .15s}
.bb-x:hover{background:var(--teal);border-color:var(--teal)}
.briciole{margin:0 0 10px;font-size:13px}
.briciole a{color:var(--muted);text-decoration:none;font-weight:600}
.briciole a:hover{color:var(--teal-d)}

/* voci Risposta/Azione dell'assistente nel menu ricerca */
.ricerca-item .ri-ic{font-size:14px}
@media(max-width:640px){.benvenuto-banner{flex-direction:column;align-items:flex-start}.bb-x{margin-left:0}}

/* ═══ HOME A TUTTO SCHERMO (solo desktop): menu nascosto + ☰ pulsante ═══ */
@media(min-width:881px){
  .home-full .content{max-width:1240px;margin:0 auto;width:100%}
  .home-full .portale-benvenuto{text-align:center;margin-top:14px}
  .home-full .portale-benvenuto h1{font-size:34px}
  .home-full .portale-benvenuto .muted{font-size:15px}
  .home-full .home-cards{grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:26px;margin-top:14px}
  .home-full .home-card{padding:28px 26px 22px}
  .home-full .home-card h2{font-size:20px}
  .home-full .benvenuto-banner{max-width:1240px;margin-left:auto;margin-right:auto}
  /* il ☰ chiama l'attenzione: anello teal che respira */
  .home-full .sidebar-open{position:relative;border-color:var(--teal);color:var(--teal-d)}
  .home-full .sidebar-open::after{content:"";position:absolute;inset:-4px;border-radius:12px;
    border:2px solid var(--teal);opacity:0;animation:lmc-menu-pulse 2.2s ease-out infinite;pointer-events:none}
  @keyframes lmc-menu-pulse{0%{opacity:.7;transform:scale(.92)}70%{opacity:0;transform:scale(1.22)}100%{opacity:0}}
}
@media(prefers-reduced-motion:reduce){.home-full .sidebar-open::after{animation:none;opacity:.35}}

/* ═══ MOVIMENTO FUNZIONALE: caricamenti, riempimenti, completamenti ═══ */
/* barra di corrente in cima durante i cambi pagina */
#nav-progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:9999;background:rgba(15,176,163,.14);overflow:hidden}
#nav-progress span{position:absolute;top:0;bottom:0;width:38%;border-radius:3px;
  background:linear-gradient(90deg,var(--teal),var(--emerald));animation:lmc-nav-run 1s ease-in-out infinite}
@keyframes lmc-nav-run{0%{left:-40%}100%{left:105%}}

/* overlay «elaborazione in corso» con cronometro (form data-elabora) */
.elab-overlay{position:fixed;inset:0;z-index:9998;background:rgba(10,28,46,.45);backdrop-filter:blur(2px);
  display:flex;align-items:center;justify-content:center;animation:lmc-fade .25s ease both}
.elab-box{background:var(--card);border-radius:var(--r);box-shadow:var(--sh);padding:26px 36px;text-align:center;min-width:320px;max-width:90vw}
.elab-bar{height:6px;border-radius:3px;background:var(--line-2);overflow:hidden;margin-bottom:14px}
.elab-bar span{display:block;height:100%;width:40%;border-radius:3px;
  background:linear-gradient(90deg,var(--teal),var(--emerald));animation:lmc-nav-run 1.1s ease-in-out infinite}
.elab-msg{font-family:var(--font-head);font-weight:700;color:var(--navy)}
.elab-sec{margin-top:6px;color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums}
@keyframes lmc-fade{from{opacity:0}to{opacity:1}}

/* barre di riempimento: si "caricano" da sinistra all'apertura della pagina */
.sm-fill,.sb-fill{transform-origin:left center;animation:lmc-fill .9s cubic-bezier(.22,.61,.36,1) both}
@keyframes lmc-fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* flash: entrata morbida + spunta che "scatta" sui successi (lavoro completato) */
.flash{animation:lmc-flash-in .35s ease both}
@keyframes lmc-flash-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.flash-ok::before{content:"✓";display:inline-flex;width:20px;height:20px;border-radius:50%;flex:0 0 auto;
  background:#0b7a50;color:#fff;align-items:center;justify-content:center;font-size:12px;font-weight:800;
  margin-right:9px;vertical-align:-4px;animation:lmc-pop .45s cubic-bezier(.34,1.56,.64,1) .15s both}
@keyframes lmc-pop{from{transform:scale(0)}to{transform:scale(1)}}

/* «Da fare oggi»: le righe entrano in cascata; stato "tutto a posto" col check che scatta */
.df-riga{animation:lmc-rise .35s ease both}
.df-riga:nth-child(2){animation-delay:.05s}.df-riga:nth-child(3){animation-delay:.1s}
.df-riga:nth-child(4){animation-delay:.15s}.df-riga:nth-child(5){animation-delay:.2s}
.df-riga:nth-child(6){animation-delay:.25s}.df-riga:nth-child(7){animation-delay:.3s}
.dafare-ok{border-left:4px solid #0b7a50}
.df-fatto{display:flex;align-items:center;gap:14px;font-size:14px}
.df-check{width:34px;height:34px;border-radius:50%;background:#0b7a50;color:#fff;display:inline-flex;
  align-items:center;justify-content:center;font-size:16px;font-weight:800;flex:0 0 auto;
  animation:lmc-pop .5s cubic-bezier(.34,1.56,.64,1) .2s both}

/* ☰ apri-menu: SEMPRE ben visibile (non solo in home) */
.sidebar-open{width:42px;height:42px;font-size:17px;border:2px solid var(--teal);color:var(--teal-d);
  background:var(--card);border-radius:11px;box-shadow:0 2px 10px rgba(15,176,163,.28)}
.sidebar-open:hover{background:var(--teal);border-color:var(--teal);color:#fff}
@media(min-width:881px){
  .home-full .sidebar-open{background:linear-gradient(135deg,var(--teal),var(--teal-d));border-color:transparent;color:#fff}
}

/* rispetto per chi riduce le animazioni: stati finali statici, barre indeterminate ferme */
@media(prefers-reduced-motion:reduce){
  #nav-progress span,.elab-bar span{animation:none;width:100%;opacity:.55}
  .sm-fill,.sb-fill,.flash,.df-riga{animation:none}
  .flash-ok::before,.df-check{animation:none}
}

/* ═══ INGRESSO: manina che saluta + zoom d'apertura della home ═══ */
/* la manina saluta all'arrivo (3 oscillazioni, poi si ferma) e ri-saluta al passaggio del mouse */
.saluto{display:inline-block;transform-origin:72% 78%;animation:lmc-saluto 1.8s ease-in-out .45s 1 both}
.portale-benvenuto h1:hover .saluto{animation:lmc-saluto 1.4s ease-in-out both}
@keyframes lmc-saluto{
  0%,100%{transform:rotate(0)}
  12%{transform:rotate(16deg)} 26%{transform:rotate(-9deg)}
  40%{transform:rotate(14deg)} 54%{transform:rotate(-6deg)}
  66%{transform:rotate(8deg)}  78%{transform:rotate(0)}
}
/* la home si "apre" con uno zoom morbido; le card arrivano una dopo l'altra */
.home-full .content{animation:lmc-zoom-in .5s cubic-bezier(.22,.61,.36,1) both}
@keyframes lmc-zoom-in{from{opacity:0;transform:scale(.955)}to{opacity:1;transform:scale(1)}}
.home-cards .home-card{animation:lmc-card-pop .55s cubic-bezier(.22,.61,.36,1) both}
.home-cards .home-card:nth-child(1){animation-delay:.15s}
.home-cards .home-card:nth-child(2){animation-delay:.25s}
.home-cards .home-card:nth-child(3){animation-delay:.35s}
.home-cards .home-card:nth-child(4){animation-delay:.45s}
@keyframes lmc-card-pop{from{opacity:0;transform:scale(.92) translateY(14px)}to{opacity:1;transform:scale(1) translateY(0)}}
@media(prefers-reduced-motion:reduce){
  .saluto,.home-full .content,.home-cards .home-card{animation:none}
}

/* ═══ RESTYLING MGII (A+B): tabelle ariose · gruppi per comune · righe progressive · liste a schede ═══ */
.tab-mgii{font-size:14.5px}
.tab-mgii th{font-size:11px}
.tab-mgii td{padding:13px 14px;vertical-align:middle}
.tab-mgii .exp-cell{width:34px;padding-right:0}
.tab-mgii .exp-row td{background:#f7fbfd;border-top:1px dashed var(--line);padding:13px 18px 15px}
.exp-det{display:flex;gap:26px;flex-wrap:wrap;font-size:13.5px;align-items:flex-start}
.exp-det>div{min-width:110px}
.exp-det .k{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700;margin-bottom:3px}
.grp-comune td{background:var(--line-2);font-weight:800;font-size:13px;padding:9px 14px;border-top:1px solid var(--line)}
.grp-comune .gc-n{color:var(--muted);font-weight:600;font-size:12px;margin-left:10px}
.grp-comune .gc-scad{color:var(--red);font-weight:700;font-size:12px;margin-left:10px}
/* liste a schede (Avvisi + Richiami): una voce = una scheda, titolo grande, meta sotto */
.lista-schede{display:flex;flex-direction:column;gap:10px}
.scheda-voce{border:1px solid var(--line);border-radius:12px;padding:12px 16px;background:#fff}
.scheda-voce:hover{border-color:#bcd8d2}
.sv-testa{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.sv-tit{font-size:15.5px;font-weight:700}
.sv-tit a{color:inherit}
.sv-meta{font-size:13px;color:var(--muted);margin-top:5px;display:flex;gap:4px 16px;flex-wrap:wrap;align-items:center}
.sv-azioni{margin-left:auto;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
@media(max-width:760px){.sv-azioni{margin-left:0;margin-top:8px;width:100%}}

/* ── MGII su mobile: tabelle ariose e schede compatte (≤880px) ── */
@media(max-width:880px){
  .tab-mgii{font-size:13.5px}
  .tab-mgii td{padding:10px 10px}
  .tab-mgii .exp-row td{padding:10px 12px 12px}
  .grp-comune td{padding:7px 10px}
  .exp-det{flex-direction:column;gap:8px}
  .exp-det>div{min-width:0}
  .scheda-voce{padding:10px 12px}
  .sv-testa{gap:6px 8px}
  .sv-tit{font-size:14.5px}
  .sv-meta{gap:3px 10px;font-size:12.5px}
}

/* ── Storico letture "modello GecoTi" (scheda contatore) ── */
.gec-testata{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px 18px;background:var(--line-2);
  border:1px solid var(--line);border-radius:10px;padding:12px 16px;margin-top:4px}
.gec-testata .k{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700;margin-bottom:2px}
.gec-testata .gec-pod{grid-column:span 2;min-width:0}
.gec-testata .gec-pod strong{word-break:break-all}
.tab-gec{font-size:14px}
.tab-gec td a{color:inherit;text-decoration:none;display:block}
.tab-gec .gec-riga:hover td{background:#f2f9ff;cursor:pointer}
.tab-gec .gec-riga.sel td{background:#e3f0fd;box-shadow:inset 0 1.5px 0 #7fb3e8, inset 0 -1.5px 0 #7fb3e8}
.tab-gec .gec-riga.sel td:first-child{box-shadow:inset 1.5px 1.5px 0 #7fb3e8, inset 0 -1.5px 0 #7fb3e8}
.gec-consumo{display:flex;gap:14px 26px;flex-wrap:wrap;align-items:center;margin-top:12px;
  border:1px solid var(--line);border-left:4px solid var(--teal);border-radius:10px;padding:10px 16px;background:#fbfdff}
.gec-consumo .gc-tit{font-weight:800;color:var(--ink, #13212e);margin-right:6px}
.gec-consumo .k{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700}
.gec-consumo strong{font-size:16px;font-variant-numeric:tabular-nums}
@media(max-width:880px){.gec-consumo{gap:10px 16px}.gec-consumo strong{font-size:14.5px}}

/* opzione «sostituisci integralmente» nell'import GII: distinta perché è distruttiva */
.opz-sostituisci{display:flex;gap:10px;align-items:flex-start;background:#fdf6e9;border:1px solid #f0dcb0;
  border-radius:10px;padding:10px 12px;margin-top:4px;font-weight:400}
.opz-sostituisci input{margin-top:3px;flex:0 0 auto}
.opz-sostituisci strong{color:#8a5d04}

/* ── GII · scelta del tipo di lettera RaSi e selezione degli impianti ── */
.tipi-lettera{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin:14px 0 6px}
.tipo-l{display:flex;flex-direction:column;gap:3px;border:1px solid var(--line);border-radius:11px;padding:11px 13px;
  background:#fff;text-decoration:none;color:var(--ink);transition:.15s}
.tipo-l:hover{border-color:var(--teal);text-decoration:none}
.tipo-l.on{border-color:var(--teal);background:rgba(16,182,168,.07);box-shadow:0 0 0 1px var(--teal) inset}
.tl-step{font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700}
.tl-nome{font-weight:700;font-size:13.5px;line-height:1.35}
.tl-term{font-size:11.5px;color:var(--muted)}
.sel-barra{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:14px 0 10px;
  padding:10px 12px;background:var(--line-2);border-radius:10px}
.riga-consigliata{background:rgba(16,182,168,.06)}
.lettere-archivio .la-riga{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:9px 0;border-bottom:1px solid var(--line-2)}
.lettere-archivio .la-riga:last-child{border-bottom:0}
.lettere-archivio .la-num{font-weight:700;font-variant-numeric:tabular-nums}
.lettere-archivio .la-az{margin-left:auto;display:flex;gap:6px}
@media (max-width:560px){.sel-barra{gap:6px}.sel-barra .btn{flex:1 1 auto}}
.tl-n{display:inline-block;margin-left:6px;background:var(--teal);color:#fff;border-radius:99px;
  padding:1px 7px;font-size:10.5px;font-weight:700;letter-spacing:0}
/* colonne ordinabili: intestazioni cliccabili delle liste lunghe */
.tab-ord thead th{cursor:pointer;user-select:none;position:relative;padding-right:16px}
.tab-ord thead th:hover{color:var(--teal-d)}
.tab-ord thead th::after{content:'';position:absolute;right:4px;top:50%;margin-top:-2px;
  border:4px solid transparent;opacity:0}
.tab-ord thead th.ord-su::after{border-bottom-color:currentColor;margin-top:-6px;opacity:.7}
.tab-ord thead th.ord-giu::after{border-top-color:currentColor;opacity:.7}
.tab-ord thead th:last-child{cursor:default}

/* ── «Ordina per»: pastiglie sopra le liste lunghe (scelta lato server) ── */
.ord-barra{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin:0 0 12px}
.ord-et{font-size:11.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-weight:700;margin-right:2px}
.ord-p{display:inline-block;padding:5px 11px;border:1px solid var(--line);border-radius:99px;background:#fff;
  color:var(--ink-2);font-size:12.5px;font-weight:600;text-decoration:none;transition:.15s;white-space:nowrap}
.ord-p:hover{border-color:var(--teal);color:var(--teal-d);text-decoration:none}
.ord-p.on{background:var(--teal);border-color:var(--teal);color:#fff}
.ord-p.on:hover{color:#fff}
.tab-ord-srv thead th a{color:inherit;text-decoration:none}
.tab-ord-srv thead th a:hover{color:var(--teal-d);text-decoration:none}
.tab-ord-srv thead th.ord-su a::after{content:' ↑'}
.tab-ord-srv thead th.ord-giu a::after{content:' ↓'}
.tab-ord-srv thead th.ord-su,.tab-ord-srv thead th.ord-giu{color:var(--teal-d)}
@media (max-width:560px){.ord-barra{gap:5px}.ord-p{padding:5px 9px;font-size:12px}}

/* ── Portale cliente · sintesi in cima: la risposta a «e quindi?» in una riga ── */
.sintesi{display:flex;gap:18px;align-items:center;background:linear-gradient(120deg,#f3fcfa,#f4f9ff);
  border:1px solid #d9eef2;border-radius:14px;padding:16px 18px;margin:4px 0 18px}
.sintesi-anello{--q:0;flex:0 0 auto;width:82px;height:82px;border-radius:50%;display:grid;place-items:center;
  background:conic-gradient(var(--emerald) calc(var(--q)*1%),#e3edf2 0);position:relative}
.sintesi-anello::after{content:'';position:absolute;inset:8px;border-radius:50%;background:#fff}
.sa-num{position:relative;z-index:1;font-family:var(--font-head);font-size:23px;font-weight:700;color:var(--ink);
  font-variant-numeric:tabular-nums;line-height:1}
.sa-num small{font-size:13px;font-weight:600;color:var(--muted);margin-left:1px}
.sintesi-txt{display:flex;flex-direction:column;gap:5px;min-width:0}
.sintesi-txt strong{font-size:15.5px;line-height:1.4;color:var(--ink)}
.sintesi-txt .muted{font-size:13px;line-height:1.5}
/* storico richiudibile: la tabella non deve essere la prima cosa che si vede */
.storico-cli{margin-top:20px;border-top:1px solid var(--line-2);padding-top:14px}
.storico-cli>summary{cursor:pointer;font-weight:700;font-size:14.5px;display:inline-flex;gap:8px;align-items:center;
  list-style:none;color:var(--ink-2)}
.storico-cli>summary::-webkit-details-marker{display:none}
.storico-cli>summary:hover{color:var(--teal-d)}
.storico-cli>summary::after{content:'▸';margin-left:4px;color:var(--muted);transition:transform .15s}
.storico-cli[open]>summary::after{transform:rotate(90deg);display:inline-block}
.storico-cli .tab-wrap{margin-top:12px}
.portale-nota{max-width:900px;margin:18px auto 0;color:var(--muted);font-size:13px;line-height:1.6;
  display:flex;gap:9px;align-items:flex-start}
.portale-nota .ic{flex:0 0 auto;margin-top:3px;width:15px;height:15px}
@media (max-width:560px){
  .sintesi{flex-direction:column;align-items:flex-start;gap:13px;padding:14px}
  .sintesi-anello{width:70px;height:70px}.sa-num{font-size:20px}
  .sintesi-txt strong{font-size:14.5px}
}

/* ═══════ La tua giornata — curva del cliente (pages_portale/_curva.php) ═══════ */
.cu-scelta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:2px 0 8px}
.cu-p{padding:4px 11px;border-radius:99px;border:1px solid var(--line);background:#fff;color:var(--ink-2);
  font-size:12.5px;font-weight:600}
.cu-p:hover{border-color:var(--teal);color:var(--teal-d);text-decoration:none}
.cu-p.on{background:linear-gradient(120deg,var(--teal-d),var(--emerald));border-color:transparent;color:#fff}

.cu-giorni{height:210px}
.cu-ore{height:180px}
.cu-a{cursor:pointer;outline:none}
.cu-sfondo{fill:transparent}
.cu-a:hover .cu-sfondo{fill:rgba(15,176,163,.07)}
.cu-a:focus-visible .cu-sfondo{fill:rgba(15,176,163,.12);stroke:var(--teal);stroke-width:1.5;stroke-dasharray:3 3}
.cu-sfondo.att{fill:rgba(15,176,163,.11)}
.cu-b{transition:opacity .12s}
.cu-c{fill:#9fb4c4}
.cu-prod{fill:#d98c0a}
.cu-c.att{fill:var(--teal-d)}
.cu-prod.att{fill:#c07c08}
.cu-c.punta{fill:var(--emerald)}
.g-lab.att{fill:var(--teal-d);font-weight:700}
.cu-punta-lab{fill:var(--emerald);font-size:10px;font-weight:700;font-family:var(--font-sans)}

.cu-giorno{border-top:1px solid var(--line);margin-top:6px;padding-top:12px}
.cu-testa{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:2px}
.cu-testa strong{font-family:var(--font-head);font-size:15.5px}
.cu-testa .muted{font-size:13px}
.cu-picco{display:flex;align-items:flex-start;gap:7px;margin:4px 0 0;padding:9px 12px;border-radius:var(--r-sm);
  background:linear-gradient(120deg,rgba(15,176,163,.09),rgba(34,197,94,.07));color:var(--ink-2);font-size:13.5px}
.cu-picco .ic{flex:0 0 auto;margin-top:2px;width:15px;height:15px;color:var(--emerald)}
.cu-nota{margin-top:12px;padding-top:10px;border-top:1px dashed var(--line)}
@media(max-width:640px){
  .cu-giorni{height:180px}
  /* min-width batte max-width: su telefono i due grafici NON si schiacciano dentro lo
     schermo, scorrono dentro .grafico-wrap restando leggibili */
  .cu-giorni{min-width:340px}
  .cu-ore{height:165px;min-width:520px}
}

/* ═══════ Rifiniture e animazioni del portale cliente ═══════
   Stesse regole del resto della piattaforma: movimenti brevi (200-500 ms), curva
   cubic-bezier(.2,.7,.3,1), e tutto spento con prefers-reduced-motion. */

/* le schede entrano una dopo l'altra, non tutte insieme come un blocco */
.portale-benvenuto{animation:lmc-entra .38s cubic-bezier(.2,.7,.3,1) both}
.portale-main .card{animation:lmc-entra .42s cubic-bezier(.2,.7,.3,1) both}
.portale-main .card:nth-of-type(2){animation-delay:.07s}
.portale-main .card:nth-of-type(3){animation-delay:.14s}
.portale-main .card:nth-of-type(n+4){animation-delay:.2s}
.portale-nota{animation:lmc-entra .4s .24s cubic-bezier(.2,.7,.3,1) both}
@keyframes lmc-entra{0%{opacity:0;transform:translateY(10px)}100%{opacity:1;transform:none}}

/* l'anello della quota si riempie invece di apparire già pieno.
   --cu-giro moltiplica --q (che resta il valore vero, scritto inline). */
@property --cu-giro{syntax:'<number>';initial-value:1;inherits:false}
.sintesi-anello{background:conic-gradient(var(--emerald) calc(var(--q) * var(--cu-giro,1) * 1%),#e3edf2 0);
  animation:lmc-anello .95s .15s cubic-bezier(.2,.7,.3,1) both}
@keyframes lmc-anello{0%{--cu-giro:0}100%{--cu-giro:1}}
.sa-num{animation:lmc-entra .5s .5s cubic-bezier(.2,.7,.3,1) both}

/* le barre crescono da terra, sfalsate: si legge il verso della lettura */
.cu-b,.consumo-card svg.grafico>rect{transform-box:fill-box;transform-origin:50% 100%;
  animation:lmc-cresci .5s cubic-bezier(.2,.7,.3,1) both}
.cu-b{animation-delay:calc(var(--i,0) * 22ms + 120ms)}
.consumo-card svg.grafico>rect:nth-of-type(n+3){animation-delay:.06s}
.consumo-card svg.grafico>rect:nth-of-type(n+5){animation-delay:.12s}
.consumo-card svg.grafico>rect:nth-of-type(n+7){animation-delay:.18s}
.consumo-card svg.grafico>rect:nth-of-type(n+9){animation-delay:.24s}
.consumo-card svg.grafico>rect:nth-of-type(n+11){animation-delay:.3s}
@keyframes lmc-cresci{0%{transform:scaleY(0)}100%{transform:scaleY(1)}}
.cu-punta-lab{animation:lmc-entra .4s cubic-bezier(.2,.7,.3,1) both;animation-delay:calc(var(--i,0) * 22ms + 260ms)}

/* sabato e domenica: in casa la giornata è diversa, e si vede */
.cu-sfondo.fest{fill:rgba(86,106,122,.045)}
.cu-a:hover .cu-sfondo.fest{fill:rgba(15,176,163,.09)}
.g-lab.fest{fill:#8296a6}

/* micro-interazioni */
.cu-p{transition:transform .12s ease,background .15s ease,border-color .15s ease,color .15s ease}
.cu-p:active{transform:translateY(1px)}
.cu-a .cu-b{transition:fill .15s ease}
.cu-a:hover .cu-c{fill:#7f97ab}
.cu-a:hover .cu-c.att{fill:var(--teal)}
.cu-a:hover .cu-prod{fill:#c98107}
.cu-giorno{animation:lmc-apri .3s cubic-bezier(.2,.7,.3,1) both}
.cu-picco{animation:lmc-entra .42s .34s cubic-bezier(.2,.7,.3,1) both}
.kpi{transition:transform .16s ease,box-shadow .16s ease}
.consumo-card .kpi:hover{transform:translateY(-2px);box-shadow:var(--sh)}

@media (prefers-reduced-motion:reduce){
  .portale-benvenuto,.portale-main .card,.portale-nota,.sintesi-anello,.sa-num,.cu-b,
  .consumo-card svg.grafico>rect,.cu-punta-lab,.cu-giorno,.cu-picco{animation:none}
  .cu-p,.cu-a .cu-b,.kpi{transition:none}
  .sintesi-anello{background:conic-gradient(var(--emerald) calc(var(--q)*1%),#e3edf2 0)}
}

/* In stampa le animazioni non girano: senza questa regola le barre resterebbero
   a scaleY(0) e il cliente stamperebbe grafici vuoti. */
@media print{
  .portale-benvenuto,.portale-main .card,.portale-nota,.sintesi-anello,.sa-num,.cu-b,
  .consumo-card svg.grafico>rect,.cu-punta-lab,.cu-giorno,.cu-picco{animation:none!important}
  .cu-scelta,.leg-hint{display:none}
  .portale-main .card{break-inside:avoid;box-shadow:none}
}

/* periodo a scelta sul grafico giornaliero */
.cu-scelta{gap:10px 14px;align-items:flex-end}
.cu-campo{display:flex;flex-direction:column;gap:3px;font-size:12.5px;font-weight:600;color:var(--ink-2)}
.cu-campo input[type=date]{padding:.42rem .55rem;border:1px solid var(--line);border-radius:var(--r-sm);
  font:inherit;font-weight:500;background:#fff;color:var(--ink)}
.cu-campo input[type=date]:focus{outline:2px solid rgba(15,176,163,.35);outline-offset:1px;border-color:var(--teal)}
.cu-rapidi{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-left:auto}
@media(max-width:640px){
  .cu-rapidi{margin-left:0;width:100%}
  .cu-campo{flex:1 1 44%}
  .cu-campo input[type=date]{width:100%}
}

/* campo data compatto dentro le azioni in riga (proroga nei richiami) */
.in-mini{padding:4px 7px;border:1px solid var(--line);border-radius:8px;font:inherit;font-size:12.5px;
  background:#fff;color:var(--ink);max-width:9.5rem}
.in-mini:focus{outline:2px solid rgba(15,176,163,.35);outline-offset:1px;border-color:var(--teal)}

/* «Dove mandare gli export» — scelta destinatari nell'elaborazione manuale */
.dove-wrap{border:1px solid var(--line);border-radius:var(--r-sm);padding:12px 14px;margin:14px 0;background:#fbfdff}
.dove-tit{display:flex;align-items:center;gap:7px;font-weight:700;font-size:13px;margin-bottom:8px;color:var(--ink)}
.dove-tit .ic{width:15px;height:15px;color:var(--teal-d)}
.dove-voce{display:flex;flex-direction:row;align-items:flex-start;gap:9px;padding:6px 0;font-size:13.5px;
  font-weight:500;color:var(--ink);cursor:pointer}
.dove-voce input[type=checkbox]{width:16px;height:16px;accent-color:var(--teal-d);flex:0 0 auto}
.dove-voce input{margin-top:3px;flex:0 0 auto}
.dove-voce em{display:block;font-style:normal;font-size:12px;color:var(--muted);margin-top:1px}
.dove-voce.fissa{cursor:default;opacity:.85}
.dove-voce.spenta{cursor:not-allowed;opacity:.5}
.dove-voce.spenta strong{text-decoration:line-through;text-decoration-thickness:1px}

/* Consegne ai destinatari (pagina Database) */
.cons-blocco{border:1px solid var(--line);border-radius:var(--r-sm);padding:13px 15px;margin:12px 0;background:#fbfdff}
.cons-testa{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.cons-azione{margin-left:auto}
.cons-num{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.cons-num>div{flex:1 1 92px;background:#fff;border:1px solid var(--line);border-radius:9px;padding:8px 10px;
  display:flex;flex-direction:column;gap:1px}
.cons-num>div.largo{flex:1 1 150px}
.cons-num strong{font-family:var(--font-head);font-size:17px;line-height:1.1;font-variant-numeric:tabular-nums}
.cons-num span{font-size:11px;color:var(--muted)}
.cons-num>div.ko strong{color:var(--red)}
.cons-det{margin-top:6px}
.cons-det>summary{cursor:pointer;font-weight:600;font-size:13px;color:var(--teal-d);list-style:none}
.cons-det>summary::-webkit-details-marker{display:none}
.cons-det>summary::before{content:'▸ ';font-size:.9em}
.cons-det[open]>summary::before{content:'▾ '}
.cons-cart{margin:10px 0 4px;font-weight:600;font-size:12.5px}
.cons-vuoto{margin:6px 0 0}
@media(max-width:640px){.cons-azione{margin-left:0;width:100%}.cons-azione .btn{width:100%;justify-content:center}}

/* Richiami: barra di ricerca e pastiglia della proroga */
.ric-barra{display:flex;align-items:center;gap:9px;margin:0 0 10px;padding:9px 13px;background:#fff;
  border:1px solid var(--line);border-radius:var(--r-sm);box-shadow:var(--sh-sm);flex-wrap:wrap}
.ric-barra>.ic{width:16px;height:16px;color:var(--muted);flex:0 0 auto}
.ric-barra input[type=search]{flex:1;min-width:200px;border:0;outline:none;font:inherit;font-size:14px;
  background:transparent;color:var(--ink)}
.ric-barra input[type=search]::placeholder{color:var(--muted)}
.sub-tab-proroga .st-n{background:rgba(200,127,8,.16);color:var(--amber)}
@media(max-width:640px){.ric-barra{gap:7px}.ric-barra input[type=search]{min-width:0}}

/* ══════════════════ MODULO OSC SUL TELEFONO ══════════════════
   Le ore e le spese si compilano quasi sempre dal cellulare, spesso in cantiere e
   con una mano sola. Qui il modulo smette di essere una tabella rimpicciolita e
   diventa un elenco di schede: la data e le ore in evidenza, il resto sotto. */

/* La riga «cosa ho fatto» deve andare a capo, non spingere la pagina di lato. */
.osc-voci{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 6px;min-width:0}
.osc-voci .osc-voce{display:inline-flex;align-items:baseline;gap:5px;flex-wrap:wrap;min-width:0}
.osc-voci .osc-sep{color:var(--line);user-select:none}
.osc-voci .badge{flex:0 0 auto}

/* La freccetta serve solo al telefono: sul monitor resta il testo del pulsante. */
.osc-vai-ico{display:none}

/* Import ed export: scelta del file + pulsante, e la fila dei comandi accanto. */
.osc-azioni-file{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.osc-carica{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap}
.osc-carica input[type=file]{max-width:100%}

/* ══════════════════ COMANDI DEI MODULI SUL TELEFONO ══════════════════
   Due difetti veri, non estetici: i pulsanti non andavano a capo e venivano
   schiacciati sotto la larghezza del loro testo, che spariva (overflow:hidden);
   e su un modulo lungo — l'editor della giornata è alto quasi seimila pixel —
   il pulsante «Salva» stava in fondo, da raggiungere scorrendo tutto. */
@media(max-width:640px){
  .form-azioni{flex-wrap:wrap;gap:8px;position:sticky;bottom:0;z-index:5;
    background:linear-gradient(to bottom, rgba(255,255,255,.75), #fff 42%);
    padding:10px 0 2px;margin-top:12px}
  .form-azioni::before{content:'';position:absolute;left:-13px;right:-13px;top:0;
    height:1px;background:var(--line)}
  .form-azioni .btn{flex:1 1 auto;min-width:0;justify-content:center;white-space:nowrap}
  /* Un solo comando: riga intera. Due o più: si dividono lo spazio. */
  .form-azioni .btn:only-child{flex-basis:100%}

  /* Bersaglio minimo per un dito. Le linee guida di Apple e Google dicono 44px;
     qui 40 come compromesso con la densità delle tabelle di rilevamento, dove
     i campi erano alti 35px e si sbagliava cella di continuo. */
  input:not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=range]),
  select,textarea{min-height:40px}
}


/* ══ Indice della pagina e «torna su» (solo telefono) ══
   Le pagine lunghe non si accorciano nascondendo contenuto: si rendono percorribili.
   L'indice sta appiccicato sotto la barra del titolo, scorre in orizzontale e tiene
   evidenziata la sezione in cui ti trovi. */
.ind-pagina{display:none}
.su-btn{display:none}
@media(max-width:640px){
  .ind-pagina{display:flex;flex-direction:column;gap:5px;position:sticky;top:62px;z-index:40;
    margin:-6px -14px 12px;padding:8px 14px 9px;
    background:rgba(255,255,255,.94);backdrop-filter:blur(6px);
    border-bottom:1px solid var(--line)}
  .ind-eti{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700}
  .ind-voci{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;
    scroll-behavior:smooth;padding-bottom:1px}
  .ind-voci::-webkit-scrollbar{display:none}
  .ind-voci a{flex:0 0 auto;max-width:14rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
    font-size:12px;font-weight:600;color:var(--ink-2);text-decoration:none;
    padding:6px 11px;border:1px solid var(--line);border-radius:99px;background:#fff}
  .ind-voci a.qui{background:var(--teal-d,#0b7d74);border-color:var(--teal-d,#0b7d74);color:#fff}
  /* saltando a una sezione il titolo non deve finire sotto le barre appiccicate */
  section.card{scroll-margin-top:118px}

  .su-btn{display:flex;align-items:center;justify-content:center;position:fixed;right:14px;bottom:16px;
    width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.95);
    color:var(--ink-2);font-size:19px;line-height:1;box-shadow:0 3px 14px rgba(16,44,60,.16);
    z-index:45;opacity:0;pointer-events:none;transition:opacity .18s}
  .su-btn.si-vede{opacity:1;pointer-events:auto}
}
@media(max-width:640px) and (prefers-reduced-motion:reduce){
  .ind-voci{scroll-behavior:auto}
  .su-btn{transition:none}
}

/* ══ Righe di elenco che aprono un dettaglio ══
   Sul telefono si tocca tutta la scheda, non un pulsantino da centrare col pollice.
   Il velo trasparente del link sta SOTTO gli altri comandi della riga (pulsanti,
   moduli di eliminazione, caselle), che restano cliccabili. */
.rv-ico{display:none}
@media(max-width:640px){
  table.tab-schede tr:has(.riga-vai){position:relative}
  table.tab-schede tr .riga-vai{border:0;background:none;padding:2px 2px 2px 8px;color:var(--muted);
    font-size:22px;line-height:1;min-height:0;margin-left:auto;flex:0 0 auto !important;width:auto !important}
  table.tab-schede tr .riga-vai::after{content:'';position:absolute;inset:0;border-radius:12px;z-index:0}
  table.tab-schede tr .rv-txt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  table.tab-schede tr .rv-ico{display:inline}
  /* tutto il resto della riga sta sopra al velo */
  table.tab-schede tr:has(.riga-vai) button,
  table.tab-schede tr:has(.riga-vai) input,
  table.tab-schede tr:has(.riga-vai) select,
  table.tab-schede tr:has(.riga-vai) form,
  table.tab-schede tr:has(.riga-vai) a:not(.riga-vai){position:relative;z-index:1}
  table.tab-schede tr:has(.riga-vai):active{background:#eef5f5}
}


/* Etichetta con la sola casella di spunta: sta in riga, non impilata come i campi. */
.osc-spunta{flex-direction:row !important;align-items:center;gap:9px}
.osc-spunta input[type=checkbox]{width:20px;height:20px;flex:0 0 auto;margin:0}

/* Barra dei mesi: una riga sola, il mese al centro che si allarga. */
.osc-mesi{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.osc-mesi .osc-mese-campo{flex:1 1 150px;min-width:0}
.osc-mesi .osc-mese-campo input{width:100%}
.osc-mesi .btn{flex:0 0 auto}
/* Gli input del tema sono width:100% e da soli occuperebbero tutta la riga,
   spingendo le frecce sopra e sotto. Dentro la barra dei mesi si restringono.
   ⚠ Solo i FIGLI DIRETTI: dentro una <label> l'asse del flex è verticale, e un
   flex-basis di 140px diventerebbe l'ALTEZZA del campo, non la larghezza. */
.osc-mesi>input[type=month],.osc-mesi>input[type=date],.osc-mesi>input[type=number],
.osc-mesi>select{flex:1 1 140px;width:auto;min-width:0}
.osc-mesi>label{flex:1 1 140px;min-width:0;margin:0}
.osc-mesi label input,.osc-mesi label select{width:100%;flex:0 0 auto}

@media(max-width:640px){
  /* ── Elenco dei giorni: una scheda compatta per giorno ────────────────────
     Niente etichette «GIORNO / COSA / ORE» che si mangiano il 42% della riga:
     la data sta in alto a sinistra, le ore a destra, il dettaglio sotto. */
  .tab-schede.tab-osc-giorni tr{
    display:grid;
    grid-template-columns:auto 1fr auto;
    grid-template-areas:"gg ore az" "cosa cosa cosa";
    align-items:center;
    gap:2px 10px;
    padding:10px 12px;
  }
  .tab-schede.tab-osc-giorni td{display:block;padding:0;text-align:left !important}
  .tab-schede.tab-osc-giorni td::before{display:none !important}   /* via le etichette */
  .tab-schede.tab-osc-giorni td:nth-child(1){grid-area:gg;font-size:14px}
  .tab-schede.tab-osc-giorni td:nth-child(2){grid-area:cosa;margin-top:4px}
  .tab-schede.tab-osc-giorni td:nth-child(3){grid-area:ore;text-align:right !important;
    font-size:15px;font-variant-numeric:tabular-nums;white-space:nowrap}
  .tab-schede.tab-osc-giorni td:nth-child(4){grid-area:az}
  .tab-schede.tab-osc-giorni td:empty{display:block}               /* le aree restano al loro posto */
  /* Tutta la scheda è il bersaglio: la freccetta è solo il segnale visivo. */
  .tab-schede.tab-osc-giorni tr{position:relative}
  .tab-schede.tab-osc-giorni .osc-vai{border:0;background:none;padding:2px 2px 2px 8px;color:var(--muted);
    font-size:22px;line-height:1;min-height:0}
  .tab-schede.tab-osc-giorni .osc-vai-txt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .tab-schede.tab-osc-giorni .osc-vai::after{content:'';position:absolute;inset:0;border-radius:12px}
  .tab-schede.tab-osc-giorni tr:active{background:#eef5f5}

  /* Le tre righe di riepilogo in fondo (per codice, stati): niente etichette doppie. */
  .tab-schede.tab-osc-compatta tr{display:grid;grid-template-columns:auto 1fr auto;gap:2px 10px;padding:9px 12px}
  .tab-schede.tab-osc-compatta td{display:block;padding:0}
  .tab-schede.tab-osc-compatta td::before{display:none !important}
  .tab-schede.tab-osc-compatta td:last-child{text-align:right !important}

  /* Indicatori: due per riga, etichetta piccola su una riga sola quando ci sta. */
  .kpi-row{gap:8px;grid-template-columns:1fr 1fr}
  .kpi{padding:11px 12px;gap:9px}
  .kpi-num{font-size:19px}
  .kpi-lbl{font-size:10.5px;letter-spacing:.04em}
  .kpi-ico{width:26px;height:26px;flex:0 0 26px}
  .kpi-ico .ic{width:15px;height:15px}

  /* Il pulsante principale di una scheda prende tutta la larghezza: bersaglio grande. */
  .osc-azione-piena .btn{width:100%;justify-content:center}

  /* Sulle frecce dei mesi resta la sola freccia: il mese si legge nel campo in mezzo. */
  .osc-mesi .sr-mese{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .osc-mesi .btn{padding:9px 13px}
}

/* Sotto i 380px (iPhone SE e simili) il bottone va sotto, non stretto a lato. */
@media(max-width:640px){
  .osc-vai-ico{display:inline}

  /* Sul telefono il selettore del file prende la riga e il pulsante va sotto,
     largo quanto la scheda: a lato veniva schiacciato e il testo si tagliava. */
  .osc-carica{width:100%}
  .osc-carica input[type=file]{flex:1 1 100%;width:100%}
  .osc-carica .btn{flex:1 1 100%;justify-content:center}
  .osc-azioni-file{gap:8px}
  .osc-azioni-file>form,.osc-azioni-file>a{width:100%}
  .osc-azioni-file>a.btn{justify-content:center}

  /* ── Elenchi (collaboratori, viaggi, spese, righe di fattura) ──────────────
     La scheda generica mette ogni etichetta su una colonna larga il 42%: sette
     campi diventano sette righe. Qui l'etichetta torna accanto al suo valore e
     i campi si dispongono in fila, andando a capo quando serve. */
  .tab-schede.tab-osc-elenco tr{display:flex;flex-wrap:wrap;align-items:baseline;gap:5px 14px;padding:12px 13px}
  .tab-schede.tab-osc-elenco td{display:inline-flex;align-items:baseline;gap:5px;width:auto;padding:0}
  .tab-schede.tab-osc-elenco td::before{flex:0 0 auto;font-size:10px;letter-spacing:.05em}
  .tab-schede.tab-osc-elenco td:first-child{width:100%;font-size:15px;line-height:1.3}
  .tab-schede.tab-osc-elenco td:first-child::before{display:none}
  .tab-schede.tab-osc-elenco td:last-child{width:100%;margin-top:8px;justify-content:flex-start;gap:8px}
  .tab-schede.tab-osc-elenco td:last-child::before{display:none}
  .tab-schede.tab-osc-elenco td:last-child .btn{flex:1 1 auto;justify-content:center}
  .tab-schede.tab-osc-elenco td:empty{display:none}
  /* La riga dei totali usa <th>: le regole di sopra guardano i <td>, quindi va
     detto anche qui, altrimenti resta impaginata come una tabella larga. */
  .tab-schede.tab-osc-elenco tfoot tr{display:flex;flex-wrap:wrap;align-items:baseline;gap:5px 14px;
    padding:12px 13px;font-weight:700;background:#f4f7f7;border:1px solid var(--line);border-radius:12px}
  .tab-schede.tab-osc-elenco tfoot th{display:inline-flex;align-items:baseline;gap:5px;width:auto;
    padding:0;text-align:left !important;font-weight:700}
  .tab-schede.tab-osc-elenco tfoot th::before{content:attr(data-lbl);flex:0 0 auto;font-size:10px;
    letter-spacing:.05em;text-transform:uppercase;color:var(--muted);font-weight:600}
  .tab-schede.tab-osc-elenco tfoot th:first-child{width:100%;font-size:14px}
  .tab-schede.tab-osc-elenco tfoot th:first-child::before{display:none}
  .tab-schede.tab-osc-elenco tfoot th:empty{display:none}

  /* ── Righe da COMPILARE (giornata, viaggi, spese) ──────────────────────────
     Qui la scheda serve davvero, ma con l'etichetta SOPRA il campo e due campi
     per riga: sul telefono un campo largo mezzo schermo non si tocca bene. */
  .tab-schede.tab-osc-modulo tr{display:grid;grid-template-columns:1fr 1fr;gap:9px 10px;padding:12px 13px}
  .tab-schede.tab-osc-modulo td{display:block;padding:0;text-align:left !important}
  .tab-schede.tab-osc-modulo td::before{display:block;flex:none;margin-bottom:4px;font-size:10.5px;
    text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:600}
  .tab-schede.tab-osc-modulo td input:not([type=checkbox]):not([type=radio]),
  .tab-schede.tab-osc-modulo td select{width:100%;min-height:42px}
  /* La casella di spunta resta una casella: senza questo la regola di sopra la
     gonfiava a tutta larghezza e 42px d'altezza. */
  .tab-schede.tab-osc-modulo td input[type=checkbox]{width:20px;height:20px;min-height:0;flex:0 0 auto}
  .tab-schede.tab-osc-modulo td label{flex-direction:row;align-items:center;gap:9px}
  .tab-schede.tab-osc-modulo td:empty{display:none}
  /* i campi discorsivi prendono tutta la riga */
  .tab-schede.tab-osc-modulo td.osc-largo{grid-column:1 / -1}
  /* Righe che NON si compilano (totali, forfait, riepiloghi): testo a sinistra,
     cifra a destra, su una riga sola — non sono due campi da riempire. */
  .tab-schede.tab-osc-modulo tr.osc-riga-info{grid-template-columns:1fr auto;align-items:baseline;gap:4px 12px}
  .tab-schede.tab-osc-modulo tr.osc-riga-info td::before{display:none}
  .tab-schede.tab-osc-modulo tr.osc-riga-info td:last-child{text-align:right !important;
    white-space:nowrap;font-variant-numeric:tabular-nums}
}


/* ═════════ ETIC — ETICHETTATURA DELL'ELETTRICITÀ ═════════
   La tabella dei vettori si legge come un rendiconto: i totali (rinnovabili, fossili,
   non rinnovabili, totale) sono righe chiuse, in grigio, e non si possono digitare —
   li calcola la piattaforma. Le voci digitabili stanno rientrate sotto al loro totale,
   così si vede a colpo d'occhio cosa somma dentro cosa.
   I selettori partono da «table.» perché la regola .tab td{padding-top} viene dopo
   nel foglio: senza il tag davanti vincerebbe lei. */
.badge-err{background:rgba(192,57,43,.13);color:#a5281c}
.etic-si{color:#0b7a50;font-weight:700}
.etic-no{color:#a5281c;font-weight:700}

table.etic-tab th[scope=row]{text-align:left;font-weight:400;padding-left:20px}
table.etic-tab tr.etic-tot>th{padding-left:9px;font-weight:700}
table.etic-tab tr.etic-tot>th,table.etic-tab tr.etic-tot>td{background:#eef3f6}
table.etic-tab tr.etic-sub-tot>th{font-weight:600;color:var(--muted,#3a4d5c)}
table.etic-tab tr.etic-sub>th{padding-left:38px;color:var(--muted,#3a4d5c)}
table.etic-tab tr.etic-somma>th,table.etic-tab tr.etic-somma>td{
  border-top:3px double var(--line);background:#e3ebf0;font-weight:700}
input.etic-n{text-align:right;font-variant-numeric:tabular-nums}

/* Torta e legenda, quando servono dentro la piattaforma (nella lettera lo stile è suo) */
.etic-torta{width:150px;height:150px;flex:0 0 150px}
.etic-legenda{list-style:none;margin:0;padding:0;font-size:12px}
.etic-legenda li{display:flex;align-items:center;gap:7px;padding:2px 0}
.etic-legenda i{width:11px;height:11px;border-radius:2px;flex:0 0 11px}
.etic-legenda b{margin-left:auto;font-variant-numeric:tabular-nums}

@media (max-width:640px){
  /* .tab-schede impagina le celle a schede ma conosce solo i <td>: qui la prima cella
     di ogni riga è un <th>, ed è quella che fa da titolo della scheda. */
  table.etic-tab tbody th[scope=row]{display:block;width:100%;padding:0 0 3px;
    font-size:13.5px;font-weight:600;color:inherit}
  table.etic-tab tr.etic-tot>th,table.etic-tab tr.etic-somma>th{font-weight:700}
  table.etic-tab tr.etic-sub>th{padding-left:0}   /* il trattino lo mette gia' il PHP: qui ne uscivano due */
  table.etic-tab input.etic-n{min-height:40px;width:100%}
  table.etic-tab td{min-width:96px}
  .etic-torta{width:120px;height:120px;flex:0 0 120px}
}

/* ═════════ FATTURE PRESTAZIONI (portale responsabile) ═════════
   Righe libere scritte dal responsabile. Gli importi non si digitano: sono
   quantità × prezzo, e il totale è la somma delle righe — così il documento non
   può dire una cosa e i suoi conti un'altra. */
.badge-neutro{background:rgba(159,180,196,.28);color:#3a4d5c}

.prest-sez{margin:14px 0 -2px;font-size:11px;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted,#4a6470);border-bottom:1px solid var(--line);padding-bottom:5px}
.prest-form .prest-sez:first-of-type{margin-top:0}

table.prest-voci th.q,table.prest-voci td.q{width:110px}
table.prest-voci input{width:100%}
table.prest-voci input.q{text-align:right;font-variant-numeric:tabular-nums}

.prest-iva{border:1px solid var(--line);border-radius:10px;padding:10px 14px;margin:0;display:flex;
  gap:8px 26px;flex-wrap:wrap}
.prest-iva .scelta{display:flex;align-items:flex-start;gap:8px;margin:0;font-weight:400;cursor:pointer}
.prest-iva .scelta input{margin-top:3px;width:auto;flex:0 0 auto}

/* Un bottone d'azione con accanto il suo campo, dentro una cella di tabella */
form.in-linea{display:inline-flex;gap:6px;align-items:center;margin:0 4px 4px 0;vertical-align:middle}
form.in-linea input.mini{width:88px;text-align:right;font-variant-numeric:tabular-nums;
  padding:5px 8px;font-size:13px}

@media (max-width:640px){
  .prest-iva{flex-direction:column;gap:10px}
  table.prest-voci input{min-height:40px}
  table.prest-voci th.q,table.prest-voci td.q{width:auto}
  /* La cella delle azioni e' un flex a riga singola: senza wrap i moduli restavano
     in fila e sforavano il riquadro (misurato: 32 px e 114 px oltre il bordo). */
  table.tab-schede tr>td:last-child{flex-wrap:wrap}
  form.in-linea{display:flex;flex:1 1 100%;width:100%;margin:0 0 6px}
  form.in-linea input.mini{flex:1 1 auto;width:auto;min-height:40px}
  form.in-linea .btn{flex:0 0 auto}
}

@media (max-width:640px){
  /* Le righe della fattura diventano schede: descrizione a tutta larghezza, poi
     quantita'/unita'/prezzo in fila. L'etichetta resta ACCANTO al campo (come nel
     resto della piattaforma): mandarla a capo spingeva l'input fuori dalla scheda. */
  table.prest-voci tr{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:10px}
  table.prest-voci td{flex:1 1 46%;min-width:0;align-items:center}
  table.prest-voci tr>td:first-child{flex:1 1 100%;width:100%}
  table.prest-voci td input{width:100%;min-width:0;min-height:40px}
  table.prest-voci th.q,table.prest-voci td.q{width:auto}   /* i 110px del desktop tenevano larga la tabella */
}

/* ══════════════════ MODULO PRG · UNA VESTE SOLA: IL FOGLIO ══════════════════
   Chiesta dall'utente: «meno da WordPress, più da Excel ma graficamente migliore».
   Qui si leggono numeri e si confrontano righe, quindi: righe fitte, griglia su tutte
   le celle, cifre in colonna (tabular-nums), intestazione appiccicata, totali staccati,
   e l'inserimento su una BARRA DI CAMPI in linea invece che un modulo a colonne.
   Le barre dell'andamento sono SVG inline: niente attributi style, e si stampano.
   Tutto il modulo (elenco, progetto, offerta, SAL, conto) usa questi pezzi: prima
   convivevano le card morbide della piattaforma e il foglio del conto. */

/* ── Testata di pagina ── */
.prg-testa{display:flex;align-items:flex-start;justify-content:space-between;gap:12px 20px;flex-wrap:wrap;margin:0 0 14px}
.prg-testa h1{display:flex;align-items:center;gap:10px;margin:0 0 3px;font-size:24px}
.prg-testa h1 .ic{width:22px;height:22px;color:var(--teal-d);flex:0 0 auto}
.prg-testa .meta,.prg-testa p{margin:0;color:var(--muted);font-size:13.5px;line-height:1.55}
.prg-testa .meta .mono{font-size:12.5px}
.prg-testa .azioni{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-left:auto}
.prg-testa .azioni form{margin:0}
.prg-stato{display:inline-block;padding:2px 9px;border-radius:99px;font-size:10.5px;font-weight:700;letter-spacing:.04em;
  text-transform:uppercase;vertical-align:middle;background:rgba(15,176,163,.13);color:var(--teal-d);white-space:nowrap}
.prg-stato.chiuso{background:#e9eef2;color:var(--ink-2)}
.prg-stato.bozza{background:#fdf3e2;color:#8a5d04}

/* ── Blocco = una zona del foglio. Bordo netto, non una card morbida. ── */
.prg-blocco{background:#fff;border:1px solid var(--line);border-radius:10px;margin-bottom:14px;overflow:hidden}
.prg-blocco.evidenza{border-left:4px solid #e0a72e}
.prg-testata{display:flex;align-items:center;gap:6px 14px;flex-wrap:wrap;padding:8px 14px;min-height:42px;
  background:#f6f8f9;border-bottom:1px solid var(--line)}
.prg-testata h2{margin:0;font-size:12.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2);
  display:flex;align-items:center;gap:8px}
.prg-testata h2 .ic{width:15px;height:15px;color:var(--teal-d)}
.prg-testata .sotto{font-size:12.5px;color:var(--muted)}
.prg-testata .dx{margin-left:auto}
.prg-corpo{padding:12px 14px}
.prg-corpo>p:first-child{margin-top:0}
.prg-blocco .vuoto{padding:16px 14px;text-align:left;margin:0}
.prg-blocco .req{background:none;padding:0;margin-left:4px}
.prg-blocco .flash{margin:0 0 12px}
.prg-blocco .form-grid.prg-corpo{padding:14px}

/* ── Cifre in fila, piatte (al posto della striscia con l'ombra) ── */
.prg-cifre{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:0}
.prg-cifre .cifra{padding:11px 14px;border-left:1px solid var(--line-2);display:flex;flex-direction:column;gap:2px;min-width:0}
.prg-cifre .cifra:first-child{border-left:0}
.prg-cifre .v{font-family:var(--font-head);font-size:19px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.01em;
  color:var(--ink);line-height:1.15;white-space:nowrap}
.prg-cifre .v.pos{color:#0b7a50}.prg-cifre .v.attesa{color:#8a5d04}.prg-cifre .v.muted{color:var(--muted)}
.prg-cifre .v small{font-size:11px;font-weight:600;color:var(--muted);margin-left:6px;letter-spacing:0}
.prg-cifre .k{font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}

/* ── La barra dell'andamento: verde incassato, ambra da incassare, verde acqua maturato ── */
.prg-barra{display:block;width:100%;height:10px;border-radius:5px;overflow:hidden}
.prg-barra.alta{height:16px;border-radius:8px}
.prg-barra .s-resto{fill:#e6ecef}
.prg-barra .s-inc{fill:#0b7a50}
.prg-barra .s-att{fill:#e0a72e}
.prg-barra .s-mat{fill:#0fb0a3}
.prg-barra .s-prec{fill:#9ec4bf}
.prg-barra .s-ora{fill:#0a8478}
.prg-flusso{padding:14px 14px 0}
.prg-legenda{display:flex;flex-wrap:wrap;gap:4px 16px;margin:8px 0 8px;font-size:11.5px;color:var(--ink-2)}
.prg-legenda span{display:inline-flex;align-items:center;gap:6px}
.prg-legenda i{width:10px;height:10px;border-radius:3px;flex:0 0 auto;background:#e6ecef}
.prg-legenda i.s-inc{background:#0b7a50}.prg-legenda i.s-att{background:#e0a72e}.prg-legenda i.s-mat{background:#0fb0a3}
.prg-legenda i.s-prec{background:#9ec4bf}.prg-legenda i.s-ora{background:#0a8478}
.prg-flusso .prg-cifre{margin:4px -14px 0;border-top:1px solid var(--line-2)}
.prg-mini{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
.prg-mini .prg-barra{width:84px;height:7px;flex:0 0 84px}
.prg-mini b{font-variant-numeric:tabular-nums}

/* ── Il foglio ── */
.prg-foglio{width:100%;border-collapse:collapse;font-size:13px}
.prg-foglio th{position:sticky;top:0;z-index:2;background:#eef2f4;text-align:left;
  font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700;
  padding:7px 10px;border-bottom:1px solid var(--line);border-right:1px solid #e6ecef;white-space:nowrap}
.prg-foglio td{padding:6px 10px;border-bottom:1px solid #eef2f4;border-right:1px solid #f2f5f7;vertical-align:top}
.prg-foglio th:last-child,.prg-foglio td:last-child{border-right:0}
.prg-foglio tbody tr:nth-child(even) td{background:#fbfcfd}
.prg-foglio tbody tr:hover td{background:#f2f8f8}
.prg-foglio .n,.prg-foglio th.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.prg-foglio .mono{font-family:var(--font-mono,ui-monospace,SFMono-Regular,Menlo,monospace);font-size:12px}
.prg-foglio .pos{color:#0b7a50}
.prg-foglio .neg,.prg-foglio .rim{color:#a8331f}
.prg-foglio .attesa{color:#8a5d04}
.prg-foglio .grigia td{opacity:.6}
.prg-foglio tr.cap td,.prg-foglio tr.prg-capitolo td{background:#eef3f4 !important;font-weight:700}
.prg-foglio tfoot th,.prg-foglio tr.prg-totale td{position:static;background:#f4f7f9 !important;border-top:2px solid var(--line);
  border-bottom:0;font-size:12.5px;text-transform:none;letter-spacing:0;color:var(--ink);padding:9px 10px;font-weight:700}
.prg-foglio tfoot th.n{font-variant-numeric:tabular-nums;text-align:right}
.prg-foglio td.az{white-space:nowrap;text-align:right}
.prg-foglio td.az .btn{margin-left:4px}
.prg-foglio td.az form{display:inline-block;margin:0}
.prg-foglio a{color:var(--teal-d);text-decoration:none;font-weight:600}
.prg-foglio a:hover{text-decoration:underline}
.prg-foglio .micro{display:block;margin-top:2px}
.prg-foglio td.num,.prg-foglio th.num{color:var(--muted);font-size:11px;text-align:right;width:34px;font-variant-numeric:tabular-nums}
.prg-foglio .badge{vertical-align:baseline}
.prg-scorri{max-height:560px;overflow:auto}
.prg-scorri-bassa{max-height:280px}

/* ── Il conto: le quattro voci ── */
.prg-conto td{font-size:14px;padding:9px 14px;border-right:0}
.prg-conto .seg{width:28px;text-align:center;font-weight:800;font-size:17px;line-height:1}
.prg-conto tr:has(.n.pos) .seg{color:#0b7a50}
.prg-conto tr:has(.n.neg) .seg{color:#a8331f}
.prg-conto .n{width:180px;font-size:15px;font-weight:700}
.prg-conto .muted{font-weight:400;font-size:12px;margin-left:8px}
.prg-conto tbody tr:nth-child(even) td{background:transparent}
.prg-conto tbody tr:hover td{background:#f7fafb}
.prg-conto .somma td{border-top:1px solid var(--line);background:#fafcfc !important;font-weight:600}
.prg-conto .dicui td{padding-top:3px;padding-bottom:3px;font-size:12.5px;color:var(--ink-2)}
.prg-conto .dicui td:nth-child(2){padding-left:38px}
.prg-conto .dicui .n{font-size:13px;font-weight:600}
.prg-conto .totale td{border-top:2px solid var(--ink-2);background:#f3f8f8 !important}
.prg-conto .totale td:nth-child(2){font-weight:800;letter-spacing:.02em}
.prg-conto .totale .n{font-size:20px;font-weight:800}
.prg-conto .nota td{border-top:0;font-size:12.5px;color:var(--ink-2);padding-top:4px}
.prg-conto .nota .n{font-size:14px;font-weight:600}

/* ── Etichette di stato ── */
.prg-foglio .eti{display:inline-block;padding:2px 8px;border-radius:99px;font-size:10.5px;font-weight:700;
  border:1px solid var(--line);background:#f7fafc;color:var(--ink-2);white-space:nowrap}
.prg-foglio .eti.ok{background:#e7f8ef;border-color:#b6e5cd;color:#0b7a50}
.prg-foglio .eti.par,.prg-foglio .eti.att{background:#fdf3e2;border-color:#f0d9ab;color:#8a5d04}
.prg-foglio .eti.no{background:#f4f7f9;color:var(--muted)}

/* ── Riga di inserimento: una barra di campi, non un modulo a colonne ── */
.prg-riga-form{display:flex;flex-wrap:wrap;gap:9px;align-items:flex-end;
  padding:11px 14px;background:#f8fafb;border-top:1px solid var(--line)}
.prg-riga-form:first-child{border-top:0}
.prg-riga-form label{margin:0;flex:0 0 auto;font-size:11px;text-transform:uppercase;
  letter-spacing:.04em;color:var(--muted);font-weight:700}
.prg-riga-form label.cresce{flex:1 1 180px;min-width:0}
.prg-riga-form label.file{flex:1 1 250px}
.prg-riga-form label .muted{text-transform:none;letter-spacing:0;font-weight:600;white-space:nowrap}
.prg-riga-form input,.prg-riga-form select{font-size:13px;padding:7px 9px;min-height:36px}
.prg-riga-form input[type=text],.prg-riga-form input[type=date],.prg-riga-form input[type=number],.prg-riga-form input[type=file]{width:100%}
.prg-riga-form label:not(.cresce) input[inputmode=decimal]{width:9rem;text-align:right;font-variant-numeric:tabular-nums}
.prg-riga-form label.corto input[type=text],.prg-riga-form label.corto input[type=number]{width:6.5rem}
.prg-riga-form .btn{flex:0 0 auto}
.prg-riga-form .nota-riga{flex:1 1 100%;margin:0;font-size:12px;color:var(--muted)}
.prg-riga-form.nuda{padding:0;background:transparent;border:0}
.prg-riga-form.nuda+.prg-riga-form.nuda{margin-top:10px}
/* «riga nuova»: il + davanti e il bordo tratteggiato, come una riga vuota del foglio */
.prg-riga-form.nuova{border-top:1px dashed #c9d5dd}

/* I moduli «aggiungi» stanno in un <details>: sul monitor aperti col titolo nascosto, sul
   telefono chiusi dietro un «+ Aggiungi» (li chiude app.js): la pagina del conto era per
   due terzi campi vuoti. */
details.prg-aggiungi>summary{list-style:none;cursor:pointer;padding:10px 14px;border-top:1px solid var(--line);
  font-size:13px;font-weight:700;color:var(--teal-d);display:flex;align-items:center;gap:8px}
details.prg-aggiungi>summary::-webkit-details-marker{display:none}
details.prg-aggiungi>summary::before{content:'+';width:18px;height:18px;border-radius:50%;background:var(--teal-d);color:#fff;
  font-size:14px;line-height:18px;text-align:center;font-weight:800;flex:0 0 auto}
details.prg-aggiungi[open]>summary::before{content:'−'}
@media(min-width:641px){ details.prg-aggiungi>summary{display:none} }

/* Le parti facoltative di un progetto si aprono solo se servono: 28 campi insieme erano un muro. */
.prg-parte-fissa{grid-column:1 / -1;border-top:1px solid var(--line-2);padding-top:10px;font-weight:700;font-size:14px}
details.prg-parte{grid-column:1 / -1;border-top:1px solid var(--line-2);padding-top:6px}
details.prg-parte>summary{cursor:pointer;font-weight:700;font-size:14px;display:flex;align-items:center;gap:8px;list-style:none;padding:5px 0}
details.prg-parte>summary::-webkit-details-marker{display:none}
details.prg-parte>summary::before{content:'▸';color:var(--teal-d);font-size:13px;width:12px;transition:transform .15s}
details.prg-parte[open]>summary::before{transform:rotate(90deg)}
details.prg-parte>summary .muted{font-weight:400}
details.prg-parte>.form-grid{margin-top:8px}

/* ── Filtri dell'elenco su una riga sola ── */
.prg-filtri{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:0 0 14px}
.prg-seg{display:inline-flex;border:1px solid var(--line);border-radius:9px;overflow:hidden;background:#fff}
.prg-seg a{padding:7px 12px;font-size:13px;font-weight:700;color:var(--ink-2);text-decoration:none;
  border-left:1px solid var(--line);display:inline-flex;gap:6px;align-items:center}
.prg-seg a:first-child{border-left:0}
.prg-seg a:hover{background:var(--line-2);color:var(--teal-d)}
.prg-seg a b{font-size:11px;background:#eef2f4;border-radius:99px;padding:1px 7px;color:var(--muted);line-height:1.5}
.prg-seg a.on{background:var(--teal-d);color:#fff}
.prg-seg a.on b{background:rgba(255,255,255,.25);color:#fff}
.prg-filtri label{display:inline-flex;flex-direction:row;align-items:center;gap:7px;margin:0;
  font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:700}
.prg-filtri select{min-height:36px;font-size:13px;padding:6px 28px 6px 9px;width:auto}
.prg-filtri input[type=search]{flex:1 1 220px;min-width:0;min-height:36px;font-size:13px;padding:7px 10px}
.prg-elenco .prg-nome{color:var(--ink);font-weight:600}
.prg-elenco td .prg-stato{margin-left:6px}

/* ── Griglia delle voci: celle che sembrano testo, bordo solo quando ci scrivi ── */
.prg-griglia td{padding:2px 4px;vertical-align:middle}
.prg-griglia td.num{padding:2px 6px 2px 8px}
.prg-griglia input,.prg-griglia select{border:1px solid transparent;background:transparent;border-radius:6px;
  padding:5px 7px;min-height:32px;font-size:13px;width:100%;box-shadow:none}
.prg-griglia input:hover,.prg-griglia select:hover{border-color:#d5dee5}
.prg-griglia input:focus,.prg-griglia select:focus{border-color:var(--teal);background:#fff;outline:2px solid rgba(15,176,163,.25);outline-offset:0}
.prg-griglia select{width:auto;min-width:6.8rem;padding-right:22px}
.prg-griglia .c-cap{width:3.6rem}
.prg-griglia .c-pos{width:4.8rem}
.prg-griglia .c-imp{text-align:right;font-variant-numeric:tabular-nums;width:8.5rem}
.prg-griglia th.n{padding-right:12px}
.prg-griglia tr.cap input,.prg-griglia tr.cap select{font-weight:700}
.prg-griglia tr.cap .sub{display:inline-block;padding:7px 8px;font-size:12px;color:var(--muted);white-space:nowrap;font-weight:400}
.prg-griglia tr.nuova td{background:#fbfdfc !important}

/* ── SAL: la posizione con la sua barra, la casella % e i totali che seguono la mano ── */
.tab-prg-sal .prg-desc{line-height:1.35}
.tab-prg-sal .prg-avz{height:4px;border-radius:2px;margin-top:5px;max-width:260px}
.tab-prg-sal input.prg-perc{width:64px;text-align:right;font-variant-numeric:tabular-nums;font-weight:700;
  padding:5px 6px;min-height:32px;border-radius:6px}
.tab-prg-sal td{vertical-align:middle}
.prg-salva{position:sticky;bottom:10px;z-index:6;display:flex;align-items:center;gap:10px 24px;flex-wrap:wrap;
  background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 14px;margin:0 0 16px;
  box-shadow:0 8px 24px -10px rgba(13,38,59,.28)}
.prg-salva .cif{display:flex;flex-direction:column;gap:1px}
.prg-salva .cif .k{font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.prg-salva .cif b{font-family:var(--font-head);font-size:17px;font-variant-numeric:tabular-nums;line-height:1.1}
.prg-salva .btn{margin-left:auto}
/* Il riquadro dell'incasso compare solo se il SAL è «da fatturare»: in CSS con :has(),
   perché la CSP vieta i gestori scritti nell'HTML; senza :has() resta sempre visibile. */
.prg-fatturazione:not(:has(input[name="da_fatturare"]:checked)) .prg-incasso{display:none}
.prg-fatturazione .prg-incasso{margin-top:10px;border-top:1px solid var(--line-2);padding:10px 0 0;background:transparent}
.prg-fatturazione .osc-spunta{font-size:14px;font-weight:600}

/* ── Acconti aperti sotto la loro offerta ── */
.prg-foglio tr.acconti td{background:#f6f9fa !important;padding:0;border-right:0}
.prg-acconti{padding:0 0 0 22px;border-left:3px solid var(--teal,#10b6a8)}
.prg-acconti .prg-foglio th{background:#eff4f5;font-size:10px}
.prg-acconti .prg-riga-form{background:transparent;border-top:1px dashed var(--line)}

/* ── La zona pericolosa, in fondo alla scheda ── */
.prg-pericolo{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:4px 0 20px;padding:4px 2px;font-size:12.5px}
.prg-pericolo form{margin:0}
.btn-rosso{color:#a8331f}
.btn-rosso:hover{border-color:#a8331f;color:#a8331f}

@media(max-width:640px){
  .prg-testa{margin-bottom:12px}
  .prg-testa h1{font-size:21px}
  .prg-testa .azioni{margin-left:0;width:100%}
  .prg-testa .azioni .btn,.prg-testa .azioni form{flex:1 1 45%;min-width:0}
  .prg-testa .azioni form .btn{width:100%;justify-content:center}
  .prg-blocco{border-radius:9px}
  .prg-testata{padding:8px 12px}
  .prg-corpo{padding:10px 12px}
  .prg-blocco .form-grid.prg-corpo{padding:12px}
  .prg-cifre{grid-template-columns:1fr 1fr}
  .prg-cifre .cifra{padding:9px 12px;border-top:1px solid var(--line-2)}
  .prg-cifre .cifra:nth-child(-n+2){border-top:0}
  .prg-cifre .cifra:nth-child(odd){border-left:0}
  .prg-cifre .v{font-size:17px}
  .prg-flusso{padding:12px 12px 0}
  .prg-flusso .prg-cifre{margin:8px -12px 0}
  .prg-conto td{font-size:13px;padding:8px 10px}
  .prg-conto .n{width:auto;font-size:14px}
  .prg-conto .totale .n{font-size:17px}
  .prg-conto .muted{display:block;margin:2px 0 0}
  .prg-conto .dicui td:nth-child(2){padding-left:20px}
  .prg-filtri{gap:8px}
  .prg-seg{width:100%}
  .prg-seg a{flex:1 1 auto;justify-content:center;padding:8px 6px}
  .prg-filtri label{flex:1 1 100%}
  .prg-filtri select{flex:1 1 auto}
  .prg-filtri input[type=search]{flex:1 1 100%}
  .prg-riga-form{padding:10px 12px}
  .prg-riga-form label{flex:1 1 100%}
  .prg-riga-form label:not(.cresce) input[inputmode=decimal],
  .prg-riga-form label.corto input[type=text],.prg-riga-form label.corto input[type=number]{width:100%}
  .prg-riga-form .btn{flex:1 1 100%;justify-content:center}
  .prg-acconti{padding-left:10px}
  .prg-foglio td.az{text-align:left}
  table.tab-schede.prg-foglio td{background:transparent !important}
  table.tab-schede.prg-foglio tr.cap,table.tab-schede.prg-foglio tr.prg-capitolo{background:#eef3f4;border-color:#dbe7e7}
  .prg-scorri,.prg-scorri-bassa{max-height:none;overflow:visible}
  .prg-salva{bottom:6px;padding:9px 12px;gap:8px 18px}
  .prg-salva .btn{flex:1 1 100%;margin:0;justify-content:center}
  .prg-mini{width:100%}
  .prg-mini .prg-barra{flex:1 1 auto;width:auto}
  .prg-pericolo{flex-direction:column;align-items:stretch}

  /* Elenco progetti: il nome fa da titolo della scheda, la commessa piccola sotto. */
  table.tab-schede.prg-elenco td:nth-child(2){order:-2;flex:1 1 100%;width:100%;font-size:15px;line-height:1.3;flex-wrap:wrap}
  table.tab-schede.prg-elenco td:nth-child(2)::before{display:none}
  table.tab-schede.prg-elenco td:nth-child(2) .micro{flex:1 1 100%;margin:0}
  table.tab-schede.prg-elenco tr>td:first-child{order:-1;width:auto;font-size:12px}
  table.tab-schede.prg-elenco td:nth-child(7){flex:1 1 100%}
  table.tab-schede.prg-elenco td:nth-child(7)::before{display:none}
  table.tab-schede.prg-elenco tr>td:last-child{position:absolute;top:9px;right:8px;width:auto;margin:0}
  table.tab-schede.prg-elenco td:nth-child(2){padding-right:30px}

  /* SAL in cantiere: posizione, descrizione e casella % sulla prima riga; gli importi sotto.
     Con l'impaginazione generica ogni posizione occupava 272px: 102 posizioni erano 34'000px. */
  .tab-schede.tab-prg-sal tr{align-items:center;gap:3px 10px;padding:10px 12px;row-gap:2px}
  .tab-schede.tab-prg-sal tr.prg-pos td:nth-child(1){display:none}          /* capitolo: già nella riga sopra */
  .tab-schede.tab-prg-sal tr.prg-pos td:nth-child(2){order:1;flex:0 0 auto;width:auto;font-size:13px;font-weight:700}
  .tab-schede.tab-prg-sal tr.prg-pos td:nth-child(3){order:2;flex:1 1 40%;width:auto;font-size:13.5px;flex-wrap:wrap}
  .tab-schede.tab-prg-sal tr.prg-pos td:nth-child(3) .prg-desc{flex:1 1 100%}
  .tab-schede.tab-prg-sal tr.prg-pos td:nth-child(3) .prg-avz{flex:1 1 100%;max-width:none;margin-top:3px}
  .tab-schede.tab-prg-sal tr.prg-pos td:nth-child(6){order:3;flex:0 0 78px;width:78px;margin-left:auto}
  .tab-schede.tab-prg-sal tr.prg-pos td:nth-child(6)::before{display:none}
  .tab-schede.tab-prg-sal tr.prg-pos td:nth-child(6)::after{content:'%';margin-left:5px;color:var(--muted);font-size:12px}
  .tab-schede.tab-prg-sal tr.prg-pos td:nth-child(2)::before,
  .tab-schede.tab-prg-sal tr.prg-pos td:nth-child(3)::before{display:none}
  .tab-schede.tab-prg-sal tr.prg-pos td:nth-child(6) input{width:56px !important;min-height:40px;text-align:center !important;
    font-size:16px;font-weight:700}
  .tab-schede.tab-prg-sal tr.prg-pos td:nth-child(4),
  .tab-schede.tab-prg-sal tr.prg-pos td:nth-child(5),
  .tab-schede.tab-prg-sal tr.prg-pos td:nth-child(7),
  .tab-schede.tab-prg-sal tr.prg-pos td:nth-child(8){order:4;flex:0 0 auto;width:auto;font-size:11.5px;gap:3px}
  .tab-schede.tab-prg-sal tr.prg-pos td:nth-child(4)::before,
  .tab-schede.tab-prg-sal tr.prg-pos td:nth-child(5)::before,
  .tab-schede.tab-prg-sal tr.prg-pos td:nth-child(7)::before,
  .tab-schede.tab-prg-sal tr.prg-pos td:nth-child(8)::before{font-size:9px}
  .tab-schede.tab-prg-sal tr.prg-pos td:nth-child(4)::before{content:'prev.'}
  .tab-schede.tab-prg-sal tr.prg-pos td:nth-child(7)::before{content:'matur.'}
  .tab-schede.tab-prg-sal tr.prg-pos td:nth-child(8)::before{content:'diff.'}
  /* La riga di capitolo resta un'intestazione, non una scheda. */
  .tab-schede.tab-prg-sal tr.prg-capitolo{padding:9px 12px}
  .tab-schede.tab-prg-sal tr.prg-capitolo td:nth-child(1){display:inline-flex;width:auto;font-size:13px}
  .tab-schede.tab-prg-sal tr.prg-capitolo td:nth-child(3){order:0;flex:1 1 auto;font-size:13.5px}
  .tab-schede.tab-prg-sal tr.prg-capitolo td::before{display:none}
  /* La riga del totale non è una posizione: etichette sue e niente «%» appiccicato
     (prima ereditava le regole delle posizioni e usciva «10'926.68 %»). */
  .tab-schede.tab-prg-sal tr.prg-totale{background:#f4f7f9;gap:4px 14px}
  .tab-schede.tab-prg-sal tr.prg-totale td{order:0;flex:0 0 auto;width:auto;font-size:12.5px;display:inline-flex}
  .tab-schede.tab-prg-sal tr.prg-totale td:first-child{flex:1 1 100%;font-size:13.5px}
  .tab-schede.tab-prg-sal tr.prg-totale td::after{content:none}
  .tab-schede.tab-prg-sal tr.prg-totale td::before{content:attr(data-lbl);font-size:9px}
  .tab-schede.tab-prg-sal tr.prg-totale td:first-child::before{display:none}
  .tab-schede.tab-prg-sal tr.prg-totale td:empty{display:none}

  /* Griglia delle voci: descrizione a tutta larghezza, il resto in fila. */
  table.tab-schede.prg-griglia tr{gap:6px 8px;align-items:center}
  table.tab-schede.prg-griglia td{flex:0 0 auto;width:auto}
  table.tab-schede.prg-griglia tr>td:first-child{order:-1;width:auto;font-size:11px}
  table.tab-schede.prg-griglia td.num::before{display:none}
  table.tab-schede.prg-griglia td:nth-child(5){flex:1 1 100%;width:100%}
  table.tab-schede.prg-griglia td:nth-child(6){margin-left:auto}
  table.tab-schede.prg-griglia input,table.tab-schede.prg-griglia select{border-color:#d5dee5;background:#fff;min-height:40px}
  table.tab-schede.prg-griglia .c-cap{width:4rem}
  table.tab-schede.prg-griglia .c-pos{width:5rem}
  table.tab-schede.prg-griglia .c-imp{width:8rem}
  table.tab-schede.prg-griglia tr.cap .sub{padding:0}
}

/* ══ PRG · scadenze e avvisi ══
   Un acconto previsto, una rata o una regia scaduti senza conferma sono un avviso rosso;
   entro sette giorni, ambra. La riga resta leggibile: si tinge appena. */
.prg-stato.rosso{background:#fbe7e4;color:#a8331f}
.prg-stato.ambra{background:#fdf3e2;color:#8a5d04}
.prg-foglio .eti.rosso{background:#fbe7e4;border-color:#f2c2bb;color:#a8331f}
.prg-foglio tbody tr.scaduta td{background:#fff5f4 !important}
.prg-cifre .v.neg{color:#a8331f}
.prg-avvisi{border:1px solid var(--line);border-left:4px solid #c0392b;background:#fff;border-radius:10px;padding:10px 14px;margin:0 0 14px;font-size:13px}
.prg-avvisi.ambra{border-left-color:#e0a72e}
.prg-avvisi strong{color:#a8331f}
.prg-avvisi.ambra strong{color:#8a5d04}
.prg-avvisi ul{margin:4px 0 0;padding-left:18px}
.prg-avvisi li{margin:2px 0}
.prg-avvisi a{font-weight:700;color:var(--ink)}
.prg-foglio form.in-linea{display:inline-flex;gap:6px;align-items:center;margin:0 4px 0 0;vertical-align:middle}
.prg-foglio form.in-linea input.mini{width:9.5rem;padding:4px 7px;font-size:12.5px;min-height:30px}
.prg-foglio form.in-linea .btn-primary{white-space:nowrap}
.hc-err{background:#fbe7e4 !important;color:#a8331f !important}
@media(max-width:640px){
  .prg-foglio form.in-linea{display:flex;flex-wrap:wrap;width:100%;margin:0 0 6px}
  .prg-foglio form.in-linea input.mini{flex:1 1 140px;width:auto;min-height:40px}
  .prg-foglio form.in-linea .btn{flex:1 1 auto}
  .prg-avvisi{padding:10px 12px}
  /* l'ultima cifra dispari occupa la riga intera invece di restare orfana a sinistra */
  .prg-cifre .cifra:last-child:nth-child(odd){grid-column:1 / -1;border-left:0}
}
.btn-x{padding:4px 9px;font-size:13px;line-height:1;color:var(--muted)}
.btn-x:hover{color:#a8331f;border-color:#a8331f}
.prg-foglio form.in-linea.sotto-pill{display:flex;margin:5px 0 0}
.prg-foglio form.in-linea input.mini{width:8rem}
@media(max-width:640px){
  table.tab-schede.prg-foglio td .micro{flex:1 1 100%;margin:0}
}

/* ══ PRG · revisione visiva (7 set 2026): meno decorazione, più foglio ══ */
/* 1. Pulsanti primari piatti: dentro a un foglio la sfumatura con l'alone stonava. */
.prg-blocco .btn-primary,.prg-testa .btn-primary,.prg-salva .btn-primary,.prg-filtri .btn-primary,.prg-pericolo .btn-primary{
  background:var(--teal-d);box-shadow:none}
.prg-blocco .btn-primary:hover,.prg-testa .btn-primary:hover,.prg-salva .btn-primary:hover,.prg-filtri .btn-primary:hover{
  background:#086b61;box-shadow:none}
.prg-blocco .btn-primary::after,.prg-testa .btn-primary::after,.prg-salva .btn-primary::after,.prg-filtri .btn-primary::after{display:none}
/* 2. Un solo livello di icone: quella del titolo di pagina. I titoli di blocco restano testo. */
.prg-testata h2 .ic{display:none}
/* 3. Due blocchi affiancati sul monitor (andamento e conto; andamento e SAL), uno sotto l'altro sotto i 1000px. */
.prg-due{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px;align-items:stretch}
.prg-due>.prg-blocco{margin-bottom:0}
.prg-due .prg-cifre{grid-template-columns:1fr 1fr}
.prg-due .prg-cifre .cifra:nth-child(odd){border-left:0}
.prg-due .prg-cifre .cifra:nth-child(n+3){border-top:1px solid var(--line-2)}
.prg-due .prg-cifre .cifra:last-child:nth-child(odd){grid-column:1 / -1}
.prg-due .prg-conto .n{width:140px}
.prg-due .prg-conto td{padding:8px 12px}
.prg-sopra-linea{border-top:1px solid var(--line)}
@media(max-width:1000px){ .prg-due{grid-template-columns:1fr} .prg-due>.prg-blocco{margin-bottom:0} }
/* 4. Tutta la riga apre il dettaglio anche sul monitor: freccetta al posto del pulsante «Apri». */
.prg-foglio tbody tr:has(.riga-vai){position:relative;cursor:pointer}
.prg-foglio .riga-vai{border:0;background:none;padding:0 6px;font-size:20px;line-height:1;color:var(--muted);box-shadow:none}
.prg-foglio .riga-vai .rv-txt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.prg-foglio .riga-vai .rv-ico{display:inline}
.prg-foglio .riga-vai::after{content:'';position:absolute;inset:0;z-index:0}
.prg-foglio tbody tr:has(.riga-vai) a:not(.riga-vai),
.prg-foglio tbody tr:has(.riga-vai) button,
.prg-foglio tbody tr:has(.riga-vai) input,
.prg-foglio tbody tr:has(.riga-vai) select,
.prg-foglio tbody tr:has(.riga-vai) form{position:relative;z-index:1}
.prg-foglio tbody tr:has(.riga-vai):hover .riga-vai{color:var(--teal-d)}

/* ══════════════════ FASE 1 · COMPONENTI CONDIVISI, SOLO AMMINISTRAZIONE ══════════════════
   Revisione visiva del 7 set 2026: meno decorazione, più foglio, su tutti i moduli insieme.
   Le regole valgono solo nell'area amministrativa (body senza .portale-body): il portale
   clienti usa lo stesso file e non cambia. */

/* 1. Pulsanti primari piatti: la sfumatura con l'alone stonava su pagine fatte di numeri. */
body:not(.portale-body) .btn-primary{background:var(--teal-d);box-shadow:none}
body:not(.portale-body) .btn-primary:hover,body:not(.portale-body) .btn-primary:focus-visible{background:#086b61;box-shadow:none}
body:not(.portale-body) .btn-primary::after{display:none}

/* 2. Strisce dei numeri: via la lineetta sotto ogni cifra (uguale ovunque, non diceva niente),
      niente ombra; sul telefono l'ultima cifra dispari occupa la riga intera. */
body:not(.portale-body) .statstrip{box-shadow:none;border-radius:10px}
body:not(.portale-body) .statstrip .accent{display:none}
body:not(.portale-body) .statstrip .v{font-size:19px}
@media(max-width:640px){
  body:not(.portale-body) .statstrip .cell:last-child:nth-child(odd){flex-basis:100%}
}

/* 3. Card sobrie e titoli di blocco uniformi (come i blocchi del PRG). */
body:not(.portale-body) .card{border-radius:10px;box-shadow:none;padding:16px 18px;margin-bottom:14px}
body:not(.portale-body) .card-head{margin-bottom:12px}
body:not(.portale-body) .card-head h2{font-size:12.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2);
  display:flex;align-items:center;gap:8px}
body:not(.portale-body) .card-head h2 .ic{width:15px;height:15px;color:var(--teal-d)}
body:not(.portale-body) .kpi{box-shadow:none;border-radius:10px}
body:not(.portale-body) .card-evidenza{box-shadow:none;border-left:4px solid #e0a72e}

/* 4. Tabelle più fitte sul monitor (sul telefono restano le schede). */
@media(min-width:641px){
  body:not(.portale-body) .tab th{padding:7px 10px;font-size:10.5px;background:#eef2f4}
  body:not(.portale-body) .tab td{padding:7px 10px;font-size:13px}
  body:not(.portale-body) .tab tbody tr:nth-child(even) td{background:#fbfcfd}
  body:not(.portale-body) .tab tbody tr:hover td{background:#f2f8f8}
}

/* 5. Linguette: a segmenti sul monitor, niente barra bianca con l'ombra; sul telefono la
      fila scorre di lato e il bordo destro si dissolve, così si capisce che continua. */
body:not(.portale-body) .sub-tabs{background:transparent;border:0;box-shadow:none;padding:0;gap:8px;margin-bottom:14px}
body:not(.portale-body) .sub-tab{border:1px solid var(--line);background:#fff;border-radius:8px;padding:6px 11px;font-size:13px;font-weight:700;color:var(--ink-2)}
body:not(.portale-body) .sub-tab:hover{color:var(--teal-d);background:#fff;border-color:var(--teal)}
body:not(.portale-body) .sub-tab.on{background:var(--teal-d);color:#fff;border-color:var(--teal-d);box-shadow:none}
body:not(.portale-body) .sub-tab .st-n{background:#eef2f4;color:var(--muted);min-width:20px;height:20px;font-size:11px}
body:not(.portale-body) .sub-tab.on .st-n{background:rgba(255,255,255,.25);color:#fff}
body:not(.portale-body) .sub-tab-crea{border-style:dashed;background:transparent}
@media(max-width:640px){
  body:not(.portale-body) .sub-tabs{padding:0 0 4px;gap:6px}
  body:not(.portale-body) .sub-tabs::after{content:'';flex:0 0 32px;position:sticky;right:0;margin-left:-32px;align-self:stretch;
    background:linear-gradient(90deg,rgba(242,245,249,0),var(--bg) 70%);pointer-events:none}
  body:not(.portale-body) .sub-tab{padding:6px 10px;font-size:12.5px;white-space:nowrap}
}

/* 6. Titoli di pagina compatti: il titolo è già nella barra in alto e il «?» spiega la pagina,
      quindi il paragrafo introduttivo se ne va (31 pagine, 60-120 px l'una sul telefono). */
body:not(.portale-body) .portale-benvenuto{margin:2px 0 14px}
body:not(.portale-body) .portale-benvenuto h1{font-size:22px}
body:not(.portale-body) .portale-benvenuto>p{display:none}
body:not(.portale-body) .portale-benvenuto>.form-azioni{margin-top:8px}

/* Ritocchi di pagina che bastano in CSS. */
body:not(.portale-body) td.pwd strong{font-weight:600;color:var(--ink-2)}              /* password: in vista, non gridate */
body:not(.portale-body) .etic-tab .btn-primary{background:#fff;color:var(--teal-d);border:1px solid var(--line)}
body:not(.portale-body) .etic-tab .btn-primary:hover{border-color:var(--teal);background:#fff}
body:not(.portale-body) .etic-tab .badge{white-space:nowrap}
body:not(.portale-body) .etic-tab td .btn{display:inline-flex;margin:2px 4px 2px 0}

/* ══ FASE 2 · spiegazioni richiudibili, copertura a righe, sezioni e indice ══ */
body:not(.portale-body) details.spiega{margin:0 0 12px}
body:not(.portale-body) details.spiega>summary{cursor:pointer;list-style:none;display:inline-flex;align-items:center;gap:6px;
  font-size:12.5px;font-weight:700;color:var(--teal-d);padding:2px 0}
body:not(.portale-body) details.spiega>summary::-webkit-details-marker{display:none}
body:not(.portale-body) details.spiega>summary::before{content:'▸';font-size:11px;transition:transform .15s}
body:not(.portale-body) details.spiega[open]>summary::before{transform:rotate(90deg)}
body:not(.portale-body) details.spiega>summary~*{margin-top:8px}
body:not(.portale-body) .ftp-essenziale{margin-bottom:10px}
/* copertura: la riga di ogni contatore, chiusa; dentro il dettaglio di prima */
body:not(.portale-body) details.cop-det{padding:10px 16px}
body:not(.portale-body) details.cop-det>summary{display:flex;align-items:center;gap:6px 14px;flex-wrap:wrap;cursor:pointer;list-style:none;padding:2px 0}
body:not(.portale-body) details.cop-det>summary::-webkit-details-marker{display:none}
body:not(.portale-body) details.cop-det>summary::before{content:'▸';color:var(--muted);font-size:12px;width:10px;transition:transform .15s}
body:not(.portale-body) details.cop-det[open]>summary::before{transform:rotate(90deg)}
body:not(.portale-body) details.cop-det[open]>summary{margin-bottom:6px;padding-bottom:8px;border-bottom:1px solid var(--line-2)}
body:not(.portale-body) .cop-sigla{font-weight:700;font-size:14px}
body:not(.portale-body) .cop-stato{flex:1 1 auto;font-size:13px;color:var(--ink-2)}
body:not(.portale-body) .cop-num{font-size:12px;color:var(--muted);white-space:nowrap}
body:not(.portale-body) details.cop-det .statstrip{border-radius:8px}
/* monitoraggio reti: sezioni che si richiudono */
body:not(.portale-body) details.sez-mon>summary{cursor:pointer;list-style:none}
body:not(.portale-body) details.sez-mon>summary::-webkit-details-marker{display:none}
body:not(.portale-body) details.sez-mon>summary h2::before{content:'▾';color:var(--teal-d);font-size:13px;width:12px}
body:not(.portale-body) details.sez-mon:not([open])>summary h2::before{content:'▸'}
body:not(.portale-body) details.sez-mon:not([open])>summary{margin-bottom:0}
/* indice della pagina anche sul monitor, solo dove c'è il segnaposto .pagina-lunga */
@media(min-width:641px){
  body:not(.portale-body) .content:has(.pagina-lunga) .ind-pagina{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap;
    position:sticky;top:0;z-index:40;margin:-6px 0 14px;padding:8px 0;background:var(--bg)}
  body:not(.portale-body) .content:has(.pagina-lunga) .ind-eti{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700}
  body:not(.portale-body) .content:has(.pagina-lunga) .ind-voci{display:flex;gap:6px;flex-wrap:wrap}
  body:not(.portale-body) .content:has(.pagina-lunga) .ind-voci a{font-size:12px;font-weight:600;color:var(--ink-2);text-decoration:none;
    padding:5px 10px;border:1px solid var(--line);border-radius:99px;background:#fff;white-space:nowrap}
  body:not(.portale-body) .content:has(.pagina-lunga) .ind-voci a.qui{background:var(--teal-d);border-color:var(--teal-d);color:#fff}
  body:not(.portale-body) .content:has(.pagina-lunga) section.card,
  body:not(.portale-body) .content:has(.pagina-lunga) details.card{scroll-margin-top:56px}
}
/* ETIC: stato su una riga e i due pulsanti «lettere» affiancati (la tabella dell'elenco è .tab) */
body:not(.portale-body) .tab .badge{white-space:nowrap}
body:not(.portale-body) table.tab td:last-child{white-space:nowrap}
body:not(.portale-body) table.tab td:last-child .btn{display:inline-flex;margin:2px 4px 2px 0}

/* ══ Sezioni dell'elemento aperto nel menu a sinistra (PRG: il progetto) ══
   Sotto la voce primaria compaiono le sezioni dell'elemento in cui si è entrati, così la
   scheda mostra una sezione per volta. Sul telefono la stessa lista è una fila di linguette
   sotto al titolo, perché il menu laterale sta dietro all'hamburger. */
.nav-sotto{display:flex;flex-direction:column;align-items:stretch;gap:1px;margin:2px 0 8px 12px;padding-left:8px;border-left:2px solid rgba(255,255,255,.14)}
.nav-sotto .nav-item{width:auto;flex:0 0 auto}
.nav-sotto-titolo{font-size:11.5px;font-weight:700;color:#9fb4c9;padding:6px 10px 3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav-sotto-titolo .mono{font-weight:500;color:#6f8aa6;margin-left:6px;font-size:11px}
.nav-item.nav-sotto-item{font-size:13px;padding:7px 10px;color:#aac0d6;font-weight:600}
.nav-item.nav-sotto-item .ic{width:1em;height:1em}
.nav-item.nav-aperto{background:rgba(255,255,255,.05)}
.sidebar-min .nav-sotto{margin-left:0;padding-left:0;border-left:0}
.sidebar-min .nav-sotto-titolo{display:none}
.prg-sezioni{display:none}
@media(max-width:640px){
  .prg-sezioni{display:flex;gap:6px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin:0 0 12px;padding-bottom:2px}
  .prg-sezioni::-webkit-scrollbar{display:none}
  .prg-sezioni a{flex:0 0 auto;font-size:12.5px;font-weight:700;color:var(--ink-2);text-decoration:none;padding:6px 11px;
    border:1px solid var(--line);border-radius:99px;background:#fff;white-space:nowrap}
  .prg-sezioni a.on{background:var(--teal-d);border-color:var(--teal-d);color:#fff}
}

/* ══ ENERGIA CONDIVISA (modulo LMC, vista per AEMo) ══ */
body:not(.portale-body) .cd-filtri{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap;margin:0 0 12px}
body:not(.portale-body) .cd-filtri .sub-tabs{margin:0;padding:4px}
body:not(.portale-body) .cd-filtri label{display:flex;flex-direction:column;gap:4px;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
body:not(.portale-body) .cd-filtri select{min-width:160px}
body:not(.portale-body) .cd-filtri .cd-csv{margin-left:auto}
body:not(.portale-body) .cd-agg{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 14px}
body:not(.portale-body) .cd-agg form{margin:0}
body:not(.portale-body) .cd-cifre{margin-bottom:18px}
body:not(.portale-body) .cd-nd{color:var(--muted);font-style:italic;font-weight:500}
.cd-barra{width:88px;height:6px;vertical-align:middle;margin-right:8px}
.cd-barra-fondo{fill:var(--line-2)}
.cd-barra-val{fill:var(--teal)}
.cd-tab th{white-space:normal;line-height:1.25;vertical-align:bottom}
.cd-tab td:first-child{min-width:150px}
.cd-tab td.quota{white-space:nowrap}
.cd-tab tr.in-corso td:first-child .pill{margin-left:6px;vertical-align:1px}
.cd-legenda{display:flex;gap:18px;flex-wrap:wrap;font-size:12.5px;color:var(--muted);margin:8px 0 0}
.cd-legenda i{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.cd-sw-g{background:#0a8478}.cd-sw-c{background:#6d28d9}.cd-sw-i{background:#b7c3cb}
.cd-impianti>summary{cursor:pointer;list-style:none;margin-bottom:0}
.cd-impianti>summary::-webkit-details-marker{display:none}
.cd-impianti>summary h2::before{content:'▸';display:inline-block;margin-right:8px;color:var(--muted);transition:transform .15s}
.cd-impianti[open]>summary h2::before{transform:rotate(90deg)}
.cd-impianti[open]>summary{margin-bottom:16px}
@media (max-width:640px){
  body:not(.portale-body) .cd-filtri .cd-csv{margin-left:0}
  .cd-barra{width:56px}
}

/* ══ MGII: eliminazione contratti (disdetta) e confronto con la lista Gecoti ══ */
.ii-pericolo{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:14px 0 0;padding-top:12px;border-top:1px dashed var(--line);font-size:12.5px}
.ii-pericolo input[type=text]{flex:1;min-width:200px}
.ii-azioni-blocco{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 12px}
.ii-azioni-blocco input[type=text]{flex:1;min-width:200px}
@media (max-width:640px){.ii-pericolo,.ii-azioni-blocco{flex-direction:column;align-items:stretch}}

/* ── «Copia» di riga (Contratti & Impianti, 22.09.2026): per 1,5 s il bottone dice com'è andata ── */
.btn.copiato{background:#e6f6ee;border-color:#bfe6cf;color:#0b8458}
.btn.copia-ko{background:#fbe9e7;border-color:#f3ccc7;color:#c8362f}

/* ══ Cantieri attivi (23.09.2026): parco quadri 1–55, schede, anteprima import ══ */
.ca-regole{margin-top:6px;max-width:980px}
.muted-amb{color:#9a6200;font-weight:600}
.st-nocens{background:#f4f6f8;color:#6b7c88;border-color:#dde4ea;border-style:dashed}.st-nocens .dot{background:#aab7c0}
.st-posato{background:#eef1f4;color:#4f626e;border-color:#d8dee4}.st-posato .dot{background:#8a9aa4}
.qc-parco{display:grid;grid-template-columns:repeat(auto-fill,minmax(54px,1fr));gap:6px}
.qc-tile{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-height:50px;
  border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink-2);font-weight:700;font-size:15px;
  font-variant-numeric:tabular-nums;text-decoration:none;line-height:1.1}
.qc-tile small{max-width:100%;padding:0 4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:9.5px;font-weight:600;color:var(--muted)}
.qc-tile:hover{border-color:var(--teal);text-decoration:none;box-shadow:0 2px 8px rgba(13,38,59,.08)}
.qc-tile:focus-visible{outline:2px solid var(--teal-d);outline-offset:2px}
.qc-posato{background:#eef1f4;border-color:#d8dee4;color:#4f626e}.qc-posato small{color:#6b7c88}
.qc-magazzino{background:#e6f6ee;border-color:#bfe6cf;color:#0b6e49}.qc-magazzino small{color:#2f7a5a}
.qc-nocens{background:transparent;border-style:dashed;color:#8a9aa4}
.qc-allerta::after,.qc-scadenza::after{content:'';position:absolute;top:5px;right:5px;width:8px;height:8px;border-radius:50%;background:#d9463d;box-shadow:0 0 0 2px #fff}
.qc-scadenza::after{background:#c8920a}
.qc-sel{outline:2px solid var(--teal-d);outline-offset:1px}
.qc-legenda{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:10px}
.qc-legenda span{display:inline-flex;align-items:center;gap:6px}
.qc-sw{display:inline-block;width:14px;height:14px;border-radius:4px;border:1px solid var(--line)}
.qc-sw.qc-posato{background:#eef1f4;border-color:#d8dee4}.qc-sw.qc-magazzino{background:#e6f6ee;border-color:#bfe6cf}.qc-sw.qc-nocens{border-style:dashed}
.qc-pt{display:inline-block;width:8px;height:8px;border-radius:50%}.qc-pt-rosso{background:#d9463d}.qc-pt-ambra{background:#c8920a}
.ca-filtri{display:flex;flex-wrap:wrap;gap:6px}
.chip-filtro{display:inline-flex;align-items:center;padding:5px 11px;border:1px solid var(--line);border-radius:99px;font-size:12px;font-weight:700;color:var(--ink-2);background:#fff;text-decoration:none}
.chip-filtro:hover{border-color:var(--teal);text-decoration:none}
.chip-filtro.on{background:var(--teal-d);border-color:var(--teal-d);color:#fff}
.ca-riga-mag td{background:#fafcfd}
.ca-riga-aperta td{background:#f5fbf8}
.ca-azioni{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.ca-griglia{display:grid;grid-template-columns:1fr 1.4fr;gap:8px 28px;margin-top:6px}
.ca-dati{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 18px;margin:8px 0 12px}
.ca-dati>div{min-width:0}
.ca-dati dt{font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin-bottom:2px}
.ca-dati dd{margin:0;font-size:13.5px;overflow-wrap:anywhere}
.ca-dati dd .btn-mini{margin-left:6px}
.ca-dati .ca-largo{grid-column:1/-1}
.ca-dafare-voce{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;margin:2px 0}
.ca-proposta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin:2px 0}
.ca-cerca{margin:4px 0 12px}
.ca-piano{margin:6px 0 10px;padding-left:18px;font-size:13px;line-height:1.55}
.ca-piano li{margin:2px 0}
.ca-piano a{font-weight:700;margin-right:4px}
.ca-piano-verifica li{color:#9a6200}
.ca-piano-chiude li,.ca-piano-magazzino li{color:#7a3b10}
@media(max-width:900px){.ca-griglia{grid-template-columns:1fr}}
@media(max-width:640px){
  .qc-parco{grid-template-columns:repeat(auto-fill,minmax(46px,1fr));gap:5px}
  .qc-tile{min-height:46px;font-size:14px}
  .ca-dati{grid-template-columns:1fr}
  .ca-azioni{width:100%}
  .ca-azioni .btn{flex:1 1 auto;justify-content:center}
}
.ca-campo-fisso{display:flex;flex-direction:column;gap:3px;font-size:13px}
.ca-campo-fisso .ca-etichetta{font-size:12.5px;font-weight:600;color:var(--ink-2)}
.ca-campo-fisso strong{font-size:14px;padding:7px 0}
.ca-file-vecchio{margin:0 0 12px;line-height:1.5}
/* scheda del quadro al passaggio del mouse sulla mappa del parco */
.qc-pop{display:none;position:absolute;z-index:60;left:50%;bottom:calc(100% + 10px);transform:translateX(-50%);
  width:300px;max-width:86vw;padding:12px 14px 10px;background:#fff;border:1px solid var(--line);border-radius:12px;
  box-shadow:0 14px 34px -10px rgba(13,38,59,.30),0 2px 6px rgba(13,38,59,.08);
  text-align:left;font-size:12.5px;font-weight:500;line-height:1.4;color:var(--ink-2);white-space:normal;pointer-events:none}
.qc-pop::after{content:'';position:absolute;left:50%;top:100%;margin-left:-7px;border:7px solid transparent;border-top-color:#fff;
  filter:drop-shadow(0 1px 0 var(--line))}
.qc-pop-sx .qc-pop{left:-4px;transform:none}.qc-pop-sx .qc-pop::after{left:26px}
.qc-pop-dx .qc-pop{left:auto;right:-4px;transform:none}.qc-pop-dx .qc-pop::after{left:auto;right:19px}
.qc-pop-giu .qc-pop{bottom:auto;top:calc(100% + 10px)}
.qc-pop-giu .qc-pop::after{top:auto;bottom:100%;border-top-color:transparent;border-bottom-color:#fff;filter:drop-shadow(0 -1px 0 var(--line))}
.qc-pop>span{display:block}
.qc-pop-testa{display:flex!important;align-items:center;gap:8px;margin-bottom:6px}
.qc-pop-testa strong{font-family:var(--font-head);font-size:15px;color:var(--ink)}
.qc-pop-fus{margin-left:auto;font-size:11px;font-weight:700;color:var(--muted);background:var(--line-2);border-radius:6px;padding:2px 7px}
.qc-pop-nome{font-size:14px;font-weight:700;color:var(--ink);margin-bottom:6px;overflow-wrap:anywhere}
.qc-pop-libero{color:#0b6e49}
.qc-pop-riga{display:grid!important;grid-template-columns:96px 1fr;gap:8px;padding:3px 0;border-top:1px solid var(--line-2)}
.qc-pop-k{font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);padding-top:1px}
.qc-pop-v{overflow-wrap:anywhere}.qc-pop-v small{color:var(--muted);font-weight:500}
.qc-pop-v.mono{font-family:ui-monospace,Menlo,monospace;font-size:12px}
.qc-pop-rasi{margin:6px 0 4px;padding:7px 9px;background:#f7f9fb;border-radius:9px}
.qc-pop-r{display:grid;grid-template-columns:10px 76px 1fr;align-items:baseline;gap:6px;padding:2px 0}
.qc-pop-r i{width:8px;height:8px;border-radius:50%;background:#aab7c0;align-self:center}
.qc-pop-r span{font-size:11.5px;font-weight:700;color:var(--ink-2)}
.qc-pop-r b{font-size:11.5px;font-weight:600;color:var(--ink-2)}
.qc-pop-rosso i{background:#d9463d}.qc-pop-rosso b{color:#c8362f}
.qc-pop-ambra i{background:#c8920a}.qc-pop-ambra b{color:#9a6200}
.qc-pop-verde i{background:#12a866}.qc-pop-verde b{color:#0b8458}
.qc-pop-grigio b{color:var(--muted)}
.qc-pop-piede{margin-top:6px;font-size:11px;color:var(--muted)}
@media (hover:hover) and (pointer:fine){
  .qc-tile:hover .qc-pop,.qc-tile:focus-visible .qc-pop{display:block;animation:qc-pop-in .14s ease-out backwards}
  .qc-tile:hover{z-index:61}
}
@keyframes qc-pop-in{from{opacity:0}}
@media (prefers-reduced-motion:reduce){.qc-tile:hover .qc-pop,.qc-tile:focus-visible .qc-pop{animation:none}}
/* la scheda del quadro deve stare sopra i riquadri che seguono (hanno un loro livello) */
.ca-parco-card{position:relative;z-index:6}
.ca-inst{margin-top:2px;color:var(--ink-2)}.ca-inst strong{font-weight:700}
/* casella «+» per aggiungere un quadro AEMo al parco */
.qc-nuovo{border-style:dashed;border-color:#9fd9bd;background:transparent;color:#0b8458;font-size:20px}
.qc-nuovo small{color:#0b8458}
.qc-nuovo:hover{background:#e6f6ee;border-color:#12a866}
/* filtri per installatore e paese (23.09.2026) */
.ca-filtri-sel{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px 14px;margin:0 0 12px}
.ca-filtri-sel label{display:flex;flex-direction:column;gap:3px;font-size:12px;font-weight:600;color:var(--ink-2)}
.ca-filtri-sel select{min-width:200px}
.ca-filtri-sel .link{padding-bottom:8px}
@media(max-width:640px){.ca-filtri-sel label{flex:1 1 100%}.ca-filtri-sel select{min-width:0;width:100%}}
.qc-fuori{opacity:.28}.qc-fuori:hover,.qc-fuori:focus-visible{opacity:1}
/* lettera di richiamo inviata dalla sezione Richiami */
.ca-lettera{display:inline-flex;flex-direction:column;gap:1px;margin-top:5px;padding:4px 9px;border:1px solid #c9dbf3;border-radius:8px;
  background:#eef4fc;color:#1f4f93;font-size:11.5px;line-height:1.35;text-decoration:none;max-width:100%}
.ca-lettera:hover{border-color:#2b63b5;text-decoration:none}
.ca-lettera-t{display:flex;align-items:center;gap:5px;font-weight:700}
.ca-lettera-d{font-size:11px;color:#3d5f8f;overflow-wrap:anywhere}
.ca-lettera-d b{font-weight:700;white-space:nowrap}
.ca-lettera-scaduta{background:#fdf0ef;border-color:#f1c9c5;color:#a8322b}.ca-lettera-scaduta .ca-lettera-d{color:#a8322b}
.ca-lettera-chiusa{background:#f4f6f8;border-color:#dde4ea;color:#4f626e}.ca-lettera-chiusa .ca-lettera-d{color:#6b7c88}
.ca-lettera-scheda{margin:2px 0 4px}
.qc-lettera::before{content:'';position:absolute;top:6px;left:5px;width:9px;height:7px;border-radius:2px;background:#2b63b5;box-shadow:0 0 0 2px #fff}
.qc-pt.qc-pt-blu{width:9px;height:7px;border-radius:2px;background:#2b63b5}
.qc-pop-v.qc-pop-lettera{color:#1f4f93;font-weight:700}.qc-pop-v.qc-pop-lettera-scaduta{color:#c8362f}
.ca-lettera-p{white-space:nowrap}
/* sul telefono la cella «Cantiere» (nome, luogo, installatore, lettera) va in colonna, non in fila */
@media (max-width:640px){
  table.tab-schede td:has(.ca-inst),table.tab-schede td:has(.ca-lettera){display:block;width:100%}
  table.tab-schede td:has(.ca-inst)::before,table.tab-schede td:has(.ca-lettera)::before{display:block;margin-bottom:2px}
  .ca-lettera{display:flex;width:100%}
}
/* pulsante del report «RaSi da chiedere» accanto ai filtri (24.09.2026) */
.ca-report-btn{margin-left:auto}
@media(max-width:640px){.ca-report-btn{margin-left:0;width:100%;justify-content:center}}