/**
 * Lalago Theme Main CSS File
 * Curated Premium Stylesheet
 */

/* Root Variables */
:root {
	--pink: #e91e8f;
	--pink-hover: #d0157c;
	--pink-light: rgba(233, 30, 143, 0.08);
	--blue: #202060;
	--blue-hover: #161646;
	--blue-light: rgba(32, 32, 96, 0.05);
	--dark: #1e1e24;
	--light-gray: #f8f8fa;
	--border-color: #eaeaea;
	--font-primary: 'Inter', system-ui, -apple-system, sans-serif;
	--font-heading: 'Outfit', sans-serif;
	--radius-lg: 16px;
	--radius-md: 12px;
	--radius-sm: 8px;
	--transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* Global Reset & Typography */
body {
	font-family: var(--font-primary);
	color: var(--dark);
	background-color: var(--light-gray);
	font-size: 15px;
	line-height: 1.6;
	margin: 0;
	padding-bottom: 90px; /* Leave room for fixed bottom booking bar */
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-heading);
	color: var(--blue);
	font-weight: 700;
}

/* Utilities */
.text-pink { color: var(--pink) !important; }
.text-blue { color: var(--blue) !important; }
.bg-pink { background-color: var(--pink) !important; }
.bg-pink-light { background-color: var(--pink-light) !important; }
.bg-blue { background-color: var(--blue) !important; }
.btn-pink {
	background-color: var(--pink);
	border-color: var(--pink);
	color: #fff;
	transition: var(--transition);
}
.btn-pink:hover, .btn-pink:focus {
	background-color: var(--pink-hover);
	border-color: var(--pink-hover);
	color: #fff;
}
.btn-outline-blue {
	color: var(--blue);
	border-color: var(--blue);
	background-color: transparent;
	transition: var(--transition);
}
.btn-outline-blue:hover {
	color: #fff;
	background-color: var(--blue);
	border-color: var(--blue);
}
.btn-outline-pink {
	color: var(--pink);
	border-color: var(--pink);
	background-color: transparent;
	transition: var(--transition);
}
.btn-outline-pink:hover {
	color: #fff;
	background-color: var(--pink);
	border-color: var(--pink);
}

/* Layout Border */
.border-bottom-thick {
	border-bottom: 3px solid var(--pink-light);
	display: inline-block;
}

/* Custom Border Radius */
.rounded-4 { border-radius: var(--radius-lg) !important; }
.rounded-3 { border-radius: var(--radius-md) !important; }

/* Interactive Hover States */
.hover-scale {
	transition: var(--transition);
}
.hover-scale:hover {
	transform: translateY(-2px) scale(1.02);
}
.hover-transform {
	transition: var(--transition);
}
.hover-transform:hover {
	transform: translateY(-5px);
	box-shadow: 0 12px 30px rgba(0,0,0,0.08) !important;
}
.hover-opacity:hover {
	opacity: 0.8;
}

/* TOP HEADER BAR */
.top-header-bar {
	height: 30px;
	background-color: var(--blue);
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	line-height: 30px;
}
.top-header-bar a {
	transition: var(--transition);
}
.top-header-bar a:hover {
	color: var(--pink) !important;
}

/* MAIN NAVIGATION */
.main-navbar {
	background-color: #fff;
	border-bottom: 1px solid var(--border-color);
	padding: 15px 0;
	box-shadow: 0 2px 10px rgba(0,0,0,0.02);
}
.main-navbar .nav-link {
	color: var(--blue);
	font-weight: 600;
	font-size: 15px;
	padding: 8px 16px !important;
	position: relative;
	transition: var(--transition);
}
.main-navbar .nav-link:hover, 
.main-navbar .nav-link.active {
	color: var(--pink) !important;
}
.main-navbar .nav-link::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 0;
	height: 2px;
	background-color: var(--pink);
	transition: var(--transition);
	transform: translateX(-50%);
}
.main-navbar .nav-link:hover::after, 
.main-navbar .nav-link.active::after {
	width: 60%;
}

/* BREADCRUMB */
.breadcrumb-item a {
	color: #6c757d;
	transition: var(--transition);
}
.breadcrumb-item a:hover {
	color: var(--pink);
}

