@import url("https://fonts.googleapis.com/css?family=Exo:100,200,300,400,500,600,700");
@import url("https://fonts.googleapis.com/css?family=Poppins:100,200,300,400,500,600,700");
@import url(classy-nav.css);

:root{

    --brand: #D4AF37;          
   /* --sub: #1E3A8A;             */
    --sub: #002D23;         
    --accent: #F4F1E8;         
    --heading: #111827;        
    --body: #6B7280;          
    --bg: #F8F8F6;            
    --card: #FFFFFF;
    --border: rgba(17,24,39,.08);
    --shadow: 0 15px 45px rgba(0,0,0,.12);
}

html,
body {
	font-family: "Poppins", sans-serif;
	-webkit-font-smoothing: antialiased;
  /* overflow: hidden; */
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0;
	color: #111111;
	font-weight: 400;
	font-family: "Exo", sans-serif;
}

h1 {
	font-size: 42px;
}

h2 {
	font-size: 36px;
}

h3 {
	font-size: 30px;
}

h4 {
	font-size: 24px;
}

h5 {
	font-size: 18px;
}

h6 {
	font-size: 16px;
}

p {
	font-size: 15px;
	font-family: "Poppins", sans-serif;
	color: #707070;
	font-weight: 400;
	line-height: 26px;
}

li {
  list-style: none;
}

.classynav ul {
  margin: 0;
  padding: 0; 
}
.classynav ul li {
  margin: 0;
  padding: 0; 
}

a {
  color: var(--body);
  text-decoration: none;
}

a:hover {
  color: var(--brand);
  text-decoration: none;
}

.text-brand{
  color: var(--brand);
}

.background-brand{
  background-color: var(--brand);
}

.btn-brand{
  background-color: var(--brand);
  color: white;
}

.btn-brand:hover{
  background-color: white;
  color: var(--brand);
  border: 1px solid var(--brand);
}

/* Topbar */
.topbar .icons a{
  color: var(--brand);
  background-color: white;
  border: 1px solid white;
}
.topbar {
   background-color: var(--sub);
}

.topbar i {
   background-color: var(--brand);
   color: white;
   padding: 15px;
}

.topbar .icons a:hover{
  background-color: black;
  color: white;
  border: 1px solid white;
}

/*** Spinner ***/
#spinner {
  opacity: 0;
  visibility: hidden;
  transition: opacity .5s ease-out, visibility 0s linear .5s;
  z-index: 99999;
}

#spinner.show {
  transition: opacity .5s ease-out, visibility 0s linear 0s;
  visibility: visible;
  opacity: 1;
}

/* Back to Top */
/* .back-to-top {
  position: fixed;
  display: none;
  right: 45px;
  bottom: 45px;
  z-index: 99;
  background-color: #000000;
  color: white;
}

.back-to-top:hover{
  color: white;
} */

/* ==========================================================================
   LIZYREALTY - REFINED BACK TO TOP BUTTON
   ========================================================================== */

/* Enable native smooth scrolling across the page for immediate response */
html {
  scroll-behavior: smooth !important;
}

.back-to-top {
  position: fixed;
  display: none;
  right: 25px;
  bottom: 25px;
  z-index: 999;
  
  /* Dimensions & Centering */
  width: 46px;
  height: 46px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  
  /* Bright Accent Blue / Deep Navy Theme (or swap to Gold if preferred) */
  background: var(--sub); 
  color: #FFFFFF !important;
  
  /* Crisp 2px White Border */
  border: 2px solid #FFFFFF !important;
  border-radius: 50% !important;
  
  /* Subtle, Professional Drop Shadow (No heavy glow) */
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);
  transition: background-color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
  cursor: pointer;
}

/* Icon Styling */
.back-to-top i {
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1;
}

/* Clean Professional Hover & Touch State */
.back-to-top:hover,
.back-to-top:active,
.back-to-top:focus {
  background: var(--sub); /* Darker blue on press/hover */
  color: #FFFFFF !important;
  border-color: #FFFFFF !important;
  transform: translateY(-3px); /* Subtle 3px lift */
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.25);
}

