/**
 * Med Healing Tours — Header nativo (FASE 4.1)
 *
 * Encapsulado bajo .mht-native-header salvo las excepciones documentadas:
 * 1) body.mht-has-native-header overflow-x (anti-scroll horizontal).
 * 2) GTranslate flotante (.gt_switcher_wrapper) — el plugin lo inyecta
 *    fuera del Header; hay que ocultarlo sin tocar el plugin.
 *
 * !important: únicamente contra CSS inyectado por GTranslate (dwf.js /
 * style.gtranslate_css). Ver PHASE-4-1-NATIVE-HEADER.md.
 */

/* --- tokens --- */
.mht-native-header {
	--mht-teal: #003e4a;
	--mht-gold: #e5c158;
	--mht-text: #ffffff;
	--mht-muted: rgba(255, 255, 255, 0.92);
	--mht-capsule-bg: rgba(255, 255, 255, 0.14);
	--mht-capsule-border: rgba(255, 255, 255, 0.42);
	--mht-line: rgba(255, 255, 255, 0.4);
	--mht-logo-h: 100px;
	--mht-radius: 50px;
	--mht-width: 86%;
	--mht-max: 1280px;
	--mht-fs: 15px;
	--mht-font: "Noto Sans", "Segoe UI", sans-serif;
	box-sizing: border-box;
	position: relative;
	z-index: 1000;
	width: 100%;
	max-width: 100%;
	padding: 8px 0 14px;
	background: transparent;
	color: var(--mht-text);
	font-family: var(--mht-font);
	pointer-events: none;
}

.mht-native-header *,
.mht-native-header *::before,
.mht-native-header *::after {
	box-sizing: border-box;
}

.mht-native-header a,
.mht-native-header button,
.mht-native-header .mht-language,
.mht-native-header .mht-header-capsule {
	pointer-events: auto;
}

/* Overlay sobre el Hero / Home. Sin franja blanca independiente. */
body.home .mht-native-header,
body.front-page .mht-native-header {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
}

body.admin-bar.home .mht-native-header,
body.admin-bar.front-page .mht-native-header {
	top: 32px;
}

@media screen and (max-width: 782px) {
	body.admin-bar.home .mht-native-header,
	body.admin-bar.front-page .mht-native-header {
		top: 46px;
	}
}

/* Páginas internas: el Header ocupa flujo para no tapar contenido Elementor. */
body.mht-has-native-header:not(.home):not(.front-page) .mht-native-header {
	--mht-text: var(--mht-teal);
	--mht-muted: rgba(0, 62, 74, 0.88);
	--mht-capsule-bg: rgba(255, 255, 255, 0.92);
	--mht-capsule-border: rgba(0, 62, 74, 0.14);
	--mht-line: rgba(0, 62, 74, 0.18);
	position: relative;
	top: auto;
}

body.mht-has-native-header {
	overflow-x: clip;
}

/* --- idioma (fuera de la cápsula, alineado a su borde derecho) --- */
.mht-native-header .mht-language {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	width: var(--mht-width);
	max-width: var(--mht-max);
	margin: 0 auto 6px;
	min-height: 22px;
	padding: 0 4px;
	position: relative;
	z-index: 5;
}

.mht-native-header .mht-language .gtranslate_wrapper {
	display: flex;
	justify-content: flex-end;
	background: transparent;
	line-height: 1;
}

/* --- cápsula --- */
.mht-native-header .mht-header-capsule {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	width: var(--mht-width);
	max-width: var(--mht-max);
	margin: 0 auto;
	padding: 8px 24px;
	min-height: 64px;
	background: var(--mht-capsule-bg);
	border: 1.5px solid var(--mht-capsule-border);
	border-radius: var(--mht-radius);
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.22), inset 0 0 10px rgba(255, 255, 255, 0.18);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	position: relative;
}

body.mht-has-native-header:not(.home):not(.front-page) .mht-native-header .mht-header-capsule {
	box-shadow: 0 8px 28px rgba(0, 62, 74, 0.1), inset 0 0 8px rgba(255, 255, 255, 0.4);
}

/* --- logo --- */
.mht-native-header .mht-logo {
	display: flex;
	align-items: center;
	flex: 0 0 auto;
	max-width: 320px;
	line-height: 0;
	text-decoration: none;
	color: inherit;
	overflow: visible;
}

