/* ─────────────────────────────────────────────────────────────────────────────
   DRCS — Design System v4 · pattern delle pagine PUBBLICHE (viste dai clienti)
   Da caricare DOPO assets/css/drcs.css (token e componenti). Solo token: niente
   colori esadecimali. quote_view.php resta sempre in tema chiaro.
   ──────────────────────────────────────────────────────────────────────────── */

/* ═══ 17b · PATTERN DI PAGINA ════════════════════════════════════════════
   Componenti specifici di sezione, sempre e solo con i token sopra. */

/* @group-G:start — Pagine pubbliche (preventivo, PDF, contratto, pagamento) */
/* Documenti per i clienti: tipografia ampia, molto respiro, importi in
   evidenza, un solo accento (il pulsante principale). Nessun Tailwind:
   reset minimo qui sotto. quote_view resta sempre in tema chiaro. */

/* Base comune (cx-) */
.cx-page { background: var(--bg); color: var(--ink); min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
:where(.cx-page) :where(h1, h2, h3, h4, p, ul, ol, dl, dd, figure, blockquote) { margin: 0; }
:where(.cx-page) :where(ul, ol) { padding: 0; }
.cx-page button { font-family: inherit; }
.cx-page .tabular { font-variant-numeric: tabular-nums; font-feature-settings: "tnum", "cv11"; }

/* Barra superiore */
.cx-topbar {
  position: sticky; top: 0; z-index: var(--z-sticky);
  background: color-mix(in srgb, var(--bg) 86%, transparent);
  -webkit-backdrop-filter: saturate(160%) blur(12px);
  backdrop-filter: saturate(160%) blur(12px);
  border-bottom: 1px solid var(--line);
}
.cx-topbar-inner {
  max-width: 880px; margin: 0 auto;
  height: 64px; padding: 0 var(--sp-6);
  display: flex; align-items: center; justify-content: space-between; gap: var(--sp-4);
}
.cx-topbar-inner.is-doc { max-width: 808px; }
.cx-brand { display: flex; align-items: center; gap: 12px; min-width: 0; color: inherit; }
.cx-brand-mark {
  width: 32px; height: 32px; border-radius: var(--r);
  background: var(--ink); color: var(--surface);
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 600; letter-spacing: 0.02em;
  flex-shrink: 0;
}
.cx-brand-logo { width: 32px; height: 32px; border-radius: var(--r); object-fit: contain; flex-shrink: 0; }
.cx-brand-text { min-width: 0; }
.cx-brand-name { font-size: 14px; font-weight: 600; color: var(--ink); letter-spacing: -0.012em; line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cx-brand-sub { font-size: 12.5px; color: var(--ink-3); line-height: 1.3; margin-top: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cx-topbar-actions { display: flex; align-items: center; gap: var(--sp-2); flex-shrink: 0; }

/* Piè di pagina */
.cx-footer { text-align: center; padding: var(--sp-8) var(--sp-4) 0; font-size: 12.5px; line-height: 1.6; color: var(--ink-3); }
.cx-footer p + p { color: var(--ink-4); }
.cx-footer a { color: var(--ink-3); }
.cx-footer a:hover { color: var(--ink); }
/* Segmenti del piè di pagina: in linea con "·", una riga ciascuno su mobile */
.cx-footer-sep { margin: 0 6px; color: var(--ink-5); }

/* ── Preventivo (qv-) ─────────────────────────────────────────────────── */
.qv-shell {
  width: 100%; max-width: 880px; margin: 0 auto;
  padding: var(--sp-10) var(--sp-6) var(--sp-16);
  display: flex; flex-direction: column; gap: var(--sp-4);
  flex: 1;
}
.qv-page .card { overflow: hidden; }

/* Intestazione del documento */
.qv-head-body { padding: var(--sp-10) var(--sp-10) var(--sp-8); }
.qv-head-top { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--sp-3); flex-wrap: wrap; }
.qv-kicker { font-size: 13px; font-weight: 500; color: var(--ink-3); line-height: 1.4; }
.qv-ref { color: var(--ink-2); }
.qv-kicker-sep { margin: 0 6px; color: var(--ink-4); }
.qv-title { margin-top: var(--sp-3); font-size: 30px; font-weight: 600; letter-spacing: -0.026em; line-height: 1.18; color: var(--ink); overflow-wrap: anywhere; max-width: 32ch; }
.qv-figure { margin-top: var(--sp-8); }
.qv-figure-label { font-size: 13px; font-weight: 500; color: var(--ink-3); line-height: 1.4; }
.qv-figure-value { margin-top: 2px; font-size: 40px; font-weight: 600; letter-spacing: -0.032em; line-height: 1.1; color: var(--ink); font-variant-numeric: tabular-nums; font-feature-settings: "tnum", "cv11"; white-space: nowrap; }
.qv-figure-sub { margin-top: var(--sp-4); font-size: 14px; color: var(--ink-3); line-height: 1.5; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.qv-figure + .qv-figure-sub { margin-top: var(--sp-2); }
.qv-figure-sub svg { width: 15px; height: 15px; color: var(--ink-4); }
.qv-figure-sub.is-expired, .qv-figure-sub.is-expired svg { color: var(--danger); }
.qv-figure-sub.is-done svg { color: var(--success); }

.qv-parties {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-6) var(--sp-8);
  padding: var(--sp-6) var(--sp-10) var(--sp-8);
  border-top: 1px solid var(--line);
}
.qv-label { font-size: 12.5px; font-weight: 500; color: var(--ink-3); line-height: 1.4; margin-bottom: var(--sp-2); }
.qv-party-name { font-size: 14px; font-weight: 600; color: var(--ink); line-height: 1.45; overflow-wrap: anywhere; }
.qv-party-line { font-size: 13.5px; color: var(--ink-2); line-height: 1.6; overflow-wrap: anywhere; }
.qv-party-line.is-soft { color: var(--ink-3); }
.qv-party-line a { color: var(--accent-text); }
.qv-party-line a:hover { text-decoration: underline; text-underline-offset: 2px; }
.qv-party-gap { height: var(--sp-2); }

/* Blocchi di contenuto */
.qv-block-body { padding: var(--sp-8) var(--sp-10); }
.qv-block-body + .qv-block-body { border-top: 1px solid var(--line); }
.qv-block-head { display: flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap; margin-bottom: var(--sp-4); }
.qv-h2 { font-size: 16px; font-weight: 600; letter-spacing: -0.014em; line-height: 1.35; color: var(--ink); }
.qv-h3 { font-size: 14px; font-weight: 600; letter-spacing: -0.01em; line-height: 1.4; color: var(--ink); margin-bottom: var(--sp-2); }
.qv-lead { font-size: 15.5px; line-height: 1.65; color: var(--ink-2); }
.qv-text { font-size: 14.5px; line-height: 1.7; color: var(--ink-2); }
.qv-text-sm { font-size: 13.5px; line-height: 1.6; color: var(--ink-3); }
.qv-lead + .qv-rich { margin-top: var(--sp-6); padding-top: var(--sp-6); border-top: 1px solid var(--line); }

/* Descrizione progetto (HTML scritto dall'amministratore) */
.qv-rich { color: var(--ink-2); font-size: 14.5px; line-height: 1.7; overflow-wrap: anywhere; }
.qv-rich h1, .qv-rich h2, .qv-rich h3, .qv-rich h4, .qv-rich h5, .qv-rich h6 { color: var(--ink); font-weight: 600; letter-spacing: -0.014em; line-height: 1.3; margin: var(--sp-6) 0 var(--sp-2); }
.qv-rich h1 { font-size: 20px; } .qv-rich h2 { font-size: 17px; } .qv-rich h3 { font-size: 15px; } .qv-rich h4, .qv-rich h5, .qv-rich h6 { font-size: 14.5px; }
.qv-rich > :first-child { margin-top: 0; }
.qv-rich > :last-child { margin-bottom: 0; }
.qv-rich p { margin: 0 0 var(--sp-3); }
.qv-rich ul, .qv-rich ol { margin: 0 0 var(--sp-4); padding-left: 22px; }
.qv-rich ul { list-style: disc; } .qv-rich ol { list-style: decimal; }
.qv-rich li { margin: 4px 0; padding-left: 2px; }
.qv-rich li::marker { color: var(--ink-4); }
.qv-rich strong, .qv-rich b { color: var(--ink); font-weight: 600; }
.qv-rich em { font-style: italic; }
.qv-rich a { color: var(--accent-text); text-decoration: underline; text-underline-offset: 2px; }
.qv-rich img { height: auto; border-radius: var(--r); }
.qv-rich table { font-size: 13.5px; }

.qv-mockups { display: flex; flex-direction: column; gap: var(--sp-4); }
.qv-mockups img { display: block; width: 100%; height: auto; border-radius: var(--r); border: 1px solid var(--line); }

/* Voci del preventivo */
.qv-group-head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--sp-3); padding: var(--sp-6) var(--sp-10) var(--sp-4); }
.qv-group-sub { font-size: 13px; color: var(--ink-3); margin-top: 2px; line-height: 1.45; }
.qv-items { font-size: 14px; }
.qv-items thead th { font-size: 12.5px; padding-top: 10px; padding-bottom: 10px; border-top: 1px solid var(--line); }
.qv-items thead th:first-child, .qv-items tbody td:first-child, .qv-items tfoot td:first-child { padding-left: var(--sp-10); }
.qv-items thead th:last-child, .qv-items tbody td:last-child, .qv-items tfoot td:last-child { padding-right: var(--sp-10); }
.qv-items thead th.num { text-align: right; }
.qv-items tbody td { padding-top: 16px; padding-bottom: 16px; vertical-align: top; color: var(--ink-2); }
.qv-items tbody tr:hover { background: transparent; }
/* Griglia unica per tutti i gruppi di voci: le colonne a larghezza fissa sono
   abbastanza ampie per "Importo mensile" e per "€12.345,67 / anno" nel piè, così
   nessuna tabella allarga la sua colonna e Q.tà/Prezzo/Sconto restano allineate. */
.qv-items .qv-col-qty { width: 72px; }
.qv-items .qv-col-price { width: 128px; }
.qv-items .qv-col-disc { width: 112px; }
.qv-items .qv-col-total { width: 184px; }
.qv-it-name { font-size: 14px; font-weight: 500; color: var(--ink); line-height: 1.45; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; overflow-wrap: anywhere; }
.qv-it-desc { font-size: 13px; color: var(--ink-3); line-height: 1.5; margin-top: 2px; overflow-wrap: anywhere; }
.qv-it-meta { display: none; }
.qv-items tbody td.qv-it-total { font-weight: 500; color: var(--ink); }
.qv-dash { color: var(--ink-5); }
.qv-saving { color: var(--success); font-weight: 500; white-space: nowrap; }
.qv-items tbody tr.is-discount td.qv-it-total, .qv-items tbody tr.is-discount td.qv-it-price { color: var(--success); }
.qv-strike { display: block; font-size: 12.5px; color: var(--ink-4); text-decoration: line-through; font-weight: 400; }
.qv-free { color: var(--success); font-weight: 600; }
.qv-items tr.is-included td { padding-top: 12px; padding-bottom: 12px; }
.qv-items tr.is-included .qv-it-name { font-weight: 400; color: var(--ink-2); }
.qv-items tr.is-included .qv-it-name svg { width: 15px; height: 15px; color: var(--success); }
.qv-items tr.is-included .qv-it-desc { padding-left: 23px; }
.qv-included-tag { margin-left: auto; font-size: 12.5px; color: var(--ink-3); font-weight: 400; }
.qv-items tfoot td { padding: 14px 16px; border-top: 1px solid var(--line); background: var(--surface-2); font-size: 13.5px; color: var(--ink-3); text-align: right; white-space: nowrap; }
.qv-items tfoot td.num { color: var(--ink); font-weight: 600; font-size: 15px; letter-spacing: -0.01em; }
.qv-per { font-size: 12.5px; font-weight: 500; color: var(--ink-3); letter-spacing: 0; }

