/**
 * Cornice vetrina (header, bottom nav, lingua, scrollbar) — tutte le pagine wa-client-app.
 * Caricare dopo css_style_mod_custom.css; usa solo token tema (--wa-*).
 */

/* Sfondo pagina */
html:has(body.wa-client-app) {
	background-color: var(--wa-home-bg, var(--wa-app-bg, var(--wa-color-bg)));
}

body.wa-client-app {
	background-color: var(--wa-home-bg, var(--wa-app-bg, var(--wa-color-bg))) !important;
	color: var(--wa-home-color, var(--wa-app-color, var(--wa-color-text)) !important;
}

/* Topbar mobile */
body.wa-client-app.wa-use-bottombar .navbar.navigation-clean {
	background-color: var(--wa-topbar-bg, var(--wa-header-bg)) !important;
	color: var(--wa-topbar-color, var(--wa-header-text)) !important;
	border-bottom: 1px solid var(--wa-topbar-border-color, var(--wa-header-border)) !important;
	box-shadow: var(--wa-topbar-shadow, var(--wa-header-shadow)) !important;
}

body.wa-client-app.wa-use-bottombar .navbar-brand,
body.wa-client-app.wa-use-bottombar .navbar-brand .wa-nav-name,
body.wa-client-app.wa-use-bottombar .navbar-brand > span {
	color: var(--wa-topbar-color, var(--wa-header-text)) !important;
}

/* Pre-header desktop */
body.wa-client-app .sfondo_menusuperiore {
	background-color: var(--wa-topbar-bg, var(--wa-header-bg)) !important;
	color: var(--wa-topbar-color, var(--wa-header-text)) !important;
}

body.wa-client-app .sfondo_menusuperiore .menu_superiore_link,
body.wa-client-app .sfondo_menusuperiore .menu_superiore_meta,
body.wa-client-app .sfondo_menusuperiore .menu_superiore_addr,
body.wa-client-app .sfondo_menusuperiore .bottone_esci {
	color: var(--wa-topbar-color, var(--wa-header-text)) !important;
}

body.wa-client-app .sfondo_menusuperiore .menu_superiore_link:hover,
body.wa-client-app .sfondo_menusuperiore .bottone_esci:hover {
	color: color-mix(in srgb, var(--wa-topbar-color, var(--wa-header-text)) 65%, transparent) !important;
}

body.wa-client-app .sfondo_menusuperiore .menu_superiore_sep {
	background: color-mix(in srgb, var(--wa-topbar-color, var(--wa-header-text)) 28%, transparent) !important;
}

/* Lingua */
body.wa-client-app .wa-nav-lang-mobile .vm-ar2-lang__trigger,
body.wa-client-app .wa-nav-lang-mobile .wa-storefront-lang-wrap .vm-ar2-lang__trigger {
	background: var(--wa-lang-button-bg, var(--wa-header-lang-bg, var(--wa-lang-bg))) !important;
	color: var(--wa-lang-button-color, var(--wa-header-lang-text, var(--wa-lang-color))) !important;
	border-color: var(--wa-lang-button-border-color, var(--wa-header-lang-border, var(--wa-lang-border-color))) !important;
}

body.wa-client-app .wa-nav-lang-mobile .vm-ar2-lang__panel {
	background: var(--wa-lang-menu-bg) !important;
	color: var(--wa-lang-menu-color) !important;
	border-color: var(--wa-lang-menu-border-color) !important;
	box-shadow: var(--wa-lang-menu-shadow) !important;
}

body.wa-client-app .wa-nav-lang-mobile .vm-ar2-lang__row.is-active {
	background: var(--wa-lang-item-active-bg, var(--wa-header-lang-active-bg)) !important;
	color: var(--wa-lang-item-active-color, var(--wa-header-lang-active-text)) !important;
}

/* Bottom nav */
body.wa-client-app .wa-bottombar {
	background: var(--wa-bottom-nav-bg, var(--wa-nav-bg, var(--wa-bottombar-bg))) !important;
	border-top-color: var(--wa-bottom-nav-border-color, var(--wa-nav-border)) !important;
	box-shadow: var(--wa-bottom-nav-shadow, var(--wa-nav-shadow)) !important;
}

body.wa-client-app .wa-bottombar-item {
	color: var(--wa-bottom-nav-color, var(--wa-nav-text, var(--wa-bottombar-fg, var(--wa-nav-icon)))) !important;
}

body.wa-client-app .wa-bottombar-item.is-active {
	color: var(--wa-bottom-nav-active-color, var(--wa-nav-text-active, var(--wa-bottombar-active-fg, var(--wa-nav-icon-active)))) !important;
}

body.wa-client-app .wa-bottombar-item i {
	color: inherit !important;
}

body.wa-client-app .wa-bottombar-item.is-active i,
body.wa-client-app .wa-bottombar-item.is-active .wa-bottombar-label {
	color: var(--wa-bottom-nav-active-color, var(--wa-nav-text-active, var(--wa-bottombar-active-fg, var(--wa-nav-icon-active))) !important;
}

body.wa-client-app .wa-bottombar-badge,
body.wa-client-app .wa-cart-badge {
	background: var(--wa-bottom-nav-badge-bg, var(--wa-nav-badge-bg)) !important;
	color: var(--wa-bottom-nav-badge-color, var(--wa-nav-badge-text)) !important;
}

/* Scrollbar (preview / webkit) */
body.wa-client-app * {
	scrollbar-color: var(--wa-scrollbar-thumb) var(--wa-scrollbar-track);
}

body.wa-client-app *::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}

body.wa-client-app *::-webkit-scrollbar-track {
	background: var(--wa-scrollbar-track, var(--wa-color-surface-soft));
}

body.wa-client-app *::-webkit-scrollbar-thumb {
	background: var(--wa-scrollbar-thumb, var(--wa-color-muted));
	border-radius: var(--wa-radius-pill, 999px);
}

body.wa-client-app *::-webkit-scrollbar-thumb:hover {
	background: var(--wa-scrollbar-thumb-hover, var(--wa-color-primary));
}

/* Input / select / dropdown */
body.wa-client-app .form-control,
body.wa-client-app .form-select,
body.wa-client-app select,
body.wa-client-app input[type="search"],
body.wa-client-app input[type="text"],
body.wa-client-app input[type="email"],
body.wa-client-app input[type="tel"],
body.wa-client-app input[type="number"],
body.wa-client-app textarea {
	background-color: var(--wa-input-bg, var(--wa-color-surface)) !important;
	color: var(--wa-input-text, var(--wa-input-color, var(--wa-color-text))) !important;
	border-color: var(--wa-input-border, var(--wa-color-border)) !important;
}

body.wa-client-app .form-control::placeholder,
body.wa-client-app input::placeholder,
body.wa-client-app textarea::placeholder {
	color: var(--wa-input-placeholder, var(--wa-color-muted)) !important;
	opacity: 1;
}

body.wa-client-app .form-control:focus,
body.wa-client-app .form-select:focus,
body.wa-client-app select:focus,
body.wa-client-app input:focus,
body.wa-client-app textarea:focus {
	border-color: var(--wa-input-focus-border, var(--wa-color-primary)) !important;
	box-shadow: var(--wa-input-focus-shadow, 0 0 0 3px color-mix(in srgb, var(--wa-color-primary) 22%, transparent)) !important;
}

body.wa-client-app .dropdown-menu {
	background-color: var(--wa-modal-bg, var(--wa-color-surface)) !important;
	color: var(--wa-modal-text, var(--wa-color-text)) !important;
	border-color: var(--wa-modal-border, var(--wa-color-border)) !important;
}

body.wa-client-app .dropdown-item {
	color: var(--wa-modal-text, var(--wa-color-text)) !important;
}

body.wa-client-app .dropdown-item:hover,
body.wa-client-app .dropdown-item:focus {
	background-color: var(--wa-chip-active-bg, var(--wa-color-primary-soft)) !important;
	color: var(--wa-chip-active-text, var(--wa-color-text)) !important;
}

/* Home — titoli e semaforo */
body#homepage.wa-client-app .wa-home-categories .wa-cat-card-link,
body#homepage.wa-client-app .wa-home-categories .wa-cat-card-title,
body.wa-client-app .titolo_categoria,
body.wa-client-app .wa-lista-container h1.titolo_categoria {
	color: var(--wa-category-title-color, var(--wa-list-title-color, var(--wa-home-heading, var(--wa-home-color)))) !important;
}

body#homepage.wa-client-app .bloccosemaforo,
body#homepage.wa-client-app .wa-home-semaforo,
body#homepage.wa-client-app .wa-sfondosemaforo-inner {
	background-color: var(--wa-semaforo-bg, var(--wa-surface-soft-bg, var(--wa-color-surface-soft))) !important;
	color: var(--wa-semaforo-color, var(--wa-home-color, var(--wa-color-text))) !important;
	border-color: var(--wa-border-color) !important;
}

