/* Custom Premium CSS Styling for Radhe DJ & Event (testproject_live) */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&display=swap');

/* CSS Variables for Premium Palette */
:root {
	--primary-turquoise: #5fb8c7;
	--primary-teal: #2d6f73;
	--stone-gray: #b9b6ae;
	--warm-white: #f4f3ef;
	--charcoal-shadow: #2a2a2a;
	--botanical-green: #5f8f65;
	--mist-gray: #d8d6d0;
	--white: #ffffff;
}

/* Global Styles & Premium Typography Override */
body, h1, h2, h3, h4, h5, h6, .btn, .form-control, .nav-link {
	font-family: 'Outfit', sans-serif !important;
}

html, body {
	background-color: var(--warm-white) !important;
	color: var(--charcoal-shadow) !important;
	overflow-x: hidden !important;
	width: 100% !important;
	max-width: 100% !important;
}

/* Global Premium Button Overrides */
.btn-primary,
a.btn-primary,
button.btn-primary {
	background-color: var(--primary-teal) !important;
	border-color: var(--primary-teal) !important;
	color: var(--white) !important;
	font-family: 'Outfit', sans-serif !important;
	font-weight: 600 !important;
	padding: 10px 24px !important;
	border-radius: 50px !important;
	transition: all 0.25s ease !important;
	box-shadow: 0 4px 12px rgba(45, 111, 115, 0.15) !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
}

.btn-primary:hover,
a.btn-primary:hover,
button.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
	background-color: var(--primary-turquoise) !important;
	border-color: var(--primary-turquoise) !important;
	color: var(--white) !important;
	box-shadow: 0 6px 18px rgba(95, 184, 199, 0.25) !important;
	transform: translateY(-2px) !important;
}

/* --- HEADER / NAVIGATION BAR --- */
#mainNavbar {
	background-color: var(--white) !important;
	border-bottom: 1px solid rgba(0,0,0,0.05) !important;
	box-shadow: 0 4px 15px rgba(0,0,0,0.02) !important;
	padding: 15px 0 !important;
	transition: all 0.3s ease !important;
}

#mainNavbar .navbar-nav .nav-link {
	color: var(--charcoal-shadow) !important;
	font-weight: 500 !important;
	font-size: 0.95rem !important;
	padding: 0.5rem 1.1rem !important;
	transition: color 0.2s ease-in-out !important;
}

#mainNavbar .navbar-nav .nav-link:hover {
	color: var(--primary-teal) !important;
}

/* "Post an Ad" / "Create Listing" Button */
#mainNavbar .navbar-nav a.btn-primary:not(.dropdown-item),
#mainNavbar .navbar-nav a.btn-warning:not(.dropdown-item),
#mainNavbar .navbar-nav a.btn-highlight:not(.dropdown-item),
#mainNavbar .navbar-nav a[href*="create"]:not(.dropdown-item),
#mainNavbar .navbar-nav a[href*="post"]:not(.dropdown-item),
#mainNavbar a.btn-warning,
#mainNavbar a.btn-highlight,
.navbar-nav a.btn-warning,
.navbar-nav a.btn-highlight,
#mainNavbar a[href*="create"] {
	background-color: var(--primary-teal) !important;
	border-color: var(--primary-teal) !important;
	color: #ffffff !important;
	border-radius: 50px !important;
	padding: 0.55rem 1.5rem !important;
	font-weight: 600 !important;
	box-shadow: 0 4px 12px rgba(45, 111, 115, 0.2) !important;
	transition: all 0.2s ease !important;
}

/* Force white color on icons/text inside Create Listing button */
#mainNavbar a.btn-warning i,
#mainNavbar a.btn-warning span,
#mainNavbar a.btn-warning *,
#mainNavbar a.btn-highlight i,
#mainNavbar a.btn-highlight span,
#mainNavbar a.btn-highlight *,
.navbar-nav a.btn-warning i,
.navbar-nav a.btn-warning span,
.navbar-nav a.btn-warning *,
.navbar-nav a.btn-highlight i,
.navbar-nav a.btn-highlight span,
.navbar-nav a.btn-highlight *,
#mainNavbar a[href*="create"] i,
#mainNavbar a[href*="create"] span,
#mainNavbar a[href*="create"] * {
	color: #ffffff !important;
}

#mainNavbar .navbar-nav a.btn-primary:not(.dropdown-item):hover,
#mainNavbar .navbar-nav a.btn-warning:not(.dropdown-item):hover,
#mainNavbar .navbar-nav a.btn-highlight:not(.dropdown-item):hover,
#mainNavbar .navbar-nav a[href*="create"]:not(.dropdown-item):hover,
#mainNavbar .navbar-nav a[href*="post"]:not(.dropdown-item):hover,
#mainNavbar a.btn-warning:hover,
#mainNavbar a.btn-highlight:hover,
.navbar-nav a.btn-warning:hover,
.navbar-nav a.btn-highlight:hover,
#mainNavbar a[href*="create"]:hover {
	background-color: var(--primary-turquoise) !important;
	border-color: var(--primary-turquoise) !important;
	box-shadow: 0 6px 15px rgba(95, 184, 199, 0.3) !important;
	transform: translateY(-1px) !important;
}

/* Login Link */
#mainNavbar .navbar-nav a[href*="login"]:not(.dropdown-item) {
	color: var(--charcoal-shadow) !important;
	font-weight: 550 !important;
}

/* Sign Up / Register Button */
#mainNavbar .navbar-nav a[href*="register"]:not(.dropdown-item),
#mainNavbar .navbar-nav a[href*="signup"]:not(.dropdown-item) {
	border: 1.5px solid var(--primary-teal) !important;
	color: var(--primary-teal) !important;
	background: transparent !important;
	border-radius: 50px !important;
	padding: 0.5rem 1.35rem !important;
	font-weight: 600 !important;
	transition: all 0.2s ease !important;
}

#mainNavbar .navbar-nav a[href*="register"]:not(.dropdown-item):hover,
#mainNavbar .navbar-nav a[href*="signup"]:not(.dropdown-item):hover {
	background-color: var(--primary-teal) !important;
	color: #ffffff !important;
}

/* --- PREMIUM DROPDOWN MENU & ITEMS --- */
#mainNavbar .dropdown-menu {
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	border-radius: 16px !important;
	box-shadow: 0 12px 30px rgba(45, 111, 115, 0.08) !important;
	padding: 10px 0 !important;
	background-color: var(--white) !important;
	margin-top: 8px !important;
}

#mainNavbar .dropdown-menu li {
	list-style: none !important;
}

#mainNavbar .dropdown-menu .dropdown-item {
	color: var(--charcoal-shadow) !important;
	font-weight: 550 !important;
	font-size: 0.92rem !important;
	padding: 11px 20px !important;
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	background: transparent !important;
	border: none !important;
	border-radius: 0 !important;
	transition: all 0.2s ease !important;
}

#mainNavbar .dropdown-menu .dropdown-item:hover {
	background-color: rgba(95, 184, 199, 0.08) !important;
	color: var(--primary-teal) !important;
}

#mainNavbar .dropdown-menu .dropdown-item i {
	color: var(--primary-teal) !important;
	font-size: 1.15rem !important;
	width: 20px !important;
	text-align: center !important;
	transition: all 0.2s ease !important;
}

#mainNavbar .dropdown-menu .dropdown-item:hover i {
	color: var(--primary-turquoise) !important;
	transform: scale(1.1) !important;
}

/* Theme Switcher Premium Styling */
#themeSwitcher {
	display: block !important;
}
#themeSwitcher a.nav-link {
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
	color: var(--charcoal-shadow) !important;
	font-weight: 550 !important;
}
#themeSwitcher a.nav-link i {
	color: var(--primary-teal) !important;
	font-size: 1.15rem !important;
}
@media (max-width: 1199.98px) {
	#themeSwitcher a.nav-link {
		padding: 0.5rem 1.1rem !important;
	}
}



/* --- HERO & SEARCH FORM --- */
#homepage .hero-wrap,
#homepage .only-search-bar {
	background-image: linear-gradient(rgba(255, 255, 255, 0.55), rgba(255, 255, 255, 0.15)), url('/images/banner.png') !important;
	background-size: cover !important;
	background-position: center center !important;
	background-repeat: no-repeat !important;
	background-color: transparent !important;
	padding: 30px 0 45px 0 !important;
	position: relative;
}

@media (min-width: 992px) {
	#homepage .hero-wrap {
		height: 370px !important;
		min-height: 370px !important;
	}
}

@media (max-width: 991.98px) {
	.hero-wrap,
	.hero-wrap.overflow-hidden {
		height: auto !important;
		min-height: unset !important;
		display: flex !important;
		flex-direction: column !important;
		align-items: stretch !important;
		overflow: visible !important;
	}
}

#homepage .hero-wrap .container {
	text-align: left !important;
	max-width: 1200px !important;
}

/* Modern Left-Aligned Typography */
#homepage .hero-wrap h1 {
	color: var(--charcoal-shadow) !important;
	text-shadow: none !important;
	font-size: 2.8rem !important;
	font-weight: 800 !important;
	line-height: 1.15 !important;
	max-width: 750px !important;
	text-transform: none !important;
	margin-bottom: 8px !important;
}

#homepage .hero-wrap h5 {
	color: var(--primary-teal) !important;
	text-shadow: none !important;
	font-size: 1.15rem !important;
	font-weight: 500 !important;
	max-width: 600px !important;
	margin-bottom: 12px !important; /* Slightly reduced further to pull card higher */
}

/* Continuous White Pill Search Container */
#homepage .search-row {
	background-color: var(--white) !important;
	border-radius: 100px !important;
	box-shadow: 0 10px 35px rgba(45, 111, 115, 0.08) !important;
	padding: 4px 4px 4px 18px !important; /* Reduced from 6px 6px 6px 24px */
	max-width: 850px !important;
	margin-left: 0 !important;
	border: 1px solid rgba(45, 111, 115, 0.08) !important; /* Subtle brand border */
	display: flex !important;
	align-items: center !important; /* Keep all search inputs and find button centered vertically */
}

#homepage .search-col {
	background: transparent !important;
	border: none !important;
	display: flex;
	align-items: center;
}

#homepage .search-col > div {
	background: transparent !important;
	border: none !important;
	border-radius: 0 !important;
	padding: 0 !important;
	width: 100%;
}

#homepage .search-col:not(:last-child) > div {
	border-right: 1px solid var(--mist-gray) !important;
}

#homepage .search-col input {
	font-size: 0.95rem !important;
	font-weight: 500 !important;
	color: var(--charcoal-shadow) !important;
	background: transparent !important;
	padding-left: 12px !important;
}

#homepage .search-col select {
	font-size: 0.95rem !important;
	font-weight: 500 !important;
	color: var(--charcoal-shadow) !important;
	background: transparent !important;
	border: none !important;
	cursor: pointer;
	padding-left: 8px !important;
	width: 100%;
}

#homepage .search-col select:focus {
	outline: none !important;
	box-shadow: none !important;
}

#homepage .search-col input::placeholder {
	color: var(--stone-gray) !important;
}

#homepage .search-col i {
	color: var(--primary-teal) !important;
	font-size: 1.25rem !important;
	margin-left: 5px;
}

/* Custom Search Pill Button Column & Button */
#homepage .search-row .search-col:last-child {
	flex: 1 1 auto !important; /* Force button column to fill remaining space on the right */
	width: auto !important;
	padding: 0 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}

#homepage .search-row button.btn-search-premium {
	background: var(--primary-teal) !important;
	border: none !important;
	border-top-right-radius: 24px !important;
	border-bottom-right-radius: 24px !important;
	border-top-left-radius: 0 !important;
	border-bottom-left-radius: 0 !important;
	color: var(--white) !important;
	font-weight: 700 !important; /* Bold for premium feel */
	font-size: 0.95rem !important; /* Slightly smaller text font */
	padding: 8px 24px !important; /* Reduced padding from 12px 32px */
	transition: all 0.25s ease !important;
	box-shadow: 0 4px 12px rgba(45, 111, 115, 0.15) !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 6px !important;
	width: 100% !important; /* Stretch to fill the column perfectly */
}

#homepage .search-row button.btn-search-premium:hover {
	background: var(--primary-turquoise) !important;
	box-shadow: 0 6px 15px rgba(95, 184, 199, 0.3) !important;
	transform: translateY(-1px) !important;
}

@media (max-width: 767.98px) {
	#homepage .search-row {
		border-radius: 24px !important;
		padding: 15px !important;
		max-width: 100% !important;
		margin: 0 15px !important;
	}
	#homepage .search-col:not(:last-child) > div {
		border-right: none !important;
		border-bottom: 1px solid var(--mist-gray) !important;
		padding-bottom: 12px !important;
		margin-bottom: 12px !important;
	}
}


/* --- STATISTICS / ACTIVE LISTINGS SUB-BAR (IMAGE 4 STYLE) --- */
#homepage .card:has(.counter),
#homepage .card.bg-body-tertiary {
	background-color: var(--white) !important;
	border: 1px solid rgba(0,0,0,0.02) !important;
	border-radius: 100px !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05) !important;
	padding: 10px 40px !important;
	margin-top: -55px !important;
	position: relative !important;
	z-index: 100 !important;
	max-width: 950px !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

#homepage .card.stats-bar-pill {
	margin-top: 30px !important;
}

#homepage .card.bg-body-tertiary .card-body {
	padding: 0 !important;
}

#homepage .card.bg-body-tertiary .row {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
}

#homepage .card.bg-body-tertiary i {
	color: var(--primary-teal) !important;
	font-size: 2rem !important;
}

#homepage .card.bg-body-tertiary h5.fs-1 {
	font-size: 1.6rem !important;
	color: var(--charcoal-shadow) !important;
	font-weight: 700 !important;
	margin-bottom: 2px !important;
}

#homepage .card.bg-body-tertiary .fs-5 {
	font-size: 0.72rem !important;
	color: var(--stone-gray) !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.8px !important;
}

/* Statistics Item Dividers */
@media (min-width: 576px) {
	#homepage .card.bg-body-tertiary .row .col-sm-4 {
		border-right: 1px solid rgba(0, 0, 0, 0.08) !important;
		padding: 5px 0 !important;
	}
	#homepage .card.bg-body-tertiary .row .col-sm-4:last-child {
		border-right: none !important;
	}
}
@media (max-width: 575.98px) {
	#homepage .card.bg-body-tertiary {
		border-radius: 20px !important;
		padding: 15px 20px !important;
		margin-top: -30px !important;
	}
	#homepage .card.bg-body-tertiary .row .col-sm-4 {
		border-right: none !important;
		border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
		padding: 12px 0 !important;
	}
	#homepage .card.bg-body-tertiary .row .col-sm-4:last-child {
		border-bottom: none !important;
	}
}


/* --- BROWSE BY CATEGORY --- */
#homepage .card:has(.big-icon-category-list) {
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	margin-top: 50px !important;
}

#homepage .card:has(.big-icon-category-list) .card-header {
	background: transparent !important;
	border: none !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	margin-bottom: 20px !important;
}

#homepage .card:has(.big-icon-category-list) .card-header h4 {
	font-size: 1.85rem !important;
	color: var(--charcoal-shadow) !important;
	font-weight: 700 !important;
}

#homepage .card:has(.big-icon-category-list) .card-header a {
	color: var(--primary-teal) !important;
	font-weight: 600 !important;
	font-size: 0.9rem !important;
	text-decoration: none;
	transition: color 0.2s ease !important;
}

#homepage .card:has(.big-icon-category-list) .card-header a:hover {
	color: var(--primary-turquoise) !important;
}

/* Individual Category Cards */
.big-icon-category-list .col > div {
	background-color: var(--white) !important;
	border: 1px solid rgba(0,0,0,0.03) !important;
	border-radius: 16px !important;
	box-shadow: 0 4px 15px rgba(0,0,0,0.03) !important;
	padding: 24px 15px !important;
	margin: 8px !important;
	transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
}

.big-icon-category-list .col > div:hover {
	transform: translateY(-5px) !important;
	box-shadow: 0 12px 25px rgba(45, 111, 115, 0.08) !important;
	border-color: var(--primary-turquoise) !important;
}

/* Centered Circular Icon Backdrop */
.category-icon-wrap {
	width: 70px;
	height: 70px;
	border-radius: 50%;
	background-color: rgba(95, 184, 199, 0.1) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	margin: 0 auto 16px auto !important;
	transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
}

.big-icon-category-list .col > div:hover .category-icon-wrap {
	background-color: var(--primary-teal) !important;
	transform: scale(1.05);
}

.category-icon-wrap i {
	color: var(--primary-teal) !important;
	font-size: 1.85rem !important;
	transition: all 0.3s ease !important;
}

.big-icon-category-list .col > div:hover .category-icon-wrap i {
	color: var(--white) !important;
}

.big-icon-category-list .col > div h6.category-title {
	color: var(--charcoal-shadow) !important;
	font-weight: 700 !important;
	font-size: 0.98rem !important;
	margin-top: 10px !important;
	margin-bottom: 4px !important;
	line-height: 1.25 !important;
}

.big-icon-category-list .col > div .category-count {
	font-size: 0.8rem !important;
	color: var(--stone-gray) !important;
	font-weight: 500 !important;
}


/* --- LATEST LISTINGS (IMAGE 2 STYLE) --- */
#homepage .card:has(.grid-view) {
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	margin-top: 40px !important;
}

#homepage .card:has(.grid-view) .card-header {
	background: transparent !important;
	border: none !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	margin-bottom: 20px !important;
}

#homepage .card:has(.grid-view) .card-header h4 {
	font-size: 1.85rem !important;
	color: var(--charcoal-shadow) !important;
	font-weight: 700 !important;
}

#homepage .card:has(.grid-view) .card-header a {
	color: var(--primary-teal) !important;
	font-weight: 600 !important;
	font-size: 0.9rem !important;
	text-decoration: none;
	transition: color 0.2s ease !important;
}

#homepage .card:has(.grid-view) .card-header a:hover {
	color: var(--primary-turquoise) !important;
}

/* Grid Listing Card Override */
.grid-view .item-list > div {
	background-color: var(--white) !important;
	border: none !important;
	border-radius: 16px !important;
	box-shadow: 0 4px 18px rgba(0,0,0,0.03) !important;
	padding: 0 !important;
	overflow: hidden !important;
	margin: 10px !important;
	transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
}

.grid-view .item-list > div:hover {
	transform: translateY(-6px) !important;
	box-shadow: 0 12px 28px rgba(45, 111, 115, 0.08) !important;
}

/* Top bleed image */
.grid-view .item-list .main-image {
	padding: 0 !important;
	margin: 0 !important;
	width: 100% !important;
}

.grid-view .item-list .main-image .container {
	padding: 0 !important;
	margin: 0 !important;
	max-width: 100% !important;
}

.grid-view .item-list .main-image img {
	border-radius: 16px 16px 0 0 !important;
	width: 100% !important;
	height: 180px !important;
	object-fit: cover !important;
}

/* Featured Ribbon Badge */
.grid-view .item-list .main-image .badge {
	font-size: 0.72rem !important;
	font-weight: 700 !important;
	text-transform: uppercase;
	padding: 5px 10px !important;
	border-radius: 4px !important;
	letter-spacing: 0.5px;
	top: 12px !important;
	left: 12px !important;
	z-index: 5;
	background-color: var(--primary-teal) !important;
	color: var(--white) !important;
	border: none !important;
}