/* Mobile Screen Tuning */
@media (max-width: 768px) {
  .back-to-top {
    right: 18px;
    bottom: 18px;
    width: 42px;
    height: 42px;
  }
}

/* Float Icons */
.float {
  position:fixed;
  width:60px;
  height:60px;
  bottom:110px;
  left:20px;
  background-color:#37b6ff;
  color:#FFF;
  border-radius:50px;
  text-align:center;
  font-size:30px;
  box-shadow: 2px 2px 3px #999;
  z-index:100;
}

.float-2 {
  position:fixed;
  width:60px;
  height:60px;
  bottom:40px;
  left:20px;
  background-color:#25d366;
  color:#FFF;
  border-radius:50px;
  text-align:center;
  font-size:30px;
  box-shadow: 2px 2px 3px #999;
  z-index:100;
}

.my-float {
  margin-top:16px;
}

.float:hover {
  color: #37b6ff;
  background-color: white;
  border: 1px solid #37b6ff;
}

.float-2:hover {
  color: #25d366;
  background-color: white;
  border: 1px solid #25d366;
}

/*** Footer ***/
.footer{
  /* background-color: white; */
  background-color: var(--sub);
}

.footer a{
  text-decoration: none;
}

.footer-head{
  color: var(--brand);
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  font-size: .8rem;
  
}

.footer-color{
  color: #b9babc;
  /* color: black; */
   font-size: 15px;
}

.footer .btn.btn-social {
  margin-right: 5px;
  width: 35px;
  height: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  transition: .3s;
  /* background-color: var(--brand);
  border: 1px solid var(--brand); */
}

.footer .btn.btn-social:hover {
  color: black;
  /* background-color: white; */
  /* background-color: black;
  border: 1px solid var(--brand); */
}

.footer .btn.btn-link {
  display: block;
  margin-bottom: 5px;
  padding: 0;
  text-align: left;
  /* color: black; */
  color: #b9babc;
  font-size: 13px;
  font-weight: normal;
  text-transform: capitalize;
  transition: .3s;
}

.footer .btn.btn-link::before {
  position: relative;
  content: "\f105";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  margin-right: 10px;
}

.footer .btn.btn-link:hover {
  color: white;
  letter-spacing: 1px;
  box-shadow: none;
}

.footer .copyright {
  padding: 25px 0;
  font-size: 15px;
  border-top: 1px solid rgba(256, 256, 256, .3);
}

.footer .copyright a {
  color: white;
}

.footer .copyright a:hover {
  color: #b9babc;
}

