@charset "utf-8";
/* CSS Document */
/* Architettura editor CSS storefront (Fase 92): dashboard/Docs/92A_CSS_EDITOR_STOREFRONT_AUDIT.md */

/* R25 (2026-05-16) — Tema pizzeria completo: crema/pomodoro/crosta, gerarchia tipografica,
 * checkout/carrello/prodotto coerenti. Solo questo file come base; editor/custom invariati.
 * Doc: dashboard/Docs/WEB_APP_PIZZERIA_THEME_STYLE_MOD_2026.md */
/* ---------------------------------------------------------------------------
 * Master storefront (Step 1) — file madre ordinato per sezioni.
 * Indice completo + classificazione WEB_APP / LEGACY: vedi
 *   dashboard/Docs/STOREFRONT_CSS_MOD_MASTER_MAP.md
 * Override editor: css_style_mod_editor.css | Custom manuale: css_style_mod_custom.css
 * Nota: rimossi i !important da questo foglio (2026) così l’editor può sovrascrivere
 * le stesse proprietà senza dover replicare !important nel CSS generato.
 * --------------------------------------------------------------------------- */

/* SCELTA DEL FONT MONTSERRAT È IL FONT STANDARD, IL SECONDO FONT DI SOLITO VIENE SOSTITUITO CON UN GOOGLE FONT ALTERNATIVO LEGATO ALLO STILE DELLA GRAFICA DEL CLIENTE */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Mr+Dafoe&display=swap');

/*********************************************************************************************************/
/******************* QUESTA PARTE DEL CSS È STANDARD — NON VA CAMBIATA ********************/
/*********************************************************************************************************/
/* HP CUSTOM */

body{
        /* Round 16 refactor 2026 — body usa i token globali del tema base.
         * Default identici al preset 50/50 corrente (Montserrat, 1rem, 1.5,
         * #212529) → zero regressione visiva. Il CSS Editor compila
         * regole `body { background-color: ...; color: ...; ... }` in
         * `css_style_mod_editor.css` che vincono per cascata quando il
         * tenant personalizza (`body_bg/fg/font/size/lineHeight`). */
        font-family: var(--wa-font-body);
        font-size: var(--wa-text-base);
        font-weight: 400;
        line-height: var(--wa-line-normal);
        color: var(--wa-color-text);
        background-color: var(--wa-color-bg);
}

.hp-space {
        margin-top:20px;
        margin-bottom:20px;
}

#hp-colonne .col-sm {
     flex-basis: auto;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
    width: 33%;
}

.btn-prodotti {
        font-size:20px;
        padding: 12px 20px;
}

@media only screen and (max-width: 767px) {

#hp-colonne .col-sm {
     flex-basis: auto;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
    width: 50%;}

.descrizione_allergeni {
    margin-top: 0px;
    margin-bottom: 5px;}

body:not(.wa-page-lista) .nome_prodotto {
    min-height: auto;
    margin-top: 10px;
    margin-bottom: 10px;}

body:not(.wa-page-lista) .prezzoscheda {
    font-size: 34px;
    letter-spacing: -1px;}

.btn-prodotti {
        font-size:20px;
        padding:5px 10px;}

div#listaprodottoimmagine-modal {
        height: 240px;}

.modal-title {
        width: 80%;
        line-height: 23px;}

.col-md-12.search-table-col {
        margin-bottom: -30px;}

}

/* BLOCCHI HP */
.delivery-hp-block {
        margin:20px 0;
}

.delivery-hp-block img {
        max-width:300px;
        width:100%;
        margin-top:0px;
}

.dati_azienda {
	font-size: 0.7em;
	text-align: center;
}

/* VO-EDITOR anchor glob_linkFg / glob_linkHoverFg: selettore `a` (colori da editor o contesto) */
a {
        transition: all 0.5s ease;
}

a:hover {
        transition: all 0.5s ease;
        text-decoration: none;
}

.navigation-clean {
        padding-top:0px;
        padding-bottom:0px;
}

.foto_prodotto{
	width: 100%;
	height: 200px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center center;
}

.blocco_presentazioneprodotto {
        display: inline-table;
        height: auto;
        margin-bottom: 0px;
        padding: 20px 8px;
}

.cestino {
        /* Round 16 refactor 2026 — `.cestino` (icona elimina riga carrello)
         * usa il token `--wa-color-dark` come bg (era `#171717` hardcoded,
         * stesso valore). Il CSS Editor non ha controllo dedicato per
         * questo elemento: i token globali servono come "ancora" del
         * tema base. Se il tenant volesse personalizzare, la regola
         * editor `.cestino { background-color: ... }` vincerebbe. */
        margin-left: 5px;
        background-color: var(--wa-color-dark);
        color: var(--wa-color-inverse);
        border: 0px;
}


/* DETTAGLIO CARRELLO */
.prezzosopra, .prezzosopradecimali {
	font-size:20px;
	font-weight:700;
	line-height:20px;
}						  							  							  

.datiquantitasotto, .testodecimalecarrello {
	font-size:20px;
}

.prezzosopra {
       padding-right:0px;
       padding-left:0px;
}

/* Titoli pagina: tipografia R25 in blocco :root sotto (gerarchia tipografica). */
.iltuo,
.titolologin,
.titolologin_nome {
	margin-top: 40px;
}

.iltuo span {
	font-size: var(--wa-text-lg);
	font-weight: 700;
	line-height: var(--wa-line-tight);
	color: var(--wa-color-text);
}

.totalecifre {
	line-height: 1.2;
}					  

.quantitaform {
        width: 100%;
        text-align: center;
        height: 44px;
        font-size: 25px;
        font-weight: 700;
}

.menuapri {
        transition: all 0.5s ease;
        padding: 5px;
        border-radius: var(--wa-radius-sm);
        border: 1px solid var(--wa-color-border);
        color: var(--wa-secondary-fg);
        background: transparent;
}

/* ── Carrello: classi prodotto ─────────────────────────────── */
.coloretestocarrello {
        color: var(--wa-color-accent);
}
.bloccoprodotto {
        padding: 15px 8px;
        vertical-align: top;
}
.conaggiuntadi {
        font-size: 13px;
        color: var(--wa-color-muted);
}
.aggiunta {
        color: var(--wa-color-success);
        font-weight: 600;
        font-size: 13px;
}
.rimuovere {
        color: #bb151d;
        font-size: 13px;
}
/* Carrello web_app: modifica riga / nota discreta (prodotti semplici).
 * Round 21 refactor 2026 — accent (Terra Premium `#b7793f`) per stato
 * normale, success semantico per hover (verde "azione positiva" universale). */
.wa-cart-modifica {
        color: var(--wa-color-accent);
        font-weight: 500;
}
.wa-cart-modifica:hover {
        color: var(--wa-color-success);
}
.wa-note-simple .wa-note-toggle {
        font-size: 12px;
        color: #888;
        text-decoration: none;
        background: none;
        border: 0;
        padding: 0;
        cursor: pointer;
}
.wa-note-simple .wa-note-toggle:hover {
        color: #555;
        text-decoration: underline;
}

/* ═══════════════════════════════════════════════════════════════
   WEB_APP — look cliente (centralizzato; vedi Docs/92 audit CSS)
   URL immagini dinamiche: solo --wa-bg-image / --wa-logo-url inline.
   ═══════════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────────────────────────────
 * Round 16 refactor 2026 — WA BASE THEME / DESIGN TOKENS GLOBALI
 *
 * Riferimento: `Docs/WEB_APP_BASE_THEME_SYSTEM_2026.md`.
 *
 * Filosofia: la web_app deve essere bella e coerente ANCHE con
 * `css_style_mod_editor.css` e `css_style_mod_custom.css` vuoti.
 * Il CSS Editor serve a personalizzare un tema già completo, non a
 * salvare una grafica base mezza rotta.
 *
 * Gerarchia (dal generale al particolare):
 *
 *   1. Token globali tema       (`--wa-color-*`, `--wa-font-*`,
 *                                `--wa-text-*`, `--wa-radius-*`,
 *                                `--wa-shadow-*`, `--wa-space-*`)
 *   2. Token specifici area     (`--wa-status-*`, `--wa-img-placeholder-*`,
 *                                ecc.) — derivano dai globali
 *   3. Classi componenti        (regole CSS sorgente: `.bottoneavanti`,
 *                                `.foto_prodotto`, `.wa-cat-card-*`)
 *   4. Override CSS Editor      (`css_style_mod_editor.css`, compilato
 *                                da `vo-sf-editor-schema.js` per tenant)
 *   5. Override custom tenant   (`css_style_mod_custom.css`)
 *
 * Cascata: ogni livello vince sul precedente. CSS Editor scrive regole
 * dirette (es. `.bottoneavanti { background: #ff5722 }`) che vincono per
 * cascata sui valori `var()` che usano i token globali. Quindi:
 *
 *   - tenant SENZA customizzazioni → usa i token globali (questo file).
 *   - tenant CON customizzazioni   → l'editor sovrascrive selettivamente.
 *
 * VALORI di default scelti per essere identici al preset 50/50 corrente
 * (preset di "Vorrei Ordinare base") → ZERO regressione visiva sui
 * tenant esistenti. Cambiare i default qui implica aggiornare anche
 * `vo_storefront_css_editor_baseline_values.php` per coerenza.
 *
 * Convenzione naming:
 *   --wa-color-{semantica}              tinte fisse del tema
 *   --wa-color-{semantica}-{variante}   hover, contrast, soft, ecc.
 *   --wa-font-{ruolo}                   famiglie tipografiche
 *   --wa-text-{scala}                   scala dimensioni (xs..2xl)
 *   --wa-line-{ritmo}                   altezze riga (tight/normal/relaxed)
 *   --wa-radius-{scala}                 raggi card/bottoni/pill
 *   --wa-shadow-{scala}                 ombre sm/md/lg
 *   --wa-space-{scala}                  spaziature xs..xl
 */
