/* ============================================================================
   LUMALUX — Mobile Menu (dark luxury override)
   ⚠️ Tutti gli stili sono scopati in @media (max-width: 1024px) per non
   inquinare il menu desktop di Elementor (che mostra layout orizzontale).
   ============================================================================ */

/* DESKTOP — Nascondi gli hamburger toggle + dropdown.
   Target specifico ai widget IDs trovati nell'header (7cab17e, c5c94e6)
   per battere qualunque CSS Elementor di livello superiore. */
@media (min-width: 1025px) {
	html body .elementor-menu-toggle,
	html body .elementor-element-7cab17e .elementor-menu-toggle,
	html body .elementor-element-c5c94e6 .elementor-menu-toggle,
	html body div[class*="elementor-widget-nav-menu"] .elementor-menu-toggle {
		display: none !important;
		visibility: hidden !important;
		opacity: 0 !important;
		width: 0 !important;
		height: 0 !important;
		padding: 0 !important;
		margin: 0 !important;
		border: 0 !important;
		pointer-events: none !important;
		position: absolute !important;
		left: -9999px !important;
	}
	html body .elementor-nav-menu--dropdown,
	html body .elementor-element-7cab17e .elementor-nav-menu--dropdown,
	html body .elementor-element-c5c94e6 .elementor-nav-menu--dropdown {
		display: none !important;
		visibility: hidden !important;
	}
	/* Sezione mobile-menu intera (colonna con hide_desktop) */
	html body .elementor-element-75678116,
	html body .elementor-hidden-desktop {
		display: none !important;
	}
}

