/*
 * AZRAHEL — objetivos táctiles de 44 px en la cabecera y el pie de Elementor (todo el sitio).
 * Lo encola mu-plugins/azr-ficha-curso.php. Interruptor propio: AZR_FICHA_CURSO_SITIO_DISABLED.
 *
 * Alcance: solo tamaño mínimo (min-width, min-height) de enlaces y botones de `.elementor-location-header` y
 * `.elementor-location-footer`. Ningún color, tipografía ni reordenación. Medido en la réplica de qa/ficha-curso/
 * (portada, ficha de Terapias, carrito) a 390, 768 y 1440 px.
 *
 * Cómo se limita el cambio de maquetación de Luis: el logo y el título están solos en su fila: se agranda su caja a
 * 44 px y un margen negativo igual al exceso deja su hueco en el flujo como estaba (la zona pulsable crece sobre
 * espacio vacío o sobre texto que no es un enlace). Los iconos, la lupa, el teléfono y los enlaces del pie van en filas
 * o columnas con otros controles: sus cajas no pueden solaparse y ocupan 44 px de verdad. Medido en la réplica: la
 * cabecera crece 17 px a 390, 28 px a 768 y 4 px a 1440; el pie, 98 px a 390 y 39 px desde 768.
 *
 * Los selectores usan clases de Elementor (no los identificadores `elementor-element-xxxx`, que cambian al editar).
 */

/* Iconos sociales (enlaces con aria-label) y teléfono: de 22,5 x 14 px y 150 x 18 px a 44 px de alto, y los iconos a 44 px
 * de ancho. El margen lateral de -8 px compensa los 8 px a cada lado que Elementor pone a cada elemento de la lista:
 * las cajas quedan una junto a otra (paso de 44 px), sin solaparse, y los 6 iconos caben en una fila a 390 px.
 * Donde el contenedor es estrecho (de 768 a 1024 px) la lista ya se partía en dos filas y se sigue partiendo; esa
 * fila crece de verdad (sin margen vertical negativo) para que las cajas de una fila no tapen las de la otra. */
.elementor-location-header .elementor-icon-list-item > a {
	min-height: 44px;
	align-items: center;
}

.elementor-location-header .elementor-icon-list-item > a[aria-label] {
	min-width: 44px;
	margin-inline: -8px;
	justify-content: center;
}

/* Por debajo de 360 px (320 px de ancho de pantalla es un móvil real) seis cajas de 44 px más la lupa no caben en una
 * fila y la lista se partía en dos (+61 px de cabecera). Con 38 px de ancho caben a 320, 330, 345 y 359 px. */
@media (max-width: 359.98px) {
	.elementor-location-header .elementor-icon-list-item > a[aria-label] {
		min-width: 38px;
	}
}

/* Lupa (30 x 30 px). */
.elementor-location-header .elementor-search-form__toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
}

/* Logo (38 x 30 px a 390; 51 x 32 px desde 768) y título «Azrahel del Mayor» (16-20 px de alto). A 390 px el logo
 * gana 6 px de ancho y empuja el título esos 6 px a la derecha. */
.elementor-location-header .elementor-widget-image a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	margin-block: -7px;
	vertical-align: middle;
}

/* El título es texto en línea de 16-20 px de alto: su área pulsable de 44 px es un pseudoelemento centrado sobre él, que
 * no ocupa sitio en el flujo (no hay márgenes negativos ni cambio de `display`). Sin `z-index`: el subtítulo que va
 * debajo es un elemento posicionado posterior y queda por encima, así que la zona no lo tapa. Efecto real medido en la
 * réplica: el toque cae en el enlace 22 px por encima del centro del texto y 12-14 px por debajo (34-36 px en total,
 * no 44). Un medidor que lea la caja del enlace sigue viendo 16-20 px. */
.elementor-location-header .elementor-widget-heading a {
	position: relative;
}

.elementor-location-header .elementor-widget-heading a::after {
	content: "";
	position: absolute;
	inset: 50% 0 auto;
	height: 44px;
	transform: translateY(-50%);
}

/* Hamburguesa (36 x 36 px) y carrito (64 x 40 px). Ya están en una fila más alta que 44 px: no empujan nada. */
.elementor-location-header .elementor-menu-toggle {
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
}

.elementor-location-header .elementor-menu-cart__toggle_button {
	min-height: 44px;
}

/* Enlaces del pie (24,5 px de alto, apilados). El menú principal de escritorio de la cabecera (23 px) no se toca: su
 * subrayado de «página actual» va pegado al borde inferior de la caja y quedaría separado del texto. */
.elementor-location-footer .elementor-nav-menu--main .elementor-item {
	align-items: center;
	min-width: 44px;
	min-height: 44px;
}