:root {
	/* ── Fondi (R26 — Template Base 0.1 Pizzeria) ────────────────────
	 * Palette pizzeria definitiva: crema più calda, contrasto più forte,
	 * pomodoro e crosta più decisi. Vedi `WEB_APP_PIZZERIA_TEMPLATE_BASE_01_2026.md`. */
	--wa-color-bg: #fff4e6;
	--wa-color-surface: #ffffff;
	--wa-color-surface-soft: #ffe6c7;
	--wa-color-surface-strong: #f5c982;
	--wa-color-dark: #1f120b;

	/* ── Testi ────────────────────────────────────────────────────── */
	--wa-color-text: #1f120b;
	--wa-color-muted: #6d5748;
	--wa-color-inverse: #ffffff;

	/* ── Brand — pomodoro / CTA ───────────────────────────────────── */
	--wa-color-primary: #c1121f;
	--wa-color-primary-hover: #8f0d17;
	--wa-color-primary-soft: #ffe1df;
	--wa-color-primary-contrast: #ffffff;

	/* ── Accent — crosta / prezzi / titoli sezione ─────────────────── */
	--wa-color-accent: #b76e22;
	--wa-color-accent-hover: #8a4f16;
	--wa-color-accent-soft: #ffe8c2;
	--wa-color-accent-contrast: #ffffff;

	/* ── Linee + ombre ───────────────────────────────────────────── */
	--wa-color-border: rgba(31, 18, 11, 0.16);
	--wa-color-shadow: rgba(31, 18, 11, 0.16);

	/* ── Stato (semantici) ──────────────────────────────────────────
	 * Coppie bg/fg ad alto contrasto per messaggi positivi (verde),
	 * avviso (ambra), errore (rosso), info (blu). I valori sono
	 * accessibili WCAG AA su sfondo bianco senza bordo. */
	--wa-color-success: #15803d;
	--wa-color-success-bg: rgba(21, 128, 61, 0.12);
	--wa-color-success-fg: #14532d;
	--wa-color-warning: #b45309;
	--wa-color-warning-bg: rgba(180, 83, 9, 0.12);
	--wa-color-warning-fg: #78350f;
	--wa-color-danger: #b91c1c;
	--wa-color-danger-bg: rgba(185, 28, 28, 0.12);
	--wa-color-danger-fg: #7f1d1d;
	--wa-color-info: #2563eb;
	--wa-color-info-bg: rgba(37, 99, 235, 0.10);
	--wa-color-info-fg: #1e3a8a;

	/* ── Tipografia ─────────────────────────────────────────────────
	 * Una sola famiglia (Montserrat) coerente con il preset attuale.
	 * `body` e `heading` separati per permettere a un tenant futuro
	 * di mettere serif sui titoli senza toccare il body. */
	--wa-font-body: 'Montserrat', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--wa-font-heading: 'Montserrat', system-ui, -apple-system, sans-serif;

	/* Scala dimensioni testo (rem). Da `xs` 12px a `2xl` 36px. */
	--wa-text-xs: 0.75rem;
	--wa-text-sm: 0.875rem;
	--wa-text-base: 1rem;
	--wa-text-md: 1.125rem;
	--wa-text-lg: 1.35rem;
	--wa-text-xl: 1.75rem;
	--wa-text-2xl: 2.25rem;

	/* Altezze riga: tight per titoli, normal per body, relaxed per
	 * descrizioni lunghe. */
	--wa-line-tight: 1.15;
	--wa-line-normal: 1.5;
	--wa-line-relaxed: 1.65;

	/* ── Forma ──────────────────────────────────────────────────────
	 * Raggi coerenti per card, bottoni, badge, pill (tag). */
	--wa-radius-sm: 0.5rem;
	--wa-radius-md: 0.9rem;
	--wa-radius-lg: 1.25rem;
	--wa-radius-pill: 999px;

	/* Ombre con `--wa-color-shadow` come tinta base. 3 livelli sono
	 * sufficienti: sm per card flat, md per modali leggeri, lg per
	 * popup / hero principali. */
	/* R26 — ombre allineate al testo pizzeria (`#1f120b` → rgba 31,18,11). */
	--wa-shadow-sm: 0 4px 12px rgba(31, 18, 11, 0.08);
	--wa-shadow-md: 0 10px 28px rgba(31, 18, 11, 0.12);
	--wa-shadow-lg: 0 18px 45px rgba(31, 18, 11, 0.16);

	/* ── Spaziature ─────────────────────────────────────────────────
	 * Scala progressiva (golden ratio approssimato). Da `xs` 5.6px
	 * (gap interno chip) a `xl` 36px (sezioni di pagina). */
	--wa-space-xs: 0.35rem;
	--wa-space-sm: 0.65rem;
	--wa-space-md: 1rem;
	--wa-space-lg: 1.5rem;
	--wa-space-xl: 2.25rem;

	/* ── Selectable cards (ASAP, orario, scelte soft) ───────────────── */
	--wa-selectable-bg: var(--wa-color-surface);
	--wa-selectable-border: var(--wa-color-border);
	--wa-selectable-hover-border: rgba(185, 28, 28, 0.35);
	--wa-selectable-active-bg: var(--wa-color-primary-soft);
	--wa-selectable-active-fg: var(--wa-color-text);
	--wa-selectable-active-border: var(--wa-color-primary);

	/* ── Icon buttons (Round 17 refactor 2026, ribridge R29 PRESET_COVERAGE) ──
	 * Bottoni icona compatti (microfono voice search "Parla",
	 * geolocalizzami checkout "Usa la mia posizione", ecc.). 2 varianti:
	 * `filled` (sfondo pieno, testo inverso) e `outline` (sfondo
	 * trasparente, bordo + testo color primary).
	 *
	 * R29 (2026-05-18): re-ancorati a `--wa-color-primary*` invece di
	 * `--wa-color-accent*`. Motivazione: l'accent dei preset Base è una
	 * tinta di servizio (prezzi, titoli sezione), non l'identità brand;
	 * collegando icon button al primary, "Parla" e "Usa posizione"
	 * cambiano coerentemente col preset (verde su Verde naturale, blu su
	 * Blu moderno, rosso su Pizzeria, ecc.) anziché restare oro/accent
	 * a prescindere. Vincolo storico (`#6b4a3b` accent) decaduto: editor
	 * tenant può sempre ri-impostare il singolo campo da gruppo
	 * `icon_buttons` (6 field). */
	--wa-icon-btn-filled-bg: var(--wa-color-primary);
	--wa-icon-btn-filled-fg: var(--wa-color-primary-contrast);
	--wa-icon-btn-filled-hover-bg: var(--wa-color-primary-hover);
	--wa-icon-btn-outline-fg: var(--wa-color-primary);
	--wa-icon-btn-outline-border: var(--wa-color-primary);
	--wa-icon-btn-outline-hover-fg: var(--wa-color-primary-hover);

	/* ── Secondary buttons (Round 17b refactor 2026) ─────────────────
	 * Pulsanti secondari: azioni alternative al CTA principale (es.
	 * "Continua come ospite" su gate checkout, "Modifica", "Indietro"
	 * future). Stile "outlined": sfondo neutro (surface), bordo + testo
	 * color accent. Distinto da `--wa-color-primary*` (CTA principali)
	 * e da `--wa-icon-btn-outline-*` (bottoni icona compatti). Default
	 * sincronizzati ai consumer storici (`.wa-checkout-gate-secondary`
	 * `#fff` / `#6b4a3b` / `#faf9f8` / `#5a3f32`). Editor: gruppo
	 * `secondary_buttons` (5 field). */
	--wa-secondary-bg: var(--wa-color-surface);
	--wa-secondary-fg: var(--wa-color-primary);
	--wa-secondary-border: var(--wa-color-primary);
	--wa-secondary-hover-bg: var(--wa-color-primary-soft);
	--wa-secondary-hover-fg: var(--wa-color-primary-hover);

	/* ── Card primitive (R24 Total Style System) ─────────────────────
	 * Superficie standard per pannelli (Lucy form, riepiloghi, box account).
	 * I componenti specifici possono usare surface / surface-strong se serve
	 * più contrasto; la maggior parte delle “card” eredita da qui. */
	--wa-card-bg: var(--wa-color-surface-soft);
	--wa-card-border: var(--wa-color-border);
	--wa-card-radius: var(--wa-radius-md);

	/* ── Alias Base (R30 — controlli ristoratore) ─────────────────── */
	--wa-color-page-bg: var(--wa-color-bg);
	--wa-color-secondary: var(--wa-color-accent);
	--wa-shadow-card: var(--wa-shadow-md);
	--wa-btn-height: 3rem;

	/* ── CTA semantiche checkout (R30) ───────────────────────────────
	 * confirm = Continua / Conferma (filled brand)
	 * delivery = domicilio / step servizio (filled brand)
	 * pickup = Passa al ritiro (outline — distinto da confirm)
	 * Preset compiler: voSfDeriveAutoTokens() aggiorna da tc_color_* */
	--wa-cta-confirm-bg: var(--wa-color-primary);
	--wa-cta-confirm-color: var(--wa-color-primary-contrast);
	--wa-cta-confirm-border: var(--wa-color-primary-hover);
	--wa-cta-confirm-hover-bg: var(--wa-color-primary-hover);

	--wa-cta-delivery-bg: var(--wa-color-primary);
	--wa-cta-delivery-color: var(--wa-color-primary-contrast);
	--wa-cta-delivery-border: var(--wa-color-primary-hover);
	--wa-cta-delivery-hover-bg: var(--wa-color-primary-hover);
	--wa-cta-delivery-text: var(--wa-cta-delivery-color);

	--wa-cta-pickup-bg: var(--wa-color-surface);
	/* Testo scuro su surface se primary non passa AA su bianco */
	--wa-cta-pickup-color: var(--wa-color-text);
	--wa-cta-pickup-border: var(--wa-color-primary);
	--wa-cta-pickup-hover-bg: var(--wa-color-primary-soft);
	--wa-cta-pickup-text: var(--wa-cta-pickup-color);

	--wa-mobile-nav-bg: var(--wa-bottombar-bg, var(--wa-color-surface));
	--wa-mobile-nav-color: var(--wa-bottombar-fg, var(--wa-color-muted));
	--wa-mobile-nav-active-color: var(--wa-bottombar-active-fg, var(--wa-color-primary));
	--wa-mobile-nav-border: var(--wa-color-border);
	--wa-footer-bg: var(--wa-color-dark);
	--wa-footer-color: var(--wa-color-inverse);

	/* R31 — Bridge Stile rapido (default = token esistenti; compiler sovrascrive) */
	--wa-app-bg: var(--wa-color-bg);
	--wa-app-color: var(--wa-text-color, var(--wa-color-text));
	--wa-app-muted-color: var(--wa-muted-color, var(--wa-color-muted));
	--wa-document-bg: var(--wa-surface-bg);
	--wa-document-color: var(--wa-text-color, var(--wa-color-text));
	--wa-document-border-color: var(--wa-border-color);
	--wa-surface-bg: var(--wa-color-surface);
	--wa-surface-soft-bg: var(--wa-color-surface-soft);
	--wa-text-color: var(--wa-color-text);
	--wa-muted-color: var(--wa-color-muted);
	--wa-border-color: var(--wa-color-border);
	--wa-option-row-bg: var(--wa-color-surface, #ffffff);
	--wa-option-row-color: var(--wa-color-text);
	--wa-option-row-border: var(--wa-color-border);
	--wa-option-row-selected-bg: var(--wa-color-accent-soft, var(--wa-color-surface-soft));
	--wa-option-row-selected-color: var(--wa-color-text);
	--wa-option-row-selected-border: var(--wa-color-accent);
	--wa-option-extra-price-color: var(--wa-color-accent, var(--wa-price-color));
	--wa-primary-color: var(--wa-color-primary);
	--wa-primary-contrast: var(--wa-color-primary-contrast);
	--wa-primary-hover: var(--wa-color-primary-hover);
	--wa-accent-color: var(--wa-color-accent);
	--wa-accent-contrast: var(--wa-color-accent-contrast);
	--wa-heading-color: var(--wa-color-text);
	--wa-link-color: var(--wa-color-primary);
	--wa-price-color: var(--wa-color-accent);
	--wa-button-primary-bg: var(--wa-color-primary);
	--wa-button-primary-color: var(--wa-color-primary-contrast);
	--wa-button-secondary-bg: var(--wa-secondary-bg);
	--wa-button-secondary-color: var(--wa-secondary-fg);
	--wa-button-secondary-border: var(--wa-secondary-border);
	--wa-radius-card: var(--wa-radius-md);
	--wa-radius-button: var(--wa-radius-pill);
	--wa-radius-input: var(--wa-radius-sm);
	--wa-radius-panel: var(--wa-radius-lg);
	--wa-shadow-card: var(--wa-shadow-sm);
	--wa-shadow-panel: var(--wa-shadow-md);
	--wa-shadow-button: var(--wa-shadow-sm);
	--wa-space-card-y: var(--wa-space-md);
	--wa-space-card-x: var(--wa-space-md);
	--wa-space-list-gap: var(--wa-space-sm);
	--wa-space-section-y: var(--wa-space-lg);
	--wa-control-height: 3rem;
	--wa-heading-weight: 800;
	--wa-button-weight: 700;
	--wa-price-weight: 800;
	--wa-heading-letter-spacing: -0.02em;
	--wa-nav-bg: var(--wa-mobile-nav-bg);
	--wa-nav-color: var(--wa-mobile-nav-color);
	--wa-nav-active-color: var(--wa-mobile-nav-active-color);
	--wa-nav-border: var(--wa-color-border);
	--wa-nav-badge-bg: var(--wa-color-primary);
	--wa-nav-badge-color: var(--wa-color-primary-contrast);

	/* R34 — Form / checkout / chat / modale (compiler preset sovrascrive) */
	--wa-accent-contrast: var(--wa-color-accent-contrast);
	--wa-input-bg: var(--wa-color-surface);
	--wa-input-color: var(--wa-color-text);
	--wa-input-border: var(--wa-color-border);
	--wa-input-placeholder: var(--wa-color-muted);
	--wa-input-focus-border: var(--wa-color-primary);

	--wa-success-bg: var(--wa-color-success-bg);
	--wa-success-color: var(--wa-color-success-fg);
	--wa-warning-bg: var(--wa-color-warning-bg);
	--wa-warning-color: var(--wa-color-warning-fg);
	--wa-warning-border: color-mix(in srgb, var(--wa-color-warning) 28%, var(--wa-color-warning-bg));
	--wa-overlay-scrim: color-mix(in srgb, var(--wa-color-dark) 72%, transparent);
	--wa-danger-bg: var(--wa-color-danger-bg);
	--wa-danger-color: var(--wa-color-danger-fg);
	--wa-info-bg: var(--wa-color-info-bg);
	--wa-info-color: var(--wa-color-info-fg);

	--wa-checkout-step-active-bg: var(--wa-color-primary);
	--wa-checkout-step-active-color: var(--wa-color-primary-contrast);
	--wa-checkout-step-done-bg: var(--wa-color-success);
	--wa-checkout-step-done-color: var(--wa-color-inverse);
	--wa-checkout-step-muted-bg: var(--wa-color-surface-soft);
	--wa-checkout-step-muted-color: var(--wa-color-muted);
	--wa-checkout-box-bg: var(--wa-color-surface);
	--wa-checkout-box-color: var(--wa-color-text);
	--wa-checkout-box-border: var(--wa-color-border);

	--wa-chat-bg: var(--wa-color-bg);
	--wa-chat-panel-bg: var(--wa-color-surface);
	--wa-chat-bubble-in-bg: var(--wa-color-surface-soft);
	--wa-chat-bubble-in-color: var(--wa-color-text);
	--wa-chat-bubble-out-bg: var(--wa-color-primary);
	--wa-chat-bubble-out-color: var(--wa-color-primary-contrast);
	--wa-chat-muted-color: var(--wa-color-muted);
	--wa-chat-composer-bg: var(--wa-color-surface);
	--wa-chat-composer-color: var(--wa-color-text);
	--wa-chat-composer-border: var(--wa-color-border);

	--wa-modal-bg: var(--wa-color-surface);
	--wa-modal-color: var(--wa-color-text);
	--wa-modal-border: var(--wa-color-border);
	--wa-addr-match-bg: var(--wa-modal-bg, var(--wa-color-surface));
	--wa-addr-match-color: var(--wa-modal-color, var(--wa-color-text));
	--wa-addr-match-muted: var(--wa-muted-color, var(--wa-color-muted));
	--wa-addr-match-kicker: var(--wa-color-success-fg);
	--wa-addr-match-accent: var(--wa-color-success);
	--wa-product-card-bg: var(--wa-color-surface);
	--wa-product-card-color: var(--wa-color-text);
	--wa-product-card-border: var(--wa-color-border);

	/* R35 — Home pilota (index categorie): default = alias globali; preset sovrascrive */
	--wa-home-bg: var(--wa-app-bg, var(--wa-color-bg));
	--wa-home-color: var(--wa-text-color, var(--wa-color-text));
	--wa-home-muted-color: var(--wa-muted-color, var(--wa-color-muted));
	--wa-home-section-gap: var(--wa-space-section-y, var(--wa-space-lg));
	--wa-home-padding-x: var(--wa-space-card-x, var(--wa-space-md));
	--wa-home-padding-y: var(--wa-space-card-y, var(--wa-space-md));
	--wa-home-grid-gap-x: var(--wa-space-list-gap, var(--wa-space-sm));
	--wa-home-grid-gap-y: var(--wa-space-list-gap, var(--wa-space-sm));

	--wa-topbar-bg: var(--wa-color-surface);
	--wa-topbar-color: var(--wa-text-color, var(--wa-color-text));
	--wa-topbar-border-color: var(--wa-border-color, var(--wa-color-border));
	--wa-topbar-shadow: var(--wa-shadow-sm);
	--wa-topbar-height: 3rem;
	--wa-topbar-padding-x: 0.75rem;
	--wa-topbar-font-family: var(--wa-font-body);
	--wa-topbar-font-weight: var(--wa-heading-weight, 700);

	--wa-lang-bg: var(--wa-color-surface-soft);
	--wa-lang-color: var(--wa-topbar-color);
	--wa-lang-border-color: var(--wa-topbar-border-color);
	--wa-lang-radius: var(--wa-radius-input, var(--wa-radius-sm));
	--wa-lang-shadow: none;
	--wa-lang-button-bg: var(--wa-lang-bg);
	--wa-lang-button-color: var(--wa-lang-color);
	--wa-lang-button-border-color: var(--wa-lang-border-color);
	--wa-lang-button-radius: var(--wa-lang-radius);
	--wa-lang-menu-bg: var(--wa-color-surface);
	--wa-lang-menu-color: var(--wa-color-text);
	--wa-lang-menu-border-color: var(--wa-lang-border-color);
	--wa-lang-menu-shadow: var(--wa-shadow-md);
	--wa-lang-menu-radius: var(--wa-radius-md);
	--wa-lang-item-bg: transparent;
	--wa-lang-item-color: var(--wa-lang-menu-color);
	--wa-lang-item-active-bg: var(--wa-color-surface-soft);
	--wa-lang-item-active-color: var(--wa-color-text);
	--wa-lang-item-muted-color: var(--wa-color-muted);

	--wa-category-item-bg: transparent;
	--wa-category-item-color: var(--wa-category-title-color);
	--wa-category-item-radius: var(--wa-radius-card);
	--wa-category-item-padding: 0.2rem 0.25rem 0.45rem;
	--wa-category-item-shadow: none;

	--wa-category-media-bg: var(--wa-color-accent-soft);
	--wa-category-media-border-color: transparent;
	--wa-category-media-radius: 50%;
	--wa-category-media-shadow: none;
	--wa-surface-soft-bg: var(--wa-color-surface-soft);
	--wa-category-media-size: min(100%, 200px);
	--wa-category-media-padding: 0;

	--wa-category-image-radius: var(--wa-category-media-radius);
	--wa-category-image-shadow: none;

	--wa-category-fallback-bg: var(--wa-color-surface-soft);
	--wa-category-fallback-color: var(--wa-home-color);
	--wa-category-fallback-icon-color: var(--wa-color-accent);
	--wa-category-fallback-border-color: var(--wa-border-color);

	--wa-category-title-color: var(--wa-heading-color, var(--wa-color-text));
	--wa-category-title-font-family: var(--wa-font-heading);
	--wa-category-title-font-size: 1rem;
	--wa-category-title-font-weight: var(--wa-heading-weight, 700);
	--wa-category-title-line-height: 1.3;
	--wa-category-title-letter-spacing: var(--wa-heading-letter-spacing, 0);
	--wa-category-title-margin-top: 0.5rem;

	--wa-bottom-nav-bg: var(--wa-bottombar-bg, var(--wa-color-surface));
	--wa-bottom-nav-color: var(--wa-bottombar-fg, var(--wa-color-muted));
	--wa-bottom-nav-active-color: var(--wa-bottombar-active-fg, var(--wa-color-primary));
	--wa-bottom-nav-border-color: var(--wa-border-color);
	--wa-bottom-nav-shadow: 0 -4px 14px var(--wa-color-shadow);
	--wa-bottom-nav-icon-color: var(--wa-bottom-nav-color);
	--wa-bottom-nav-icon-active-color: var(--wa-bottom-nav-active-color);
	--wa-bottom-nav-label-color: var(--wa-bottom-nav-color);
	--wa-bottom-nav-label-active-color: var(--wa-bottom-nav-active-color);
	--wa-bottom-nav-badge-bg: var(--wa-nav-badge-bg, var(--wa-color-primary));
	--wa-bottom-nav-badge-color: var(--wa-nav-badge-color, var(--wa-color-primary-contrast));
	--wa-bottom-nav-badge-border-color: transparent;

	--wa-footer-muted-color: color-mix(in srgb, var(--wa-footer-color, var(--wa-color-inverse)) 72%, transparent);
	--wa-footer-link-color: var(--wa-footer-color, var(--wa-color-inverse));
	--wa-footer-border-color: transparent;
	--wa-footer-padding-y: 2rem;
	--wa-footer-logo-opacity: 1;

	--wa-focus-ring-color: var(--wa-color-primary);
	--wa-focus-ring-offset: 3px;
	--wa-active-scale: 0.98;
}

/* ═══════════════════════════════════════════════════════════════════
 * R25 — Gerarchia tipografica pizzeria (classi esistenti, nessun rename)
 * Stessa famiglia (Montserrat), ruoli distinti per peso/dimensione/colore.
 * ═══════════════════════════════════════════════════════════════════ */

/* Titolo pagina (carrello, checkout, conferma, login) */
.iltuo,
.titolologin,
.titolologin_nome,
.wa-flow-page-title.iltuo {
	font-family: var(--wa-font-heading);
	font-size: var(--wa-text-xl);
	font-weight: 700;
	line-height: var(--wa-line-tight);
	letter-spacing: -0.02em;
	color: var(--wa-color-text);
	text-transform: uppercase;
}

/* Titolo sezione checkout / sottotitolo fase */
.wa-checkout-servizio-heading,
.wa-checkout-delivery-title,
.wa-checkout-pagamento-title,
.wa-checkout-time-choice__title {
	font-size: var(--wa-text-md);
	font-weight: 700;
	line-height: var(--wa-line-tight);
	color: var(--wa-color-text);
}

/* Sottotitolo / lead secondario */
.wa-checkout-subtitle,
.wa-checkout-pagamento-lead,
.wa-checkout-marketing-hint,
.testoconsegna,
.consegnagratuita {
	font-size: var(--wa-text-sm);
	line-height: var(--wa-line-relaxed);
	color: var(--wa-color-muted);
}

.wa-checkout-subtitle-phase {
	color: var(--wa-color-text);
	font-weight: 600;
}

/* Label form */
.wa-checkout-label,
.fp-note-label,
label.wa-checkout-label {
	font-size: var(--wa-text-sm);
	font-weight: 600;
	line-height: var(--wa-line-normal);
	color: var(--wa-color-text);
}

/* Hint / aiuto */
.wa-checkout-hint,
.wa-slots-hint-optional,
.invalid-feedback {
	font-size: var(--wa-text-xs);
	line-height: var(--wa-line-relaxed);
	color: var(--wa-color-muted);
}

/* Prezzi */
.prezzoscheda,
.costounita,
.costounita span,
.prezzopizza,
.nome_prodotto + .prezzoscheda,
.coloretestocarrello {
	color: var(--wa-color-accent);
	font-weight: 700;
}

/* Totali */
.totale,
.totale strong,
.totalecifre,
.wa-checkout-totale-block .totalecifre,
.wa-carrello-page .wa-cart-totale-block .totalecifre {
	color: var(--wa-color-accent);
	font-weight: 700;
}

/* Link testuali secondari */
.menuapri,
.wa-checkout-back-btn,
.wa-checkout-back-link {
	color: var(--wa-secondary-fg);
	border-color: var(--wa-color-border);
}

.menuapri:active,
.wa-checkout-back-btn:active {
	color: var(--wa-secondary-hover-fg);
}

/* ── Token semantici "messaggi di stato" (Round 2 refactor 2026) ──
 * Default = identici ai colori storicamente hardcoded di
 * `.servizioattivo` / `.serviziononattivo`. Lo scopo è SOLO rendere
 * i colori governabili dal CSS Editor (gruppo `status_messages`,
 * ruoli `status-success` / `status-danger`) senza cambiare
 * l'aspetto visivo attuale. Il border-color è esposto come token
 * ma il border-style/width restano default (0/none) sui consumer
 * attuali, quindi il solo change cromatico non disegna bordo:
 * permette però a custom_css o a future utenze (alert, badge) di
 * sfruttare il token senza nuove definizioni.
 *
 * Round 16 refactor 2026 — i `--wa-status-*` ora ereditano dai token
 * globali `--wa-color-success-{bg,fg}` / `--wa-color-danger-{bg,fg}`
 * via `var(token-globale, fallback-storico)`. Il fallback preserva
 * il comportamento pre-R16 anche se un browser non supportasse il
 * resolve a cascata (è solo cintura di sicurezza, sì un po' paranoia,
 * ma `var()` non supporta più di un livello di indirezione su alcuni
 * browser molto vecchi e qui voglio zero rischio).
 */
:root {
	--wa-status-success-bg: var(--wa-color-success-bg, rgba(40, 167, 69, 0.15));
	--wa-status-success-fg: var(--wa-color-success-fg, #155724);
	--wa-status-success-border: transparent;
	--wa-status-danger-bg: var(--wa-color-danger-bg, rgba(220, 53, 69, 0.12));
	--wa-status-danger-fg: var(--wa-color-danger-fg, #721c24);
	--wa-status-danger-border: transparent;
	/* Round 15 refactor 2026 — token semantici "fallback grafici / immagini
	 * mancanti". Default = identici ai colori storicamente hardcoded sui 3
	 * consumer (.wa-cat-card-img bg #f2f2f2, .wa-cat-card-placeholder bg
	 * #eee, .wa-cat-card-placeholder .fas color #aaa). I 3 valori sono
	 * stati allineati al solo `--wa-img-placeholder-bg: #eee` e
	 * `--wa-img-placeholder-icon: #aaa`: la differenza #f2f2f2 vs #eee era
	 * di 4 livelli grigio impercettibile (delta luminanza ~1%) ed evita un
	 * 3° token "loading skeleton" dedicato. Lo scopo è SOLO rendere i
	 * placeholder governabili dal CSS Editor (gruppo `image_placeholders`,
	 * ruolo `image-placeholder`) senza cambiare l'aspetto attuale. */
	/* R26 — placeholder caldi pizzeria: crema impasto + crosta. */
	--wa-img-placeholder-bg: var(--wa-color-surface-soft);
	--wa-img-placeholder-icon: var(--wa-color-accent);
}

/* ═══════════════════════════════════════════════════════════════════
 * R26 — Template Base 0.1 Pizzeria — Polish visivo (lista, home, card)
 *
 * Obiettivo: con `editor.css` e `custom.css` vuoti la web_app deve
 * sembrare un prodotto finito (non un wireframe). Lavoriamo solo su
 * classi esistenti e token; nessun rename.
 * Doc: `dashboard/Docs/WEB_APP_PIZZERIA_TEMPLATE_BASE_01_2026.md`
 * ═══════════════════════════════════════════════════════════════════ */

/* Body — sfondo pagina da token globali/Home (preset sovrascrive su html[data-wa-style]). */
body {
	background-color: var(--wa-home-bg, var(--wa-color-bg));
	color: var(--wa-home-color, var(--wa-color-text));
}

/* Container default pizzeria — sfondo trasparente per ereditare bg. */
.container {
	background-color: transparent;
}

/* Lista prodotti — card visivamente finita.
 * `.blocco_presentazioneprodotto` storicamente è un display:inline-table
 * con padding minimo. R26 la trasforma in vera card: surface bianca,
 * radius, bordo caldo, ombra morbida, hover lift. Tutti i tenant senza
 * editor compilato vedono subito una lista decente. Editor `productCard_*`
 * resta sopra. */
.wa-lista-grid .blocco_presentazioneprodotto {
	background: var(--wa-surface-bg, var(--wa-color-surface));
	border: 1px solid var(--wa-border-color, var(--wa-color-border));
	border-radius: var(--wa-radius-card, var(--wa-radius-md));
	box-shadow: var(--wa-shadow-card, var(--wa-shadow-sm));
	padding: var(--wa-space-card-y, 1rem) var(--wa-space-card-x, 1rem) 1.1rem;
	transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.wa-lista-grid .blocco_presentazioneprodotto:active {
	transform: scale(0.995);
	opacity: 0.96;
}
.wa-lista-grid .blocco_presentazioneprodotto .foto_prodotto,
.wa-lista-grid .blocco_presentazioneprodotto .wa-product-img-placeholder {
	border-radius: var(--wa-radius-input, var(--wa-radius-sm));
	overflow: hidden;
}
.wa-lista-grid .blocco_presentazioneprodotto .nome_prodotto {
	font-family: var(--wa-font-heading);
	font-size: 1.1rem;
	letter-spacing: var(--wa-heading-letter-spacing, 0);
	font-weight: var(--wa-heading-weight, 700);
	color: var(--wa-text-color, var(--wa-color-text));
	margin-top: 0.85rem;
	margin-bottom: 0.5rem;
	text-transform: none;
	line-height: 1.25;
}
.wa-lista-grid .blocco_presentazioneprodotto .prezzoscheda {
	font-size: 1.4rem;
	letter-spacing: 0;
	color: var(--wa-price-color, var(--wa-color-accent));
	font-weight: var(--wa-price-weight, 800);
	margin-bottom: 0.6rem;
	display: inline-block;
}
.wa-lista-grid .blocco_presentazioneprodotto .btn-prodotti {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.4rem;
	width: 100%;
	min-height: var(--wa-control-height, 44px);
	font-size: 0.95rem;
	font-family: var(--wa-font-body);
	font-weight: var(--wa-button-weight, 700);
	letter-spacing: 0.04em;
	border-radius: var(--wa-radius-button, var(--wa-radius-pill));
	padding: 0.6rem 1rem;
	margin-top: 0.4rem;
}

/* Titolo categoria pagina lista. */
.titolo_categoria {
	font-family: var(--wa-font-heading);
	font-size: var(--wa-text-xl);
	font-weight: var(--wa-heading-weight, 800);
	letter-spacing: var(--wa-heading-letter-spacing, -0.01em);
	color: var(--wa-text-color, var(--wa-color-text));
	margin: 1.25rem 0 1.5rem;
	text-align: center;
}

/* Categorie home — menu visuale pulito (R26b: no card ecommerce di default).
 * I campi editor `catCard_bg`, `catCard_borderColor`, `catCard_shadow` possono
 * ancora ripristinare una card piena se il ristoratore lo desidera. */
.wa-home-categories .wa-cat-card-link {
	display: block;
	background: transparent;
	border: 1px solid transparent;
	box-shadow: none;
	padding: 0.2rem 0.25rem 0.45rem;
	transition: transform 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}
.wa-home-categories .wa-cat-card-title {
	color: var(--wa-category-title-color, var(--wa-text-color, var(--wa-color-text)));
	font-weight: var(--wa-category-title-font-weight, 700);
}
.wa-home-categories .wa-cat-card-img,
.wa-home-categories .wa-cat-card-placeholder:not(.wa-cat-card-placeholder--in-shape) {
	background-color: var(--wa-category-fallback-bg, var(--wa-color-surface-soft));
	aspect-ratio: 1 / 1;
	max-width: min(100%, 200px);
	margin-left: auto;
	margin-right: auto;
	border-radius: 50%;
	min-height: 0;
}
.wa-home-categories .wa-cat-card-placeholder--in-shape {
	background: transparent;
	min-height: 0;
}
.wa-home-categories .wa-cat-card-placeholder--in-shape .fas {
	font-size: 1.65rem;
	opacity: 0.85;
	color: var(--wa-category-fallback-icon-color, var(--wa-img-placeholder-icon));
}

/* Semaforo home — superficie caldo, testo scuro. */
.bloccosemaforo {
	background-color: var(--wa-color-surface-soft);
	border-radius: var(--wa-radius-md);
	padding: 0.5rem 0;
	color: var(--wa-color-text);
}
.semaforotesto {
	color: var(--wa-color-muted);
	font-weight: 600;
}
.semaforotesto b {
	color: var(--wa-color-text);
	font-weight: 800;
}

/* Modal title text — preset con title color, fallback inverse leggibile. */
.modal-title {
	color: var(--wa-color-primary-contrast);
	font-weight: 700;
}

/* Dropdown menu — surface coerente. */
.dropdown-menu {
	background-color: var(--wa-color-surface);
	border: 1px solid var(--wa-color-border);
	border-radius: var(--wa-radius-sm);
}
.dropdown-item {
	color: var(--wa-color-text);
}
.dropdown-item:hover,
.dropdown-item:focus {
	color: var(--wa-color-text);
	background-color: var(--wa-color-surface-soft);
}

/* Mobile lista (≤ 767px): card full width, tipografia leggermente ridotta. */
@media only screen and (max-width: 767px) {
	.wa-lista-grid .blocco_presentazioneprodotto {
		padding: 0.85rem 0.85rem 1rem;
	}
	body.wa-page-lista .wa-lista-grid .blocco_presentazioneprodotto .prezzoscheda {
		font-size: var(--wa-product-price-font-size-mobile, 1.05rem);
	}
}
/* ═══════════════════════════════════════════════════════════════════
 * Fine R26 — Template Base 0.1 polish
 * ═══════════════════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════════════════
 * R27 — Mobile Card System (linguaggio visivo da carrello mobile)
 * Card bianca su sfondo caldo; titolo forte; meta muted; prezzo accent.
 * Non duplicare layout carrello: riuso token + classi BEM opzionali.
 * ═══════════════════════════════════════════════════════════════════ */
.wa-mobile-card {
	background: var(--wa-surface-bg, var(--wa-color-surface));
	border: 1px solid var(--wa-border-color, var(--wa-color-border));
	border-radius: var(--wa-radius-card, var(--wa-radius-md));
	box-shadow: var(--wa-shadow-card, var(--wa-shadow-sm));
	color: var(--wa-text-color, var(--wa-color-text));
}
.wa-mobile-card__media {
	flex-shrink: 0;
}
.wa-mobile-card__body {
	min-width: 0;
	flex: 1 1 auto;
}
.wa-mobile-card__title {
	font-family: var(--wa-font-heading);
	font-size: 0.9375rem;
	font-weight: var(--wa-heading-weight, 700);
	line-height: 1.25;
	color: var(--wa-color-text);
	margin: 0;
}
.wa-mobile-card__meta {
	font-size: 0.8125rem;
	line-height: 1.35;
	color: var(--wa-color-muted);
	margin: 0.2rem 0 0;
}
.wa-mobile-card__price {
	font-family: var(--wa-font-body);
	font-size: 1.125rem;
	font-weight: var(--wa-price-weight, 800);
	line-height: 1.2;
	color: var(--wa-price-color, var(--wa-color-accent));
	letter-spacing: -0.02em;
}
.wa-mobile-card__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
	margin-top: 0.65rem;
}
.wa-mobile-summary-card {
	background: var(--wa-color-surface);
	border: 1px solid var(--wa-color-border);
	border-radius: var(--wa-radius-md);
	box-shadow: var(--wa-shadow-sm);
	padding: 1rem 1.125rem;
}
.wa-mobile-summary-card .totale,
.wa-mobile-summary-card .wa-checkout-totale-block .totale {
	display: block;
	margin: 0;
	font-size: 0.8125rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--wa-color-muted);
}
.wa-mobile-summary-card .totalecifre,
.wa-mobile-summary-card .wa-checkout-totale-block .totalecifre {
	display: block;
	margin-top: 0.15rem;
	font-size: 1.75rem;
	font-weight: 800;
	line-height: 1.15;
	color: var(--wa-color-accent);
	letter-spacing: -0.02em;
}
.wa-mobile-action-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	margin-top: 0.75rem;
	padding-top: 0.75rem;
	border-top: 1px solid var(--wa-color-border);
}

@media (max-width: 767.98px) {
	/* Lista prodotti — allinea al sistema card */
	.wa-lista-grid .blocco_presentazioneprodotto.wa-mobile-card,
	.wa-lista-grid .blocco_presentazioneprodotto {
		padding: 0.875rem 0.875rem 1rem;
	}
	.wa-lista-grid .blocco_presentazioneprodotto .nome_prodotto {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		overflow: hidden;
	}

	/* Scheda prodotto — colonne come card impilate */
	.wa-page-product .fp-page {
		box-shadow: none;
		background: transparent;
	}
	.wa-page-product .fp-body {
		background: transparent;
		box-shadow: none;
	}
	.wa-page-product .fp-col {
		background: var(--wa-color-surface);
		border: 1px solid var(--wa-color-border);
		border-radius: var(--wa-radius-md);
		box-shadow: var(--wa-shadow-sm);
		margin-bottom: 0.75rem;
		padding: 1rem;
		border-bottom: 1px solid var(--wa-color-border);
	}
	.wa-page-product .fp-product-name {
		font-family: var(--wa-font-body);
		font-size: 1.125rem;
		text-transform: none;
		letter-spacing: 0;
		color: var(--wa-color-text);
	}
	.wa-page-product .fp-product-baseprice strong {
		color: var(--wa-color-accent);
	}
	.wa-page-product .fp-product-desc,
	.wa-page-product .fp-product-cat {
		color: var(--wa-color-muted);
	}
	.wa-page-product .fp-sez {
		background: var(--wa-color-surface);
		border: 1px solid var(--wa-color-border);
		border-radius: var(--wa-radius-md);
		padding: 0.75rem;
		margin-bottom: 0.65rem;
	}

	/* Checkout — card servizio/orario/pagamento/riepilogo */
	.wa-checkout-page .wa-checkout-inner {
		display: flex;
		flex-direction: column;
		gap: 0.75rem;
	}
	.wa-checkout-servizio-card,
	.wa-checkout-page .wa-checkout-time-choice,
	.wa-checkout-page .wa-lucy-alt-card,
	.wa-checkout-page .wa-checkout-gate-card.wa-account-card,
	.wa-checkout-page .wa-account-card,
	.wa-account-page .wa-account-card,
	.wa-profilo-page .wa-account-card {
		background: var(--wa-color-surface);
		border: 1px solid var(--wa-color-border);
		border-radius: var(--wa-radius-md);
		box-shadow: var(--wa-shadow-sm);
		padding: 1rem 1.05rem;
	}
	.wa-checkout-servizio-card {
		margin-bottom: 0;
	}
	.wa-checkout-pagamento-card {
		background: var(--wa-color-surface);
		border: 1px solid var(--wa-color-border);
		border-radius: var(--wa-radius-md);
		box-shadow: var(--wa-shadow-sm);
	}
	.wa-checkout-pagamento-card.is-selected {
		border-color: var(--wa-color-primary);
		background: var(--wa-color-primary);
	}
	.wa-checkout-page .wa-checkout-totale-block,
	.wa-checkout-page .wa-cart-summary,
	.wa-carrello-page .wa-cart-summary {
		background: var(--wa-color-surface);
		border: 1px solid var(--wa-color-border);
		border-radius: var(--wa-radius-md);
		box-shadow: var(--wa-shadow-sm);
		padding: 1rem 1.125rem;
		margin-top: 0.5rem;
	}
	.wa-checkout-page .wa-checkout-msg,
	.wa-checkout-page .wa-flash-global {
		border-radius: var(--wa-radius-md);
	}

	/* Miei ordini — tabella → card */
	.wa-miei-ordini-table-wrap {
		border: 0;
		overflow: visible;
	}
	.wa-miei-ordini-table {
		border-collapse: separate;
		border-spacing: 0 0.65rem;
	}
	.wa-miei-ordini-table thead {
		display: none;
	}
	.wa-miei-ordini-table tbody,
	.wa-miei-ordini-table tr,
	.wa-miei-ordini-table td {
		display: block;
		width: 100%;
	}
	.wa-miei-ordini-table tr.wa-mobile-card {
		padding: 0.875rem 1rem;
		margin: 0;
	}
	.wa-miei-ordini-table td {
		border: 0;
		padding: 0.15rem 0;
		text-align: left;
		font-size: 0.875rem;
		color: var(--wa-color-muted);
	}
	.wa-miei-ordini-table td:first-child {
		font-size: 1rem;
		font-weight: 800;
		color: var(--wa-color-text);
		padding-bottom: 0.35rem;
	}
	.wa-miei-ordini-table td:nth-child(5) {
		font-size: 1.125rem;
		font-weight: 800;
		color: var(--wa-color-accent);
		padding-top: 0.35rem;
	}
	.wa-miei-ordini-table td::before {
		content: attr(data-label);
		display: block;
		font-size: 0.6875rem;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.04em;
		color: var(--wa-color-muted);
		margin-bottom: 0.1rem;
	}
	.wa-miei-ordini-table td:first-child::before,
	.wa-miei-ordini-table td:nth-child(5)::before {
		display: none;
	}
	.wa-miei-ordini-empty {
		padding: 1rem;
		border-radius: var(--wa-radius-md);
		background: var(--wa-color-surface);
		border: 1px solid var(--wa-color-border);
	}

	/* Empty state — card system */
	.wa-empty-state {
		background: var(--wa-color-surface);
		border: 1px solid var(--wa-color-border);
		border-radius: var(--wa-radius-md);
		box-shadow: var(--wa-shadow-sm);
	}

	/* Home categorie — stesso stile leggero del base (preview editor = pagina reale) */
	.wa-home-categories .wa-cat-card-link {
		background: transparent;
		border-color: transparent;
		box-shadow: none;
		padding: 0.2rem 0.25rem 0.45rem;
	}
	.wa-home-categories .wa-cat-card-link:hover {
		background: var(--wa-color-surface-soft);
	}
	.bloccosemaforo {
		border: 1px solid var(--wa-color-border);
		box-shadow: var(--wa-shadow-sm);
	}

	/* Login / auth gate */
	.wa-checkout-gate-page .wa-checkout-gate-card,
	.wa-checkout-page .wa-checkout-gate-card {
		padding: 1.1rem 1rem;
	}

	/* Messaggi — già card; rafforza coerenza */
	.wa-messages-guest,
	.wa-chat-card {
		border-radius: var(--wa-radius-md);
		box-shadow: var(--wa-shadow-sm);
	}

	/* Carrello — righe/card: token carrello (Base tc_cart_card_bg), non surface generica */
	.wa-carrello-page .wa-cart-card.wa-mobile-card,
	.wa-carrello-page .wa-cart-card,
	.wa-carrello-page .wa-cart-row {
		background: var(--wa-cart-row-bg, var(--wa-cart-card-bg, var(--wa-color-card, var(--wa-color-surface-strong, var(--wa-color-surface)))));
		border: 1px solid var(--wa-cart-card-border, var(--wa-color-border));
		border-radius: var(--wa-cart-card-radius, var(--wa-radius-md));
		box-shadow: var(--wa-cart-card-shadow, var(--wa-shadow-sm));
	}
	.wa-carrello-page .wa-cart-summary {
		padding: 1rem 1.125rem;
	}
}

@media (min-width: 768px) {
	.wa-miei-ordini-table tr.wa-mobile-card {
		background: transparent;
		border: 0;
		box-shadow: none;
		padding: 0;
	}
}

/* ═══════════════════════════════════════════════════════════════════
 * Fine R27 — Mobile Card System
 * ═══════════════════════════════════════════════════════════════════ */

.navigation-clean.navbar .navbar-nav .nav-link {
	padding-left: 0;
}

.wa-hidden {
	display: none;
}

.wa-bg-dynamic {
	background-image: var(--wa-bg-image);
}

/* prodotto.php — shell preview (non confondere con dashboard) */
.wa-embed-preview .fp-admin-bar {
	display: none;
}
.wa-embed-preview .fp-mobile-footer {
	bottom: 0;
}
.wa-product-shell {
	padding: 0;
	max-width: 1200px;
	margin: 0 auto;
}
.wa-product-error {
	padding: 2rem;
	text-align: center;
}

/* Round 7 refactor 2026 — focus tastiera visibile e preset-aware su scheda
 * prodotto (`prodotto.php`). Scoped a `.wa-product-shell` per NON interferire
 * con la stessa preview montata nella dashboard admin (stesso markup `.fp-*`,
 * scope diverso). Stesso pattern di Round 5/6: outline 2px `currentColor` ⇒
 * eredita `body_fg`/`detail_*Fg` dal preset (scuro su preset chiari, chiaro
 * su preset scuri). Solo `:focus-visible` (focus tastiera), nessun outline
 * persistente al click mouse. Coperti gli elementi interattivi principali:
 *  - CTA principale + barra mobile sticky (`.fp-cart-btn` / `-mobile-footer-btn`)
 *  - Bottoni allergeni / accordion / quantità (`.fp-allergen-btn`, `.fp-acc-header`, `.fp-qty-btn`)
 *  - Opzioni varianti / aggiunte (`.fp-sez-option`, `.fp-sez-select`)
 *  - Textarea note (`.fp-note-input`)
 * Niente colori hardcoded, niente nuovi token: solo CSS additivo
 * sull'accessibilità. */
.wa-product-shell .fp-cart-btn:focus-visible,
.wa-product-shell .fp-mobile-footer-btn:focus-visible {
	outline: 2px solid;
	outline-offset: 3px;
}
.wa-product-shell .fp-allergen-btn:focus-visible,
.wa-product-shell .fp-acc-header:focus-visible,
.wa-product-shell .fp-qty-btn:focus-visible {
	outline: 2px solid;
	outline-offset: 2px;
}
.wa-product-shell .fp-sez-option:focus-visible {
	outline: 2px solid;
	outline-offset: 2px;
	border-radius: 6px;
}
.wa-product-shell .fp-sez-select:focus-visible,
.wa-product-shell .fp-note-input:focus-visible {
	outline: 2px solid;
	outline-offset: 2px;
}

/* Mobile-first: scheda prodotto — CTA sticky in .fp-mobile-footer; totale/bottone in .fp-summary nascosti su mobile */
body.wa-page-product {
	--wa-mobile-sticky-footer-h: 5.75rem;
}
@media (min-width: 992px) {
	body.wa-page-product {
		--wa-mobile-sticky-footer-h: 0px;
	}
}

/* Mobile-first: bottom bar mobile (wa-bottombar.php) — altezza condivisa per padding pagine e stacking CTA */
body.wa-use-bottombar {
	--wa-mobile-bottombar-h: 4.25rem;
}
@media (min-width: 992px) {
	body.wa-use-bottombar {
		--wa-mobile-bottombar-h: 0px;
	}
}

@media (max-width: 991.98px) {
	/* Scheda prodotto: spazio per bottombar + barra CTA sticky (.fp-mobile-footer). */
	body.wa-page-product.wa-use-bottombar .fp-page {
		padding-bottom: calc(
			var(--wa-mobile-bottombar-h) + var(--wa-mobile-sticky-footer-h) + 1rem + env(safe-area-inset-bottom, 0px)
		);
	}
	body.wa-page-product:not(.wa-use-bottombar) .fp-page {
		padding-bottom: calc(var(--wa-mobile-sticky-footer-h) + 1.25rem + env(safe-area-inset-bottom, 0px));
	}

	body.wa-page-product.wa-use-bottombar .fp-mobile-footer {
		bottom: calc(var(--wa-mobile-bottombar-h) + env(safe-area-inset-bottom, 0px));
	}

	/* Mobile: prezzo+CTA nel riepilogo in pagina nascosti (restano note; CTA in .fp-mobile-footer). */
	body.wa-page-product .fp-summary-label,
	body.wa-page-product .fp-summary-price,
	body.wa-page-product .fp-cart-btn {
		display: none !important;
	}

	/* Contenuto generico con bottombar: safe-area in fondo, sostituisce il vecchio padding FAB. */
	body.wa-use-bottombar:not(.wa-page-product) {
		padding-bottom: calc(var(--wa-mobile-bottombar-h) + 0.75rem + env(safe-area-inset-bottom, 0px));
	}
	/* Nota: il fallback `body.wa-use-floating-chrome ...` è stato rimosso insieme
	 * al partial wa-floating-chrome.php (FAB giallo carrello + blu messaggi) — ora
	 * carrello e messaggi vivono in topbar desktop e nella bottombar mobile. */
}

/* Header mobile minimale (con bottombar attiva).
 * Regola prodotto (vedi chat "Adesso che su mobile esiste una bottom bar, l’header mobile
 * va ripensato"): in alto resta solo identità del locale + lingua. La navigazione vive
 * nella bottombar (vedi partials/wa-bottombar.php, wa-bottombar.css, wa-mobile-menu-sheet.php).
 * Copre due casi:
 *   - solo nome locale (niente logo): span centrato, adattivo con ellipsis.
 *   - logo + nome: logo compatto a sinistra, nome accanto (anche lungo), bandierina a destra.
 * Desktop (>=992px) non è toccato: restano invariati sia il comportamento "solo logo" sia
 * il layout storico della navbar. */
@media (max-width: 991.98px) {
	/* Carrello mobile e bottone "Menu" (toggler) sono stati rimossi direttamente dal
	 * partial nav.php: le relative funzioni vivono nella bottombar (wa-bottombar.php)
	 * e nel bottom sheet (wa-mobile-menu-sheet.php). Le regole qui sotto restano come
	 * guard-rail difensivo per caching o template custom che avessero ancora il markup
	 * legacy, così su mobile non riappare mai un doppione di navigazione.
	 * .navbar-collapse / #navcol-1 restano nel DOM per il desktop (md+) con le categorie:
	 * su mobile li nascondiamo esplicitamente.
	 * Round 18 cleanup 2026 — rimosso `.wa-nav-cart-mobile` dal selettore guard-rail
	 * (la classe non è più nel DOM né nel CSS sorgente, redundant). `.wa-nav-toggler`
	 * resta come guard-rail difensivo. */
	.wa-nav-toggler,
	body.wa-use-bottombar .navbar.navigation-clean .navbar-collapse,
	body.wa-use-bottombar #navcol-1 {
		display: none !important;
	}

	/* Layout compatto della riga navbar: brand a sinistra, bandierina a destra, una sola riga. */
	body.wa-use-bottombar .navbar.navigation-clean > .container {
		display: flex;
		flex-wrap: nowrap;
		align-items: center;
		justify-content: space-between;
		gap: 0.5rem;
	}
	body.wa-use-bottombar .navbar.navigation-clean > .container > div:first-child {
		flex: 1 1 auto;
		min-width: 0;
		display: flex;
		align-items: center;
	}

	/* Brand come flex row: logo + nome convivono senza schiacciarsi; niente newline brutti. */
	body.wa-use-bottombar .navbar-brand {
		display: flex;
		align-items: center;
		gap: 0.55rem;
		min-width: 0;
		max-width: 100%;
		margin-right: 0;
		padding: 0;
		overflow: hidden;
		white-space: nowrap;
	}

	/* Logo mobile compatto: rispetta aspect ratio, non forza più la 155x90 desktop. */
	body.wa-use-bottombar .navbar-brand .wa-nav-logo,
	body.wa-use-bottombar .navbar-brand .logoprincipale.wa-nav-logo {
		height: 2.1rem;
		max-height: 2.1rem;
		width: 3.4rem;
		min-width: 2.1rem;
		max-width: 3.8rem;
		flex: 0 0 auto;
	}

	/* Nome locale adattivo: font clamp per lunghezze diverse, ellipsis per nomi lunghi.
	 * Copre sia il caso "solo nome" (span senza classe specifica in nav.php) sia il nuovo
	 * .wa-nav-name-mobile aggiunto accanto al logo. */
	body.wa-use-bottombar .navbar-brand .wa-nav-name,
	body.wa-use-bottombar .navbar-brand > span {
		display: inline-block;
		flex: 1 1 auto;
		min-width: 0;
		max-width: 100%;
		font-size: clamp(0.92rem, 3.6vw, 1.1rem);
		font-weight: 800;
		line-height: 1.2;
		color: inherit;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	/* Quando c'è anche il logo, lascia un filo di font in meno per bilanciare la riga. */
	body.wa-use-bottombar .navbar-brand .wa-nav-name--mobile {
		font-size: clamp(0.88rem, 3.4vw, 1.04rem);
		font-weight: 700;
	}

	/* Bandierina lingua: mini, ancorata a destra, non si mangia spazio al brand. */
	body.wa-use-bottombar .wa-nav-lang-mobile {
		flex: 0 0 auto;
		margin-left: auto;
	}
	body.wa-use-bottombar .wa-nav-lang-mobile .vm-ar2-lang__trigger {
		padding: 0.2rem 0.4rem;
	}

	/* Navbar più bassa, coerente con look web app. */
	body.wa-use-bottombar .navbar.navigation-clean {
		padding-top: 0.45rem;
		padding-bottom: 0.45rem;
	}
}

/* ---------------------------------------------------------------------------
 * Topbar verde (.sfondo_menusuperiore) — layout moderno post-rimozione FAB
 * (chat "ripensare la fascia alta del template"). Desktop-only, 2 cluster
 * sottili: sinistra = contatti locale, destra = account + social + lingua +
 * icona messaggi + icona carrello. Mobile usa bottombar.
 * Classi editabili dall'editor (`topbar_*` in vo-sf-editor-schema.js):
 *   .sfondo_menusuperiore (bg/fg/border/padding)
 *   .menu_superiore_link (link color + hover)
 * --------------------------------------------------------------------------- */
.menu_superiore_inner {
	padding: 4px 15px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 0.5rem;
	min-height: 36px;
	font-size: 13px;
	line-height: 1.25;
}
.menu_superiore_cluster {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
}
.menu_superiore_cluster--left {
	gap: 14px;
}
.menu_superiore_cluster--right {
	gap: 10px;
	margin-left: auto;
}

/* Meta testuale (indirizzo, telefono): icona + testo allineati. */
.menu_superiore_meta {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	font-size: 13px;
	line-height: 1.2;
}
.menu_superiore_meta .fas,
.menu_superiore_meta .far,
.menu_superiore_meta .fab {
	font-size: 0.82rem;
	opacity: 0.85;
}
.menu_superiore_addr {
	color: rgba(255, 255, 255, 0.7);
}
.menu_superiore_addr .menu_superiore_meta__txt {
	color: inherit;
}
.wa-topbar-phone {
	text-decoration: none;
}
.wa-topbar-phone:hover {
	text-decoration: none;
}

/* Separatore verticale sottile tra gruppi nel cluster destro. */
.menu_superiore_sep {
	display: inline-block;
	width: 1px;
	height: 18px;
	background: rgba(255, 255, 255, 0.28);
	margin: 0 2px;
}

/* Icone compatte (social, messaggi, carrello, lingua): area click generosa,
 * no sottolineature, consistente su tutta la barra. */
.menu_superiore_icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 28px;
	height: 28px;
	padding: 0 6px;
	border-radius: 999px;
	text-decoration: none !important;
	line-height: 1;
	transition: background-color 0.15s ease, color 0.15s ease;
}
.menu_superiore_icon:hover,
.menu_superiore_icon:focus-visible {
	background: rgba(255, 255, 255, 0.12);
}
.menu_superiore_icon .fas,
.menu_superiore_icon .far,
.menu_superiore_icon .fab {
	font-size: 0.95rem;
}