/* Riepilogo */
.qv-summary-body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 360px); gap: var(--sp-6); padding: var(--sp-8) var(--sp-10); align-items: start; }
.qv-sum { display: flex; flex-direction: column; }
.qv-sum-row { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-4); padding: 6px 0; font-size: 14px; }
.qv-sum-row dt { color: var(--ink-3); }
.qv-sum-row dd { color: var(--ink); font-weight: 500; font-variant-numeric: tabular-nums; white-space: nowrap; }
.qv-sum-row.is-discount dd { color: var(--success); }
.qv-sum-row.is-total { margin-top: var(--sp-3); padding-top: var(--sp-4); border-top: 1px solid var(--line-2); align-items: baseline; }
.qv-sum-row.is-total dt { color: var(--ink); font-weight: 600; font-size: 15px; }
.qv-sum-row.is-total dd { font-size: 26px; font-weight: 600; letter-spacing: -0.028em; line-height: 1.15; }

/* Note */
.qv-note-text { font-size: 14.5px; line-height: 1.7; color: var(--ink-2); overflow-wrap: anywhere; }
.qv-note-text.is-legal { font-size: 13.5px; color: var(--ink-3); }

/* Contratti allegati e firma */
.qv-docs { list-style: none; display: flex; flex-direction: column; gap: var(--sp-2); margin-top: var(--sp-5); }
.qv-doc {
  display: flex; align-items: center; gap: var(--sp-3);
  padding: 12px 14px;
  border: 1px solid var(--line-2); border-radius: var(--r-md);
  background: var(--surface);
  transition: border-color var(--d-fast) var(--ease), background var(--d-fast) var(--ease);
}
.qv-doc:hover { border-color: var(--line-strong); background: var(--surface-2); }
.qv-doc-icon { width: 34px; height: 34px; border-radius: var(--r); background: var(--surface-3); color: var(--ink-3); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.qv-doc-icon svg { width: 16px; height: 16px; }
.qv-doc-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.qv-doc-title { font-size: 14px; font-weight: 500; color: var(--ink); line-height: 1.4; overflow-wrap: anywhere; }
.qv-doc-meta { font-size: 12.5px; color: var(--ink-3); line-height: 1.4; }
.qv-doc-go { width: 16px; height: 16px; color: var(--ink-4); flex-shrink: 0; }
.qv-doc:hover .qv-doc-go { color: var(--ink-2); }

.qv-sign { margin-top: var(--sp-6); padding: var(--sp-5); border: 1px solid var(--line-2); border-radius: var(--r-lg); background: var(--surface-2); display: flex; flex-direction: column; gap: var(--sp-5); }
.qv-check { display: flex; align-items: flex-start; gap: var(--sp-3); cursor: pointer; font-size: 14px; font-weight: 400; line-height: 1.6; color: var(--ink-2); }
.qv-check input[type="checkbox"] { width: 18px; height: 18px; margin: 3px 0 0; }
.qv-check strong { color: var(--ink); font-weight: 600; }
.qv-sign .input { height: var(--h-lg); font-size: 15px; background: var(--surface); }
.qv-signed { display: flex; align-items: flex-start; gap: 10px; margin-top: var(--sp-6); padding: 14px 16px; border-radius: var(--r-md); background: var(--success-bg); border: 1px solid var(--success-line); font-size: 14px; line-height: 1.5; color: var(--ink-2); }
.qv-signed svg { width: 18px; height: 18px; color: var(--success); margin-top: 1px; flex-shrink: 0; }
.qv-signed strong { color: var(--ink); font-weight: 600; }

/* Conferma e pagamento */
.qv-accept-body { padding: var(--sp-8) var(--sp-10); }
.qv-accept-body .qv-text { margin-top: var(--sp-2); max-width: 60ch; }
.qv-actions { display: flex; align-items: center; gap: var(--sp-3); margin-top: var(--sp-6); flex-wrap: wrap; }
.qv-actions .qv-actions-spacer { flex: 1; }
.qv-accept-foot {
  display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3) var(--sp-4); flex-wrap: wrap;
  padding: var(--sp-4) var(--sp-10);
  border-top: 1px solid var(--line); background: var(--surface-2);
}
.qv-paylogos { display: flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap; }
.qv-paylogo {
  height: 30px; min-width: 44px; padding: 0 8px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--surface); border: 1px solid var(--line-2); border-radius: var(--r-sm);
  font-size: 12px; font-weight: 500; color: var(--ink-2); white-space: nowrap;
}
.qv-paylogo img { display: block; max-height: 18px; max-width: 72px; width: auto; height: auto; }
.qv-paylogo.is-fallback::after { content: attr(data-label); }
.qv-secure { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--ink-3); }
.qv-secure svg { width: 14px; height: 14px; color: var(--success); }

/* Modale di pagamento */
.qv-modal:not(.is-open) { display: none; }
.qv-modal .modal-head { padding-right: 56px; }
.qv-modal-total { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-3); padding-bottom: var(--sp-4); margin-bottom: var(--sp-4); border-bottom: 1px solid var(--line); font-size: 14px; color: var(--ink-3); }
.qv-modal-total strong { font-size: 20px; font-weight: 600; color: var(--ink); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.qv-options { display: flex; flex-direction: column; gap: var(--sp-2); margin-bottom: var(--sp-4); }
.qv-option {
  display: flex; align-items: center; gap: var(--sp-3);
  min-height: 52px; padding: 10px 14px; margin: 0;
  border: 1px solid var(--line-2); border-radius: var(--r-md);
  background: var(--surface); cursor: pointer;
  font-size: 14px; font-weight: 500; color: var(--ink);
  transition: border-color var(--d-fast) var(--ease), background var(--d-fast) var(--ease), box-shadow var(--d-fast) var(--ease);
}
.qv-option:hover { border-color: var(--line-strong); }
.qv-option.is-selected { border-color: var(--accent); background: var(--accent-soft); box-shadow: 0 0 0 1px var(--accent); }
.qv-option input[type="radio"] { width: 16px; height: 16px; margin: 0; }
.qv-option-title { flex: 1; min-width: 0; }
.qv-option-amount { font-variant-numeric: tabular-nums; color: var(--ink-2); font-weight: 500; white-space: nowrap; }
.qv-option-amount small { font-size: 12.5px; color: var(--ink-3); font-weight: 400; }
.qv-hint { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; line-height: 1.5; color: var(--ink-3); margin-bottom: var(--sp-5); }
.qv-hint svg { width: 15px; height: 15px; color: var(--ink-4); margin-top: 2px; flex-shrink: 0; }
.qv-kv-list { display: flex; flex-direction: column; gap: 10px; padding: var(--sp-4); margin-bottom: var(--sp-5); border: 1px solid var(--line); border-radius: var(--r-md); background: var(--surface-2); font-size: 13.5px; }
.qv-kv { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-4); }
.qv-kv.hidden { display: none; }
.qv-kv > span:first-child { color: var(--ink-3); flex-shrink: 0; }
.qv-kv > span:last-child, .qv-kv > strong { color: var(--ink); font-weight: 500; text-align: right; overflow-wrap: anywhere; min-width: 0; }
.qv-kv.is-total { padding-top: 10px; border-top: 1px solid var(--line); }
.qv-kv.is-total > span:last-child { font-size: 18px; font-weight: 600; letter-spacing: -0.016em; font-variant-numeric: tabular-nums; }
.qv-kv > span.is-warn { color: var(--warning); }
.qv-iban { font-family: var(--f-mono); font-size: 12.5px; letter-spacing: 0; }
.qv-back { margin-top: var(--sp-4); }
.qv-step-label { font-size: 12.5px; font-weight: 500; color: var(--ink-3); margin-bottom: var(--sp-2); }
.qv-methods { display: flex; flex-direction: column; gap: var(--sp-2); }
.qv-method {
  display: flex; align-items: center; gap: var(--sp-3); width: 100%;
  padding: 12px 14px; text-align: left;
  border: 1px solid var(--line-2); border-radius: var(--r-md);
  background: var(--surface); color: var(--ink); cursor: pointer;
  transition: border-color var(--d-fast) var(--ease), background var(--d-fast) var(--ease);
}
.qv-method:hover { border-color: var(--accent); background: var(--accent-soft); }
.qv-method-icon { width: 36px; height: 36px; border-radius: var(--r); background: var(--surface-3); color: var(--ink-2); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.qv-method-icon svg { width: 18px; height: 18px; }
.qv-method-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.qv-method-title { font-size: 14px; font-weight: 600; color: var(--ink); line-height: 1.35; }
.qv-method-sub { font-size: 12.5px; color: var(--ink-3); line-height: 1.4; }
.qv-method > svg { width: 16px; height: 16px; color: var(--ink-4); flex-shrink: 0; }
.qv-processing { text-align: center; padding: var(--sp-10) 0; font-size: 14px; color: var(--ink-3); }
.qv-processing .spinner { width: 28px; height: 28px; border-width: 3px; margin-bottom: var(--sp-3); }
.qv-done { text-align: center; margin-bottom: var(--sp-5); }
.qv-done-icon { width: 48px; height: 48px; border-radius: 50%; margin: 0 auto var(--sp-3); background: var(--success-bg); color: var(--success); display: flex; align-items: center; justify-content: center; box-shadow: inset 0 0 0 1px var(--success-line); }
.qv-done-icon svg { width: 24px; height: 24px; }
.qv-done h3 { font-size: 18px; font-weight: 600; letter-spacing: -0.016em; color: var(--ink); }
.qv-done p { font-size: 13.5px; color: var(--ink-3); margin-top: 4px; }
.qv-stack { display: flex; flex-direction: column; gap: var(--sp-2); }
.qv-stack .spinner { width: 15px; height: 15px; border-color: color-mix(in srgb, var(--accent-ink) 45%, transparent); border-right-color: transparent; }
#btn-send-email.bg-green-600 { border-color: var(--success-solid); color: var(--accent-ink); opacity: 1; }

@media (max-width: 767.98px) {
  .qv-summary-body { grid-template-columns: minmax(0, 1fr); gap: var(--sp-3); }
}
/* Voci: sotto i 768px (come .table-stack) righe a scheda, nome + dettaglio a
   sinistra e importo a destra; la griglia a colonne resta per schermi larghi e stampa. */
.qv-page { --qv-pad-x: var(--sp-10); }
@media screen and (max-width: 767.98px) {
  .qv-items thead { display: none; }
  .qv-items, .qv-items tbody, .qv-items tfoot { display: block; width: 100%; }
  .qv-items tbody tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 16px; padding: 14px var(--qv-pad-x); border-top: 1px solid var(--line); }
  .qv-items.table tbody td { display: block; padding: 0; border: 0; }
  .qv-items tbody td.qv-cell-x { display: none; }
  .qv-items tbody td:first-child { grid-column: 1; }
  .qv-items tbody td.qv-it-total { grid-column: 2; grid-row: 1; text-align: right; font-size: 14.5px; }
  .qv-items tbody tr.is-included td { grid-column: 1 / -1; }
  .qv-it-meta { display: block; font-size: 12.5px; color: var(--ink-3); margin-top: 4px; font-variant-numeric: tabular-nums; }
  .qv-items tfoot tr { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-3); padding: 12px var(--qv-pad-x); background: var(--surface-2); border-top: 1px solid var(--line); }
  .qv-items.table tfoot td { padding: 0; border: 0; background: transparent; white-space: normal; text-align: left; }
  .qv-items tfoot td.num { text-align: right; white-space: nowrap; }
}
@media (max-width: 639.98px) {
  .qv-page { --qv-pad-x: var(--sp-5); }
  .cx-footer p > .cx-footer-seg { display: block; text-wrap: balance; }
  .cx-footer p > .cx-footer-sep { display: none; }
  .cx-topbar-inner { height: 56px; padding: 0 var(--sp-4); gap: var(--sp-3); }
  .cx-brand { gap: 10px; }
  .cx-brand-name { font-size: 13.5px; }
  .cx-brand-sub { font-size: 12px; }
  .cx-hide-sm { display: none; }
  .qv-shell { padding: var(--sp-4) var(--sp-3) var(--sp-12); gap: var(--sp-3); }
  .qv-head-body { padding: var(--sp-6) var(--sp-5) var(--sp-6); }
  .qv-kicker { display: flex; flex-direction: column; }
  .qv-kicker-sep { display: none; }
  .qv-kicker-date::first-letter { text-transform: uppercase; }
  .qv-kicker-date { display: block; }
  .qv-title { font-size: 23px; letter-spacing: -0.022em; max-width: none; }
  .qv-figure { margin-top: var(--sp-6); }
  .qv-figure-value { font-size: 32px; }
  .qv-parties { grid-template-columns: minmax(0, 1fr); gap: var(--sp-5); padding: var(--sp-5); }
  .qv-block-body, .qv-accept-body, .qv-summary-body { padding: var(--sp-6) var(--sp-5); }
  .qv-group-head { padding: var(--sp-5) var(--sp-5) var(--sp-3); }
  .qv-accept-foot { padding: var(--sp-4) var(--sp-5); }
  .qv-lead { font-size: 15px; }
  .qv-text, .qv-rich, .qv-note-text { font-size: 14.5px; }

  .qv-actions { flex-direction: column; align-items: stretch; gap: var(--sp-2); }
  .qv-actions .btn { width: 100%; }
  .qv-actions .qv-actions-spacer { display: none; }
  .qv-accept-foot { flex-direction: column; align-items: flex-start; }
  .qv-sum-row.is-total dd { font-size: 24px; }
}

