/* Widget "Menu Approdo" (Approdo Kit): voci su una riga, sottomenu a tendina e pannelli a tutta larghezza.
   Le regole del menu mobile stanno in menu-compact.css e si stampano con il punto di passaggio scelto nel widget. */
.approdo-menu {
	--am-color: currentColor;
	--am-hover: var(--am-color);
	--am-active: var(--am-color);
	--am-line: var(--e-global-color-accent, currentColor);
	--am-line-h: 1px;
	--am-gap: 30px;
	--am-sub-bg: #fff;
	--am-sub-color: #292824;
	--am-sub-hover: #292824;
	--am-sub-radius: 4px;
	--am-panel-bg: #fff;
	--am-panel-gap: 0px;
	--am-burger-color: currentColor;
	--am-burger-bg: transparent;
	--am-burger-border: transparent;
	--am-burger-size: 44px;
	--am-burger-radius: 999px;
	--am-drawer-bg: #fff;
	--am-drawer-color: #292824;
	--am-drawer-width: 80%;
	--am-drawer-pad: 28px;
	--am-drawer-item-h: 56px;
	--am-drawer-line: rgba(127, 127, 127, .24);
	--am-drawer-active: var(--am-drawer-color);
	--am-drawer-foot-color: var(--am-drawer-color);
	--am-drawer-logo-w: 120px;
	--am-button-bg: var(--am-drawer-color);
	--am-button-color: var(--am-drawer-bg);
	--am-button-bg-hover: var(--am-line);
	--am-button-color-hover: #292824;
	--am-button-radius: 2px;
	--am-overlay: rgba(20, 20, 18, .45);
	--am-ease: cubic-bezier(.2, .7, .2, 1);
	position: relative;
	display: flex;
	align-items: center;
	justify-content: var(--am-justify, flex-start);
	color: var(--am-color);
}
.approdo-menu .elementor-screen-only,
.approdo-menu .screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
.approdo-menu__drawer { display: flex; flex: 1 1 auto; justify-content: var(--am-justify, flex-start); min-width: 0; }
.approdo-menu__toggle,
.approdo-menu__drawer-head,
.approdo-menu__drawer-foot,
.approdo-menu__overlay { display: none; }
.approdo-menu__list,
.approdo-menu .sub-menu { list-style: none; margin: 0; padding: 0; }
.approdo-menu__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: var(--am-justify, flex-start);
	column-gap: var(--am-gap);
	row-gap: 2px;
	flex: 1 1 auto;
}
.approdo-menu li { position: relative; }
.approdo-menu__list > li { display: flex; align-items: center; }

/* Voci di primo livello: sottolineatura che si disegna da sinistra. */
.approdo-menu__list > li > a {
	position: relative;
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 8px 0;
	color: var(--am-color);
	text-decoration: none;
	white-space: nowrap;
	transition: color .3s ease;
}
.approdo-menu__list > li > a::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 8px;
	height: var(--am-line-h);
	background: var(--am-line);
	transform: scaleX(0);
	transform-origin: right center;
	transition: transform .5s var(--am-ease);
}
.approdo-menu__list > li:hover > a,
.approdo-menu__list > li.is-open > a,
.approdo-menu__list > li > a:focus-visible { color: var(--am-hover); }
.approdo-menu__list > li:hover > a::after,
.approdo-menu__list > li.is-open > a::after,
.approdo-menu__list > li > a:focus-visible::after {
	transform: scaleX(1);
	transform-origin: left center;
}
.approdo-menu__list > .current-menu-item > a,
.approdo-menu__list > .current-menu-ancestor > a,
.approdo-menu__list > .current_page_item > a,
.approdo-menu__list > .current_page_ancestor > a { color: var(--am-active); }
.approdo-menu__list > .current-menu-item > a::after,
.approdo-menu__list > .current-menu-ancestor > a::after,
.approdo-menu__list > .current_page_item > a::after,
.approdo-menu__list > .current_page_ancestor > a::after { transform: scaleX(1); }
.approdo-menu a:focus-visible,
.approdo-menu button:focus-visible { outline: 2px solid var(--am-line); outline-offset: 3px; border-radius: 2px; }

/* Voci solo per il menu mobile (classe ap-only-mobile) o solo per il desktop (ap-only-desktop):
   il contrario sta in menu-compact.css, dentro il @media del punto di passaggio. */
.approdo-menu .ap-only-mobile { display: none; }