/* Carrello topbar: CTA vera, non icona muta. Icona + etichetta "Carrello" + badge quantità.
 * Richiesta prodotto (chat "Messaggi e carrello: da ripensare meglio"): il carrello è una
 * delle azioni più importanti del sito, deve essere evidente, non un simbolo perso. */
.menu_superiore_cart_link {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	padding: 0.25rem 0.75rem;
	border-radius: 999px;
	font-weight: 700;
	line-height: 1;
	text-decoration: none !important;
	background: rgba(255, 255, 255, 0.14);
	transition: background-color 0.15s ease, color 0.15s ease, transform 0.1s ease;
}
.menu_superiore_cart_link:hover,
.menu_superiore_cart_link:focus-visible {
	background: rgba(255, 255, 255, 0.24);
}
.menu_superiore_cart_link:active {
	transform: translateY(1px);
}
.menu_superiore_cart_link .fas {
	font-size: 1rem;
}
/* Wrap icona+badge: isola la posizione relativa, così il badge ancora all'icona e non
 * all'intero chip (il chip cambia larghezza quando appare la label). */
.menu_superiore_cart_icon_wrap,
.menu_superiore_icon_wrap {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
}
.menu_superiore_cart_label {
	font-size: 0.85rem;
	letter-spacing: 0.01em;
}

/* Badge carrello topbar: stesso pallino del badge bottombar mobile (token condivisi).
 * Prima: bg surface + fg success → su desktop sembrava solo un numero senza pill colorata. */
.wa-cart-badge {
	position: absolute;
	top: -6px;
	right: -10px;
	min-width: 16px;
	height: 16px;
	padding: 0 4px;
	background: var(--wa-bottom-nav-badge-bg, var(--wa-nav-badge-bg, var(--wa-color-primary)));
	color: var(--wa-bottom-nav-badge-color, var(--wa-nav-badge-color, var(--wa-color-primary-contrast)));
	border-radius: 999px;
	font-size: 10px;
	font-weight: 800;
	line-height: 16px;
	text-align: center;
	box-shadow: 0 2px 6px var(--wa-color-shadow, rgba(0, 0, 0, 0.18));
}

/* Badge messaggi (topbar): stessa forma del carrello ma color rosso notifica per distinguere
 * canale. Nascosto di default (`.wa-hidden`), lo mostrerà il client quando arriveranno non letti. */
.wa-topbar-badge {
	position: absolute;
	top: -6px;
	right: -8px;
	min-width: 16px;
	height: 16px;
	padding: 0 4px;
	border-radius: 999px;
	font-size: 10px;
	font-weight: 800;
	line-height: 16px;
	text-align: center;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
}
.wa-topbar-badge--msg {
	background: #e63946;
	color: #fff;
}

/* Logout topbar come icona sola: chiuso in un tondo discreto, hover che vira sul rosso
 * per rinforzare la natura distruttiva dell'azione. Il click passa da window.confirm
 * (vedi inline script in partials/topbar.php) prima di seguire il link. */
.wa-topbar-logout-icon {
	color: #fff;
}
.wa-topbar-logout-icon:hover,
.wa-topbar-logout-icon:focus-visible {
	background: rgba(230, 57, 70, 0.28);
	color: #fff;
}
.wa-topbar-logout-icon .fas {
	font-size: 1rem;
}

/* Su viewport stretti md (768–991) accorcia le stringhe di metadata non vitali
 * per evitare wrap brutti — la riga resta su una sola linea. */
@media (max-width: 1199.98px) {
	.menu_superiore_addr .menu_superiore_meta__txt {
		max-width: 28ch;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
}

/* nav */
.wa-nav-logo,
.logoprincipale.wa-nav-logo {
	height: 90px;
	max-height: 90px;
	width: 155px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	background-image: var(--wa-logo-url);
}
.wa-nav-toggler {
	color: #2e2d2d;
}
.wa-toggler-icon-fix {
	margin-right: 0;
}

/* ---------------------------------------------------------------------------
 * VO-BASE: ancore CSS Editor (schema vo-sf-editor-schema.js)
 * Default Bootstrap 4 / web_app; la PARTE CUSTOM tenant sotto può sovrascrivere.
 * Mappa: dashboard/Docs/STOREFRONT_CSS_MOD_MASTER_MAP.md (Step 3).
 * --------------------------------------------------------------------------- */
/* .container: layout Bootstrap; editor glob_containerMax agisce su max-width via compilazione */

.breadcrumb-item a {
	color: #6c757d;
}

.breadcrumb-item.active {
	color: #6c757d;
}

.vocimenu {
	color: #110b08;
	font-family: 'Montserrat', sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 1;
	text-transform: uppercase;
	transition: all 0.5s ease;
}

.navigation-clean.navbar-light .navbar-nav .vocimenu:hover,
.vocimenu:hover {
	opacity: 0.85;
}

.navigation-clean .navbar-nav .nav-link.active,
.navbar-nav .nav-link.active {
	color: #110b08;
	font-weight: 700;
}

.dropdown-menu {
	background-color: #fff;
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 0.25rem;
}

.dropdown-item {
	color: #212529;
}

.dropdown-item:hover,
.dropdown-item:focus {
	color: #16181b;
	background-color: #f8f9fa;
}

.bloccodipresentazionecentrale {
	color: inherit;
}

.servizioattivo {
	background-color: var(--wa-status-success-bg);
	color: var(--wa-status-success-fg);
	border-color: var(--wa-status-success-border);
	border-radius: 6px;
	padding: 10px 12px;
}

.serviziononattivo {
	background-color: var(--wa-status-danger-bg);
	color: var(--wa-status-danger-fg);
	border-color: var(--wa-status-danger-border);
	border-radius: 6px;
	padding: 10px 12px;
}

.wa-home-categories .row {
	margin-left: -12px;
	margin-right: -12px;
}

.wa-home-categories .row > [class*='col-'] {
	padding-left: 12px;
	padding-right: 12px;
}

.footer-completo {
	padding-top: 2rem;
	padding-bottom: 2rem;
}

.footer-dark h3 {
	color: #fff;
	font-size: 1.1rem;
	font-weight: 700;
}

.testofooter {
	color: rgba(255, 255, 255, 0.92);
	font-size: 1rem;
	letter-spacing: 0.02em;
}

.copyright {
	color: rgba(255, 255, 255, 0.65);
	font-size: 0.85rem;
}

.footertesto {
	color: rgba(255, 255, 255, 0.85);
	transition: color 0.2s ease;
}

.footertesto:hover {
	color: #fff;
}

.footer-dark .item.social a {
	color: rgba(255, 255, 255, 0.9);
}

.footer-dark .item.social a:hover {
	color: #fff;
}

.sopraiub {
	color: rgba(255, 255, 255, 0.65);
}

.wa-account-card {
	background: var(--wa-color-surface);
	border-radius: var(--wa-card-radius);
	box-shadow: var(--wa-shadow-md);
	border: 1px solid var(--wa-card-border);
}

/* Card "Lingua del sito" dentro profilo.php: ospita il dropdown bandiere (.wa-storefront-lang-wrap)
 * spostato qui dalla topbar. Sotto il blocco principale dei dati, stesso stile card bianca.
 * La distanza tra le sezioni profilo è gestita da gap su .wa-checkout-inner (vedi sotto). */
.wa-checkout-page.wa-profilo-page .wa-checkout-inner {
	display: flex;
	flex-direction: column;
	gap: clamp(1.35rem, 4.5vw, 1.75rem);
	padding-left: clamp(1rem, 4vw, 1.35rem);
	padding-right: clamp(1rem, 4vw, 1.35rem);
}
/* Card profilo — stesso padding e sfondo su mobile, tablet e desktop */
.wa-checkout-page.wa-profilo-page .wa-mobile-card.wa-account-card,
.wa-checkout-page.wa-profilo-page .wa-account-card {
	padding: clamp(1.15rem, 3.5vw, 1.4rem) clamp(1.25rem, 4.5vw, 1.55rem);
	background: var(--wa-color-surface);
	border: 1px solid var(--wa-color-border);
	border-radius: var(--wa-radius-md);
	box-shadow: var(--wa-shadow-sm);
	color: var(--wa-color-text);
}
.wa-checkout-page.wa-profilo-page .wa-account-card.wa-checkout-gate-card {
	text-align: left;
	margin-left: 0;
	margin-right: 0;
	max-width: none;
}
.wa-profilo-page .wa-account-dl dt:first-of-type {
	margin-top: 0;
}
.wa-profilo-lang-card {
	margin-top: 0;
}
.wa-profilo-lang-head {
	margin-bottom: 0.65rem;
}
.wa-profilo-lang-title {
	margin: 0 0 0.2rem;
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--wa-color-text);
}
.wa-profilo-lang-lead {
	margin: 0;
	color: var(--wa-color-muted);
	font-size: 0.9rem;
	line-height: var(--wa-line-relaxed);
}
.wa-profilo-lang-switcher {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.6rem;
}
.wa-profilo-lang-switcher .wa-storefront-lang-wrap {
	flex: 0 0 auto;
}

/* Profilo — notifiche WhatsApp (padding/sfondo: .wa-profilo-page .wa-account-card) */
.wa-profilo-notif-head {
	margin-bottom: 1rem;
}
.wa-profilo-notif-title {
	display: flex;
	align-items: center;
	gap: 0.55rem;
	margin: 0 0 0.35rem;
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--wa-color-text);
}
.wa-profilo-notif-title i {
	color: var(--wa-color-success);
	font-size: 1.25rem;
}
.wa-profilo-notif-lead {
	margin: 0;
	font-size: 0.85rem;
	color: var(--wa-color-muted);
	line-height: var(--wa-line-relaxed);
}
.wa-profilo-notif-toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 0.85rem 1rem;
	border: 1px solid var(--wa-color-border);
	border-radius: var(--wa-radius-sm);
	background: var(--wa-color-surface-soft);
	cursor: pointer;
	user-select: none;
	transition: background 0.12s, border-color 0.12s;
}
.wa-profilo-notif-toggle:active {
	background: var(--wa-color-surface-strong);
	border-color: var(--wa-color-border);
}
.wa-profilo-notif-toggle__copy {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	min-width: 0;
}
.wa-profilo-notif-toggle__title {
	font-weight: 600;
	color: var(--wa-color-text);
	font-size: 0.92rem;
}
.wa-profilo-notif-toggle__hint {
	font-size: 0.78rem;
	color: var(--wa-color-muted);
	line-height: var(--wa-line-relaxed);
}
.wa-profilo-notif-switch {
	position: relative;
	width: 44px;
	height: 24px;
	flex-shrink: 0;
}
.wa-profilo-notif-switch input {
	opacity: 0;
	width: 0;
	height: 0;
}
.wa-profilo-notif-switch__slider {
	position: absolute;
	inset: 0;
	background: var(--wa-color-border);
	border-radius: 24px;
	transition: background 0.2s;
}
.wa-profilo-notif-switch__slider::before {
	content: '';
	position: absolute;
	top: 3px;
	left: 3px;
	width: 18px;
	height: 18px;
	background: var(--wa-color-surface);
	border-radius: 50%;
	transition: transform 0.2s;
	box-shadow: var(--wa-shadow-sm);
}
.wa-profilo-notif-switch input:checked + .wa-profilo-notif-switch__slider {
	background: var(--wa-color-success);
}
.wa-profilo-notif-switch input:checked + .wa-profilo-notif-switch__slider::before {
	transform: translateX(20px);
}
.wa-profilo-notif-switch input:focus-visible + .wa-profilo-notif-switch__slider {
	outline: 2px solid var(--wa-color-accent);
	outline-offset: 2px;
}
.wa-profilo-notif-status {
	margin: 0.75rem 0 0.35rem;
	font-size: 0.78rem;
	min-height: 1.1em;
	color: var(--wa-color-success-fg);
}
.wa-profilo-notif-status.is-error {
	color: var(--wa-color-danger-fg);
}
.wa-profilo-notif-status.is-saving {
	color: var(--wa-color-muted);
}
.wa-profilo-notif-privacy {
	margin: 0;
	font-size: 0.78rem;
	color: var(--wa-color-muted);
	display: flex;
	align-items: flex-start;
	gap: 0.4rem;
	line-height: var(--wa-line-relaxed);
}
.wa-profilo-notif-privacy i {
	color: var(--wa-color-info);
	font-size: 0.95rem;
	margin-top: 0.05rem;
}

/* R33 — sezione avvisi ordine: canali base + opzionali */
.wa-profilo-notif-section {
	margin-top: 1.1rem;
}
.wa-profilo-notif-section + .wa-profilo-notif-section {
	margin-top: 1.25rem;
	padding-top: 1.15rem;
	border-top: 1px solid var(--wa-color-border);
}
.wa-profilo-notif-section__title {
	margin: 0 0 0.65rem;
	font-size: 0.78rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--wa-color-muted);
}
.wa-profilo-notif-row {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	padding: 0.85rem 0.95rem;
	border: 1px solid var(--wa-color-border);
	border-radius: var(--wa-radius-sm);
	background: var(--wa-color-surface);
}
.wa-profilo-notif-row + .wa-profilo-notif-row {
	margin-top: 0.55rem;
}
.wa-profilo-notif-row--locked {
	background: var(--wa-color-surface-soft);
}
.wa-profilo-notif-row__icon {
	flex-shrink: 0;
	color: var(--wa-color-success);
	font-size: 1.05rem;
	line-height: 1.2;
	margin-top: 0.1rem;
}
.wa-profilo-notif-row__copy {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
	min-width: 0;
	flex: 1;
}
.wa-profilo-notif-row__title {
	font-weight: 600;
	font-size: 0.92rem;
	color: var(--wa-color-text);
}
.wa-profilo-notif-row__desc {
	font-size: 0.78rem;
	color: var(--wa-color-muted);
	line-height: var(--wa-line-relaxed);
}
.wa-profilo-notif-badge {
	flex-shrink: 0;
	align-self: center;
	font-size: 0.68rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: var(--wa-color-success-fg);
	background: color-mix(in srgb, var(--wa-color-success) 14%, transparent);
	border: 1px solid color-mix(in srgb, var(--wa-color-success) 35%, transparent);
	border-radius: 999px;
	padding: 0.28rem 0.55rem;
	white-space: nowrap;
}
.wa-profilo-notif-section--extra .wa-profilo-notif-toggle {
	margin-top: 0;
	background: var(--wa-color-surface);
}
.wa-profilo-notif-toggle__channel-icon {
	color: #25d366;
	margin-right: 0.35rem;
}
.wa-profilo-notif-toggle__title {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.15rem;
}
@media (max-width: 480px) {
	.wa-profilo-notif-row {
		flex-wrap: wrap;
	}
	.wa-profilo-notif-badge {
		align-self: flex-start;
		margin-left: 1.8rem;
	}
}

/* Profilo — link legali (solo mobile; footer nascosto fuori home) */
.wa-profilo-legal-card {
	display: none;
}
@media (max-width: 991.98px) {
	.wa-profilo-legal-card {
		display: block;
	}
}
.wa-profilo-legal-head {
	margin-bottom: 0.35rem;
}
.wa-profilo-legal-title {
	margin: 0;
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--wa-color-text);
}
.wa-profilo-legal-nav {
	display: flex;
	flex-direction: column;
	gap: 0.1rem;
	margin: 0;
}
.wa-profilo-legal-nav .wa-bs-item {
	margin: 0;
	padding-left: 0.1rem;
	padding-right: 0.1rem;
}
.wa-profilo-legal-nav .wa-bs-item i {
	color: var(--wa-color-muted);
	font-size: 0.95rem;
	width: 1.15rem;
	text-align: center;
}

/* Bottoni social/phone: brand colors UFFICIALI (Google, Facebook, WhatsApp)
 * — deliberatamente HARDCODED. Sono identità visiva esterna, non parte del
 * tema preset. Solo il testo bianco si esprime in `--wa-color-inverse` per
 * coerenza nominale (resta visivamente bianco). */
.wa-auth-social-btn {
	color: var(--wa-color-inverse);
	border-radius: var(--wa-radius-md);
}

.wa-auth-social-btn--google {
    /* Deprecato: usare vo-google-signin-btn (branding Google ufficiale). */
    background: #fff;
    color: #1f1f1f;
    border: 1px solid #747775;
}

.wa-auth-social-btn--facebook {
	background: #1877f2;
}

.wa-auth-phone-btn {
	background: #25d366;
	color: var(--wa-color-inverse);
	border-radius: var(--wa-radius-md);
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.45rem;
}

.wa-auth-phone-btn--coming,
.wa-auth-phone-btn--coming:disabled {
	background: #e5e7eb;
	border-color: #d1d5db;
	color: #64748b;
	cursor: not-allowed;
	opacity: 1;
}

.wa-auth-provider-status {
	margin-left: auto;
	padding: 0.16rem 0.5rem;
	border-radius: 999px;
	background: rgba(15, 23, 42, 0.08);
	font-size: 0.68rem;
	font-weight: 800;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

.wa-auth-provider-status--active {
	background: rgba(255, 255, 255, 0.24);
	color: inherit;
}

.wa-checkout-gate-card label {
	color: var(--wa-color-text);
}

.wa-auth-alt-divider {
	color: var(--wa-color-muted);
}

.wa-confirm-pay-online {
	border-radius: var(--wa-radius-md);
}

.modal-content {
	background-color: #fff;
	color: #212529;
	border-radius: 0.3rem;
}

/* Regola `.wa-home-mobile-cta .bottonedatipersonali` rimossa: la CTA mobile
 * "Scopri i nostri prodotti" non fa più parte di index.php (vedi commento lì).
 * Il selettore non avrebbe più alcun target. */

/* index.php — home */
.wa-hero-img-spacer {
	visibility: hidden;
	width: 100%;
	display: block;
	max-height: 42vh;
	object-fit: cover;
}
.wa-home-hero-slide.fotocentralehome,
.wa-home-hero-slide.fotocentralehomemobile {
	min-height: 200px;
	max-height: 42vh;
	background-size: cover;
	background-position: center center;
}

.wa-home-intro {
	margin-top: 28px;
	text-align: center;
}
.wa-home-ctx {
	margin-top: 8px;
}
/* Regola `.wa-home-mobile-cta` rimossa: CTA mobile "Scopri i nostri prodotti"
 * eliminata da index.php (blocco ridondante su mobile). */
/* Sprint D — margini titoli flusso (lista, carrello, checkout, auth, conferma) */
.wa-flow-page-title {
	margin-top: 0;
	margin-bottom: 0;
}
.titolo_pagina {
	margin-bottom: 0;
}
.wa-home-semaforo {
	margin-top: 28px;
}
.wa-sfondosemaforo-inner {
	padding: 20px;
}
.wa-servizioattivo-nudge {
	margin-left: -7px;
}
.wa-home-categories {
	margin-top: 30px;
	margin-bottom: 40px;
}
.wa-cat-card-link {
	text-decoration: none;
	color: inherit;
	background: transparent;
}
/* Round 5 refactor 2026 — focus tastiera visibile e preset-aware.
 * Default browser/Bootstrap su `<a>` mostra un outline blu, ma su card con
 * bg colorato editor-controllabile (`catCard_bg`) può perdersi visivamente.
 * Soluzione minima: outline che usa `currentColor` (eredita `body_fg` =
 * preset-aware: scuro su preset chiari, chiaro su preset scuri). Niente
 * colori hardcoded, niente nuovi token. NON tocca lo stato non-focus. */
.wa-cat-card-link:focus-visible {
	outline: 2px solid;
	outline-offset: 3px;
	border-radius: 10px;
}
.wa-cat-card-img {
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	max-height: none;
	object-fit: cover;
	object-position: center;
	border-radius: 8px;
	/* Round 15 refactor 2026 — bg di "loading skeleton" governato dal token
	 * `--wa-img-placeholder-bg` (CSS Editor). Era hardcoded `#f2f2f2`. */
	background-color: var(--wa-img-placeholder-bg);
	vertical-align: middle;
}
.wa-cat-card-placeholder {
	width: 100%;
	aspect-ratio: 4 / 3;
	height: auto;
	min-height: 120px;
	/* Round 15 refactor 2026 — `var(--wa-img-placeholder-bg)` (era `#eee`). */
	background: var(--wa-img-placeholder-bg);
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.wa-cat-card-placeholder .fas {
	font-size: 2rem;
	/* Round 15 refactor 2026 — `var(--wa-img-placeholder-icon)` (era `#aaa`). */
	color: var(--wa-img-placeholder-icon);
}
/* Round 15 refactor 2026 — placeholder grafico SHARED, sostituisce un
 * `<img>` rotto via helper JS `wa-img-fallback.js`. Eredita aspect-ratio
 * + radius dalle classi originarie (es. `.wa-cat-card-img`,
 * `.fp-gallery-img`, `.wa-cart-thumb`, ecc.) per non rompere il layout
 * della card o griglia che lo contiene. La classe è puramente
 * decorativa: il testo accessibile dell'immagine viene preservato come
 * `aria-label` dal helper JS quando l'immagine originale aveva `alt`. */
.wa-image-placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--wa-img-placeholder-bg);
	border-radius: 8px;
	overflow: hidden;
}
.wa-image-placeholder .fas,
.wa-image-placeholder .bi {
	font-size: 2rem;
	color: var(--wa-img-placeholder-icon);
	line-height: 1;
}
/* Round 15 refactor 2026 — quando l'helper JS sostituisce un `<img>` con
 * `<div class="wa-image-placeholder">` mantenendo la classe originale
 * (es. `.wa-cat-card-img`, `.fp-gallery-img`), forza display flex + bg
 * placeholder anche se la classe originale aveva `display:block` o
 * background-image. */
.wa-image-placeholder.wa-cat-card-img,
.wa-image-placeholder.fp-gallery-img,
.wa-image-placeholder.wa-cart-thumb {
	display: flex;
	background-color: var(--wa-img-placeholder-bg);
	background-image: none;
}
/* Round 15 refactor 2026 — placeholder per le card prodotto in `lista.php`
 * quando il prodotto non ha immagine. Eredita aspect-ratio + sizing della
 * `.foto_prodotto` strutturale (4/3 nella griglia `.wa-lista-grid`,
 * 200px di altezza nel layout legacy). La classe segue la BEM-friendly
 * naming dei placeholder R15. */
.wa-product-img-placeholder {
	width: 100%;
	height: 200px;
	background: var(--wa-img-placeholder-bg);
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 8px;
}
.wa-lista-grid .blocco_presentazioneprodotto .wa-product-img-placeholder {
	height: auto;
	min-height: 0;
	aspect-ratio: 4 / 3;
}
.wa-product-img-placeholder .fas,
.wa-product-img-placeholder .bi {
	font-size: 2rem;
	color: var(--wa-img-placeholder-icon);
	line-height: 1;
}
.wa-cat-card-title {
	font-weight: 600;
	text-align: center;
	padding: 0.3rem 0.4rem;
	border-radius: 4px;
	line-height: 1.3;
	/* Round 5 refactor 2026 — clamp a 2 righe per nomi categoria lunghi.
	 * Senza clamp un nome lungo (es. "Pizze gourmet della tradizione napoletana")
	 * spinge la card verso il basso, sballando l'allineamento delle card adiacenti
	 * e creando una griglia "a salti". Coerente con `.wa-lista-grid` (lista
	 * prodotti, line-clamp:2 già applicato lì). Si applica anche a
	 * `.wa-cat-card-title--overlay` (eredita `display:-webkit-box` + clamp:2
	 * via la classe base, l'overlay aggiunge solo position/bg/fg). Compatibile
	 * webkit + Firefox moderno (line-clamp standard CSS dal 2022). */
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	overflow-wrap: anywhere;
}
/* Card categoria con soggetto AI + shape (storefront category_visual) */
.wa-cat-card-link--visual {
	display: block;
}
.wa-cat-card-link--visual.wa-cat-card--label-overlay {
	position: relative;
}
.wa-cat-card-visual {
	position: relative;
	width: 100%;
	aspect-ratio: 1 / 1;
	max-width: 220px;
	max-height: 220px;
	margin: 0 auto;
	overflow: hidden;
	border-radius: 8px;
	box-shadow: inset 0 0 0 1px rgba(0,0,0,0.06);
}
.wa-cat-card-visual__bg {
	position: absolute;
	inset: 0;
	border-radius: inherit;
}
.wa-cat-card-subject {
	position: absolute;
	inset: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	display: block;
	pointer-events: none;
	padding: 6%;
	box-sizing: border-box;
}
.wa-cat-card--shape-round .wa-cat-card-subject {
	padding: 14%;
}
.wa-cat-card--shape-badge .wa-cat-card-subject {
	padding: 10% 18%;
}
.wa-cat-card-placeholder--in-shape {
	position: relative;
	z-index: 2;
	width: 100%;
	height: 100%;
	min-height: 0;
	aspect-ratio: unset;
}
.wa-cat-card--shape-round .wa-cat-card-visual,
.wa-cat-card--shape-round .wa-cat-card-visual__bg {
	border-radius: 50%;
}
.wa-cat-card--shape-rounded .wa-cat-card-visual,
.wa-cat-card--shape-rounded .wa-cat-card-visual__bg {
	border-radius: 16px;
}
.wa-cat-card--shape-square .wa-cat-card-visual,
.wa-cat-card--shape-square .wa-cat-card-visual__bg {
	border-radius: 4px;
}
.wa-cat-card--shape-badge .wa-cat-card-visual,
.wa-cat-card--shape-badge .wa-cat-card-visual__bg {
	border-radius: 999px;
}
.wa-cat-card-title--overlay {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 3;
	margin: 0;
	padding: 0.35rem 0.25rem;
	background: rgba(0,0,0,0.45);
	color: #fff;
	font-size: 0.9rem;
	border-radius: 0 0 12px 12px;
}
.wa-cat-card-link--visual.wa-cat-card--shape-round .wa-cat-card-title--overlay {
	border-radius: 0 0 50% 50% / 0 0 12px 12px;
}
/* Mask variants (Visual Category Studio v5) */
.wa-cat-card--mask-pill .wa-cat-card-visual,
.wa-cat-card--mask-pill .wa-cat-card-visual__bg {
	border-radius: 999px / 50%;
}
.wa-cat-card--mask-blob .wa-cat-card-visual,
.wa-cat-card--mask-blob .wa-cat-card-visual__bg {
	border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
}
.wa-cat-card--mask-custom-radius .wa-cat-card-visual,
.wa-cat-card--mask-custom-radius .wa-cat-card-visual__bg {
	border-radius: 24px 4px 24px 4px;
}
/* ── Display mode: protagonista — subject breaks out of the shape visually ── */
.wa-cat-card--display-overflow {
	overflow: hidden;
}
.wa-cat-card--display-overflow .wa-cat-card-visual {
	overflow: visible;
	box-shadow: none;
}
.wa-cat-card--display-overflow .wa-cat-card-visual__bg {
	inset: 15%;
	box-shadow: inset 0 0 0 1px rgba(0,0,0,0.06);
}
.wa-cat-card--display-overflow .wa-cat-card-subject {
	padding: 2%;
}
.wa-cat-card--display-overflow.wa-cat-card--shape-round .wa-cat-card-visual__bg {
	inset: 12%;
}
.wa-cat-card--display-overflow.wa-cat-card--shape-round .wa-cat-card-subject {
	padding: 4%;
}
.wa-cat-card--display-overflow.wa-cat-card--shape-badge .wa-cat-card-visual__bg {
	inset: 12% 18%;
}
.wa-cat-card--display-overflow.wa-cat-card--shape-badge .wa-cat-card-subject {
	padding: 2% 8%;
}

/* ── Display mode: bare — no shape behind, subject fully visible ── */
.wa-cat-card--display-bare .wa-cat-card-visual {
	overflow: hidden;
}
.wa-cat-card--display-bare .wa-cat-card-visual__bg {
	display: none;
}
.wa-cat-card--display-bare .wa-cat-card-subject {
	padding: 0;
}

/* Shadow utility classes (if applied via class rather than inline) */
.wa-cat-card--shadow-soft .wa-cat-card-visual {
	box-shadow: 0 2px 8px rgba(0,0,0,0.10);
}
.wa-cat-card--shadow-medium .wa-cat-card-visual {
	box-shadow: 0 4px 16px rgba(0,0,0,0.18);
}
.wa-cat-card--shadow-strong .wa-cat-card-visual {
	box-shadow: 0 6px 24px rgba(0,0,0,0.28);
}
.wa-home-empty-cat {
	margin-top: 30px;
}

/* ── Empty state unificato (Round 8 refactor 2026) ─────────────────
 * Componente UI per stati "qualcosa manca / non disponibile / errore /
 * caricamento": più premium e governabile dell'`<p class="alert alert-warning">`
 * Bootstrap che usavamo prima, e tipograficamente coerente col resto della
 * web_app (titolo h2, testo body, icona FontAwesome).
 *
 * Casi d'uso oggi:
 *  - Home: nessuna categoria configurata (`.wa-home-empty-cat`)
 *  - Lista prodotti: categoria non trovata, errore API, lista vuota
 *  - Scheda prodotto: prodotto non disponibile / non trovato
 *
 * Modifier semantici (icona color-coded, no bg):
 *  - `.wa-empty-state--warning` (default per stati "manca qualcosa")
 *  - `.wa-empty-state--error` (errori API / blocchi forti)
 *  - `.wa-empty-state--info` (informazioni neutre)
 *
 * Tokens editor (gruppo `empty_states`):
 *  - `empty_bg` → `.wa-empty-state` background-color
 *  - `empty_fg` → `.wa-empty-state` color
 *  - `empty_iconFg` → `.wa-empty-state__icon` color
 *  - `empty_pad` → `.wa-empty-state` padding
 *
 * Default volutamente sobri: bg trasparente (preset-aware via `body_bg`),
 * fg ereditato (preset-aware via `body_fg`), icona `currentColor` per
 * il modifier base, override semantico per warning/error/info. ZERO
 * colori hardcoded sul wrapper, solo sull'icona modifier (colori brand
 * Bootstrap-like ma documentati). */
.wa-empty-state {
	max-width: 480px;
	margin: 1rem auto;
	padding: 2rem 1rem;
	border-radius: 12px;
	background-color: transparent;
	color: inherit;
	text-align: center;
}
.wa-empty-state__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	font-size: clamp(2rem, 6vw, 2.75rem);
	color: currentColor;
	opacity: 0.85;
	margin-bottom: 0.75rem;
	line-height: 1;
}
.wa-empty-state__icon .fas,
.wa-empty-state__icon .far,
.wa-empty-state__icon .fab,
.wa-empty-state__icon .bi {
	font-size: inherit;
	color: inherit;
}
.wa-empty-state__title {
	margin: 0 0 0.5rem;
	font-size: clamp(1.15rem, 3.5vw, 1.4rem);
	font-weight: 700;
	line-height: 1.25;
	color: inherit;
}
.wa-empty-state__text {
	margin: 0 0 1rem;
	font-size: 1rem;
	line-height: 1.5;
	color: inherit;
	opacity: 0.85;
}
.wa-empty-state__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	margin-top: 0.25rem;
	padding: 0.55rem 1.1rem;
	font-weight: 600;
	text-decoration: none !important;
}
.wa-empty-state__cta:focus-visible {
	outline: 2px solid;
	outline-offset: 3px;
}
/* Modifier semantici — solo sull'icona, niente bg. Colori scelti per essere
 * leggibili su preset chiari E scuri (luminanza intermedia: amber/red/blue
 * "muted"). Editor `empty_iconFg` può override globalmente; questi modifier
 * agiscono come "icona warning/error" anche quando l'editor non override. */
.wa-empty-state--warning .wa-empty-state__icon {
	color: var(--wa-warning-color, var(--wa-color-warning));
}
.wa-empty-state--error .wa-empty-state__icon {
	color: var(--wa-danger-color, var(--wa-color-danger));
}
.wa-empty-state--info .wa-empty-state__icon {
	color: var(--wa-accent-color, var(--wa-color-accent));
}
/* `--loading` riservato per Round successivi (spinner / pulse). Stub minimo
 * per non emettere selettori vuoti: opacity transition. */
.wa-empty-state--loading .wa-empty-state__icon {
	animation: wa-empty-state-pulse 1.4s ease-in-out infinite;
}
@keyframes wa-empty-state-pulse {
	0%, 100% { opacity: 0.55; }
	50%      { opacity: 1; }
}
@media (max-width: 575.98px) {
	.wa-empty-state {
		padding: 1.5rem 1rem;
	}
}

