/**
 * Hotel pages — header + footer background override (#0f3460)
 * body.post-type-hotel is added by the child theme body_class filter.
 */

/* Header */
body.post-type-hotel .elementor-location-header > *:not(.elementor-motion-effects-element-type-background),
body.post-type-hotel .elementor-location-header > * > .elementor-motion-effects-container > .elementor-motion-effects-layer {
	background-color: #0f3460 !important;
}

/* ── Hero slider ────────────────────────────────────────────────────────── */

/* Break out of any Elementor content-width container */
.hotel-hero-wrap {
	width: 100vw !important;
	max-width: 100vw !important;
	position: relative !important;
	left: 50% !important;
	transform: translateX(-50%) !important;
	overflow: hidden !important;
}

/*
 * .e-con-inner is the actual flex wrapper Elementor inserts inside every
 * container. Making it position:relative + a fixed height turns it into
 * the positioning reference for the two absolute children (carousel + overlay).
 */
.hotel-hero-wrap > .e-con-inner {
	position: relative !important;
	height: 70vh !important;
	min-height: 500px !important;
	overflow: hidden !important;
}

/* Carousel fills the entire hero area */
.hotel-hero-carousel,
.hotel-hero-carousel .elementor-widget-container,
.hotel-hero-carousel .elementor-image-carousel-wrapper,
.hotel-hero-carousel .swiper-container,
.hotel-hero-carousel .swiper {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	z-index: 1;
}

.hotel-hero-carousel .swiper-wrapper {
	height: 100% !important;
}

.hotel-hero-carousel .swiper-slide {
	height: 100% !important;
}

/* Images fill each slide, cropped to cover — no letterboxing */
.hotel-hero-carousel .swiper-slide img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	object-position: center center !important;
	display: block !important;
}

/* Arrows and dots sit above the overlay */
.hotel-hero-carousel .elementor-swiper-button {
	z-index: 30 !important;
	color: rgba(255, 255, 255, 0.85) !important;
}

.hotel-hero-carousel .swiper-pagination {
	z-index: 30 !important;
	bottom: 20px !important;
}

/* ── Hero overlay ───────────────────────────────────────────────────────── */

/* Pinned to the bottom of .e-con-inner, on top of the carousel */
.hotel-hero-overlay {
	position: absolute !important;
	bottom: 0 !important;
	left: 0 !important;
	right: 0 !important;
	z-index: 10 !important;
	background: linear-gradient(
		to top,
		rgba(15, 30, 40, 0.92) 0%,
		rgba(15, 30, 40, 0.45) 55%,
		transparent 100%
	) !important;
	padding: 80px 40px 52px !important;
}