.grid-view .item-list .main-image .badge.bg-primary,
.grid-view .item-list .main-image .badge.text-bg-warning {
	background-color: var(--primary-teal) !important;
	color: var(--white) !important;
}

.grid-view .item-list .main-image .badge.text-bg-danger {
	background-color: #e55353 !important;
	color: var(--white) !important;
}

/* Camera Count Badge */
.grid-view .item-list .main-image .bg-body-secondary {
	background-color: rgba(0, 0, 0, 0.5) !important;
	color: var(--white) !important;
	font-size: 0.72rem !important;
	border-radius: 4px !important;
	padding: 3px 6px !important;
	top: 12px !important;
	right: 12px !important;
	border: none !important;
	opacity: 0.85 !important;
}

/* Details Section inside card */
.grid-view .item-list .col-12.mt-3 {
	padding: 15px 18px 5px 18px !important;
	margin-top: 0 !important;
}

.grid-view .item-list .col-12.mt-3 .px-3 {
	padding: 0 !important;
}

.grid-view .item-list h5.fs-5 {
	font-size: 1rem !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
	margin-bottom: 8px !important;
	height: 40px;
	overflow: hidden;
	padding-left: 8px !important;
	padding-right: 8px !important;
}

.grid-view .item-list h5.fs-5 a {
	color: var(--charcoal-shadow) !important;
	text-decoration: none !important;
	transition: color 0.2s ease !important;
}

.grid-view .item-list h5.fs-5 a:hover {
	color: var(--primary-teal) !important;
}

/* Spans inside clock/metadata */
.grid-view .item-list .list-inline {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 8px !important;
	margin-bottom: 4px !important;
	padding-left: 8px !important;
	padding-right: 8px !important;
}

.grid-view .item-list .list-inline-item {
	font-size: 0.76rem !important;
	color: var(--stone-gray) !important;
	font-weight: 500 !important;
}

.grid-view .item-list .list-inline-item i.bi-geo-alt {
	color: var(--primary-teal) !important;
}

.grid-view .item-list .list-inline-item a {
	color: var(--stone-gray) !important;
	text-decoration: none !important;
}

/* Price styled on the Left */
.grid-view .item-list .col-12:has(h5.fs-4) {
	padding: 0 18px !important;
	text-align: left !important;
}

.grid-view .item-list h5.fs-4 {
	font-size: 1.15rem !important;
	color: var(--primary-teal) !important;
	font-weight: 700 !important;
	text-align: left !important;
	margin-bottom: 8px !important;
	margin-top: 2px !important;
}

/* Bottom elements layout (Modified for inline favorite/save icon next to price) */
.grid-view .item-list .listing-bottom-container {
	padding: 0 !important;
	margin-top: 5px !important;
	border-top: none !important;
}

.grid-view .item-list .listing-bottom-container .d-flex {
	padding: 8px 18px 15px 18px !important;
}

.grid-view .item-list .btn-success {
	background-color: #25d366 !important;
	border: none !important;
	border-radius: 50px !important;
	padding: 4px 10px !important;
	font-size: 0.72rem !important;
	font-weight: 600 !important;
	color: #fff !important;
}

/* Favorite heart icon */
.grid-view .item-list .make-favorite {
	border: none !important;
	background: transparent !important;
	padding: 0 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	transition: all 0.2s ease !important;
	box-shadow: none !important;
	margin: 0 !important;
}

.grid-view .item-list .make-favorite span {
	display: none !important; /* Hide label texts 'Save' or 'Saved' */
}

.grid-view .item-list .make-favorite i {
	font-size: 1.25rem !important;
	line-height: 1 !important;
}

/* Outlined heart (not saved) */
.grid-view .item-list .make-favorite.btn-outline-secondary {
	color: var(--stone-gray) !important;
}

.grid-view .item-list .make-favorite.btn-outline-secondary:hover {
	color: #e55353 !important;
}

/* Filled heart (saved) */
.grid-view .item-list .make-favorite.btn-success {
	color: #e55353 !important;
	background: transparent !important;
}


/* --- CHOOSE A CITY (IMAGE 5 STYLE) --- */
#homepage .location-card,
#homepage > .location-card,
.location-card,
#homepage .location-card.container {
	max-width: 1200px !important; /* Reduced width to align perfectly with standard containers */
	width: 100% !important;
	flex: 0 0 100% !important; /* Force flex-basis to 100% to override any col-* classes */
	margin-top: 80px !important;
	margin-bottom: 20px !important;
	margin-left: auto !important; /* Centered perfectly, overrides offset classes */
	margin-right: auto !important;
}

#homepage .location-card .card,
.location-card .card {
	background-color: var(--white) !important;
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	border-radius: 24px !important;
	box-shadow: 0 12px 30px rgba(0,0,0,0.03) !important;
	padding: 28px 36px !important; /* Balanced and elegant spacing inside the box */
	width: 100% !important;
	max-width: 100% !important;
}

#homepage .location-card h4 {
	font-size: 1.7rem !important;
	font-weight: 700 !important;
	color: var(--charcoal-shadow) !important;
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	margin-bottom: 25px !important;
}

#homepage .location-card h4 i {
	color: var(--primary-teal) !important;
	font-size: 1.8rem !important;
}

#homepage #cityList {
	margin-bottom: 10px !important;
	display: flex !important;
	flex-wrap: wrap !important;
}

#homepage #cityList .col {
	margin-bottom: 12px !important;
	padding: 0 8px !important;
}

/* Base city capsule card style */
#homepage #cityList .city-item {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	padding: 0 16px !important;
	height: 46px !important;
	border-radius: 50px !important;
	background-color: var(--white) !important;
	border: 1px solid rgba(45, 111, 115, 0.12) !important;
	transition: all 0.25s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.02) !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

#homepage #cityList .city-item::before {
	content: "\f3c5" !important; /* FontAwesome Location Dot */
	font-family: "Font Awesome 6 Free" !important;
	font-weight: 900 !important;
	color: var(--primary-teal) !important;
	margin-right: 8px !important;
	font-size: 0.85rem !important;
	flex-shrink: 0 !important;
}

#homepage #cityList .city-item a {
	color: var(--charcoal-shadow) !important;
	font-weight: 600 !important;
	font-size: 0.92rem !important;
	text-decoration: none !important;
	transition: color 0.2s ease !important;
	flex: 1 1 auto !important;
	min-width: 0 !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	text-align: left !important;
}

#homepage #cityList .city-item .count {
	font-size: 0.78rem !important;
	font-weight: 700 !important;
	color: var(--primary-teal) !important;
	background: rgba(45, 111, 115, 0.08) !important;
	padding: 2px 8px !important;
	border-radius: 20px !important;
	margin-left: 6px !important;
	flex-shrink: 0 !important;
}

/* Hover effects */
#homepage #cityList .city-item:hover {
	transform: translateY(-2px) !important;
	border-color: var(--primary-turquoise) !important;
	box-shadow: 0 6px 15px rgba(95, 184, 199, 0.12) !important;
}

#homepage #cityList .city-item:hover a {
	color: var(--primary-teal) !important;
}

/* Inactive city links */
#homepage #cityList .city-item.no-listings {
	border-color: rgba(0, 0, 0, 0.05) !important;
	opacity: 0.75;
}

#homepage #cityList .city-item.no-listings::before {
	color: var(--stone-gray) !important;
}

#homepage #cityList .city-item.no-listings a {
	color: var(--stone-gray) !important;
	font-weight: 500 !important;
}

#homepage #cityList .city-item.no-listings .count {
	color: var(--stone-gray) !important;
	background: rgba(0, 0, 0, 0.04) !important;
}

/* More cities link styled as capsule */
#homepage #cityList a.more-cities-link {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	height: 46px !important;
	padding: 0 18px !important;
	border-radius: 50px !important;
	background-color: var(--white) !important;
	border: 1.5px dashed var(--primary-teal) !important;
	color: var(--primary-teal) !important;
	font-weight: 700 !important;
	font-size: 0.92rem !important;
	transition: all 0.25s ease !important;
	text-decoration: none !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

#homepage #cityList a.more-cities-link:hover {
	background-color: var(--primary-teal) !important;
	color: var(--white) !important;
	border-style: solid !important;
	transform: translateY(-2px) !important;
	box-shadow: 0 6px 15px rgba(45, 111, 115, 0.15) !important;
}

/* Centered Outline button */
#homepage .location-card .btn-outline-primary {
	border: 1.5px solid var(--primary-teal) !important;
	color: var(--primary-teal) !important;
	background: transparent !important;
	border-radius: 50px !important;
	padding: 10px 24px !important;
	font-weight: 600 !important;
	font-size: 0.95rem !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 8px !important;
	transition: all 0.2s ease !important;
	box-shadow: none !important;
}

#homepage .location-card .btn-outline-primary i {
	color: var(--primary-teal) !important;
	transition: all 0.2s ease !important;
}

#homepage .location-card .btn-outline-primary:hover {
	background-color: var(--primary-teal) !important;
	color: var(--white) !important;
	box-shadow: 0 4px 12px rgba(45, 111, 115, 0.2) !important;
}

#homepage .location-card .btn-outline-primary:hover i {
	color: var(--white) !important;
}


/* --- FOOTER DESIGN (IMAGE 4 PREMIUM WAVE STYLE) --- */
footer {
	background-color: transparent !important;
	border-top: none !important;
	position: relative !important;
	overflow: hidden !important;
	/* padding-top: 40px !important; */
}

/* Curve the top edge of footer and set clean modern wavy cyan gradient background */
footer .container-fluid {
	border-top: none !important;
	background-color: #f1fbfc !important;
	background-image: 
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 320'%3E%3Cpath fill='%23d8f3f5' fill-opacity='0.6' d='M0,224L48,208C96,192,192,160,288,144C384,128,480,128,576,149.3C672,171,768,213,864,208C960,203,1056,149,1152,128C1248,107,1344,117,1392,122.7L1440,128L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z'%3E%3C/path%3E%3Cpath fill='%23c1edf0' fill-opacity='0.45' d='M0,96L48,112C96,128,192,160,288,186.7C384,213,480,235,576,218.7C672,203,768,149,864,138.7C960,128,1056,160,1152,176C1248,192,1344,192,1392,192L1440,192L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z'%3E%3C/path%3E%3C/svg%3E") !important;
	background-size: 100% 100% !important;
	background-position: bottom center !important;
	background-repeat: no-repeat !important;
	border-radius: 0 !important;
	padding-top: 60px !important;
	padding-bottom: 0 !important;
	position: relative !important;
	box-shadow: 0 -10px 30px rgba(45, 111, 115, 0.04) !important;
}

footer::before {
	display: none !important; /* Hide old background-gradient strip */
}

footer h4 {
	color: var(--primary-teal) !important;
	font-weight: 700 !important;
	font-size: 1.05rem !important;
	letter-spacing: 0.5px !important;
	margin-bottom: 25px !important;
}

footer ul {
	padding-left: 0 !important;
}

footer li {
	margin-bottom: 12px !important;
}

/* Force dark readable colors for sitemap links to bypass any backend theme overrides */
footer .container-fluid .col:not(.footer-about-col) a,
footer .container-fluid li:not(.list-inline-item) a,
footer .container-fluid .col:not(.footer-about-col) .text-white,
footer .container-fluid .col:not(.footer-about-col) .link-light {
	color: var(--charcoal-shadow) !important;
	font-weight: 600 !important;
	font-size: 0.94rem !important;
	text-decoration: none !important;
	transition: all 0.2s ease !important;
}

footer .container-fluid .col:not(.footer-about-col) a:hover,
footer .container-fluid li:not(.list-inline-item) a:hover,
footer .container-fluid .col:not(.footer-about-col) .text-white:hover,
footer .container-fluid .col:not(.footer-about-col) .link-light:hover {
	color: var(--primary-teal) !important;
	padding-left: 4px !important;
}

/* Newsletter Input & Subscribe Button */
footer .footer-newsletter-form input.form-control {
	background-color: var(--white) !important;
	border: 1px solid var(--mist-gray) !important;
	border-radius: 8px 0 0 8px !important;
	padding: 11px 16px !important;
	font-size: 0.9rem !important;
	color: var(--charcoal-shadow) !important;
}

footer .footer-newsletter-form input.form-control:focus {
	border-color: var(--primary-turquoise) !important;
	box-shadow: none !important;
}

footer .footer-newsletter-form button.btn-primary {
	background-color: var(--primary-teal) !important;
	border: none !important;
	border-radius: 0 8px 8px 0 !important;
	color: var(--white) !important;
	font-weight: 600 !important;
	padding: 11px 20px !important;
	transition: all 0.25s ease !important;
}

footer .footer-newsletter-form button.btn-primary:hover {
	background-color: var(--primary-turquoise) !important;
	box-shadow: 0 4px 12px rgba(95, 184, 199, 0.2) !important;
}

/* Filled Circular Social Icons */
footer .social-media.footer-socials {
	display: flex !important;
	gap: 10px !important;
	margin-top: 15px !important;
}

footer .social-media.footer-socials li {
	margin-bottom: 0 !important;
}

footer .social-media.footer-socials a {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 36px !important;
	height: 36px !important;
	background-color: var(--primary-turquoise) !important;
	border: none !important;
	border-radius: 50% !important;
	color: var(--white) !important;
	font-size: 1rem !important;
	transition: all 0.25s ease !important;
}

footer .social-media.footer-socials a:hover {
	background-color: var(--primary-teal) !important;
	transform: translateY(-3px) !important;
	padding-left: 0 !important;
}

/* --- FOLLOW US BRAND SOCIAL TILES (THEME COLOR STYLE) --- */
.follow-us-tiles {
	margin-top: 10px !important;
}

/* Force all tile variants to adopt the uniform brand teal theme color */
.follow-us-tiles .social-tile,
.follow-us-tiles .tile-facebook,
.follow-us-tiles .tile-twitter,
.follow-us-tiles .tile-instagram,
.follow-us-tiles .tile-linkedin,
.follow-us-tiles .tile-pinterest,
.follow-us-tiles .tile-tiktok,
.follow-us-tiles .tile-youtube,
.follow-us-tiles .tile-vimeo,
.follow-us-tiles .tile-vk {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 38px !important;
	height: 38px !important;
	border-radius: 8px !important;
	font-size: 1.15rem !important;
	background-color: var(--primary-teal) !important;
	color: #ffffff !important;
	transition: all 0.25s ease !important;
	box-shadow: 0 4px 10px rgba(45, 111, 115, 0.06) !important;
	text-decoration: none !important;
	border: none !important;
}

.follow-us-tiles .social-tile i,
.follow-us-tiles a i {
	color: #ffffff !important;
}

/* Hover dynamic animations and turquoise glow */
.follow-us-tiles .social-tile:hover,
.follow-us-tiles .tile-facebook:hover,
.follow-us-tiles .tile-twitter:hover,
.follow-us-tiles .tile-instagram:hover,
.follow-us-tiles .tile-linkedin:hover,
.follow-us-tiles .tile-pinterest:hover,
.follow-us-tiles .tile-tiktok:hover,
.follow-us-tiles .tile-youtube:hover,
.follow-us-tiles .tile-vimeo:hover,
.follow-us-tiles .tile-vk:hover {
	background-color: var(--primary-turquoise) !important;
	transform: translateY(-3px) !important;
	box-shadow: 0 6px 15px rgba(95, 184, 199, 0.2) !important;
	color: #ffffff !important;
}

/* Bulletproof safety override to hide any circular social icons in the left logo/about column */
footer .footer-about-col ul,
footer .footer-about-col .footer-socials,
footer .footer-about-col .social-media {
	display: none !important;
}

/* --- HERO OVERHAUL & FLOATING CATEGORIES (IMAGE 4 LOOK) --- */
.hero-wrap {
	border-radius: 0 !important;
	padding: 30px 0 45px 0 !important;
	overflow: visible !important; /* Allow categories to float overlapping the bottom curved border */
	margin-bottom: 80px !important; /* Push down subsequent listing sections to avoid absolute-clipping overlap */
}

@media (min-width: 992px) {
	.hero-wrap {
		height: 370px !important;
		min-height: 370px !important;
	}
}

/* Glassy Frosted Container for Search Form */
.search-main-card {
	background: rgba(255, 255, 255, 0.15) !important;
	backdrop-filter: blur(20px) !important;
	-webkit-backdrop-filter: blur(20px) !important;
	border: 1px solid rgba(255, 255, 255, 0.25) !important;
	border-radius: 24px !important;
	padding: 12px 18px !important; /* Reduced padding from 16px 20px */
	box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08) !important;
	max-width: 950px !important;
	margin: 0 auto !important;
}

/* Glassy Statistics Sub-Bar */
.stats-glass-bar {
	display: flex !important;
	justify-content: space-around !important;
	align-items: center !important;
	background: rgba(255, 255, 255, 0.1) !important;
	border-radius: 12px !important;
	border: 1px solid rgba(255, 255, 255, 0.15) !important;
	margin-top: 8px !important; /* Reduced margin from search row */
	padding: 4px 12px !important; /* Reduced padding from py-2 px-3 */
}

.stats-glass-bar .stat-item {
	color: var(--white) !important;
	font-size: 0.8rem !important; /* Reduced from 0.88rem */
	font-weight: 500 !important;
}

.stats-glass-bar .stat-item i {
	color: var(--primary-turquoise) !important;
	font-size: 0.95rem !important; /* Reduced from 1.1rem */
}

.stats-glass-bar .stat-item strong {
	font-size: 0.9rem !important; /* Reduced from 0.98rem */
	font-weight: 700 !important;
}

/* Floating Overlapping Hero Category Container */
.hero-categories-wrap {
	position: absolute !important;
	bottom: -70px !important; /* Float half-hanging off the bottom curved hero border */
	left: 0 !important;
	right: 0 !important;
	z-index: 100 !important;
}

/* 7 columns responsive width system for categories display */
@media (min-width: 992px) {
	.col-lg-1-7 {
		flex: 0 0 14.285% !important;
		max-width: 14.285% !important;
	}
}

.hero-cat-card {
	background-color: var(--white) !important;
	border: 1px solid rgba(0,0,0,0.03) !important;
	border-radius: 16px !important;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.04) !important;
	padding: 20px 10px !important;
	transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
}

.hero-cat-card:hover {
	transform: translateY(-8px) !important;
	box-shadow: 0 16px 32px rgba(45, 111, 115, 0.12) !important;
	border-color: var(--primary-turquoise) !important;
}

.hero-cat-icon-wrap {
	width: 54px;
	height: 54px;
	border-radius: 50%;
	background-color: rgba(95, 184, 199, 0.1) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	margin: 0 auto 12px auto !important;
	transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
}

.hero-cat-card:hover .hero-cat-icon-wrap {
	background-color: var(--primary-teal) !important;
}

.hero-cat-icon-wrap i {
	color: var(--primary-teal) !important;
	font-size: 1.45rem !important;
	transition: all 0.3s ease !important;
}

.hero-cat-card:hover .hero-cat-icon-wrap i {
	color: var(--white) !important;
}

.hero-cat-title {
	color: var(--charcoal-shadow) !important;
	font-weight: 700 !important;
	font-size: 0.9rem !important;
	margin-bottom: 2px !important;
	line-height: 1.2 !important;
}