/* Pulsante del sottomenu (freccia). */
.approdo-menu .ap-sub-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	min-width: 24px;
	height: 44px;
	margin: 0 0 0 2px;
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	cursor: pointer;
	box-shadow: none;
	line-height: 1;
}
.approdo-menu .ap-sub-toggle svg { display: block; width: 14px; height: 14px; transition: transform .35s var(--am-ease); }
.approdo-menu li.is-open > .ap-sub-toggle svg { transform: rotate(180deg); }
.approdo-menu--no-indicator:not(.is-compact) .approdo-menu__list > li > .ap-sub-toggle { width: 1px; min-width: 1px; margin: 0; opacity: 0; }
.approdo-menu--no-indicator:not(.is-compact) .approdo-menu__list > li > .ap-sub-toggle:focus-visible { width: 24px; min-width: 24px; opacity: 1; }

/* Sottomenu a tendina. */
.approdo-menu .sub-menu {
	position: absolute;
	top: 100%;
	left: -20px;
	z-index: 60;
	min-width: 240px;
	padding: 12px 0;
	background: var(--am-sub-bg);
	color: var(--am-sub-color);
	border-radius: var(--am-sub-radius);
	box-shadow: 0 26px 50px -26px rgba(20, 20, 18, .45);
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity .25s ease, transform .35s var(--am-ease), visibility 0s linear .35s;
}
.approdo-menu .sub-menu .sub-menu { top: -12px; left: 100%; }
.approdo-menu li.is-open > .sub-menu,
.approdo-menu:not(.is-ready) li:hover > .sub-menu,
.approdo-menu:not(.is-ready) li:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: none;
	transition-delay: 0s;
}
.approdo-menu .sub-menu li { display: flex; align-items: center; }
.approdo-menu .sub-menu a {
	display: block;
	flex: 1 1 auto;
	padding: 9px 24px;
	color: var(--am-sub-color);
	text-decoration: none;
	white-space: nowrap;
	transition: color .25s ease, background-color .25s ease, padding .35s var(--am-ease);
}
.approdo-menu .sub-menu a:hover,
.approdo-menu .sub-menu a:focus-visible { color: var(--am-sub-hover); background: rgba(127, 127, 127, .08); padding-left: 30px; }
.approdo-menu .sub-menu .current-menu-item > a { font-weight: 600; }
.approdo-menu .sub-menu .ap-sub-toggle { height: 36px; margin-right: 10px; transform: rotate(-90deg); }

/* Pannelli del mega menu: a tutta larghezza sotto l'header (posizione calcolata da menu.js). */
.approdo-menu .ap-mega--panel > .sub-menu { display: none; }
.approdo-menu .ap-mega-panel {
	position: fixed;
	top: var(--am-panel-top, 80px);
	left: 0;
	right: 0;
	z-index: 999;
	max-height: calc(100vh - var(--am-panel-top, 80px));
	overflow-y: auto;
	overscroll-behavior: contain;
	background: var(--am-panel-bg);
	color: var(--am-sub-color);
	box-shadow: 0 40px 60px -44px rgba(20, 20, 18, .5);
	text-align: left;
	white-space: normal;
}
.approdo-menu .ap-mega-panel[hidden] { display: none; }
.approdo-menu .ap-mega-panel:not([hidden]) { animation: approdo-menu-panel .5s var(--am-ease) both; }
@keyframes approdo-menu-panel { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }

/* Mentre un pannello o il menu mobile sono aperti, gli antenati con transform o filtri non devono
   "intrappolare" gli elementi fissi (menu.js aggiunge la classe solo per il tempo dell'apertura). */
.approdo-menu-unclip {
	transform: none !important;
	filter: none !important;
	-webkit-backdrop-filter: none !important;
	backdrop-filter: none !important;
	perspective: none !important;
	contain: none !important;
	will-change: auto !important;
}
html.approdo-menu-locked,
html.approdo-menu-locked body { overflow: hidden; }

.approdo-menu-empty { padding: 10px; border: 1px dashed currentColor; font-size: 13px; opacity: .7; }

@media (prefers-reduced-motion: reduce) {
	.approdo-menu *,
	.approdo-menu *::before,
	.approdo-menu *::after { transition-duration: .01ms !important; animation: none !important; }
}

/* I pulsanti del menu non prendono lo stile globale dei pulsanti (tema o kit di Elementor) al passaggio o al tocco. */
.approdo-menu .ap-sub-toggle:hover,
.approdo-menu .ap-sub-toggle:focus,
.approdo-menu .approdo-menu__close:hover,
.approdo-menu .approdo-menu__close:focus { background: transparent; color: inherit; transform: none; box-shadow: none; }
.approdo-menu .approdo-menu__toggle:hover,
.approdo-menu .approdo-menu__toggle:focus { background: var(--am-burger-bg); color: var(--am-burger-color); transform: none; box-shadow: none; }
@media (hover: hover) {
	.approdo-menu .approdo-menu__close:hover { background: rgba(127, 127, 127, .12); }
}