/* ============================================================================
   LUMALUX — Tasto "Contattaci su WhatsApp"
   Markup iniettato via assets/js/lumalux-whatsapp.js:
     .lmx-wa            base (anchor)
     .lmx-wa--desktop   pulsante verde nell'header desktop (prima del carrello)
     .lmx-wa--mobile    voce-pulsante dentro il menu mobile (widget 7cab17e)
   Palette WhatsApp: #25D366 (brand), #1ebe5d (hover), #128C7E (dark).
   ============================================================================ */

.lmx-wa {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	text-decoration: none !important;
	box-shadow: none;
}
/* Forza il riempimento del logo: alcune regole globali (Elementor/tema) settano
   fill:none / stroke su <svg> dentro i link, lasciando solo il contorno. */
.lmx-wa .lmx-wa-ico { flex: 0 0 auto; fill: currentColor !important; stroke: none !important; }
.lmx-wa .lmx-wa-ico path { fill: currentColor !important; stroke: none !important; }

/* ─── DESKTOP — pulsante verde prima del carrello ──────────────────────────
   Il widget vive nella sezione header desktop (hidden-mobile/tablet), quindi
   è già nascosto su mobile/tablet: nessuna media query necessaria. */
.lmx-wa-host {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
	justify-content: flex-end !important;
	gap: 18px;
}

/* La colonna carrello desktop (ed9eb4d) è larga solo 3.794% e il menu (c85b650)
   ha percentuali fisse: con 5 voci il menu sfora la colonna e si sovrappone al
   pulsante WhatsApp, e il carrello viene tagliato. Soluzione robusta: layout
   flex dove il MENU occupa lo spazio che resta (flex:1, non sfora mai) e
   logo/carrello si dimensionano sul contenuto. nowrap = niente a capo.
   Scopato al solo desktop (la sezione header desktop è già hidden-mobile/tablet). */
@media (min-width: 1025px) {
	html body .elementor-element.elementor-element-7e3f2f4 > .elementor-container {
		flex-wrap: nowrap !important;
		align-items: center !important;
	}
	/* Logo — dimensione fissa, non mangia spazio in percentuale */
	html body .elementor-element.elementor-element-631f42d {
		width: auto !important;
		flex: 0 0 auto !important;
	}
	html body .elementor-element.elementor-element-631f42d img {
		width: 340px !important;
		max-width: 340px !important;
	}
	/* Menu — occupa tutto lo spazio rimanente, può comprimersi se serve */
	html body .elementor-element.elementor-element-c85b650 {
		width: auto !important;
		flex: 1 1 auto !important;
		min-width: 0 !important;
	}
	/* Carrello + pulsante WhatsApp — larghezza sul contenuto, sempre visibili */
	html body .elementor-element.elementor-element-ed9eb4d {
		width: auto !important;
		flex: 0 0 auto !important;
	}
}
.lmx-wa--desktop {
	background: #25D366;
	color: #0c2e1a !important;
	font-family: 'Cormorant Garamond', 'Playfair Display', Georgia, serif;
	font-size: 17px;
	font-weight: 600;
	letter-spacing: 0.04em;
	line-height: 1;
	padding: 11px 20px;
	border-radius: 999px;
	white-space: nowrap;
	transition: background-color 0.25s ease, transform 0.2s ease, box-shadow 0.25s ease;
}
.lmx-wa--desktop:hover,
.lmx-wa--desktop:focus {
	background: #1ebe5d;
	color: #07210f !important;
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(37, 211, 102, 0.32);
}
.lmx-wa--desktop .lmx-wa-ico { width: 19px; height: 19px; }

/* ─── MOBILE — voce-pulsante nel menu dropdown ─────────────────────────────
   Scopato a max-width 1024px e con selettori abbastanza specifici da battere
   le regole .elementor-nav-menu--dropdown ... a.elementor-item di header.css. */
@media (max-width: 1024px) {
	.elementor-nav-menu--dropdown .elementor-nav-menu li.lmx-wa-mobile-item {
		margin: 16px 22px 6px !important;
		border: 0 !important;
	}
	.elementor-nav-menu--dropdown .elementor-nav-menu li.lmx-wa-mobile-item a.lmx-wa {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		gap: 10px;
		background: #25D366 !important;
		color: #07210f !important;
		font-family: 'Cormorant Garamond', 'Playfair Display', Georgia, serif !important;
		font-size: 17px !important;
		font-weight: 600 !important;
		letter-spacing: 0.08em !important;
		text-transform: none !important;
		text-align: center !important;
		padding: 15px 22px !important;
		border: 0 !important;
		border-bottom: 0 !important;
		border-radius: 12px !important;
		box-shadow: 0 8px 22px rgba(37, 211, 102, 0.22) !important;
		transition: background-color 0.25s ease !important;
	}
	.elementor-nav-menu--dropdown .elementor-nav-menu li.lmx-wa-mobile-item a.lmx-wa:hover,
	.elementor-nav-menu--dropdown .elementor-nav-menu li.lmx-wa-mobile-item a.lmx-wa:focus {
		background: #1ebe5d !important;
		color: #07210f !important;
	}
	/* Annulla la barra gold a sinistra ereditata dalle voci menu standard */
	.elementor-nav-menu--dropdown .elementor-nav-menu li.lmx-wa-mobile-item a.lmx-wa::before {
		display: none !important;
		content: none !important;
	}
	.elementor-nav-menu--dropdown .elementor-nav-menu li.lmx-wa-mobile-item a.lmx-wa .lmx-wa-ico {
		width: 20px;
		height: 20px;
	}
}
