/**
 * Header - Estilos del encabezado del sitio.
 * Referencia: paginas/home/home.html (navbar Bootstrap 5).
 * Se encola en todas las páginas.
 */

/* Colores del tema para navbar (alineados con diseño Extreme Escape) */
#header .navbar.bg-primary,
#header .navbar.navbar-main {
	--bs-primary: #b40f20;
	--bs-primary-rgb: 180, 15, 32;
	background-color: #b40f20 !important;
}

/* Fondo con textura/imagen (assets/media/bg-header.png) */
#header #navbar-main {
	background-image: url("../../media/bg-header.png");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}

#header .navbar.bg-secondary,
#header .navbar.navbar-top {
	--bs-secondary: #656263;
	--bs-secondary-rgb: 101, 98, 99;
	background-color: #656263 !important;
}

/*
 * Header: sticky en todos los anchos (desktop y móvil). Por encima del home / hero;
 * los submenús dropdown deben verse siempre encima.
 */
#header.header {
	position: sticky;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1030;
	width: 100%;
	box-sizing: border-box;
}

/* Con barra de administración de WordPress visible, el header queda debajo de ella al pegarse. */
body.admin-bar #header.header {
	top: 32px;
}

@media screen and (max-width: 782px) {
	body.admin-bar #header.header {
		top: 46px;
	}
}

#header .navbar {
	margin-bottom: 0;
	border-radius: 0;
}

#header #navbar-main .container {
	flex-wrap: wrap;
}

/* Menú + CTA: el botón va en una fila debajo del ul y centrado */
#header #navbar-main #CollapsingNavbar {
	flex-wrap: wrap;
	align-items: center;
}

#header #navbar-main ul#primary-menu {
	margin-left: auto;
	margin-right: auto;
}

#header #navbar-main .header-book-room {
	flex-basis: 100%;
	padding-top: 0.5rem;
	padding-bottom: 0.25rem;
}

@media (min-width: 992px) {
	#header #navbar-main .header-book-room {
		padding-top: 0.75rem;
	}
}

/* Icono calendario (::before). El tema carga Font Awesome 4.7 (\f073 = calendario). */
#header .header-book-room .btn-book::before {
	font-size: 32px;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	display: inline-block;
	font-style: normal;
	font-variant: normal;
	text-rendering: auto;
	line-height: 1;
	font-family: FontAwesome;
	font-weight: normal;
	content: "\f073";
	margin-right: 10px;
	vertical-align: middle;
}

#header .header-book-room.w-100.text-center .btn-book {
	display: inline-flex;
	align-items: center;
	vertical-align: middle;
	font-size: 17px;
}

/* Logo / navbar-brand */
#header .navbar-brand {
	padding-top: 0.25rem;
	padding-bottom: 0.25rem;
	margin-right: 1rem;
}

#header .navbar-brand img {
	max-height: 50px;
	width: auto;
	height: auto;
}

/* Nav links */
#header .navbar-nav .nav-link {
	color: rgba(255, 255, 255, 0.9) !important;
	font-weight: 500;
	padding-left: 0.75rem;
	padding-right: 0.75rem;
}

#header .navbar-nav .nav-link:hover,
#header .navbar-nav .nav-link:focus {
	color: #fff !important;
}

#header .navbar-nav .nav-item .dropdown-toggle::after {
	margin-left: 0.35em;
}

/* BOOK A ROOM: botón destacado en el menú */
#header .navbar-nav .nav-item .nav-link.btn-book,
#header .navbar-nav .nav-item .btn-book.nav-link {
	background-color: rgba(255, 255, 255, 0.2);
	border-radius: 4px;
	margin-left: 0.5rem;
	padding-left: 1rem;
	padding-right: 1rem;
}

#header .navbar-nav .nav-item .nav-link.btn-book:hover,
#header .navbar-nav .nav-item .btn-book.nav-link:hover {
	background-color: rgba(255, 255, 255, 0.3);
	color: #fff !important;
}

/* Dropdown menu (Bootstrap + Popper; mismo orden que el header para no quedar detrás del hero) */
#header .navbar .dropdown-menu,
#header .navbar-nav .dropdown-menu {
	z-index: 1050;
	background-color: #fff;
	border: 0;
	box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
	border-radius: 4px;
	padding: 0.5rem 0;
	margin-top: 0.25rem;
}

#header .navbar .dropdown-item {
	color: #212529;
	padding: 0.5rem 1rem;
}

#header .navbar .dropdown-item:hover,
#header .navbar .dropdown-item:focus {
	background-color: #f8f9fa;
	color: #b40f20;
}

/* Navbar toggler (móvil) */
#header .navbar-toggler {
	border-color: rgba(255, 255, 255, 0.5);
	padding: 0.25rem 0.5rem;
}

#header .navbar-toggler:focus {
	box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.25);
}

#header .navbar-toggler-icon {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.9%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* Responsive: menú colapsado en móvil */
@media (max-width: 991.98px) {
	#header .navbar-collapse {
		background-color: rgba(180, 15, 32, 0.98);
		margin: 0.5rem -0.5rem -0.5rem;
		padding: 0.5rem;
		border-radius: 4px;
	}

	#header .navbar-nav .nav-item {
		border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	}

	#header .navbar-nav .nav-item:last-child {
		border-bottom: 0;
	}

	#header .navbar-nav .dropdown-menu {
		z-index: 1050;
		background-color: rgba(0, 0, 0, 0.1);
		margin-left: 1rem;
		margin-top: 0.25rem;
		margin-bottom: 0.25rem;
	}

	#header .navbar .dropdown-item {
		color: rgba(255, 255, 255, 0.95);
	}

	#header .navbar .dropdown-item:hover {
		background-color: rgba(255, 255, 255, 0.1);
		color: #fff;
	}
}

/* Barra superior (top-header) opcional */
#header #navbar-top .container {
	min-height: 2rem;
}
