/**
 * BuenTheme — CSS crítico overlay de navegación (v2.6.10)
 * Cubre: .is-menu-open, :popover-open y .buentheme-nav-portal
 * Top-layer (popover) escapa containing-blocks del header.
 */

/* ========== Estado CERRADO: solo ocultar botón X (no el chrome/logo) ========== */
.wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__responsive-container-close,
.wp-block-navigation-overlay:not(.is-menu-open) .wp-block-navigation__responsive-container-close {
	display: none !important;
}

/* ========== Estado abierto (core + nuestro) ========== */
.wp-block-navigation__responsive-container.is-menu-open,
.wp-block-navigation__responsive-container.buentheme-nav-portal,
.wp-block-navigation__responsive-container:popover-open,
.wp-block-navigation-overlay.is-menu-open,
.wp-block-navigation-overlay.buentheme-nav-portal,
.wp-block-navigation-overlay:popover-open {
	/* Reset de estilos nativos de popover */
	border: none !important;
	padding: 0 !important;
	margin: 0 !important;
	inset: 0 !important;
	top: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	left: 0 !important;
	position: fixed !important;
	width: 100vw !important;
	max-width: none !important;
	height: 100vh !important;
	height: 100dvh !important;
	max-height: none !important;
	z-index: 1000000 !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
	justify-content: flex-start !important;
	visibility: visible !important;
	opacity: 1 !important;
	transform: none !important;
	pointer-events: auto !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
	/* Backdrop del drawer */
	background: rgba(15, 23, 42, 0.5) !important;
	-webkit-backdrop-filter: blur(2px);
	backdrop-filter: blur(2px);
	color: #0f172a !important;
	/* Anular UA popover */
	overflow: hidden !important;
}

/* Popover UA añade ::backdrop; reforzar */
.wp-block-navigation__responsive-container:popover-open::backdrop,
.wp-block-navigation-overlay:popover-open::backdrop {
	background: rgba(15, 23, 42, 0.45);
	-webkit-backdrop-filter: blur(2px);
	backdrop-filter: blur(2px);
}

.admin-bar .wp-block-navigation__responsive-container.is-menu-open,
.admin-bar .wp-block-navigation__responsive-container.buentheme-nav-portal,
.admin-bar .wp-block-navigation__responsive-container:popover-open,
.admin-bar .wp-block-navigation-overlay.is-menu-open,
.admin-bar .wp-block-navigation-overlay.buentheme-nav-portal,
.admin-bar .wp-block-navigation-overlay:popover-open {
	top: 32px !important;
	height: calc(100vh - 32px) !important;
	height: calc(100dvh - 32px) !important;
}

@media screen and (max-width: 782px) {
	.admin-bar .wp-block-navigation__responsive-container.is-menu-open,
	.admin-bar .wp-block-navigation__responsive-container.buentheme-nav-portal,
	.admin-bar .wp-block-navigation__responsive-container:popover-open,
	.admin-bar .wp-block-navigation-overlay.is-menu-open,
	.admin-bar .wp-block-navigation-overlay.buentheme-nav-portal,
	.admin-bar .wp-block-navigation-overlay:popover-open {
		top: 46px !important;
		height: calc(100vh - 46px) !important;
		height: calc(100dvh - 46px) !important;
	}
}

