/* =========================================================================
   nm-core · front.css (tanda 09-oct · P10)
   Lo común a los dos colegios en el sitio público que no es de ningún
   componente. Solo tokens --nm-* del nm.css de cada tema, con respaldo.
   Sitio público recto: var(--nm-radio), que vale 0.
   ========================================================================= */

/* -------------------------------------------------------------------------
   1 · Módulos vacíos
   Un shortcode sin contenido devuelve <div class="nm-modulo-vacio" hidden>
   (inc/front.php · nm_modulo_vacio). Se oculta en tres niveles:
   ------------------------------------------------------------------------- */

/* a) El marcador y el widget que lo trae como contenido propio (también sin
   :has, por el atributo hidden). Solo como hijo directo del widget (con o sin
   .elementor-widget-container, que Elementor 4 omite en el marcado
   optimizado): un Loop Grid cuyas fichas trajeran un marcador adentro no
   debe desaparecer entero. */
.nm-modulo-vacio {
	display: none !important;
}

.elementor-widget:has(
	> .nm-modulo-vacio,
	> .elementor-widget-container > .nm-modulo-vacio,
	> .elementor-shortcode > .nm-modulo-vacio,
	> .elementor-widget-container > .elementor-shortcode > .nm-modulo-vacio
) {
	display: none !important;
}

/* b) La sección: el contenedor de Elementor que tiene ese widget como hijo
   directo, con su título y su bajada. Solo si no le queda nada propio: ningún
   contenedor hijo, ningún Loop Grid con fichas, ningún otro shortcode con
   contenido ni un widget de contenido (imagen, video, formulario, mapa, HTML).
   Títulos, textos, divisores, botones e íconos se van con la sección: son el
   encabezado del módulo. Se mira solo un nivel, nunca un ancestro más alto,
   para no ocultar la página entera.
   Dos variantes: contenedor de ancho completo (hijos directos) y en caja
   (hijos dentro de .e-con-inner). Probado con la estructura real de
   elementor.json de NH y del espejo de NM (Reglamentos/Apoderados, Admisión,
   Apoyo, PIE, ficha de nivel, Comunidad). */
.e-con:has(
	> .elementor-widget > .nm-modulo-vacio,
	> .elementor-widget > .elementor-widget-container > .nm-modulo-vacio,
	> .elementor-widget > .elementor-shortcode > .nm-modulo-vacio,
	> .elementor-widget > .elementor-widget-container > .elementor-shortcode > .nm-modulo-vacio
):not(:has(
	> .e-con,
	> .elementor-widget .e-loop-item,
	> .elementor-widget-shortcode .elementor-shortcode > :not(.nm-modulo-vacio),
	> :is(.elementor-widget-image, .elementor-widget-video, .elementor-widget-image-gallery, .elementor-widget-gallery, .elementor-widget-form, .elementor-widget-metform, .elementor-widget-google_maps, .elementor-widget-html, .elementor-widget-posts, .elementor-widget-loop-carousel, .elementor-widget-theme-post-content)
)),
.e-con:has(
	> .e-con-inner > .elementor-widget > .nm-modulo-vacio,
	> .e-con-inner > .elementor-widget > .elementor-widget-container > .nm-modulo-vacio,
	> .e-con-inner > .elementor-widget > .elementor-shortcode > .nm-modulo-vacio,
	> .e-con-inner > .elementor-widget > .elementor-widget-container > .elementor-shortcode > .nm-modulo-vacio
):not(:has(
	> .e-con-inner > .e-con,
	> .e-con-inner > .elementor-widget .e-loop-item,
	> .e-con-inner > .elementor-widget-shortcode .elementor-shortcode > :not(.nm-modulo-vacio),
	> .e-con-inner > :is(.elementor-widget-image, .elementor-widget-video, .elementor-widget-image-gallery, .elementor-widget-gallery, .elementor-widget-form, .elementor-widget-metform, .elementor-widget-google_maps, .elementor-widget-html, .elementor-widget-posts, .elementor-widget-loop-carousel, .elementor-widget-theme-post-content)
)) {
	display: none !important;
}

/* c) En el editor de Elementor no se oculta nada: se ve este aviso. */
.nm-modulo-vacio-aviso {
	margin: 0;
	padding: 12px 16px;
	border: 1px dashed var(--nm-gris-borde, #E6E0EF);
	border-radius: var(--nm-radio, 0);
	background: var(--nm-fondo-claro, #F8F5FC);
	color: var(--nm-gris-texto, #4A4A5A);
	font: 500 14px/1.5 var(--nm-font-cuerpo, system-ui, sans-serif);
}

/* -------------------------------------------------------------------------
   2 · Socios estratégicos: flechas del carrusel
   La pista sigue siendo scroll-snap (dedo, rueda, teclado). Las flechas son
   un atajo para el mouse; front.js las muestra solo si la pista se desborda.
   ------------------------------------------------------------------------- */
.nm-socios__controles {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
	margin: -12px 0 16px;
}

.nm-socios__controles[hidden] {
	display: none;
}

body .nm-socios__flecha {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	min-width: 44px;
	padding: 0;
	margin: 0;
	border: 1px solid var(--nm-gris-borde, #E6E0EF);
	border-radius: var(--nm-radio, 0);
	background: var(--nm-blanco, #FFFFFF);
	color: var(--nm-morado, #773CBD);
	box-shadow: none;
	cursor: pointer;
	line-height: 0;
	transition: border-color .15s ease, background-color .15s ease;
}

body .nm-socios__flecha[hidden] {
	display: none;
}

body .nm-socios__flecha svg {
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: square;
}

body .nm-socios__flecha:hover:not([aria-disabled="true"]),
body .nm-socios__flecha:focus-visible {
	border-color: var(--nm-morado, #773CBD);
	background: var(--nm-fondo-claro, #F8F5FC);
	color: var(--nm-morado, #773CBD);
}

body .nm-socios__flecha:focus-visible {
	outline: 3px solid var(--nm-amarillo, #FCCC00);
	outline-offset: 2px;
}

body .nm-socios__flecha[aria-disabled="true"] {
	opacity: .35;
	cursor: default;
}

@media (prefers-reduced-motion: reduce) {
	body .nm-socios__flecha {
		transition: none;
	}
}

/* En el teléfono se desliza con el dedo: las flechas sobran. */
@media (max-width: 767px) {
	.nm-socios__controles {
		display: none;
	}
}