@media print {
  html:has(> body.cx-page), .cx-page { background: var(--surface); }
  .qv-shell { max-width: none; padding: 0; gap: 12px; }
  .qv-page .card { box-shadow: none; }
}

/* ── Contratto (cv-) ──────────────────────────────────────────────────── */
.cv-main { width: 100%; max-width: 960px; margin: 0 auto; padding: var(--sp-10) var(--sp-6) var(--sp-16); flex: 1; }
.cv-doc { max-width: 760px; margin: 0 auto; padding: var(--sp-12) var(--sp-16); }
.cv-doc-head { padding-bottom: var(--sp-6); margin-bottom: var(--sp-8); border-bottom: 1px solid var(--line); }
.cv-kicker { font-size: 13px; font-weight: 500; color: var(--ink-3); display: flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap; }
.cv-title { margin-top: var(--sp-3); font-size: 30px; font-weight: 600; letter-spacing: -0.026em; line-height: 1.2; color: var(--ink); overflow-wrap: anywhere; }
.cv-meta { margin-top: var(--sp-5); display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-8); }
.cv-meta dt { font-size: 12.5px; font-weight: 500; color: var(--ink-3); }
.cv-meta dd { font-size: 14px; color: var(--ink); margin-top: 1px; }
.cv-body { font-size: 15px; line-height: 1.75; color: var(--ink-2); overflow-wrap: anywhere; }
.cv-body > :first-child { margin-top: 0; }
.cv-body h1, .cv-body h2 { font-size: 20px; font-weight: 600; letter-spacing: -0.018em; line-height: 1.3; color: var(--ink); margin: var(--sp-10) 0 var(--sp-3); }
.cv-body h3 { font-size: 15.5px; font-weight: 600; letter-spacing: -0.012em; line-height: 1.4; color: var(--ink); margin: var(--sp-8) 0 var(--sp-2); }
.cv-body h4 { font-size: 15px; font-weight: 600; color: var(--ink); margin: var(--sp-6) 0 var(--sp-2); }
.cv-body p { margin: 0 0 var(--sp-4); }
.cv-body ul, .cv-body ol { margin: 0 0 var(--sp-4); padding-left: 24px; }
.cv-body ul { list-style: disc; } .cv-body ol { list-style: decimal; }
.cv-body li { margin-bottom: 6px; }
.cv-body li::marker { color: var(--ink-4); }
.cv-body strong, .cv-body b { color: var(--ink); font-weight: 600; }
.cv-body a { color: var(--accent-text); text-decoration: underline; text-underline-offset: 2px; }
.cv-doc-foot { margin-top: var(--sp-12); padding-top: var(--sp-5); border-top: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2) var(--sp-4); flex-wrap: wrap; font-size: 12.5px; color: var(--ink-3); }
.cv-theme .cv-icon-light { display: none; }
.dark .cv-theme .cv-icon-light { display: inline-block; }
.dark .cv-theme .cv-icon-dark { display: none; }
@media (max-width: 639.98px) {
  .cv-main { padding: var(--sp-4) var(--sp-3) var(--sp-12); }
  .cv-doc { padding: var(--sp-6) var(--sp-5); }
  .cv-title { font-size: 23px; }
  .cv-body { font-size: 15px; line-height: 1.7; }
  .cv-body h1, .cv-body h2 { font-size: 18px; margin-top: var(--sp-8); }
}
@media print {
  .cv-main { padding: 0; max-width: none; }
  .cv-doc { border: 0; box-shadow: none; padding: 0; max-width: none; }
}

/* ── Esito pagamento / link (cx-result) ───────────────────────────────── */
.cx-center { flex: 1; display: flex; align-items: center; justify-content: center; padding: var(--sp-10) var(--sp-4); }
.cx-result { width: 100%; max-width: 440px; }
.cx-result-body { padding: var(--sp-10) var(--sp-8) var(--sp-8); text-align: center; }
.cx-result-icon { width: 52px; height: 52px; border-radius: 50%; margin: 0 auto var(--sp-5); display: flex; align-items: center; justify-content: center; background: var(--neutral-bg); color: var(--neutral); box-shadow: inset 0 0 0 1px var(--neutral-line); }
.cx-result-icon svg { width: 24px; height: 24px; }
.cx-result-icon.is-success { background: var(--success-bg); color: var(--success); box-shadow: inset 0 0 0 1px var(--success-line); }
.cx-result-icon.is-warn { background: var(--warning-bg); color: var(--warning); box-shadow: inset 0 0 0 1px var(--warning-line); }
.cx-result-icon.is-danger { background: var(--danger-bg); color: var(--danger); box-shadow: inset 0 0 0 1px var(--danger-line); }
.cx-result-title { font-size: 22px; font-weight: 600; letter-spacing: -0.022em; line-height: 1.25; color: var(--ink); text-wrap: balance; }
.cx-result-text { margin-top: var(--sp-2); font-size: 14.5px; line-height: 1.6; color: var(--ink-3); text-wrap: balance; }
.cx-result-amount { margin-top: 2px; font-size: 34px; font-weight: 600; letter-spacing: -0.03em; line-height: 1.1; color: var(--ink); font-variant-numeric: tabular-nums; }
.cx-result-amount-label { margin-top: var(--sp-6); font-size: 13px; font-weight: 500; color: var(--ink-3); }
.cx-result-for { margin-top: var(--sp-2); font-size: 14px; line-height: 1.5; color: var(--ink-2); }
.cx-dl { margin-top: var(--sp-6); padding-top: var(--sp-5); border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: 10px; text-align: left; }
.cx-dl > div { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-4); font-size: 13.5px; }
.cx-dl dt { color: var(--ink-3); flex-shrink: 0; }
.cx-dl dd { color: var(--ink); font-weight: 500; text-align: right; min-width: 0; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.cx-dl dd.is-success { color: var(--success); }
.cx-dl dd.is-warn { color: var(--warning); }
.cx-result .banner { margin: var(--sp-5) 0 0; text-align: left; }
.cx-result .banner p + p { margin-top: 2px; }
.cx-result-note { margin-top: var(--sp-5); font-size: 13.5px; color: var(--ink-3); line-height: 1.55; }
.cx-result-actions { margin-top: var(--sp-6); display: flex; flex-direction: column; gap: var(--sp-2); }
.cx-result-foot { padding: var(--sp-4) var(--sp-8); border-top: 1px solid var(--line); background: var(--surface-2); text-align: center; font-size: 13px; line-height: 1.6; color: var(--ink-3); }
.cx-result-foot a { color: var(--ink); font-weight: 500; }
.cx-result-foot a:hover { text-decoration: underline; text-underline-offset: 2px; }
.cx-result-foot .cx-sep { color: var(--ink-5); margin: 0 6px; }
.cx-brandline { display: flex; align-items: center; justify-content: center; gap: 10px; margin-bottom: var(--sp-6); color: var(--ink-2); font-size: 14px; font-weight: 600; letter-spacing: -0.01em; }
.cx-brandline .cx-brand-mark { width: 28px; height: 28px; font-size: 11px; }
@media (max-width: 639.98px) {
  .cx-center { align-items: flex-start; padding: var(--sp-8) var(--sp-3); }
  .cx-result-body { padding: var(--sp-8) var(--sp-5) var(--sp-6); }
  .cx-result-foot { padding: var(--sp-4) var(--sp-5); }
}
/* @group-G:end */

/* @group-G2:start — Pagine pubbliche (portale clienti, prenotazione, richiesta preventivo, login…) */
/* Prefisso .g2-* = componenti delle pagine viste dai clienti. Le classi senza
   prefisso (.cal-*, .slot-*, .toggle-btn, .fv-btn) sono generate dagli script
   esistenti: restano invariate e sono stilizzate solo dentro .g2-flow. */

/* ── Guscio: riusa le classi pubbliche condivise del gruppo G (.cx-page,
   .cx-topbar, .cx-brand, .cx-footer, .cx-result); qui solo le aggiunte ── */
.g2-main { flex: 1 0 auto; width: 100%; min-width: 0; }
.g2-container { width: 100%; max-width: 1120px; margin: 0 auto; padding: 0 var(--sp-6); min-width: 0; }
@media (max-width: 639.98px) { .g2-container { padding: 0 var(--sp-4); } }
.cx-topbar-inner.g2-wide { max-width: 1120px; }
.g2-secure { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--ink-3); white-space: nowrap; }
.g2-secure svg { width: 14px; height: 14px; color: var(--success); }
@media (max-width: 639.98px) { .g2-secure { display: none; } }
.g2-foot-pad { margin-top: var(--sp-12); padding-bottom: calc(var(--sp-10) + env(safe-area-inset-bottom)); }