.hero-cat-count {
	font-size: 0.76rem !important;
	color: var(--stone-gray) !important;
	font-weight: 600 !important;
}

/* Unified height alignment inside Search Row */
#homepage .search-row {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
}

#homepage .search-col input,
#homepage .search-col select {
	height: 46px !important;
	border: none !important;
	font-size: 0.95rem !important;
}

#homepage .search-row button.btn-search-premium {
	background: var(--primary-teal) !important;
	border: none !important;
	border-top-right-radius: 24px !important;
	border-bottom-right-radius: 24px !important;
	border-top-left-radius: 0 !important;
	border-bottom-left-radius: 0 !important;
	color: var(--white) !important;
	font-weight: 600 !important;
	font-size: 0.95rem !important;
	padding: 0 28px !important;
	height: 46px !important; /* Perfect height matching search inputs */
	transition: all 0.25s ease !important;
	box-shadow: 0 4px 10px rgba(45, 111, 115, 0.2) !important;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	width: 100%;
}

#homepage .search-row button.btn-search-premium:hover {
	background: var(--primary-turquoise) !important;
	box-shadow: 0 6px 15px rgba(95, 184, 199, 0.3) !important;
	transform: translateY(-1px) !important;
}

/* Fix for Grid Listing Card cut-offs - Padding restoration */
.grid-view .item-list .col-12.mt-3 .px-3 {
	padding: 0 8px !important; /* Comfortably pad metadata to prevent first-letter and character cropping */
}

/* Premium primary button styling override on homepage */
#homepage .btn-primary,
#homepage a.btn-primary {
	background-color: var(--primary-teal) !important;
	border-color: var(--primary-teal) !important;
	color: var(--white) !important;
	font-weight: 600 !important;
	padding: 10px 24px !important;
	border-radius: 50px !important;
	transition: all 0.25s ease !important;
	box-shadow: 0 4px 12px rgba(45, 111, 115, 0.15) !important;
}

#homepage .btn-primary:hover,
#homepage a.btn-primary:hover {
	background-color: var(--primary-turquoise) !important;
	border-color: var(--primary-turquoise) !important;
	box-shadow: 0 6px 18px rgba(95, 184, 199, 0.25) !important;
	transform: translateY(-1px) !important;
}

/* --- FLEX REORDERING OF HOMEPAGE SECTIONS --- */
#homepage {
	display: flex !important;
	flex-direction: column !important;
}

#homepage > * {
	order: 2 !important; /* All middle sections by default get order 2 */
}

#homepage > .hero-wrap {
	order: 1 !important; /* Hero is always first at the top */
}

#homepage > .location-card {
	order: 99 !important; /* Locations grid is always at the bottom, below all listings */
}

/* Tablet responsiveness adapters (768px - 991px only, NOT mobile) */
@media (min-width: 768px) and (max-width: 991.98px) {
	.hero-categories-wrap {
		position: static !important;
		margin-top: 30px !important;
		margin-bottom: -30px !important;
	}
	#homepage .hero-wrap {
		overflow: visible !important;
		padding-bottom: 50px !important;
		margin-bottom: 0 !important; /* Reset margin on tablet since categories flow statically */
	}
	.stats-glass-bar {
		flex-direction: column !important;
		gap: 6px !important;
		padding: 10px !important;
	}
	#homepage .search-row {
		flex-direction: column !important;
		align-items: stretch !important;
	}
	#homepage .search-col input,
	#homepage .search-col select {
		height: auto !important;
	}
}

/* Mobile-only adapter (< 768px) */
@media (max-width: 767.98px) {
	.hero-categories-wrap {
		position: static !important;
		margin-top: 12px !important;
		margin-bottom: 0 !important;
	}
	#homepage .hero-wrap {
		overflow: hidden !important;
		padding-bottom: 20px !important;
		margin-bottom: 10px !important;
	}
}

/* --- HIDE DUPLICATE HOMEPAGE SECTIONS RENDERED BELOW THE HERO --- */
#homepage > .container:has(.big-icon-category-list),
#homepage > div:has(.big-icon-category-list),
#homepage > .container:has(.stats-bar-pill),
#homepage > div:has(.stats-bar-pill) {
	display: none !important;
}

/* ==========================================================================
   --- PREMIUM SEARCH RESULTS PAGE OVERHAUL (TURQUOISE & TEAL THEME) ---
   ========================================================================== */

/* 1. Premium Search Form Card Overrides */
#searchForm .bg-primary {
	background-color: var(--white) !important;
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.04) !important;
	border-radius: 16px !important;
	padding: 12px !important;
}

/* Perfect alignment of Search Form items */
#searchForm input.form-control {
	background-color: var(--white) !important;
	border: 1px solid rgba(45, 111, 115, 0.15) !important;
	border-radius: 12px !important;
	height: 48px !important;
	padding: 10px 16px !important;
	font-family: 'Outfit', sans-serif !important;
	font-size: 0.95rem !important;
	font-weight: 500 !important;
	color: var(--charcoal-shadow) !important;
	transition: all 0.25s ease !important;
}

#searchForm input.form-control:focus {
	border-color: var(--primary-teal) !important;
	box-shadow: 0 0 0 3px rgba(45, 111, 115, 0.12) !important;
	outline: none !important;
}

/* Select2 Input styling for Search Form */
#searchForm select,
#searchForm .select2-container {
	border: none !important;
	background: transparent !important;
	box-shadow: none !important;
	padding: 0 !important;
	margin: 0 !important;
}

#searchForm .select2-container .select2-selection,
#searchForm .select2-container .select2-selection--single,
#searchForm .select2-container--bootstrap-5 .select2-selection,
#searchForm .select2-container--default .select2-selection {
	background-color: var(--white) !important;
	border: 1px solid rgba(45, 111, 115, 0.15) !important;
	border-radius: 12px !important;
	height: 48px !important;
	padding: 10px 14px !important;
	font-family: 'Outfit', sans-serif !important;
	font-size: 0.95rem !important;
	font-weight: 500 !important;
	color: var(--charcoal-shadow) !important;
	transition: all 0.25s ease !important;
	display: flex !important;
	align-items: center !important;
	box-shadow: none !important;
}

#searchForm .select2-container .select2-selection .select2-selection__rendered,
#searchForm .select2-container--bootstrap-5 .select2-selection .select2-selection__rendered,
#searchForm .select2-container--default .select2-selection .select2-selection__rendered {
	line-height: 26px !important;
	color: var(--charcoal-shadow) !important;
	padding-left: 0 !important;
}

#searchForm .select2-container .select2-selection .select2-selection__arrow,
#searchForm .select2-container--bootstrap-5 .select2-selection .select2-selection__arrow,
#searchForm .select2-container--default .select2-selection .select2-selection__arrow {
	height: 46px !important;
	right: 10px !important;
	display: flex !important;
	align-items: center !important;
}

#searchForm .select2-container.select2-container--focus .select2-selection,
#searchForm .select2-container--focus .select2-selection {
	border-color: var(--primary-teal) !important;
	box-shadow: 0 0 0 3px rgba(45, 111, 115, 0.12) !important;
}

/* Premium Search Form Submit Button */
#searchForm button[type="submit"] {
	background-color: var(--primary-teal) !important;
	border: none !important;
	border-radius: 12px !important;
	height: 48px !important;
	color: var(--white) !important;
	font-family: 'Outfit', sans-serif !important;
	font-weight: 600 !important;
	font-size: 0.95rem !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	transition: all 0.25s ease !important;
	box-shadow: 0 4px 12px rgba(45, 111, 115, 0.15) !important;
}

#searchForm button[type="submit"]:hover {
	background-color: var(--primary-turquoise) !important;
	box-shadow: 0 6px 18px rgba(95, 184, 199, 0.25) !important;
	transform: translateY(-1px) !important;
}

/* 2. Premium Filters Sidebar (#movableSidebarContent) */
#movableSidebarContent {
	background-color: var(--white) !important;
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	border-radius: 20px !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03) !important;
	padding: 24px 16px !important;
}

/* Sidebar headers styling */
#movableSidebarContent h5,
#movableSidebarContent .card-header,
#movableSidebarContent .sidebar-title {
	font-family: 'Outfit', sans-serif !important;
	font-size: 1.05rem !important;
	font-weight: 700 !important;
	color: var(--primary-teal) !important;
	border-bottom: 2px solid rgba(45, 111, 115, 0.08) !important;
	padding-bottom: 12px !important;
	margin-bottom: 16px !important;
}

#movableSidebarContent h5 a {
	color: var(--primary-teal) !important;
	text-decoration: none !important;
	font-weight: 700 !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
}

#movableSidebarContent h5 a:hover {
	color: var(--primary-turquoise) !important;
}

/* Sidebar links and hovering animations */
#movableSidebarContent ul {
	padding-left: 0 !important;
}

#movableSidebarContent li {
	list-style: none !important;
}

#movableSidebarContent li a {
	color: var(--charcoal-shadow) !important;
	font-weight: 600 !important;
	font-size: 0.92rem !important;
	text-decoration: none !important;
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
	padding: 6px 10px !important;
	border-radius: 8px !important;
	transition: all 0.2s ease !important;
}

#movableSidebarContent li a i {
	color: var(--primary-teal) !important;
	font-size: 0.95rem !important;
	transition: all 0.2s ease !important;
}

#movableSidebarContent li a:hover {
	background-color: rgba(45, 111, 115, 0.05) !important;
	color: var(--primary-teal) !important;
	padding-left: 14px !important;
}

#movableSidebarContent li a:hover i {
	color: var(--primary-turquoise) !important;
}

#movableSidebarContent li span.fw-bold {
	color: var(--primary-teal) !important;
	font-weight: 700 !important;
	font-size: 0.92rem !important;
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
	padding: 6px 10px !important;
	background-color: rgba(45, 111, 115, 0.08) !important;
	border-radius: 8px !important;
}

#movableSidebarContent li span.fw-bold i {
	color: var(--primary-teal) !important;
}

/* Sidebar count badges */
#movableSidebarContent .count,
#movableSidebarContent span.fw-normal {
	font-size: 0.78rem !important;
	font-weight: 700 !important;
	color: var(--stone-gray) !important;
	background: rgba(0, 0, 0, 0.04) !important;
	padding: 2px 6px !important;
	border-radius: 20px !important;
	margin-left: auto !important; /* Push count to the right */
}

#movableSidebarContent li a:hover .count,
#movableSidebarContent li a:hover span.fw-normal {
	background: rgba(45, 111, 115, 0.12) !important;
	color: var(--primary-teal) !important;
}

/* Category Quick Search input inside sidebar */
#categorySearch {
	background-color: var(--white) !important;
	border: 1px solid rgba(45, 111, 115, 0.15) !important;
	border-left: none !important; /* Share a single seamless border box */
	border-radius: 0 10px 10px 0 !important;
	padding: 8px 12px !important;
	font-size: 0.88rem !important;
	color: var(--charcoal-shadow) !important;
}

#movableSidebarContent .input-group-text {
	border: 1px solid rgba(45, 111, 115, 0.15) !important;
	border-right: none !important; /* Share a single seamless border box */
	border-radius: 10px 0 0 10px !important;
	color: var(--primary-teal) !important;
	background-color: var(--white) !important;
}

#categorySearch:focus {
	border-color: var(--primary-teal) !important;
	box-shadow: none !important;
}

/* price range slider overrides (noUiSlider) */
#movableSidebarContent .noUi-target {
	background: #f4f3ef !important;
	border-radius: 4px !important;
	border: none !important;
	box-shadow: inset 0 1px 3px rgba(0,0,0,0.05) !important;
	height: 6px !important;
	margin: 15px 10px !important;
}

#movableSidebarContent .noUi-connect {
	background: var(--primary-teal) !important;
}

#movableSidebarContent .noUi-handle {
	border: 2px solid var(--primary-teal) !important;
	background: #ffffff !important;
	border-radius: 50% !important;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15) !important;
	cursor: pointer !important;
	width: 16px !important;
	height: 16px !important;
	right: -8px !important;
	top: -5px !important;
}

#movableSidebarContent .noUi-handle::before,
#movableSidebarContent .noUi-handle::after {
	display: none !important;
}

/* Price/Salary fields inside sidebar */
#movableSidebarContent input[type="number"],
#movableSidebarContent input[type="text"] {
	background-color: var(--white) !important;
	border: 1px solid rgba(45, 111, 115, 0.15) !important;
	border-radius: 8px !important;
	font-size: 0.82rem !important;
	padding: 8px 10px !important;
	color: var(--charcoal-shadow) !important;
	transition: all 0.25s ease !important;
}

#movableSidebarContent input[type="number"]:focus,
#movableSidebarContent input[type="text"]:focus {
	border-color: var(--primary-teal) !important;
	box-shadow: 0 0 0 3px rgba(45, 111, 115, 0.08) !important;
}

#movableSidebarContent button[type="submit"].btn-secondary {
	background-color: var(--primary-teal) !important;
	border: none !important;
	border-radius: 8px !important;
	color: var(--white) !important;
	font-weight: 600 !important;
	font-size: 0.82rem !important;
	padding: 8px 16px !important;
	transition: all 0.25s ease !important;
}

#movableSidebarContent button[type="submit"].btn-secondary:hover {
	background-color: var(--primary-turquoise) !important;
	box-shadow: 0 4px 10px rgba(95, 184, 199, 0.2) !important;
}

/* Mobile Sidebar Offcanvas style overrides */
#smallScreenSidebar {
	background-color: var(--white) !important;
	border-right: 1px solid rgba(45, 111, 115, 0.08) !important;
}

#smallScreenSidebar .offcanvas-header {
	background-color: rgba(45, 111, 115, 0.05) !important;
	border-bottom: 1px solid rgba(45, 111, 115, 0.08) !important;
	color: var(--primary-teal) !important;
	font-family: 'Outfit', sans-serif !important;
}

#smallScreenSidebar .offcanvas-title {
	font-weight: 700 !important;
	color: var(--primary-teal) !important;
}

/* 3. Premium Nav Tabs (#postType) & breadcrumb Bars */
#postType.nav-tabs {
	border-bottom: 2px solid rgba(45, 111, 115, 0.08) !important;
	gap: 8px !important;
	margin-bottom: 20px !important;
}

#postType.nav-tabs .nav-link {
	border: none !important;
	background: transparent !important;
	color: var(--charcoal-shadow) !important;
	font-family: 'Outfit', sans-serif !important;
	font-weight: 600 !important;
	font-size: 0.95rem !important;
	padding: 12px 16px !important;
	position: relative !important;
	transition: all 0.25s ease !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
}

#postType.nav-tabs .nav-link::after {
	content: '' !important;
	position: absolute !important;
	bottom: -2px !important;
	left: 0 !important;
	width: 100% !important;
	height: 3px !important;
	background-color: var(--primary-teal) !important;
	transform: scaleX(0) !important;
	transform-origin: bottom center !important;
	transition: transform 0.25s ease !important;
	border-radius: 4px 4px 0 0 !important;
}

#postType.nav-tabs .nav-link:hover {
	color: var(--primary-teal) !important;
}

#postType.nav-tabs .nav-link.active {
	color: var(--primary-teal) !important;
	font-weight: 700 !important;
}

#postType.nav-tabs .nav-link.active::after {
	transform: scaleX(1) !important;
}

/* Nav Tabs Badges */
#postType.nav-tabs .nav-link .badge,
#postType.nav-tabs .nav-link span.badge {
	background-color: rgba(45, 111, 115, 0.08) !important;
	color: var(--primary-teal) !important;
	font-weight: 700 !important;
	font-size: 0.76rem !important;
	border-radius: 50px !important;
	padding: 3px 8px !important;
	transition: all 0.25s ease !important;
}

#postType.nav-tabs .nav-link.active .badge,
#postType.nav-tabs .nav-link.active span.badge {
	background-color: var(--primary-teal) !important;
	color: var(--white) !important;
}

/* Action & Filter Bar Overhaul */
.main-container .container.bg-body,
.main-container .container.bg-body-tertiary {
	background-color: var(--white) !important;
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	border-radius: 12px !important;
	margin-bottom: 12px !important;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.02) !important;
	padding: 12px 20px !important;
}

/* Clear duplicate/unwanted double borders and spacing */
.main-container .container.bg-body + .container.bg-body-tertiary {
	margin-top: -4px !important;
}

/* Save Search Button */
.main-container .saveSearch {
	border: 1.5px solid var(--primary-teal) !important;
	color: var(--primary-teal) !important;
	background: transparent !important;
	font-family: 'Outfit', sans-serif !important;
	font-weight: 600 !important;
	border-radius: 50px !important;
	padding: 6px 16px !important;
	transition: all 0.25s ease !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
}

.main-container .saveSearch:hover {
	background-color: var(--primary-teal) !important;
	color: var(--white) !important;
	box-shadow: 0 4px 10px rgba(45, 111, 115, 0.15) !important;
}

/* Clear all link styling */
.main-container a[href*="searchWithoutQuery"] {
	color: var(--stone-gray) !important;
	font-weight: 600 !important;
	font-size: 0.88rem !important;
	text-decoration: none !important;
	transition: color 0.2s ease !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 4px !important;
}

.main-container a[href*="searchWithoutQuery"]:hover {
	color: #e55353 !important;
}

/* Breadcrumb lists and HTML title text */
.main-container .breadcrumb-list {
	color: var(--charcoal-shadow) !important;
	font-family: 'Outfit', sans-serif !important;
	font-weight: 700 !important;
	font-size: 0.95rem !important;
}

.main-container .breadcrumb-list a {
	color: var(--primary-teal) !important;
	text-decoration: none !important;
	font-weight: 700 !important;
}

.main-container .breadcrumb-list a:hover {
	color: var(--primary-turquoise) !important;
}

/* Sorting Dropdown Menu */
.main-container .dropdown-toggle {
	color: var(--charcoal-shadow) !important;
	font-family: 'Outfit', sans-serif !important;
	font-weight: 700 !important;
	font-size: 0.88rem !important;
	text-decoration: none !important;
	transition: color 0.2s ease !important;
}

.main-container .dropdown-toggle:hover {
	color: var(--primary-teal) !important;
}

.main-container .dropdown-menu {
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	border-radius: 12px !important;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08) !important;
	padding: 8px !important;
}

.main-container .dropdown-menu .dropdown-item {
	font-family: 'Outfit', sans-serif !important;
	font-weight: 600 !important;
	font-size: 0.88rem !important;
	border-radius: 8px !important;
	color: var(--charcoal-shadow) !important;
	padding: 8px 12px !important;
	transition: all 0.2s ease !important;
}

.main-container .dropdown-menu .dropdown-item:hover,
.main-container .dropdown-menu .dropdown-item.active {
	background-color: rgba(45, 111, 115, 0.08) !important;
	color: var(--primary-teal) !important;
}

/* Layout Selector Buttons */
.main-container .list-inline-item .btn-group {
	border: 1px solid rgba(45, 111, 115, 0.15) !important;
	border-radius: 8px !important;
	overflow: hidden !important;
}

.main-container .list-inline-item .btn-group .btn-outline-primary {
	border: none !important;
	background-color: var(--white) !important;
	color: var(--stone-gray) !important;
	padding: 6px 12px !important;
	transition: all 0.2s ease !important;
}