/* lista.php */
.wa-lista-container {
	margin-top: 1.5rem;
}
/* Card lista prodotti — layout uniforme ("mobile-first pulito").
 *
 * Obiettivo: niente più card con altezze diverse, niente CTA che cadono a quote
 * differenti, niente titoli che spingono in modo incoerente le card vicine.
 *
 * Struttura:
 *  - la cella della griglia CSS (`.wa-lista-grid` = `display:grid`) stretcha in
 *    altezza i figli diretti: la card diventa un flex-column a altezza piena;
 *  - l'immagine mantiene aspect-ratio 4:3 (stessa area visiva su ogni card);
 *  - il nome prodotto è clampato a 2 righe con min-height coerente, così anche
 *    titoli brevi ("Amatriciana") e lunghi ("Cannelloni di carne fatti in casa")
 *    riservano lo stesso spazio verticale;
 *  - il prezzo ha una posizione stabile;
 *  - la CTA ("Aggiungi al carrello" o "Dettaglio") viene spinta in fondo con
 *    `margin-top:auto`, così a parità di colonne resta sempre allineata.
 *
 * Regola di prodotto complementare: su mobile il default è 1 colonna (baseline
 * `prodListGrid_colsMobile = '1'`), ma queste regole di uniformità valgono anche
 * se il tenant forza 2 colonne via editor: in quel caso le due card affiancate
 * restano alte uguali e con CTA allineate. */
.wa-lista-grid .blocco_presentazioneprodotto {
	display: flex;
	flex-direction: column;
	width: 100%;
	min-width: 0;
	height: 100%;
	margin-bottom: 0;
}
.wa-lista-grid .blocco_presentazioneprodotto .foto_prodotto {
	height: auto;
	min-height: 0;
	aspect-ratio: 4 / 3;
	background-size: cover;
	background-position: center center;
	width: 100%;
}
.wa-lista-grid .blocco_presentazioneprodotto .nome_prodotto {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.6em;
	line-height: 1.3;
}
/* CTA (link "Dettaglio" o form "Aggiungi al carrello") sempre a fondo card.
 * Selettori diretti perché la card ha sia `<a>` che `<form>` come ultimo figlio
 * a seconda che il prodotto sia personalizzabile o meno (vedi lista.php). */
.wa-lista-grid .blocco_presentazioneprodotto > .btn-prodotti,
.wa-lista-grid .blocco_presentazioneprodotto > form {
	margin-top: auto;
}
.wa-inherit-color {
	color: inherit;
}
.wa-form-inline {
	display: inline;
}
/* Round 6 refactor 2026 — focus tastiera visibile sulle card prodotto.
 * Stesso pattern di Round 5 sulle card categoria: outline preset-aware
 * via `currentColor` (eredita `body_fg` / `prodName_color`), zero colori
 * hardcoded, zero nuovi token. Solo `:focus-visible` (focus tastiera),
 * niente outline persistente al click mouse. Coperti i due possibili
 * attivatori della card lista: il link wrapper nome+immagine
 * (`.wa-inherit-color`) e la CTA finale (link "Dettaglio" o button
 * "Aggiungi al carrello", entrambi con classe `.btn-prodotti`). */
.wa-lista-grid .wa-inherit-color:focus-visible {
	outline: 2px solid;
	outline-offset: 3px;
	border-radius: 8px;
}
.wa-lista-grid .btn-prodotti:focus-visible {
	outline: 2px solid;
	outline-offset: 3px;
}

/* carrello.php */
.wa-carrello-page {
	margin-top: 20px;
	margin-bottom: 40px;
}
.wa-cart-empty-block {
	margin-top: 40px;
	margin-bottom: 40px;
}
.wa-cart-empty-text {
	font-size: 1.1rem;
	color: var(--wa-color-muted);
}
.wa-cart-empty-btn-wrap {
	display: inline-block;
	margin-top: 10px;
}
.wa-cart-table-wrap {
	margin-top: 10px;
}
.wa-cart-unit-price {
	display: block;
}
.wa-carrello-page a#wa-cta-ordine {
	display: inline-block;
	box-sizing: border-box;
	max-width: 100%;
}
.wa-cart-thumb {
	width: 104px;
	height: 80px;
	max-width: 104px;
	max-height: 80px;
	object-fit: cover;
	object-position: center;
	display: block;
	margin-bottom: 8px;
	border-radius: 4px;
	/* Round 15 refactor 2026 — bg di "loading skeleton" governato da
	 * `--wa-img-placeholder-bg` (era hardcoded `#f0f0f0`). Il delta cromatico
	 * tra `#f0f0f0` (240) e `#eee` (238) è ~1% di luminanza, non visibile. */
	background-color: var(--wa-img-placeholder-bg);
}
/* Round 15 refactor 2026 — quando la thumb cart viene sostituita dal helper
 * JS con un `<div class="wa-image-placeholder wa-cart-thumb">`, mantiene
 * dimensioni fisse 104x80 e radius della thumb originale. */
.wa-image-placeholder.wa-cart-thumb {
	width: 104px;
	height: 80px;
	border-radius: 4px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 8px;
}
.wa-image-placeholder.wa-cart-thumb .fas {
	font-size: 1.5rem;
}
.wa-cart-note-line {
	color: var(--wa-color-muted);
}
.wa-cart-row-actions {
	margin-top: 10px;
}
.wa-menuapri-subtle {
	text-decoration: none;
	font-size: 13px;
}
.wa-cart-action-sep {
	color: var(--wa-color-border);
	margin: 0 6px;
}
.wa-pen-ico {
	font-size: 11px;
}
.wa-note-simple-wrap {
	margin-top: 6px;
}
.wa-note-editor {
	display: none;
	margin-top: 4px;
	max-width: 280px;
}
.wa-note-editor.wa-note-editor--open {
	display: block;
}
.wa-note-save-btn {
	font-size: 12px;
}
.wa-prezzosopra-cell {
	vertical-align: top;
	padding-top: 20px;
	white-space: nowrap;
}
.wa-qty-wrap {
	margin-top: 12px;
}
.wa-qty-plus,
.wa-btn-plus {
	cursor: pointer;
	margin-bottom: 4px;
}
.wa-qty-minus {
	cursor: pointer;
	margin-top: 4px;
}
.wa-cart-cestino {
	margin-top: 4px;
	padding: 8px 12px;
	border-radius: 4px;
	cursor: pointer;
	font-size: 14px;
}
.wa-datiquantitasotto-spaced {
	margin-top: 8px;
}
.wa-delivery-blurb {
	margin-top: 10px;
	text-align: center;
}
.wa-cart-totale-block {
	margin-top: 30px;
}
.wa-cta-block {
	margin-top: 30px;
	padding: 0 12px;
	text-align: center;
}
.wa-minimo-wrap {
	margin-top: 10px;
	text-align: center;
}
.wa-svuota-wrap {
	margin-top: 20px;
	text-align: center;
}
.wa-svuota-form {
	display: inline;
}
.wa-btn-svuota-carrello {
	/* Round 17b refactor 2026 — token globali R16 (era `#999` / `#ccc`).
	 * Il bottone "Svuota carrello" è un'azione "danger leggera" — usa
	 * `muted` per attenuare visivamente (non è il main CTA). Schema editor:
	 * `cart_clearBg/Fg/Border/Rad/Pad/FontSize` continua a vincere per
	 * cascata (gruppo `cart` 33 controlli). */
	color: var(--wa-color-muted);
	border: 1px solid var(--wa-color-border);
	font-size: 13px;
}
/* Round 11 refactor 2026 — focus tastiera preset-aware sui controlli del
 * carrello. Stesso pattern Round 5/6/7/8/9: outline 2px `currentColor` →
 * eredita `cart_*Fg` editor / `body_fg`, preset-aware automatico. Solo
 * `:focus-visible` (focus tastiera), niente outline al click mouse.
 * Coperti: bottoni quantità +/- (ora `<button>`, prima `<div>` non
 * raggiungibili via Tab — fix accessibility critico Round 11), bottone
 * cestino, link "Modifica" / "Aggiungi/Modifica nota", bottone svuota.
 * NIENTE colori hardcoded, NIENTE nuovi token. */
.wa-carrello-page .wa-btn-plus:focus-visible,
.wa-carrello-page .wa-btn-minus:focus-visible {
	outline: 2px solid;
	outline-offset: 3px;
}
.wa-carrello-page .wa-cart-cestino:focus-visible,
.wa-carrello-page .wa-btn-svuota-carrello:focus-visible {
	outline: 2px solid;
	outline-offset: 3px;
	border-radius: 4px;
}
.wa-carrello-page .wa-cart-modifica:focus-visible,
.wa-carrello-page .wa-note-toggle:focus-visible,
.wa-carrello-page .wa-note-save:focus-visible {
	outline: 2px solid;
	outline-offset: 2px;
	border-radius: 4px;
}
.wa-carrello-page .quantitaform:focus-visible {
	outline: 2px solid;
	outline-offset: 2px;
}

/* R12-bis (2026-05-16) — Carrello mobile: card righe, stepper quantità, riepilogo compatto.
 * Markup: web_app/carrello.php (.wa-cart-card, .wa-cart-list). Desktop >=768px invariato
 * come griglia a due colonne; mobile card con gerarchia foto → nome → extra → prezzo riga. */
.wa-carrello-page .wa-cart-list {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	margin-top: 0.5rem;
}
.wa-carrello-page .wa-cart-card {
	margin-bottom: 0;
}
.wa-carrello-page .wa-prezzosopra-cell {
	padding-top: 0;
	vertical-align: unset;
	white-space: normal;
}
.wa-carrello-page .wa-cart-card__top {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 0.35rem 0.75rem;
	align-items: start;
}
.wa-carrello-page .wa-cart-card__lead {
	display: flex;
	gap: 0.75rem;
	align-items: flex-start;
	min-width: 0;
	grid-column: 1;
}
.wa-carrello-page .wa-cart-card--no-media .wa-cart-card__lead {
	display: block;
}
.wa-carrello-page .wa-cart-card__media {
	flex-shrink: 0;
}
.wa-carrello-page .wa-cart-card__info {
	min-width: 0;
	flex: 1;
}
.wa-carrello-page .wa-cart-card__price {
	grid-column: 2;
	grid-row: 1;
	text-align: right;
	align-self: start;
	padding-top: 0.1rem;
}
.wa-carrello-page .wa-cart-card__price .wa-line-total {
	font-size: 1.125rem;
	line-height: 1.2;
	letter-spacing: -0.02em;
	white-space: nowrap;
}
.wa-carrello-page .wa-cart-card__unit.wa-cart-unit-price {
	display: block;
	font-size: 0.75rem;
	font-weight: 500;
	line-height: 1.25;
	color: var(--wa-color-muted);
	margin-top: 0.25rem;
}
.wa-carrello-page .wa-cart-card__extras {
	margin: 0.2rem 0 0;
	font-size: 0.8125rem;
	line-height: 1.35;
}
.wa-carrello-page .wa-cart-card__extras--remove {
	margin-top: 0.15rem;
}
.wa-carrello-page .wa-cart-note-line {
	margin: 0.25rem 0 0;
	color: var(--wa-color-muted);
}
.wa-carrello-page .wa-cart-qty-caption-legacy {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
.wa-carrello-page .wa-cart-card__bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	margin-top: 0.75rem;
	padding-top: 0.75rem;
	border-top: 1px solid var(--wa-color-border);
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
}
.wa-carrello-page .wa-cart-card__bottom .wa-qty-wrap {
	margin-top: 0;
	display: flex;
	align-items: center;
	gap: 0.5rem;
}
.wa-carrello-page .wa-qty-form {
	display: inline-flex;
	align-items: stretch;
	border: 1px solid var(--wa-color-border);
	border-radius: var(--wa-radius-sm);
	overflow: hidden;
	background: var(--wa-color-surface);
}
.wa-carrello-page .wa-btn-plus,
.wa-carrello-page .wa-btn-minus {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	min-width: 2.75rem;
	min-height: 2.75rem;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: var(--wa-color-surface-soft);
	color: var(--wa-color-accent);
	cursor: pointer;
}
.wa-carrello-page .wa-btn-plus .fa-plus,
.wa-carrello-page .wa-btn-minus .fa-minus {
	background: transparent;
	color: inherit;
	padding: 0;
	margin: 0;
	border-radius: 0;
	font-size: 0.875rem;
	line-height: 1;
}
.wa-carrello-page .wa-btn-plus:active,
.wa-carrello-page .wa-btn-minus:active {
	transform: scale(0.92);
}
.wa-carrello-page .quantitaform {
	width: 2.75rem;
	min-width: 2.75rem;
	max-width: 2.75rem;
	height: 2.75rem;
	margin: 0;
	padding: 0;
	font-size: 1rem;
	font-weight: 700;
	line-height: 2.75rem;
	border: 0;
	border-left: 1px solid var(--wa-color-border);
	border-right: 1px solid var(--wa-color-border);
	border-radius: 0;
	background: var(--wa-color-surface);
	-moz-appearance: textfield;
	appearance: textfield;
}
.wa-carrello-page .quantitaform::-webkit-outer-spin-button,
.wa-carrello-page .quantitaform::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
.wa-carrello-page .wa-cart-cestino {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	min-width: 2.75rem;
	height: 2.75rem;
	margin: 0;
	padding: 0;
	border: 1px solid var(--wa-color-border);
	border-radius: var(--wa-radius-sm);
	background: transparent;
	color: var(--wa-color-muted);
	font-size: 0.95rem;
}
.wa-carrello-page .wa-cart-cestino:active {
	color: var(--wa-color-danger);
	border-color: currentColor;
	background: var(--wa-color-surface-soft);
	transform: scale(0.96);
}
.wa-carrello-page .wa-cart-summary {
	margin-top: 1rem;
}
@media (max-width: 767.98px) {
	.wa-carrello-page {
		margin-bottom: 1.5rem;
	}
	.wa-carrello-page .wa-cart-table-wrap {
		margin-top: 0.35rem;
	}
	.wa-carrello-page .wa-cart-card,
	.wa-carrello-page .wa-cart-row {
		background: var(--wa-cart-row-bg, var(--wa-cart-card-bg, var(--wa-color-card, var(--wa-color-surface-strong, var(--wa-color-surface)))));
		border: 1px solid var(--wa-cart-card-border, var(--wa-color-border));
		border-radius: var(--wa-cart-card-radius, var(--wa-radius-md));
		padding: var(--wa-cart-card-padding, 0.875rem);
		box-shadow: var(--wa-cart-card-shadow, var(--wa-shadow-sm));
	}
	.wa-carrello-page .wa-cart-thumb,
	.wa-carrello-page .wa-image-placeholder.wa-cart-thumb {
		width: 4rem;
		height: 4rem;
		max-width: 4rem;
		max-height: 4rem;
		margin-bottom: 0;
		border-radius: var(--wa-radius-sm);
	}
	.wa-carrello-page .nomeprodottocarrello {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		overflow: hidden;
		font-family: var(--wa-font-body);
		font-size: 0.9375rem;
		font-weight: 700;
		line-height: 1.25;
		letter-spacing: 0;
		text-transform: none;
		margin-top: 0;
	}
	.wa-carrello-page .wa-cart-row-actions {
		margin-top: 0.5rem;
	}
	.wa-carrello-page .wa-cart-summary {
		padding: 1rem 1.125rem;
		background: var(--wa-cart-total-bg, var(--wa-color-card, var(--wa-color-surface-strong, var(--wa-color-surface))));
		border: 1px solid var(--wa-cart-total-border, var(--wa-color-border));
		border-radius: var(--wa-cart-card-radius, var(--wa-radius-md));
		box-shadow: var(--wa-cart-card-shadow, var(--wa-shadow-sm));
	}
	.wa-carrello-page .wa-cart-totale-block {
		margin-top: 0;
	}
	.wa-carrello-page .wa-cart-totale-block .totale {
		display: block;
		margin: 0;
		font-size: 0.8125rem;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.04em;
		color: var(--wa-color-muted);
		line-height: 1.3;
	}
	.wa-carrello-page .wa-cart-totale-block .totale strong {
		font-weight: inherit;
		color: inherit;
	}
	.wa-carrello-page .wa-cart-totale-block .totalecifre {
		display: block;
		margin-top: 0.15rem;
		font-size: 1.75rem;
		letter-spacing: -0.02em;
		line-height: 1.15;
	}
	.wa-carrello-page .wa-delivery-blurb {
		margin-top: 0.65rem;
		font-size: 0.8125rem;
	}
	.wa-carrello-page .wa-cta-block {
		margin-top: 0.875rem;
		padding: 0;
	}
	.wa-carrello-page a#wa-cta-ordine {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		min-height: 3rem;
		padding: 0.8rem 1.25rem;
		font-size: 1rem;
		font-weight: 700;
		border-radius: var(--wa-radius-md);
	}
	.wa-carrello-page .wa-minimo-wrap {
		margin-top: 0.5rem;
	}
	.wa-carrello-page .wa-svuota-wrap {
		margin-top: 0.75rem;
	}
}
@media (min-width: 768px) {
	.wa-carrello-page .wa-cart-list {
		gap: 0;
		border-top: 1px solid var(--wa-color-border);
	}
	.wa-carrello-page .wa-cart-card {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		align-items: start;
		gap: 1.25rem;
		padding: 1.25rem 1rem;
		border-bottom: 1px solid var(--wa-color-border);
		background: transparent;
		box-shadow: none;
		border-radius: 0;
		border-left: 0;
		border-right: 0;
		border-top: 0;
	}
	.wa-carrello-page .wa-cart-card__top {
		display: flex;
		gap: 1rem;
		grid-column: 1;
		align-items: flex-start;
	}
	.wa-carrello-page .wa-cart-card__price {
		padding-top: 0;
	}
	.wa-carrello-page .wa-cart-card__bottom {
		grid-column: 2;
		grid-row: 1;
		flex-direction: column;
		align-items: flex-end;
		margin-top: 0;
		padding-top: 0;
		border-top: 0;
		gap: 0.65rem;
	}
	.wa-carrello-page .wa-cart-thumb,
	.wa-carrello-page .wa-image-placeholder.wa-cart-thumb {
		width: 6.5rem;
		height: 5rem;
		max-width: 6.5rem;
		max-height: 5rem;
	}
	.wa-carrello-page .wa-cart-summary {
		max-width: 28rem;
		margin-left: auto;
		margin-right: auto;
	}
}

/* checkout.php, ordine-confermato.php */
.wa-checkout-page {
	margin-top: 20px;
	margin-bottom: 40px;
}
.wa-checkout-subtitle {
	font-size: 14px;
	color: var(--wa-color-muted);
	margin-bottom: 0.5rem;
}
.wa-checkout-subtitle--stepper-hint {
	margin-bottom: 0.35rem;
}
.wa-checkout-subtitle-phase {
	color: var(--wa-color-primary);
	font-weight: 600;
}

/* ── Checkout: progress navigator (stepper) ── */
.wa-checkout-stepper {
	margin: 12px 0 20px;
	padding: 0 4px;
}
.wa-stepper__scroll {
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
	padding-bottom: 6px;
	margin-bottom: 2px;
	scrollbar-width: thin;
}
.wa-stepper__row {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: center;
	min-width: min(100%, 520px);
	margin: 0 auto;
	gap: 0;
}
.wa-stepper__seg {
	flex: 1 1 0;
	min-width: 72px;
	max-width: 120px;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}
.wa-stepper__rail {
	flex: 0 0 12px;
	width: 12px;
	min-width: 8px;
	height: 3px;
	background: var(--wa-color-border);
	border-radius: 2px;
	align-self: flex-start;
	margin-top: 19px;
	transition: background 0.2s ease;
}
@media (min-width: 480px) {
	.wa-stepper__rail {
		flex: 1 1 8px;
		min-width: 12px;
		max-width: 48px;
	}
}
.wa-stepper__rail--done {
	background: var(--wa-color-success);
}
.wa-stepper__form {
	margin: 0;
	padding: 0;
	width: 100%;
	max-width: 120px;
}
.wa-stepper__hit {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	width: 100%;
	padding: 4px 2px 8px;
	margin: 0;
	background: none;
	border: none;
	cursor: default;
	font: inherit;
	color: inherit;
	text-align: center;
	box-sizing: border-box;
}
.wa-stepper__hit--done {
	cursor: pointer;
	border-radius: 10px;
	transition: background 0.15s ease, transform 0.12s ease;
}
.wa-stepper__hit--done:focus-visible {
	background: var(--wa-color-success-bg);
	outline: none;
}
.wa-stepper__hit--done:active {
	background: var(--wa-color-success-bg);
}
.wa-stepper__hit--done:active {
	transform: scale(0.98);
}
.wa-stepper__hit--active .wa-stepper__label {
	color: var(--wa-color-primary);
	font-weight: 800;
}
.wa-stepper__hit--future {
	opacity: 0.55;
	cursor: not-allowed;
}
.wa-stepper__circle {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	font-family: 'Montserrat', sans-serif;
	font-size: 15px;
	font-weight: 800;
	line-height: 1;
	box-sizing: border-box;
	flex-shrink: 0;
	border: 3px solid var(--wa-color-primary);
	background: #fff;
	color: var(--wa-color-primary);
	box-shadow: 0 2px 8px rgba(31, 18, 11, 0.08);
}
.wa-stepper__hit--done .wa-stepper__circle {
	border-color: var(--wa-color-success);
	background: var(--wa-color-success);
	color: var(--wa-color-inverse);
	box-shadow: var(--wa-shadow-sm);
}
.wa-stepper__hit--active .wa-stepper__circle {
	background: var(--wa-color-primary);
	color: #fff;
	border-color: var(--wa-color-primary);
	box-shadow: 0 0 0 4px rgba(31, 18, 11, 0.15);
}
.wa-stepper__circle--muted {
	/* Round 17b refactor 2026 — pallino step "futuro" (non ancora raggiunto).
	 * Border + color = muted, background = surface-soft. Lo stato è
	 * semanticamente "disabilitato" / "in attesa", quindi sfumature soft del
	 * tema. Era `#cfc8c2`/`#9a918a`/`#faf9f8` hardcoded. */
	border-color: var(--wa-color-border);
	color: var(--wa-color-muted);
	background: var(--wa-color-surface-soft);
	box-shadow: none;
}
.wa-stepper__check {
	font-size: 18px;
	font-weight: 700;
	line-height: 1;
}
.wa-stepper__label {
	/* Round 17b refactor 2026 — `var(--wa-font-body)` (era 'Montserrat'
	 * literal) + `var(--wa-color-muted)` (era `#5c534c` brown muted).
	 * Schema editor: `ck_stepperLabelFg` continua a vincere per cascata. */
	font-family: var(--wa-font-body);
	font-size: 11px;
	font-weight: 600;
	line-height: 1.25;
	color: var(--wa-color-muted);
	word-break: break-word;
	hyphens: auto;
}
@media (min-width: 576px) {
	.wa-stepper__label {
		font-size: 12px;
	}
	.wa-stepper__circle {
		width: 42px;
		height: 42px;
		font-size: 16px;
	}
	.wa-stepper__seg {
		min-width: 80px;
		max-width: 130px;
	}
}
.wa-stepper__sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
.wa-checkout-toolbar {
	margin-bottom: 1rem;
}
.wa-checkout-back-link {
	font-size: 14px;
	color: var(--wa-color-muted);
	text-decoration: underline;
}
/* Round 12 refactor 2026 — focus tastiera preset-aware sui controlli checkout
 * non già coperti dallo schema editor (`ck_*FocusRing` esistenti agiscono su
 * input/select/textarea). Questo blocco aggiunge outline 2px `currentColor`
 * (preset-aware via `body_fg`/`ck_*Fg`) per:
 *  - scelte "tempo" (toggle ASAP/scheduled) `.wa-checkout-time-option`
 *  - card alternative Lucy `.wa-lucy-alt-card` (slot proposti)
 *  - stepper hit (navigazione step) — solo hit non `--done` (quello ha già
 *    il proprio `:focus-visible`)
 *  - back link `.wa-checkout-back-link`
 *  - bottoni voice/geo `.wa-checkout-voice-btn` / `.wa-checkout-geo-btn`
 *  - chip select consegna `.wa-checkout-cta-delivery` / `-pickup`
 * NIENTE colori hardcoded, NIENTE nuovi token — solo accessibilità additiva.
 * Lucy core, ASAP logic, API endpoints: invariati. */
.wa-checkout-page .wa-checkout-time-option:focus-visible,
.wa-checkout-page .wa-checkout-service-card:focus-visible,
.wa-checkout-page .wa-lucy-alt-card:focus-visible {
	outline: 2px solid;
	outline-offset: 3px;
	border-radius: 8px;
}
.wa-checkout-page .wa-stepper__hit:focus-visible {
	outline: 2px solid;
	outline-offset: 4px;
	border-radius: 50%;
}
.wa-checkout-page .wa-checkout-back-link:focus-visible {
	outline: 2px solid;
	outline-offset: 3px;
	border-radius: 4px;
}
.wa-checkout-page .wa-checkout-voice-btn:focus-visible,
.wa-checkout-page .wa-checkout-geo-btn:focus-visible {
	outline: 2px solid;
	outline-offset: 2px;
	border-radius: 6px;
}
.wa-checkout-page .wa-checkout-cta-delivery:focus-visible,
.wa-checkout-page .wa-checkout-cta-pickup:focus-visible {
	outline: 2px solid;
	outline-offset: 3px;
}
.wa-checkout-inner {
	max-width: 640px;
	margin-left: auto;
	margin-right: auto;
	padding: var(--wa-checkout-inner-padding-y, 1.25rem) var(--wa-checkout-inner-padding-x, clamp(1rem, 4vw, 1.35rem));
}
.wa-checkout-msg {
	border-radius: var(--wa-radius-sm);
	padding: 12px 16px;
	margin: 12px auto;
	max-width: 520px;
	font-size: 14px;
	line-height: var(--wa-line-relaxed);
}
.wa-checkout-msg--err {
	color: var(--wa-color-danger-fg);
	background: var(--wa-color-danger-bg);
	border: 1px solid var(--wa-color-danger);
}
.wa-checkout-msg--warn {
	color: var(--wa-color-warning-fg);
	background: var(--wa-color-warning-bg);
	border: 1px solid var(--wa-color-warning);
}
.wa-checkout-msg--rate {
	color: var(--wa-color-warning-fg);
	background: var(--wa-color-warning-bg);
	border: 1px solid var(--wa-color-warning);
}
.wa-checkout-msg--info {
	color: var(--wa-color-muted);
	background: var(--wa-color-surface-soft);
	border: 1px solid var(--wa-color-border);
}
.wa-checkout-msg--ok {
	color: var(--wa-color-success-fg);
	background: var(--wa-color-success-bg);
	border: 1px solid var(--wa-color-success);
	text-align: center;
	font-weight: 600;
}
.wa-checkout-field {
	margin-bottom: 1rem;
}
.wa-checkout-label {
	display: block;
	font-weight: 700;
	margin-bottom: 6px;
	color: var(--wa-color-text);
	font-size: 14px;
}
.wa-checkout-input {
	border-radius: 4px;
}
.wa-checkout-radio-row {
	margin-top: 8px;
}
.wa-checkout-radio-label {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	cursor: pointer;
	font-size: 15px;
	color: var(--wa-color-text);
	margin: 0;
	font-weight: 400;
}
.wa-checkout-radio-label input {
	margin-top: 4px;
	flex-shrink: 0;
}
.wa-checkout-back-form {
	text-align: center;
	margin-top: 8px;
	margin-bottom: 24px;
}
.wa-checkout-back-btn {
	background: none;
	border: none;
	color: var(--wa-secondary-fg);
	text-decoration: underline;
	font-size: 14px;
	cursor: pointer;
	padding: 6px;
}
.wa-checkout-back-btn:active {
	opacity: 0.85;
}
.wa-checkout-riepilogo {
	background: var(--wa-card-bg);
	border: 1px solid var(--wa-card-border);
	border-radius: var(--wa-card-radius);
	padding: 16px 18px;
	margin: 20px auto;
	max-width: 520px;
	font-size: 14px;
	color: var(--wa-color-text);
	box-shadow: var(--wa-shadow-sm);
}
/* Sprint C — recap conferma ordine (stesso elemento: .wa-checkout-riepilogo.wa-confirm-recap) */
.wa-checkout-riepilogo.wa-confirm-recap {
	box-shadow: none;
}
.wa-checkout-riepilogo-line {
	margin-bottom: 10px;
	line-height: var(--wa-line-normal);
}
.wa-checkout-riepilogo-line:last-child {
	margin-bottom: 0;
}
.wa-checkout-k {
	display: inline-block;
	min-width: 7.5rem;
	font-weight: 700;
	color: var(--wa-color-text);
	margin-right: 6px;
}
.wa-checkout-totale-block .totalecifre {
	margin-top: 8px;
	display: inline-block;
}
.wa-checkout-totale-note {
	font-size: 12px;
	color: var(--wa-color-muted);
	margin-top: 8px;
	margin-bottom: 0;
}
.wa-confirm-page .wa-confirm-lead {
	max-width: 560px;
}
.wa-confirm-numbers {
	text-align: center;
	margin: 20px auto;
	max-width: 520px;
}
.wa-confirm-numbers-row {
	margin-bottom: 10px;
	font-size: 16px;
}
.wa-confirm-order-id {
	font-size: 28px;
	font-weight: 700;
	color: var(--wa-confirm-order-id-fg, var(--wa-color-text));
	display: block;
	margin-top: 4px;
	font-family: var(--wa-font-heading);
}
.wa-confirm-recap .wa-confirm-righe-title {
	font-weight: 700;
	margin-top: 14px;
	margin-bottom: 6px;
	color: var(--wa-color-text);
}
.wa-confirm-righe-list {
	list-style: none;
	padding-left: 0;
	margin: 0;
	font-size: 14px;
}
.wa-confirm-righe-list li {
	padding: 4px 0;
	border-bottom: 1px solid var(--wa-color-border);
}
.wa-confirm-righe-list li:last-child {
	border-bottom: none;
}
.wa-confirm-riga-q {
	font-weight: 700;
	color: var(--wa-color-muted);
	margin-right: 6px;
}
.wa-confirm-cta {
	margin-top: 24px;
	margin-bottom: 30px;
}
.wa-confirm-btn-menu {
	display: inline-block;
	width: 100%;
	max-width: 100%;
	padding: 14px 20px;
	font-size: 18px;
	border-radius: 10px;
	margin-bottom: 20px;
}