/* Interruttore tema: mostra luna in chiaro, sole in scuro */
.dark .g2-icon-moon, html:not(.dark) .g2-icon-sun { display: none; }

/* ── Intestazione di pagina (hero) ── */
.g2-hero {
  display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap;
  gap: var(--sp-5) var(--sp-8);
  padding: var(--sp-12) 0 var(--sp-8);
}
.g2-hero-main { min-width: 0; flex: 1 1 360px; }
.g2-eyebrow { font-size: var(--fs-13); font-weight: 500; color: var(--ink-3); margin: 0 0 var(--sp-2); }
.g2-title { font-size: 32px; font-weight: 600; letter-spacing: -0.028em; line-height: 1.15; color: var(--ink); margin: 0; overflow-wrap: anywhere; }
.g2-lead { font-size: var(--fs-15); color: var(--ink-3); line-height: 1.55; margin: var(--sp-2) 0 0; max-width: 62ch; }
.g2-hero-meta { display: flex; align-items: center; flex-wrap: wrap; gap: var(--sp-2); margin-top: var(--sp-4); }
.g2-hero-stat { text-align: right; flex-shrink: 0; }
.g2-stat-label { font-size: var(--fs-13); color: var(--ink-3); margin: 0; }
.g2-stat-value { font-size: 28px; font-weight: 600; letter-spacing: -0.025em; line-height: 1.15; color: var(--ink); margin: 4px 0 0; font-variant-numeric: tabular-nums; white-space: nowrap; }
@media (max-width: 639.98px) {
  .g2-hero { padding: var(--sp-8) 0 var(--sp-6); }
  .g2-title { font-size: 26px; }
  .g2-lead { font-size: var(--fs-14); }
  .g2-hero-stat { text-align: left; flex: 1 1 100%; display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-3); padding-top: var(--sp-4); border-top: 1px solid var(--line); }
  .g2-stat-value { font-size: 22px; margin: 0; }
}

/* ── Griglie ── */
.g2-kpis { display: grid; gap: var(--sp-3); grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: var(--sp-8); }
@media (min-width: 768px) { .g2-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--sp-4); } }
.g2-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-6); align-items: start; }
.g2-col { display: flex; flex-direction: column; gap: var(--sp-6); min-width: 0; }
.g2-pair { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-6); }
@media (min-width: 768px) { .g2-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .g2-layout { grid-template-columns: minmax(0, 1fr) 360px; gap: var(--sp-8); } }
/* Su schermi stretti le due colonne si fondono: l'ordine mette prima ciò che serve al cliente */
@media (max-width: 1023.98px) {
  .g2-layout > .g2-col { display: contents; }
  .g2-o1 { order: 1; } .g2-o2 { order: 2; } .g2-o3 { order: 3; } .g2-o4 { order: 4; } .g2-o5 { order: 5; }
  .g2-o6 { order: 6; } .g2-o7 { order: 7; } .g2-o8 { order: 8; } .g2-o9 { order: 9; } .g2-o10 { order: 10; } .g2-o11 { order: 11; }
}
.g2-clip { overflow: hidden; }
/* Card a tutta larghezza sotto le due colonne ("I tuoi dati"): i gruppi si affiancano */
@media (min-width: 1024px) {
  .g2-layout { row-gap: var(--sp-6); }
  .g2-span { grid-column: 1 / -1; }
  .g2-dl-cols { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }
  .g2-dl-cols > .g2-dl-group { padding: 0 var(--sp-6); }
  .g2-dl-cols > .g2-dl-group:first-child { padding-left: 0; }
  .g2-dl-cols > .g2-dl-group:last-child { padding-right: 0; }
  .g2-dl-cols > .g2-dl-group + .g2-dl-group { border-top: 0; margin-top: 0; padding-top: 0; border-left: 1px solid var(--line); }
}
.g2-card-title-count { color: var(--ink-4); font-weight: 500; font-variant-numeric: tabular-nums; }

.g2-pair.is-single { grid-template-columns: minmax(0, 1fr); }
.g2-hero-company { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-14); color: var(--ink-2); }
.g2-hero-company svg { width: 15px; height: 15px; color: var(--ink-4); }
.g2-head-meta { display: flex; align-items: center; flex-wrap: wrap; gap: var(--sp-2); }
.g2-total { font-size: var(--fs-13); color: var(--ink-3); white-space: nowrap; margin-left: var(--sp-1); }
.g2-total strong { color: var(--ink); font-weight: 600; font-variant-numeric: tabular-nums; }
.g2-loading { display: flex; align-items: center; justify-content: center; gap: var(--sp-2); padding: var(--sp-6) 0; font-size: var(--fs-13); color: var(--ink-3); }
.g2-empty-compact { padding: var(--sp-5) var(--sp-2) var(--sp-3); }
.g2-tr-void .cell-name { color: var(--ink-3); }

/* ── Righe di elenco dentro le card ── */
.g2-list { list-style: none; margin: 0; padding: 0; }
.g2-row { display: flex; align-items: center; gap: var(--sp-4); padding: 14px var(--sp-5); border-bottom: 1px solid var(--line); min-width: 0; }
.g2-row:last-child { border-bottom: 0; }
.g2-row-main { flex: 1 1 auto; min-width: 0; }
.g2-row-title { font-size: var(--fs-14); font-weight: 500; color: var(--ink); margin: 0; line-height: 1.4; overflow-wrap: anywhere; }
.g2-row-title a { color: inherit; text-decoration: none; }
.g2-row-title a:hover { color: var(--accent-text); }
.g2-row-sub { font-size: 12.5px; color: var(--ink-3); margin: 2px 0 0; line-height: 1.45; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.g2-row-head { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px; margin-bottom: 4px; }
.g2-row-side { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; flex-shrink: 0; text-align: right; }
.g2-row-side .g2-row-sub { margin: 0; }
.g2-code { font-family: var(--f-mono); font-size: var(--fs-12); color: var(--ink-3); letter-spacing: -0.01em; }
.g2-amount { font-size: var(--fs-15); font-weight: 600; color: var(--ink); letter-spacing: -0.012em; font-variant-numeric: tabular-nums; white-space: nowrap; line-height: 1.3; }
.g2-amount.is-lg { font-size: var(--fs-18); }
.g2-amount.is-void { color: var(--ink-4); text-decoration: line-through; }
.g2-file-ic {
  width: 36px; height: 36px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--r); background: var(--surface-3); color: var(--ink-3);
}
.g2-file-ic svg { width: 17px; height: 17px; }
a.g2-row { color: inherit; text-decoration: none; transition: background var(--d-fast) var(--ease); }
a.g2-row:hover { background: var(--surface-2); }
@media (max-width: 639.98px) {
  .g2-row { padding: 12px var(--sp-4); gap: var(--sp-3); }
  .g2-row.is-stack-sm { flex-wrap: wrap; }
  .g2-row.is-stack-sm .g2-row-side { flex-direction: row; align-items: center; justify-content: space-between; width: 100%; }
}

/* Fatture su telefono: importo in alto a destra della card */
@media (max-width: 767.98px) {
  .g2-stack-amount tbody td.g2-td-amount { grid-column: 2 / 3; grid-row: 1; align-self: start; justify-content: flex-end; }
  .g2-stack-amount tbody td.g2-td-amount::before { content: none; }
}

/* Mostra altri (details) */
.g2-more { border-top: 1px solid var(--line); }
.g2-more > summary {
  list-style: none; cursor: pointer;
  display: flex; align-items: center; justify-content: center; gap: 6px;
  height: 44px; font-size: var(--fs-13); font-weight: 500; color: var(--ink-3);
}
.g2-more > summary::-webkit-details-marker { display: none; }
.g2-more > summary:hover { color: var(--ink); background: var(--surface-2); }
.g2-more > summary svg { width: 15px; height: 15px; transition: transform var(--d) var(--ease); }
.g2-more[open] > summary { border-bottom: 1px solid var(--line); }
.g2-more[open] > summary svg { transform: rotate(180deg); }
.g2-more[open] .g2-more-label-closed, .g2-more:not([open]) .g2-more-label-open { display: none; }

/* Tabelle del portale: colonne fisse per allineare la tabella principale e quella "mostra altre" */
.g2-table-fixed { table-layout: fixed; }
.g2-table-fixed .g2-col-date { width: 120px; }
.g2-table-fixed .g2-col-status { width: 150px; }
.g2-table-fixed .g2-col-amount { width: 130px; }
@media (max-width: 767.98px) { .g2-table-fixed { table-layout: auto; } }

/* ── Progetti: fisarmonica, avanzamento, timeline ── */
.g2-acc { border-bottom: 1px solid var(--line); }
.g2-acc:last-child { border-bottom: 0; }
.g2-acc > summary {
  list-style: none; cursor: pointer;
  display: flex; align-items: center; gap: var(--sp-4);
  padding: 16px var(--sp-5);
  transition: background var(--d-fast) var(--ease);
}
.g2-acc > summary::-webkit-details-marker { display: none; }
.g2-acc > summary:hover { background: var(--surface-2); }
.g2-acc-chev { color: var(--ink-4); transition: transform var(--d) var(--ease); }
.g2-acc[open] .g2-acc-chev { transform: rotate(90deg); color: var(--ink-2); }
.g2-acc-progress { display: flex; align-items: center; gap: 10px; flex-shrink: 0; width: 150px; }
.g2-acc-progress .progress { flex: 1; }
.g2-pct { font-size: var(--fs-13); font-weight: 600; color: var(--ink-2); font-variant-numeric: tabular-nums; min-width: 3.2ch; text-align: right; }
.g2-acc-body { padding: var(--sp-2) var(--sp-5) var(--sp-6) calc(var(--sp-5) + 32px); }
.g2-acc-desc { font-size: var(--fs-14); color: var(--ink-2); line-height: 1.6; margin: 0 0 var(--sp-5); max-width: 68ch; }
.g2-subhead { font-size: var(--fs-13); font-weight: 600; color: var(--ink); margin: var(--sp-6) 0 var(--sp-4); letter-spacing: -0.006em; }
.g2-kv { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); font-size: var(--fs-13); color: var(--ink-3); padding-top: var(--sp-4); margin-top: var(--sp-5); border-top: 1px solid var(--line); }
.g2-kv strong { color: var(--ink); font-weight: 600; font-variant-numeric: tabular-nums; }
@media (max-width: 639.98px) {
  .g2-acc > summary { display: grid; grid-template-columns: 16px minmax(0, 1fr); align-items: center; gap: 10px var(--sp-3); padding: 14px var(--sp-4); }
  .g2-acc-progress { grid-column: 2; width: auto; }
  .g2-acc-body { padding: var(--sp-2) var(--sp-4) var(--sp-5); }
}
.progress.is-lg { height: 8px; }
.g2-progress-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-3); margin-bottom: var(--sp-2); font-size: var(--fs-13); color: var(--ink-3); }