.main-container .list-inline-item .btn-group .btn-outline-primary:not(:last-child) {
	border-right: 1px solid rgba(45, 111, 115, 0.15) !important;
}

.main-container .list-inline-item .btn-group .btn-outline-primary:hover {
	color: var(--primary-teal) !important;
	background-color: rgba(45, 111, 115, 0.05) !important;
}

.main-container .list-inline-item .btn-group .btn-outline-primary.active {
	background-color: var(--primary-teal) !important;
	color: var(--white) !important;
}

/* 4. Premium List View Cards */
.list-view .item-list {
	background-color: var(--white) !important;
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	border-radius: 16px !important;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.02) !important;
	padding: 16px !important;
	transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
	margin-bottom: 20px !important;
	box-sizing: border-box !important;
}

.list-view .item-list:hover {
	transform: translateY(-3px) !important;
	box-shadow: 0 12px 24px rgba(45, 111, 115, 0.1) !important;
	border-color: var(--primary-turquoise) !important;
}

/* List view Image and hover zoom */
.list-view .item-list .main-image {
	padding: 0 !important;
	border-radius: 12px !important;
	overflow: hidden !important;
}

.list-view .item-list .main-image img {
	border-radius: 12px !important;
	object-fit: cover !important;
	height: 100% !important;
	width: 100% !important;
	transition: transform 0.3s ease !important;
}

.list-view .item-list:hover .main-image img {
	transform: scale(1.05) !important;
}

/* List View Title */
.list-view .item-list h5.fs-5 {
	margin-bottom: 8px !important;
}

.list-view .item-list h5.fs-5 a {
	color: var(--charcoal-shadow) !important;
	font-family: 'Outfit', sans-serif !important;
	font-weight: 700 !important;
	font-size: 1.15rem !important;
	text-decoration: none !important;
	transition: color 0.2s ease !important;
}

.list-view .item-list h5.fs-5 a:hover {
	color: var(--primary-teal) !important;
}

/* List View Meta data (Clock, Location, Folder) */
.list-view .item-list .list-inline-item {
	font-size: 0.86rem !important;
	font-weight: 500 !important;
	color: var(--stone-gray) !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 4px !important;
}

.list-view .item-list .list-inline-item i {
	color: var(--primary-teal) !important;
	font-size: 0.95rem !important;
}

.list-view .item-list .list-inline-item a {
	color: var(--stone-gray) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
}

.list-view .item-list .list-inline-item a:hover {
	color: var(--primary-teal) !important;
}

/* List View Price formatting */
.list-view .item-list h5.fs-4 {
	color: var(--primary-teal) !important;
	font-family: 'Outfit', sans-serif !important;
	font-weight: 800 !important;
	font-size: 1.35rem !important;
}

/* Badges inside listing details */
.list-view .item-list .badge.text-bg-secondary {
	background-color: rgba(45, 111, 115, 0.08) !important;
	color: var(--primary-teal) !important;
	font-weight: 700 !important;
	font-size: 0.72rem !important;
}

/* Outlined heart button (Save) */
.list-view .item-list .make-favorite.btn-outline-secondary {
	background-color: #f4f3ef !important;
	color: var(--charcoal-shadow) !important;
	border: none !important;
}

.list-view .item-list .make-favorite.btn-outline-secondary:hover {
	background-color: var(--primary-turquoise) !important;
	color: var(--white) !important;
	box-shadow: 0 4px 10px rgba(95, 184, 199, 0.2) !important;
}

/* Filled heart button (Saved) */
.list-view .item-list .make-favorite.btn-success {
	background-color: #e55353 !important;
	color: var(--white) !important;
	box-shadow: 0 4px 10px rgba(229, 83, 83, 0.2) !important;
	border: none !important;
}

.list-view .item-list .make-favorite.btn-success:hover {
	background-color: #d13f3f !important;
}

/* WhatsApp button styling */
.list-view .item-list .btn-success:not(.make-favorite) {
	background-color: #25d366 !important;
	color: var(--white) !important;
	border: none !important;
	border-radius: 50px !important;
	padding: 5px 12px !important;
	font-size: 0.78rem !important;
	font-weight: 600 !important;
	transition: all 0.25s ease !important;
}

.list-view .item-list .btn-success:not(.make-favorite):hover {
	background-color: #20ba5a !important;
	box-shadow: 0 4px 10px rgba(37, 211, 102, 0.2) !important;
}

/* 5. Premium Compact View Cards */
.compact-view .item-list {
	background-color: var(--white) !important;
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	border-radius: 12px !important;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.02) !important;
	padding: 14px 16px !important;
	transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
	margin-bottom: 12px !important;
	box-sizing: border-box !important;
}

.compact-view .item-list:hover {
	transform: translateY(-2px) !important;
	box-shadow: 0 8px 18px rgba(45, 111, 115, 0.08) !important;
	border-color: var(--primary-turquoise) !important;
}

.compact-view .item-list h5.fs-5 a {
	color: var(--charcoal-shadow) !important;
	font-family: 'Outfit', sans-serif !important;
	font-weight: 700 !important;
	font-size: 1.05rem !important;
	text-decoration: none !important;
	transition: color 0.2s ease !important;
}

.compact-view .item-list h5.fs-5 a:hover {
	color: var(--primary-teal) !important;
}

.compact-view .item-list .list-inline-item {
	font-size: 0.82rem !important;
	font-weight: 500 !important;
	color: var(--stone-gray) !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 4px !important;
}

.compact-view .item-list .list-inline-item i {
	color: var(--primary-teal) !important;
}

.compact-view .item-list .list-inline-item a {
	color: var(--stone-gray) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
}

.compact-view .item-list .list-inline-item a:hover {
	color: var(--primary-teal) !important;
}

.compact-view .item-list h5.fs-5.fw-bold {
	color: var(--primary-teal) !important;
	font-family: 'Outfit', sans-serif !important;
	font-weight: 800 !important;
	font-size: 1.2rem !important;
}

.compact-view .item-list .make-favorite.btn-outline-secondary {
	background-color: #f4f3ef !important;
	color: var(--charcoal-shadow) !important;
	border: none !important;
}

.compact-view .item-list .make-favorite.btn-outline-secondary:hover {
	background-color: var(--primary-turquoise) !important;
	color: var(--white) !important;
}

.compact-view .item-list .make-favorite.btn-success {
	background-color: #e55353 !important;
	color: var(--white) !important;
	border: none !important;
}

/* 6. Neutralize default search listings borders */
.main-container .tab-content,
.main-container #myTabContent,
.main-container .tab-pane .container {
	border: none !important;
	background: transparent !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* 7. Premium Category Banner Wrapper styling */
.category-banner-wrapper {
	border-radius: 16px !important;
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.04) !important;
}

/* 8. Premium Pagination Circular Buttons */
.main-container .pagination {
	justify-content: center !important;
	gap: 6px !important;
	margin-top: 30px !important;
	margin-bottom: 20px !important;
}

.main-container .pagination .page-item {
	border: none !important;
}

.main-container .pagination .page-item .page-link {
	border: 1px solid rgba(45, 111, 115, 0.15) !important;
	background-color: var(--white) !important;
	color: var(--charcoal-shadow) !important;
	font-family: 'Outfit', sans-serif !important;
	font-weight: 700 !important;
	font-size: 0.9rem !important;
	border-radius: 50% !important;
	width: 38px !important;
	height: 38px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	transition: all 0.25s ease !important;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.02) !important;
}

.main-container .pagination .page-item:first-child .page-link,
.main-container .pagination .page-item:last-child .page-link {
	border-radius: 50% !important;
}

.main-container .pagination .page-item .page-link:hover {
	border-color: var(--primary-turquoise) !important;
	color: var(--primary-teal) !important;
	background-color: rgba(95, 184, 199, 0.08) !important;
	transform: translateY(-2px) !important;
	box-shadow: 0 6px 15px rgba(95, 184, 199, 0.1) !important;
}

.main-container .pagination .page-item.active .page-link {
	background-color: var(--primary-teal) !important;
	border-color: var(--primary-teal) !important;
	color: var(--white) !important;
	box-shadow: 0 6px 15px rgba(45, 111, 115, 0.25) !important;
}

.main-container .pagination .page-item.disabled .page-link {
	background-color: #f4f3ef !important;
	border-color: rgba(0, 0, 0, 0.05) !important;
	color: var(--stone-gray) !important;
	opacity: 0.6 !important;
}

/* 9. Premium Call-to-Action Card & "Start Now" Button Overrides */
.main-container .card.bg-body-tertiary,
.main-container .card:has(.btn-primary),
.card:has(a[href*="signInModal"]),
.card:has(a[href*="posts/create"]),
.card:has(.btn-primary),
.card.bg-body-tertiary {
	background-color: var(--white) !important;
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	border-radius: 20px !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03) !important;
	padding: 24px !important;
}

.card:has(.btn-primary) h3,
.card.bg-body-tertiary h3 {
	font-family: 'Outfit', sans-serif !important;
	color: var(--charcoal-shadow) !important;
	font-weight: 700 !important;
}

.card:has(.btn-primary) h5,
.card.bg-body-tertiary h5 {
	font-family: 'Outfit', sans-serif !important;
	color: var(--stone-gray) !important;
	font-weight: 500 !important;
}

.main-container .card .btn-primary,
.card.bg-body-tertiary .btn-primary,
.card:has(.btn-primary) .btn-primary,
a.btn-primary[href*="signInModal"],
a.btn-primary[href*="addPost"],
a.btn-primary[href*="posts/create"] {
	background-color: var(--primary-teal) !important;
	border-color: var(--primary-teal) !important;
	color: var(--white) !important;
	font-family: 'Outfit', sans-serif !important;
	font-weight: 600 !important;
	padding: 10px 28px !important;
	border-radius: 50px !important;
	transition: all 0.25s ease !important;
	box-shadow: 0 4px 12px rgba(45, 111, 115, 0.15) !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
}

.main-container .card .btn-primary:hover,
.card.bg-body-tertiary .btn-primary:hover,
.card:has(.btn-primary) .btn-primary:hover,
a.btn-primary[href*="signInModal"]:hover,
a.btn-primary[href*="addPost"]:hover,
a.btn-primary[href*="posts/create"]:hover {
	background-color: var(--primary-turquoise) !important;
	border-color: var(--primary-turquoise) !important;
	box-shadow: 0 6px 18px rgba(95, 184, 199, 0.25) !important;
	transform: translateY(-2px) !important;
}

/* --- PREMIUM PACKAGES PAGE OVERHAUL --- */
.pricing-packages-page {
	padding-top: 60px !important;
	padding-bottom: 80px !important;
	background-color: var(--warm-white) !important;
}

/* Page Header & Intro styling */
.pricing-packages-page h1 {
	color: var(--charcoal-shadow) !important;
	font-weight: 800 !important;
	font-size: 3rem !important;
	letter-spacing: -0.5px !important;
}

.pricing-packages-page p.lead {
	color: var(--stone-gray) !important;
	font-size: 1.15rem !important;
	font-weight: 500 !important;
	max-width: 600px;
	margin: 0 auto !important;
}

/* Navigation Tab Pills */
.pricing-packages-page .nav-pills#pills-tab {
	background-color: rgba(45, 111, 115, 0.05) !important;
	padding: 8px !important;
	border-radius: 100px !important;
	display: inline-flex !important;
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
}

.pricing-packages-page .nav-pills#pills-tab .nav-item .nav-link {
	color: var(--charcoal-shadow) !important;
	background: transparent !important;
	border: none !important;
	border-radius: 100px !important;
	font-size: 0.95rem !important;
	font-weight: 700 !important;
	padding: 12px 35px !important;
	transition: all 0.25s ease !important;
}

.pricing-packages-page .nav-pills#pills-tab .nav-item .nav-link.active {
	background-color: var(--primary-teal) !important;
	color: var(--white) !important;
	box-shadow: 0 4px 15px rgba(45, 111, 115, 0.2) !important;
}

.pricing-packages-page .nav-pills#pills-tab .nav-item .nav-link:hover:not(.active) {
	color: var(--primary-teal) !important;
	background-color: rgba(45, 111, 115, 0.03) !important;
}

/* Sub-Tab Pills (Individual vs Business) */
.pricing-packages-page .nav-pills#packages-sub-tab {
	background-color: rgba(45, 111, 115, 0.04) !important;
	padding: 6px !important;
	border-radius: 100px !important;
	display: inline-flex !important;
	border: 1px solid rgba(45, 111, 115, 0.05) !important;
}

.pricing-packages-page .nav-pills#packages-sub-tab .nav-item .nav-link {
	color: var(--charcoal-shadow) !important;
	background: transparent !important;
	border: none !important;
	border-radius: 100px !important;
	font-size: 0.88rem !important;
	font-weight: 700 !important;
	padding: 8px 24px !important;
	transition: all 0.25s ease !important;
}

.pricing-packages-page .nav-pills#packages-sub-tab .nav-item .nav-link.active {
	background-color: var(--primary-turquoise) !important;
	color: var(--white) !important;
	box-shadow: 0 4px 12px rgba(95, 184, 199, 0.2) !important;
}

.pricing-packages-page .nav-pills#packages-sub-tab .nav-item .nav-link:hover:not(.active) {
	color: var(--primary-turquoise) !important;
}

/* Plan Cards Override */
.pricing-packages-page .card {
	background-color: var(--white) !important;
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	border-radius: 24px !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.02) !important;
	transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
	padding: 15px !important;
}

.pricing-packages-page .card:hover {
	transform: translateY(-8px) !important;
	border-color: var(--primary-turquoise) !important;
	box-shadow: 0 20px 40px rgba(45, 111, 115, 0.1) !important;
}

.pricing-packages-page .card-body {
	padding: 24px !important;
}

/* Card Titles */
.pricing-packages-page .card h4 {
	color: var(--charcoal-shadow) !important;
	font-size: 1.45rem !important;
	font-weight: 700 !important;
	letter-spacing: -0.3px !important;
	margin-bottom: 12px !important;
}

/* Price Section Styling */
.pricing-packages-page .price-section {
	background-color: rgba(95, 184, 199, 0.05) !important;
	border-radius: 16px !important;
	padding: 20px !important;
	margin-bottom: 24px !important;
	border: 1px solid rgba(95, 184, 199, 0.08) !important;
	transition: all 0.25s ease !important;
}

.pricing-packages-page .card:hover .price-section {
	background-color: rgba(95, 184, 199, 0.08) !important;
	border-color: rgba(95, 184, 199, 0.15) !important;
}

.pricing-packages-page .price-section span.fs-2 {
	font-size: 2.2rem !important;
	font-weight: 800 !important;
	color: var(--primary-teal) !important;
	letter-spacing: -0.5px !important;
}

.pricing-packages-page .price-section span.text-muted {
	color: var(--stone-gray) !important;
	font-size: 0.9rem !important;
	font-weight: 600 !important;
}

/* Features List styling */
.pricing-packages-page ul.list-unstyled {
	margin-bottom: 30px !important;
}

.pricing-packages-page ul.list-unstyled li {
	font-size: 0.95rem !important;
	color: var(--charcoal-shadow) !important;
	font-weight: 500 !important;
	display: flex !important;
	align-items: center !important;
	margin-bottom: 12px !important;
	line-height: 1.4 !important;
}

.pricing-packages-page ul.list-unstyled li i.fa-check-circle {
	color: var(--primary-turquoise) !important;
	font-size: 1.1rem !important;
	margin-right: 12px !important;
}

/* Custom styled action buttons on the package page */
.pricing-packages-page .card .btn-primary {
	margin-top: auto !important;
	padding: 14px 28px !important;
	font-size: 1rem !important;
	font-weight: 700 !important;
	border-radius: 50px !important;
	box-shadow: 0 4px 12px rgba(45, 111, 115, 0.15) !important;
}

.pricing-packages-page .card .btn-success {
	margin-top: auto !important;
	padding: 14px 28px !important;
	font-size: 1rem !important;
	font-weight: 700 !important;
	border-radius: 50px !important;
	background-color: var(--botanical-green) !important;
	border-color: var(--botanical-green) !important;
	color: var(--white) !important;
	opacity: 0.95 !important;
	box-shadow: 0 4px 12px rgba(95, 143, 101, 0.15) !important;
	transition: all 0.25s ease !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
}

/* --- SELECT COUNTRY MODAL OVERHAUL --- */
#selectCountry .modal-content {
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	border-radius: 24px !important;
	box-shadow: 0 15px 40px rgba(45, 111, 115, 0.12) !important;
	background-color: var(--white) !important;
	overflow: hidden !important;
}

#selectCountry .modal-header {
	border-bottom: 1px solid rgba(45, 111, 115, 0.06) !important;
	padding: 20px 28px !important;
	background-color: var(--white) !important;
}

#selectCountry .modal-header h4.modal-title {
	color: var(--charcoal-shadow) !important;
	font-weight: 700 !important;
	font-size: 1.25rem !important;
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
}

#selectCountry .modal-header h4.modal-title i {
	color: var(--primary-teal) !important;
	font-size: 1.35rem !important;
}

#selectCountry .modal-header .btn-close {
	background-color: rgba(45, 111, 115, 0.05) !important;
	border-radius: 50% !important;
	opacity: 0.8 !important;
	padding: 10px !important;
	transition: all 0.25s ease !important;
}

#selectCountry .modal-header .btn-close:hover {
	background-color: rgba(45, 111, 115, 0.1) !important;
	opacity: 1 !important;
}

#selectCountry .modal-body {
	padding: 24px 28px !important;
}

#selectCountry .modal-footer {
	border-top: 1px solid rgba(45, 111, 115, 0.06) !important;
	padding: 16px 28px !important;
	background-color: var(--warm-white) !important;
}

/* Country Selection List Capsule Items */
#selectCountry #modalCountryList .col {
	padding: 10px 20px !important;
	background-color: var(--white) !important;
	border: 1px solid rgba(45, 111, 115, 0.1) !important;
	border-radius: 50px !important;
	transition: all 0.25s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.01) !important;
	display: flex !important;
	align-items: center !important;
}

#selectCountry #modalCountryList .col a {
	color: var(--charcoal-shadow) !important;
	font-weight: 600 !important;
	font-size: 0.92rem !important;
	transition: color 0.2s ease !important;
	text-decoration: none !important;
}

#selectCountry #modalCountryList .col img {
	border-radius: 3px !important;
	box-shadow: 0 1px 3px rgba(0,0,0,0.1) !important;
}

#selectCountry #modalCountryList .col:hover {
	border-color: var(--primary-turquoise) !important;
	background-color: rgba(95, 184, 199, 0.05) !important;
	transform: translateY(-2px) !important;
	box-shadow: 0 6px 15px rgba(95, 184, 199, 0.1) !important;
}

#selectCountry #modalCountryList .col:hover a {
	color: var(--primary-teal) !important;
}

@media (min-width: 1200px) {
	#selectCountry #modalCountryList .col {
		flex: 0 0 calc(25% - 16px) !important;
		max-width: calc(25% - 16px) !important;
		margin: 8px !important;
	}
}

@media (min-width: 992px) and (max-width: 1199.98px) {
	#selectCountry #modalCountryList .col {
		flex: 0 0 calc(33.333% - 16px) !important;
		max-width: calc(33.333% - 16px) !important;
		margin: 8px !important;
	}
}