/* web_app — flusso carrello/checkout/conferma allineato al sito legacy (titolo, CTA a colonna, totale) */
.wa-carrello-page > .wa-flow-page-title.iltuo,
.wa-checkout-page > .wa-flow-page-title.iltuo,
.wa-confirm-page > .wa-flow-page-title.iltuo {
	margin-top: 10px;
}
.wa-flow-cta-block .wa-flow-cta-col .bottoneavanti {
	margin-bottom: 27px;
}
.wa-flow-totale-block .totale strong {
	font-weight: 700;
}
.wa-checkout-page .wa-checkout-inner .wa-checkout-input,
.wa-checkout-page .wa-checkout-inner select.wa-checkout-input,
.wa-checkout-page .wa-checkout-inner textarea.wa-checkout-input,
.wa-checkout-lucy-verify-form .wa-checkout-input {
	border: 2px solid var(--wa-color-border);
	border-radius: var(--wa-radius-sm);
	font-family: var(--wa-font-body);
	font-size: 15px;
	padding: 10px 14px;
	background: var(--wa-color-surface);
	color: var(--wa-color-text);
	box-shadow: none;
}
.wa-checkout-page .wa-checkout-inner .wa-checkout-input:focus,
.wa-checkout-lucy-verify-form .wa-checkout-input:focus {
	border-color: var(--wa-color-primary);
	outline: none;
	box-shadow: 0 0 0 2px var(--wa-color-primary-soft);
}
.wa-checkout-lucy-verify-form .wa-checkout-label {
	color: var(--wa-color-text);
}
.wa-checkout-lucy-verify-form .wa-checkout-hint,
.wa-checkout-lucy-verify-form .wa-slots-hint-optional {
	color: var(--wa-color-muted);
}
.wa-checkout-servizio-card {
	border: 2px solid var(--wa-card-border);
	border-radius: var(--wa-card-radius);
	padding: 14px 16px;
	margin-bottom: 1rem;
	background: var(--wa-card-bg);
}
.wa-checkout-servizio-stack .wa-checkout-servizio-form + .wa-checkout-servizio-form {
	margin-top: 14px;
}
.wa-checkout-servizio-heading {
	margin-bottom: 18px;
}
.wa-checkout-cta-choice {
	white-space: normal;
	line-height: 1.25;
	padding-left: 24px;
	padding-right: 24px;
}
.wa-checkout-hint {
	margin-top: 8px;
	margin-bottom: 0;
	font-size: 13px;
	line-height: 1.55;
}
.wa-checkout-slot-verdict {
	text-align: left;
	max-width: 640px;
	margin-left: auto;
	margin-right: auto;
}
.wa-checkout-slot-verdict strong {
	color: var(--wa-color-text);
}
.wa-checkout-alternative-stack .wa-flow-cta-col {
	margin-bottom: 14px;
}
.wa-checkout-slot-retry-wrap {
	margin-top: 8px;
	margin-bottom: 8px;
}
/* Checkout web_app — verifica orario (classi wa-lucy-* = prefisso tecnico) */
.wa-lucy-intro,
.wa-slots-hint-optional {
	text-align: center;
	max-width: 560px;
	margin-left: auto;
	margin-right: auto;
}
.wa-slots-hint-times {
	font-weight: 600;
	color: var(--wa-color-accent);
}
.wa-lucy-verdict-sub {
	display: block;
	margin-top: 10px;
	font-size: 14px;
	line-height: 1.45;
	color: #444;
}
.wa-lucy-alt-btn {
	font-weight: 700;
	letter-spacing: 0.02em;
}
.wa-lucy-verify-btn {
	font-weight: 700;
	letter-spacing: 0.03em;
}
.wa-checkout-time-input {
	min-height: 48px;
}
.wa-checkout-delivery-block {
	margin-top: 8px;
	margin-bottom: 8px;
}
.wa-co-delivery-dynamic-panel {
	margin-top: 14px;
}
.wa-checkout-delivery-checking {
	text-align: center;
	font-family: var(--wa-font-body);
	font-size: 14px;
	font-weight: 600;
	color: var(--wa-color-muted);
	margin: 12px 0 0 0;
	padding: 10px 14px;
	background: var(--wa-color-surface-soft);
	border: 1px solid var(--wa-color-border);
	border-radius: var(--wa-radius-md);
}
.wa-checkout-delivery-verdict__kicker {
	display: block;
	font-weight: 800;
	font-size: 15px;
	margin-bottom: 6px;
	color: inherit;
}
.wa-checkout-delivery-actions--stack {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-top: 18px;
}
.wa-checkout-cta-delivery {
	width: 100%;
	max-width: 100%;
	border-radius: 10px;
	font-family: 'Montserrat', sans-serif;
	font-weight: 800;
	letter-spacing: 0.02em;
	padding: 14px 20px;
	background: var(--wa-cta-delivery-bg);
	color: var(--wa-cta-delivery-color);
	border: 2px solid var(--wa-cta-delivery-border);
}
.wa-checkout-cta-delivery:disabled {
	opacity: 0.52;
	cursor: not-allowed;
}
.wa-checkout-pickup-cta-form {
	margin-top: 14px;
	margin-bottom: 8px;
}
.wa-checkout-cta-pickup {
	width: 100%;
	max-width: 100%;
	border-radius: 10px;
	font-family: 'Montserrat', sans-serif;
	font-weight: 800;
	letter-spacing: 0.02em;
	padding: 14px 20px;
	background: var(--wa-cta-pickup-bg);
	color: var(--wa-cta-pickup-color);
	border: 2px solid var(--wa-cta-pickup-border);
}
.wa-checkout-cta-pickup:active:not(:disabled) {
	transform: scale(0.98);
}
.wa-checkout-delivery-title {
	font-family: var(--wa-font-heading);
	font-size: 1.35rem;
	font-weight: 700;
	color: var(--wa-color-text);
	text-align: center;
	margin: 0 0 10px 0;
	line-height: var(--wa-line-tight);
}
.wa-checkout-delivery-lead {
	text-align: center;
	font-size: 15px;
	line-height: var(--wa-line-relaxed);
	margin: 0 auto 1.25rem;
	max-width: 36rem;
	color: var(--wa-color-muted);
}
.wa-checkout-delivery-lead strong {
	font-weight: 700;
	color: var(--wa-color-text);
}
.wa-checkout-delivery-form .wa-checkout-delivery-actions {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-top: 20px;
}
.wa-checkout-delivery-form .wa-checkout-delivery-actions .wa-checkout-cta-step {
	width: 100%;
	max-width: 100%;
	margin-bottom: 0;
}
.wa-checkout-delivery-tools {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 10px;
}
/* Round 17 refactor 2026 — Icon buttons checkout (microfono voce, geo).
 * Voice = variante "filled" (sfondo pieno), Geo = variante "outline"
 * (sfondo trasparente, bordo + testo color accent). Tutti i colori
 * vengono dai token globali `--wa-icon-btn-*` definiti in `:root`
 * (gruppo CSS Editor `icon_buttons`, 6 field). Default sincronizzati
 * al pre-R17 (`#6b4a3b` = `--wa-color-accent`). Lo stato `is-listening`
 * (registrazione attiva) usa `--wa-color-danger` semantico. */
.wa-checkout-voice-btn,
.wa-checkout-geo-btn {
	padding: 10px 18px;
	font-family: var(--wa-font-body);
	font-size: 14px;
	font-weight: 700;
	border-radius: var(--wa-radius-md);
	cursor: pointer;
	transition: background 0.15s ease, opacity 0.15s ease, border-color 0.15s ease;
}
.wa-checkout-voice-btn {
	color: var(--wa-icon-btn-filled-fg);
	background: var(--wa-icon-btn-filled-bg);
	border: 2px solid var(--wa-icon-btn-filled-bg);
}
.wa-checkout-voice-btn:active {
	transform: scale(0.97);
}
.wa-checkout-voice-btn.is-listening {
	/* Stato "in ascolto": rosso semantico (eredita da `--wa-color-danger`).
	 * Default `#c0392b` storico → `var(--wa-color-danger)` = `#b91c1c`,
	 * delta cromatico ~5% impercettibile in animazione pulsante. */
	background: var(--wa-color-danger);
	border-color: var(--wa-color-danger);
	animation: wa-voice-pulse 1s ease-in-out infinite;
}
.wa-checkout-geo-btn {
	color: var(--wa-icon-btn-outline-fg);
	background: var(--wa-color-surface);
	border: 2px solid var(--wa-icon-btn-outline-border);
}
.wa-checkout-geo-btn:active {
	transform: scale(0.97);
}
.wa-checkout-geo-btn.is-loading {
	opacity: 0.65;
	pointer-events: none;
}

/* ── Geolocalizzami: mobile only ── */
@media (min-width: 768px) {
	.wa-geo-mobile-only {
		display: none;
	}
}