.main-header-area {
position: relative;
z-index: 1;
background-color: #ffffff; }
.main-header-area .book-now-btn a {
padding: 10px 20px;
background-color: var(--brand);
/* height: 80px;
line-height: 80px; */
text-align: center;
color: #ffffff;
font-size: 16px; }
.main-header-area .book-now-btn a i {
padding-left: 5px; }
@media only screen and (min-width: 768px) and (max-width: 991px) {
.main-header-area .book-now-btn a {
/* height: 50px;
line-height: 50px;
border-radius: 30px; */
margin-top: 10px;
margin-left: 10px;
 } }
@media only screen and (max-width: 767px) {
.main-header-area .book-now-btn a {
/* height: 50px;
line-height: 50px;
border-radius: 30px; */
margin-top: 10px;
margin-left: 10px; } }
.main-header-area .book-now-btn a:hover, .main-header-area .book-now-btn a:focus {
background-color: #2a303b;
color: #ffffff; }
@media only screen and (max-width: 767px) {
.classy-nav-container .classy-navbar .nav-brand {
/* max-width: 90px; */
margin-right: 15px; } }

.classy-nav-container {
background-color: transparent;
padding: 0; }
.classy-nav-container .classy-navbar {
-webkit-transition-duration: 500ms;
-o-transition-duration: 500ms;
transition-duration: 500ms;
height: 80px;
padding: 0; }
@media only screen and (min-width: 768px) and (max-width: 991px) {
.classy-nav-container .classy-navbar {
height: 70px; } }
@media only screen and (max-width: 767px) {
.classy-nav-container .classy-navbar {
height: 70px; } }
@media only screen and (max-width: 767px) {
.classy-nav-container .classy-navbar .nav-brand {
/* max-width: 90px; */
margin-right: 15px; } }
.classy-nav-container .classy-navbar .classynav ul li a {
font-size: 16px;
text-transform: capitalize;
color: black;
font-weight: 500;
padding: 0 20px; }
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.classy-nav-container .classy-navbar .classynav ul li a {
font-size: 14px;
padding: 0 10px; } }
@media only screen and (min-width: 768px) and (max-width: 991px) {
.classy-nav-container .classy-navbar .classynav ul li a {
font-size: 14px;
color: black; }
.classy-nav-container .classy-navbar .classynav ul li a:hover, .classy-nav-container .classy-navbar 
.classynav ul li a:focus {
color: var(--brand); } }
@media only screen and (max-width: 767px) {
.classy-nav-container .classy-navbar .classynav ul li a {
font-size: 14px;
color: black; }
.classy-nav-container .classy-navbar .classynav ul li a:hover, .classy-nav-container .classy-navbar 
.classynav ul li a:focus {
color: var(--brand); } }
.classy-nav-container .classy-navbar .classynav ul li a:focus, .classy-nav-container .classy-navbar 
.classynav ul li a:hover,
.classy-nav-container .classy-navbar .classynav ul li a:focus, .classy-nav-container .classy-navbar 
.classynav ul li a:active {
color: var(--brand);
font-weight: 500; }
.classy-nav-container .classy-navbar .classynav ul li.cn-dropdown-item ul li a, .classy-nav-container 
.classy-navbar .classynav ul li.megamenu-item ul li a {
font-size: 14px;
text-transform: capitalize;
height: 100%;
padding: 0 30px;
color: black; }
.classy-nav-container .classy-navbar .classynav ul li.cn-dropdown-item ul li a:focus, .classy-nav-container 
.classy-navbar .classynav ul li.cn-dropdown-item ul li a:hover
, .classy-nav-container .classy-navbar .classynav ul li.megamenu-item ul li a:focus, .classy-nav-container 
.classy-navbar .classynav ul li.megamenu-item ul li a:active {
background-color: var(--brand);
color: white;
}

.classynav ul li.active a {
position: relative;
z-index: 1; }
.classynav ul li.active a::before {
width: 80%;
height: 2px;
background-color: #ffffff;
position: absolute;
bottom: 0;
left: 10%;
z-index: 1;
content: ''; }
@media only screen and (min-width: 768px) and (max-width: 991px) {
.classynav ul li.active a::before {
display: none; } }
@media only screen and (max-width: 767px) {
.classynav ul li.active a::before {
display: none; } }

.classynav ul li.has-down > a::after,
.classynav ul li.has-down.active > a::after,
.classynav ul li.megamenu-item > a::after {
color: var(--brand); }

@media only screen and (min-width: 975px) {
.main-header-area .classy-nav-container .classy-navbar .classy-menu .classynav #nav li .dropdown-laptop {
/* Your specified width for laptops */
width: 280px;
}
}

@media only screen and (min-width: 975px) {
.main-header-area .classy-nav-container .classy-navbar .classy-menu .classynav #nav li .dropdown-laptop li ul {
/* Your specified width for laptops */
margin-left: 80px;
width: 250px;
}
}

.sticky-top {
  top: -100px;
  transition: .5s;
}

.sticky-top .main-header-area .classy-nav-container .classy-navbar .nav-brand img{
  height: 70px;
}

/* @media only screen and (max-width: 775px) {
  .sticky-top .main-header-area .classy-nav-container .classy-navbar .nav-brand{
   font-size: 15px;
  }
} */

.close {
  color: #000;
  opacity: 0.7;
  font-size: 40px;
  background-color: transparent;
  border: none;
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 1;
}

.close:hover {
  opacity: 1;
}

.nav-brand:hover{
  color: black !important;
}