/* ========== Panel drawer (derecha) ========== */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog,
.wp-block-navigation__responsive-container.buentheme-nav-portal .wp-block-navigation__responsive-close,
.wp-block-navigation__responsive-container.buentheme-nav-portal .wp-block-navigation__responsive-dialog,
.wp-block-navigation__responsive-container:popover-open .wp-block-navigation__responsive-close,
.wp-block-navigation__responsive-container:popover-open .wp-block-navigation__responsive-dialog {
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
	width: min(var(--buentheme-overlay-width, 85%), 420px) !important;
	max-width: 100% !important;
	height: 100% !important;
	margin-left: auto !important;
	margin-right: 0 !important;
	background: var(--buentheme-overlay-bg-color, #ffffff) !important;
	box-shadow: -16px 0 48px rgba(15, 23, 42, 0.22) !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
	border: none !important;
	border-radius: 0 !important;
}

/* Fullscreen mode */
.buentheme-overlay-mode-fullscreen.is-menu-open .wp-block-navigation__responsive-close,
.buentheme-overlay-mode-fullscreen.is-menu-open .wp-block-navigation__responsive-dialog,
.buentheme-overlay-mode-fullscreen.buentheme-nav-portal .wp-block-navigation__responsive-close,
.buentheme-overlay-mode-fullscreen.buentheme-nav-portal .wp-block-navigation__responsive-dialog,
.buentheme-overlay-mode-fullscreen:popover-open .wp-block-navigation__responsive-close,
.buentheme-overlay-mode-fullscreen:popover-open .wp-block-navigation__responsive-dialog {
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	box-shadow: none !important;
}

/* Slide from left */
.buentheme-overlay-anim-slide-left.is-menu-open .wp-block-navigation__responsive-close,
.buentheme-overlay-anim-slide-left.is-menu-open .wp-block-navigation__responsive-dialog,
.buentheme-overlay-anim-slide-left.buentheme-nav-portal .wp-block-navigation__responsive-close,
.buentheme-overlay-anim-slide-left.buentheme-nav-portal .wp-block-navigation__responsive-dialog,
.buentheme-overlay-anim-slide-left:popover-open .wp-block-navigation__responsive-close,
.buentheme-overlay-anim-slide-left:popover-open .wp-block-navigation__responsive-dialog {
	margin-left: 0 !important;
	margin-right: auto !important;
	box-shadow: 16px 0 48px rgba(15, 23, 42, 0.22) !important;
}

/* Content area */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.wp-block-navigation__responsive-container.buentheme-nav-portal .wp-block-navigation__responsive-container-content,
.wp-block-navigation__responsive-container:popover-open .wp-block-navigation__responsive-container-content {
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
	flex: 1 1 auto !important;
	width: 100% !important;
	height: auto !important;
	max-width: 100% !important;
	padding: 1.25rem 1.25rem 2rem !important;
	overflow: auto !important;
	box-sizing: border-box !important;
	background: transparent !important;
	position: relative !important;
}

/* Si no hay dialog wrapper, el content es el panel */
.wp-block-navigation__responsive-container.is-menu-open > .wp-block-navigation__responsive-container-content,
.wp-block-navigation__responsive-container.buentheme-nav-portal > .wp-block-navigation__responsive-container-content,
.wp-block-navigation__responsive-container:popover-open > .wp-block-navigation__responsive-container-content {
	width: min(var(--buentheme-overlay-width, 85%), 420px) !important;
	height: 100% !important;
	margin-left: auto !important;
	background: var(--buentheme-overlay-bg-color, #ffffff) !important;
	box-shadow: -16px 0 48px rgba(15, 23, 42, 0.22) !important;
}

/* Close button */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close,
.wp-block-navigation__responsive-container.buentheme-nav-portal .wp-block-navigation__responsive-container-close,
.wp-block-navigation__responsive-container:popover-open .wp-block-navigation__responsive-container-close {
	position: relative !important;
	align-self: flex-end !important;
	margin: 0 0 0.5rem !important;
	z-index: 2 !important;
	flex-shrink: 0 !important;
}

/* ========== Lista en COLUMNA (el bug de Inicio Tienda Contacto en fila) ========== */
.wp-block-navigation__responsive-container.is-menu-open ul,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-page-list,
.wp-block-navigation__responsive-container.buentheme-nav-portal ul,
.wp-block-navigation__responsive-container.buentheme-nav-portal .wp-block-navigation__container,
.wp-block-navigation__responsive-container.buentheme-nav-portal .wp-block-page-list,
.wp-block-navigation__responsive-container:popover-open ul,
.wp-block-navigation__responsive-container:popover-open .wp-block-navigation__container,
.wp-block-navigation__responsive-container:popover-open .wp-block-page-list {
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
	justify-content: flex-start !important;
	flex-wrap: nowrap !important;
	gap: 0.1rem !important;
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item,
.wp-block-navigation__responsive-container.is-menu-open li,
.wp-block-navigation__responsive-container.buentheme-nav-portal .wp-block-navigation-item,
.wp-block-navigation__responsive-container.buentheme-nav-portal li,
.wp-block-navigation__responsive-container:popover-open .wp-block-navigation-item,
.wp-block-navigation__responsive-container:popover-open li {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	float: none !important;
	flex: 0 0 auto !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item > a,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item > button,
.wp-block-navigation__responsive-container.buentheme-nav-portal .wp-block-navigation-item > a,
.wp-block-navigation__responsive-container.buentheme-nav-portal .wp-block-navigation-item__content,
.wp-block-navigation__responsive-container.buentheme-nav-portal .wp-block-navigation-item > button,
.wp-block-navigation__responsive-container:popover-open .wp-block-navigation-item > a,
.wp-block-navigation__responsive-container:popover-open .wp-block-navigation-item__content,
.wp-block-navigation__responsive-container:popover-open .wp-block-navigation-item > button {
	display: flex !important;
	align-items: center !important;
	width: 100% !important;
	max-width: 100% !important;
	padding: 0.9rem 0.5rem !important;
	box-sizing: border-box !important;
	white-space: normal !important;
	text-decoration: none !important;
	color: inherit !important;
	font-size: 1.05rem !important;
}

/* Submenús */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container,
.wp-block-navigation__responsive-container.buentheme-nav-portal .wp-block-navigation__submenu-container,
.wp-block-navigation__responsive-container:popover-open .wp-block-navigation__submenu-container {
	position: static !important;
	width: 100% !important;
	min-width: 0 !important;
	max-width: none !important;
	left: auto !important;
	top: auto !important;
	box-shadow: none !important;
	border: none !important;
	flex-direction: column !important;
}

/* ========== Chrome logo + WC (solo en overlay ABIERTO; desktop usa style.css) ========== */
.wp-block-navigation__responsive-container.is-menu-open .buentheme-drawer-chrome,
.wp-block-navigation__responsive-container:popover-open .buentheme-drawer-chrome,
.wp-block-navigation__responsive-container.buentheme-nav-portal .buentheme-drawer-chrome {
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 12px !important;
	width: 100% !important;
	padding: 4px 4px 16px !important;
	margin: 0 0 8px !important;
	border-bottom: 1px solid #e2e8f0 !important;
	box-sizing: border-box !important;
	flex-shrink: 0 !important;
}

.buentheme-drawer-brand {
	display: flex !important;
	align-items: center !important;
	min-width: 0 !important;
	flex: 1 1 auto !important;
}

.buentheme-drawer-brand__logo a,
.buentheme-drawer-brand__logo .custom-logo-link {
	display: inline-flex !important;
	align-items: center !important;
	line-height: 0 !important;
	max-width: 100% !important;
}

.buentheme-drawer-brand__logo img,
.buentheme-drawer-brand__logo .custom-logo {
	display: block !important;
	width: var(--buentheme-header-logo-width, auto) !important;
	height: auto !important;
	max-height: none !important;
	max-width: min(100%, var(--buentheme-header-logo-width, 160px)) !important;
	object-fit: contain !important;
	transform: scale(var(--buentheme-header-logo-scale, 1)) !important;
	transform-origin: left center;
}

.buentheme-drawer-actions {
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	gap: 4px !important;
	flex: 0 0 auto !important;
	margin-left: auto !important;
}

.buentheme-drawer-actions .wp-block-woocommerce-mini-cart,
.buentheme-drawer-actions .wp-block-woocommerce-customer-account,
.buentheme-drawer-actions .wc-block-mini-cart,
.buentheme-drawer-actions .wc-block-customer-account {
	display: inline-flex !important;
	align-items: center !important;
	margin: 0 !important;
}

/* Body lock */
html.buentheme-nav-open,
body.buentheme-nav-open {
	overflow: hidden !important;
}

/* Mientras el menú está abierto: header no debe atrapar (por si popover no está disponible) */
body.buentheme-nav-open .buentheme-header-wrapper {
	transform: none !important;
	filter: none !important;
	-webkit-backdrop-filter: none !important;
	backdrop-filter: none !important;
	will-change: auto !important;
	perspective: none !important;
	contain: none !important;
	overflow: visible !important;
}