/**
 * Header overrides — Correcciones para la migración
 *
 * style.css (compilado) tiene reglas duplicadas y conflictivas:
 * - body.hamburger-menu header .row .inner aplica 160px auto en todos los viewports
 * - En tablet-down aplica 140px auto
 *
 * Este archivo define UNA sola regla por breakpoint, con !important para que
 * gane sobre las reglas del compilado. Así el inspector muestra menos confusión.
 *
 * Estructura alineada con el original (doc/header/03-responsividad.md):
 * - Mobile (≤64em): header .row .inner → 160px auto
 * - Desktop: grid de 3 columnas según ancho
 *
 * @see doc/header/ANALISIS-HEADER-LEGACY.md
 * @see doc/header/03-responsividad.md
 */

/* Anular background: none del compilado (body.hamburger-menu header): mantener fondo visible */
body.hamburger-menu header {
	background: #fff;
}

/* En páginas que no son home, el main no debe quedar detrás del header (fixed) */
body:not(.home) main {
	padding-top: 78px;
}

@media only screen and (max-width: 64em) {
	body:not(.home) main {
		padding-top: 0px;
	}
}

/* ===== MOBILE (≤64em): una sola regla — como el original ===== */
@media only screen and (max-width: 64em) {
	header .row {
		box-shadow: 0 0 15px -4px rgb(20 20 20 / 0.4);
		padding: 7px 20px !important;
		display: flex;
		height: 60px !important;
	}

	/* Override definitivo: gana sobre body.hamburger-menu header .row .inner (140px) del compilado */
	header .row .inner {
		grid-template-columns: 160px auto !important;
		margin: 0 !important;
	}
}

/* ===== DESKTOP (>64em): anular 160px auto del compilado; restaurar grid de 3 columnas ===== */
@media only screen and (min-width: 64.01em) {
	body.hamburger-menu header .row .inner {
		grid-template-columns: 180px auto 250px !important;
	}
}

@media only screen and (min-width: 64.01em) and (max-width: 83.125em) {
	body.hamburger-menu header .row .inner {
		grid-template-columns: 150px auto 230px !important;
	}
}

@media only screen and (min-width: 64.01em) and (max-width: 78.75em) {
	body.hamburger-menu header .row .inner {
		grid-template-columns: 120px auto !important;
	}
}

/* ===== Homepage: enlaces nav blanco; negro al scroll ===== */
@media only screen and (min-width: 64.1em) {
	.home:not(.location) header .row .nav-links nav ul li a.level-1 {
		color: #fff !important;
	}

	.home header.scrolled .row .nav-links nav ul li a.level-1 {
		color: #231f20 !important;
	}
}

/* Posición del subrayado en enlaces nivel 1 (nav horizontal) */
nav.tresio-nav[data-type='horizontal'] ul.partial_nav li.level-1>a.tresio-nav__link:after {
	top: 18px;
}

/* Menú principal del header: centrar ítems verticalmente */
nav.tresio-nav[data-type="horizontal"] ul.partial_nav {
	align-items: center;
}

/* Gallery: sin margen inferior */
#menu-primary-menu>li.gallery {
	margin-bottom: 0;
}

/* Icono hamburger: contenedor y tres líneas */
.tresio-nav.type-hamburger .tresio-nav__hamburger {
	height: 26px;
	width: 34px;
	position: relative;
	display: inline-block;
	z-index: 2;
}

.tresio-nav.type-hamburger .tresio-nav__hamburger:before,
.tresio-nav.type-hamburger .tresio-nav__hamburger:after,
.tresio-nav.type-hamburger .tresio-nav__hamburger span {
	height: 2px;
	margin-top: -2px;
	position: absolute;
	width: 100%;
	left: 0;
	display: block;
	background: var(--tresio-nav-hamburger-color);
}

.tresio-nav.type-hamburger .tresio-nav__hamburger:before,
.tresio-nav.type-hamburger .tresio-nav__hamburger:after {
	content: "";
	transform-origin: center center;
	transform: rotate(0deg);
	transition: all 0.3s ease;
}