@media (max-width: 1024px) {

	:root {
		--lmx-header-gold:      #BA993F;
		--lmx-header-gold-2:    #d4b65a;
		--lmx-header-text:      #f5f1e6;
		--lmx-header-muted:     #a8a08d;
		--lmx-header-border:    rgba(186, 153, 63, 0.22);
		--lmx-header-serif:     'Cormorant Garamond', 'Playfair Display', Georgia, serif;
	}

	/* ─── HAMBURGER ICON ───────────────────────────────── */
	.elementor-menu-toggle {
		color: var(--lmx-header-gold) !important;
		border: 1px solid rgba(186, 153, 63, 0.3) !important;
		border-radius: 50% !important;
		width: 44px !important;
		height: 44px !important;
		padding: 0 !important;
		align-items: center !important;
		justify-content: center !important;
		transition: background 0.25s ease, border-color 0.25s ease, transform 0.25s ease !important;
	}
	.elementor-menu-toggle:hover {
		background: rgba(186, 153, 63, 0.12) !important;
		border-color: var(--lmx-header-gold) !important;
	}
	.elementor-menu-toggle[aria-expanded="true"] {
		background: var(--lmx-header-gold) !important;
		color: #0d0d0d !important;
		border-color: var(--lmx-header-gold) !important;
		transform: rotate(90deg);
	}
	.elementor-menu-toggle svg { width: 22px !important; height: 22px !important; }

	/* Stato chiuso: nascondi finché aria-hidden="true" (Elementor lo toggla on-tap) */
	.elementor-nav-menu--dropdown[aria-hidden="true"] {
		display: none !important;
	}

	/* ─── DROPDOWN MENU (stato aperto) ─────────────────── */
	.elementor-nav-menu--dropdown {
		background: linear-gradient(180deg, #0d0d0d 0%, #141414 100%) !important;
		background-color: #0d0d0d !important;
		border-top: 1px solid var(--lmx-header-border) !important;
		border-bottom: 1px solid var(--lmx-header-border) !important;
		padding: 22px 0 !important;
		max-height: calc(100vh - 80px);
		overflow-y: auto;
		box-shadow: 0 24px 60px rgba(0, 0, 0, 0.7) !important;
	}

	/* Animation SOLO quando il menu è effettivamente aperto */
	.elementor-nav-menu--dropdown[aria-hidden="false"] {
		animation: lmxMenuSlide 0.3s cubic-bezier(0.16, 1, 0.3, 1);
	}
	@keyframes lmxMenuSlide {
		from { opacity: 0; transform: translateY(-10px); }
		to   { opacity: 1; transform: translateY(0); }
	}

	/* Voci menu */
	.elementor-nav-menu--dropdown .elementor-nav-menu,
	.elementor-nav-menu--dropdown .elementor-nav-menu > li {
		border: 0 !important;
	}
	.elementor-nav-menu--dropdown .elementor-nav-menu a.elementor-item,
	.elementor-nav-menu--dropdown .elementor-nav-menu li a {
		color: var(--lmx-header-text) !important;
		background: transparent !important;
		font-family: var(--lmx-header-serif) !important;
		font-size: 16px !important;
		font-weight: 500 !important;
		letter-spacing: 0.22em !important;
		text-transform: uppercase !important;
		text-align: left !important;
		padding: 18px 28px 18px 64px !important;
		border: 0 !important;
		border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
		display: block !important;
		background-repeat: no-repeat !important;
		background-position: 28px center !important;
		background-size: 22px 22px !important;
		transition: color 0.25s ease, background-color 0.25s ease, padding-left 0.25s ease !important;
		position: relative;
	}

	/* ─── ICONE GOLD LINE (background-image, colore baked) ─── */
	/* Kit Lumalux → barattolo (prima voce, punta a /) */
	.elementor-nav-menu--dropdown .elementor-nav-menu > li:first-child > a.elementor-item {
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23BA993F' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6' y='9' width='12' height='12' rx='1.5'/%3E%3Cpath d='M9 9V6a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v3'/%3E%3Cpath d='M9 13h6'/%3E%3C/svg%3E") !important;
	}
	/* Lavaviso → goccia */
	.elementor-nav-menu--dropdown .elementor-nav-menu a.elementor-item[href*='lavaviso'] {
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23BA993F' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3c-3.2 4-6 7-6 11a6 6 0 0 0 12 0c0-4-2.8-7-6-11z'/%3E%3C/svg%3E") !important;
	}
	/* Travel kit → valigia */
	.elementor-nav-menu--dropdown .elementor-nav-menu a.elementor-item[href*='travel-kit'] {
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23BA993F' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='8' width='16' height='13' rx='1.5'/%3E%3Cpath d='M9 8V6a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v2'/%3E%3Cpath d='M4 14h16'/%3E%3C/svg%3E") !important;
	}
	/* Bodylux → silhouette spa */
	.elementor-nav-menu--dropdown .elementor-nav-menu a.elementor-item[href*='bodylux'] {
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23BA993F' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='6' r='3'/%3E%3Cpath d='M9 22v-7a3 3 0 0 1 6 0v7'/%3E%3C/svg%3E") !important;
	}
	/* Articoli → documento */
	.elementor-nav-menu--dropdown .elementor-nav-menu a.elementor-item[href*='articoli'] {
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23BA993F' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H6a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z'/%3E%3Cpolyline points='14 3 14 9 20 9'/%3E%3Cline x1='8' y1='14' x2='16' y2='14'/%3E%3Cline x1='8' y1='18' x2='13' y2='18'/%3E%3C/svg%3E") !important;
	}
	/* Il mio account → user icon */
	.elementor-nav-menu--dropdown .elementor-nav-menu a.elementor-item[href*='il-mio-account'] {
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23BA993F' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21v-1a6 6 0 0 1 6-6h4a6 6 0 0 1 6 6v1'/%3E%3C/svg%3E") !important;
	}

	/* ─── Separazione visiva "Il mio account" (ultima voce) ─── */
	.elementor-nav-menu--dropdown .elementor-nav-menu > li:last-child {
		margin-top: 10px;
		border-top: 1px solid var(--lmx-header-border);
		padding-top: 4px;
	}
	.elementor-nav-menu--dropdown .elementor-nav-menu > li:last-child a.elementor-item {
		font-size: 13px !important;
		letter-spacing: 0.28em !important;
		color: var(--lmx-header-muted) !important;
		padding-top: 14px !important;
		padding-bottom: 14px !important;
		background-size: 18px 18px !important;
	}
	.elementor-nav-menu--dropdown .elementor-nav-menu li:last-child a.elementor-item {
		border-bottom: 0 !important;
	}

	/* Hover/active/current */
	.elementor-nav-menu--dropdown .elementor-nav-menu a.elementor-item:hover,
	.elementor-nav-menu--dropdown .elementor-nav-menu a.elementor-item:focus,
	.elementor-nav-menu--dropdown .elementor-nav-menu a.elementor-item.elementor-item-active,
	.elementor-nav-menu--dropdown .elementor-nav-menu .current-menu-item > a.elementor-item {
		color: var(--lmx-header-gold) !important;
		background-color: rgba(186, 153, 63, 0.06) !important;
		padding-left: 72px !important;
		background-position: 36px center !important;
	}

	/* Barra gold a sx */
	.elementor-nav-menu--dropdown .elementor-nav-menu a.elementor-item::before {
		content: '';
		position: absolute;
		left: 0;
		top: 50%;
		transform: translateY(-50%) scaleY(0);
		width: 3px;
		height: 22px;
		background: linear-gradient(180deg, var(--lmx-header-gold), var(--lmx-header-gold-2));
		transition: transform 0.3s ease;
	}
	.elementor-nav-menu--dropdown .elementor-nav-menu a.elementor-item:hover::before,
	.elementor-nav-menu--dropdown .elementor-nav-menu a.elementor-item.elementor-item-active::before,
	.elementor-nav-menu--dropdown .elementor-nav-menu .current-menu-item > a.elementor-item::before {
		transform: translateY(-50%) scaleY(1);
	}

	/* Submenu */
	.elementor-nav-menu--dropdown .elementor-nav-menu .sub-menu {
		background: rgba(255, 255, 255, 0.02) !important;
		border: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
	}
	.elementor-nav-menu--dropdown .elementor-nav-menu .sub-menu a {
		font-family: 'Roboto', sans-serif !important;
		font-size: 14px !important;
		font-weight: 500 !important;
		padding-left: 48px !important;
		color: var(--lmx-header-muted) !important;
	}
	.elementor-nav-menu--dropdown .elementor-nav-menu .sub-menu a:hover {
		color: var(--lmx-header-gold) !important;
		padding-left: 56px !important;
	}
	.elementor-nav-menu--dropdown .elementor-nav-menu .sub-arrow {
		color: var(--lmx-header-gold) !important;
		font-size: 16px !important;
		margin-left: auto !important;
	}

	/* Stagger animation per le voci — SOLO quando il menu è aperto */
	@keyframes lmxMenuItem {
		from { opacity: 0; transform: translateX(-12px); }
		to   { opacity: 1; transform: translateX(0); }
	}
	.elementor-nav-menu--dropdown[aria-hidden="false"] .elementor-nav-menu > li {
		animation: lmxMenuItem 0.45s cubic-bezier(0.16, 1, 0.3, 1) both;
	}
	.elementor-nav-menu--dropdown[aria-hidden="false"] .elementor-nav-menu > li:nth-child(1) { animation-delay: 0.05s; }
	.elementor-nav-menu--dropdown[aria-hidden="false"] .elementor-nav-menu > li:nth-child(2) { animation-delay: 0.10s; }
	.elementor-nav-menu--dropdown[aria-hidden="false"] .elementor-nav-menu > li:nth-child(3) { animation-delay: 0.15s; }
	.elementor-nav-menu--dropdown[aria-hidden="false"] .elementor-nav-menu > li:nth-child(4) { animation-delay: 0.20s; }
	.elementor-nav-menu--dropdown[aria-hidden="false"] .elementor-nav-menu > li:nth-child(5) { animation-delay: 0.25s; }
	.elementor-nav-menu--dropdown[aria-hidden="false"] .elementor-nav-menu > li:nth-child(6) { animation-delay: 0.30s; }
	.elementor-nav-menu--dropdown[aria-hidden="false"] .elementor-nav-menu > li:nth-child(7) { animation-delay: 0.35s; }
	.elementor-nav-menu--dropdown[aria-hidden="false"] .elementor-nav-menu > li:nth-child(n+8) { animation-delay: 0.40s; }
}

@media (max-width: 480px) {
	.elementor-nav-menu--dropdown .elementor-nav-menu a.elementor-item,
	.elementor-nav-menu--dropdown .elementor-nav-menu li a {
		font-size: 15px !important;
		letter-spacing: 0.2em !important;
		padding: 16px 22px 16px 56px !important;
		background-position: 22px center !important;
		background-size: 20px 20px !important;
	}
	.elementor-nav-menu--dropdown .elementor-nav-menu a.elementor-item:hover {
		padding-left: 62px !important;
		background-position: 28px center !important;
	}
	.elementor-nav-menu--dropdown .elementor-nav-menu > li:last-child a.elementor-item {
		font-size: 12px !important;
		letter-spacing: 0.26em !important;
	}
	.elementor-nav-menu--dropdown .elementor-nav-menu .sub-menu a {
		padding-left: 38px !important;
		font-size: 13.5px !important;
	}
}

