*{box-sizing:border-box;}

body{
  font-family:'Segoe UI',sans-serif;
  margin:0;
  background:#fff;   /* FULL WHITE PAGE */
}

/* ===== HEADINGS (UNIFIED) ===== */
h3,
.filter-title{
  font-size:16px;
  font-weight:700;
  margin:25px 0 12px;
  color:#111;
  display:flex;
  align-items:center;
  gap:8px;
}

/* ===== TOPBAR ===== */
.topbar{
  background:#fff;
  padding:12px 16px;
  position:sticky;
  top:0;
  z-index:100;
  border-bottom:1px solid #eee;
}

.tabs{
  display:flex;
  gap:10px;
  overflow-x:auto;
}

.tabs::-webkit-scrollbar{display:none;}

.tab{
  display:flex;
  align-items:center;
  gap:6px;
  padding:8px 14px;
  border-radius:30px;
  background:#f1f3f6;
  cursor:pointer;
  font-size:13px;
  white-space:nowrap;
}

.tab.active{
  background:#C41E3A;
  color:white;
}

/* ===== CONTAINER ===== */
.container{
  max-width:1100px;
  margin:auto;
  padding:16px;
}



/* ===== REMOVE CARD LOOK ===== */
.section,
.filter-block{
  background:transparent;
  padding:0;
 /* margin:16px 0;*/
  box-shadow:none;
}

/* ===== PROPERTY CARDS ===== */
.grid{
  display:flex;
  gap:14px;
  overflow-x:auto;
  margin-bottom: 15px;
}

.grid::-webkit-scrollbar{display:none;}

.card{
  min-width:110px;
  height:100px;
  border-radius:14px;
  background:#f7f7f7;
  border:1px solid #C41E3A;
  cursor:pointer;
  flex:0 0 auto;
}

.card input{display:none;}

.content{
  height:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}

.card input:checked + .content{
  background:#C41E3A;
  color:white;
  border-radius:14px;
}

/* ===== DROPDOWN FULL WIDTH ===== */
.select{
  width:100%;
  padding:14px;
  border-radius:30px;
  border:1px solid #ddd;
  margin-bottom:10px;
}

.select-row{
  display:flex;
  gap:10px;
}

.select-row .select{
  flex:1;
}

/* ===== CHECKBOX PREMIUM (BORDER STYLE) ===== */
.checkbox-grid{
  display:flex;
  gap:10px;
  overflow-x:auto;
}

.checkbox-grid::-webkit-scrollbar{display:none;}

.checkbox-grid label{
  display:flex;
  align-items:center;
  gap:6px;
  padding:8px 14px;
  border-radius:25px;
  border:1px solid #C41E3A;
  background:#fff;
  font-size:13px;
  cursor:pointer;
  white-space:nowrap;
}

.checkbox-grid input{display:none;}

.checkbox-grid label:has(input:checked){
  background:#C41E3A;
  color:#fff;
}

/* ===== INPUT ===== */
.input{
  width:100%;
  padding:14px;
  border-radius:30px;
  border:1px solid #ddd;
  margin-bottom:10px;
}

/* ===== SECTION SHOW ===== */
.section{
  display:none;
}

.section.active{
  display:block;
}

/* ===== BUTTON ===== */
.fixed-btn{
  position:fixed;
  bottom:0;
  width:100%;
  background:#fff;
  padding:12px 16px;
  border-top:1px solid #eee;
}

.fixed-btn button{
  width:100%;
  padding:16px;
  border:none;
  border-radius:40px;
  background:#e53935;
  color:#C41E3A;
  font-weight:600;
}

/* ===== RESPONSIVE ===== */
@media(max-width:768px){

  .card{
    min-width:90px;
    height:90px;
  }

  h3{
    font-size:15px;
  }

}


/* ===== PREMIUM SPACING ===== */
.container{
  max-width:1100px;
  margin:auto;
  padding:20px 18px 90px; /* bottom space for button */
}

/* space between sections */
.section,
.filter-block{
  /*margin:22px 0;*/
}

/* heading spacing */
h3,
.filter-title{
  margin-bottom:14px;
}

/* form group spacing */
.form-group{
  margin-bottom:18px;
}

/* checkbox row spacing */
.checkbox-grid{
  gap:12px;
  padding-bottom:6px;
}

/* checkbox chip look better */
.checkbox-grid label{
  padding:10px 16px;
  border-radius:30px;
  font-size:13px;
  gap:8px;
}

/* icon inside checkbox */
.checkbox-grid i{
  font-size:13px;
  opacity:0.8;
}

/* hover effect (premium feel) */
.checkbox-grid label:hover{
  transform:translateY(-2px);
  transition:0.2s;
}

/* smooth scroll */
.checkbox-grid{
  scroll-behavior:smooth;
}

/* ===== AREA FULL WIDTH ===== */
.area-row{
  display:flex;
  gap:12px;
  width:100%;
}

.area-row > div{
  flex:1;          /* equal width */
}

.area-row .select{
  width:100%;
}

.tab{
  display:flex;
  align-items:center;
  gap:6px;
}

.tab i{
  font-size:13px;
}

/* ===== FIXED BUTTON (NO BOTTOM GAP) ===== */
.fixed-btn{
  position:fixed;
  bottom:0;                /* 🔥 no gap */
  left:50%;
  transform:translateX(-50%);
  width:100%;
  max-width:1100px;
  padding:0 18px 0;        /* only side spacing */
  z-index:1000;
  background:#fff;
  border-top:1px solid #C41E3A;
}

/* inner spacing */
.fixed-btn-inner{
  padding:10px 0;
}

.fixed-btn button{
  width:100%;
  padding:14px;
  border:none;
  border-radius:40px;
  background:linear-gradient(135deg, #8B1538 0%, #C41E3A 100%);
  color:#fff;
  font-weight:600;
  font-size:15px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}

/* mobile */
@media(max-width:768px){
  .fixed-btn{
    padding:0 12px;
  }
}

.checkbox-grid i{
  color:var(--primary);
  font-size:13px;
}




/* ===== PREMIUM SECTION DIVIDER ===== */
.section,
.filter-block{
  position:relative;
  padding-bottom:14px;
  margin-bottom:14px;
}

/* light divider line */
.section::after,
.filter-block::after{
  content:"";
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  height:1px;
  background:linear-gradient(
    to right,
    transparent,
    #e9e9e9,
    transparent
  );
}

/* last section me line remove */
.section:last-child::after,
.filter-block:last-child::after{
  display:none;
}

.range{
  width:100%;
  margin-top:10px;
}

.range input[type="range"]{
  width:100%;
  -webkit-appearance:none;
  height:6px;
  border-radius:10px;
  outline:none;
  background:linear-gradient(to right, #C41E3A 20%, #eee 20%);
}

/* THUMB */
.range input[type="range"]::-webkit-slider-thumb{
  -webkit-appearance:none;
  width:18px;
  height:18px;
  border-radius:50%;
  background:#C41E3A;
  cursor:pointer;
  margin-top:-6px;
  box-shadow:0 2px 6px rgba(0,0,0,0.2);
}

/* VALUE TEXT */
.range-value{
  margin-top:6px;
  font-size:13px;
  font-weight:600;
  color:#C41E3A;
  text-align:right;
}