/* ===== FINAL REALTY UI POLISH ===== */
.custom-navbar {
  padding: 10px 0;
  box-shadow: 0 6px 24px rgba(17, 24, 39, 0.07);
  border-bottom: 1px solid rgba(17,24,39,.06);
}
.custom-navbar .container { min-height: 70px; }
.custom-navbar .navbar-brand img { height: 62px !important; width: auto; }
.custom-navbar .navbar-nav { gap: 24px; }
.custom-navbar .nav-link { font-size: 14px; font-weight: 600; letter-spacing: .02em; text-transform: none; padding: 12px 0 !important; }
.custom-navbar .nav-link::after { bottom: 3px; }
.custom-navbar .theme-btn { border-radius: 999px; padding: 12px 22px; font-weight: 700; }

/* Category navigation: links, not filter-state buttons. */
.prop-type-nav .prop-type-pill { text-decoration: none; }
.prop-type-nav .prop-type-pill.active { color: #fff; }
.prop-type-nav .prop-type-pill:not(.active) { color: var(--heading); }

/* Better aligned budget control */
.prop-filter-bar {
  display: grid;
  grid-template-columns: minmax(170px,1.15fr) minmax(170px,1.15fr) minmax(130px,.9fr) minmax(160px,1fr) minmax(235px,1.35fr) auto;
  align-items: end;
  gap: 16px;
  padding: 18px 20px;
}
.prop-filter-field { min-width: 0; }
.prop-filter-budget { min-width: 0; width: 100%; }
.prop-budget-slider { height: 34px; margin-top: 2px; }
.prop-budget-track, .prop-budget-range { height: 5px; }
.prop-budget-values { margin-top: 5px; font-weight: 600; }
.prop-filter-reset { align-self: end; height: 42px; }

/* View More sits beside WhatsApp without squeezing the phone icon. */
.prop-card-footer { display: grid; grid-template-columns: minmax(0,1.3fr) minmax(92px,.8fr) 44px; gap: 8px; }
.prop-card-footer .prop-btn-details { min-width: 0; }
.prop-btn-view-more { background: #fff; color: var(--heading); border-color: var(--brand); }
.prop-btn-view-more:hover { background: var(--brand); color: #fff !important; border-color: var(--brand); }

@media (max-width: 1200px) {
  .prop-filter-bar { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .prop-filter-budget { grid-column: span 2; }
  .prop-filter-reset { width: 100%; }
}
@media (max-width: 768px) {
  .custom-navbar .navbar-nav { gap: 4px; }
  .prop-filter-bar { grid-template-columns: 1fr; }
  .prop-filter-budget { grid-column: auto; }
  .prop-card-footer { grid-template-columns: 1fr 1fr; }
  .prop-card-footer .prop-btn-icon { grid-column: 1 / -1; width: 100%; }
}

/* ========================================================================
   FINAL LIZYMART-STYLE HOME BANNERS
   Compact three-card banner row directly below the circular categories.
   ======================================================================== */
.lizyMartBannerSection {
  width: 100%;
  max-width: 1380px;
  margin: 0 auto;
  padding: 0 16px 24px;
  background: #fff;
}

.lizyMartBannerCarousel {
  width: 100%;
}

.lizyMartBannerCarousel .owl-stage {
  display: flex;
  align-items: stretch;
}

.lizyMartBannerCarousel .owl-item {
  display: flex;
  height: auto;
}

.lizyMartBannerCard {
  position: relative;
  display: block;
  width: 100%;
  height: 214px;
  overflow: hidden;
  border-radius: 11px;
  background: #eef1f0;
  box-shadow: 0 3px 12px rgba(17,24,39,.08);
  text-decoration: none !important;
}

.lizyMartBannerCard img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
  transition: transform .55s ease;
}

.lizyMartBannerShade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0) 42%, rgba(0,0,0,.66) 100%);
  pointer-events: none;
}

.lizyMartBannerContent {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 15px;
  z-index: 2;
  color: #fff;
  text-shadow: 0 2px 8px rgba(0,0,0,.35);
}

.lizyMartBannerContent strong {
  display: block;
  font-size: 17px;
  line-height: 1.15;
  font-weight: 800;
  letter-spacing: .01em;
}