@media (max-width: 991.98px) {
	#selectCountry #modalCountryList .col {
		flex: 0 0 calc(50% - 16px) !important;
		max-width: calc(50% - 16px) !important;
		margin: 8px !important;
	}
}

/* --- POST/AD DETAILS SHOW PAGE PREMIUM OVERHAUL --- */
.main-container nav[aria-label="breadcrumb"] {
	margin-bottom: 12px !important;
}

.main-container .breadcrumb {
	background-color: transparent !important;
	padding: 8px 0 !important;
	margin-bottom: 0 !important;
	display: flex !important;
	align-items: center !important;
}

.main-container .breadcrumb-item {
	font-size: 0.9rem !important;
	font-weight: 500 !important;
	display: inline-flex !important;
	align-items: center !important;
	color: var(--stone-gray) !important;
}

.main-container .breadcrumb-item a {
	color: var(--primary-teal) !important;
	transition: color 0.2s ease !important;
	text-decoration: none !important;
}

.main-container .breadcrumb-item a:hover {
	color: var(--primary-turquoise) !important;
}

.main-container .breadcrumb-item.active {
	color: var(--charcoal-shadow) !important;
	font-weight: 600 !important;
}

/* Custom separators for breadcrumb items */
.main-container .breadcrumb-item + .breadcrumb-item::before {
	color: var(--primary-turquoise) !important;
	content: "\F138" !important; /* bootstrap icons chevron-right */
	font-family: "bootstrap-icons" !important;
	font-size: 0.75rem !important;
	vertical-align: middle !important;
	padding-right: 8px !important;
}

.main-container .float-end a[href*="previous"],
.main-container .float-end a {
	color: var(--primary-teal) !important;
	font-weight: 600 !important;
	font-size: 0.9rem !important;
	text-decoration: none !important;
	transition: all 0.2s ease !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
}

.main-container .float-end a:hover {
	color: var(--primary-turquoise) !important;
	transform: translateX(-2px) !important;
}

/* Main Details Card Panel */
.items-details-wrapper {
	background-color: var(--white) !important;
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	border-radius: 16px !important;
	box-shadow: 0 10px 30px rgba(45, 111, 115, 0.04) !important;
	padding: 30px !important;
	margin-bottom: 30px !important;
	transition: all 0.3s ease !important;
}

.items-details-wrapper h1 {
	color: var(--charcoal-shadow) !important;
	font-family: 'Outfit', sans-serif !important;
	font-weight: 700 !important;
	font-size: 2rem !important;
	line-height: 1.3 !important;
	margin-bottom: 0 !important;
}

.items-details-wrapper h1 a {
	color: var(--charcoal-shadow) !important;
	text-decoration: none !important;
	transition: color 0.2s ease !important;
}

.items-details-wrapper h1 a:hover {
	color: var(--primary-teal) !important;
}

/* Post Type Badge */
.items-details-wrapper .badge.text-bg-dark {
	background-color: var(--primary-teal) !important;
	color: var(--white) !important;
	padding: 8px 16px !important;
	font-size: 0.78rem !important;
	font-weight: 700 !important;
	letter-spacing: 0.5px !important;
	text-transform: uppercase !important;
	border-radius: 50px !important;
	box-shadow: 0 4px 10px rgba(45, 111, 115, 0.15) !important;
}

/* Listing Meta details row */
.items-details-wrapper .border-top.py-2.mt-0.text-secondary {
	border-top: 1px solid rgba(45, 111, 115, 0.08) !important;
	border-bottom: 1px solid rgba(45, 111, 115, 0.08) !important;
	padding: 14px 0 !important;
	margin-top: 15px !important;
	margin-bottom: 25px !important;
	display: flex !important;
	justify-content: space-between !important;
	align-items: center !important;
	flex-wrap: wrap !important;
	gap: 12px !important;
}

.items-details-wrapper .border-top.py-2.mt-0.text-secondary ul {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 16px !important;
	padding-left: 0 !important;
	margin-bottom: 0 !important;
}

.items-details-wrapper .border-top.py-2.mt-0.text-secondary li {
	font-size: 0.88rem !important;
	font-weight: 500 !important;
	color: var(--stone-gray) !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
}

.items-details-wrapper .border-top.py-2.mt-0.text-secondary li i {
	color: var(--primary-turquoise) !important;
	font-size: 1.05rem !important;
}

.items-details-wrapper .border-top.py-2.mt-0.text-secondary .text-nowrap {
	font-size: 0.85rem !important;
	font-weight: 600 !important;
	color: var(--primary-teal) !important;
	background: rgba(45, 111, 115, 0.05) !important;
	padding: 4px 12px !important;
	border-radius: 6px !important;
}

/* Gallery and Floating Price tag */
.gallery-container {
	position: relative !important;
	margin-bottom: 24px !important;
}

.gallery-container .p-price-tag {
	background-color: var(--primary-teal) !important;
	color: var(--white) !important;
	font-family: 'Outfit', sans-serif !important;
	font-weight: 800 !important;
	font-size: 1.25rem !important;
	padding: 10px 24px !important;
	border-radius: 50px !important;
	box-shadow: 0 10px 25px rgba(45, 111, 115, 0.3) !important;
	position: absolute !important;
	top: 15px !important;
	right: 15px !important;
	z-index: 10 !important;
	border: 2px solid rgba(255, 255, 255, 0.4) !important;
	letter-spacing: 0.2px !important;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
}

.gallery-container .p-price-tag::after,
.gallery-container .p-price-tag::before {
	display: none !important;
}

/* Pictures Slider Container override */
.main-gallery {
	border-radius: 14px !important;
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	overflow: hidden !important;
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.02) !important;
	margin-bottom: 12px !important;
}

.main-gallery img {
	width: 100% !important;
	object-fit: cover !important;
	transition: transform 0.3s ease !important;
}

.thumbs-gallery .swiper-slide {
	opacity: 0.6 !important;
	transition: opacity 0.25s ease !important;
	cursor: pointer !important;
	border-radius: 8px !important;
	overflow: hidden !important;
	border: 2px solid transparent !important;
}

.thumbs-gallery .swiper-slide-thumb-active {
	opacity: 1 !important;
	border-color: var(--primary-turquoise) !important;
	box-shadow: 0 4px 10px rgba(95, 184, 199, 0.15) !important;
}

.thumbs-gallery img {
	border-radius: 6px !important;
	transition: all 0.2s ease !important;
}

.thumbs-gallery .swiper-slide:hover {
	opacity: 0.9 !important;
}

/* Gallery navigational arrows */
.swiper-button-next,
.swiper-button-prev {
	background-color: rgba(255, 255, 255, 0.9) !important;
	color: var(--primary-teal) !important;
	width: 44px !important;
	height: 44px !important;
	border-radius: 50% !important;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
	transition: all 0.25s ease !important;
}

.swiper-button-next:hover,
.swiper-button-prev:hover {
	background-color: var(--primary-teal) !important;
	color: var(--white) !important;
	transform: scale(1.05) !important;
}

.swiper-button-next::after,
.swiper-button-prev::after {
	font-size: 1.15rem !important;
	font-weight: bold !important;
}

/* Tabs Navigation styling */
#itemsDetailsTabs {
	border-bottom: 2px solid rgba(45, 111, 115, 0.08) !important;
	margin-bottom: 20px !important;
	padding-bottom: 2px !important;
	gap: 25px !important;
}

#itemsDetailsTabs .nav-item {
	margin-bottom: -2px !important;
}

#itemsDetailsTabs .nav-link {
	border: none !important;
	background: transparent !important;
	padding: 12px 4px !important;
	color: var(--stone-gray) !important;
	font-weight: 600 !important;
	font-size: 1.05rem !important;
	position: relative !important;
	transition: color 0.25s ease !important;
	border-radius: 0 !important;
}

#itemsDetailsTabs .nav-link span {
	font-family: 'Outfit', sans-serif !important;
}

#itemsDetailsTabs .nav-link:hover {
	color: var(--primary-turquoise) !important;
}

#itemsDetailsTabs .nav-link.active {
	color: var(--primary-teal) !important;
	font-weight: 700 !important;
}

#itemsDetailsTabs .nav-link.active::after {
	content: "" !important;
	position: absolute !important;
	bottom: 0 !important;
	left: 0 !important;
	width: 100% !important;
	height: 3px !important;
	background-color: var(--primary-teal) !important;
	border-radius: 3px !important;
	transition: all 0.2s ease !important;
}

#itemsDetailsTabsContent {
	border: none !important;
	background: transparent !important;
	padding: 10px 0 !important;
}

/* Listing details information content block */
.items-details-info .row.border-bottom.pb-2.mb-3 {
	background-color: rgba(95, 184, 199, 0.03) !important;
	border: 1px solid rgba(95, 184, 199, 0.1) !important;
	border-radius: 12px !important;
	padding: 16px 20px !important;
	margin: 0 0 24px 0 !important;
	display: flex !important;
	align-items: center !important;
}

.items-details-info .row.border-bottom.pb-2.mb-3 h4 {
	margin-bottom: 0 !important;
	color: var(--charcoal-shadow) !important;
	font-family: 'Outfit', sans-serif !important;
}

.items-details-info .row.border-bottom.pb-2.mb-3 .col-md-6 {
	padding: 0 !important;
}

.items-details-info .row.border-bottom.pb-2.mb-3 i {
	color: var(--primary-teal) !important;
	margin-right: 6px !important;
}

.items-details-info .row.border-bottom.pb-2.mb-3 a {
	color: var(--primary-teal) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	transition: color 0.2s ease !important;
}

.items-details-info .row.border-bottom.pb-2.mb-3 a:hover {
	color: var(--primary-turquoise) !important;
}

/* Negotiable pill */
.items-details-info .badge.text-bg-info {
	background-color: rgba(95, 184, 199, 0.12) !important;
	color: var(--primary-teal) !important;
	border: 1px solid rgba(95, 184, 199, 0.2) !important;
	font-size: 0.72rem !important;
	font-weight: 700 !important;
	padding: 5px 12px !important;
	margin-left: 6px !important;
	text-transform: uppercase !important;
	letter-spacing: 0.2px !important;
}

/* Description body text */
.items-details-info .detail-line-content {
	font-size: 0.98rem !important;
	line-height: 1.75 !important;
	color: #4a4a4a !important;
	margin-bottom: 24px !important;
}

/* Headers inside info card */
.items-details-info h4.my-3,
.items-details-info h4.p-0 {
	color: var(--primary-teal) !important;
	font-weight: 700 !important;
	font-size: 1.15rem !important;
	margin-top: 30px !important;
	margin-bottom: 15px !important;
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
}

.items-details-info h4.my-3 i,
.items-details-info h4.p-0 i {
	color: var(--primary-turquoise) !important;
}

/* Capsules tags */
.items-details-info span.d-inline-block.border.bg-body-tertiary {
	background-color: rgba(45, 111, 115, 0.04) !important;
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	border-radius: 50px !important;
	padding: 5px 15px !important;
	margin: 4px 6px 4px 0 !important;
	transition: all 0.2s ease !important;
}

.items-details-info span.d-inline-block.border.bg-body-tertiary a {
	color: var(--primary-teal) !important;
	font-size: 0.82rem !important;
	font-weight: 600 !important;
	text-decoration: none !important;
}

.items-details-info span.d-inline-block.border.bg-body-tertiary:hover {
	background-color: rgba(45, 111, 115, 0.08) !important;
	border-color: var(--primary-turquoise) !important;
	transform: translateY(-1px) !important;
}

.items-details-info span.d-inline-block.border.bg-body-tertiary:hover a {
	color: var(--primary-turquoise) !important;
}

/* Action Icons - circular floating buttons */
.items-details-info .row.mt-4.fs-1.text-center {
	display: flex !important;
	justify-content: center !important;
	gap: 30px !important;
	margin-top: 35px !important;
	border-top: 1px solid rgba(45, 111, 115, 0.08) !important;
	padding-top: 25px !important;
}

.items-details-info .row.mt-4.fs-1.text-center .col-4 {
	width: auto !important;
	padding: 0 !important;
}

.items-details-info .row.mt-4.fs-1.text-center a {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 52px !important;
	height: 52px !important;
	border-radius: 50% !important;
	background-color: var(--white) !important;
	border: 1px solid rgba(45, 111, 115, 0.12) !important;
	color: var(--primary-teal) !important;
	font-size: 1.25rem !important;
	transition: all 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.02) !important;
	text-decoration: none !important;
}

.items-details-info .row.mt-4.fs-1.text-center a:hover {
	transform: translateY(-4px) !important;
	border-color: var(--primary-turquoise) !important;
	background-color: rgba(95, 184, 199, 0.05) !important;
	color: var(--primary-teal) !important;
	box-shadow: 0 8px 20px rgba(45, 111, 115, 0.12) !important;
}

/* Heart Icon color filled vs hollow */
.items-details-info .row.mt-4.fs-1.text-center a.make-favorite i.bi-heart-fill {
	color: #e25c5c !important;
}

.items-details-info .row.mt-4.fs-1.text-center a.make-favorite:hover i.bi-heart {
	color: #e25c5c !important;
}

/* Abuse report flag hover state */
.items-details-info .row.mt-4.fs-1.text-center a[href*="report"]:hover {
	border-color: #dc3545 !important;
	background-color: rgba(220, 53, 69, 0.05) !important;
	color: #dc3545 !important;
	box-shadow: 0 8px 20px rgba(220, 53, 69, 0.1) !important;
}

/* Horizontal spacing for detail actions row */
.items-details-info .col-12:has(.hstack) {
	border-top: 1px solid rgba(45, 111, 115, 0.08) !important;
	padding-top: 25px !important;
	margin-top: 20px !important;
}

.items-details-info .col-12:has(.hstack) .hstack {
	justify-content: center !important;
}

.items-details-info .col-12:has(.hstack) .btn {
	padding: 12px 28px !important;
	border-radius: 50px !important;
	font-weight: 700 !important;
}

/* --- SIDEBAR AND AUTHOR INFORMATION OVERHAUL --- */
aside.vstack {
	gap: 24px !important;
}

aside .card {
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	border-radius: 16px !important;
	box-shadow: 0 8px 24px rgba(45, 111, 115, 0.03) !important;
	overflow: hidden !important;
	background-color: var(--white) !important;
	transition: all 0.3s ease !important;
}

aside .card:hover {
	box-shadow: 0 12px 36px rgba(45, 111, 115, 0.06) !important;
}

aside .card .card-header {
	background-color: var(--primary-teal) !important;
	border-bottom: none !important;
	color: var(--white) !important;
	font-family: 'Outfit', sans-serif !important;
	font-weight: 700 !important;
	font-size: 0.88rem !important;
	padding: 16px 20px !important;
	text-transform: uppercase !important;
	letter-spacing: 0.6px !important;
	text-align: center !important;
}

aside .card .card-body {
	padding: 24px 20px !important;
}

/* Author Avatar details */
aside .card-body .container.p-0.border-bottom {
	border-bottom: 1px solid rgba(45, 111, 115, 0.08) !important;
	padding-bottom: 20px !important;
	margin-bottom: 20px !important;
}

aside .card-body img.img-fluid.rounded {
	border-radius: 50% !important;
	width: 60px !important;
	height: 60px !important;
	object-fit: cover !important;
	border: 2px solid var(--primary-turquoise) !important;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05) !important;
}

aside .card-body .col-md-8 span.fs-6 {
	font-size: 1.05rem !important;
	font-weight: 700 !important;
	color: var(--charcoal-shadow) !important;
}

aside .card-body .col-md-8 span.fs-6 a {
	color: var(--charcoal-shadow) !important;
	text-decoration: none !important;
	transition: color 0.2s ease !important;
}

aside .card-body .col-md-8 span.fs-6 a:hover {
	color: var(--primary-teal) !important;
}

/* Location details and Joined elements */
aside .card-body .container.text-secondary {
	margin-bottom: 20px !important;
}

aside .card-body .container.text-secondary .row {
	margin-bottom: 8px !important;
	font-size: 0.85rem !important;
	font-weight: 500 !important;
}

aside .card-body .container.text-secondary i {
	color: var(--primary-turquoise) !important;
	margin-right: 6px !important;
	font-size: 0.95rem !important;
}

aside .card-body .container.text-secondary a {
	color: var(--primary-teal) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	transition: color 0.2s ease !important;
}

aside .card-body .container.text-secondary a:hover {
	color: var(--primary-turquoise) !important;
}

/* Sidebar button action grids */
aside .card-body .d-grid.gap-2 {
	display: flex !important;
	flex-direction: column !important;
	gap: 12px !important;
}

/* Phone Block capsule */
aside .card-body .btn-warning,
aside .card-body a.btn-warning {
	background-color: var(--primary-teal) !important;
	border-color: var(--primary-teal) !important;
	color: var(--white) !important;
	font-family: 'Outfit', sans-serif !important;
	font-weight: 700 !important;
	font-size: 0.95rem !important;
	padding: 12px 20px !important;
	border-radius: 50px !important;
	box-shadow: 0 4px 12px rgba(45, 111, 115, 0.15) !important;
	transition: all 0.25s ease !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	text-decoration: none !important;
}

aside .card-body .btn-warning:hover,
aside .card-body a.btn-warning:hover {
	background-color: var(--primary-turquoise) !important;
	border-color: var(--primary-turquoise) !important;
	transform: translateY(-2px) !important;
	box-shadow: 0 6px 18px rgba(95, 184, 199, 0.25) !important;
}

/* Send message capsule */
aside .card-body .btn-secondary,
aside .card-body a.btn-secondary {
	background-color: rgba(95, 184, 199, 0.08) !important;
	border: 1px solid var(--primary-turquoise) !important;
	color: var(--primary-teal) !important;
	font-family: 'Outfit', sans-serif !important;
	font-weight: 700 !important;
	font-size: 0.95rem !important;
	padding: 12px 20px !important;
	border-radius: 50px !important;
	transition: all 0.25s ease !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	text-decoration: none !important;
}

aside .card-body .btn-secondary:hover,
aside .card-body a.btn-secondary:hover {
	background-color: var(--primary-turquoise) !important;
	border-color: var(--primary-turquoise) !important;
	color: var(--white) !important;
	transform: translateY(-2px) !important;
	box-shadow: 0 6px 18px rgba(95, 184, 199, 0.2) !important;
}

/* WhatsApp block capsule */
aside .card-body .btn-success,
aside .card-body a.btn-success {
	background-color: #25d366 !important;
	border-color: #25d366 !important;
	color: var(--white) !important;
	font-family: 'Outfit', sans-serif !important;
	font-weight: 700 !important;
	font-size: 0.95rem !important;
	padding: 12px 20px !important;
	border-radius: 50px !important;
	box-shadow: 0 4px 12px rgba(37, 211, 102, 0.15) !important;
	transition: all 0.25s ease !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	text-decoration: none !important;
}

aside .card-body .btn-success:hover,
aside .card-body a.btn-success:hover {
	background-color: #20ba5a !important;
	border-color: #20ba5a !important;
	transform: translateY(-2px) !important;
	box-shadow: 0 6px 18px rgba(37, 211, 102, 0.25) !important;
}

/* Banning action outline button */
aside .card-body .btn-outline-danger,
aside .card-body a.btn-outline-danger {
	background-color: transparent !important;
	border: 1px solid rgba(220, 53, 69, 0.3) !important;
	color: #dc3545 !important;
	font-family: 'Outfit', sans-serif !important;
	font-weight: 600 !important;
	font-size: 0.9rem !important;
	padding: 10px 20px !important;
	border-radius: 50px !important;
	transition: all 0.25s ease !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	text-decoration: none !important;
}

