/* BW3D — apertura del submenu del header sin depender de SmartMenus.
 *
 * Elementor Pro abre los submenus del menu principal con JS (SmartMenus, que
 * agrega la clase .sm al <ul>). En este sitio ese handler no se inicializa, asi
 * que el submenu quedaba en display:none para siempre. Como nunca hubo un
 * submenu hasta ahora, el problema no se habia notado.
 *
 * Esto lo resuelve con CSS puro: hover para mouse y focus-within para teclado.
 * Solo aplica de 1025px para arriba (el breakpoint lg del Kit); en tablet y
 * mobile el menu vive dentro del hamburguesa y no se toca.
 *
 * Los colores, tipografia, fillet y sombra del panel NO se definen aca: salen de
 * los ajustes del widget en la plantilla del header (91), como el resto.
 */

@media (min-width: 1025px) {

	.elementor-widget-nav-menu .elementor-nav-menu--main li.menu-item-has-children {
		position: relative;
	}

	.elementor-widget-nav-menu .elementor-nav-menu--main li.menu-item-has-children > ul.sub-menu {
		display: block;
		position: absolute;
		top: 100%;
		left: 0;
		z-index: 999;
		min-width: 190px;
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transform: translateY(-6px);
		transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
	}

	.elementor-widget-nav-menu .elementor-nav-menu--main li.menu-item-has-children:hover > ul.sub-menu,
	.elementor-widget-nav-menu .elementor-nav-menu--main li.menu-item-has-children:focus-within > ul.sub-menu {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transform: translateY(0);
	}

	/* El ultimo item de la barra queda pegado al borde derecho: se alinea el panel
	   a la derecha para que no se corte fuera de la pantalla. */
	.elementor-widget-nav-menu .elementor-nav-menu--main > ul > li.menu-item-has-children:last-child > ul.sub-menu {
		left: auto;
		right: 0;
	}

	/* Puente invisible: evita que el submenu se cierre al cruzar el gap con el mouse. */
	.elementor-widget-nav-menu .elementor-nav-menu--main li.menu-item-has-children > ul.sub-menu::before {
		content: "";
		position: absolute;
		top: -10px;
		left: 0;
		right: 0;
		height: 10px;
	}
}

/* Dentro del hamburguesa no hay hover y el toggle del submenu tambien depende del
   JS que no arranca, asi que la lista de marcas se muestra desplegada e indentada.
   Es el patron habitual en menus off-canvas y evita un item que no hace nada. */
@media (max-width: 1024px) {

	.elementor-nav-menu--dropdown li.menu-item-has-children > ul.sub-menu {
		display: block;
		position: static;
		opacity: 1;
		visibility: visible;
		box-shadow: none;
		border-radius: 0;
	}

	.elementor-nav-menu--dropdown li.menu-item-has-children > ul.sub-menu .elementor-item {
		padding-left: 36px;
		font-size: 12px;
		opacity: 0.85;
	}

	/* La flecha sugiere un toggle que ya no existe. */
	.elementor-nav-menu--dropdown li.menu-item-has-children > a .sub-arrow {
		display: none;
	}
}