/* Drawer / menu mobile — tutti i template (non solo data-wa-style in wa-mother-base) */
body.wa-client-app .wa-bottom-sheet-panel {
	background: var(--wa-drawer-bg, var(--wa-color-surface)) !important;
	color: var(--wa-drawer-color, var(--wa-drawer-text, var(--wa-color-text))) !important;
	border-top-color: var(--wa-drawer-border-color, var(--wa-drawer-border, var(--wa-color-border))) !important;
}

body.wa-client-app .wa-bottom-sheet-backdrop {
	background: var(--wa-overlay-scrim, color-mix(in srgb, var(--wa-color-dark, #0b0f14) 72%, transparent)) !important;
}

body.wa-client-app .wa-bottom-sheet-header {
	border-bottom-color: var(--wa-drawer-border-color, var(--wa-drawer-border)) !important;
	background: var(--wa-drawer-header-bg, var(--wa-drawer-bg)) !important;
}

body.wa-client-app .wa-bottom-sheet-title {
	color: var(--wa-drawer-color, var(--wa-drawer-text)) !important;
}

body.wa-client-app .wa-bottom-sheet-subtitle {
	color: var(--wa-drawer-muted-color, var(--wa-drawer-muted)) !important;
}

body.wa-client-app .wa-bottom-sheet-handle {
	background: var(--wa-drawer-border-color, var(--wa-drawer-border)) !important;
}

body.wa-client-app .wa-bottom-sheet-close {
	background: var(--wa-drawer-close-bg) !important;
	color: var(--wa-drawer-close-color, var(--wa-drawer-close-text)) !important;
}

body.wa-client-app .wa-bs-user-pill {
	background: var(--wa-drawer-user-bg, var(--wa-drawer-account-pill-bg)) !important;
	color: var(--wa-drawer-user-color, var(--wa-drawer-account-pill-text)) !important;
}

body.wa-client-app .wa-bs-user-pill i {
	color: var(--wa-drawer-user-color, var(--wa-drawer-item-icon-color)) !important;
}

body.wa-client-app .wa-bs-section-title {
	color: var(--wa-drawer-section-title-color, var(--wa-drawer-section-title)) !important;
}

body.wa-client-app .wa-bs-item {
	color: var(--wa-drawer-item-color, var(--wa-drawer-item-text)) !important;
}

body.wa-client-app .wa-bs-item i {
	color: var(--wa-drawer-item-icon-color, var(--wa-drawer-item-icon)) !important;
}

body.wa-client-app .wa-bs-item.is-active {
	background: var(--wa-drawer-item-active-bg) !important;
	color: var(--wa-drawer-item-active-color, var(--wa-drawer-item-active-text)) !important;
}

body.wa-client-app .wa-bs-item.is-active i {
	color: var(--wa-drawer-item-active-icon, var(--wa-drawer-item-active-color)) !important;
}

body.wa-client-app .wa-bs-item--logout {
	color: var(--wa-danger-text, var(--wa-color-danger)) !important;
}

body.wa-client-app .wa-bs-item--logout i {
	color: var(--wa-danger-text, var(--wa-color-danger)) !important;
}

/* Prezzi su card — contrasto su sfondo card */
body.wa-client-app .prezzoscheda,
body.wa-client-app .wa-product-price,
body.wa-client-app .costounita {
	color: var(--wa-price-color, var(--wa-product-price, var(--wa-color-price))) !important;
}

body.wa-client-app .sfondo_menusuperiore .menu_superiore_link.wa-topbar-auth-entry {
	white-space: nowrap;
	font-weight: 600;
	font-size: 0.92rem;
}