.g2-tl { list-style: none; margin: 0; padding: 0; }
.g2-tl-item { position: relative; display: grid; grid-template-columns: 28px minmax(0, 1fr); column-gap: var(--sp-4); padding-bottom: var(--sp-6); }
.g2-tl-item:last-child { padding-bottom: 0; }
.g2-tl-item::before { content: ""; position: absolute; left: 13.5px; top: 34px; bottom: 6px; width: 1px; background: var(--line-2); }
.g2-tl-item:last-child::before { content: none; }
.g2-tl-node {
  width: 28px; height: 28px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--surface-3); color: var(--ink-4);
  box-shadow: inset 0 0 0 1px var(--line-2);
}
.g2-tl-node svg { width: 14px; height: 14px; stroke-width: 2.25; }
.g2-tl-node.is-done { background: var(--success-bg); color: var(--success); box-shadow: inset 0 0 0 1px var(--success-line); }
.g2-tl-node.is-late { background: var(--danger-bg); color: var(--danger); box-shadow: inset 0 0 0 1px var(--danger-line); }
.g2-tl-node.is-active { background: var(--warning-bg); color: var(--warning); box-shadow: inset 0 0 0 1px var(--warning-line); }
.g2-tl-body { min-width: 0; }
.g2-tl-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--sp-2) var(--sp-4); flex-wrap: wrap; }
.g2-tl-title { font-size: var(--fs-14); font-weight: 600; color: var(--ink); margin: 4px 0 0; letter-spacing: -0.008em; overflow-wrap: anywhere; }
.g2-tl-date { text-align: right; font-size: var(--fs-13); color: var(--ink-2); font-variant-numeric: tabular-nums; margin-top: 4px; }
.g2-tl-when { display: block; font-size: var(--fs-12); color: var(--ink-3); margin-top: 2px; }
.g2-tl-when.is-late { color: var(--danger); }
.g2-tl-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; margin-top: 8px; font-size: 12.5px; color: var(--ink-3); }
.g2-tl-desc { font-size: var(--fs-13); color: var(--ink-3); line-height: 1.55; margin: 8px 0 0; }
.g2-tl-progress { display: flex; align-items: center; gap: 10px; margin-top: 12px; max-width: 320px; }
.g2-tl-progress .progress { flex: 1; height: 4px; }
.g2-tl-progress span { font-size: var(--fs-12); color: var(--ink-3); font-variant-numeric: tabular-nums; white-space: nowrap; }
@media (max-width: 639.98px) {
  .g2-tl-item { column-gap: var(--sp-3); }
  .g2-tl-date { text-align: left; margin-top: 0; }
  .g2-tl-head { flex-direction: column; }
}

.g2-tasks { list-style: none; margin: 12px 0 0; padding: 0; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); }
.dark .g2-tasks { background: var(--surface-2); }
.g2-task { display: flex; align-items: flex-start; gap: 10px; padding: 9px 12px; font-size: var(--fs-13); }
.g2-task + .g2-task { border-top: 1px solid var(--line); }
.g2-task-ic { color: var(--ink-4); margin-top: 1px; }
.g2-task-ic svg { width: 16px; height: 16px; }
.g2-task.is-done .g2-task-ic { color: var(--success); }
.g2-task.is-active .g2-task-ic { color: var(--warning); }
.g2-task-main { flex: 1; min-width: 0; }
.g2-task-title { color: var(--ink-2); font-weight: 500; overflow-wrap: anywhere; margin: 0; line-height: 1.45; }
.g2-task.is-done .g2-task-title { color: var(--ink-3); }
.g2-task-sub { font-size: var(--fs-12); color: var(--ink-3); margin: 2px 0 0; font-variant-numeric: tabular-nums; }
.g2-task-sub .is-late { color: var(--danger); font-weight: 500; }
.g2-task .badge { flex-shrink: 0; }
@media (max-width: 639.98px) {
  .g2-task { display: grid; grid-template-columns: 16px minmax(0, 1fr); gap: 4px 10px; }
  .g2-task .badge { grid-column: 2; justify-self: start; }
}

/* Riepilogo progetto (portale progetto) */
.g2-summary { margin-bottom: var(--sp-8); }
.g2-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; border-top: 1px solid var(--line); }
.g2-stat { padding: var(--sp-4) var(--sp-5); min-width: 0; }
.g2-stat + .g2-stat { border-left: 1px solid var(--line); }
.g2-stat dt { font-size: var(--fs-13); color: var(--ink-3); margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.g2-stat dd { font-size: 24px; font-weight: 600; letter-spacing: -0.024em; color: var(--ink); margin: 4px 0 0; font-variant-numeric: tabular-nums; line-height: 1.2; }
.g2-stat-of { font-size: var(--fs-15); font-weight: 500; color: var(--ink-4); letter-spacing: 0; }
@media (max-width: 767.98px) {
  .g2-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .g2-stat:nth-child(3) { border-left: 0; }
  .g2-stat:nth-child(n+3) { border-top: 1px solid var(--line); }
  .g2-stat { padding: var(--sp-3) var(--sp-4); }
  .g2-stat dd { font-size: 20px; }
}
.g2-tasks.is-flat { margin: 0; border: 0; border-radius: 0; background: transparent; }
.g2-tasks.is-flat .g2-task { padding: 14px var(--sp-5); }
.g2-task-desc { font-size: var(--fs-13); color: var(--ink-3); margin: 2px 0 0; line-height: 1.5; }
.g2-task-sub { display: flex; flex-wrap: wrap; gap: 2px var(--sp-3); }
.g2-task-meta { display: inline-flex; align-items: center; gap: 5px; }
.g2-task-meta svg { width: 12px; height: 12px; color: var(--ink-4); }
.g2-thumb { width: 36px; height: 36px; flex-shrink: 0; object-fit: cover; border-radius: var(--r); box-shadow: inset 0 0 0 1px var(--line); background: var(--surface-3); }
@media (max-width: 639.98px) { .g2-tasks.is-flat .g2-task { padding: 12px var(--sp-4); } }

/* ── Dati anagrafici ── */
.g2-dl { margin: 0; }
.g2-dl-group + .g2-dl-group { border-top: 1px solid var(--line); margin-top: var(--sp-5); padding-top: var(--sp-5); }
.g2-dl-heading { font-size: var(--fs-12); font-weight: 600; color: var(--ink-3); margin: 0 0 var(--sp-3); }
.g2-field { margin: 0; }
.g2-field + .g2-field { margin-top: var(--sp-3); }
.g2-field-label { font-size: 12.5px; color: var(--ink-3); margin: 0; line-height: 1.4; }
.g2-field-value { font-size: 13.5px; color: var(--ink); margin: 2px 0 0; line-height: 1.45; overflow-wrap: anywhere; }
.g2-field-value.is-num { font-variant-numeric: tabular-nums; letter-spacing: 0; }
.g2-field-value a { color: var(--accent-text); text-decoration: none; }
.g2-field-value a:hover { text-decoration: underline; text-underline-offset: 2px; }

/* ── Comunicazioni e contratti ── */
.g2-note + .g2-note { border-top: 1px solid var(--line); margin-top: var(--sp-4); padding-top: var(--sp-4); }
.g2-note-title { font-size: var(--fs-14); font-weight: 600; color: var(--ink); margin: 0 0 4px; }
.g2-note-text { font-size: var(--fs-13); color: var(--ink-2); line-height: 1.6; margin: 0; overflow-wrap: anywhere; }
.g2-note-date { font-size: var(--fs-12); color: var(--ink-4); margin: 6px 0 0; font-variant-numeric: tabular-nums; }
.g2-links { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.g2-link {
  display: flex; align-items: center; gap: 8px;
  min-height: 34px; padding: 6px 8px; margin: 0 -8px;
  border-radius: var(--r-sm);
  font-size: var(--fs-13); color: var(--ink-2); text-decoration: none; line-height: 1.35;
  transition: background var(--d-fast) var(--ease), color var(--d-fast) var(--ease);
}
.g2-link:hover { background: var(--surface-3); color: var(--ink); }
.g2-link svg { width: 15px; height: 15px; color: var(--ink-4); }
.g2-link span { flex: 1; min-width: 0; overflow-wrap: anywhere; }

/* ── Pagamenti (markup generato dallo script del portale) ── */
.g2-pay { display: flex; flex-direction: column; gap: var(--sp-4); }
.g2-pay-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--sp-3); }
.g2-pay-amount { font-size: 28px; font-weight: 600; letter-spacing: -0.026em; line-height: 1.1; color: var(--ink); margin: 0; font-variant-numeric: tabular-nums; }
.g2-pay-desc { font-size: var(--fs-14); color: var(--ink-2); line-height: 1.5; margin: 0; overflow-wrap: anywhere; }
.g2-pay-meta { font-size: 12.5px; color: var(--ink-3); margin: 2px 0 0; font-variant-numeric: tabular-nums; }
.g2-pay-more { font-size: 12.5px; color: var(--ink-3); text-align: center; margin: 0; padding-top: var(--sp-3); border-top: 1px solid var(--line); }
.g2-pay-element { padding: var(--sp-4); min-height: 96px; border: 1px solid var(--line-2); border-radius: var(--r-md); background: var(--surface); }
.dark .g2-pay-element { background: var(--surface-2); }
.g2-pay-actions { display: flex; gap: var(--sp-2); margin-top: var(--sp-3); }
.g2-pay-title { font-size: var(--fs-15); font-weight: 600; letter-spacing: -0.012em; color: var(--ink); margin: 0; }
.g2-pay .banner { margin: 0; }
.g2-pay-dl { grid-template-columns: max-content max-content; justify-content: center; text-align: left; margin: 0 0 var(--sp-5); font-size: var(--fs-13); }
.g2-pay-actions .btn-primary { flex: 1; }
.g2-pay-done { text-align: center; padding: var(--sp-2) 0; }
.g2-pay-done > .btn { margin-top: var(--sp-5); }
.g2-spin { animation: spin 0.8s linear infinite; }

/* ── Flussi a passi (prenotazione, richiesta preventivo) ── */
.g2-flow-shell { width: 100%; max-width: 680px; margin: 0 auto; padding: var(--sp-10) var(--sp-6) var(--sp-12); }
.g2-flow-head { margin: var(--sp-10) 0 var(--sp-8); }
.g2-flow-head .g2-title { font-size: 30px; }
@media (max-width: 639.98px) {
  .g2-flow-shell { padding: var(--sp-5) var(--sp-4) var(--sp-10); }
  .g2-flow-head { margin: var(--sp-8) 0 var(--sp-6); }
  .g2-flow-head .g2-title { font-size: 25px; }
}
.g2-panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-xl); box-shadow: var(--sh-sm); overflow: hidden; }
.dark .g2-panel { box-shadow: none; }
.g2-panel-body { padding: var(--sp-8); }
@media (max-width: 639.98px) { .g2-panel-body { padding: var(--sp-5) var(--sp-4) var(--sp-6); } }
.g2-meter { height: 3px; background: var(--surface-3); }
.g2-meter > div { height: 100%; background: var(--accent); border-radius: 0 3px 3px 0; transition: width 0.45s var(--ease); }