.tresio-nav.type-hamburger .tresio-nav__hamburger:before {
	top: 2px;
}

.tresio-nav.type-hamburger .tresio-nav__hamburger:after {
	bottom: 2px;
	margin-bottom: 0;
}

.tresio-nav.type-hamburger .tresio-nav__hamburger span {
	top: 50%;
}

/* Icono hamburger abierto (X): rotar before y after */
.tresio-nav.type-hamburger .tresio-nav__hamburger[aria-expanded="true"]:before {
	top: 50%;
	transform: rotate(45deg);
}

.tresio-nav.type-hamburger .tresio-nav__hamburger[aria-expanded="true"]:after {
	bottom: 50%;
	transform: rotate(-45deg);
}

/* Menú mobile: oculto por defecto; visible cuando hamburger tiene aria-expanded="true" */
.tresio-nav.type-hamburger .tresio-nav__main {
	display: none !important;
}

.tresio-nav.type-hamburger .tresio-nav__hamburger[aria-expanded="true"]~.tresio-nav__main {
	display: block !important;
}

/* ===== Submenús en header .inner (nav horizontal): solo hover, level-3 a la derecha ===== */
@media only screen and (min-width: 64.01em) {

	/* Solo cuando el nav está en modo horizontal (desktop) */
	header .row .nav-links nav.tresio-nav[data-type="horizontal"] ul.partial_nav,
	header .row .nav-links nav.tresio-nav[data-type="horizontal"] .tresio-nav__main,
	header .row .nav-links nav.tresio-nav.type-horizontal ul.partial_nav,
	header .row .nav-links nav.tresio-nav.type-horizontal .tresio-nav__main {
		position: relative;
		align-items: center;
	}

	/* Ocultar solo los submenús (ul hijos de li), no el ul principal #menu-primary-menu */
	header .row .nav-links nav.tresio-nav[data-type="horizontal"] li>ul.tresio-nav__list,
	header .row .nav-links nav.tresio-nav[data-type="horizontal"] li>ul.sub-menu,
	header .row .nav-links nav.tresio-nav.type-horizontal li>ul.tresio-nav__list,
	header .row .nav-links nav.tresio-nav.type-horizontal li>ul.sub-menu {
		display: none !important;
	}

	/* Mostrar submenú (level-2) al hover del ítem nivel 1 con hijos */
	header .row .nav-links nav.tresio-nav[data-type="horizontal"] ul.partial_nav>li.tresio-nav__list-item--has-children:hover>ul.tresio-nav__list,
	header .row .nav-links nav.tresio-nav[data-type="horizontal"] ul.partial_nav>li.tresio-nav__list-item--has-children:hover>ul.sub-menu,
	header .row .nav-links nav.tresio-nav[data-type="horizontal"] .tresio-nav__main>li.tresio-nav__list-item--has-children:hover>ul.tresio-nav__list,
	header .row .nav-links nav.tresio-nav[data-type="horizontal"] .tresio-nav__main>li.tresio-nav__list-item--has-children:hover>ul.sub-menu,
	header .row .nav-links nav.tresio-nav.type-horizontal ul.partial_nav>li.tresio-nav__list-item--has-children:hover>ul.tresio-nav__list,
	header .row .nav-links nav.tresio-nav.type-horizontal ul.partial_nav>li.tresio-nav__list-item--has-children:hover>ul.sub-menu,
	header .row .nav-links nav.tresio-nav.type-horizontal .tresio-nav__main>li.tresio-nav__list-item--has-children:hover>ul.tresio-nav__list,
	header .row .nav-links nav.tresio-nav.type-horizontal .tresio-nav__main>li.tresio-nav__list-item--has-children:hover>ul.sub-menu {
		display: block !important;
	}

	/* Mostrar sub-submenú (level-3) al hover del ítem level-2 con hijos */
	header .row .nav-links nav.tresio-nav[data-type="horizontal"] li.tresio-nav__list-item--has-children:hover>ul.tresio-nav__list,
	header .row .nav-links nav.tresio-nav[data-type="horizontal"] li.tresio-nav__list-item--has-children:hover>ul.sub-menu,
	header .row .nav-links nav.tresio-nav.type-horizontal li.tresio-nav__list-item--has-children:hover>ul.tresio-nav__list,
	header .row .nav-links nav.tresio-nav.type-horizontal li.tresio-nav__list-item--has-children:hover>ul.sub-menu {
		display: block !important;
	}

	/* Posición del dropdown level-2: debajo del padre */
	header .row .nav-links nav.tresio-nav[data-type="horizontal"] ul.partial_nav>li.tresio-nav__list-item--has-children,
	header .row .nav-links nav.tresio-nav[data-type="horizontal"] .tresio-nav__main>li.tresio-nav__list-item--has-children,
	header .row .nav-links nav.tresio-nav.type-horizontal ul.partial_nav>li.tresio-nav__list-item--has-children,
	header .row .nav-links nav.tresio-nav.type-horizontal .tresio-nav__main>li.tresio-nav__list-item--has-children {
		position: relative;
	}

	header .row .nav-links nav.tresio-nav[data-type="horizontal"] ul.partial_nav>li.tresio-nav__list-item--has-children>ul.tresio-nav__list,
	header .row .nav-links nav.tresio-nav[data-type="horizontal"] ul.partial_nav>li.tresio-nav__list-item--has-children>ul.sub-menu,
	header .row .nav-links nav.tresio-nav[data-type="horizontal"] .tresio-nav__main>li.tresio-nav__list-item--has-children>ul.tresio-nav__list,
	header .row .nav-links nav.tresio-nav[data-type="horizontal"] .tresio-nav__main>li.tresio-nav__list-item--has-children>ul.sub-menu,
	header .row .nav-links nav.tresio-nav.type-horizontal ul.partial_nav>li.tresio-nav__list-item--has-children>ul.tresio-nav__list,
	header .row .nav-links nav.tresio-nav.type-horizontal ul.partial_nav>li.tresio-nav__list-item--has-children>ul.sub-menu,
	header .row .nav-links nav.tresio-nav.type-horizontal .tresio-nav__main>li.tresio-nav__list-item--has-children>ul.tresio-nav__list,
	header .row .nav-links nav.tresio-nav.type-horizontal .tresio-nav__main>li.tresio-nav__list-item--has-children>ul.sub-menu {
		position: absolute;
		left: 0;
		top: 100%;
		z-index: 100;
		min-width: 180px;
		box-shadow: 0 5px 12px rgba(20, 20, 20, 0.15);
		border: 1px solid #e5e5e5;
		border-top: none;
		background: #fff;
		border-radius: 0 0 2px 2px;
	}

	/* Level-3: posicionar a la derecha del ítem padre (no debajo) */
	header .row .nav-links nav.tresio-nav[data-type="horizontal"] li.level-2.tresio-nav__list-item--has-children,
	header .row .nav-links nav.tresio-nav.type-horizontal li.level-2.tresio-nav__list-item--has-children {
		position: relative;
	}

	header .row .nav-links nav.tresio-nav[data-type="horizontal"] li.level-2.tresio-nav__list-item--has-children>ul.tresio-nav__list,
	header .row .nav-links nav.tresio-nav[data-type="horizontal"] li.level-2.tresio-nav__list-item--has-children>ul.sub-menu,
	header .row .nav-links nav.tresio-nav.type-horizontal li.level-2.tresio-nav__list-item--has-children>ul.tresio-nav__list,
	header .row .nav-links nav.tresio-nav.type-horizontal li.level-2.tresio-nav__list-item--has-children>ul.sub-menu {
		position: absolute;
		left: 100%;
		top: 0;
		z-index: 101;
		min-width: 180px;
		box-shadow: 0 5px 12px rgba(20, 20, 20, 0.15);
		border: 1px solid #e5e5e5;
		border-top: none;
		background: #fff;
		border-radius: 0 2px 2px 0;
	}

	/* Evitar que el área .inner recorte los dropdowns */
	header .row .inner {
		overflow: visible;
	}

	header .row .nav-links {
		overflow: visible;
	}
}