.mht-native-header .mht-logo-img {
	display: block;
	height: var(--mht-logo-h);
	width: auto;
	max-height: var(--mht-logo-h);
	max-width: 320px;
	object-fit: contain;
	object-position: left center;
	/* El PNG 877×500 trae padding transparente (~29% vertical). Estos
	   márgenes compensan ese vacío para que el globo/texto llenen la cápsula
	   sin recortar ni deformar el archivo. */
	margin-top: calc(var(--mht-logo-h) * -0.116);
	margin-bottom: calc(var(--mht-logo-h) * -0.174);
}

body.home .mht-native-header .mht-logo-img,
body.front-page .mht-native-header .mht-logo-img {
	filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.4));
}

.mht-native-header .mht-logo-text {
	font-size: 1rem;
	font-weight: 700;
	letter-spacing: 0.04em;
}

/* --- panel (nav + acciones) --- */
.mht-native-header .mht-header-panel {
	display: flex;
	align-items: center;
	flex: 1 1 auto;
	min-width: 0;
	gap: 12px;
}

.mht-native-header .mht-navigation {
	flex: 1 1 auto;
	min-width: 0;
}

.mht-native-header .mht-nav-list,
.mht-native-header .mht-socials,
.mht-native-header .mht-submenu {
	list-style: none;
	margin: 0;
	padding: 0;
}

.mht-native-header .mht-nav-list {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: nowrap;
	gap: 0;
}

.mht-native-header .mht-nav-item {
	position: relative;
	flex: 0 0 auto;
}

.mht-native-header .mht-nav-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 10px 11px;
	border: 0;
	background: transparent;
	color: var(--mht-text);
	font-family: inherit;
	font-size: var(--mht-fs);
	font-weight: 500;
	letter-spacing: 0.01em;
	line-height: 1.2;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
}

.mht-native-header .mht-nav-link:hover,
.mht-native-header .mht-nav-link:focus-visible,
.mht-native-header .mht-has-children.is-open > .mht-nav-trigger {
	color: var(--mht-gold);
}

.mht-native-header .mht-nav-trigger::after {
	content: "";
	width: 8px;
	height: 5px;
	margin-top: 1px;
	background: currentColor;
	clip-path: polygon(0 0, 100% 0, 50% 100%);
	opacity: 0.85;
}

/* --- dropdown Servicios --- */
.mht-native-header .mht-submenu {
	position: absolute;
	top: calc(100% - 4px);
	left: 50%;
	transform: translateX(-50%) translateY(6px);
	min-width: 248px;
	padding: 8px 0;
	background: rgba(0, 62, 74, 0.96);
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 16px;
	box-shadow: 0 12px 32px rgba(0, 0, 0, 0.28);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	z-index: 20;
}

.mht-native-header .mht-submenu li {
	position: relative;
}

.mht-native-header .mht-submenu a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 10px 16px;
	color: #ffffff;
	font-family: "Poly", Georgia, "Times New Roman", serif;
	font-size: 15px;
	font-weight: 400;
	text-decoration: none;
	white-space: nowrap;
}

.mht-native-header .mht-submenu a:hover,
.mht-native-header .mht-submenu a:focus-visible,
.mht-native-header .mht-submenu .mht-has-children:hover > a,
.mht-native-header .mht-submenu .mht-has-children.is-open > a {
	color: #ffffff;
	background: #002a33;
}

.mht-native-header .mht-submenu__arrow {
	flex-shrink: 0;
	width: 6px;
	height: 10px;
	background: currentColor;
	clip-path: polygon(0 0, 100% 50%, 0 100%);
	opacity: 0.9;
}

.mht-native-header .mht-submenu .mht-submenu {
	top: 0;
	left: calc(100% + 2px);
	transform: none;
	min-width: 248px;
	background: #f4efe4;
	border: 1px solid rgba(0, 62, 74, 0.12);
	border-radius: 12px;
	box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18);
}

.mht-native-header .mht-submenu .mht-submenu a {
	color: #003e4a;
}

.mht-native-header .mht-submenu .mht-submenu a:hover,
.mht-native-header .mht-submenu .mht-submenu a:focus-visible,
.mht-native-header .mht-submenu .mht-submenu .mht-has-children:hover > a,
.mht-native-header .mht-submenu .mht-submenu .mht-has-children.is-open > a {
	color: #ffffff;
	background: #003e4a;
}