.g2-step + .g2-step { margin-top: var(--sp-8); padding-top: var(--sp-8); border-top: 1px solid var(--line); }
.g2-step-head { display: flex; align-items: flex-start; gap: var(--sp-3); margin-bottom: var(--sp-5); }
.g2-step-num {
  width: 24px; height: 24px; flex-shrink: 0; margin-top: 1px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%; background: var(--ink); color: var(--surface);
  font-size: var(--fs-12); font-weight: 600; font-variant-numeric: tabular-nums;
}
.g2-step-title { font-size: 17px; font-weight: 600; letter-spacing: -0.016em; line-height: 1.4; color: var(--ink); margin: 0; }
.g2-step-sub { font-size: var(--fs-13); color: var(--ink-3); margin: 2px 0 0; line-height: 1.45; }

.g2-choices { display: grid; gap: var(--sp-3); grid-template-columns: minmax(0, 1fr); }
.g2-choices.is-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 640px) { .g2-choices.is-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .g2-choices.is-2-sm { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 639.98px) { .g2-choices.is-2 { gap: var(--sp-2); } }
.g2-choices .is-wide { grid-column: 1 / -1; }
@media (min-width: 640px) { .g2-subgrid > :last-child:nth-child(odd) { grid-column: 1 / -1; } }

.g2-tile {
  position: relative;
  display: flex; align-items: center; gap: var(--sp-3);
  width: 100%; min-height: 60px; padding: 12px 14px;
  background: var(--surface); color: var(--ink);
  border: 1px solid var(--line-2); border-radius: var(--r-lg);
  box-shadow: var(--sh-xs);
  font: inherit; text-align: left; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: border-color var(--d-fast) var(--ease), box-shadow var(--d-fast) var(--ease), background var(--d-fast) var(--ease);
}
.dark .g2-tile { background: var(--surface-2); box-shadow: none; }
.g2-tile:hover { border-color: var(--line-strong); }
.g2-tile:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.g2-tile.is-selected { border-color: var(--accent); background: var(--accent-soft); box-shadow: inset 0 0 0 1px var(--accent); }
.g2-tile-ic {
  width: 36px; height: 36px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--r); background: var(--surface-3); color: var(--ink-2);
  transition: background var(--d-fast) var(--ease), color var(--d-fast) var(--ease);
}
.dark .g2-tile-ic { background: var(--surface-4); }
.g2-tile-ic svg { width: 18px; height: 18px; }
.g2-tile.is-selected .g2-tile-ic { background: var(--accent); color: var(--accent-ink); }
.g2-tile-body { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.g2-tile-label { font-size: var(--fs-14); font-weight: 500; line-height: 1.3; color: var(--ink); }
.g2-tile-sub { font-size: 12.5px; line-height: 1.4; color: var(--ink-3); margin-top: 2px; }
/* Cerchio radio: bordo ≥ 3:1 sulla card (chiaro --ink-3, scuro --ink-4), interno trasparente = colore della card */
.g2-tile-radio {
  width: 18px; height: 18px; flex-shrink: 0; margin-left: auto;
  border-radius: 50%; border: 1.5px solid var(--ink-3); background: transparent;
  transition: border-color var(--d-fast) var(--ease), background var(--d-fast) var(--ease);
}
.dark .g2-tile-radio { border-color: var(--ink-4); }
.g2-tile:hover .g2-tile-radio { border-color: var(--ink-2); }
.dark .g2-tile:hover .g2-tile-radio { border-color: var(--ink-3); }
.g2-tile.is-selected .g2-tile-radio, .dark .g2-tile.is-selected .g2-tile-radio { border-color: var(--accent); background: radial-gradient(circle closest-side, var(--accent) 0 46%, transparent 54%); }
.g2-tile.is-stack { flex-direction: column; align-items: flex-start; gap: var(--sp-3); padding: var(--sp-4); min-height: 0; }
.g2-tile.is-stack .g2-tile-radio { position: absolute; top: var(--sp-4); right: var(--sp-4); }
@media (max-width: 639.98px) {
  .g2-tile.is-stack-lg { flex-direction: row; align-items: center; padding: 12px 14px; }
  .g2-tile.is-stack-lg .g2-tile-radio { position: static; }
  .g2-tile.is-compact { min-height: 54px; padding: 10px 12px; gap: 10px; }
  .g2-tile.is-compact .g2-tile-ic { width: 32px; height: 32px; }
  .g2-tile.is-compact .g2-tile-radio { display: none; }
}

/* Campi */
.g2-fields { display: grid; gap: var(--sp-4); }
.g2-fields.is-2 { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .g2-fields.is-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .g2-fields .is-wide { grid-column: 1 / -1; } }
.g2-group-label { font-size: var(--fs-13); font-weight: 600; color: var(--ink); margin: var(--sp-6) 0 var(--sp-3); }
.g2-group-label:first-child { margin-top: 0; }
.g2-opt { font-weight: 400; color: var(--ink-4); }
.g2-field-block { margin-top: var(--sp-6); }
.g2-flow .ds-label { margin-bottom: 6px; }
.g2-flow .input, .g2-flow .textarea, .g2-auth .input { height: var(--h-lg); font-size: var(--fs-14); border-radius: var(--r); }
.g2-flow .textarea { height: auto; min-height: 112px; padding: 11px 12px; }
@media (max-width: 639.98px) {
  /* 16px evita lo zoom automatico di iOS al tocco del campo */
  .g2-flow .input, .g2-flow .textarea, .g2-auth .input { font-size: var(--fs-16); }
}
.g2-flow .btn-lg, .g2-auth .btn-lg { height: 46px; font-size: var(--fs-15); }
.g2-submit { margin-top: var(--sp-8); }

/* "Come ci hai trovato?" (markup di includes/attribution.php) */
.g2-flow .found-via { margin: var(--sp-6) 0 0; gap: var(--sp-2); }
.g2-flow .found-via .field-label { font-size: var(--fs-13); font-weight: 600; color: var(--ink); margin: 0; }
.g2-flow .found-via .fv-row { gap: var(--sp-2); }
.g2-flow .found-via .fv-btn {
  height: 32px; padding: 0 14px;
  border-radius: var(--r-full); border: 1px solid var(--line-2);
  background: var(--surface); color: var(--ink-2);
  font-family: var(--f-sans); font-size: var(--fs-13); font-weight: 500;
}
.dark .g2-flow .found-via .fv-btn { background: var(--surface-2); }
.g2-flow .found-via .fv-btn:hover { border-color: var(--line-strong); color: var(--ink); }
.g2-flow .found-via .fv-btn.is-selected { background: var(--ink); border-color: var(--ink); color: var(--surface); font-weight: 500; }

/* Preferenze sì/no (classi .toggle-btn impostate dallo script) */
.g2-pref { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3) var(--sp-4); padding: 12px 12px 12px 14px; border: 1px solid var(--line-2); border-radius: var(--r-lg); }
.g2-pref + .g2-pref { margin-top: var(--sp-2); }
.g2-pref-label { font-size: var(--fs-14); color: var(--ink-2); line-height: 1.4; }
.g2-seg { display: inline-flex; flex-shrink: 0; padding: 2px; gap: 2px; border-radius: var(--r); background: var(--surface-3); border: 1px solid var(--line); }
.g2-flow .toggle-btn {
  height: 30px; min-width: 48px; padding: 0 12px;
  border: 0; border-radius: var(--r-sm); background: transparent; color: var(--ink-3);
  font-family: var(--f-sans); font-size: var(--fs-13); font-weight: 500; cursor: pointer;
  transition: background var(--d-fast) var(--ease), color var(--d-fast) var(--ease);
}
.g2-flow .toggle-btn:hover { color: var(--ink); }
.g2-flow .toggle-btn.is-active-yes, .g2-flow .toggle-btn.is-active-no { background: var(--surface); color: var(--ink); font-weight: 600; box-shadow: var(--sh-xs); }
.dark .g2-flow .toggle-btn.is-active-yes, .dark .g2-flow .toggle-btn.is-active-no { background: var(--surface-4); }

/* Riepilogo scelta (breadcrumb) */
.g2-crumb:not(.hidden) { display: flex; }
.g2-crumb { align-items: center; gap: 8px; margin-bottom: var(--sp-4); padding: 8px 12px; border-radius: var(--r); background: var(--surface-2); border: 1px solid var(--line); font-size: var(--fs-13); color: var(--ink-2); }
.g2-crumb svg { width: 14px; height: 14px; color: var(--ink-4); }

/* Calendario e orari (markup generato da book.php) */
.g2-when { display: grid; gap: var(--sp-5); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .g2-when { grid-template-columns: minmax(0, 1fr) 212px; gap: var(--sp-6); } }
.g2-cal { min-width: 0; }
.g2-cal-nav { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2); margin-bottom: var(--sp-3); }
.g2-cal-nav .cal-month-title { font-size: var(--fs-15); font-weight: 600; letter-spacing: -0.012em; color: var(--ink); }
.g2-cal-nav-btns { display: flex; gap: 4px; }
.g2-flow .cal-dow-row, .g2-flow .cal-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.g2-flow .cal-dow-row { margin-bottom: 4px; }
.g2-flow .cal-dow { text-align: center; font-size: var(--fs-12); font-weight: 500; color: var(--ink-4); padding: 4px 0; }
.g2-flow .cal-cell {
  position: relative; aspect-ratio: 1 / 1; max-height: 48px; width: 100%; min-width: 0;
  display: flex; align-items: center; justify-content: center;
  padding: 0; border: 0; border-radius: var(--r);
  background: transparent; color: var(--ink-4);
  font: 500 var(--fs-14) var(--f-sans); font-variant-numeric: tabular-nums;
  cursor: default; user-select: none; -webkit-tap-highlight-color: transparent;
  transition: background var(--d-fast) var(--ease), box-shadow var(--d-fast) var(--ease), color var(--d-fast) var(--ease);
}
.g2-flow .cal-num { line-height: 1; }
.g2-flow .cal-cell--free { background: var(--surface-3); color: var(--ink); font-weight: 600; cursor: pointer; }
.dark .g2-flow .cal-cell--free { background: var(--surface-4); }
.g2-flow .cal-cell--free:hover { box-shadow: inset 0 0 0 1.5px var(--ink-3); }
.g2-flow .cal-cell--free:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.g2-flow .cal-cell--full { color: var(--ink-3); }
.g2-flow .cal-cell--blocked .cal-num { text-decoration: line-through; text-decoration-thickness: 1px; color: var(--ink-4); }
.g2-flow .cal-cell--past { color: var(--ink-5); opacity: 1; pointer-events: none; }
.g2-flow .cal-cell--today { box-shadow: inset 0 0 0 1px var(--line-strong); }
.g2-flow .cal-cell.cal-cell--selected { background: var(--accent); color: var(--accent-ink); box-shadow: none; }
.g2-flow .cal-dot { position: absolute; left: 50%; bottom: 6px; width: 5px; height: 5px; margin-left: -2.5px; border-radius: 50%; }
.g2-flow .cal-dot--free { background: var(--success); }
.g2-flow .cal-dot--full { background: var(--danger); }
.g2-flow .cal-dot--blocked { display: none; }
.g2-flow .cal-dot--pulse { background: var(--ink-5); animation: g2-pulse 1.2s ease-in-out infinite; }
.g2-flow .cal-cell--selected .cal-dot { background: var(--accent-ink); }
@keyframes g2-pulse { 0%, 100% { opacity: 0.3; } 50% { opacity: 1; } }
.g2-legend { display: flex; flex-wrap: wrap; gap: 6px var(--sp-4); margin: var(--sp-4) 0 0; padding: 0; list-style: none; font-size: var(--fs-12); color: var(--ink-3); }
.g2-legend li { display: inline-flex; align-items: center; gap: 6px; }
.g2-legend-dot { width: 7px; height: 7px; border-radius: 50%; }
.g2-legend-dot.is-free { background: var(--success); }
.g2-legend-dot.is-full { background: var(--danger); }
.g2-legend-strike { font-size: var(--fs-12); color: var(--ink-4); text-decoration: line-through; font-variant-numeric: tabular-nums; }

