/* Menu sin Elementor Pro: lo que en Pro hacia el JS del widget (21/09/2026). */

.soma-nav {
	position: relative;
	width: 100%;
}

/* Escritorio: submenus al pasar el raton o con teclado. */
@media ( min-width: 1025px ) {
	.soma-nav .elementor-menu-toggle,
	.soma-nav > nav.elementor-nav-menu--dropdown {
		display: none;
	}

	.soma-nav .elementor-nav-menu--main .sub-menu {
		display: block;
		position: absolute;
		top: 100%;
		left: 0;
		min-width: 240px;
		opacity: 0;
		visibility: hidden;
		transform: translateY(6px);
		transition: opacity .2s ease, transform .2s ease, visibility .2s;
		z-index: 9999;
		padding: 0;
		margin: 0;
		list-style: none;
	}

	.soma-nav .elementor-nav-menu--main > li {
		position: relative;
	}

	.soma-nav .elementor-nav-menu--main li:hover > .sub-menu,
	.soma-nav .elementor-nav-menu--main li:focus-within > .sub-menu,
	.soma-nav .elementor-nav-menu--main li.soma-abierto > .sub-menu {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
	}

	.soma-nav .elementor-nav-menu--main .sub-menu .sub-menu {
		top: 0;
		left: 100%;
	}
}

/* Movil y tablet: hamburguesa y panel desplegable a ancho de pantalla. */
@media ( max-width: 1024px ) {
	.soma-nav > nav.elementor-nav-menu--main {
		display: none;
	}

	.soma-nav .elementor-menu-toggle {
		display: flex;
		margin-left: auto;
	}

	/* El JS lleva el panel al ancho de la ventana (left/width en px), igual que
	   hacia Elementor Pro. Aqui no se usa 100vw: dentro de la cabecera fija
	   ensancharia la pagina y saldria scroll horizontal. */
	.soma-nav > nav.elementor-nav-menu--dropdown {
		position: absolute;
		top: 100%;
		right: 0;
		min-width: 280px;
		max-height: 0;
		overflow: hidden;
		transition: max-height .3s ease;
		z-index: 9999;
	}

	.soma-nav.elementor-active > nav.elementor-nav-menu--dropdown {
		overflow-y: auto;
	}

	.soma-nav > nav.elementor-nav-menu--dropdown .sub-menu {
		display: none;
		padding: 0;
		margin: 0;
		list-style: none;
	}

	.soma-nav > nav.elementor-nav-menu--dropdown li.soma-abierto > .sub-menu {
		display: block;
	}

	.soma-nav .elementor-menu-toggle__icon--close,
	.soma-nav .elementor-menu-toggle.elementor-active .elementor-menu-toggle__icon--open {
		display: none;
	}

	.soma-nav .elementor-menu-toggle.elementor-active .elementor-menu-toggle__icon--close {
		display: block;
	}
}

/* Flecha de los elementos con submenu. */
.soma-nav .sub-arrow {
	display: inline-flex;
	align-items: center;
	margin-left: 5px;
}

.soma-nav .sub-arrow svg {
	width: .6em;
	height: .6em;
	fill: currentColor;
	transition: transform .2s ease;
}

.soma-nav li.soma-abierto > a .sub-arrow svg {
	transform: rotate(180deg);
}

/* Los elementos de menu sin enlace se comportan como boton. */
.soma-nav .elementor-item:not([href]) {
	cursor: pointer;
}