@media (hover: hover) and (pointer: fine) {
	.mht-native-header .mht-has-children:hover > .mht-submenu,
	.mht-native-header .mht-has-children:focus-within > .mht-submenu {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transform: translateX(-50%) translateY(0);
	}

	.mht-native-header .mht-submenu .mht-has-children:hover > .mht-submenu,
	.mht-native-header .mht-submenu .mht-has-children:focus-within > .mht-submenu {
		transform: none;
	}
}

.mht-native-header .mht-has-children.is-open > .mht-submenu {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translateX(-50%) translateY(0);
}

.mht-native-header .mht-submenu .mht-has-children.is-open > .mht-submenu {
	transform: none;
}

/* --- acciones --- */
.mht-native-header .mht-header-actions {
	display: flex;
	align-items: center;
	flex: 0 0 auto;
	gap: 12px;
	padding-left: 14px;
	border-left: 1px solid var(--mht-line);
}

.mht-native-header .mht-download {
	display: inline-flex;
	align-items: center;
	padding: 6px 14px;
	border: 1px solid var(--mht-capsule-border);
	border-radius: 999px;
	color: var(--mht-text);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.04em;
	line-height: 1.2;
	text-decoration: none;
	white-space: nowrap;
}

.mht-native-header .mht-download:hover,
.mht-native-header .mht-download:focus-visible {
	color: var(--mht-gold);
	border-color: var(--mht-gold);
}

.mht-native-header .mht-socials {
	display: flex;
	align-items: center;
	gap: 8px;
}

.mht-native-header .mht-social {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	color: var(--mht-text);
	text-decoration: none;
}

.mht-native-header .mht-social svg {
	display: block;
	width: 18px;
	height: 18px;
	fill: currentColor;
}

.mht-native-header .mht-social:hover,
.mht-native-header .mht-social:focus-visible {
	color: var(--mht-gold);
}

.mht-native-header .mht-url-pending {
	cursor: default;
}

/* --- hamburguesa (oculto en desktop) --- */
.mht-native-header .mht-menu-toggle {
	display: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin-left: auto;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--mht-text);
	cursor: pointer;
}

.mht-native-header .mht-menu-toggle__bars,
.mht-native-header .mht-menu-toggle__bars::before,
.mht-native-header .mht-menu-toggle__bars::after {
	display: block;
	width: 22px;
	height: 2px;
	background: currentColor;
	border-radius: 1px;
	position: relative;
}

.mht-native-header .mht-menu-toggle__bars::before,
.mht-native-header .mht-menu-toggle__bars::after {
	content: "";
	position: absolute;
	left: 0;
}

.mht-native-header .mht-menu-toggle__bars::before {
	top: -7px;
}

.mht-native-header .mht-menu-toggle__bars::after {
	top: 7px;
}

.mht-native-header.is-open .mht-menu-toggle__bars {
	background: transparent;
}

.mht-native-header.is-open .mht-menu-toggle__bars::before {
	top: 0;
	transform: rotate(45deg);
}

.mht-native-header.is-open .mht-menu-toggle__bars::after {
	top: 0;
	transform: rotate(-45deg);
}

/* --- GTranslate: interferencia demostrada del plugin --- */
body.mht-has-native-header .gt_switcher_wrapper {
	display: none !important;
}

body.mht-has-native-header .mht-native-header .mht-language .gt_switcher_wrapper {
	display: block !important;
	position: static !important;
	top: auto !important;
	right: auto !important;
	left: auto !important;
	bottom: auto !important;
	width: auto !important;
	z-index: 5 !important;
}

body.mht-has-native-header .mht-native-header .mht-language .gt_switcher {
	width: auto !important;
	min-width: 0 !important;
	overflow: visible !important;
	background: transparent !important;
	line-height: 1 !important;
	font-size: 0 !important;
}

body.mht-has-native-header .mht-native-header .mht-language .gt_selected {
	background: transparent !important;
	background-image: none !important;
}

body.mht-has-native-header .mht-native-header .mht-language .gt_selected a {
	display: inline-flex !important;
	align-items: center !important;
	width: auto !important;
	min-width: 0 !important;
	height: auto !important;
	padding: 0 1.15em 0 0 !important;
	border: none !important;
	background: transparent !important;
	background-image: none !important;
	box-shadow: none !important;
	font-size: 0 !important;
	line-height: 1 !important;
	color: var(--mht-text) !important;
}

body.mht-has-native-header .mht-native-header .mht-language .gt_selected a img {
	display: none !important;
	width: 0 !important;
	height: 0 !important;
}