.g2-slots-col { min-width: 0; display: flex; flex-direction: column; }
.g2-slots-title { font-size: var(--fs-13); font-weight: 600; color: var(--ink); margin: 0; }
.g2-slots-date { font-size: var(--fs-13); color: var(--ink-3); margin: 2px 0 0; }
.g2-slots-head { margin-bottom: var(--sp-3); min-height: 40px; }
.g2-slots-list { display: flex; flex-direction: column; gap: var(--sp-2); }
.g2-slots-empty { display: none; flex: 1 1 auto; align-items: center; justify-content: center; text-align: center; min-height: 120px; padding: var(--sp-5); border: 1px dashed var(--line-2); border-radius: var(--r-lg); font-size: var(--fs-13); color: var(--ink-3); line-height: 1.5; }
.g2-slots.hidden + .g2-slots-empty { display: flex; }
.g2-flow .slot-row {
  display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2);
  width: 100%; height: 44px; padding: 0 14px;
  background: var(--surface); color: var(--ink);
  border: 1px solid var(--line-2); border-radius: var(--r);
  font: 600 var(--fs-14) var(--f-sans); font-variant-numeric: tabular-nums; cursor: pointer;
  transition: border-color var(--d-fast) var(--ease), background var(--d-fast) var(--ease), color var(--d-fast) var(--ease);
}
.dark .g2-flow .slot-row { background: var(--surface-2); }
.g2-flow .slot-row:hover:not(.is-disabled) { border-color: var(--accent); color: var(--accent-text); }
.g2-flow .slot-row.is-selected { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.g2-flow .slot-row.is-disabled { background: transparent; border-style: dashed; color: var(--ink-4); cursor: not-allowed; }
.g2-flow .slot-row.is-disabled .slot-time { text-decoration: line-through; text-decoration-thickness: 1px; }
.g2-flow .slot-time { white-space: nowrap; }
.g2-flow .slot-status { flex-shrink: 0; display: inline-flex; align-items: center; gap: 5px; font-size: var(--fs-12); font-weight: 500; }
.g2-flow .slot-status::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.g2-flow .slot-status.is-free { color: var(--success); }
.g2-flow .slot-status.is-busy { color: var(--ink-4); }
.g2-flow .slot-row.is-selected .slot-status { color: var(--accent-ink); }
.g2-flow .slot-empty { padding: var(--sp-5); text-align: center; font-size: var(--fs-13); color: var(--ink-3); }

/* Esito invio */
.g2-done { text-align: center; padding: var(--sp-4) 0 var(--sp-2); }
.g2-done .cx-result-icon { margin-bottom: var(--sp-5); }
.g2-done .cx-result-text { max-width: 44ch; margin-left: auto; margin-right: auto; }
.g2-done > .btn { margin-top: var(--sp-6); }

/* ── Accesso amministratore ── */
.g2-auth { position: relative; min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; background: var(--bg); }
.g2-auth-art { display: none; }
/* In scuro resta lo sfondo personale della console, molto attenuato e sfumato verso il centro */
.dark .g2-auth-art {
  display: block; position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background: url('../img/login-bg.png') center / cover no-repeat;
  opacity: 0.08;
  -webkit-mask-image: radial-gradient(ellipse 80% 70% at 50% 50%, transparent 25%, black 85%);
  mask-image: radial-gradient(ellipse 80% 70% at 50% 50%, transparent 25%, black 85%);
}
.g2-auth-top, .g2-auth-main, .g2-auth-foot { position: relative; z-index: 1; }
.g2-auth-top { padding: var(--sp-5) var(--sp-6); }
.g2-auth-main { margin-left: 0; flex: 1; display: flex; align-items: center; justify-content: center; padding: var(--sp-6) var(--sp-4) var(--sp-12); }
.g2-auth-box { width: 100%; max-width: 400px; }
.g2-auth-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-xl); box-shadow: var(--sh-md); padding: var(--sp-8); }
.dark .g2-auth-card { background: color-mix(in srgb, var(--surface) 92%, transparent); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); border-color: var(--line-2); box-shadow: var(--sh-lg); }
.g2-auth-head { margin-bottom: var(--sp-6); }
.g2-auth-head h1 { font-size: 22px; font-weight: 600; letter-spacing: -0.022em; color: var(--ink); margin: 0; }
.g2-auth-head p { font-size: var(--fs-14); color: var(--ink-3); margin: 6px 0 0; line-height: 1.5; }
.g2-auth-form { display: flex; flex-direction: column; gap: var(--sp-4); }
.g2-auth-form .btn { margin-top: var(--sp-2); }
.g2-auth .banner { margin-bottom: var(--sp-5); }
.g2-auth .banner code.tag { height: auto; padding: 1px 5px; }
.g2-banner-title { font-weight: 600; color: var(--ink); margin: 0; }
.g2-banner-text { font-size: 12.5px; margin: 4px 0 0; line-height: 1.6; }
.g2-auth-foot { text-align: center; font-size: var(--fs-12); color: var(--ink-4); padding: 0 var(--sp-4) calc(var(--sp-6) + env(safe-area-inset-bottom)); }
@media (max-width: 639.98px) {
  .g2-auth-top { padding: var(--sp-4); }
  .g2-auth-main { align-items: flex-start; padding-top: var(--sp-8); }
  .g2-auth-card { padding: var(--sp-6) var(--sp-5); }
}

/* ── Documenti legali e pagine informative ── */
.g2-doc { flex: 1 0 auto; width: 100%; max-width: 808px; margin: 0 auto; padding: var(--sp-12) var(--sp-6) var(--sp-12); min-width: 0; }
.g2-doc-foot { margin-top: var(--sp-2); }
.g2-sep { margin: 0 6px; color: var(--ink-5); }
.g2-quiet { text-decoration: underline; text-decoration-color: var(--line-strong); text-underline-offset: 3px; }
.g2-quiet:hover { text-decoration-color: currentColor; }
.g2-doc-head { margin-bottom: var(--sp-8); }
.g2-doc-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-xl); box-shadow: var(--sh-xs); }
.dark .g2-doc-card { box-shadow: none; }
.g2-doc-sec { padding: var(--sp-8) var(--sp-10); }
.g2-doc-sec + .g2-doc-sec { border-top: 1px solid var(--line); }
.g2-doc-sec h2 { display: flex; gap: var(--sp-3); font-size: 17px; font-weight: 600; letter-spacing: -0.014em; line-height: 1.4; color: var(--ink); margin: 0 0 var(--sp-3); }
.g2-doc-num { color: var(--ink-4); font-weight: 500; font-variant-numeric: tabular-nums; min-width: 1.2em; }
.g2-prose p, .g2-prose li { font-size: var(--fs-15); line-height: 1.7; color: var(--ink-2); }
.g2-prose p { margin: 0; max-width: 68ch; }
.g2-prose p + p, .g2-prose ul + p, .g2-prose p + ul { margin-top: var(--sp-3); }
.g2-prose ul { margin: 0; padding-left: 1.25em; }
.g2-prose li + li { margin-top: 4px; }
.g2-prose li::marker { color: var(--ink-4); }
.g2-prose strong { color: var(--ink); font-weight: 600; }
.g2-prose a { color: var(--accent-text); text-decoration: underline; text-decoration-color: var(--accent-line); text-underline-offset: 3px; }
.g2-prose a:hover { text-decoration-color: currentColor; }
.g2-prose address { font-style: normal; }
.g2-doc-cta { margin-top: var(--sp-5); display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-3); }
@media (max-width: 639.98px) {
  .g2-doc { padding: var(--sp-8) var(--sp-4) var(--sp-10); }
  .g2-doc-sec { padding: var(--sp-6) var(--sp-5); }
  .g2-doc-sec h2 { font-size: var(--fs-16); }
  .g2-prose p, .g2-prose li { font-size: var(--fs-14); }
}

/* Guida del cliente (customer_doc.php): HTML scritto dallo studio, classi doc-* */
.g2-guide-eyebrow { display: flex; align-items: center; gap: 6px; margin: 0 0 var(--sp-4); }
.g2-guide-eyebrow svg { width: 14px; height: 14px; color: var(--ink-4); }
.g2-guide { padding: var(--sp-10); color: var(--ink-2); font-size: var(--fs-15); line-height: 1.7; overflow-wrap: anywhere; }
.g2-guide > * + * { margin-top: 14px; }
.g2-guide h1 { font-size: 28px; font-weight: 600; color: var(--ink); letter-spacing: -0.026em; line-height: 1.2; margin: 0; }
.g2-guide h2 { font-size: 19px; font-weight: 600; color: var(--ink); letter-spacing: -0.016em; line-height: 1.35; margin-top: var(--sp-10); padding-top: var(--sp-6); border-top: 1px solid var(--line); }
.g2-guide h3 { font-size: var(--fs-15); font-weight: 600; color: var(--ink); letter-spacing: -0.01em; margin-top: var(--sp-6); }
.g2-guide .doc-intro { color: var(--ink-3); font-size: var(--fs-16); }
.g2-guide p, .g2-guide li { max-width: 72ch; }
.g2-guide ul, .g2-guide ol { padding-left: 22px; display: grid; gap: 6px; }
.g2-guide ul { list-style: disc; }
.g2-guide ol { list-style: decimal; }
.g2-guide li::marker { color: var(--ink-4); }
.g2-guide strong { color: var(--ink); font-weight: 600; }
.g2-guide a { color: var(--accent-text); text-decoration: underline; text-decoration-color: var(--accent-line); text-underline-offset: 3px; }
.g2-guide code { font-family: var(--f-mono); font-size: 0.88em; background: var(--surface-3); border-radius: var(--r-xs); padding: 1px 5px; color: var(--ink); }
.g2-guide pre { font-family: var(--f-mono); font-size: 12.5px; line-height: 1.6; background: var(--ink); color: var(--surface); border-radius: var(--r-lg); padding: var(--sp-4) var(--sp-5); overflow-x: auto; white-space: pre; overflow-wrap: normal; }
.dark .g2-guide pre { background: var(--bg-2); color: var(--ink); box-shadow: inset 0 0 0 1px var(--line-2); }
.g2-guide pre code { background: none; padding: 0; color: inherit; font-size: inherit; }
.g2-guide .doc-endpoint { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.g2-guide .doc-endpoint code { font-size: var(--fs-14); font-weight: 600; }
.g2-guide .doc-metodo { font-family: var(--f-mono); font-size: 11px; font-weight: 600; letter-spacing: 0.04em; color: var(--accent-ink); border-radius: var(--r-xs); padding: 3px 7px; background: var(--neutral); }
.g2-guide .doc-metodo.post { background: var(--success-solid); }
.g2-guide .doc-metodo.get { background: var(--accent); }
.g2-guide .doc-tabella { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r-lg); }
.g2-guide .doc-tabella table { margin: 0; }
.g2-guide table { overflow-wrap: normal; }
.g2-guide td:first-child { white-space: nowrap; }
.g2-guide-meta { font-size: var(--fs-13); color: var(--ink-3); margin: var(--sp-3) 0 0; font-variant-numeric: tabular-nums; }
@media (max-width: 639.98px) {
  .g2-guide { padding: var(--sp-6) var(--sp-5); font-size: var(--fs-14); }
  .g2-guide h1 { font-size: 23px; }
  .g2-guide h2 { font-size: 17px; margin-top: var(--sp-8); }
}