/* GALLERY GRID */
.hotel-gallery-grid .gallery-item {
	cursor: pointer;
	position: relative;
	background-color: #ddd;
}
.hotel-gallery-grid img {
	transition: transform 0.5s ease;
}
.hotel-gallery-grid .gallery-item:hover img {
	transform: scale(1.05);
}
.bg-dark-opacity {
	background-color: rgba(0, 0, 0, 0.5);
}
.gallery-more-overlay {
	pointer-events: none;
	transition: var(--transition);
}
.gallery-item:hover .gallery-more-overlay {
	background-color: rgba(0, 0, 0, 0.6);
}

/* AMENITIES SECTION */
.amenity-card {
	background-color: #f8f8fa;
	border: 1px solid rgba(0,0,0,0.02);
	border-radius: var(--radius-sm);
	transition: var(--transition);
}
.amenity-card:hover {
	background-color: #fff;
	box-shadow: 0 8px 20px rgba(0,0,0,0.05);
	transform: translateY(-3px);
}
.amenity-icon-wrapper {
	width: 50px;
	height: 50px;
	transition: var(--transition);
}
.amenity-card:hover .amenity-icon-wrapper {
	background-color: var(--pink) !important;
}
.amenity-card:hover .amenity-icon-wrapper i {
	color: #fff !important;
}
.amenity-label {
	font-size: 13px;
}

/* HIGHLIGHTS PINK BOX */
.highlights-box {
	background: linear-gradient(135deg, #fff5fa 0%, #fff 100%);
	border-left: 5px solid var(--pink) !important;
}

/* MAP CARD */
#hotelMap {
	box-shadow: inset 0 2px 8px rgba(0,0,0,0.15);
	z-index: 1;
}

/* FIXED BOTTOM BOOKING BAR */
.fixed-bottom-booking-bar {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	transition: var(--transition);
}
.bg-light-gray {
	background-color: #f8f9fa;
	border: 1px solid var(--border-color);
}
.booking-field-wrapper {
	transition: var(--transition);
}
.booking-field-wrapper:focus-within {
	background-color: #fff !important;
	border-color: var(--pink) !important;
	box-shadow: 0 0 0 3px rgba(233, 30, 143, 0.15);
}
.fs-ultra-small {
	font-size: 10px;
	letter-spacing: 0.5px;
}
.focus-none:focus {
	outline: none !important;
	box-shadow: none !important;
}
.dropdown-menu {
	border: 1px solid rgba(0,0,0,0.05);
}
.btn-counter-dec, .btn-counter-inc {
	width: 32px;
	height: 32px;
	padding: 0;
	line-height: 30px;
	text-align: center;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: var(--transition);
}
.btn-counter-dec:hover, .btn-counter-inc:hover {
	background-color: var(--pink);
	color: #fff;
}

/* LIGHTBOX OVERRIDES */
.gallery-lightbox-modal .modal-dialog {
	max-width: 90%;
}
.max-h-80vh {
	max-height: 75vh;
	width: auto;
}
.swiper-button-prev, .swiper-button-next {
	color: #fff !important;
}
.swiper-pagination-bullet-active {
	background: var(--pink) !important;
}

/* RESPONSIVE MEDIA QUERIES */
@media (max-width: 991.98px) {
	body {
		padding-bottom: 230px; /* Make more space for stacked booking bar on tablets/mobile */
	}
	.fixed-bottom-booking-bar {
		padding: 15px 0;
	}
	.navbar-nav .nav-link::after {
		display: none;
	}
	.navbar-nav .nav-link {
		padding: 10px 0 !important;
		border-bottom: 1px solid #f1f1f1;
	}
	.auth-buttons {
		margin-top: 15px;
		width: 100%;
		flex-direction: column;
	}
	.auth-buttons a {
		width: 100%;
		text-align: center;
	}
}

@media (max-width: 767.98px) {
	.hotel-gallery-grid .large-item {
		height: 250px !important;
	}
	.hotel-gallery-grid .small-item {
		height: 120px !important;
	}
	body {
		padding-bottom: 270px; /* Mobile stack gets taller */
	}
}