/* ── Autocomplete + indirizzo consegna (checkout) ── */
.wa-addr-esteso-help {
	font-size: 13px;
	color: var(--wa-color-muted);
	margin: 6px 0 0 0;
	line-height: var(--wa-line-relaxed);
}
.wa-addr-search-status {
	display: none;
	align-items: center;
	gap: 10px;
	margin-top: 10px;
	padding: 8px 12px;
	background: var(--wa-color-surface-soft);
	border-radius: var(--wa-radius-md);
	border: 1px solid var(--wa-color-border);
	font-family: var(--wa-font-body);
	font-size: 13px;
	color: var(--wa-color-text);
	line-height: var(--wa-line-relaxed);
}
.wa-addr-search-status--visible {
	display: flex;
}
.wa-addr-search-status__bar {
	flex: 0 0 36px;
	height: 4px;
	border-radius: 3px;
	background: linear-gradient(90deg, var(--wa-color-surface-soft), var(--wa-color-primary), var(--wa-color-surface-soft));
	background-size: 200% 100%;
	animation: wa-addr-search-shimmer 1.1s ease-in-out infinite;
}
@keyframes wa-addr-search-shimmer {
	0% { background-position: 100% 0; }
	100% { background-position: -100% 0; }
}
.wa-addr-search-status__text {
	flex: 1;
	min-width: 0;
}
.wa-addr-ac-wrap {
	position: relative;
}
.wa-addr-results-region {
	margin-top: 4px;
	min-height: 0;
}
.wa-addr-ac-panel.wa-addr-ac-list {
	margin-top: 10px;
	border: 1px solid var(--wa-color-border);
	border-radius: var(--wa-radius-md);
}
.wa-addr-ac-list.wa-addr-ac-list--inline {
	position: relative;
	z-index: 1;
	width: 100%;
	box-shadow: var(--wa-shadow-sm);
}
.wa-addr-ac-list.wa-addr-ac-list--updating {
	opacity: 0.72;
	transition: opacity 0.15s ease;
}
.wa-addr-ac-list {
	position: relative;
	z-index: 120;
	max-height: 280px;
	overflow-y: auto;
	background: var(--wa-color-surface);
	border: 1px solid var(--wa-color-border);
	border-radius: var(--wa-radius-md);
	box-shadow: var(--wa-shadow-md);
}
.wa-addr-match-modal {
	position: fixed;
	inset: 0;
	z-index: 1085;
	display: none;
	align-items: center;
	justify-content: center;
	padding: 1rem;
	pointer-events: none;
	visibility: hidden;
	opacity: 0;
	transition: opacity 0.2s ease, visibility 0.2s ease;
}
.wa-addr-match-modal.is-open {
	display: flex !important;
	pointer-events: auto;
	visibility: visible;
	opacity: 1;
}
.wa-addr-match-modal__backdrop {
	position: absolute;
	inset: 0;
	background: var(--wa-overlay-scrim, color-mix(in srgb, var(--wa-color-dark, #0f172a) 72%, transparent));
	cursor: default;
}
.wa-addr-match-modal__dialog {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: 420px;
	max-height: min(92vh, calc(100dvh - 2rem));
	overflow: auto;
	overscroll-behavior: contain;
}
.wa-addr-match-confirm {
	margin-top: 0;
	padding: 18px 20px;
	border-radius: var(--wa-radius-md);
	border: 1px solid var(--wa-modal-border, var(--wa-color-border, #dee2e6));
	border-top: 4px solid var(--wa-addr-match-accent, var(--wa-color-success, #15803d));
	background: var(--wa-addr-match-bg, #ffffff);
	color: var(--wa-addr-match-color, var(--wa-modal-color, var(--wa-color-text, #1f1a16)));
	text-align: left;
	box-shadow: var(--wa-shadow-lg, 0 18px 45px rgba(15, 23, 42, 0.22));
}
.wa-addr-match-confirm__kicker {
	margin: 0 0 6px 0;
	font-family: var(--wa-font-body);
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--wa-addr-match-kicker, var(--wa-color-success-fg, #14532d));
}
.wa-addr-match-confirm__addr {
	margin: 0 0 10px 0;
	font-family: var(--wa-font-body);
	font-size: 16px;
	font-weight: 700;
	color: var(--wa-addr-match-color, var(--wa-modal-color, var(--wa-color-text, #1f1a16)));
	line-height: var(--wa-line-normal);
}
.wa-addr-match-confirm__question {
	margin: 0 0 14px 0;
	font-family: var(--wa-font-body);
	font-size: 14px;
	color: var(--wa-addr-match-muted, var(--wa-muted-color, var(--wa-color-muted, #64748b)));
	line-height: var(--wa-line-relaxed);
}
.wa-addr-match-confirm__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
}
.wa-addr-match-btn {
	font-family: var(--wa-font-body);
	font-weight: 700;
	font-size: 14px;
	padding: 10px 18px;
	border-radius: var(--wa-radius-md);
}
.wa-addr-match-btn--no {
	border-width: 2px;
	background: var(--wa-addr-match-bg, var(--wa-modal-bg, #ffffff));
	border-color: var(--wa-modal-border, var(--wa-color-border, #dee2e6));
	color: var(--wa-addr-match-color, var(--wa-modal-color, var(--wa-color-text, #1f1a16)));
}
/* Sprint B — outline / mappa / conferma (editor: secondary_outline_cta) */
.btn-outline-primary {
	border-width: 2px;
	font-weight: 600;
}
.wa-addr-match-btn--yes {
	font-weight: 700;
}
.btn-outline-secondary:disabled,
.btn-outline-primary:disabled {
	opacity: 0.65;
	cursor: not-allowed;
}
.wa-checkout-addr-details {
	margin-top: 14px;
	padding: 12px 14px;
	border: 1px solid var(--wa-color-border);
	border-radius: var(--wa-radius-md);
	background: var(--wa-color-surface-soft);
}
.wa-checkout-addr-details__summary {
	cursor: pointer;
	font-family: var(--wa-font-body);
	font-size: 14px;
	font-weight: 600;
	color: var(--wa-color-text);
	list-style: none;
}
.wa-checkout-addr-details__summary::-webkit-details-marker {
	display: none;
}
.wa-checkout-addr-details__hint {
	font-weight: 400;
	color: var(--wa-color-muted);
	font-size: 13px;
}
.wa-checkout-addr-details__grid {
	margin-top: 12px;
}
.wa-addr-map-toolbar {
	padding: 0 16px 12px;
	text-align: center;
}
.wa-addr-add-pin-btn {
	font-family: var(--wa-font-body);
	font-weight: 700;
	font-size: 14px;
	border-radius: var(--wa-radius-md);
	border-width: 2px;
	color: var(--wa-color-primary);
}
.wa-addr-map-wrap--no-pin .wa-addr-map {
	opacity: 1;
}
.wa-addr-ac-item {
	padding: 10px 14px;
	cursor: pointer;
	border-bottom: 1px solid var(--wa-color-border);
	transition: background 0.12s;
	touch-action: manipulation;
	-webkit-tap-highlight-color: transparent;
}
.wa-addr-ac-item:last-child {
	border-bottom: none;
}
.wa-addr-ac-item:active,
.wa-addr-ac-active {
	background: var(--wa-color-surface-soft);
}
.wa-addr-ac-line1 {
	font-family: var(--wa-font-body);
	font-size: 14px;
	font-weight: 600;
	color: var(--wa-color-primary);
	line-height: var(--wa-line-normal);
}
.wa-addr-ac-line2 {
	font-family: var(--wa-font-body);
	font-size: 12px;
	color: var(--wa-color-muted);
	margin-top: 2px;
	line-height: var(--wa-line-normal);
}
.wa-addr-ac-badges {
	margin-top: 4px;
}
/* Round 21 refactor 2026 — badge "zona OK" autocomplete indirizzo checkout.
 * Era `#fff`/`#809221` hardcoded → `--wa-color-inverse`/`--wa-color-success`
 * semantici. Stato "zona consegnabile" → verde success universale. */
.wa-addr-ac-badge-zone {
	display: inline-block;
	font-family: var(--wa-font-body);
	font-size: 11px;
	font-weight: 700;
	color: var(--wa-color-inverse);
	background: var(--wa-color-success);
	padding: 2px 8px;
	border-radius: 4px;
}
.wa-addr-ac-badge-out {
	display: inline-block;
	font-family: 'Montserrat', sans-serif;
	font-size: 11px;
	font-weight: 700;
	color: var(--wa-color-inverse);
	background: var(--wa-color-danger);
	padding: 2px 8px;
	border-radius: 4px;
}

.wa-delivery-continue--hidden {
	display: none;
}
.wa-checkout-delivery-verify--primary {
	font-weight: 800;
	letter-spacing: 0.02em;
}
/* ── Map wrap ── */
.wa-addr-map-wrap {
	margin-top: 18px;
	border-radius: var(--wa-radius-md);
	overflow: hidden;
	background: var(--wa-color-surface-soft);
	border: 1px solid var(--wa-color-border);
}
.wa-addr-map-wrap--visible {
	display: block;
}
.wa-addr-map-wrap--pin-active .wa-addr-map-copy {
	color: var(--wa-color-primary);
}
@keyframes wa-addr-pin-pop {
	0% { transform: scale(1); }
	40% { transform: scale(1.18); }
	100% { transform: scale(1); }
}
.wa-addr-pin-pop {
	animation: wa-addr-pin-pop 0.55s ease-out;
	transform-origin: bottom center;
}
.wa-addr-marker-dragging {
	opacity: 0.92;
}
.wa-addr-map-copy {
	padding: 14px 16px 8px;
	font-family: var(--wa-font-body);
	font-size: 14px;
	font-weight: 600;
	color: var(--wa-color-primary);
	line-height: var(--wa-line-relaxed);
	text-align: center;
	margin: 0;
}
.wa-addr-map-copy-sub {
	font-weight: 400;
	font-size: 12.5px;
	color: var(--wa-color-muted);
}
.wa-addr-map {
	height: 340px;
	width: 100%;
}
@media (min-width: 768px) {
	.wa-addr-map {
		height: 440px;
	}
}
.wa-addr-map .leaflet-container {
	font-family: inherit;
}
.wa-addr-map img {
	max-width: none;
	max-height: none;
}
.wa-addr-route-caption {
	margin: 0;
	padding: 12px 16px 14px;
	font-family: var(--wa-font-body);
	font-size: 12.5px;
	line-height: var(--wa-line-relaxed);
	color: var(--wa-color-text);
	text-align: center;
	background: var(--wa-color-surface-soft);
	border-top: 1px solid var(--wa-color-border);
}
.wa-addr-route-caption__title {
	display: block;
	font-weight: 700;
	font-size: 13.5px;
	color: var(--wa-color-primary);
	margin-bottom: 6px;
	line-height: var(--wa-line-normal);
}
.wa-addr-route-caption__sub {
	display: block;
	font-weight: 500;
	font-size: 12px;
	color: var(--wa-color-muted);
	line-height: var(--wa-line-relaxed);
}
.leaflet-container .wa-addr-marker-sede-wrap {
	background: transparent;
	border: none;
}
/* Marker sede: “casetta” / negozio (non il pin cliente) */
.wa-addr-marker-sede-icon {
	width: 30px;
	height: 26px;
	position: relative;
	margin: 0 auto;
	pointer-events: auto;
	filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.28));
}
.wa-addr-marker-sede-icon::before {
	content: '';
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: 7px;
	width: 22px;
	height: 14px;
	background: linear-gradient(180deg, #d4b24a 0%, #8b6914 100%);
	border-radius: 3px;
	border: 2px solid #fff;
	box-sizing: border-box;
}
.wa-addr-marker-sede-icon::after {
	content: '';
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: 19px;
	width: 0;
	height: 0;
	border-left: 11px solid transparent;
	border-right: 11px solid transparent;
	border-bottom: 9px solid #a67c00;
}
.wa-addr-marker-sede {
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: #2d6a4f;
	border: 3px solid #fff;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.28);
	margin: 0 auto;
}
@keyframes wa-addr-marker-client-pulse {
	0% {
		filter: drop-shadow(0 0 0 rgba(107, 62, 38, 0));
		transform: scale(1);
	}
	35% {
		filter: drop-shadow(0 4px 14px rgba(107, 62, 38, 0.4));
		transform: scale(1.07);
	}
	100% {
		filter: drop-shadow(0 0 0 rgba(107, 62, 38, 0));
		transform: scale(1);
	}
}
.leaflet-marker-icon.wa-addr-marker-client--pulse,
.wa-addr-marker-client--pulse {
	animation: wa-addr-marker-client-pulse 0.88s ease-out 1;
}
.leaflet-overlay-pane svg path.wa-leaflet-route-poly {
	filter: drop-shadow(0 1px 2px rgba(107, 62, 38, 0.22));
}
.wa-checkout-zona-economics__row--tempo .wa-checkout-zona-economics__v {
	font-weight: 700;
	color: var(--wa-color-primary);
}
.wa-checkout-cta-delivery,
.wa-checkout-cta-pickup {
	max-width: 100%;
}

/* ── Zone result ── */
.wa-addr-zone-result {
	margin-top: 14px;
	padding: 12px 16px;
	border-radius: 8px;
	font-family: 'Montserrat', sans-serif;
	font-size: 14px;
	line-height: 1.4;
	text-align: center;
}
/* Round 17b refactor 2026 — verdetto zona indirizzo consegna usa i token
 * globali R16 con semantica corretta: zona OK = success, zona fuori area =
 * danger, zona neutra = surface-soft + accent (in attesa verifica), zona
 * "ricontrolla" = warning. Border usa `--wa-color-border` come fallback
 * neutro (manteneva tinte specifiche pre-R17b ma il delta cromatico è
 * impercettibile sui preset 50/50; tenant con preset scuri ora vedono
 * bordi coerenti col tema invece di pastello hardcoded). */
.wa-addr-zone-ok {
	background: var(--wa-color-success-bg);
	color: var(--wa-color-success-fg);
	border: 1px solid var(--wa-color-success);
}
.wa-addr-zone-out {
	background: var(--wa-color-danger-bg);
	color: var(--wa-color-danger-fg);
	border: 1px solid var(--wa-color-danger);
}
.wa-addr-zone-neutral {
	background: var(--wa-color-surface-soft);
	color: var(--wa-color-accent);
	border: 1px solid var(--wa-color-border);
}
.wa-addr-zone-pending-reverify {
	background: var(--wa-color-warning-bg);
	color: var(--wa-color-warning-fg);
	border: 1px solid var(--wa-color-warning);
}
.wa-addr-zone-icon {
	margin-right: 6px;
	font-weight: 700;
}

.wa-checkout-delivery-logged {
	text-align: center;
	font-size: 14px;
	/* Round 17b refactor 2026 — `var(--wa-color-muted)` (era `#555`). */
	color: var(--wa-color-muted);
	margin: 0 0 1rem;
	line-height: var(--wa-line-relaxed);
}

/* checkout gate — solo utenti autenticati.
 *
 * Round 17b refactor 2026 — colori migrati ai token globali del Base Theme
 * System (R16) + nuovo gruppo `secondary_buttons` (R17b) per il bottone
 * "Continua come ospite". Default valori sincronizzati al pre-R17b
 * (`#faf9f8` = surface-soft, `#1f1f1f` ≈ text, `#444`/`#555` ≈ muted scuri,
 * `#6b4a3b` = accent, `#5a3f32` = accent-hover) → zero regressione visiva. */
.wa-checkout-gate-page .wa-checkout-gate-card {
	background: var(--wa-color-surface-soft);
	border: 2px solid var(--wa-color-border);
	border-radius: 12px;
	padding: 22px 20px 26px;
	margin: 16px auto 24px;
	max-width: 520px;
	text-align: center;
}
.wa-checkout-gate-title {
	font-family: var(--wa-font-heading);
	font-size: 1.35rem;
	font-weight: 700;
	color: var(--wa-color-text);
	margin: 0 0 12px 0;
	line-height: 1.25;
}
.wa-checkout-gate-lead {
	font-size: 15px;
	line-height: 1.5;
	color: var(--wa-color-muted);
	margin: 0 0 14px 0;
	text-align: left;
}
.wa-checkout-gate-totale {
	font-size: 14px;
	margin: 0 0 20px 0;
	color: var(--wa-color-muted);
}
.wa-checkout-gate-actions {
	display: flex;
	flex-direction: column;
	gap: 12px;
	max-width: 360px;
	margin: 0 auto 16px;
}
.wa-checkout-gate-actions .wa-checkout-cta-choice {
	margin-bottom: 0;
	white-space: normal;
}
/* Round 17b refactor 2026 — pulsante secondario "Continua come ospite":
 * primo consumer reale del nuovo gruppo `secondary_buttons` + token
 * globali `--wa-secondary-*`. */
.wa-checkout-gate-secondary {
	background: var(--wa-secondary-bg);
	color: var(--wa-secondary-fg);
	border: 2px solid var(--wa-secondary-border);
}
.wa-checkout-gate-secondary:active {
	background: var(--wa-secondary-hover-bg);
	color: var(--wa-secondary-hover-fg);
}
.wa-checkout-gate-recover {
	margin: 0;
	font-size: 14px;
}
.wa-checkout-gate-link {
	font-size: 14px;
}

/* carrello — etichetta CTA checkout */
.wa-cart-cta-label {
	font-family: 'Montserrat', sans-serif;
	font-size: 16px;
	font-weight: 700;
}
.wa-cart-cta-guest .wa-cart-cta-label {
	font-size: 15px;
}
@keyframes wa-voice-pulse {
	0%, 100% { opacity: 1; }
	50% { opacity: 0.85; }
}
.wa-checkout-field--halfgrid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
}
@media (max-width: 480px) {
	.wa-checkout-field--halfgrid {
		grid-template-columns: 1fr;
	}
}
.wa-checkout-delivery-verdict {
	text-align: left;
	font-weight: 600;
}
.wa-checkout-delivery-avviso {
	text-align: center;
	font-weight: 400;
}
.wa-checkout-zona-economics {
	margin-top: 14px;
	margin-bottom: 6px;
	padding: 14px 16px;
	border-radius: var(--wa-radius-md);
	border: 1px solid var(--wa-color-success);
	background: var(--wa-color-success-bg);
	text-align: left;
}
.wa-checkout-zona-economics__title {
	margin: 0 0 10px 0;
	font-size: 1rem;
	font-weight: 700;
	color: var(--wa-color-success-fg);
}
.wa-checkout-zona-economics__list {
	margin: 0;
	padding-left: 0;
	list-style: none;
	font-size: 14px;
	line-height: var(--wa-line-relaxed);
	color: var(--wa-color-text);
}
.wa-checkout-zona-economics__row {
	margin-bottom: 6px;
}
.wa-checkout-zona-economics__k {
	font-weight: 600;
	color: var(--wa-color-muted);
	margin-right: 6px;
}
.wa-checkout-zona-economics__v {
	font-weight: 600;
	color: var(--wa-color-text);
}
.wa-checkout-zona-economics__note {
	margin-top: 8px;
	padding-top: 8px;
	border-top: 1px dashed var(--wa-color-border);
	font-size: 13px;
	color: var(--wa-color-success-fg);
}
.wa-checkout-zona-economics__row--discount .wa-checkout-zona-economics__v {
	color: var(--wa-color-success-fg);
}
.wa-checkout-zona-economics__row--highlight {
	background: color-mix(in srgb, var(--wa-color-success-fg) 12%, transparent);
	border-radius: var(--wa-radius-sm);
	padding: 6px 8px;
	margin: 4px 0;
}
.wa-checkout-zona-economics__row--highlight .wa-checkout-zona-economics__k,
.wa-checkout-zona-economics__row--highlight .wa-checkout-zona-economics__v {
	font-weight: 700;
}
.wa-checkout-zona-economics__note--savings {
	font-weight: 600;
}
.wa-checkout-totals-breakdown {
	margin: 12px 0 16px;
}
.wa-confirm-mkt-pay-note {
	margin: 0 0 16px;
	text-align: center;
}
.wa-miei-mkt-hint {
	display: block;
	font-size: 12px;
	color: var(--wa-color-success-fg);
	font-weight: 600;
	margin-top: 4px;
}
.wa-miei-mkt-details {
	margin-top: 6px;
	text-align: left;
}
.wa-miei-mkt-details__summary {
	cursor: pointer;
	font-size: 12px;
	color: var(--wa-color-text-muted, #64748b);
}
.wa-miei-mkt-details .wa-checkout-totals-breakdown {
	margin: 8px 0 0;
	text-align: left;
}
.wa-checkout-riepilogo-line--money .wa-checkout-k {
	min-width: 8.5em;
}
.wa-checkout-delivery-summary-field .wa-checkout-label {
	margin-bottom: 8px;
}
.wa-checkout-delivery-summary-box {
	border: 2px solid var(--wa-color-border);
	border-radius: var(--wa-radius-sm);
	padding: 12px 14px;
	font-size: 14px;
	line-height: var(--wa-line-relaxed);
	color: var(--wa-color-text);
	background: var(--wa-color-surface-soft);
}
.wa-checkout-delivery-fallback-form {
	margin-top: 20px;
}
.wa-checkout-delivery-fallback-lead {
	text-align: center;
	font-size: 14px;
	margin-bottom: 8px;
	color: var(--wa-color-muted);
}
.wa-checkout-page .wa-checkout-toolbar .wa-checkout-back-link.menuapri {
	text-decoration: none;
}
.wa-checkout-page .wa-checkout-toolbar .wa-checkout-back-link.menuapri:focus-visible {
	text-decoration: underline;
}
.wa-confirm-page .wa-flow-totale-block {
	margin-top: 16px;
}

/* foot.php — web_app */
/* Footer identità locale pubblica (R38) */
.wa-footer-identity {
	text-align: center;
	max-width: 42rem;
	margin: 0 auto 1.25rem;
	padding: 0 1rem;
}
.wa-footer-identity__name {
	font-size: 1.15rem;
	font-weight: 700;
	color: rgba(255, 255, 255, 0.96);
	margin: 0 0 0.35rem;
	letter-spacing: 0.01em;
}
.wa-footer-identity__legal,
.wa-footer-identity__address,
.wa-footer-identity__contacts,
.wa-footer-identity__fiscal {
	font-size: 0.92rem;
	color: rgba(255, 255, 255, 0.82);
	margin: 0 0 0.35rem;
	line-height: 1.45;
}
.wa-footer-identity__link {
	color: rgba(255, 255, 255, 0.92);
	text-decoration: none;
}
.wa-footer-identity__link:hover,
.wa-footer-identity__link:focus-visible {
	color: #fff;
	text-decoration: underline;
}
.wa-footer-identity__sep {
	color: rgba(255, 255, 255, 0.45);
}
.wa-footer-legal-sep {
	color: rgba(255, 255, 255, 0.45);
}
.wa-footer-powered {
	text-align: center;
	font-size: 0.78rem;
	color: rgba(255, 255, 255, 0.55);
	margin: 0.85rem 0 0;
	letter-spacing: 0.02em;
}
.wa-footer-logo-wrap {
	padding-top: 1rem;
}
@media (max-width: 575.98px) {
	.wa-footer-legal .wa-footer-legal-sep {
		display: none;
	}
	.wa-footer-legal a {
		display: inline-block;
		margin: 0.15rem 0.45rem;
	}
	.wa-footer-identity__contacts .wa-footer-identity__sep {
		display: none;
	}
	.wa-footer-identity__contacts .wa-footer-identity__link {
		display: block;
		margin: 0.15rem 0;
	}
}

/* Mobile: footer compatto su tutte le pagine web_app (identità + legali). */
@media (max-width: 991.98px) {
	body.wa-client-app .footer-dark.footer-completo {
		display: block !important;
	}
}
.footer-social-gap {
	color: #282d32;
}
.wa-footer-logo-wrap {
	text-align: center;
	padding-top: 30px;
}
.wa-footer-legal {
	text-align: center;
}
/* Round 9 refactor 2026 — focus tastiera visibile e preset-aware sui link
 * footer (categorie + contatti + social + logo + link legali). Stesso
 * pattern di Round 5/6/7/8 (`outline: 2px solid currentColor`). NON tocco
 * `.footertesto:focus-visible` puro perché è già editor-controllato dallo
 * schema (`footer_linkFocusRing` → `box-shadow`); aggiungo solo l'outline
 * come back-up esplicito per i preset che non personalizzano la box-shadow.
 *
 * Footer è dark per default (`footer_bg: #0f172a`/scuro nei preset): il
 * `currentColor` qui eredita `footer_textFg` o `footer_linkFg` (preset
 * controllabili) che sono già chiari su sfondo scuro → focus ring chiaro
 * visibile su scuro. Su preset chiari personalizzati il `currentColor`
 * eredita comunque il colore del link, restando coerente. */
.wa-footer-logo-wrap a:focus-visible,
.footer-dark .item.social a:focus-visible,
.wa-footer-legal a:focus-visible {
	outline: 2px solid;
	outline-offset: 3px;
	border-radius: 4px;
}
/* Etichetta valore dentro link contatto (es. numero telefono): bold leggero
 * per separare visivamente la label "Telefono" dal valore "+39…". Ereditato
 * da `.footertesto` per colore (preset-aware via `footer_linkFg`). */
.wa-footer-contact-value {
	font-weight: 600;
}
/* ────────────────────────────────────────────────────────── */

.fa-smile-wink::before {
        display:none;
}

/* COUPON */

.bottonecouponscontocarrelloalto {
    border: 3px dotted #333;
    font-weight: bold;
    display: grid;
    width: 100%;
    background-color: #f3c210;
    color: #000;
    text-transform: uppercase;
    line-height: 19px;
    letter-spacing: -1px;
    z-index:9999999;
    margin-top:50px;}

.prezzosopra {
    padding-bottom:30px;}

.results {
        margin-bottom: -30px;
}

/* COUPON END */

.consegnagratuita {
        font-size: 14px;
        color: var(--wa-color-muted);
}

.testoconsegna {
	font-size: var(--wa-text-sm);
	color: var(--wa-color-muted);
	line-height: var(--wa-line-relaxed);
	margin: 0 0 0.75rem;
	padding-top: 0;
}

.totale {
        font-family: var(--wa-font-heading);
        color: var(--wa-color-text);
        line-height: 20px;
        display: inline-block;
        margin-top: 40px;
        font-weight: 300;
        font-size: 40px;
}

.gratuita {
        color: var(--wa-color-success);
}

.ordineminimo {
        color: #bb151d;
        border: 2px solid #bb151d;
        padding: 10px 20px;
        border-radius: 6px;
        display: inline-block;
        margin-bottom: 20px;
	color: red;
	font-weight: bold;
	font-size: 1.2em;
}

.table-hover tbody tr:hover {
        background-color: transparent;
}

button.btn.btn-success.bottoneavanti.bottoneavanti2.col-md-6.col-12.btn-choose.btn-accedi-icon.btn-accedi.textcustom-accedi {
    margin-top:-10px;
}

/* ELEMENTI NASCOSTI */
#st-1, .bloccosemaforo, .versione, .footer-dark .item.social, .row-footer {
            display:none;
}

/* FORM — stati base global_forms; checkout vedi blocco .wa-checkout-inner (specificità più alta) */
.form-control {
	font-weight: 700;
}
.form-control:focus {
	outline: none;
}
textarea.form-control {
	min-height: 5rem;
}
.form-control:disabled,
.form-control[disabled] {
	cursor: not-allowed;
}
.form-control.is-invalid {
	border-color: var(--wa-color-danger);
}
.invalid-feedback {
	display: block;
	color: var(--wa-color-danger-fg);
	font-size: 80%;
}
.wa-checkout-page .form-control,
.wa-checkout-page .wa-checkout-input {
	font-weight: 400;
}
/* END FORM */

/* FIX SPACES 2021 */


#salvapassword .text-uppercase{
        font-weight: 700;
        margin-top: 10px;
        margin-bottom:10px;
        line-height:18px;
}

/* FIX SPACES 2021 */

/* PULSANTI */

.btn-confermadati-icon {
        background-image:url(&quot;https://image.deliveryonline.it/default/check_bianco.svg&quot;);
	background-size: 80px;
	background-repeat: no-repeat;
	background-position: 30px center;
}

.btn-confermadati,
.btn-carrello {
	background-color: var(--wa-color-primary);
	border-color: var(--wa-color-primary);
	color: var(--wa-color-primary-contrast);
}

.btn-confermadati:hover,
.btn-carrello:hover {
	background-color: var(--wa-color-primary-hover);
	border-color: var(--wa-color-primary-hover);
}

.bottoneavanti, .bottonedatipersonali, .btn-success, bottoneavanticonsegna, #serviziodisponibile, bottoneavanticonsegna {
        font-size: 20px;
/*margin-top:26px;*/
	text-transform:uppercase;
        transition: all 0.5s ease;
}	

.bottoneavanti:hover, .bottonedatipersonali:hover, .btn-success:hover, bottoneavanticonsegna:hover, #serviziodisponibile:hover, bottoneavanticonsegna:hover {
        font-size: 20px;
	text-transform:uppercase;
        transition: all 0.5s ease;
}	

.btn-choose{
        font-weight: var(--wa-button-weight, 700);
        color: var(--wa-cta-confirm-color, var(--wa-color-primary-contrast));
        background-color: var(--wa-cta-confirm-bg, var(--wa-color-primary));
        border-color: var(--wa-cta-confirm-border, var(--wa-color-primary));
        width:100%;
        padding:30px 100px;
	margin-top:26px;
	text-transform:uppercase;
        transition: all 0.5s ease; 
        border-radius: var(--wa-radius-button, 10px);
	border: none;
        line-height:22px;
        min-height:110px;
}

.btn-choose:hover{
        transition: all 0.5s ease; 
}

/* APPLE GESTURE */
.bottonegesturesapple {
    width: 80%;
    background-color: rgba(255,255,255,0.1);
    border: none;
    color: white;
}

.gesturestotale{
    color: white;
    width: 100%;
    margin: auto;
}

.fa-apple {
    font-size:3em;
}

.scopricomegestures {
    margin: 8px;
    background-color: #000;
    /* display: inline; */
    padding: 10px 40px;
    border-radius: 4px;
    font-size: 1.2em;
    text-transform: uppercase;
}

.img-gesture {
    padding:10px 20px;
}

.img-gesture span {
    font-size:20px;
    font-weight:900;
}

.img-gesture img {
    width:60%;
    margin:auto;
    text-align: center;
}

.gesture-container {
width:100%;
}


@media only screen and (max-width: 767px) {

.img-gesture img {
    width:100%;
}

.gesture-container {
width:100%;
}

}
/* APPLE GESTURE END */

/* APPLE BOX SHARE */
.ath-container, .ath-ios.ath-phone:after {
        background:#fff;
        font-family:inherit;
}

/* APPLE BOX SHARE END */

/* PULSANTE REGISTRAZIONE */
.registratisubito {
        padding: 10px 20px;
        display: inline-block;
        margin-top: 20px;
        text-transform: uppercase;
        font-weight: 700;
        border-radius: .25rem;
        transition: all 0.5s ease;
}		

.passworddimenticata {
        color:#171717;
        border:1px solid #171717;
        border-radius: .25rem;
        display:flex;
        line-height:16px;
        margin-top:15px;
        padding:6px;
        font-weight: 700;      
}


/* ALERT VARI */
.alert-success {
        background: var(--wa-color-success-bg);
        color: var(--wa-color-success-fg);
        border-radius: var(--wa-radius-sm);
        border: 1px solid var(--wa-color-success);
        margin: 20px 0 10px 0;
}

.oggino, #servizionondisponibile {
color: white;
        background-color: #be192b;
        border: 2px solid #be192b;
        padding: 10px 20px;
        border-radius: 5px;
        margin: 10px 0px;
        display: inline-block;
}


/* DELIVERY FIX 2021 */
.coloreritiro .table thead th, .table thead th, .coloreconsegna .table thead th {
    border-bottom:1px solid rgba(255, 255, 255, 0.4);
    border-top: none;
}

.coloreritiro .table td  {
    border-color: rgba(255, 255, 255, 0.4);
}

.coloreconsegna .table td  {
    border-color: rgba(255, 255, 255, 0.4);
}

.logo-footer {
    padding-top: 0;
}
/* DELIVERY FIX 2021 END */

#serviziodisponibile2 {
        margin-top:20px;
}

/* CAMPO NOTE */
.nicEdit-main {
        background-color:#fff;
        margin: 0;
        width: 100%;
        border-top:1px solid #ccc; 
}
 
 .nicEdit-panelContain {
        display:none;
}
/* END CAMPO NOTE */

.btn-paypal-icon {
 background-image: url(&quot;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 66 65' fill='%23fff' fill-rule='evenodd' stroke='%23000' stroke-linecap='round' stroke-linejoin='round'%3E%3Cuse xlink:href='%23A' x='.5' y='.5'/%3E%3Csymbol id='A' overflow='visible'%3E%3Cg stroke='none' fill-rule='nonzero'%3E%3Cpath d='M63.397 22.5c0 6.716-2.792 12.14-8.364 16.26s-13.358 6.175-23.37 6.175h-5.535l-4.244 18.4H7.257L20.763 6.9h19.804c3.7 0 6.9.258 9.656.763 2.743.504 5.117 1.378 7.1 2.62 1.968 1.242 3.48 2.854 4.514 4.834 1.033 1.968 1.55 4.44 1.55 7.393z' fill='%23009cde'/%3E%3Cpath d='M22.375 63.94H6.495l13.8-57.653h20.27c3.702 0 6.987.258 9.754.763 2.805.517 5.265 1.427 7.32 2.694 2.054 1.292 3.653 3 4.736 5.068S64 19.47 64 22.5c0 6.888-2.9 12.534-8.6 16.753-5.658 4.182-13.64 6.298-23.74 6.298h-5.056zM8.032 62.734h13.37l4.244-18.4h6.015c9.828 0 17.578-2.042 23.014-6.064 2.694-1.993 4.748-4.33 6.1-6.938s2.017-5.584 2.017-8.832c0-2.84-.504-5.24-1.488-7.134-.984-1.882-2.423-3.42-4.293-4.6-1.92-1.193-4.244-2.042-6.9-2.534-2.694-.492-5.904-.75-9.545-.75H21.243z'/%3E%3Cpath d='M56.903 16.225c0 6.716-2.792 12.14-8.364 16.26S35.18 38.66 25.17 38.66h-5.535L15.4 57.05H.763L13.8.603h20.284c3.7 0 6.9.258 9.656.763 2.743.504 5.117 1.378 7.1 2.62 1.968 1.242 3.48 2.854 4.514 4.834 1.033 1.968 1.55 4.44 1.55 7.405z' fill='%230f3572'/%3E%3Cpath d='M15.868 57.654H0L13.297 0h20.776c3.702 0 6.987.258 9.754.763 2.805.517 5.265 1.427 7.32 2.694 2.054 1.292 3.653 3 4.736 5.068s1.624 4.65 1.624 7.688c0 6.888-2.9 12.534-8.6 16.753-5.658 4.182-13.64 6.298-23.74 6.298H20.1zM1.525 56.436h13.383l4.244-18.4h6.015c9.828 0 17.578-2.042 23.014-6.064 2.694-1.993 4.748-4.33 6.1-6.938s2.017-5.584 2.017-8.832c0-2.84-.504-5.24-1.488-7.134-.984-1.882-2.423-3.42-4.293-4.6-1.92-1.193-4.244-2.042-6.9-2.534-2.694-.492-5.904-.75-9.545-.75H14.256zM41.87 18.23c-.1 1.722-.455 3-1.513 4.453-1.046 1.464-2.276 2.4-3.924 3.198a10.67 10.67 0 0 1-3.112.923c-1.082.148-2.374.234-3.887.234h-7.27l4.07-14.6h6.605c1.685 0 3.038.025 4.06.258 1.02.22 1.857.53 2.485.9.873.517 1.574 1.144 1.98 1.943.504.935.566 1.538.504 2.67z'/%3E%3C/g%3E%3C/symbol%3E%3C/svg%3E&quot;);
	background-size: 70px;
	background-repeat: no-repeat;
	background-position: 30px center;

}
.textcustom-paypal::before {
	content: &quot;Paga con Paypal&quot;;
}

.btn-paypal {
	background-color: #0855a2;
}

.btn-paypal:hover {
    color:#0855a2;
	background-color: #dee1e5;
}

.btn-comnpay-icon {
    background-image: url(&quot;https://image.deliveryonline.it/okasan/carta_credito_over.svg&quot;);
    background-size: 75px;
	background-repeat: no-repeat;
	background-position: 30px center;

}
.btn-comnpay-icon:hover {
    background-image: url(&quot;https://image.deliveryonline.it/okasan/carta_credito.svg&quot;);
    background-size: 75px;
	background-repeat: no-repeat;
	background-position: 30px center;
}

.textcustom-comnpay::before {
	content: &quot;Pagamento con Carta di credito &quot;;
}

.btn-comnpay {
    color: #0067a9;
	background-color: #f9e700;
}

.btn-comnpay:hover {
	background-color: #0067a9;
    color: #f9e700;
}

.btn-delivery-icon {
        background-image: url(https://www.hiromicake.it/wp-content/uploads/2020/05/Delivery_white.svg);
        background-size:60px;
        background-repeat:no-repeat;
        background-position: 30px center;
}

.btn-takeaway-icon {
        background-image: url(https://www.hiromicake.it/wp-content/uploads/2020/05/Takeaway_white.svg);
        background-size:60px;
        background-repeat:no-repeat;
        background-position: 30px center;
}

.btn-cartacredito-icon {
        background-image: url(https://www.hiromicake.it/wp-content/uploads/2020/05/WL_icone_Carta_credito.svg);
        background-size:60px;
        background-repeat:no-repeat;
        background-position: 30px center;
}

.fotopizzamobile {
        width:100%;
        margin-top:20px;
}

.logoprincipale {
        background-size:100%;
}


.sfondo_menusuperiore .btn-info, .sfondo_menusuperiore .btn-success {
        font-size:16px;
}

.sfondo_menusuperiore .btn-info:hover, .sfondo_menusuperiore .btn-success:hover {
        font-size:16px;
}

.fotopizza {
        background-size:contain;
}

.aggingiapp {
	background-color: #000;
}

/* GESTIONE INGREDIENTI (TARGHETTE) */
.nomeingrediente {
    background-color: #171717;
    color: white;
    border-radius: 4px;
    padding: 14px;
    line-height: 18px;
    font-weight: 800;
    margin-top:-20px;
}

.fotoingrediente {
    display:none;
}

/* FOTO PRODOTTO */
.simple-slider .swiper-slide {
        background-size:contain;
}


/*********************************************************************************************************/
/********************************************************************************************************/
/***************************************  FINE PARTE STANDARD ***************************************/
/*********************************************************************************************************/
/*********************************************************************************************************/




/*********************************************************************************************************/
/*********************************************************************************************************/
/**************************************** INIZIO PARTE CUSTOM ****************************************/
/*********************************************************************************************************/
/*********************************************************************************************************/

/*----------------------------------------------------------------------------------------------------------------- */
/*----------------- HOME PAGE CUSTOM - IN BASE ALLA CUSTOMIZZAZIONE GRAFICA ------------------- */
/*----------------------------------------------------------------------------------------------------------------- */

.hp-link {
        transition: all 0.5s ease;
        font-size: 24px;
        color: #fff;
        font-weight: 800;
        text-transform: uppercase;
        background-color: #6b6a8b;
        display: inline-block;
        padding: 10px 30px;
        border-radius: 6px;
        line-height: 24px;
}

.hp-link:hover {
        transition: all 0.5s ease;
        background-color: #000;
}

/***************** MOBILE *******************/
@media only screen and (max-width: 767px) {

.hp-link {
        font-size: 120%;
        padding: 10px 10px;
        line-height: 18px;}
}

/* FINE HOME PAGE CUSTOM */

/* IMMAGINE O PATTERN DI FONDO
 * Round 20 refactor 2026 — `background-color` migrato a `var(--wa-color-bg)`
 * (era `#e9e5e2` hardcoded che vinceva per cascata sul body R16 alla riga 23,
 * impedendo alla palette Terra Premium di arrivare al body). `background-image`
 * URL specifico tenant lasciato come è (tenant-specific asset, fuori scope R20).
 * Il CSS Editor compila override su `body_bg` che vince sul `var()`. */
body{
        background-color: var(--wa-color-bg);
}
/* FINE IMMAGINE O PATTERN DI FONDO */

/*----------------------------------------------------------------------------------------------------------------- */
/*--------------------------------------------- MENU PRE-HEADER--------------------------------------------- */
/*----------------------------------------------------------------------------------------------------------------- */

/* COLORE FONDO */
.sfondo_menusuperiore{
	background-color: var(--wa-topbar-bg, var(--wa-header-bg, var(--wa-color-surface)));
	color: var(--wa-topbar-color, var(--wa-header-text, var(--wa-color-text)));
}

/* TESTI E ICONE */
.menu_superiore_link, .bottone_esci {
        color: var(--wa-topbar-color, var(--wa-header-text, var(--wa-color-text)));
}

/* TESTI E ICONE */
.menu_superiore_link:hover, .bottone_esci:hover {
        color: color-mix(in srgb, var(--wa-topbar-color, var(--wa-header-text, var(--wa-color-text))) 65%, transparent);
}

.menu_superiore span, .rivediordini strong {
        color:rgba(255,255,255,0.5);
}

/*----------------------------------------------------------------------------------------------------------------- */
/*---------------------------------------------------- HEADER -------------------------------------------------- */
/*----------------------------------------------------------------------------------------------------------------- */

/* VOCI MENU */
.navigation-clean.navbar-light .navbar-nav .nav-link{
        color:black;
        text-transform: uppercase;
	font-size: 16px;
        font-family: 'Montserrat', serif;
	font-weight: 400;
	line-height: 1.0;
	color: #110b08;
	text-align: left;
	transition: all 0.5s ease;
}

.navigation-clean.navbar-light .navbar-nav .nav-link:hover {
        opacity:0.5;
	transition: all 0.5s ease;
}

/* OMBRA HEADER (ALL'OCCORRENZA RENFDERLA INVISIBILE) */
.navigation-clean {
        box-shadow: 0px 5px 5px #999;
}

/*----------------------------------------------------------------------------------------------------------------- */
/*--------------------------------------------------- FOOTER --------------------------------------------------- */
/*----------------------------------------------------------------------------------------------------------------- */

.footer-dark {
        background: var(--wa-footer-bg, var(--wa-color-dark));
        color: var(--wa-footer-color, var(--wa-color-inverse));
}

/*----------------------------------------------------------------------------------------------------------------- */
/*-------------------------------------------------- MY PAGE --------------------------------------------------- */
/*----------------------------------------------------------------------------------------------------------------- */

#latosinistro table {
        background-color:#fff;
}

.far.fa-eye {
        background: var(--wa-color-primary);
        color: white;
        padding: 10px;
        border-radius: 50%;
        transition: all 0.5s ease;
}

.riordina, .bottoneareautente {
        background: var(--wa-color-primary);
        display: inline-block;
        padding: 5px 10px;
        border-radius: 5px;
        color: white;
        transition: all 0.5s ease;
        text-align: center;
}

.bottoneareautente {
        margin-top:30px;
        display:inline-block;
        border-radius: 5px;
        color: white;
        transition: all 0.5s ease;
        text-transform: uppercase;
        font-weight: 700;
        padding: 10px 40px;
        font-size: 20px;
        line-height: 20px;
}

.riordina:hover, .far.fa-eye:hover, .bottoneareautente:hover  {
        background-color:#333;
        transition: all 0.5s ease;
        color:white;
}

#latosinistro .table thead th {
        border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}

/*----------------------------------------------------------------------------------------------------------------- */
/*-------------------------------------------------- PULSANTI -------------------------------------------------- */
/*----------------------------------------------------------------------------------------------------------------- */

.btn-controllospedizione-icon {
    background-image:url('data:image/svg+xml;utf8,&lt;svg aria-hidden=&quot;true&quot; focusable=&quot;false&quot; data-prefix=&quot;fas&quot; data-icon=&quot;arrow-circle-right&quot; class=&quot;svg-inline--fa fa-arrow-circle-right fa-w-16&quot; role=&quot;img&quot; xmlns=&quot;http://www.w3.org/2000/svg&quot; viewBox=&quot;0 0 512 512&quot;&gt;&lt;path fill=&quot;currentColor&quot; d=&quot;M256 8c137 0 248 111 248 248S393 504 256 504 8 393 8 256 119 8 256 8zm-28.9 143.6l75.5 72.4H120c-13.3 0-24 10.7-24 24v16c0 13.3 10.7 24 24 24h182.6l-75.5 72.4c-9.7 9.3-9.9 24.8-.4 34.3l11 10.9c9.4 9.4 24.6 9.4 33.9 0L404.3 273c9.4-9.4 9.4-24.6 0-33.9L271.6 106.3c-9.4-9.4-24.6-9.4-33.9 0l-11 10.9c-9.5 9.6-9.3 25.1.4 34.4z&quot; style=&quot;color:white;&quot;&gt;&lt;/path&gt;&lt;/svg&gt;');
	background-size: 50px;
	background-repeat: no-repeat;
	background-position: 30px center;

}
.textcustom-controllospedizione::before {
	content: &quot;Conferma indirizzo e vai avanti&quot;;
}

.btn-proseguihome-icon, btn-proseguiprodotti {
            background-image:url('data:image/svg+xml;utf8,&lt;svg aria-hidden=&quot;true&quot; focusable=&quot;false&quot; data-prefix=&quot;fas&quot; data-icon=&quot;home&quot; class=&quot;svg-inline--fa fa-home fa-w-18&quot; role=&quot;img&quot; xmlns=&quot;http://www.w3.org/2000/svg&quot; viewBox=&quot;0 0 576 512&quot;&gt;&lt;path fill=&quot;currentColor&quot; d=&quot;M280.37 148.26L96 300.11V464a16 16 0 0 0 16 16l112.06-.29a16 16 0 0 0 15.92-16V368a16 16 0 0 1 16-16h64a16 16 0 0 1 16 16v95.64a16 16 0 0 0 16 16.05L464 480a16 16 0 0 0 16-16V300L295.67 148.26a12.19 12.19 0 0 0-15.3 0zM571.6 251.47L488 182.56V44.05a12 12 0 0 0-12-12h-56a12 12 0 0 0-12 12v72.61L318.47 43a48 48 0 0 0-61 0L4.34 251.47a12 12 0 0 0-1.6 16.9l25.5 31A12 12 0 0 0 45.15 301l235.22-193.74a12.19 12.19 0 0 1 15.3 0L530.9 301a12 12 0 0 0 16.9-1.6l25.5-31a12 12 0 0 0-1.7-16.93z&quot;  style=&quot;fill:white;&quot;&gt;&lt;/path&gt;&lt;/svg&gt;');
	background-size: 50px;
	background-repeat: no-repeat;
	background-position: 30px center;

}

.textcustom-proseguihome::before, btn-proseguiprodotti::before {
	content: &quot;Prosegui e vai alla Homepage&quot;;
}

.btn-prosegui-icon {
            background-image:url('data:image/svg+xml;utf8,&lt;svg aria-hidden=&quot;true&quot; focusable=&quot;false&quot; data-prefix=&quot;fas&quot; data-icon=&quot;cart-arrow-down&quot; class=&quot;svg-inline--fa fa-cart-arrow-down fa-w-18&quot; role=&quot;img&quot; xmlns=&quot;http://www.w3.org/2000/svg&quot; viewBox=&quot;0 0 576 512&quot;&gt;&lt;path fill=&quot;currentColor&quot; d=&quot;M504.717 320H211.572l6.545 32h268.418c15.401 0 26.816 14.301 23.403 29.319l-5.517 24.276C523.112 414.668 536 433.828 536 456c0 31.202-25.519 56.444-56.824 55.994-29.823-.429-54.35-24.631-55.155-54.447-.44-16.287 6.085-31.049 16.803-41.548H231.176C241.553 426.165 248 440.326 248 456c0 31.813-26.528 57.431-58.67 55.938-28.54-1.325-51.751-24.385-53.251-52.917-1.158-22.034 10.436-41.455 28.051-51.586L93.883 64H24C10.745 64 0 53.255 0 40V24C0 10.745 10.745 0 24 0h102.529c11.401 0 21.228 8.021 23.513 19.19L159.208 64H551.99c15.401 0 26.816 14.301 23.403 29.319l-47.273 208C525.637 312.246 515.923 320 504.717 320zM403.029 192H360v-60c0-6.627-5.373-12-12-12h-24c-6.627 0-12 5.373-12 12v60h-43.029c-10.691 0-16.045 12.926-8.485 20.485l67.029 67.029c4.686 4.686 12.284 4.686 16.971 0l67.029-67.029c7.559-7.559 2.205-20.485-8.486-20.485z&quot;  style=&quot;fill:white;&quot;&gt;&lt;/path&gt;&lt;/svg&gt;');
	background-size: 50px;
	background-repeat: no-repeat;
	background-position: 30px center;

}

.textcustom-prosegui::before {
	content: &quot;Prosegui e vai al Carrello&quot;;
}

.btn-registrazioneforzata-icon {
            background-image:url('data:image/svg+xml;utf8,&lt;svg xmlns=&quot;http://www.w3.org/2000/svg&quot;   width=&quot;500&quot; height=&quot;500&quot;&gt;&lt;path  d=&quot;M633.8 458.1L362.3 248.3C412.1 230.7 448 183.8 448 128 448 57.3 390.7 0 320 0c-67.1 0-121.5 51.8-126.9 117.4L45.5 3.4C38.5-2 28.5-.8 23 6.2L3.4 31.4c-5.4 7-4.2 17 2.8 22.4l588.4 454.7c7 5.4 17 4.2 22.5-2.8l19.6-25.3c5.4-6.8 4.1-16.9-2.9-22.3zM96 422.4V464c0 26.5 21.5 48 48 48h350.2L207.4 290.3C144.2 301.3 96 356 96 422.4z&quot; style=&quot;fill:#ffffff;&quot;&gt;&lt;/path&gt;&lt;/svg&gt;');
	background-size: 50px;
	background-repeat: no-repeat;
	background-position: 30px center;
}

.textcustom-registrazioneforzata::before {
	content: &quot;Effettuare Login/Registrazione per continuare&quot;;
}

.btn-contanti-icon {
        background-image: url(https://www.hiromicake.it/wp-content/uploads/2020/05/WL_icone_Contanti_white.svg);
        background-size:60px;
        background-repeat:no-repeat;
        background-position: 30px center;
}

.textcustom-contanti::before {
	content: &quot;Paga in contanti al ritiro&quot;;
}

.btn-confermaconsegna-icon {
    background-image:url('data:image/svg+xml;utf8,&lt;svg aria-hidden=&quot;true&quot; focusable=&quot;false&quot; data-prefix=&quot;fas&quot; data-icon=&quot;arrow-circle-right&quot; class=&quot;svg-inline--fa fa-arrow-circle-right fa-w-16&quot; role=&quot;img&quot; xmlns=&quot;http://www.w3.org/2000/svg&quot; viewBox=&quot;0 0 512 512&quot;&gt;&lt;path fill=&quot;currentColor&quot; d=&quot;M256 8c137 0 248 111 248 248S393 504 256 504 8 393 8 256 119 8 256 8zm-28.9 143.6l75.5 72.4H120c-13.3 0-24 10.7-24 24v16c0 13.3 10.7 24 24 24h182.6l-75.5 72.4c-9.7 9.3-9.9 24.8-.4 34.3l11 10.9c9.4 9.4 24.6 9.4 33.9 0L404.3 273c9.4-9.4 9.4-24.6 0-33.9L271.6 106.3c-9.4-9.4-24.6-9.4-33.9 0l-11 10.9c-9.5 9.6-9.3 25.1.4 34.4z&quot; style=&quot;color:white;&quot;&gt;&lt;/path&gt;&lt;/svg&gt;');
	background-size: 50px;
	background-repeat: no-repeat;
	background-position: 30px center;

}
.textcustom-confermaconsegna::before {
	content: &quot;Confermo il mio indirizzo di consegna &quot;;
}

.btn-noteconsegna-icon {
    background-image:url('data:image/svg+xml;utf8,&lt;svg aria-hidden=&quot;true&quot; focusable=&quot;false&quot; data-prefix=&quot;fas&quot; data-icon=&quot;arrow-circle-right&quot; class=&quot;svg-inline--fa fa-arrow-circle-right fa-w-16&quot; role=&quot;img&quot; xmlns=&quot;http://www.w3.org/2000/svg&quot; viewBox=&quot;0 0 512 512&quot;&gt;&lt;path fill=&quot;currentColor&quot; d=&quot;M256 8c137 0 248 111 248 248S393 504 256 504 8 393 8 256 119 8 256 8zm-28.9 143.6l75.5 72.4H120c-13.3 0-24 10.7-24 24v16c0 13.3 10.7 24 24 24h182.6l-75.5 72.4c-9.7 9.3-9.9 24.8-.4 34.3l11 10.9c9.4 9.4 24.6 9.4 33.9 0L404.3 273c9.4-9.4 9.4-24.6 0-33.9L271.6 106.3c-9.4-9.4-24.6-9.4-33.9 0l-11 10.9c-9.5 9.6-9.3 25.1.4 34.4z&quot; style=&quot;color:white;&quot;&gt;&lt;/path&gt;&lt;/svg&gt;');
	background-size: 50px;
	background-repeat: no-repeat;
	background-position: 30px center;

}

.textcustom-noteconsegna::before {
	content: &quot;Conferma Consegna e vai ai metodi di pagamento &quot;;
}

.btn-noteritiro-icon {
        background-image:url(&quot;https://image.deliveryonline.it/default/check_bianco.svg&quot;);
	background-size: 80px;
	background-repeat: no-repeat;
	background-position: 30px center;
}

.textcustom-noteritiro::before {
	content: &quot;Conferma Ritiro e seleziona il metodo di pagamento &quot;;
}

.btn-ritiro-icon {
        background-image:url(&quot;https://image.deliveryonline.it/default/takeaway_bianco.svg&quot;);
	background-size: 80px;
	background-repeat: no-repeat;
	background-position: 30px center;
}

.btn-consegna-icon {
        background-image: url(&quot;https://image.deliveryonline.it/default/furgone.svg&quot;);
	background-size: 60px;
	background-repeat: no-repeat;
	background-position: 30px center;
        fill:white;
}

.btn-sceltaconsegna-icon {
        background-image: url(&quot;https://image.deliveryonline.it/okasan/delivery_white.svg&quot;);
	background-size: 75px;
	background-repeat: no-repeat;
	background-position: 30px center;

}
.textcustom-sceltaconsegna::before {
	content: &quot;Consegna a domicilio&quot;;
}

.btn-carrello-icon {
        background-image:url(&quot;https://image.deliveryonline.it/default/cestino_bianco.svg&quot;);
	background-size: 80px;
	background-repeat: no-repeat;
	background-position: 30px center;
}

.textcustom-carrello::before {
	content: &quot;Conferma Ordine e vai alla Cassa&quot;;
}

.btn-accedi-icon {
            background-image:url('data:image/svg+xml;utf8,&lt;svg xmlns=&quot;http://www.w3.org/2000/svg&quot;   width=&quot;500&quot; height=&quot;500&quot;&gt;&lt;path  d=&quot;M416 448h-84c-6.6 0-12-5.4-12-12v-40c0-6.6 5.4-12 12-12h84c17.7 0 32-14.3 32-32V160c0-17.7-14.3-32-32-32h-84c-6.6 0-12-5.4-12-12V76c0-6.6 5.4-12 12-12h84c53 0 96 43 96 96v192c0 53-43 96-96 96zm-47-201L201 79c-15-15-41-4.5-41 17v96H24c-13.3 0-24 10.7-24 24v96c0 13.3 10.7 24 24 24h136v96c0 21.5 26 32 41 17l168-168c9.3-9.4 9.3-24.6 0-34z&quot; style=&quot;fill:white;&quot;&gt;&lt;/path&gt;&lt;/svg&gt;');
	background-size: 50px;
	background-repeat: no-repeat;
	background-position: 30px center;

}

.textcustom-accedi::before {
	content: &quot;Accedi / Registrati e Conferma ordine&quot;;
}


.btn-sceltaritiro-icon {
    background-image:url(&quot;https://image.deliveryonline.it/okasan/takeaway_white.svg&quot;);
	background-size: 70px;
	background-repeat: no-repeat;
	background-position: 30px center;

}
.textcustom-sceltaritiro::before {
	content: &quot;Ritiro / Asporto&quot;;
}

.btn-success a {
	color: var(--wa-color-primary-contrast);
}


/*----------------------------------------------------------------------------------------------------------------- */
/*--------------------------------------- COLORI PULSANTI (+ HOVER) --------------------------------------- */
/*----------------------------------------------------------------------------------------------------------------- */

/* Round 16 refactor 2026 — pulsanti CTA principali.
 * 21 selettori storici + nuovi (`.bottoneavanti`, `.btn-prodotti`,
 * `.btn-success`, ecc.) condividono lo stile base del bottone primario:
 * fondo `--wa-color-primary`, testo `--wa-color-primary-contrast`, hover
 * `--wa-color-primary-hover`, font `--wa-font-body`. Default sono i
 * valori storici (var(--wa-color-primary), #fff, #333) → zero regressione.
 * Il CSS Editor compila override su `mainBtn_*` (gruppo `main_buttons`,
 * 14 controlli) che vincono per cascata su queste regole. */
.btn-info, .btn-success, .btn-prodotti, .btn-accedi, .bottoneavanti, .bottonedatipersonali, .btn-success, bottoneavanticonsegna, #serviziodisponibile, bottoneavanticonsegna, .registratisubito, .btn-sceltaritiro, .btn-sceltaconsegna, .btn-noteritiro, .btn-noteconsegna, .btn-confermaconsegna, .btn-contanti, .sfondo_menusuperiore .btn-success, .modal-footer .btn-outline-secondary, .btn-registrazioneforzata, .btn-prosegui, .btn-controllospedizione  {
        font-family: var(--wa-font-body);
	color: var(--wa-button-primary-color, var(--wa-color-primary-contrast));
	background-color: var(--wa-button-primary-bg, var(--wa-color-primary));
	border-color: var(--wa-button-primary-bg, var(--wa-color-primary));
        text-transform: uppercase;
        font-size:18px;
        line-height: 20px;
}
/* R32 — hover CTA legacy rimosso (PWA mobile-first); feedback :active in wa-interaction-states.css */

.menu_superiore .btn-info, .menu_superiore .btn-success {
        font-size:16px;
}

.menu_superiore .btn-info:hover, .menu_superiore .btn-success:hover {
        font-size:16px;
}

/*----------------------------------------------------------------------------------------------------------------- */
/*----------------------------------------- PULSANTI + E - CARRELLO ----------------------------------------- */
/*----------------------------------------------------------------------------------------------------------------- */

/* Round 21 refactor 2026 — bottoni quantità carrello (`.fa-plus`/`.fa-minus`).
 * Erano `#6b4a3b` (accent Vorrei Ordinare base) hardcoded → ora derivano dai
 * token globali Terra Premium (`--wa-color-accent` = `#b7793f`). Hover
 * `#b39689` (accent + 30% bianco) → `--wa-color-accent-hover` = `#925c2d`.
 * Tenant con preset esplicito vincono per cascata su queste regole sorgente. */
.fa-plus {
        background-color: var(--wa-color-accent);
        color: var(--wa-color-accent-contrast);
        padding:10px 12px;
        margin-left:9px;
        border-radius:3px;
}

.fa-minus {
        background-color: var(--wa-color-accent);
        color: var(--wa-color-accent-contrast);
        padding:10px 12px;
        border-radius:3px;
}

.fa-plus:hover, .fa-minus:hover {
        background-color: var(--wa-color-accent-hover);
        transition: all 0.5s ease;
}

/*----------------------------------------------------------------------------------------------------------------- */
/*------------------------------------------------ MODAL BOX ------------------------------------------------- */
/*----------------------------------------------------------------------------------------------------------------- */
.modal-header {
	background-color:var(--wa-color-primary);
}

.modal-title{
	color:#fff;
	font-weight:700;
}

.modal-header .close {
    margin:0;
    border-radius: 50%;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-shadow: 0 0 0 #fff; */
    opacity: 1.0;
    border: 4px solid #fff;
    width: 50px;
    height: 50px;
    padding: 0;
    transition: all 0.5s ease;
}

.modal-header .close:hover {
    margin:0;
    border-radius: 50%;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #2f1b11;
    text-shadow: 0 0 0 #fff; */
    opacity: 1.0;
    border: 4px solid #2f1b11;
    width: 50px;
    height: 50px;
    padding: 0;
    transition: all 0.5s ease;
}

.modal-dialog .close {
    opacity: 1.0;
}

.modal-footer .btn-outline-secondary {
    border:0px;
    text-transform:uppercase;
    color:#fff;
    font-size:16px;
    font-weight:700;
padding:5px 10px;
}

.modal-footer .btn-outline-secondary:hover {
    border:0px;
    text-transform:uppercase;
    color:#fff;
}


/*----------------------------------------------------------------------------------------------------------------- */
/*----------------------------------------- DESCRIZIONE ALLERGENI ------------------------------------------ */
/*----------------------------------------------------------------------------------------------------------------- */

.descrizione_allergeni {
        font-size:14px;
	border-color: hsla(0,0%,62%,0.50);
        background-color: rgba(255,255,255,0.7);
        margin-top: 0px;
        margin-bottom: 5px;
}

.descrizione_allergeni:hover {
        border-color:#ccc;
}

/*----------------------------------------------------------------------------------------------------------------- */
/*--------------------------------------- PRODOTTI PERSONALIZZATI ----------------------------------------- */
/*----------------------------------------------------------------------------------------------------------------- */

/* Round 21 refactor 2026 — `.titoliingredienti` titoli sezioni configuratore.
 * Color era `#6b4a3b` → `var(--wa-color-accent)` Terra Premium. */
.titoliingredienti {
        font-family: 'Montserrat', serif;
        font-size: 30px;
        color: var(--wa-color-accent);
        font-weight: 600;
        letter-spacing: -1px;
        line-height: 28px;
}
.sfondosceltapizze{
	background-color: white;
       display: block;
}

.frasespot {
        display:none;
}

.domandaaggiunta {
    margin-bottom: 12px;
    width: 100%;
    height: 47px;
    color: red;
    font-weight: bold;
    padding-left: 20px;
    color: #171717;
}

#provacomposizione {
        font-weight:700;
}

/*----------------------------------------------------------------------------------------------------------------- */
/*------------------------------------------ STILE NOMI PRODOTTI -------------------------------------------- */
/*----------------------------------------------------------------------------------------------------------------- */

/* Round 21 refactor 2026 — nomi prodotto (lista + scheda + carrello).
 * Color era `#809207` (verde brand legacy preset) → `var(--wa-color-text)`
 * Terra Premium per leggibilità su qualunque preset. Schema editor
 * `prodName_color` (gruppo product_card) compila override quando il
 * tenant personalizza. Su Terra Premium default si mantiene il testo
 * principale del tema. */
.pizzatitolo_desk, .nome_prodotto, .pizzatitolo, .nomeprodottocarrello {
        font-family: var(--wa-font-heading);
        font-size:28px;
        color: var(--wa-text-color, var(--wa-color-text));
        text-transform: uppercase;
        font-weight: var(--wa-heading-weight, 700);
        letter-spacing: var(--wa-heading-letter-spacing, -0.02em);
        line-height:34px;
        margin-top:10px;
        display:inline-block;
}

.nomeprodottocarrello {
        font-size:16px;
}

/*----------------------------------------------------------------------------------------------------------------- */
/*------------------------------------------------ STILE PREZZI ------------------------------------------------- */
/*----------------------------------------------------------------------------------------------------------------- */

/* Round 21 refactor 2026 — prezzi prodotto (8 selettori condivisi).
 * Color era `#6b4a3b` (accent Vorrei Ordinare base) → `var(--wa-color-accent)`
 * Terra Premium (`#b7793f` arancio rame). Schema editor `prodPrice_color`
 * (gruppo product_card) compila override sui tenant. */
.costounita, .costounita span, .costodecimali, .costodecimali span, .simboloeuro, .prezzopizza, .prezzoscheda, .totalecifre {
        font-family: var(--wa-font-body);
        font-size: 35px;
        color: var(--wa-price-color, var(--wa-color-accent));
        font-weight: var(--wa-price-weight, 700);
        letter-spacing: -1px;
}

.prezzoscheda {
        font-size: 26px;
}

.totalecifre {
        font-size: 45px;
}

/*----------------------------------------------------------------------------------------------------------------- */
/*----------------------------------------------- TITOLI PAGINE ------------------------------------------------ */
/*----------------------------------------------------------------------------------------------------------------- */

/* Round 21 refactor 2026 — titoli pagine login/account legacy.
 * R29 update: line-height passa da `24px` fisso a `var(--wa-line-tight)`
 * per evitare clipping su preset con scale font diverse. Color resta
 * `--wa-color-accent` (Terra Premium su Pizzeria, oro/altro su preset). */
.titolologin, .titolologin_nome {

        font-family: var(--wa-font-heading);
        margin-top: 40px;
        color: var(--wa-color-accent);
        font-size: 26px;
        font-weight: 700;
        letter-spacing: -1px;
        text-transform: uppercase;
        line-height: var(--wa-line-tight);
        display:inline-block;
}

.titolologin {
        display:inline;
}

/*----------------------------------------------------------------------------------------------------------------- */
/*---------------------------------------- DROPDOWN MENU DIVIDER ---------------------------------------- */
/*----------------------------------------------------------------------------------------------------------------- */
li.d-md-none.d-lg-none {
	border-top: 1px solid #febb4d;
	padding-top: 15px;
	padding-bottom: 15px;
}						  							  					  							  					  							  

/*----------------------------------------------------------------------------------------------------------------- */
/*---------------------------------------- MOBILE MENU HAMBURGER ---------------------------------------- */
/*----------------------------------------------------------------------------------------------------------------- */
.navigation-clean .navbar-toggler {
        font-family: 'Montserrat', serif;
	border-color:#2f1b11;
	 color:#2f1b11;
        font-weight:600;
}	

/* QUESTA IMMAGINE VA CREATA IN BASE AL COLORE */
.navbar-light .navbar-toggler-icon {
        background-image: url(&quot;https://image.deliveryonline.it/demo/mobile_menu_thin_2f1b11.svg&quot;);
}

#bloccoconsegna {
        margin-top:30px;
}

/*----------------------------------------------------------------------------------------------------------------- */
/*-------------------------------------------------- BANNER HP ------------------------------------------------ */
/*----------------------------------------------------------------------------------------------------------------- */
.banner-hp img {
        width:100%;
        border-radius:10px;
        margin-bottom:40px;
}

@media only screen and (max-width: 767px) {

.banner-hp img {
        margin-bottom:0px;}
}




/*********************************************************************************************************/
/***************************************  FINE PARTE CUSTOM ** ***************************************/
/*********************************************************************************************************/

#base900210 {
  display: none;
}
.base900210-371 {
  display: block;
}


/*********************************************************************************************************/
/*********************************************************************************************************/
/****** COMPONENTE PRODOTTO / CONFIGURATORE (classi fp-*)                                          ******/
/****** Usato da: preview dashboard + pagina prodotto web_app cliente                              ******/
/****** Questo blocco è la BASE CONDIVISA che un futuro editor CSS dovrà poter governare.          ******/
/****** Le classi fp-* sono auto-contenute (namespaced). Non collidono col resto.                  ******/
/*********************************************************************************************************/
/*********************************************************************************************************/

@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@500;600;700&display=swap');

/* ── Galleria prodotto ── */
.fp-gallery {
    position: relative;
    background: #111;
    text-align: center;
}

.fp-gallery-main {
    min-height: 200px;
    max-height: 380px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.fp-gallery-img {
    max-width: 100%;
    max-height: 380px;
    width: auto;
    height: auto;
    object-fit: contain;
    display: block;
    margin: 0 auto;
}

.fp-gallery-placeholder {
    color: rgba(255, 255, 255, 0.35);
    font-size: 4rem;
    padding: 3rem;
}

.fp-gallery-thumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
    padding: 10px 12px 14px;
    background: rgba(0, 0, 0, 0.35);
}

.fp-gallery-thumb {
    padding: 0;
    border: 2px solid rgba(255, 255, 255, 0.35);
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
    background: #000;
    width: 72px;
    height: 60px;
    transition: border-color 0.15s;
}

.fp-gallery-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.fp-gallery-thumb.is-active,
.fp-gallery-thumb:hover {
    border-color: #60a5fa;
}

/* ── Layout 3 colonne prodotto ── */
.fp-page {
    max-width: 1200px;
    margin: 0 auto;
    padding-bottom: 5rem;
    box-shadow: 0 0 40px rgba(0, 0, 0, 0.06);
}

.fp-body {
    background: #fff;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.04);
}

.fp-container {
    max-width: 1140px;
    margin: 0 auto;
    padding: 0 12px;
}

.fp-columns {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
}

@media (min-width: 992px) {
    .fp-columns {
        grid-template-columns: minmax(240px, 1fr) minmax(280px, 1.2fr) minmax(220px, 0.9fr);
        gap: 0;
    }
}

.fp-col {
    padding: 18px 12px;
    border-bottom: 1px solid #eee;
}

@media (min-width: 992px) {
    .fp-col {
        border-bottom: none;
        border-right: 1px solid #eee;
        padding: 22px 16px;
    }
    .fp-col:last-child {
        border-right: none;
    }
}

/* ── Header prodotto ── */
.fp-product-name {
    font-family: var(--wa-font-heading);
    font-size: 1.65rem;
    font-weight: var(--wa-heading-weight, 700);
    text-transform: uppercase;
    color: #2c2c2c;
    margin: 0 0 6px;
    line-height: 1.15;
    letter-spacing: -0.02em;
}

.fp-product-baseprice {
    font-size: 0.95rem;
    color: #444;
    margin-bottom: 6px;
}
.fp-product-baseprice strong {
    font-size: 1.15rem;
    color: #1a1a1a;
}

.fp-product-cat {
    font-size: 0.8rem;
    text-transform: uppercase;
    color: #888;
    margin-bottom: 8px;
}

.fp-product-desc {
    color: #444;
    font-size: 0.95rem;
    margin: 0 0 12px;
}

/* ── Pulsante allergeni ──
 * Round 17 refactor 2026 — `.fp-allergen-btn` ha schema editor parziale
 * (`detail_allergenBg/Fg/Rad`), border + hover coperti dai token globali
 * `--wa-color-danger-{bg,fg}` come fallback. Default identici al pre-R17:
 * `#fef2f2` ≈ `rgba(220,53,69,0.12)` (delta cromatico minimo, lieve
 * intensificazione ma stessa famiglia rossa pastello), `#991b1b` ≈
 * `var(--wa-color-danger-fg)` `#721c24` (delta cromatico minimo).
 * Lo `.fp-aller-count` (badge contatore) usa `--wa-badge-aller-bg/fg`
 * (vedi gruppo CSS Editor `product_detail_allergen_count`, 2 field). */
.fp-allergen-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    border: 1px solid var(--wa-allergen-btn-border, var(--wa-color-danger));
    border-radius: 8px;
    background: var(--wa-allergen-btn-bg, var(--wa-color-danger-bg));
    font-size: 14px;
    cursor: pointer;
    margin-top: 8px;
    color: var(--wa-allergen-btn-fg, var(--wa-color-danger-fg));
    transition: border-color 0.15s, background 0.15s;
}

.fp-allergen-btn i,
.fp-allergen-btn .bi {
    color: currentColor;
}

.fp-allergen-btn:hover {
    border-color: var(--wa-allergen-accent, var(--wa-color-danger));
    background: var(--wa-allergen-btn-bg, var(--wa-color-danger-bg));
}

.fp-aller-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.5rem;
    height: 1.5rem;
    padding: 0 6px;
    border-radius: 999px;
    background: var(--wa-allergen-count-bg, var(--wa-color-danger));
    color: var(--wa-allergen-count-fg, var(--wa-color-inverse));
    font-size: 12px;
    font-weight: 700;
}

/* ── Ingredienti inclusi ── */
/* Round 17b refactor 2026 — Configuratore prodotto, sezione "Ingredienti
 * inclusi". Tutti i colori migrati ai token globali R16. Verde
 * (`#16a34a`) = `--wa-color-success` (ingrediente attivo), rosso
 * (`#b91c1c`/`#dc2626`) = `--wa-color-danger` (rimosso, line-through),
 * grigi (`#333`/`#999`) = `text/muted`. Border-bottom decorativo (`#f3f3f3`)
 * usa `--wa-color-border` per coerenza col tema. */
.fp-included-title {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--wa-color-text);
    margin: 18px 0 6px;
}

.fp-included-hint {
    font-size: 13px;
    color: var(--wa-color-muted);
    margin-bottom: 10px;
}

.fp-included-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 0;
    cursor: pointer;
    border-bottom: 1px solid var(--wa-color-border);
}

.fp-included-item.is-removed {
    opacity: 0.65;
}

.fp-included-item.is-removed .fp-included-name {
    text-decoration: line-through;
    color: var(--wa-color-danger);
}

.fp-included-icon {
    color: var(--wa-color-success);
    font-size: 1.1rem;
    flex-shrink: 0;
}

.fp-included-item.is-removed .fp-included-icon {
    color: var(--wa-color-danger);
}

/* ── Sezioni (single + multi) ──
 * Round 17b refactor 2026 — Configuratore prodotto: titoli, hint, badge,
 * select, opzioni multi/single. Tutti i grigi `#333`/`#888`/`#444` →
 * `text/muted`. Badge "richiesto" (`#1e293b` quasi-nero) → `--wa-color-text`
 * + `--wa-color-inverse`. Badge "multi" (blu Tailwind 500) → token globali
 * `--wa-color-info-{bg,fg}` semantici. `.fp-sez-option` (selectable card
 * variante prodotto) ora usa `--wa-color-info` per active state — distinto
 * dal verde di `.wa-checkout-time-option` perché la semantica è diversa
 * ("selezione in lista" vs "scelta confermata"). */
.fp-custom-title {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--wa-color-text);
    margin-bottom: 14px;
}

.fp-sez {
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--wa-color-border);
}

.fp-sez-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
}

.fp-sez-title {
    font-weight: 700;
    font-size: 1.05rem;
    color: var(--wa-color-text);
}

.fp-sez-hint {
    font-size: 12px;
    color: var(--wa-color-muted);
    margin-bottom: 10px;
}

.fp-sez-badge {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    padding: 3px 8px;
    border-radius: 4px;
}

.fp-sez-badge--single {
    /* Round 17b — `rgba(44,44,44,0.1)` → `--wa-color-border` (tinta neutra
     * trasparente coerente). `#444` (testo grigio scuro) → `--wa-color-muted`. */
    background: var(--wa-color-border);
    color: var(--wa-color-muted);
}

.fp-sez-badge--multi {
    /* Round 17b — blu info tema (era Tailwind 600 hardcoded). */
    background: var(--wa-color-info-bg);
    color: var(--wa-color-info-fg);
}

.fp-sez-badge--req {
    /* Round 17b — badge "richiesto": era nero quasi puro (`#1e293b`),
     * ora usa il `text` del tema (preset-aware: scuro su preset chiari,
     * chiaro su preset scuri) + `inverse` per il testo. */
    background: var(--wa-color-text);
    color: var(--wa-color-inverse);
}

.fp-sez-select {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--wa-color-border);
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    background: var(--wa-color-surface);
}

.fp-sez-select.is-active {
    border-color: var(--wa-color-info);
    box-shadow: 0 0 0 2px var(--wa-color-info-bg);
}

.fp-sez-options {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.fp-sez-option {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border: 1px solid var(--wa-option-row-border, var(--wa-color-border));
    border-radius: 8px;
    cursor: pointer;
    margin: 0;
    background: var(--wa-option-row-bg, var(--wa-color-surface-soft));
    color: var(--wa-option-row-color, inherit);
    transition: background 0.12s, border-color 0.12s;
}

.fp-sez-option:hover {
    /* Hover usa `surface-soft` ma più desaturato verso text (=mix soft).
     * Pre-R17b era `#f3f3f3` literal. Il nuovo valore è coerente col tema
     * tenant — su preset scuri diventa lievemente più scuro del normal. */
    background: color-mix(in srgb, var(--wa-option-row-bg, var(--wa-color-surface-soft)) 88%, var(--wa-color-text) 12%);
}

.fp-sez-option.is-active {
    border-color: var(--wa-option-row-selected-border, var(--wa-color-accent));
    background: var(--wa-option-row-selected-bg, var(--wa-color-accent-soft, var(--wa-color-surface-soft)));
    color: var(--wa-option-row-selected-color, inherit);
}

.fp-sez-option input {
    margin: 0;
    flex-shrink: 0;
}

.fp-sez-option-name {
    flex: 1;
    min-width: 120px;
    font-weight: 500;
}

.fp-sez-option-price {
    font-weight: 700;
    color: var(--wa-option-extra-price-color, var(--wa-color-accent, var(--wa-color-success)));
    font-size: 0.9rem;
}

.fp-sez-option-suggested {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    /* Round 17b — badge "Suggerito": warning bg/fg semantici. Era
     * `#fff8e1` (warning-bg molto soft) / `#b45309` (Tailwind orange 700).
     * Delta cromatico minimo, tema-coerente. */
    background: var(--wa-color-warning-bg);
    color: var(--wa-color-warning-fg);
    padding: 2px 6px;
    border-radius: 4px;
}

.fp-sez-option-included {
    font-size: 11px;
    /* Round 17b — `--wa-color-muted` (era `#6b7280` Tailwind gray 500,
     * praticamente identico al token globale). */
    color: var(--wa-color-muted);
    font-style: italic;
}

.fp-sez--single .fp-sez-select option {
    font-weight: 400;
}

/* ── Accordion (gruppi separator) ── */
.fp-acc-group {
    margin-bottom: 8px;
    border: 1px solid #e5e5e5;
    border-radius: 8px;
    overflow: hidden;
}

/* Round 21 refactor 2026 — accordion sezioni configuratore prodotto.
 * Era `#f4f4f5` hardcoded (grigio chiaro neutro) → `--wa-color-surface-soft`
 * Terra Premium (`#f1e8dc` beige caldo). Su preset 50/50 il delta è
 * cromaticamente impercettibile (entrambi grigio chiaro/beige). */
.fp-acc-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    background: var(--wa-color-surface-soft);
    cursor: pointer;
    font-weight: 600;
    font-size: 13px;
}

.fp-acc-arrow {
    width: 1.2rem;
    flex-shrink: 0;
}

.fp-acc-name {
    flex: 1;
}

.fp-acc-body {
    padding: 8px;
    background: #fff;
}

.fp-acc-no-header {
    border: none;
    padding: 0;
}

.fp-acc-count {
    font-size: 12px;
    color: #999;
}

/* ── Riepilogo / summary ── */
.fp-summary {
    position: sticky;
    top: 52px;
}

.fp-summary-label {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--wa-muted-color, var(--wa-color-muted));
    margin-top: 18px;
}

.fp-summary-price {
    font-size: 2.25rem;
    font-weight: var(--wa-price-weight, 800);
    color: var(--wa-price-color, var(--wa-color-accent));
    line-height: 1.1;
    margin: 4px 0 16px;
}

.fp-note-label {
    display: block;
    font-size: 13px;
    color: #888;
    margin-bottom: 6px;
}

.fp-note-input {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #ccc;
    border-radius: 8px;
    font-size: 14px;
    box-sizing: border-box;
    margin-bottom: 12px;
    resize: vertical;
    min-height: 4.5rem;
}

/* Round 17 refactor 2026 — `.fp-cart-btn` è già membro di MAIN_BTN_SELECTORS
 * (schema editor `mainBtn_*` 14 field) → CSS Editor compila override su
 * questo selettore. Le regole sorgente qui sotto usano i token globali
 * `--wa-color-primary*` come default per coerenza con il tema base R16
 * (zero regressione: `var(--wa-color-primary)` / `#fff` / `#4a2820` storico = identico a
 * `--wa-color-primary` / `--wa-color-primary-contrast`; `#4a2820` ≈
 * `--wa-color-primary-hover` `#5a3f32`, delta cromatico impercettibile). */
.fp-cart-btn {
    width: 100%;
    padding: 14px 16px;
    border: none;
    border-radius: var(--wa-radius-button, 8px);
    background: var(--wa-cta-confirm-bg, var(--wa-color-primary));
    color: var(--wa-cta-confirm-color, var(--wa-color-primary-contrast));
    border: 1px solid var(--wa-cta-confirm-border, var(--wa-color-primary));
    font-family: var(--wa-font-body);
    font-size: 15px;
    font-weight: var(--wa-button-weight, 700);
    text-transform: uppercase;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: background 0.15s;
    box-shadow: var(--wa-shadow-button, none);
    min-height: var(--wa-control-height, 48px);
}

.fp-cart-btn:hover {
    background: var(--wa-cta-confirm-hover-bg, var(--wa-color-primary-hover));
}

@media (max-width: 991.98px) {
    .fp-summary {
        position: static;
    }
}

/* ── Mobile footer (CTA mobile) ── */
.fp-mobile-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 10px 14px;
    background: var(--wa-color-surface);
    border-top: 1px solid var(--wa-color-border);
    box-shadow: 0 -4px 16px var(--wa-color-shadow);
    z-index: 900;
}

@media (min-width: 992px) {
    .fp-mobile-footer {
        display: none;
    }
}

.fp-mobile-footer-price {
    font-size: 1.25rem;
    font-weight: var(--wa-price-weight, 800);
    color: var(--wa-price-color, var(--wa-color-accent));
}

/* Round 17 refactor 2026 — CTA mobile sticky scheda prodotto. Schema
 * editor `detail_mobileFooterBtnBg/Fg` (gruppo `product_detail_summary`)
 * + MAIN_BTN_SELECTORS via `.wa-embed-preview .fp-mobile-footer-btn`.
 * Il sorgente ora usa i token globali primary come fallback. */
.fp-mobile-footer-btn {
    padding: 10px 18px;
    border: none;
    border-radius: var(--wa-radius-button, 8px);
    background: var(--wa-cta-confirm-bg, var(--wa-color-primary));
    color: var(--wa-cta-confirm-color, var(--wa-color-primary-contrast));
    border: 1px solid var(--wa-cta-confirm-border, var(--wa-color-primary));
    font-family: var(--wa-font-body);
    font-weight: var(--wa-button-weight, 700);
    cursor: pointer;
    transition: background 0.15s;
    box-shadow: var(--wa-shadow-button, none);
    min-height: var(--wa-control-height, 44px);
}

.fp-mobile-footer-btn:hover {
    background: var(--wa-cta-confirm-hover-bg, var(--wa-color-primary-hover));
}

/* ── Comanda (ticket cucina) ── */
.fp-comanda-section {
    padding: 28px 0 40px;
}

.fp-cmd-ticket {
    max-width: 520px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

.fp-cmd-header {
    background: #1a1a1a;
    color: #fff;
    padding: 12px 16px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}

.fp-cmd-body {
    padding: 16px 18px;
    font-family: 'Courier New', Courier, monospace;
    font-size: 13px;
    line-height: 1.65;
}

.fp-cmd-name {
    font-size: 1.05rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 10px;
}

.fp-cmd-empty {
    color: #888;
    font-style: italic;
    margin: 8px 0;
}

.fp-cmd-line {
    margin: 6px 0;
}

.fp-cmd-cat {
    font-weight: 700;
    text-transform: uppercase;
    margin-right: 4px;
}

.fp-cmd-line--togli {
    color: #b91c1c;
}

.fp-cmd-inc {
    color: #16a34a;
    font-weight: 600;
}

.fp-cmd-total {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 2px solid #333;
    text-align: right;
    font-weight: 800;
    font-size: 15px;
}

/* Vetrina cliente — scheda prodotto: niente anteprima ticket cucina (solo staff/backoffice se riusata altrove) */
.wa-product-shell.wa-embed-preview .fp-comanda-section,
.wa-product-shell.wa-embed-preview .fp-cmd-ticket {
    display: none !important;
}

/* ── Modale allergeni ── */
.fp-modal {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 16px;
}

.fp-modal.is-open {
    display: flex;
}

.fp-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
}

.fp-modal-dialog {
    position: relative;
    background: var(--wa-fp-modal-bg, #ffffff);
    color: var(--wa-fp-modal-fg, #1f120b);
    border-radius: 12px;
    max-width: 480px;
    width: 100%;
    max-height: 85vh;
    overflow: auto;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25);
    /* Tema scuro: dentro il pannello bianco i token testo devono restare leggibili */
    --wa-color-text: var(--wa-fp-modal-fg, #1f120b);
    --wa-color-muted: var(--wa-fp-modal-muted-fg, #475569);
    --wa-text-color: var(--wa-fp-modal-fg, #1f120b);
    --wa-app-color: var(--wa-fp-modal-fg, #1f120b);
}

.fp-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    border-bottom: 1px solid var(--wa-fp-modal-border, #eee);
}

.fp-modal-header h5 {
    margin: 0;
    font-size: 1rem;
    color: var(--wa-fp-modal-fg, #1f120b);
}

.fp-modal-close {
    border: none;
    background: none;
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
    color: var(--wa-fp-modal-muted-fg, var(--wa-color-muted, #64748b));
}

.fp-modal-body {
    padding: 14px 16px;
    color: var(--wa-fp-modal-fg, #1f120b);
}

.fp-modal-footer {
    padding: 12px 16px;
    border-top: 1px solid var(--wa-fp-modal-border, #eee);
    text-align: right;
}

.fp-modal-footer button {
    padding: 8px 16px;
    border-radius: 8px;
    border: 1px solid var(--wa-fp-modal-btn-border, #ccc);
    background: var(--wa-fp-modal-btn-bg, #fff);
    color: var(--wa-fp-modal-fg, #1f120b);
    cursor: pointer;
    font-weight: 600;
}

/* Round 21 refactor 2026 — modale allergeni configuratore prodotto.
 * `.fp-aller-hint` testo info: `#666` → `--wa-color-muted`.
 * `.fp-aller-group-title` titoli sezione: `#1e293b` → `--wa-color-text`. */
.fp-aller-hint {
    font-size: 13px;
    color: var(--wa-fp-modal-muted-fg, var(--wa-color-muted, #475569));
    margin-bottom: 12px;
}

.fp-aller-hint strong {
    color: var(--wa-fp-modal-fg, var(--wa-color-text, #1f120b));
}

.fp-aller-group-title {
    font-weight: 700;
    font-size: 13px;
    margin: 14px 0 8px;
    color: var(--wa-fp-modal-fg, var(--wa-color-text, #1f120b));
}

.fp-aller-group--scelte .fp-aller-group-title {
    color: #b45309;
}

.fp-aller-group--diretti .fp-aller-group-title {
    color: #991b1b;
}

.fp-aller-row {
    padding: 8px 0;
    border-bottom: 1px solid #f0f0f0;
    font-size: 14px;
}

.fp-aller-name {
    font-weight: 600;
    color: #991b1b;
}

.fp-aller-source {
    display: block;
    font-size: 12px;
    color: var(--wa-fp-modal-muted-fg, #64748b);
    margin-top: 2px;
}

.fp-aller-source i {
    font-size: 0.72rem;
    opacity: 0.6;
}

.fp-aller-icon {
    font-size: 11px;
    text-transform: lowercase;
    margin-right: 4px;
}

.fp-aller-empty {
    color: var(--wa-fp-modal-muted-fg, #64748b);
    font-size: 14px;
}

/* ── Extra / below ── */
.fp-below {
    background: #fff;
    padding: 16px 0 24px;
    border-top: 1px solid #eee;
}

/* ── Loading generico (nascosto in web_app) ── */
.fp-loading--hidden {
    display: none;
}

.fp-loading {
    margin: 1rem auto;
    max-width: 520px;
    padding: 1.25rem 1.5rem;
    border-radius: 10px;
    text-align: center;
    background: #fff;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.fp-loading.fp-error {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #991b1b;
}

.fp-loading.fp-error strong {
    display: block;
    margin: 0.5rem 0 0.25rem;
}

.fp-loading.fp-error span {
    display: block;
    font-size: 0.9rem;
    margin-bottom: 0.75rem;
}

.fp-loading-back,
.fp-loading-back:visited {
    color: #2563eb;
    font-weight: 600;
}

/* ── WEB_APP: checkout verifica orario + area cliente + flash ── */
.wa-flash-global {
    max-width: 720px;
    margin: 0.75rem auto 1rem;
    border-radius: 10px;
}

.wa-topbar-user {
    font-weight: 600;
    margin-right: 0.35rem;
}

.wa-topbar-account,
.wa-topbar-orders,
.wa-topbar-login,
.wa-topbar-register,
.wa-topbar-logout {
    margin: 0 0.2rem;
    font-size: 0.9rem;
}

.wa-checkout-gate-card .wa-checkout-msg.wa-auth-msg {
    margin-left: 0;
    margin-right: 0;
    max-width: none;
    text-align: left;
}

.wa-auth-msg--inline-links a {
    font-weight: 600;
    text-decoration: underline;
}

.wa-auth-recovery-next {
    margin-top: 0.75rem;
    text-align: center;
}

.wa-checkout-auth-resume {
    text-align: center;
}

.wa-nav-register {
    font-weight: 600;
}

.wa-nav-greeting {
    font-weight: 600;
    color: var(--wa-color-success-fg);
}

.wa-nav-logout {
    color: var(--wa-color-danger);
}

/* Round 18 cleanup 2026 — rimosse 3 regole CSS dead `.wa-nav-cart-mobile`,
 * `.wa-nav-cart-mobile:hover`, `.wa-nav-cart-badge`. Confermate morte da
 * audit pre-round R18 (zero match in PHP/JS/HTML/PHTML del workspace,
 * markup rimosso da `nav.php` da R3 quando il carrello è migrato a
 * topbar desktop + bottombar mobile). */

.wa-cart-cta-guest {
    background: var(--wa-color-primary);
    border-color: var(--wa-color-primary);
}
.wa-cart-cta-guest:hover {
    background: var(--wa-color-primary-hover);
    border-color: var(--wa-color-primary-hover);
}

.wa-confirm-btn-ordini {
    display: inline-block;
    margin-top: 12px;
    font-size: 14px;
}

.wa-lucy-overlay {
    position: fixed;
    inset: 0;
    z-index: 1080;
    background: rgba(15, 23, 42, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
}

.wa-lucy-overlay.wa-hidden {
    display: none;
}

.wa-lucy-overlay-card {
    max-width: 420px;
    width: 100%;
    background: #fff;
    border-radius: 16px;
    padding: 2rem 1.75rem;
    text-align: center;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.2);
    animation: wa-lucy-card-pulse 2s ease-in-out infinite;
}

@keyframes wa-lucy-card-pulse {
    0%, 100% { box-shadow: 0 20px 50px rgba(0, 0, 0, 0.2); }
    50% { box-shadow: 0 20px 50px rgba(0, 0, 0, 0.12), 0 0 0 4px rgba(90, 58, 34, 0.08); }
}

.wa-lucy-spinner {
    width: 48px;
    height: 48px;
    margin: 0 auto 1.25rem;
    border-radius: 50%;
    border: 4px solid #e5e7eb;
    border-top-color: #5a3a22;
    animation: wa-lucy-spin 0.85s linear infinite;
}

@keyframes wa-lucy-spin {
    to { transform: rotate(360deg); }
}

.wa-lucy-overlay-title {
    font-family: Oswald, 'Montserrat', sans-serif;
    font-size: 1.35rem;
    font-weight: 700;
    margin: 0 0 0.5rem;
    color: #1c1917;
}

.wa-lucy-overlay-sub {
    margin: 0;
    font-size: 0.95rem;
    color: #57534e;
}

.wa-lucy-experience {
    max-width: 640px;
    margin: 0 auto;
}

.wa-lucy-hero {
    text-align: center;
    margin-bottom: 1.5rem;
    padding: 1.25rem 1rem 1rem;
    background: linear-gradient(180deg, var(--wa-color-surface-soft) 0%, var(--wa-color-surface) 100%);
    border-radius: 14px;
    border: 1px solid var(--wa-color-border);
}

.wa-lucy-hero--response {
    background: linear-gradient(180deg, var(--wa-color-success-bg) 0%, var(--wa-color-surface) 100%);
    border-color: var(--wa-color-success);
}

.wa-lucy-hero-kicker {
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--wa-color-muted);
    margin: 0 0 0.35rem;
}

.wa-lucy-hero-title {
    font-family: Oswald, 'Montserrat', sans-serif;
    font-size: 1.65rem;
    font-weight: 700;
    margin: 0 0 0.5rem;
    color: var(--wa-color-text);
}

.wa-lucy-hero-lead {
    margin: 0;
    font-size: 1rem;
    line-height: 1.45;
}

.wa-lucy-hero-sub {
    margin: 0.75rem 0 0;
    font-size: 0.92rem;
}

.wa-lucy-form-card {
    background: var(--wa-card-bg);
    border: 1px solid var(--wa-card-border);
    border-radius: var(--wa-card-radius);
    padding: 1.25rem 1.1rem 0.5rem;
    margin-bottom: 1rem;
    box-shadow: var(--wa-shadow-sm);
}

.wa-lucy-verify-btn--primary {
    text-transform: none;
    font-size: 1.05rem;
    padding-top: 0.85rem;
    padding-bottom: 0.85rem;
}

.wa-lucy-alt-btn--big {
    font-size: 1.15rem;
    padding: 0.9rem 1rem;
    width: 100%;
    max-width: 320px;
}

/* ---------------------------------------------------------------------------
 * Checkout — scelta ASAP/scheduled + form data/orario (R23b)
 * Spostato da checkout.php inline; token Terra Premium / selectable.
 * --------------------------------------------------------------------------- */
.wa-checkout-time-choice {
	margin: 0 0 1.1rem;
	padding: 0;
}
.wa-checkout-time-choice__title {
	font-size: 1.05rem;
	font-weight: 700;
	margin: 0 0 0.7rem;
	color: var(--wa-color-text);
	line-height: 1.3;
}
.wa-checkout-time-choice__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0.55rem;
}
@media (min-width: 576px) {
	.wa-checkout-time-choice__grid { grid-template-columns: 1fr 1fr; }
}
.wa-checkout-time-option {
	display: flex;
	align-items: flex-start;
	gap: 0.7rem;
	width: 100%;
	text-align: left;
	padding: 0.85rem 1rem;
	border: 2px solid var(--wa-selectable-border);
	background: var(--wa-selectable-bg);
	border-radius: var(--wa-radius-md);
	cursor: pointer;
	transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.12s ease;
	font: inherit;
	color: inherit;
	-webkit-appearance: none;
	appearance: none;
}
.wa-checkout-time-option:focus-visible {
	outline: 3px solid var(--wa-color-primary);
	outline-offset: 2px;
}
.wa-checkout-time-option:disabled {
	opacity: 0.55;
	cursor: not-allowed;
}
.wa-checkout-time-option.is-active {
	border-color: var(--wa-selectable-active-border);
	background: var(--wa-selectable-active-bg);
	color: var(--wa-selectable-active-fg);
	box-shadow: 0 0 0 3px var(--wa-color-primary-soft);
}
.wa-checkout-time-option__icon {
	flex-shrink: 0;
	width: 2.2rem;
	height: 2.2rem;
	border-radius: var(--wa-radius-sm);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.2rem;
	line-height: 1;
	background: var(--wa-color-surface-soft);
}
.wa-checkout-time-option.is-active .wa-checkout-time-option__icon {
	background: var(--wa-color-primary-soft);
}
.wa-checkout-time-option__body {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	flex: 1;
	min-width: 0;
}
.wa-checkout-time-option__title {
	font-size: 0.98rem;
	font-weight: 700;
	line-height: 1.3;
	color: inherit;
	hyphens: manual;
	-webkit-hyphens: manual;
	word-break: normal;
	overflow-wrap: normal;
}
.wa-checkout-time-option__text {
	font-size: 0.85rem;
	line-height: 1.5;
	color: var(--wa-color-muted);
	hyphens: manual;
	-webkit-hyphens: manual;
	word-break: normal;
	overflow-wrap: break-word;
}
.wa-checkout-time-option.is-active .wa-checkout-time-option__text {
	color: var(--wa-color-text);
}

/* R26c — checkout step 1: scelta servizio (ritiro accent / delivery primary) */
.wa-checkout-service-grid {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	max-width: 34rem;
	margin: 0 auto;
	width: 100%;
}
.wa-checkout-servizio-stack .wa-checkout-servizio-form {
	margin: 0;
}
.wa-checkout-service-card {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	width: 100%;
	min-height: 3.25rem;
	text-align: left;
	padding: 0.9rem 1rem;
	border: 2px solid var(--wa-selectable-border, var(--wa-color-border));
	background: var(--wa-selectable-bg, var(--wa-color-surface));
	border-radius: var(--wa-radius-md);
	cursor: pointer;
	transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease, transform 0.12s ease;
	font: inherit;
	color: var(--wa-color-text);
	-webkit-appearance: none;
	appearance: none;
	box-shadow: none;
}
.wa-checkout-service-card:focus-visible {
	outline: 3px solid var(--wa-color-primary);
	outline-offset: 2px;
}
.wa-checkout-service-card--pickup {
	border-color: var(--wa-color-accent);
}
.wa-checkout-service-card--pickup:focus-visible {
	outline-color: var(--wa-color-accent);
}
.wa-checkout-service-card--pickup .wa-checkout-service-card__icon {
	color: var(--wa-color-accent);
	background: var(--wa-color-accent-soft);
}
.wa-checkout-service-card--delivery {
	border-color: var(--wa-color-primary);
}
.wa-checkout-service-card--delivery .wa-checkout-service-card__icon {
	color: var(--wa-color-primary);
	background: var(--wa-color-primary-soft);
}
.wa-checkout-service-card--pickup.is-selected,
.wa-checkout-service-card--pickup:active {
	border-color: var(--wa-color-accent);
	background: var(--wa-color-accent-soft);
	box-shadow: 0 0 0 3px var(--wa-color-accent-soft);
}
.wa-checkout-service-card--pickup.is-selected .wa-checkout-service-card__text,
.wa-checkout-service-card--pickup:active .wa-checkout-service-card__text {
	color: var(--wa-color-text);
}
.wa-checkout-service-card--delivery.is-selected,
.wa-checkout-service-card--delivery:active {
	border-color: var(--wa-color-primary);
	background: var(--wa-color-primary-soft);
	box-shadow: 0 0 0 3px var(--wa-color-primary-soft);
}
.wa-checkout-service-card--delivery.is-selected .wa-checkout-service-card__text,
.wa-checkout-service-card--delivery:active .wa-checkout-service-card__text {
	color: var(--wa-color-text);
}
.wa-checkout-service-card.is-selected {
	position: relative;
	padding-right: 2.5rem;
}
.wa-checkout-service-card.is-selected::after {
	content: '\2713';
	position: absolute;
	top: 0.85rem;
	right: 0.9rem;
	font-size: 1rem;
	font-weight: 700;
	line-height: 1;
	color: inherit;
}
.wa-checkout-service-card--pickup.is-selected::after {
	color: var(--wa-color-accent);
}
.wa-checkout-service-card--delivery.is-selected::after {
	color: var(--wa-color-primary);
}
.wa-checkout-service-card__icon {
	flex-shrink: 0;
	width: 2.35rem;
	height: 2.35rem;
	border-radius: var(--wa-radius-sm);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.15rem;
	line-height: 1;
}
.wa-checkout-service-card__body {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
	flex: 1;
	min-width: 0;
}
.wa-checkout-service-card__title {
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.3;
	color: var(--wa-color-text);
}
.wa-checkout-service-card__text {
	font-size: 0.86rem;
	line-height: var(--wa-line-relaxed);
	color: var(--wa-color-muted);
}
.wa-checkout-servizio-stack .wa-checkout-service-card.btn,
.wa-checkout-servizio-stack .wa-checkout-service-card.btn-success,
.wa-checkout-servizio-stack .wa-checkout-service-card.bottoneavanti {
	background: var(--wa-color-surface);
	color: var(--wa-color-text);
	border-width: 2px;
	box-shadow: none;
	min-height: 0;
	height: auto;
}
@media (max-width: 480px) {
	.wa-checkout-service-card { padding: 1rem; }
	.wa-checkout-service-card__title { font-size: 1.02rem; }
	.wa-checkout-service-card__text { font-size: 0.88rem; }
}
.wa-checkout-form[data-time-mode="asap"] .wa-checkout-time-field {
	display: none;
}
.wa-checkout-time-asap-hint {
	margin: 0.4rem 0 0.85rem;
	padding: 0.6rem 0.8rem;
	background: var(--wa-color-success-bg);
	border: 1px solid var(--wa-color-success);
	border-radius: var(--wa-radius-sm);
	font-size: 0.86rem;
	line-height: 1.55;
	color: var(--wa-color-text);
	hyphens: manual;
	-webkit-hyphens: manual;
	word-break: normal;
	overflow-wrap: break-word;
}
.wa-checkout-time-asap-hint strong {
	color: var(--wa-color-success-fg);
}
.wa-checkout-form[data-time-mode="scheduled"] .wa-checkout-time-asap-hint {
	display: none;
}
.wa-checkout-lucy-verify-form .wa-checkout-hint,
.wa-checkout-lucy-verify-form .wa-slots-hint-optional,
.wa-checkout-lucy-verify-form .wa-checkout-label {
	hyphens: manual;
	-webkit-hyphens: manual;
	word-break: normal;
	overflow-wrap: break-word;
	line-height: 1.55;
}
.wa-checkout-lucy-verify-form .wa-checkout-hint {
	margin-top: 0.45rem;
	font-size: 0.84rem;
}
@media (max-width: 480px) {
	.wa-checkout-time-choice { margin-bottom: 1rem; }
	.wa-checkout-time-option { padding: 0.95rem 1rem; }
	.wa-checkout-time-option__title { font-size: 1rem; }
	.wa-checkout-time-option__text { font-size: 0.86rem; }
	.wa-checkout-lucy-verify-form .wa-checkout-field { margin-bottom: 0.85rem; }
	.wa-checkout-lucy-verify-form .wa-checkout-input { font-size: 1rem; padding: 0.65rem 0.75rem; }
	.wa-checkout-lucy-verify-form .wa-checkout-hint { font-size: 0.82rem; line-height: 1.55; }
}
.wa-lucy-experience:has(.wa-checkout-time-choice) .wa-slot-suggest-banner {
	display: none;
}
.wa-lucy-experience:has(.wa-checkout-time-choice) .wa-lucy-hero {
	padding-bottom: 0.4rem;
	margin-bottom: 0.6rem;
}
.wa-lucy-experience:has(.wa-checkout-time-choice) .wa-lucy-hero-lead {
	font-size: 0.92rem;
	line-height: 1.45;
}

/* Primo orario suggerito allo step data/ora (web_app checkout) */
.wa-slot-suggest-banner {
    margin: 0 0 0.85rem;
    padding: 0.7rem 0.9rem 0.8rem;
    border-radius: var(--wa-radius-sm);
    background: var(--wa-color-primary-soft);
    border: 1px solid var(--wa-color-border);
    box-shadow: none;
}

.wa-slot-suggest-banner__kicker {
    margin: 0 0 0.35rem;
    font-size: 0.72rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--wa-color-muted);
}

.wa-slot-suggest-banner__text {
    margin: 0;
    font-size: 0.9rem;
    line-height: 1.42;
    color: var(--wa-color-text);
}

/* Checkout — scelta metodo pagamento (web_app) */
.wa-checkout-pagamento {
    margin: 1.25rem 0 1rem;
    padding: 0 0.15rem;
}

.wa-checkout-pagamento-title {
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0 0 0.35rem;
    color: var(--wa-color-text);
}

.wa-checkout-pagamento-lead {
    margin: 0 0 0.85rem;
    font-size: 0.92rem;
    color: var(--wa-color-muted);
}

.wa-checkout-pagamento-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.65rem;
}

@media (min-width: 576px) {
    .wa-checkout-pagamento-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

.wa-checkout-pagamento-input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
}

/* payment-method-card — superficie bianca, selezione evidente */
.wa-checkout-pagamento-card {
    display: block;
    margin: 0;
    padding: 0.85rem 1rem;
    border-radius: var(--wa-card-radius);
    border: 2px solid color-mix(in srgb, var(--wa-color-text, #1f1a16) 28%, var(--wa-color-border));
    background: var(--wa-field-surface-bg, #ffffff);
    box-shadow: 0 2px 8px rgba(31, 26, 22, 0.1);
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.wa-checkout-pagamento-card.is-selected {
    border-color: var(--wa-accent-color, var(--wa-color-primary-hover));
    background: color-mix(in srgb, var(--wa-field-surface-bg, #ffffff) 88%, var(--wa-accent-color, #b87932) 12%);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--wa-accent-color, #b87932) 28%, transparent), 0 6px 16px rgba(31, 26, 22, 0.14);
}

.wa-checkout-pagamento-card.is-disabled,
.wa-checkout-pagamento-card:has(.wa-checkout-pagamento-input:disabled) {
    cursor: not-allowed;
    opacity: 0.62;
    background: var(--wa-selectable-bg);
    border-color: var(--wa-selectable-border);
}

.wa-checkout-pagamento-card-body {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.wa-checkout-pagamento-card-label {
    font-weight: 700;
    font-size: 0.98rem;
    color: var(--wa-color-text, #241913);
}

.wa-checkout-pagamento-card-hint {
    font-size: 0.8rem;
    line-height: var(--wa-line-relaxed);
    color: var(--wa-color-muted, #76685d);
}

.wa-checkout-pagamento-card.is-selected .wa-checkout-pagamento-card-label,
.wa-checkout-pagamento-card.is-selected .wa-checkout-pagamento-card-hint {
    color: var(--wa-color-text, #1f1a16);
}

.wa-checkout-marketing-hint {
    margin: 0.35rem 0 0.85rem;
    font-size: 0.88rem;
    line-height: 1.42;
    color: var(--wa-color-muted, #76685d);
}

body.wa-use-bottombar .wa-checkout-step4.wa-checkout-riepilogo-form {
    padding-bottom: 0.5rem;
    margin-bottom: 0.25rem;
}

.wa-checkout-riepilogo-form .wa-checkout-totale-block {
    margin-top: 1rem;
}

/* Pagina pagamento da link + ritorno gateway (R23 Terra Premium) */
.wa-pagamento-link-page .wa-pagamento-link-card,
.wa-pagamento-return-page .wa-pagamento-return-card {
    max-width: 420px;
    margin: 1.25rem auto;
    padding: 1.25rem 1.1rem;
    border-radius: var(--wa-radius-md);
    border: 1px solid var(--wa-color-border);
    background: var(--wa-color-surface-soft);
    box-shadow: var(--wa-shadow-sm);
}

.wa-pagamento-return-page .wa-pagamento-return-ref {
    color: var(--wa-color-muted);
}

.wa-pagamento-link-amount {
    font-size: 1.05rem;
    margin: 0 0 0.75rem;
    text-align: center;
}

.wa-pagamento-link-ref {
    text-align: center;
    margin: 0 0 0.75rem;
}

.wa-pagamento-link-sim {
    text-align: center;
    margin: 0 0 1rem;
    font-size: 0.9rem;
}

.wa-pagamento-link-form {
    text-align: center;
}

.wa-pagamento-link-btn {
    width: 100%;
    max-width: 280px;
}

.wa-confirm-pay-link-wrap {
    margin-top: 0.5rem;
}

.wa-confirm-pay-link {
    display: inline-block;
    width: 100%;
    max-width: 320px;
}

.wa-lucy-hero--compact {
    padding: 1rem 0.85rem 0.85rem;
    margin-bottom: 1rem;
}

.wa-lucy-hero-title--compact {
    font-size: 1.25rem;
    line-height: 1.3;
}

.wa-lucy-hero-lead--compact {
    font-size: 0.92rem;
}

.wa-lucy-form-fieldset {
    border: none;
    margin: 0;
    padding: 0;
    min-width: 0;
}

.wa-lucy-form-fieldset:disabled .wa-lucy-form-card {
    opacity: 0.92;
}

.wa-lucy-verify-cta {
    margin-top: 0.25rem;
}

/* ── Result card (hero moment after verification) ── */
.wa-lucy-result {
    margin-top: 1.35rem;
    padding: 1.6rem 1.25rem 1.4rem;
    border-radius: 18px;
    border: 1px solid #e7e2d9;
    background: linear-gradient(165deg, #fffefb 0%, #f7f5f0 100%);
    box-shadow: 0 8px 28px rgba(41, 37, 36, 0.08);
    text-align: center;
}

.wa-lucy-result--success {
    border-color: #86efac;
    background: linear-gradient(165deg, #f0fdf4 0%, #fff 55%);
}

.wa-lucy-result--alternatives {
    border-color: #fcd34d;
    background: linear-gradient(165deg, #fffbeb 0%, #fff 50%);
}

.wa-lucy-result--blocked {
    border-color: #fca5a5;
    background: linear-gradient(165deg, #fef2f2 0%, #fff 50%);
}

.wa-lucy-result-pill {
    display: inline-block;
    padding: 0.22rem 0.75rem;
    border-radius: 100px;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-bottom: 0.75rem;
}

.wa-lucy-result-pill--ok {
    background: #dcfce7;
    color: #166534;
}

.wa-lucy-result-pill--alt {
    background: #fef3c7;
    color: #92400e;
}

.wa-lucy-result-pill--blocked {
    background: #fee2e2;
    color: #991b1b;
}

.wa-lucy-result-hero {
    font-family: Oswald, 'Montserrat', sans-serif;
    font-size: 2rem;
    font-weight: 700;
    color: #1c1917;
    margin: 0 0 0.6rem;
    line-height: 1.2;
}

.wa-lucy-result-hero--alt {
    font-size: 1.35rem;
    color: #78350f;
}

.wa-lucy-result-hero--blocked {
    font-size: 1.3rem;
    color: #991b1b;
}

.wa-lucy-result-lead {
    margin: 0 0 0.5rem;
    font-size: 1rem;
    line-height: 1.5;
    color: #44403c;
}

/* ── Timeline strip (preparation → ready → delivery) ── */
.wa-lucy-timeline {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 0;
    margin: 1.1rem auto 1.25rem;
    max-width: 420px;
}

.wa-lucy-timeline-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 0 0 auto;
    min-width: 72px;
}

.wa-lucy-timeline-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #86efac;
    border: 2px solid #22c55e;
    margin-bottom: 0.35rem;
}

.wa-lucy-timeline-dot--final {
    background: #22c55e;
    border-color: #16a34a;
    width: 14px;
    height: 14px;
}

.wa-lucy-timeline-line {
    flex: 1 1 auto;
    height: 2px;
    min-width: 24px;
    background: #bbf7d0;
    margin-top: 5px;
    align-self: flex-start;
}

.wa-lucy-timeline-label {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #57534e;
}

.wa-lucy-timeline-value {
    font-size: 0.88rem;
    font-weight: 600;
    color: #1c1917;
    margin-top: 0.1rem;
}

.wa-lucy-timeline-step--final .wa-lucy-timeline-value {
    font-weight: 700;
    color: #166534;
}

@media (max-width: 380px) {
    .wa-lucy-timeline {
        flex-direction: column;
        align-items: stretch;
        gap: 0.5rem;
        max-width: 200px;
    }
    .wa-lucy-timeline-step {
        flex-direction: row;
        gap: 0.6rem;
        min-width: 0;
    }
    .wa-lucy-timeline-dot {
        margin-bottom: 0;
        flex-shrink: 0;
        align-self: center;
    }
    .wa-lucy-timeline-line {
        width: 2px;
        height: 18px;
        min-width: 2px;
        margin: 0 0 0 5px;
        align-self: auto;
    }
    .wa-lucy-timeline-label,
    .wa-lucy-timeline-value {
        text-align: left;
    }
}

.wa-lucy-result-actions {
    margin: 1.25rem 0 0;
    text-align: center;
}

/* ── Alternative cards ── */
.wa-lucy-alt-cards {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.75rem;
    margin: 1rem 0 1rem;
}

@media (min-width: 576px) {
    .wa-lucy-alt-cards {
        grid-template-columns: repeat(3, 1fr);
        gap: 0.65rem;
    }
}

.wa-lucy-alt-pick-form--tile {
    margin: 0;
}

.wa-lucy-alt-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    width: 100%;
    padding: 1rem 0.75rem;
    border-radius: 14px;
    border: 2px solid rgba(78, 52, 46, 0.15);
    background: #fff;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.1s ease;
    font-family: inherit;
    text-align: center;
}

.wa-lucy-alt-card:hover {
    border-color: rgba(78, 52, 46, 0.4);
    box-shadow: 0 4px 16px rgba(41, 37, 36, 0.1);
    transform: translateY(-1px);
}

.wa-lucy-alt-card:active {
    transform: translateY(0);
}

.wa-lucy-alt-card--recommended {
    border-color: #22c55e;
    box-shadow: 0 0 0 1px rgba(34, 197, 94, 0.15);
}

.wa-lucy-alt-card--recommended:hover {
    border-color: #16a34a;
}

.wa-lucy-alt-card-badge {
    display: inline-block;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #166534;
    background: #dcfce7;
    padding: 0.15rem 0.55rem;
    border-radius: 100px;
}

.wa-lucy-alt-card-time {
    font-family: Oswald, 'Montserrat', sans-serif;
    font-size: 1.6rem;
    font-weight: 700;
    color: #1c1917;
    line-height: 1.1;
}

.wa-lucy-alt-card-sub {
    font-size: 0.78rem;
    color: #78716c;
    line-height: 1.3;
}

/* ── Confirm slot button (reused) ── */
.wa-lucy-confirm-slot-btn {
    width: 100%;
    max-width: none;
    font-size: 1.15rem;
    font-weight: 700;
    padding: 1rem 0.75rem;
    border-radius: 14px;
    letter-spacing: 0.02em;
}

/* ── Blocked panel actions ── */
.wa-lucy-blocked-actions {
    margin-top: 1.25rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
}

.wa-lucy-blocked-retry-btn {
    min-width: 240px;
}

.wa-lucy-blocked-fallback-form {
    margin: 0;
}

.wa-lucy-retry-wrap {
    margin: 0;
    text-align: center;
}

.wa-lucy-retry-link {
    display: inline-block;
    margin-top: 0.25rem;
    font-size: 0.95rem;
    text-decoration: underline;
    background: none;
    border: none;
    padding: 0.35rem 0.5rem;
    cursor: pointer;
    color: #57534e;
}

.wa-lucy-retry-link:hover {
    color: #1c1917;
}

.wa-lucy-success-banner {
    max-width: 640px;
    margin: 0 auto 1.25rem;
    font-size: 1rem;
}

.wa-account-page .wa-account-dl {
    margin: 0;
}

.wa-account-dl dt {
    font-weight: 700;
    margin-top: 0.85rem;
    color: var(--wa-color-muted);
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.wa-account-dl dd {
    margin: 0.15rem 0 0;
    font-size: 1rem;
}

.wa-account-actions {
    margin-top: 1.5rem;
}

.wa-account-cta {
    margin: 0.35rem;
}

.wa-account-cta--ghost {
    border-color: var(--wa-color-muted);
    color: var(--wa-color-text);
}

.wa-miei-ordini-table-wrap {
    max-width: 900px;
    margin: 0 auto;
}

.wa-miei-ordini-table th {
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--wa-color-muted);
}

/* Miei ordini — card premium (lista + dettaglio) */
.wa-miei-ordini-page .wa-checkout-inner[data-role="orders-list"],
.wa-ordine-dettaglio-page .wa-checkout-inner {
    max-width: 640px;
    margin-left: auto;
    margin-right: auto;
}

.wa-order-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

body.wa-client-app .wa-miei-ordini-page .wa-order-card.wa-mobile-card,
body.wa-client-app .wa-order-detail-card.wa-mobile-card {
    background: var(--wa-color-surface-strong, #ffffff);
    border: 1px solid var(--wa-color-border);
    border-radius: var(--wa-radius-lg, 16px);
    box-shadow: 0 4px 22px rgba(15, 23, 42, 0.07);
    color: var(--wa-color-text);
    padding: 1.1rem 1.15rem 1rem;
    margin: 0;
}

.wa-order-card__head,
.wa-order-detail-card__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

.wa-order-card__id,
.wa-order-detail-card__id {
    font-size: 1.05rem;
    font-weight: 800;
    line-height: 1.2;
    color: var(--wa-color-text);
}

.wa-order-card__pickup,
.wa-order-detail-card__pickup {
    margin-top: 0.2rem;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--wa-color-muted);
}

.wa-order-card__status {
    flex-shrink: 0;
    max-width: 48%;
    text-align: right;
    font-size: 0.68rem;
    font-weight: 600;
    line-height: 1.35;
    padding: 0.28rem 0.55rem;
    border-radius: 999px;
    background: var(--wa-color-primary-soft, rgba(15, 118, 110, 0.12));
    color: var(--wa-color-primary);
}

.wa-order-card__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.7rem 0.85rem;
    margin-top: 0.15rem;
}

.wa-order-card__label {
    display: block;
    font-size: 0.62rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--wa-color-muted);
    margin-bottom: 0.12rem;
}

.wa-order-card__value {
    display: block;
    font-size: 0.84rem;
    line-height: 1.35;
    color: var(--wa-color-text);
}

.wa-order-card__field--total {
    grid-column: 1 / -1;
}

.wa-order-card__total {
    font-size: 1.35rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--wa-color-primary);
}

.wa-order-card__mkt-hint {
    margin: 0;
    font-size: 0.78rem;
    color: var(--wa-color-muted);
}

.wa-order-card__footer {
    margin-top: 0.15rem;
    padding-top: 0.65rem;
    border-top: 1px solid var(--wa-color-border);
}

.wa-order-card__link {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.84rem;
    font-weight: 700;
    color: var(--wa-color-primary);
    text-decoration: none;
}

.wa-order-card__link:hover {
    color: var(--wa-color-primary-hover, var(--wa-color-primary));
    text-decoration: underline;
}

.wa-miei-ordini-actions {
    margin-top: 1.5rem;
}

.wa-ordine-dettaglio-back {
    max-width: 640px;
    margin: 0 auto 0.5rem;
}

.wa-ordine-dettaglio-back__link {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.84rem;
    font-weight: 600;
    color: var(--wa-color-muted);
    text-decoration: none;
}

.wa-ordine-dettaglio-back__link:hover {
    color: var(--wa-color-primary);
}

.wa-order-detail-card .wa-checkout-riepilogo {
    margin: 0.75rem 0 0;
    padding: 0.85rem 0.95rem;
    border-radius: var(--wa-radius-md, 12px);
    background: var(--wa-color-surface-soft, #f8fafc);
    border: 1px solid var(--wa-color-border);
    box-shadow: none;
}

.wa-order-detail-righe .wa-order-detail-riga {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 0.35rem 0.65rem;
    align-items: baseline;
    padding: 0.45rem 0;
    border-bottom: 1px solid var(--wa-color-border);
}

.wa-order-detail-righe .wa-order-detail-riga:last-child {
    border-bottom: 0;
}

.wa-order-detail-riga__note {
    grid-column: 2 / -1;
    font-size: 0.78rem;
    color: var(--wa-color-muted);
}

.wa-order-detail-riga__price {
    font-weight: 700;
    color: var(--wa-color-text);
    white-space: nowrap;
}

.wa-order-detail-total {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1rem;
    padding-top: 0.85rem;
    border-top: 1px solid var(--wa-color-border);
}

.wa-order-detail-total__amount {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--wa-color-primary);
    letter-spacing: -0.02em;
}

@media (max-width: 767.98px) {
    .wa-order-card__status {
        max-width: 52%;
    }
}

.wa-miei-pickup {
    font-size: 0.8rem;
    color: var(--wa-color-muted);
}

.wa-miei-stato {
    font-size: 0.88rem;
}

/* ---------------------------------------------------------------------------
 * Messaggi / chat — Terra Premium (R23)
 * Override token su wa-messaggi.css (layout invariato).
 * --------------------------------------------------------------------------- */
.wa-messages-lead,
.wa-messages-guest__lead,
.wa-chat-card__subtitle {
	color: var(--wa-color-muted);
}
.wa-messages-guest,
.wa-chat-card {
	background: var(--wa-color-surface);
	border: 1px solid var(--wa-color-border);
	box-shadow: var(--wa-shadow-sm);
}
.wa-messages-guest__title,
.wa-messages-title,
.wa-chat-card__title {
	color: var(--wa-color-text);
}
.wa-messages-guest__btn--primary {
	background: var(--wa-color-primary);
	color: var(--wa-color-primary-contrast);
}
.wa-messages-guest__btn--primary:hover {
	color: var(--wa-color-primary-contrast);
	background: var(--wa-color-primary-hover);
}
.wa-messages-guest__btn--secondary {
	background: var(--wa-color-surface);
	color: var(--wa-color-text);
	border-color: var(--wa-color-border);
}
.wa-chat-card__head {
	background: var(--wa-color-surface-soft);
	border-bottom-color: var(--wa-color-border);
}
.wa-chat-card__avatar {
	background: var(--wa-color-surface-strong);
	color: var(--wa-color-text);
}
.wa-msg--you .wa-msg__bubble {
	background: var(--wa-color-primary);
	color: var(--wa-color-primary-contrast);
}
.wa-msg--them .wa-msg__bubble {
	background: var(--wa-color-surface);
	color: var(--wa-color-text);
	border-color: var(--wa-color-border);
}
.wa-msg--system .wa-msg__bubble {
	background: var(--wa-color-surface-soft);
	color: var(--wa-color-muted);
	border-color: var(--wa-color-border);
}
.wa-msg--support .wa-msg__bubble {
	background: var(--wa-color-primary-soft);
	color: var(--wa-color-text);
	border-color: var(--wa-color-border);
}

/* ---------------------------------------------------------------------------
 * Compat: spostato da httpdocs/style.css (bonifica tema — tema vive nel _mod)
 * Pushalert: tipografia widget notifiche (non esposto editor dedicato).
 * --------------------------------------------------------------------------- */
.pushalert-notification-preferences {
    font-size: 0.7em;
    font-weight: bold;
}

/* ============================================================
 * VO EDITOR (Fase 92) — Append-only region
 * Nuove personalizzazioni guidate dall'editor CSS andranno
 * aggiunte SOTTO questo blocco (o in file dedicato incluso dopo).
 * Non modificare da editor: style.css, sito_web/assets/css/*.css
 * Riferimento: dashboard/Docs/92A_CSS_EDITOR_STOREFRONT_AUDIT.md
 * Indice master file: dashboard/Docs/STOREFRONT_CSS_MOD_MASTER_MAP.md
 * ============================================================ */

/* ============================================================
 * Nota: lo scaffold baseline esplicito + secondario (~309 righe
 * aggiunte in Fase 92 per chiudere voci MISSING/PARTIAL dell'audit
 * editor vetrina) è stato RIMOSSO. Regola: il tema base non si
 * tocca per accomodare il tooling editor. Dove lo schema espone
 * un field senza regola esplicita nella cascata, il baseline
 * extractor restituisce vuoto e l'editor parte da default browser/
 * Bootstrap — comportamento corretto e veritiero. Se un effetto
 * visivo specifico deve diventare default del tema, si aggiunge
 * qui una regola solo perché serve al frontend reale, non
 * perché un audit dica PARTIAL/MISSING.
 * ============================================================ */

/* R31H — microcopy legale/trasparenza (checkout, carrello, profilo) */
.wa-legal-microcopy {
	margin: 0.55rem 0 0;
	font-size: 0.82rem;
	line-height: 1.45;
	color: var(--wa-color-muted, #64748b);
}
.wa-legal-microcopy a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 2px;
}
.wa-checkout-legal-summary {
	max-width: 36rem;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	padding: 0 0.5rem 0.35rem;
}
.wa-cart-legal-hint {
	max-width: 32rem;
	margin: 0 auto 0.65rem;
	text-align: center;
	padding: 0 0.75rem;
}
.wa-checkout-legal-checks {
	max-width: 36rem;
	margin: 0.35rem auto 0.85rem;
	padding: 0 0.75rem;
}
.wa-checkout-legal-check {
	display: flex;
	gap: 0.55rem;
	align-items: flex-start;
	margin: 0 0 0.55rem;
	font-size: 0.84rem;
	line-height: 1.45;
	color: var(--wa-color-text, #1e293b);
}
.wa-checkout-legal-check input {
	margin-top: 0.2rem;
	flex-shrink: 0;
}
.wa-checkout-legal-check a {
	color: inherit;
	text-decoration: underline;
}
.wa-checkout-legal-check--optional {
	color: var(--wa-color-muted, #64748b);
}
.wa-profilo-legal-nav .wa-bs-item--button {
	display: flex;
	align-items: center;
	gap: 0.55rem;
	width: 100%;
	border: 0;
	background: transparent;
	text-align: left;
	cursor: pointer;
	font: inherit;
	color: inherit;
	padding-left: 0.1rem;
	padding-right: 0.1rem;
}