body.mht-has-native-header .mht-native-header .mht-language .gt_selected a::before {
	content: "ESPAÑOL" !important;
	font-family: var(--mht-font) !important;
	font-size: 0.75rem !important;
	font-weight: 600 !important;
	letter-spacing: 0.1em;
	line-height: 1;
	color: var(--mht-text) !important;
	text-transform: uppercase;
	padding-right: 0.9em;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path d='M1 1l4 4 4-4' fill='none' stroke='%23ffffff' stroke-width='1.2'/></svg>");
	background-repeat: no-repeat;
	background-position: right center;
	background-size: 8px 5px;
}

body.mht-has-native-header:not(.home):not(.front-page) .mht-native-header .mht-language .gt_selected a::before {
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path d='M1 1l4 4 4-4' fill='none' stroke='%23003e4a' stroke-width='1.2'/></svg>");
}

body.mht-has-native-header .mht-native-header .mht-language .gt_selected a::after {
	display: none !important;
	content: none !important;
	width: 0 !important;
	height: 0 !important;
	background-image: none !important;
}

body.mht-has-native-header .mht-native-header .mht-language .gt_option {
	background: rgba(0, 62, 74, 0.96) !important;
}

body.mht-has-native-header .mht-native-header .mht-language .gt_option a {
	color: #ffffff !important;
	font-size: 13px !important;
}

/* --- tablet --- */
@media (max-width: 1200px) {
	.mht-native-header {
		--mht-fs: 14px;
		--mht-logo-h: 76px;
		--mht-width: 92%;
	}

	.mht-native-header .mht-header-capsule {
		padding: 8px 16px;
		gap: 8px;
	}

	.mht-native-header .mht-nav-link {
		padding: 10px 8px;
	}
}

/* --- tablet estrecha / mobile: menú hamburguesa --- */
@media (max-width: 1023px) {
	.mht-native-header {
		--mht-logo-h: 62px;
		--mht-width: 94%;
		--mht-radius: 28px;
	}

	.mht-native-header .mht-header-capsule {
		flex-wrap: wrap;
		min-height: 56px;
		padding: 6px 12px 6px 16px;
		border-radius: var(--mht-radius);
	}

	.mht-native-header .mht-menu-toggle {
		display: inline-flex;
	}

	.mht-native-header .mht-header-panel {
		display: none;
		flex-direction: column;
		align-items: stretch;
		flex: 1 1 100%;
		width: 100%;
		padding: 8px 4px 12px;
		gap: 16px;
	}

	.mht-native-header.is-open .mht-header-panel {
		display: flex;
	}

	.mht-native-header .mht-nav-list {
		flex-direction: column;
		align-items: stretch;
	}

	.mht-native-header .mht-nav-link {
		width: 100%;
		justify-content: space-between;
		padding: 12px 8px;
		white-space: normal;
	}

	.mht-native-header .mht-submenu,
	.mht-native-header .mht-submenu .mht-submenu {
		position: static;
		left: auto;
		top: auto;
		transform: none;
		min-width: 0;
		margin: 0 0 8px;
		display: none;
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		background: rgba(0, 62, 74, 0.88);
		border-radius: 12px;
		box-shadow: none;
	}

	.mht-native-header .mht-submenu .mht-submenu {
		margin: 4px 8px 8px;
		background: #f4efe4;
	}

	.mht-native-header .mht-has-children.is-open > .mht-submenu {
		display: block;
		transform: none;
	}

	.mht-native-header .mht-header-actions {
		flex-wrap: wrap;
		justify-content: flex-start;
		padding-left: 0;
		border-left: 0;
		border-top: 1px solid var(--mht-line);
		padding-top: 12px;
	}
}

@media (max-width: 599px) {
	.mht-native-header {
		--mht-logo-h: 50px;
		--mht-width: 96%;
		padding: 6px 0 10px;
	}

	.mht-native-header .mht-logo {
		max-width: 200px;
	}

	.mht-native-header .mht-logo-img {
		max-width: 200px;
	}

	.mht-native-header .mht-header-capsule {
		padding: 4px 8px 4px 12px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.mht-native-header .mht-submenu,
	.mht-native-header .mht-menu-toggle__bars,
	.mht-native-header .mht-menu-toggle__bars::before,
	.mht-native-header .mht-menu-toggle__bars::after {
		transition: none;
	}
}
