/* LÃBERIT · menú de tablet y móvil (swl_cpt_laberit, menu.php): widget «Botón de menú» y ajustes «Menú desplegable
   (LÃBERIT)» del widget «Menú de WordPress». Antes en laberit.css del tema hijo (hasta el 09/11/2026). */

/* --- Botón de menú: tres líneas, la central más corta; con el menú abierto la central se encoge y las otras se cruzan
   en X con rebote (codepen.io/codesuey/pen/YLvrqe, petición del usuario). Ancho en el control «Ancho» (font-size: todo
   va en em), grosor en «Grosor de las líneas» (--fe-grosor), color en «Color» (currentColor). Tres selectores: los
   botones del Kit (.elementor-kit-7 button:hover) los pintarían de rojo. */
.elementor-widget-swl-menu .fe-menu-boton,
.elementor-widget-swl-menu .fe-menu-boton:hover,
.elementor-widget-swl-menu .fe-menu-boton:focus,
.elementor-widget-swl-menu .fe-menu-boton:active {
	display: block;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
	color: inherit;
	line-height: 0;
	cursor: pointer;
	transition: color .2s;
}
.fe-menu-boton span {
	position: relative;
	display: block;
	width: 1em;
	height: .75em;
	background: linear-gradient(currentColor, currentColor) center / 60% var(--fe-grosor, 3px) no-repeat;
	transition: background-size .5s cubic-bezier(.175, .885, .32, 1.275);
}
.fe-menu-boton span::before,
.fe-menu-boton span::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	height: var(--fe-grosor, 3px);
	border-radius: var(--fe-grosor, 3px);
	background: currentColor;
	transition: all .5s cubic-bezier(.175, .885, .32, 1.275);
}
.fe-menu-boton span::before { top: 0; }
.fe-menu-boton span::after { bottom: 0; }
.fe-menu-abierto .fe-menu-boton span { background-size: 0 var(--fe-grosor, 3px); }
.fe-menu-abierto .fe-menu-boton span::before { top: calc(50% - var(--fe-grosor, 3px) / 2); transform: rotate(-45deg); }
.fe-menu-abierto .fe-menu-boton span::after { bottom: calc(50% - var(--fe-grosor, 3px) / 2); transform: rotate(45deg); }
.elementor-widget-swl-menu .fe-menu-boton:focus-visible { outline: 2px solid currentColor; outline-offset: 6px; }

/* --- Popup del menú (el que abre el botón; swl-menu.js le pone .fe-menu-popup). Con la cabecera a la vista, la cabecera
   queda encima del panel y su X lo cierra: el panel empieza debajo de ella y no lleva su propio cierre. */
.fe-menu-con-cabecera [data-elementor-type="header"] { position: relative; z-index: 10000; }
.fe-menu-con-cabecera .fe-menu-popup .dialog-widget-content { padding-top: var(--fe-cabecera, 0); }
.fe-menu-con-cabecera .fe-menu-popup .dialog-close-button { display: none; }
/* La zona con scroll mide toda la pantalla: tiene que acabar en el borde o lo último del menú queda fuera de alcance.
   !important: Elementor fija esa altura con un selector por id del popup. */
.fe-menu-con-cabecera .fe-menu-popup .dialog-message {
	height: calc(100vh - var(--fe-menu-top, 0px)) !important;
	height: calc(100dvh - var(--fe-menu-top, 0px)) !important;
}
/* El primer contenedor del popup, a todo el alto (lo de abajo, como «Contacta» y el idioma, queda abajo). Depende de la
   cabecera visible (lo mide swl-menu.js): no puede ir en el control «Altura mínima». */
.fe-menu-popup [data-elementor-type="popup"] > .e-con:first-child {
	min-height: calc(100vh - var(--fe-menu-top, 0px));
	min-height: calc(100dvh - var(--fe-menu-top, 0px));
}

/* --- «Menú de WordPress» con «El nombre enlaza y la flecha despliega» (.fe-menu-acordeon-yes): flecha a la derecha,
   girada al abrir; su zona de toque es de 44px alrededor del icono de 14px y el toque cuenta en el .sub-arrow, no en su
   icono (SmartMenus solo reconoce el .sub-arrow); el apartado abierto, en negrita; → en las páginas del subnivel (↓ si
   van a una sección). Tipografías, rellenos y color de la flecha, en los controles. */
.fe-menu-acordeon-yes {
	--fe-flecha: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z'/%3E%3C/svg%3E");
}
.fe-menu-acordeon-yes .elementor-nav-menu--dropdown a {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 16px;
}
.fe-menu-acordeon-yes .elementor-nav-menu--dropdown .sub-arrow {
	margin: -15px -15px -15px auto !important;
	padding: 15px !important;
	transition: transform .2s ease;
}
.fe-menu-acordeon-yes .elementor-nav-menu--dropdown .sub-arrow > * { pointer-events: none; }
.fe-menu-acordeon-yes .elementor-nav-menu--dropdown a.highlighted .sub-arrow { transform: rotate(180deg); }
.fe-menu-acordeon-yes .elementor-nav-menu--dropdown > ul > li > a.highlighted { font-weight: 700 !important; }
.fe-menu-acordeon-yes .elementor-nav-menu--dropdown .sub-menu li:not(.menu-item-has-children) > a::after {
	content: "";
	flex: none;
	width: 12px;
	height: 12px;
	background: var(--fe-flecha-color, var(--e-global-color-primary));
	-webkit-mask: var(--fe-flecha) center / contain no-repeat;
	mask: var(--fe-flecha) center / contain no-repeat;
}
.fe-menu-acordeon-yes .elementor-nav-menu--dropdown .sub-menu a[href*="#"]::after { transform: rotate(90deg); }