/*
 * Asap Libre 3.1.1 — Menú mejorado (recibos-cfe.com.mx)
 * Solo toca el menú. Colores heredados (currentColor) del Personalizador:
 * fondo de cabecera y color de texto se mantienen.
 */

/* ===== Ordenador (>= 1051px) ===== */
@media (min-width: 1051px) {
	.site-header-content { flex-wrap: nowrap; }
	#menu > ul {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		flex-wrap: nowrap;
		white-space: nowrap;
	}
	#menu > ul > li { margin: 0 0 0 22px; position: relative; }
	#menu > ul > li > a { position: relative; display: inline-block; }
	#menu > ul > li > a::after {
		content: "";
		position: absolute;
		left: 0; right: 0; bottom: 14px;
		height: 2px;
		background: currentColor;
		transform: scaleX(0);
		transform-origin: left;
		transition: transform .2s ease;
	}
	#menu > ul > li:hover > a::after,
	#menu > ul > li:focus-within > a::after,
	#menu > ul > li.current-menu-item > a::after,
	#menu > ul > li.current-menu-ancestor > a::after,
	#menu > ul > li.current-menu-parent > a::after { transform: scaleX(1); }

	/* Submenú también accesible con teclado y si el JS tarda en cargar */
	#menu > ul > li:hover > ul,
	#menu > ul > li:focus-within > ul {
		display: block;
		visibility: visible;
		opacity: 1;
	}
	#menu > ul > li > ul a { white-space: nowrap; }
	#menu a:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
}

/* Portátiles pequeños: menos separación para que no se parta en dos líneas */
@media (min-width: 1051px) and (max-width: 1279px) {
	#menu > ul > li { margin-left: 14px; }
	#menu > ul > li > a { font-size: .95em; }
}

/* ===== Tablet y móvil (<= 1050px) ===== */
@media (max-width: 1050px) {
	.site-header-content { position: relative; min-height: 60px; }

	/* Hamburguesa dentro de la cabecera (no flotante sobre el contenido) */
	header label#nav-icon {
		position: absolute !important;
		top: 50% !important;
		right: 12px !important;
		bottom: auto !important;
		left: auto !important;
		transform: translateY(-50%);
		width: 48px !important;
		height: 48px !important;
		margin: 0 !important;
		background: transparent !important;
		box-shadow: none !important;
		border-radius: 8px !important;
		display: flex !important;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		z-index: 1001 !important;
	}
	header label#nav-icon .line { background: currentColor !important; }

	/* Panel del menú bajo la cabecera, ocupando el resto de la pantalla */
	#menu {
		top: 60px !important;
		margin-top: 0 !important;
		height: calc(100vh - 60px) !important;
		height: calc(100dvh - 60px) !important;
		background: #fff !important;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		overscroll-behavior: contain;
		z-index: 1000;
	}
	#menu > ul > li {
		border-bottom: 1px solid #eee;
		background: #fff !important;
	}
	#menu ul li a { min-height: 48px; }
	#menu ul ul li { border-top: 1px solid #f2f2f2; }

	/* Bloquear el scroll de la página con el menú abierto */
	body:has(#btn-menu:checked) { overflow: hidden; }
}