/* Disiscrizione newsletter (.cx-result): logo dello studio nella riga del marchio */
a.g2-brandline { text-decoration: none; }
.g2-strong { color: var(--ink); font-weight: 600; }

/* ── Teleprompter (sempre scuro: palco nero, comandi con i token del tema scuro) ── */
.g2-tp, .g2-tp body { height: 100%; overflow: hidden; background: black; }
/* nero assoluto: sul vetro del teleprompter qualunque grigio si vedrebbe riflesso */
.g2-tp body { background: black; color: var(--ink); -webkit-tap-highlight-color: transparent; }
.g2-tp #stage { position: fixed; inset: 0; background: black; overflow: hidden; touch-action: none; user-select: none; -webkit-user-select: none; }
.g2-tp #flip { position: absolute; inset: 0; }
.g2-tp #scroller { position: absolute; top: 0; left: 0; right: 0; will-change: transform; }
.g2-tp #text { margin: 0 auto; white-space: pre-wrap; overflow-wrap: break-word; line-height: 1.35; font-weight: 600; letter-spacing: 0.005em; color: var(--ink); }
.g2-tp #text.is-empty { color: var(--ink-3); font-weight: 400; }
.g2-tp #guide { position: absolute; left: 0; right: 0; pointer-events: none; background: var(--line); border-top: 1px solid var(--line-2); border-bottom: 1px solid var(--line-2); }
.g2-tp #guide::before, .g2-tp #guide::after { content: ''; position: absolute; top: 50%; transform: translateY(-50%); border: 14px solid transparent; }
.g2-tp #guide::before { left: 0; border-left-color: var(--accent-text); }
.g2-tp #guide::after { right: 0; border-right-color: var(--accent-text); }
.g2-tp body.no-guide #guide { display: none; }
.g2-tp #countdown { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: min(40vw, 40vh); font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; background: color-mix(in srgb, black 60%, transparent); pointer-events: none; }
.g2-tp #countdown[hidden] { display: none; }
.g2-tp #progress { position: fixed; top: 0; left: 0; height: 3px; width: 0; background: var(--accent-text); z-index: 5; pointer-events: none; }

.g2-tp #bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 10;
  display: flex; flex-direction: column; gap: 10px;
  padding: 10px var(--sp-4) calc(12px + env(safe-area-inset-bottom));
  background: color-mix(in srgb, var(--surface) 94%, transparent);
  border-top: 1px solid var(--line-2);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  font-size: var(--fs-13); color: var(--ink-2);
  transition: transform 0.25s var(--ease), opacity 0.25s var(--ease);
}
.g2-tp body.ui-hidden #bar { transform: translateY(100%); opacity: 0; pointer-events: none; }
.g2-tp body.ui-hidden, .g2-tp body.ui-hidden #stage { cursor: none; }
.g2-tp-row { display: flex; align-items: center; min-width: 0; }
/* Riga 1: titolo a sinistra · riproduzione al centro · vista a destra */
.g2-tp-row-main { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: var(--sp-4); }
.g2-tp-lead { justify-self: start; max-width: 100%; }
.g2-tp-main { justify-self: center; }
.g2-tp-push { justify-self: end; }
/* Riga 2: regolazioni raggruppate (testo | specchio e partenza), centrate sotto la riproduzione */
.g2-tp-row-set { justify-content: center; flex-wrap: wrap; gap: var(--sp-2) var(--sp-6); padding-top: 10px; border-top: 1px solid var(--line); }
.g2-tp-set { display: flex; align-items: center; gap: var(--sp-6); }
.g2-tp-sep { width: 1px; height: 20px; flex-shrink: 0; background: var(--line-2); }
.g2-tp-grp { display: flex; align-items: center; gap: var(--sp-2); min-width: 0; }
.g2-tp-lbl { color: var(--ink-3); white-space: nowrap; font-size: var(--fs-13); font-weight: 400; }
.g2-tp-title { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink-2); font-weight: 500; }
.g2-tp-remain { color: var(--ink-3); min-width: 3.6em; margin-left: var(--sp-1); font-variant-numeric: tabular-nums; }
/* Il valore sta subito dopo il proprio cursore; lo spazio fisso evita salti quando cambia */
.g2-tp-out { min-width: 2.75em; text-align: left; color: var(--ink); font-variant-numeric: tabular-nums; }
/* Cursori: traccia scura disegnata con i token (quella nativa resta chiara anche in tema scuro) */
.g2-tp-range { -webkit-appearance: none; appearance: none; width: 112px; height: 20px; margin: 0; padding: 0; background: transparent; cursor: pointer; }
.g2-tp-range:focus { outline: none; }
.g2-tp-range::-webkit-slider-runnable-track { height: 4px; border-radius: var(--r-full); background: var(--surface-4); box-shadow: inset 0 0 0 1px var(--line-2); }
.g2-tp-range::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none;
  width: 16px; height: 16px; margin-top: -6px; border: 0; border-radius: 50%;
  background: var(--accent); box-shadow: 0 0 0 3px var(--surface);
  transition: transform var(--d-fast) var(--ease), box-shadow var(--d-fast) var(--ease);
}
.g2-tp-range:hover::-webkit-slider-thumb { transform: scale(1.1); }
.g2-tp-range:focus-visible::-webkit-slider-thumb { box-shadow: 0 0 0 3px var(--surface), 0 0 0 6px var(--accent-ring); }
.g2-tp-range::-moz-range-track { height: 4px; border: 0; border-radius: var(--r-full); background: var(--surface-4); }
.g2-tp-range::-moz-range-progress { height: 4px; border-radius: var(--r-full); background: var(--accent); }
.g2-tp-range::-moz-range-thumb { width: 16px; height: 16px; border: 0; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 3px var(--surface); }
.g2-tp-range:focus-visible::-moz-range-thumb { box-shadow: 0 0 0 3px var(--surface), 0 0 0 6px var(--accent-ring); }
.g2-tp .btn { height: 38px; }
.g2-tp .btn-icon { width: 38px; }
.g2-tp .btn svg { width: 17px !important; height: 17px !important; }
.g2-tp #b-play { width: 52px; }
.g2-tp #b-play svg { width: 18px !important; height: 18px !important; }
.g2-tp .btn[aria-pressed="true"]:not(.g2-tp-segbtn) { border-color: var(--accent-line); color: var(--accent-text); background: var(--accent-soft); }
.g2-tp .btn-group { height: 38px; align-items: center; }
.g2-tp .btn-group > .btn { height: 32px; }
.g2-tp .btn-group > .btn[aria-pressed="true"] { background: var(--surface-4); color: var(--ink); box-shadow: var(--sh-xs); font-weight: 600; }
.g2-tp .select { width: auto; height: 38px; padding-left: 10px; }
/* Conferma del salvataggio (solo con il login): piccola etichetta sopra la barra, non sposta i comandi */
.g2-tp-save { position: absolute; right: var(--sp-4); bottom: calc(100% + var(--sp-2)); padding: 4px 10px; border-radius: var(--r-full); background: var(--surface-3); border: 1px solid var(--line-2); color: var(--ink-2); font-size: var(--fs-12); white-space: nowrap; }
.g2-tp-save:empty { display: none; }
/* Sotto i 1280px le regolazioni vanno su due righe centrate: il divisorio non serve */
@media (max-width: 1279.98px) { .g2-tp-sep { display: none; } }
/* Tablet: "Schermo intero" e "Salva" solo icona, così titolo e comandi non si toccano */
@media (max-width: 1023.98px) {
  .g2-tp-hide-md { display: none; }
  .g2-tp #b-fs, .g2-tp #b-save { width: 38px; padding: 0; }
}
/* Telefono: comandi compatti su tre righe allineate, il palco resta grande */
@media (max-width: 639.98px) {
  .g2-tp #bar { gap: var(--sp-3); padding: 10px var(--sp-3) calc(12px + env(safe-area-inset-bottom)); }
  .g2-tp-row-main { display: flex; gap: 6px; }
  .g2-tp-lead { display: contents; }
  .g2-tp-title { display: none; }
  .g2-tp-main { gap: 6px; }
  .g2-tp-remain { min-width: 0; margin-left: 2px; font-size: var(--fs-12); }
  .g2-tp-push { margin-left: auto; gap: 6px; }
  .g2-tp-row-set { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--sp-3); padding-top: var(--sp-3); }
  .g2-tp-set { display: contents; }
  .g2-tp-sep { display: none; }
  /* Etichetta (e valore) sopra ogni comando, come nello stato originale */
  .g2-tp-slider { grid-column: span 2; display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "lbl out" "range range"; gap: 2px 4px; }
  .g2-tp-slider .g2-tp-lbl { grid-area: lbl; }
  .g2-tp-slider .g2-tp-out { grid-area: out; min-width: 0; text-align: right; font-size: var(--fs-12); }
  .g2-tp-slider .g2-tp-range { grid-area: range; width: 100%; }
  .g2-tp-row-set .g2-tp-lbl { font-size: var(--fs-12); }
  .g2-tp-mirror, .g2-tp-count { flex-direction: column; align-items: stretch; gap: 4px; }
  .g2-tp-mirror { grid-column: span 4; }
  .g2-tp-mirror .btn-group { width: 100%; }
  /* Segmenti larghi quanto il testo (+ lo spazio che avanza), mai a filo del bordo */
  .g2-tp-mirror .btn-group > .btn { flex: 1 1 auto; min-width: 0; padding: 0 8px; }
  .g2-tp-count { grid-column: span 2; }
  .g2-tp-count .select { width: 100%; }
  .g2-tp #b-play { width: 46px; }
  .g2-tp-save { right: var(--sp-3); }
}

.g2-tp-help[hidden] { display: none; }
.g2-tp-help { position: fixed; inset: 0; z-index: 20; display: flex; align-items: center; justify-content: center; padding: var(--sp-4); background: var(--overlay); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
.g2-tp-help .modal-panel { max-width: 460px; border-radius: var(--r-xl); }
.g2-tp-help .modal-panel::before { content: none; }
.g2-tp-help dl.dl { grid-template-columns: max-content 1fr; align-items: center; gap: 10px 16px; }
.g2-tp-help dt { color: var(--ink-2); white-space: nowrap; }
.g2-tp-help dd { color: var(--ink-3); }
.g2-tp-help .kbd { font-size: 11.5px; }
.g2-tp-help-note { font-size: var(--fs-13); color: var(--ink-3); line-height: 1.55; margin: var(--sp-4) 0 0; }
/* @group-G2:end */