/* =========================================================
   Óptica La Curacao — Encabezado, navegación y menú móvil
   ========================================================= */

.oc-header {
	position: sticky;
	top: 0;
	z-index: 100;
	background: linear-gradient(90deg, #0E5A97 0%, #4A9FD4 100%);
}

.oc-header__top {
	padding-top: 16px;
	padding-bottom: 12px;
}

.oc-header__top .wp-block-group {
	align-items: center;
}

.oc-header__actions {
	gap: 16px;
	align-items: center;
}

.oc-header__nav {
	padding-bottom: 16px;
}

/* En escritorio, el botón "Haz tu cita" sangra hasta el borde derecho de la
   pantalla (posicionamiento; el radio/relleno se afinan en sections.css). */
@media (min-width: 901px) {
	.oc-header__actions {
		position: absolute;
		top: 14px;
		right: 0;
		z-index: 5;
	}
}

/* Navegación principal */
.oc-nav a {
	color: #fff;
	text-decoration: none;
}

.oc-nav .wp-block-navigation-item__content:hover {
	color: #cdeaf7;
}

/* ---------- Navegación móvil nativa (core/navigation, overlay) ---------- */
/* Oculta en escritorio; se muestra en <=900px (ver responsive.css).
   Especificidad 0,2,0 para ganarle a la clase de layout de core. */
.oc-header .oc-mobile-nav {
	display: none;
}

/* Botón hamburguesa: mismo aspecto que el antiguo .oc-burger. */
.oc-mobile-nav .wp-block-navigation__responsive-container-open {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 44px;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, .6);
	border-radius: 10px;
	background: rgba(255, 255, 255, .14);
	color: #fff;
}

.oc-mobile-nav .wp-block-navigation__responsive-container-open svg {
	width: 26px;
	height: 26px;
	fill: currentColor;
}

/* Overlay abierto: lista de enlaces a ancho completo (fondo/tinta vía atributos
   overlayBackgroundColor/overlayTextColor del bloque). */
.oc-mobile-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	width: 100%;
	padding: 8px 0;
}

.oc-mobile-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	width: 100%;
	gap: 0;
}

.oc-mobile-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	width: 100%;
}

.oc-mobile-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	display: block;
	width: 100%;
	padding: 15px 24px;
	font-size: 18px;
	font-weight: 600;
	border-bottom: 1px solid var(--wp--preset--color--border);
}

.oc-mobile-nav .wp-block-navigation__responsive-container-close {
	top: 22px;
	right: 22px;
	color: var(--wp--preset--color--primary-deep);
}