aside .card-body .btn-outline-danger:hover,
aside .card-body a.btn-outline-danger:hover {
	background-color: #dc3545 !important;
	border-color: #dc3545 !important;
	color: var(--white) !important;
	transform: translateY(-2px) !important;
	box-shadow: 0 6px 15px rgba(220, 53, 69, 0.2) !important;
}

/* Safety advice checklist */
aside .card-body ul.list-unstyled {
	padding-left: 0 !important;
	margin-bottom: 0 !important;
}

aside .card-body ul.list-unstyled li {
	font-size: 0.85rem !important;
	font-weight: 500 !important;
	color: var(--charcoal-shadow) !important;
	margin-bottom: 12px !important;
	display: flex !important;
	align-items: flex-start !important;
	line-height: 1.45 !important;
}

aside .card-body ul.list-unstyled li i {
	color: var(--primary-turquoise) !important;
	font-weight: 900 !important;
	font-size: 1.1rem !important;
	margin-right: 8px !important;
	flex-shrink: 0 !important;
	margin-top: 1px !important;
}

aside .card-body p {
	margin-top: 15px !important;
	margin-bottom: 0 !important;
}

aside .card-body p a.float-end {
	color: var(--primary-teal) !important;
	font-weight: 600 !important;
	font-size: 0.82rem !important;
	text-decoration: none !important;
	transition: color 0.2s ease !important;
}

aside .card-body p a.float-end:hover {
	color: var(--primary-turquoise) !important;
}

/* ============================================================
   HOME PAGE — PREMIUM LISTINGS & RECENTLY VIEWED OVERHAUL
   ============================================================ */

/* Gap between Categories section and Premium Listings */
#homepage .container:has(.featured-list-slider) {
	margin-top: 48px !important;
}

/* Premium Listings / Recently Viewed — shared card container */
#homepage .card:has(.featured-list-slider) {
	background: var(--white) !important;
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	border-radius: 18px !important;
	box-shadow: 0 8px 28px rgba(45, 111, 115, 0.04) !important;
	padding: 0 !important;
	overflow: hidden !important;
}

/* Card header — Premium Listings / Recently Viewed title row */
#homepage .card:has(.featured-list-slider) .card-header {
	background: transparent !important;
	border-bottom: 1px solid rgba(45, 111, 115, 0.07) !important;
	padding: 20px 28px 18px 28px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
}

#homepage .card:has(.featured-list-slider) .card-header h4 {
	font-size: 1.35rem !important;
	font-weight: 400 !important;
	color: var(--charcoal-shadow) !important;
	font-family: 'Outfit', sans-serif !important;
	margin: 0 !important;
}

#homepage .card:has(.featured-list-slider) .card-header h4 strong,
#homepage .card:has(.featured-list-slider) .card-header h4 .fw-bold {
	color: var(--primary-teal) !important;
	font-weight: 700 !important;
}

#homepage .card:has(.featured-list-slider) .card-header h5 {
	font-size: 0.82rem !important;
	font-weight: 600 !important;
	color: var(--primary-teal) !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
	margin: 0 !important;
}

#homepage .card:has(.featured-list-slider) .card-header h5 a {
	color: var(--primary-teal) !important;
	text-decoration: none !important;
	transition: color 0.2s ease !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
}

#homepage .card:has(.featured-list-slider) .card-header h5 a:hover {
	color: var(--primary-turquoise) !important;
}

/* Card Body padding for carousel */
#homepage .card:has(.featured-list-slider) .card-body {
	padding: 24px 20px 20px 20px !important;
}

/* === Individual Carousel Listing Card ===
   KEY FIX: The blade file sets inline height:320px via PHP variable.
   We override with height:auto + min-height so content flows naturally.
   Also override justify-content-between (which causes price to drop to bottom)
   with flex-start so items stack top-to-bottom cleanly.
*/
#homepage .featured-list-slider .item.card {
	background: var(--white) !important;
	border: 1px solid rgba(45, 111, 115, 0.07) !important;
	border-radius: 14px !important;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.03) !important;
	overflow: hidden !important;
	transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
	margin: 4px !important;
	/* Override PHP inline height:320px */
	height: auto !important;
	min-height: 0 !important;
	/* Override justify-content-between — don't push price to bottom */
	justify-content: flex-start !important;
}

#homepage .featured-list-slider .item.card:hover {
	transform: translateY(-6px) !important;
	box-shadow: 0 14px 32px rgba(45, 111, 115, 0.1) !important;
	border-color: var(--primary-turquoise) !important;
}

/* Thumbnail image inside each carousel card */
#homepage .featured-list-slider .item-carousel-thumb {
	overflow: hidden !important;
	position: relative !important;
	height: 160px !important;
	border-radius: 14px 14px 0 0 !important;
	background: #eef1f3 !important;
	flex-shrink: 0 !important;
}

#homepage .featured-list-slider .item-carousel-thumb img {
	width: 100% !important;
	height: 160px !important;
	object-fit: cover !important;
	transition: transform 0.35s ease !important;
	border-radius: 14px 14px 0 0 !important;
}

#homepage .featured-list-slider .item.card:hover .item-carousel-thumb img {
	transform: scale(1.04) !important;
}

/* Camera count badge overlay */
#homepage .featured-list-slider .item-carousel-thumb .bg-body-secondary {
	background-color: rgba(0, 0, 0, 0.45) !important;
	color: var(--white) !important;
	border-radius: 6px !important;
	font-size: 0.72rem !important;
	padding: 3px 8px !important;
	border: none !important;
}

/* Card body — title + price area: flex-start so no gap between them */
#homepage .featured-list-slider .item.card .card-body {
	padding: 14px 14px 16px 14px !important;
	/* Override justify-content-between inside card-body too */
	justify-content: flex-start !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 0 !important;
}

/* Title in carousel card */
#homepage .featured-list-slider .item.card .card-body h6 {
	font-size: 0.93rem !important;
	font-weight: 600 !important;
	line-height: 1.35 !important;
	color: var(--charcoal-shadow) !important;
	font-family: 'Outfit', sans-serif !important;
	margin-bottom: 8px !important;
	text-align: center !important;
}

#homepage .featured-list-slider .item.card .card-body h6 a {
	color: var(--primary-teal) !important;
	text-decoration: none !important;
	transition: color 0.2s ease !important;
}

#homepage .featured-list-slider .item.card .card-body h6 a:hover {
	color: var(--primary-turquoise) !important;
}

/* Price in carousel card */
#homepage .featured-list-slider .item.card .card-body h4.fs-4 {
	font-size: 1.15rem !important;
	font-weight: 800 !important;
	color: var(--charcoal-shadow) !important;
	font-family: 'Outfit', sans-serif !important;
	text-align: center !important;
	margin-top: 6px !important;
	margin-bottom: 0 !important;
}

/* Carousel navigation dots */
#homepage .tns-nav {
	text-align: center !important;
	margin-top: 14px !important;
}

#homepage .tns-nav button {
	width: 8px !important;
	height: 8px !important;
	border-radius: 50% !important;
	background: var(--stone-gray) !important;
	border: none !important;
	opacity: 0.45 !important;
	margin: 0 4px !important;
	transition: all 0.2s ease !important;
}

#homepage .tns-nav button.tns-nav-active {
	background: var(--primary-teal) !important;
	opacity: 1 !important;
	width: 20px !important;
	border-radius: 4px !important;
}

/* Recently Viewed title "Recently" styling  */
#homepage .card:has(.featured-list-slider) .card-header h4:first-child {
	font-weight: 400 !important;
}

/* Hero Banner image fix — ensure proper fallback on live */
#homepage .hero-wrap,
#homepage .only-search-bar {
	background-image: linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.12)), url('/images/banner.png') !important;
	background-size: cover !important;
	background-position: center center !important;
	background-repeat: no-repeat !important;
}

/* --- PREMIUM USER PANEL OVERRIDES --- */

/* Sidebar Navigation (Active States) */
aside .list-group-item.active,
aside .list-group-item.active a {
	background-color: var(--primary-teal) !important;
	border-color: var(--primary-teal) !important;
	color: var(--white) !important;
}

aside .list-group-item {
	transition: all 0.2s ease !important;
	border: 1px solid rgba(0, 0, 0, 0.03) !important;
}

aside .list-group-item:hover:not(.active) {
	background-color: rgba(45, 111, 115, 0.05) !important;
}

aside .list-group-item:hover:not(.active) a {
	color: var(--primary-teal) !important;
}

/* Tabs & Nav Pills */
.nav-pills .nav-link.active {
	background-color: var(--primary-teal) !important;
	color: var(--white) !important;
}

.nav-pills .nav-link {
	color: var(--charcoal-shadow) !important;
	font-weight: 500 !important;
	transition: all 0.2s ease !important;
}

.nav-pills .nav-link:hover:not(.active) {
	color: var(--primary-teal) !important;
	background-color: rgba(45, 111, 115, 0.05) !important;
}

/* Premium Badges Overrides */
.badge.text-bg-secondary {
	background-color: rgba(42, 42, 42, 0.1) !important;
	color: var(--charcoal-shadow) !important;
	font-weight: 500 !important;
}

.badge.text-bg-warning {
	background-color: rgba(240, 173, 78, 0.15) !important;
	color: #a97705 !important;
	font-weight: 600 !important;
}

.badge.bg-success,
.badge.text-bg-success {
	background-color: rgba(95, 143, 101, 0.15) !important;
	color: var(--botanical-green) !important;
	font-weight: 600 !important;
}

.badge.bg-warning,
.badge.text-bg-warning {
	background-color: rgba(240, 173, 78, 0.15) !important;
	color: #a97705 !important;
	font-weight: 600 !important;
}

.badge.bg-danger,
.badge.text-bg-danger {
	background-color: rgba(220, 53, 69, 0.12) !important;
	color: #dc3545 !important;
	font-weight: 600 !important;
}

.badge.bg-info,
.badge.text-bg-info {
	background-color: rgba(95, 184, 199, 0.15) !important;
	color: var(--primary-teal) !important;
	font-weight: 600 !important;
}

/* Buttons (Outline & Actions) */
.btn-outline-primary {
	border-color: var(--primary-teal) !important;
	color: var(--primary-teal) !important;
	transition: all 0.2s ease !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
	background-color: var(--primary-teal) !important;
	color: var(--white) !important;
	border-color: var(--primary-teal) !important;
}

.btn-outline-success {
	border-color: var(--botanical-green) !important;
	color: var(--botanical-green) !important;
}

.btn-outline-success:hover {
	background-color: var(--botanical-green) !important;
	color: var(--white) !important;
	border-color: var(--botanical-green) !important;
}

.btn-outline-danger {
	border-color: #dc3545 !important;
	color: #dc3545 !important;
}

.btn-outline-danger:hover {
	background-color: #dc3545 !important;
	color: var(--white) !important;
	border-color: #dc3545 !important;
}

/* Pagination Styling */
.pagination .page-item.active .page-link {
	background-color: var(--primary-teal) !important;
	border-color: var(--primary-teal) !important;
	color: var(--white) !important;
}

.pagination .page-link {
	color: var(--primary-teal) !important;
	border-radius: 6px !important;
	margin: 0 2px !important;
	transition: all 0.2s ease !important;
}

.pagination .page-link:hover {
	background-color: rgba(45, 111, 115, 0.08) !important;
	border-color: var(--primary-teal) !important;
}

/* Messenger Chat Details & Bubbles */
.chat-item.object-me .msg {
	background-color: rgba(45, 111, 115, 0.12) !important;
	color: var(--primary-teal) !important;
	border: 1px solid rgba(45, 111, 115, 0.18) !important;
	border-radius: 16px 0 16px 16px !important;
	font-weight: 500 !important;
}

.chat-item.object-user .msg {
	background-color: var(--white) !important;
	color: var(--charcoal-shadow) !important;
	border: 1px solid rgba(0, 0, 0, 0.06) !important;
	border-radius: 0 16px 16px 16px !important;
}

.message-chat #messageChatHistory {
	background-color: #fcfbfa !important;
	border-radius: 12px !important;
	padding: 16px !important;
}

/* Premium Form Control Focus State Overrides */
.form-control:focus,
.form-select:focus {
	border-color: var(--primary-turquoise) !important;
	box-shadow: 0 0 0 0.25rem rgba(95, 184, 199, 0.25) !important;
}

.form-check-input:checked {
	background-color: var(--primary-teal) !important;
	border-color: var(--primary-teal) !important;
}

.form-check-input:focus {
	border-color: var(--primary-turquoise) !important;
	box-shadow: 0 0 0 0.25rem rgba(95, 184, 199, 0.25) !important;
}

/* Global Danger Button Overrides */
.btn-danger,
a.btn-danger,
button.btn-danger {
	background-color: #dc3545 !important;
	border-color: #dc3545 !important;
	color: var(--white) !important;
	font-family: 'Outfit', sans-serif !important;
	font-weight: 600 !important;
	padding: 10px 24px !important;
	border-radius: 50px !important;
	transition: all 0.25s ease !important;
	box-shadow: 0 4px 12px rgba(220, 53, 69, 0.15) !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 6px !important;
}

.btn-danger:hover,
a.btn-danger:hover,
button.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active {
	background-color: #bd2130 !important;
	border-color: #b21f2d !important;
	color: var(--white) !important;
	box-shadow: 0 6px 18px rgba(220, 53, 69, 0.25) !important;
	transform: translateY(-2px) !important;
}

/* Global Compact Small Button Overrides (for tables/action cells) */
.btn-sm,
a.btn-sm,
button.btn-sm,
.btn-group-sm > .btn {
	padding: 6px 14px !important;
	font-size: 0.85rem !important;
	border-radius: 30px !important;
	font-weight: 600 !important;
	height: auto !important;
	box-shadow: none !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 5px !important;
	transform: none !important;
}

.btn-sm:hover,
a.btn-sm:hover,
button.btn-sm:hover {
	transform: translateY(-1px) !important;
}

/* Dropdown Toggle Specific Visibility Corrections */
.btn-outline-primary.dropdown-toggle:hover,
.btn-outline-primary.dropdown-toggle:focus,
.btn-outline-primary.dropdown-toggle:active,
.btn-outline-primary.dropdown-toggle[aria-expanded="true"],
.btn-outline-primary.dropdown-toggle.show {
	color: var(--white) !important;
	background-color: var(--primary-teal) !important;
	border-color: var(--primary-teal) !important;
}

/* Force all text/icons inside dropdown toggle to turn white on active/hover */
.btn-outline-primary.dropdown-toggle:hover *,
.btn-outline-primary.dropdown-toggle:focus *,
.btn-outline-primary.dropdown-toggle:active *,
.btn-outline-primary.dropdown-toggle[aria-expanded="true"] *,
.btn-outline-primary.dropdown-toggle.show * {
	color: var(--white) !important;
}

/* Premium Dropdown Menu inside Tables */
.table-responsive .dropdown-menu {
	border-radius: 12px !important;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08) !important;
	border: 1px solid rgba(0, 0, 0, 0.06) !important;
	padding: 8px 0 !important;
}

/* Premium User Panel Card styling */
.main-container .card {
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	border-radius: 12px !important;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02) !important;
	background-color: var(--white) !important;
	overflow: hidden !important;
	margin-bottom: 20px !important;
}

.main-container .card-header {
	background-color: rgba(45, 111, 115, 0.03) !important;
	border-bottom: 1px solid rgba(45, 111, 115, 0.08) !important;
	padding: 16px 20px !important;
}

.main-container .card-header .card-title,
.main-container .card-header h5 {
	font-weight: 600 !important;
	color: var(--primary-teal) !important;
	font-size: 1.05rem !important;
	margin: 0 !important;
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
}

.main-container .card-body {
	padding: 24px 20px !important;
}

/* Premium Overview Stats Boxes */
.main-container .bg-light-subtle.border {
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	background-color: rgba(45, 111, 115, 0.02) !important;
	border-radius: 12px !important;
	transition: all 0.25s ease !important;
}

.main-container .bg-light-subtle.border:hover {
	transform: translateY(-2px) !important;
	background-color: rgba(45, 111, 115, 0.04) !important;
	box-shadow: 0 6px 16px rgba(45, 111, 115, 0.06) !important;
	border-color: rgba(45, 111, 115, 0.15) !important;
}

.main-container .bg-light-subtle.border a {
	color: var(--primary-teal) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	font-size: 0.95rem !important;
	transition: color 0.2s ease !important;
}

.main-container .bg-light-subtle.border a:hover {
	color: var(--primary-turquoise) !important;
}

/* Stats circle background and icon overrides */
.main-container .bg-primary.rounded-circle {
	background-color: var(--primary-teal) !important;
	transition: all 0.25s ease !important;
}

.main-container .bg-light-subtle.border:hover .bg-primary.rounded-circle {
	background-color: var(--primary-turquoise) !important;
	transform: scale(1.05) !important;
}

.main-container .bg-primary.rounded-circle i {
	color: var(--white) !important;
}

/* Active Stripe Auto-Pay Warning Card */
.main-container .card.border-warning {
	border: 1px solid rgba(240, 173, 78, 0.2) !important;
	background-color: var(--white) !important;
}

.main-container .card.border-warning .card-header.bg-warning {
	background-color: rgba(240, 173, 78, 0.08) !important;
	border-bottom: 1px solid rgba(240, 173, 78, 0.15) !important;
	color: #a97705 !important;
}

/* Form Labels and Hints override */
.main-container form label,
.main-container .form-label,
.main-container .col-form-label {
	font-weight: 600 !important;
	color: var(--charcoal-shadow) !important;
	font-size: 0.92rem !important;
	margin-bottom: 6px !important;
}

.main-container .form-text,
.main-container .hint,
.main-container small.text-muted,
.main-container .text-muted {
	color: var(--stone-gray) !important;
	font-size: 0.82rem !important;
	font-weight: 500 !important;
}

/* Radio buttons and Switch label styling alignment */
.main-container .form-check-label {
	font-weight: 550 !important;
	font-size: 0.9rem !important;
	color: var(--charcoal-shadow) !important;
}

/* Premium Countries List Page OVERHAUL */
.card-countries {
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	border-radius: 16px !important;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02) !important;
	background-color: var(--white) !important;
}

.card-countries .card-title {
	color: var(--primary-teal) !important;
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
}

.card-countries .card-title i {
	color: var(--primary-turquoise) !important;
}

.country-item {
	display: flex !important;
	align-items: center !important;
	padding: 12px 20px !important;
	border-radius: 50px !important;
	background-color: var(--white) !important;
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.01) !important;
	transition: all 0.25s ease-in-out !important;
}

.country-item:hover {
	border-color: var(--primary-turquoise) !important;
	background-color: rgba(95, 184, 199, 0.04) !important;
	transform: translateY(-2px) !important;
	box-shadow: 0 6px 16px rgba(45, 111, 115, 0.08) !important;
}

.country-item img {
	transition: all 0.25s ease !important;
}

.country-item:hover img {
	transform: scale(1.15) !important;
}

.country-item a {
	color: var(--charcoal-shadow) !important;
	font-weight: 600 !important;
	font-size: 0.95rem !important;
	transition: color 0.2s ease !important;
}