.lizyMartBannerContent small {
  display: block;
  margin-top: 4px;
  font-size: 11px;
  line-height: 1.25;
  font-weight: 600;
  opacity: .96;
}

.lizyMartBannerCard:hover img {
  transform: scale(1.045);
}

.lizyMartBannerCarousel .owl-dots {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 7px;
  margin-top: 12px;
}

.lizyMartBannerCarousel .owl-dot {
  width: 8px;
  height: 8px;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50%;
  background: #cfd5dd !important;
  box-shadow: none !important;
}

.lizyMartBannerCarousel .owl-dot.active {
  width: 19px;
  border-radius: 999px;
  background: #0d245d !important;
}

/* Budget Range: keep both thumbs, track and labels on one clean baseline. */
.prop-filter-budget {
  min-width: 0 !important;
  align-self: stretch !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}

.prop-filter-budget > label {
  margin-bottom: 9px !important;
}

.prop-budget-slider {
  height: 32px !important;
  margin: 0 9px !important;
  position: relative !important;
}

.prop-budget-track,
.prop-budget-range {
  top: 50% !important;
  height: 5px !important;
}

.prop-budget-values {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  margin: 7px 0 0 !important;
  line-height: 1.1 !important;
  min-height: 15px;
}

.prop-budget-values span {
  white-space: nowrap;
}

@media (max-width: 1200px) {
  .lizyMartBannerSection { padding-left: 18px; padding-right: 18px; }
  .lizyMartBannerCard { height: 205px; }
}

@media (max-width: 767px) {
  .lizyMartBannerSection {
    padding: 0 14px 20px;
  }

  .lizyMartBannerCarousel .owl-stage-outer {
    overflow: hidden;
  }

  .lizyMartBannerCard {
    height: 190px;
  }

  .lizyMartBannerContent strong {
    font-size: 15px;
  }
}

/* FINAL CATEGORY + FILTER POLISH */
.lizyHomeTypeNav {
  background: #f7f9f8;
  padding: 0 0 20px;
}
.lizyHomeTypeNav .prop-container { max-width: 1440px; }
.lizyHomeTypeNav .prop-type-pills {
  margin: 0;
  justify-content: flex-start;
  gap: 12px;
}
.lizyHomeTypeNav .prop-type-pill {
  min-width: 112px;
  justify-content: center;
}

