/*
 * El desplegable «Modalidades» del menú principal.
 *
 * 🔴 **Hacia dónde abre lo decide `menu-modalidades.js`, midiendo, y aquí solo están las posiciones.**
 * La entrada la añade el plugin al final de la barra, y dónde acaba eso depende del ancho: medido el
 * 2026-10-09 en el tema del sitio (`consulting`), a 1715 px queda en el extremo derecho —el segundo
 * nivel, que el tema abre con `left: 100%`, se salía 133 px por la derecha— y a 1213 px la barra salta
 * a dos líneas y queda a la izquierda. Una dirección fija aquí arregla un ancho y rompe el otro.
 *
 * ⚠️ **Las clases van repetidas a propósito.** La regla del tema que hay que vencer es
 * `.main_menu_nav > li .sub-menu > li .sub-menu` (0,3,2); con la clase doble estas pesan más sin depender
 * del nombre de la barra de ningún tema. Y siguen pesando **menos** que las del menú móvil del tema
 * (0,5,0 y más), que además el script no toca: allí el desplegable es una lista hacia abajo.
 *
 * Va en hoja aparte, y no en la del área, porque el menú se pinta en **todas** las páginas y la del
 * área solo se carga en las suyas.
 */

/* La lista de modalidades, alineada por la derecha de la entrada cuando por la izquierda no cabe. */
.fac-menu-modalidades.fac-menu-modalidades.fac-abre-a-la-izquierda > ul {
	left: auto;
	right: 0;
}

/*
 * Y en dos columnas cuando no cabe de alto. Son catorce modalidades: debajo de la cabecera, en la
 * pantalla de un portátil, una sola columna se corta por abajo.
 */
.fac-menu-modalidades.fac-menu-modalidades.fac-dos-columnas > ul {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));

	/*
	 * Por columnas, no por filas: el catálogo va en orden alfabético y se lee bajando por la primera y
	 * luego por la segunda. Las filas las pone el script (la mitad, redondeando hacia arriba) porque el
	 * número de modalidades sale de la base.
	 */
	grid-template-rows: repeat(var(--fac-filas, 7), auto);
	grid-auto-flow: column;
	width: 460px;
}

/* El segundo nivel de cada modalidad, hacia el lado donde cabe. */
.fac-menu-modalidades.fac-menu-modalidades .fac-submenu-modalidad-item.fac-sub-a-la-izquierda > ul {
	left: auto;
	right: 100%;
}

.fac-menu-modalidades.fac-menu-modalidades .fac-submenu-modalidad-item.fac-sub-a-la-derecha > ul {
	left: 100%;
	right: auto;
}

/* Y hacia arriba cuando por abajo se sale: alineado por abajo con la modalidad que lo abre. */
.fac-menu-modalidades.fac-menu-modalidades .fac-submenu-modalidad-item.fac-sub-hacia-arriba > ul {
	top: auto;
	bottom: -2px;
}

/*
 * ⚠️ **Filas más bajas, solo en este desplegable.** El tema da 42 px a cada fila
 * (`padding: 13px 26px 11px`): con catorce, 616 px de lista. Con 8/7 la fila queda en 33 px y la lista en
 * unos 490, que en la mayoría de pantallas cabe sin necesitar las dos columnas. El relleno lateral es el
 * del tema, para que se alinee con el resto de sus desplegables. Las reglas del menú móvil pesan más
 * (0,5,2) y siguen mandando ahí.
 */
.fac-menu-modalidades.fac-menu-modalidades .fac-submenu-modalidad-item > a,
.fac-menu-modalidades.fac-menu-modalidades .fac-modalidad-accion-item > a {
	padding-top: 8px;
	padding-bottom: 7px;
}