.country-item:hover a {
	color: var(--primary-teal) !important;
}

/* Sitemap Category Items and Headers */
.main-container .border.rounded {
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	border-radius: 12px !important;
	background-color: var(--white) !important;
	transition: all 0.25s ease-in-out !important;
}

.main-container .border.rounded:hover {
	border-color: var(--primary-turquoise) !important;
	box-shadow: 0 6px 18px rgba(45, 111, 115, 0.04) !important;
	transform: translateY(-1px) !important;
}

.main-container .bg-body-secondary.rounded {
	background-color: rgba(45, 111, 115, 0.03) !important;
	color: var(--primary-teal) !important;
	border: 1px solid rgba(45, 111, 115, 0.06) !important;
}

.main-container .bg-body-secondary.rounded a {
	color: var(--primary-teal) !important;
	font-weight: 700 !important;
}

.main-container .bg-body-secondary.rounded a:hover {
	color: var(--primary-turquoise) !important;
}

.main-container .bg-body-secondary.rounded i {
	color: var(--primary-teal) !important;
}

/* Sitemap Subcategories list */
.main-container .long-list-home li {
	font-size: 0.88rem !important;
	font-weight: 550 !important;
}

.main-container .long-list-home li i.bi-dash {
	color: var(--primary-turquoise) !important;
}

.main-container .long-list-home a {
	color: var(--charcoal-shadow) !important;
	transition: color 0.2s ease !important;
}

.main-container .long-list-home a:hover {
	color: var(--primary-teal) !important;
}

/* Sitemap Cities Links */
.main-container .col.px-4.py-1 a {
	font-weight: 600 !important;
	font-size: 0.92rem !important;
	color: var(--charcoal-shadow) !important;
	transition: all 0.2s ease !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
}

.main-container .col.px-4.py-1 a::before {
	content: "\f287"; /* Bootstrap bi-dot or geo icon */
	font-family: "bootstrap-icons" !important;
	color: var(--primary-turquoise) !important;
	font-size: 0.85rem !important;
}

.main-container .col.px-4.py-1 a:hover {
	color: var(--primary-teal) !important;
	transform: translateX(2px) !important;
}

/* Premium CMS Pages Override (Anti-Scam, Terms, etc.) */
.cms-page .bg-body-tertiary {
	background-color: var(--white) !important;
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	border-radius: 16px !important;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02) !important;
	padding: 30px 40px !important;
}

@media (max-width: 767.98px) {
	.cms-page .bg-body-tertiary {
		padding: 20px 20px !important;
	}
}

/* Headings in WYSIWYG / Content */
.cms-page .from-wysiwyg h1,
.cms-page .from-wysiwyg h2,
.cms-page .from-wysiwyg h3,
.cms-page .from-wysiwyg h4 {
	color: var(--primary-teal) !important;
	font-weight: 700 !important;
	margin-top: 24px !important;
	margin-bottom: 12px !important;
}

.cms-page .from-wysiwyg p {
	font-size: 0.95rem !important;
	line-height: 1.6 !important;
	color: var(--charcoal-shadow) !important;
	margin-bottom: 16px !important;
}

.cms-page .from-wysiwyg ul,
.cms-page .from-wysiwyg ol {
	padding-left: 20px !important;
	margin-bottom: 16px !important;
}

.cms-page .from-wysiwyg li {
	font-size: 0.95rem !important;
	line-height: 1.6 !important;
	margin-bottom: 8px !important;
	color: var(--charcoal-shadow) !important;
}

/* ==========================================================================
   PREMIUM BUTTON OUTLINE & CATEGORY SELECTION MODAL OVERRIDES
   ========================================================================== */

/* Premium Outlined Button Override to match custom theme */
.btn-outline-primary,
a.btn-outline-primary,
button.btn-outline-primary {
	border: 1.5px solid var(--primary-teal) !important;
	color: var(--primary-teal) !important;
	background: transparent !important;
	font-family: 'Outfit', sans-serif !important;
	font-weight: 600 !important;
	padding: 10px 24px !important;
	border-radius: 50px !important;
	transition: all 0.25s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
}

.btn-outline-primary:hover,
a.btn-outline-primary:hover,
button.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
	background-color: var(--primary-teal) !important;
	border-color: var(--primary-teal) !important;
	color: var(--white) !important;
	box-shadow: 0 6px 15px rgba(45, 111, 115, 0.15) !important;
	transform: translateY(-2px) !important;
}

/* Premium Styling for Category Selection Modal Items */
#browseCategories #modalCategoryList .col > div {
	background-color: var(--white) !important;
	border: 1.5px solid rgba(45, 111, 115, 0.08) !important;
	border-radius: 16px !important;
	box-shadow: 0 4px 10px rgba(45, 111, 115, 0.02) !important;
	transition: all 0.25s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
}

#browseCategories #modalCategoryList .col > div:hover {
	border-color: var(--primary-turquoise) !important;
	box-shadow: 0 8px 20px rgba(45, 111, 115, 0.08) !important;
	transform: translateY(-3px) !important;
}

/* Category Icons inside Modal */
#browseCategories #modalCategoryList .col > div i {
	color: var(--primary-teal) !important;
	transition: all 0.25s ease !important;
}

#browseCategories #modalCategoryList .col > div:hover i {
	color: var(--primary-turquoise) !important;
	transform: scale(1.1) !important;
}

/* Category Link and Text inside Modal */
#browseCategories .modal-cat-link:not(.btn) {
	color: var(--primary-teal) !important;
	text-decoration: none !important;
	transition: all 0.25s ease !important;
}

#browseCategories .modal-cat-link:not(.btn) h6 {
	color: var(--charcoal-shadow) !important;
	font-weight: 600 !important;
	transition: all 0.25s ease !important;
}

#browseCategories .modal-cat-link:not(.btn):hover h6,
#browseCategories .modal-cat-link:not(.btn):focus h6 {
	color: var(--primary-turquoise) !important;
}

/* Modal Header styling */
#browseCategories .modal-header i {
	color: var(--primary-teal) !important;
}

/* Pagination inside Category Selection Modal */
#browseCategories .page-item.active .page-link,
#browseCategories .page-link.active {
	background-color: var(--primary-teal) !important;
	border-color: var(--primary-teal) !important;
	color: var(--white) !important;
}

#browseCategories .page-link {
	color: var(--primary-teal) !important;
	border-radius: 6px !important;
	margin: 0 3px !important;
	transition: all 0.2s ease !important;
}

#browseCategories .page-link:hover {
	background-color: rgba(95, 184, 199, 0.1) !important;
	color: var(--primary-turquoise) !important;
	border-color: var(--primary-turquoise) !important;
}

/* --- SPLIT HERO SECTION STYLING --- */
.split-city-card {
	background-color: #ffffff !important;
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	box-shadow: 0 12px 30px rgba(45, 111, 115, 0.04) !important;
	transition: all 0.3s ease !important;
}

.split-city-card:hover {
	box-shadow: 0 18px 40px rgba(45, 111, 115, 0.07) !important;
}

.city-list-item {
	background-color: rgba(95, 184, 199, 0.03) !important;
	border: 1px solid rgba(95, 184, 199, 0.06) !important;
	transition: all 0.25s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
}

.city-list-item:hover {
	background-color: rgba(95, 184, 199, 0.09) !important;
	border-color: rgba(95, 184, 199, 0.2) !important;
	transform: translateX(4px) !important;
}

.city-list-item .city-name {
	color: var(--charcoal-shadow) !important;
	font-size: 0.95rem !important;
	transition: color 0.2s ease !important;
}

.city-list-item:hover .city-name {
	color: var(--primary-teal) !important;
	font-weight: 600 !important;
}

.city-list-item .badge {
	font-size: 0.8rem !important;
	background-color: rgba(45, 111, 115, 0.05) !important;
	color: var(--primary-teal) !important;
	border: 1px solid rgba(45, 111, 115, 0.15) !important;
	transition: all 0.25s ease !important;
}

.city-list-item:hover .badge {
	background-color: var(--primary-teal) !important;
	color: #ffffff !important;
	border-color: var(--primary-teal) !important;
}

.hover-teal-dark:hover {
	color: var(--primary-turquoise) !important;
	text-decoration: underline !important;
}

/* Premium Split Slider */
.split-slider-container {
	border: 1px solid rgba(45, 111, 115, 0.08) !important;
	background: #000;
	position: relative;
	min-height: 250px;
}

/* Responsive height for the slider column */
.split-hero-slider-col {
	max-height: 250px;
}

@media (max-width: 991.98px) {
	.split-hero-slider-col {
		max-height: 220px;
	}
}

@media (max-width: 767.98px) {
	.split-hero-slider-col {
		max-height: none !important;
		height: 200px !important;
	}
	.split-slider-container {
		min-height: 200px !important;
		height: 200px !important;
	}
}

.split-slide-bg {
	transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

.split-slide-overlay {
	background: linear-gradient(to top, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 60%) !important;
}

.carousel-item-next,
.carousel-item-prev,
.carousel-item.active {
	display: block;
}

/* Rounded carousel custom indicator dots */
.custom-indicators button {
	width: 8px !important;
	height: 8px !important;
	border-radius: 50% !important;
	background-color: rgba(255, 255, 255, 0.6) !important;
	border: none !important;
	margin: 0 4px !important;
	opacity: 0.6 !important;
	transition: all 0.3s ease !important;
}

.custom-indicators button.active {
	width: 24px !important;
	border-radius: 10px !important;
	background-color: #ffffff !important;
	opacity: 1 !important;
}

/* Sleek carousel control arrows */
.custom-control {
	width: 45px !important;
	height: 45px !important;
	background: rgba(255, 255, 255, 0.85) !important;
	backdrop-filter: blur(8px) !important;
	-webkit-backdrop-filter: blur(8px) !important;
	border-radius: 50% !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	opacity: 0 !important;
	transition: all 0.3s ease !important;
	box-shadow: 0 4px 15px rgba(0,0,0,0.1) !important;
}

.split-slider-container:hover .custom-control {
	opacity: 1 !important;
}

.custom-control.carousel-control-prev {
	left: 20px !important;
}

.custom-control.carousel-control-next {
	right: 20px !important;
}

.custom-control:hover {
	background: #ffffff !important;
	transform: translateY(-50%) scale(1.08) !important;
}

.custom-control span {
	filter: invert(34%) sepia(29%) saturate(885%) hue-rotate(134deg) brightness(91%) contrast(85%); /* Recolor standard BS arrows to teal */
	width: 1.5rem !important;
	height: 1.5rem !important;
}

/* Fallback Slide Layout */
.fallback-slide {
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 400px;
}

@media (min-width: 768px) and (max-width: 991.98px) {
	.split-slider-container {
		min-height: 300px;
	}
	.fallback-slide {
		min-height: 300px;
	}
}

/* =============================================================================
   MOBILE RESPONSIVE FIXES - Horizontal Scroll Prevention
   ============================================================================= */

/* ---- Fix Bootstrap row negative margins that bleed outside viewport ---- */
@media (max-width: 767.98px) {

	/* =========================================================
	   CRITICAL OVERRIDES - Override rules from 991.98px block
	   ========================================================= */

	/* Allow glassy search card to display completely without cutting off on mobile */
	.hero-wrap,
	.hero-wrap.overflow-hidden {
		height: auto !important;
		min-height: unset !important;
		overflow: visible !important;
		margin-bottom: 20px !important;
		padding-bottom: 30px !important;
	}

	/* Fix search-main-card width overflow on mobile */
	.search-main-card {
		max-width: 100% !important;
		width: 100% !important;
		padding: 10px 10px !important;
		border-radius: 16px !important;
		box-sizing: border-box !important;
		margin: 0 !important;
	}

	/* Fix hero-categories-wrap - override the -30px margin set in <=991px */
	.hero-categories-wrap {
		margin-bottom: 0 !important;
		margin-top: 20px !important;
	}

	/* Show only 3 categories + the More card (which becomes the 4th card) in a clean 2x2 grid on mobile */
	.hero-categories-wrap .row > div:nth-child(4),
	.hero-categories-wrap .row > div:nth-child(5),
	.hero-categories-wrap .row > div:nth-child(6) {
		display: none !important;
	}

	/* Footer: fix the container-fluid overflow and social tiles */
	footer {
		overflow-x: hidden !important;
		width: 100% !important;
		max-width: 100% !important;
	}

	footer .container-fluid {
		background-image: none !important; /* Remove stretched wavy SVG on mobile for pixel-perfect clarity */
		background-color: #f6fcfd !important;
		border-top: 1px solid rgba(45, 111, 115, 0.08) !important;
		padding-top: 40px !important;
		padding-bottom: 35px !important;
		border-radius: 24px 24px 0 0 !important; /* Premium curved top on mobile */
		padding-left: 16px !important;
		padding-right: 16px !important;
		max-width: 100% !important;
		overflow-x: hidden !important;
	}

	footer .container {
		padding-left: 16px !important;
		padding-right: 16px !important;
		max-width: 100% !important;
		overflow-x: hidden !important;
	}

	footer .row {
		margin-left: 0 !important;
		margin-right: 0 !important;
		width: 100% !important;
	}

	footer .row > * {
		padding-left: 8px !important;
		padding-right: 8px !important;
	}

	/* Footer columns - 1 per row on mobile */
	footer .row.row-cols-sm-2 > .col,
	footer .row > .col {
		flex: 0 0 100% !important;
		max-width: 100% !important;
		width: 100% !important;
	}

	/* Social tiles - wrap properly and style as premium perfect circles */
	.follow-us-tiles {
		display: flex !important;
		flex-wrap: wrap !important;
		gap: 10px !important;
		justify-content: flex-start !important;
		margin-top: 12px !important;
	}

	.follow-us-tiles a {
		width: 42px !important;
		height: 42px !important;
		border-radius: 50% !important; /* Perfect circles on mobile */
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		font-size: 1.2rem !important;
	}

	footer h4 {
		margin-top: 24px !important;
		margin-bottom: 16px !important;
		font-size: 1.1rem !important;
		border-bottom: 1.5px solid rgba(45, 111, 115, 0.08) !important;
		padding-bottom: 8px !important;
		letter-spacing: 0.5px !important;
	}

	footer ul li {
		margin-bottom: 10px !important;
	}

	/* Fix: Bootstrap rows with gutters use negative margins — neutralise them */
	.row {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	/* But preserve column gap spacing via padding instead */
	.row > * {
		padding-left: 8px !important;
		padding-right: 8px !important;
	}

	/* Containers: ensure all are bounded to viewport */
	.container,
	.container-fluid,
	.container-sm,
	.container-md {
		padding-left: 12px !important;
		padding-right: 12px !important;
		max-width: 100% !important;
		overflow-x: hidden !important;
	}

	/* Main page container */
	.main-container,
	#homepage {
		max-width: 100% !important;
		overflow-x: hidden !important;
	}

	/* =========================================================
	   HERO SECTION
	   ========================================================= */
	.hero-wrap,
	.hero-wrap.overflow-hidden,
	.only-search-bar {
		width: 100% !important;
		max-width: 100% !important;
		height: auto !important;
		min-height: unset !important;
		padding: 24px 0 60px 0 !important;
		overflow: visible !important;
	}

	/* Prevent any scrollbars or restricted heights inside mobile search box */
	.search-main-card,
	#searchForm,
	.search-row {
		height: auto !important;
		max-height: none !important;
		overflow: visible !important;
	}

	.hero-wrap .container {
		max-width: 100% !important;
		padding-left: 16px !important;
		padding-right: 16px !important;
	}

	#homepage .hero-wrap h1 {
		font-size: 1.75rem !important;
		max-width: 100% !important;
		line-height: 1.2 !important;
		margin-bottom: 6px !important;
	}

	#homepage .hero-wrap h5 {
		font-size: 0.9rem !important;
		max-width: 100% !important;
		margin-bottom: 10px !important;
	}

	/* =========================================================
	   SEARCH ROW (pill search bar)
	   ========================================================= */
	#homepage .search-row {
		display: flex !important;
		flex-direction: column !important;
		align-items: stretch !important;
		gap: 0 !important;
		border-radius: 16px !important;
		padding: 10px 12px !important;
		max-width: 100% !important;
		width: 100% !important;
		margin: 0 !important;
		box-sizing: border-box !important;
	}

	#homepage .search-col {
		width: 100% !important;
		flex: 0 0 100% !important;
		max-width: 100% !important;
	}

	#homepage .search-col > div {
		border-right: none !important;
		padding: 4px 0 !important;
	}

	#homepage .search-col:not(:last-child) > div {
		border-right: none !important;
		border-bottom: 1px solid var(--mist-gray) !important;
		padding-bottom: 8px !important;
		margin-bottom: 4px !important;
	}

	#homepage .search-col input,
	#homepage .search-col select {
		height: auto !important;
		min-height: 38px !important;
		width: 100% !important;
	}

	/* Find button on mobile */
	#homepage .search-row button.btn-search-premium,
	#homepage .search-row .search-col:last-child {
		border-radius: 12px !important;
		width: 100% !important;
		height: auto !important;
		min-height: 42px !important;
		padding: 10px 20px !important;
		margin-top: 4px !important;
		border-top-left-radius: 12px !important;
		border-top-right-radius: 12px !important;
		border-bottom-left-radius: 12px !important;
		border-bottom-right-radius: 12px !important;
	}

	/* =========================================================
	   STATS GLASS BAR
	   ========================================================= */
	.stats-glass-bar {
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: wrap !important;
		justify-content: flex-start !important;
		align-items: center !important;
		gap: 6px 12px !important;
		padding: 8px 10px !important;
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box !important;
	}

	.stats-glass-bar .stat-item {
		flex: 0 0 auto !important;
		width: auto !important;
		font-size: 0.78rem !important;
	}

	/* =========================================================
	   HERO CATEGORIES (floating category cards below hero)
	   ========================================================= */
	.hero-categories-wrap {
		position: static !important;
		bottom: auto !important;
		left: auto !important;
		right: auto !important;
		margin-top: 16px !important;
		margin-bottom: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
		overflow: hidden !important;
	}

	.hero-categories-wrap .container {
		padding-left: 6px !important;
		padding-right: 6px !important;
		max-width: 100% !important;
	}

	.hero-categories-wrap .row {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.hero-categories-wrap .row > * {
		padding-left: 4px !important;
		padding-right: 4px !important;
	}

	/* 2-column layout for category cards on mobile */
	.col-lg-1-7,
	.hero-categories-wrap .col-sm-4,
	.hero-categories-wrap .col-6 {
		flex: 0 0 50% !important;
		max-width: 50% !important;
	}

	.hero-cat-card {
		padding: 12px 6px !important;
		margin-bottom: 6px !important;
		border-radius: 12px !important;
	}

	.hero-cat-icon-wrap {
		width: 44px !important;
		height: 44px !important;
		margin-bottom: 8px !important;
	}

	.hero-cat-icon-wrap i {
		font-size: 1.2rem !important;
	}

	.hero-cat-title {
		font-size: 0.78rem !important;
		margin-bottom: 1px !important;
	}

	.hero-cat-count {
		font-size: 0.68rem !important;
	}

	/* =========================================================
	   SPLIT HERO SECTION (city card + banner slider)
	   ========================================================= */
	#homepage .container.my-4 {
		padding-left: 10px !important;
		padding-right: 10px !important;
	}

	#homepage .container.my-4 > .row {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	#homepage .container.my-4 > .row > * {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.split-hero-slider-col {
		max-height: none !important;
		height: 180px !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.split-slider-container {
		min-height: 180px !important;
		height: 180px !important;
		max-width: 100% !important;
		border-radius: 12px !important;
	}

	/* =========================================================
	   HOW IT WORKS SECTION
	   ========================================================= */
	#homepage .container.my-5 {
		padding-left: 12px !important;
		padding-right: 12px !important;
	}

	.how-it-works-flow {
		flex-direction: column !important;
		gap: 10px !important;
	}

	.step-item {
		width: 100% !important;
		flex: 0 0 100% !important;
		padding: 12px 14px !important;
		background: rgba(45, 111, 115, 0.02) !important;
		border: 1px solid rgba(45, 111, 115, 0.06) !important;
		border-radius: 12px !important;
	}

	.step-connector {
		display: none !important;
	}

	/* =========================================================
	   GRID LISTING CARDS (Latest Listings / Spotlight)
	   ========================================================= */

	/* Fix: The main container for Latest Listings section */
	#homepage .card:has(.grid-view) {
		margin-left: 0 !important;
		margin-right: 0 !important;
		width: 100% !important;
	}

	/* Fix row negative margins on grid view */
	.grid-view.row {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	/* KEY FIX: Remove the margin:10px on listing inner card divs that causes 20px overflow per pair */
	.grid-view .item-list > div {
		margin: 2px 0 !important;
	}

	/* Also target the actual rendered structure from grid.blade.php */
	.grid-view .col.item-list .h-100.w-100.border.rounded.p-2 {
		margin: 0 !important;
	}

	.grid-view .col.item-list {
		padding-left: 4px !important;
		padding-right: 4px !important;
	}

	/* Reduce image height in listing cards on mobile */
	.grid-view .item-list .main-image img {
		height: 130px !important;
	}

	/* Reduce listing card price/bottom area padding on mobile */
	.grid-view .item-list .listing-bottom-container .d-flex {
		padding: 6px 10px 10px 10px !important;
	}

	/* Fix: Stats pill bar (Active Listings bar) */
	#homepage .card:has(.counter),
	#homepage .card.bg-body-tertiary {
		padding: 10px 14px !important;
		margin-top: 10px !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		max-width: 100% !important;
		border-radius: 16px !important;
	}

	/* Fix: Location card (Choose a City / Browse Locations section) */
	#homepage .location-card,
	#homepage > .location-card,
	.location-card,
	#homepage .location-card.container {
		max-width: 100% !important;
		width: 100% !important;
		margin-top: 20px !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		padding-left: 12px !important;
		padding-right: 12px !important;
	}

	/* =========================================================
	   SECTION HEADERS (Latest Listings, How It Works titles)
	   ========================================================= */
	#homepage .card:has(.grid-view) .card-header h4,
	#homepage .card:has(.big-icon-category-list) .card-header h4 {
		font-size: 1.35rem !important;
	}

	/* =========================================================
	   FOOTER
	   ========================================================= */
	footer .row {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}
}