/* Never let the budget control escape its filter column. */
.prop-filter-bar {
  align-items: end !important;
}
.prop-filter-bar > .prop-filter-field,
.prop-filter-bar > .prop-filter-budget,
.prop-filter-bar > .prop-filter-reset {
  min-width: 0 !important;
  box-sizing: border-box !important;
}
.prop-filter-budget .prop-budget-control {
  max-width: 100% !important;
  box-sizing: border-box !important;
}
.prop-filter-budget .prop-budget-values span {
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (max-width: 767px) {
  .lizyHomeTypeNav { padding-bottom: 14px; }
  .lizyHomeTypeNav .prop-type-pills { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; }
  .lizyHomeTypeNav .prop-type-pill { flex: 0 0 auto; }
}

/* Hide accidental standalone Owl text controls; the actual home carousel
   controls are positioned explicitly below. */
.lizyHomeShowcaseCarousel .owl-nav > div:empty { display: none !important; }

/* FINAL FILTER LAYOUT — same footprint on Home, All Types, Land, Apartment and House */
.prop-filter-bar {
  grid-template-columns: minmax(170px, 1.08fr) minmax(170px, 1.08fr) minmax(125px, .86fr) minmax(150px, .96fr) minmax(220px, 1.22fr) auto !important;
  align-items: end !important;
}
.prop-filter-bar .prop-filter-budget {
  align-self: end !important;
}
.prop-filter-bar .prop-budget-control {
  position: relative !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 42px !important;
  min-height: 42px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  border: 1px solid var(--border, #dfe5e2) !important;
  border-radius: 8px !important;
  background: #fff !important;
}
.prop-filter-bar .prop-budget-values {
  position: absolute !important;
  left: 10px !important;
  right: 10px !important;
  top: 4px !important;
  z-index: 4 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  font-size: 11px !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  pointer-events: none !important;
}
.prop-filter-bar .prop-budget-slider {
  position: absolute !important;
  left: 9px !important;
  right: 9px !important;
  bottom: 3px !important;
  width: auto !important;
  height: 19px !important;
  margin: 0 !important;
}
.prop-filter-bar .prop-budget-slider input[type="range"] {
  top: 50% !important;
  height: 19px !important;
  transform: translateY(-50%) !important;
}
.prop-filter-bar .prop-budget-track,
.prop-filter-bar .prop-budget-range {
  top: 50% !important;
  height: 4px !important;
  transform: translateY(-50%) !important;
  border-radius: 999px !important;
}
.prop-filter-bar .prop-budget-values span { white-space: nowrap !important; }
.prop-filter-bar .prop-filter-reset {
  align-self: end !important;
  height: 42px !important;
  min-height: 42px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  white-space: nowrap !important;
}

@media (max-width: 1200px) {
  .prop-filter-bar { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  .prop-filter-bar .prop-filter-budget { grid-column: span 2 !important; }
  .prop-filter-bar .prop-filter-reset { width: 100% !important; }
}
@media (max-width: 767px) {
  .prop-filter-bar { grid-template-columns: 1fr !important; }
  .prop-filter-bar .prop-filter-budget { grid-column: auto !important; }
}

/* FINAL CATEGORY PAGE ALIGNMENT */
.prop-category-grid-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
  margin-bottom: 26px !important;
}
.prop-category-grid-header .prop-sec-title {
  margin: 0 !important;
}
.prop-category-grid-header .lizyTestimonialViewAll {
  flex: 0 0 auto !important;
  margin: 0 !important;
}
/* Category pages start directly with the same heading row as the reference. */
.prop-grid-sec {
  padding-top: 24px;
}
/* The budget control is always contained inside its fifth filter column. */
.prop-filter-budget .prop-budget-control {
  position: relative !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 42px !important;
  min-height: 42px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  border: 1px solid #dfe5e2 !important;
  border-radius: 8px !important;
  background: #fff !important;
}
.prop-filter-budget .prop-budget-control .prop-budget-values {
  position: absolute !important;
  left: 10px !important;
  right: 10px !important;
  top: 4px !important;
  z-index: 4 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  font-size: 11px !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  pointer-events: none !important;
}
.prop-filter-budget .prop-budget-control .prop-budget-slider {
  position: absolute !important;
  left: 9px !important;
  right: 9px !important;
  bottom: 3px !important;
  width: auto !important;
  height: 19px !important;
  margin: 0 !important;
}
.prop-filter-budget .prop-budget-control .prop-budget-slider input[type="range"] {
  top: 50% !important;
  height: 19px !important;
  transform: translateY(-50%) !important;
}
.prop-filter-budget .prop-budget-control .prop-budget-track,
.prop-filter-budget .prop-budget-control .prop-budget-range {
  top: 50% !important;
  height: 4px !important;
  transform: translateY(-50%) !important;
  border-radius: 999px !important;
}
@media (max-width: 767px) {
  .prop-category-grid-header { align-items: flex-start !important; flex-direction: column !important; }
  .prop-category-grid-header .lizyTestimonialViewAll { width: auto !important; }
}


/* ================================================================
   FINAL UI CONSISTENCY PASS — HOME + ALL PROPERTIES
   Heading row first, category pills second, filters third.
   Keep the budget control completely inside its own fifth column.
   ================================================================ */
.lizy-home #properties .prop-grid-header,
.prop-grid-sec#properties .prop-category-grid-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
  margin-bottom: 26px !important;
}

.lizy-home #properties .prop-type-pills {
  margin-bottom: 22px !important;
}

.lizy-home #properties .prop-filter-bar,
.prop-grid-sec#properties .prop-filter-bar {
  width: 100% !important;
  box-sizing: border-box !important;
}

/* All-properties page has no decorative hero strip; start clean under nav. */
.prop-grid-sec#properties {
  padding-top: 24px !important;
}

/* Land/Apartment/House/Properties now have their own hero heading above
   this section (see .prop-hero-sec) - give the grid a bit more breathing
   room under it than the hero-less pages need. Keyed off the actual DOM
   adjacency (hero immediately followed by the grid) rather than a specific
   page/attribute, so it applies automatically to any page built this way. */
.prop-hero-sec + .prop-grid-sec#properties {
  padding-top: 48px !important;
}

/* Budget control never escapes its column. */
.prop-grid-sec#properties .prop-filter-budget,
.lizy-home #properties .prop-filter-budget {
  min-width: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

.prop-grid-sec#properties .prop-budget-control,
.lizy-home #properties .prop-budget-control {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

@media (max-width: 767px) {
  .lizy-home #properties .prop-grid-header,
  .prop-grid-sec#properties .prop-category-grid-header {
    align-items: flex-start !important;
    flex-direction: column !important;
  }
}

/* Final: the shared spinner must never cover the Properties/category pages.
   Those pages load their own data after DOM ready. */
#spinner { display: none !important; visibility: hidden !important; opacity: 0 !important; pointer-events: none !important; }


/* ================================================================
   EXACT BUDGET RANGE UI — matches the reference filter layout.
   The label and live values sit on one row above a clean slider box.
   ================================================================ */
.prop-filter-bar .prop-filter-budget {
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  align-self: end !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

.prop-filter-bar .prop-filter-budget .prop-budget-heading {
  width: 100% !important;
  min-height: 16px !important;
  margin: 0 0 7px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  box-sizing: border-box !important;
}

.prop-filter-bar .prop-filter-budget .prop-budget-heading > label {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 11px !important;
  line-height: 16px !important;
  font-weight: 700 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  color: #8a8a8a !important;
  white-space: nowrap !important;
}

.prop-filter-bar .prop-filter-budget .prop-budget-heading .prop-budget-values {
  position: static !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 3px !important;
  font-size: 11px !important;
  line-height: 16px !important;
  font-weight: 700 !important;
  color: var(--brand, #55b51b) !important;
  pointer-events: none !important;
}

.prop-filter-bar .prop-filter-budget .prop-budget-heading .prop-budget-values span {
  color: var(--brand, #55b51b) !important;
  font-size: 11px !important;
  line-height: 16px !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}

.prop-filter-bar .prop-filter-budget .prop-budget-control {
  position: relative !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: 42px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  border: 1px solid #dfe5e2 !important;
  border-radius: 8px !important;
  background: #fff !important;
}

.prop-filter-bar .prop-filter-budget .prop-budget-control .prop-budget-values {
  position: static !important;
  display: none !important;
}

.prop-filter-bar .prop-filter-budget .prop-budget-slider {
  position: absolute !important;
  left: 12px !important;
  right: 12px !important;
  top: 50% !important;
  bottom: auto !important;
  width: auto !important;
  height: 20px !important;
  margin: 0 !important;
  transform: translateY(-50%) !important;
  box-sizing: border-box !important;
}

.prop-filter-bar .prop-filter-budget .prop-budget-track,
.prop-filter-bar .prop-filter-budget .prop-budget-range {
  top: 50% !important;
  height: 5px !important;
  transform: translateY(-50%) !important;
  border-radius: 999px !important;
}

.prop-filter-bar .prop-filter-budget .prop-budget-slider input[type="range"] {
  top: 50% !important;
  left: 0 !important;
  width: 100% !important;
  height: 20px !important;
  transform: translateY(-50%) !important;
}

.prop-filter-bar .prop-filter-budget .prop-budget-slider input[type="range"]::-webkit-slider-thumb {
  width: 16px !important;
  height: 16px !important;
  margin-top: 2px !important;
  border: 2px solid #fff !important;
}

.prop-filter-bar .prop-filter-budget .prop-budget-slider input[type="range"]::-moz-range-thumb {
  width: 16px !important;
  height: 16px !important;
  border: 2px solid #fff !important;
}

@media (max-width: 1200px) {
  .prop-filter-bar .prop-filter-budget .prop-budget-heading .prop-budget-values span {
    font-size: 10px !important;
  }
}