/* ---- Very small phones (<= 480px) ---- */
@media (max-width: 480px) {
	#homepage .hero-wrap h1 {
		font-size: 1.5rem !important;
	}

	#homepage .hero-wrap h5 {
		font-size: 0.85rem !important;
	}

	.hero-cat-card {
		padding: 10px 4px !important;
	}

	.hero-cat-icon-wrap {
		width: 38px !important;
		height: 38px !important;
	}

	.hero-cat-icon-wrap i {
		font-size: 1rem !important;
	}

	.hero-cat-title {
		font-size: 0.72rem !important;
	}

	.split-hero-slider-col,
	.split-slider-container {
		height: 160px !important;
		min-height: 160px !important;
	}

	.stats-glass-bar .stat-item {
		font-size: 0.72rem !important;
	}

	.stats-glass-bar .stat-item strong {
		font-size: 0.78rem !important;
	}
}

/* ---- Single Column Mobile Adapter for Listings Grid (< 576px) ---- */
@media (max-width: 575.98px) {
	.grid-view .item-list {
		padding-left: 10px !important;
		padding-right: 10px !important;
		width: 100% !important;
		flex: 0 0 100% !important;
		max-width: 100% !important;
	}
	
	.grid-view .item-list > div,
	.grid-view .col.item-list .h-100.w-100.border.rounded.p-2 {
		margin: 8px 0 !important;
		border-radius: 16px !important;
	}
	
	.grid-view .item-list .main-image img {
		height: 200px !important; /* Premium tall image for single-column cards */
		object-fit: cover !important;
		border-radius: 12px 12px 0 0 !important;
	}
	
	.grid-view .item-list h5.fs-5 {
		height: auto !important; /* dynamic height to avoid cropping titles */
		font-size: 1.05rem !important;
		line-height: 1.4 !important;
		padding: 0 4px !important;
		margin-bottom: 10px !important;
	}
	
	.grid-view .item-list .list-inline {
		padding: 0 4px !important;
		gap: 6px 12px !important;
	}

	.grid-view .item-list .list-inline-item {
		font-size: 0.8rem !important;
	}

	.grid-view .item-list h5.fs-4 {
		font-size: 1.25rem !important;
		padding: 0 4px !important;
	}
}

/* =========================================================
   STRICT RESPONSIVE OVERRIDES TO PREVENT SCROLLING & CLIPPING
   ========================================================= */
@media (max-width: 991.98px) {
	/* Override dynamic inline margin-top gaps on mobile viewports */
	#homepage, 
	.main-container,
	main {
		margin-top: 0px !important;
	}

	/* Push dashboard/sidebar contents down below fixed mobile headers */
	.main-container:not(#homepage) {
		padding-top: 80px !important;
	}

	/* Override height & overflow constraints on mobile hero section to prevent squishing and scrollbars */
	#homepage .hero-wrap,
	.hero-wrap,
	#homepage .hero-wrap:not(.only-search-bar) {
		height: auto !important;
		min-height: unset !important;
		max-height: none !important;
		overflow: visible !important;
		padding-bottom: 40px !important;
	}

	/* Override any inline max-height constraints to prevent vertical squishing & scrollbars */
	.search-main-card,
	#searchForm,
	.search-row,
	.search-col,
	.search-col > div,
	.search-col input,
	.search-col select,
	.search-col button,
	.hstack {
		height: auto !important;
		max-height: none !important;
		min-height: unset !important;
		overflow: visible !important;
	}

	#homepage .search-col input,
	#homepage .search-col select,
	.search-col input,
	.search-col select {
		height: 48px !important;
		min-height: 48px !important;
		padding: 10px 12px !important;
	}

	/* Prevent categories from cutting off on responsive viewports */
	.hero-categories-wrap {
		position: static !important;
		display: block !important;
		height: auto !important;
		min-height: unset !important;
		max-height: none !important;
		overflow: visible !important;
		margin-top: 25px !important;
		margin-bottom: 25px !important;
		padding-bottom: 20px !important;
	}

	.hero-categories-wrap .container,
	.hero-categories-wrap .row {
		height: auto !important;
		min-height: unset !important;
		max-height: none !important;
		overflow: visible !important;
	}

	.hero-categories-wrap .row > * {
		flex: 0 0 50% !important;
		max-width: 50% !important;
		display: block !important;
		height: auto !important;
	}

	.hero-cat-card {
		height: auto !important;
		min-height: 110px !important;
		display: flex !important;
		flex-direction: column !important;
		align-items: center !important;
		justify-content: center !important;
		overflow: visible !important;
	}

	/* Prevent circular buttons from overlapping on responsive views when they contain words like Previous/Next */
	.main-container .pagination .page-item .page-link,
	.pagination .page-link {
		width: auto !important;
		min-width: 40px !important;
		height: 40px !important;
		padding: 0 16px !important;
		border-radius: 30px !important;
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		white-space: nowrap !important;
	}

	/* Prevent horizontal sideways scroll on /account/posts/list page */
	.table-action {
		flex-direction: column !important;
		align-items: stretch !important;
		gap: 12px !important;
		padding: 12px !important;
	}
	
	.table-action > div {
		width: 100% !important;
		max-width: 100% !important;
	}
	
	.table-action .table-search {
		width: 100% !important;
		margin-top: 4px !important;
	}

	.table-action .table-search .row {
		margin-left: 0 !important;
		margin-right: 0 !important;
		align-items: center !important;
	}

	.table-action .table-search label {
		text-align: left !important;
		padding-left: 0 !important;
		margin-bottom: 6px !important;
		flex: 0 0 100% !important;
		max-width: 100% !important;
	}

	.table-action .table-search div.col-7 {
		flex: 0 0 100% !important;
		max-width: 100% !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.table-responsive {
		width: 100% !important;
		max-width: 100% !important;
		overflow-x: auto !important;
		-webkit-overflow-scrolling: touch !important;
		border: none !important;
	}

	/* Reset layout boundaries */
	.main-container .container,
	.main-container .row,
	.main-container .col-md-9 {
		max-width: 100% !important;
		overflow-x: hidden !important;
	}

	/* Strict viewport safety reset to completely kill minor horizontal scroll / side-wiggle */
	html, body, #wrapper, .main-container, main, #homepage, .wrapper {
		overflow-x: hidden !important;
		width: 100% !important;
		max-width: 100% !important;
		position: relative !important;
	}

	.row {
		margin-left: 0 !important;
		margin-right: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
	}

	/* Transform Account Post List Table into Beautiful Stacked Cards on Mobile */
	@media (max-width: 767.98px) {
		#addManageTable, 
		#addManageTable thead, 
		#addManageTable tbody, 
		#addManageTable th, 
		#addManageTable td, 
		#addManageTable tr {
			display: block !important;
			width: 100% !important;
		}
		
		#addManageTable thead {
			display: none !important; /* Hide column headers on mobile */
		}
		
		#addManageTable tr {
			margin-bottom: 20px !important;
			background-color: var(--white) !important;
			border: 1px solid rgba(45, 111, 115, 0.1) !important;
			border-radius: 16px !important;
			padding: 16px !important;
			box-shadow: 0 8px 20px rgba(0, 0, 0, 0.03) !important;
			position: relative !important;
			overflow: visible !important;
		}
		
		#addManageTable td {
			border: none !important;
			padding: 6px 0 !important;
			text-align: left !important;
		}
		
		#addManageTable td.add-img-selector {
			position: absolute !important;
			top: 16px !important;
			left: 16px !important;
			width: auto !important;
			z-index: 10 !important;
		}

		#addManageTable td.add-img-selector input[type="checkbox"] {
			transform: scale(1.2) !important;
			cursor: pointer;
		}
		
		#addManageTable td.add-img-td {
			width: 100% !important;
			display: flex !important;
			justify-content: center !important;
			margin-bottom: 12px !important;
			padding-left: 30px !important; /* Spacing for checkbox */
		}
		
		#addManageTable td.add-img-td img {
			max-height: 140px !important;
			width: auto !important;
			object-fit: cover !important;
			border-radius: 12px !important;
			border: 1px solid rgba(0, 0, 0, 0.05) !important;
		}
		
		#addManageTable td.items-details-td {
			padding-left: 0 !important;
			padding-right: 0 !important;
			margin-bottom: 12px !important;
		}

		#addManageTable td.items-details-td a {
			font-size: 1.1rem !important;
			line-height: 1.3 !important;
			display: block;
			margin-bottom: 8px !important;
		}
		
		#addManageTable td.price-td {
			display: block !important;
			font-size: 1.15rem !important;
			color: var(--primary-teal) !important;
			font-weight: 700 !important;
			margin-bottom: 12px !important;
		}
		
		#addManageTable td.action-td {
			width: 100% !important;
			display: flex !important;
			justify-content: stretch !important;
			border-top: 1px solid rgba(0, 0, 0, 0.06) !important;
			padding-top: 14px !important;
			margin-top: 6px !important;
		}

		#addManageTable td.action-td > div,
		#addManageTable td.action-td .btn-group {
			width: 100% !important;
		}

		#addManageTable td.action-td .btn-group button.dropdown-toggle {
			width: 100% !important;
			display: flex !important;
			align-items: center !important;
			justify-content: center !important;
			font-weight: 600 !important;
			border-radius: 50px !important;
			padding: 8px 16px !important;
		}
	}

	/* Banners Table & Price Alerts Table CSS Card Transformations on Mobile (< 768px) */
	@media (max-width: 767.98px) {
		/* Banners Table Card Transformation */
		.page-content table.table-bordered,
		.page-content table.table-bordered thead,
		.page-content table.table-bordered tbody,
		.page-content table.table-bordered tr,
		.page-content table.table-bordered td {
			display: block !important;
			width: 100% !important;
		}
		
		.page-content table.table-bordered thead {
			display: none !important;
		}
		
		.page-content table.table-bordered tr {
			margin-bottom: 20px !important;
			background-color: var(--white) !important;
			border: 1px solid rgba(45, 111, 115, 0.1) !important;
			border-radius: 16px !important;
			padding: 16px !important;
			box-shadow: 0 8px 20px rgba(0, 0, 0, 0.03) !important;
			position: relative !important;
		}
		
		.page-content table.table-bordered td {
			border: none !important;
			padding: 8px 0 !important;
			text-align: left !important;
			display: flex !important;
			flex-wrap: wrap !important;
			align-items: center !important;
			gap: 8px !important;
		}

		/* Add descriptive labels before column content in mobile card layout */
		.page-content table.table-bordered td::before {
			font-weight: 700 !important;
			color: var(--primary-teal) !important;
			width: 130px !important;
			display: inline-block !important;
			flex-shrink: 0 !important;
		}
		
		.page-content table.table-bordered td:nth-child(1)::before { content: "Plan:"; }
		.page-content table.table-bordered td:nth-child(2)::before { content: "Type:"; }
		.page-content table.table-bordered td:nth-child(3)::before { content: "Placement:"; }
		.page-content table.table-bordered td:nth-child(4)::before { content: "Banner:"; }
		.page-content table.table-bordered td:nth-child(5)::before { content: "Status:"; }
		.page-content table.table-bordered td:nth-child(6)::before { content: "Action:"; }

		.page-content table.table-bordered td img.img-thumbnail {
			max-width: 120px !important;
			height: auto !important;
			display: inline-block !important;
		}

		/* Price Alerts Table Card Transformation */
		.col-md-9 table.table-striped:not(#addManageTable),
		.col-md-9 table.table-striped:not(#addManageTable) thead,
		.col-md-9 table.table-striped:not(#addManageTable) tbody,
		.col-md-9 table.table-striped:not(#addManageTable) tr,
		.col-md-9 table.table-striped:not(#addManageTable) td {
			display: block !important;
			width: 100% !important;
		}
		
		.col-md-9 table.table-striped:not(#addManageTable) thead {
			display: none !important;
		}
		
		.col-md-9 table.table-striped:not(#addManageTable) tr {
			margin-bottom: 20px !important;
			background-color: var(--white) !important;
			border: 1px solid rgba(45, 111, 115, 0.1) !important;
			border-radius: 16px !important;
			padding: 16px !important;
			box-shadow: 0 8px 20px rgba(0, 0, 0, 0.03) !important;
			position: relative !important;
		}
		
		.col-md-9 table.table-striped:not(#addManageTable) td {
			border: none !important;
			padding: 8px 0 !important;
			text-align: left !important;
			display: flex !important;
			flex-wrap: wrap !important;
			align-items: center !important;
			gap: 8px !important;
		}

		/* Add descriptive labels before column content in mobile card layout */
		.col-md-9 table.table-striped:not(#addManageTable) td::before {
			font-weight: 700 !important;
			color: var(--primary-teal) !important;
			width: 130px !important;
			display: inline-block !important;
			flex-shrink: 0 !important;
		}
		
		.col-md-9 table.table-striped:not(#addManageTable) td:nth-child(1)::before { content: "Listing:"; }
		.col-md-9 table.table-striped:not(#addManageTable) td:nth-child(2)::before { content: "Price Change:"; }
		.col-md-9 table.table-striped:not(#addManageTable) td:nth-child(3)::before { content: "Date:"; }
		.col-md-9 table.table-striped:not(#addManageTable) td:nth-child(4)::before { content: "Action:"; }
	}

	/* Account Overview Page Responsive Styling Modifications (< 768px) */
	@media (max-width: 767.98px) {
		.overview-listing-item .row {
			display: flex !important;
			flex-direction: column !important;
			align-items: stretch !important;
			gap: 10px !important;
		}
		
		.overview-listing-item .col-auto,
		.overview-listing-item .col,
		.overview-listing-item .col-md-2 {
			width: 100% !important;
			max-width: 100% !important;
			text-align: left !important;
			padding-left: 0 !important;
			padding-right: 0 !important;
		}

		.overview-listing-item .col-auto:first-child {
			display: flex !important;
			justify-content: center !important;
			margin-bottom: 8px !important;
		}
		
		.overview-listing-item img {
			width: 90px !important;
			height: 90px !important;
			object-fit: cover !important;
			border-radius: 8px !important;
		}
		
		.overview-listing-item .col-md-2 {
			margin-top: 4px !important;
			margin-bottom: 4px !important;
		}

		.overview-listing-item .col-md-2 span {
			font-size: 1.15rem !important;
			display: inline-block;
		}
		
		.overview-listing-item .col-auto:last-child {
			border-top: 1px solid rgba(0, 0, 0, 0.06) !important;
			padding-top: 12px !important;
			margin-top: 4px !important;
		}

		.overview-listing-item .col-auto:last-child .btn-group {
			width: 100% !important;
		}

		.overview-listing-item .col-auto:last-child .btn-group button {
			width: 100% !important;
			display: flex !important;
			align-items: center !important;
			justify-content: center !important;
			font-weight: 600 !important;
			padding: 8px 16px !important;
			border-radius: 50px !important;
		}
	}

	@media (max-width: 575.98px) {
		/* Make dashboard overview stats full width on very small screens to prevent label clipping */
		.card:has(.border.rounded.bg-light-subtle) .row.g-3 > .col-6 {
			width: 100% !important;
			flex: 0 0 100% !important;
			max-width: 100% !important;
		}
		}
	}

	/* Profile Page & Form Inputs Overrides on Mobile (< 768px) */
	@media (max-width: 767.98px) {
		.main-container form[name="details"],
		.page-content form,
		.col-md-9 form {
			width: 100% !important;
			max-width: 100% !important;
		}

		/* Reset input groups to wrap properly and fit inside the viewport */
		.input-group,
		.iti,
		.intl-tel-input {
			width: 100% !important;
			max-width: 100% !important;
			display: flex !important;
		}

		/* Ensure the upload avatar container fits screen width */
		.kv-avatar,
		.file-input,
		.file-preview {
			max-width: 100% !important;
			width: 100% !important;
			box-sizing: border-box !important;
		}

		/* Smooth padding inside the profile card container */
		.col-md-9 .container.border.rounded {
			padding: 16px !important;
		}

		/* Force nested columns inside user settings forms to stretch fully to screen edges */
		.main-container form .col-xl-7,
		.main-container form .col-lg-8,
		.main-container form .col-md-10,
		.main-container form .col-sm-12 {
			width: 100% !important;
			max-width: 100% !important;
			flex: 0 0 100% !important;
			padding-left: 0 !important;
			padding-right: 0 !important;
		}
	}
}



