/* ===== Container Styling ===== */
.priceBucketFilter {
  font-family: 'Arial', sans-serif;
  background-color: #fff;
  /* padding: 16px;
  border: 1px solid #e0e0e0; */
  border-radius: 8px;
  max-width: 350px;
}

/* ===== Filter List Styling ===== */
.filterList {
  list-style: none;
  padding: 0;
  margin: 0;
}

.filterList li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 12px;
  /* border: 1px solid #f0f0f0; */
  border-radius: 6px;
  /* margin-bottom: 8px; */
  transition: background-color 0.2s;
  cursor: pointer;
}

/* .filterList li:hover {
  background-color: #f9f9f9;
} */

.checkmarkOuter {
  display: flex;
  align-items: center;
  flex-grow: 1;
}

/* ===== Checkbox Styling ===== */
.checkmarkOuter input[type="checkbox"] {
 /* appearance: none; */
    width: 18px;
    height: 18px;
    margin-right: 10px;
    border: 2px solid #ccc;
    border-radius: 4px;
    position: relative;
    cursor: pointer;
    transition: all 0.2s ease;
}

.checkmarkOuter input[type="checkbox"]:checked {
  border-color: #007bff;
  background-color: #007bff;
}

.checkmarkOuter input[type="checkbox"]::after {
  content: '';
  position: absolute;
  top: 2px;
  left: 6px;
  width: 4px;
  height: 9px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  display: none;
}

.checkmarkOuter input[type="checkbox"]:checked::after {
  display: block;
}

/* ===== Label Styling ===== */
/* .checkmarkOuter label {
  font-size: 13px;
  color: #333;
  cursor: pointer;
} */

/* ===== Count text ===== */
.font12.grayText {
  font-size: 12px;
  color: #666;
}

/* ===== Title (Your Budget) ===== */
.latoBold.font14.appendTop15 {
  font-size: 15px;
  font-weight: bold;
  margin-top: 20px;
  margin-bottom: 10px;
  color: #222;
}

/* ===== Range Input Wrapper ===== */
.range {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* ===== Range Inputs ===== */
.rangeInput {
  width: 80px;
  padding: 6px 10px;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 13px;
  outline: none;
  transition: border-color 0.2s;
}

.rangeInput:focus {
  border-color: #007bff;
}

/* ===== To text between inputs ===== */
.appendLR10 {
  font-size: 13px;
  color: #555;
}

/* ===== Go Button Styling ===== */
.btnRangeGo {
  background-color: #007bff;
  border: none;
  padding: 6px 12px;
  border-radius: 4px;
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.btnRangeGo:hover {
  background-color: #0056b3;
}

/* ===== Arrow Icon Placeholder (use your own sprite or icon) ===== */
.sprite.icWhiteArrow {
  display: inline-block;
  width: 12px;
  height: 12px;
  background-color: #fff; /* You can replace this with background-image if using sprite */
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}
/* ===== Filter List Container ===== */
.filterList {
  list-style: none;
  padding: 0;
  margin: 0;
  font-family: 'Arial', sans-serif;
}

/* ===== Individual Filter Item ===== */
.filterList li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px 12px;
    /* border: 1px solid #f0f0f0; */
    border-radius: 6px;
    margin-bottom: 0px;
    transition: background 0.2s ease;
    cursor: pointer;
}

/* .filterList li:hover {
  background-color: #f9f9f9;
} */

/* ===== Checkbox Wrapper ===== */
.checkmarkOuter {
  display: flex;
  align-items: center;
  flex-grow: 1;
}

/* ===== Custom Checkbox Styling ===== */
/* .checkmarkOuter input[type="checkbox"] {
  appearance: none;
  width: 18px;
  height: 18px;
  margin-right: 10px;
  border: 2px solid #ccc;
  border-radius: 4px;
  position: relative;
  cursor: pointer;
  transition: all 0.2s ease;
} */

.checkmarkOuter input[type="checkbox"]:checked {
  border-color: #007bff;
  background-color: #007bff;
}

.checkmarkOuter input[type="checkbox"]::after {
  content: '';
  position: absolute;
  top: 2px;
  left: 6px;
  width: 4px;
  height: 9px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  display: none;
}

.checkmarkOuter input[type="checkbox"]:checked::after {
  display: block;
}

/* ===== Label Text Styling ===== */
.checkmarkOuter label {
  font-size: 13px;
  color: #333;
  cursor: pointer;
  display: flex;
  align-items: center;
}

/* ===== Flex inside label (makeFlex) ===== */
.makeFlex.row {
  display: flex;
  flex-direction: row;
  gap: 5px;
  align-items: center;
}

/* ===== Optional Count Text (on right side) ===== */
.font12.grayText {
  font-size: 12px;
  color: #777;
}

/* ===== Responsive Design ===== */
@media (max-width: 576px) {
  .filterList li {
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
  }

  .font12.grayText {
    margin-left: 28px;
  }
}

p.makeFlex.filterList__filterName {
    margin-bottom: 0px;
}

/* .filterList li:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
} */

/* Checkbox styling */
.checkmarkOuter {
    display: flex;
    align-items: flex-start;
}

/* .checkmarkOuter input[type="checkbox"] {
    margin-right: 10px;
    accent-color: #ff6f61;
    transform: scale(1.2);
    margin-top: 4px;
} */

/* Label & text layout */
.makeFlex {
    display: flex;
    flex-wrap: wrap;
}

.makeFlex.column {
    flex-direction: column;
}

.filterList__filterName span {
    font-weight: lighter;
    color: #333;
}

/* Tooltip container */
.locToltip {
    position: absolute;
    z-index: 10;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 8px;
    padding: 12px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
    display: none;
    width: 100%;
}

/* Tooltip visible on parent hover */
label:hover .locToltip {
    display: block;
}

/* Tooltip caret */
.showCaret::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    border-width: 10px 10px 0 10px;
    border-style: solid;
    border-color: #fff transparent transparent transparent;
}

/* Tooltip tags */
.locToltip__tag {
    background: #ffefef;
    color: #ff4d4f;
    font-size: 12px;
    padding: 2px 6px;
    border-radius: 4px;
}

/* Tooltip images */
.locToltip__imglist {
    display: flex;
    gap: 8px;
    margin: 10px 0;
}

.locToltip__imglist li img {
    width: 60px;
    height: 60px;
    object-fit: cover;
    border-radius: 8px;
    border: 1px solid #ddd;
}

/* Tooltip info rows */
.locToltip__info {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.locToltip__infoIcon img {
    width: 20px;
    height: 20px;
}

/* Responsive media queries */
@media (max-width: 768px) {
    .filterList {
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    }

    .locToltip {
        position: static;
        display: block !important;
        box-shadow: none;
        border: none;
        padding: 8px 0 0;
        margin-top: 8px;
    }

    .showCaret::after {
        display: none;
    }
}


 
/* Label Text */
.makeFlex.row span {
    font-size: 13px;
    font-weight: 500;
    color: #333;
}

/* Count on right side */
.font12.grayText {
    font-size: 12px;
    color: #666;
    white-space: nowrap;
    margin-left: auto;
}

/* Tooltip Styling */
.infoTooltip {
    background: #323232;
    color: #fff;
    font-size: 12px;
    padding: 6px 10px;
    border-radius: 6px;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 100;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    margin-top: 6px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}

/* Show Tooltip on Hover */
label:hover .infoTooltip {
    opacity: 1;
    visibility: visible;
}

/* Responsive */
@media (max-width: 768px) {
    .filterList li {
        flex-direction: column;
        align-items: flex-start;
    }

    .font12.grayText {
        margin-left: 0;
        margin-top: 6px;
    }

    .infoTooltip {
        position: static;
        opacity: 1;
        visibility: visible;
        margin-top: 8px;
    }
}


/* card gallery */

.gallery-container {
     /* border: 2px solid red; */
    border-radius: 10px;
    padding: 10px;
    max-width: 100%;
    }

    .main-image img {
      width: 100%;
      border-radius: 10px;
      height: auto;
      transition: 0.3s ease-in-out;
    }

    .thumbnail-row {
      display: flex;
      gap: 5px;
      margin-top: 10px;
      overflow-x: auto;
    }

    .thumbnail-row img,
    .view-all {
    width: 43px;
    height: 43px;
      object-fit: cover;
      border-radius: 6px;
      cursor: pointer;
      position: relative;
    }

    .view-all {
      background: rgba(0,0,0,0.5);
      color: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: bold;
      font-size: 14px;
    }

    .view-all::after {
      content: "View All";
    }
    .view-all-link {
  text-decoration: none;
}


.text-warning-1 {
    color: #8b572a !important;
    opacity: 1;
    font-size: 13px;
}
/* 
.view-all {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: rgba(0, 0, 0, 0.7);
    color: white;
    padding: 3px 6px;
    border-radius: 4px;
    font-size: 12px;
} */

.card .card-title {
    font-size: 16px;
    font-weight: 600;
    text-transform: capitalize;
    color: #111827;
}

/* end   card and gallery */


/* page hotel-detail */
.hotel-card {
      border: 1px solid #ddd;
      border-radius: 10px;
      padding: 15px;
      margin: 20px 0;
      background: #fff;
      box-shadow: 0 2px 8px rgba(0,0,0,0.1);
      width:85%;
    margin: 0 auto;
    }
    .main-img {
      width: 100%;
      border-radius: 10px;
      object-fit: cover;
    }
    .thumb-img {
      width: 100%;
      height: 100px;
      object-fit: cover;
      border-radius: 10px;
    }
    .price {
      font-size: 24px;
      font-weight: bold;
      color: #000;
    }
    .original-price {
      text-decoration: line-through;
      color: #888;
      font-size: 14px;
    }
    .btn-primary {
      background-color: #0071c2;
      border: none;
    }
    .rating-box {
      border: 1px solid #ddd;
      padding: 10px;
      border-radius: 10px;
      text-align: center;
    }
    .rating-score {
      font-size: 1.4rem;
      font-weight: bold;
      color: #0071c2;
    }
    .mobile-login {
      border: 1px solid #ddd;
      padding: 15px;
      border-radius: 10px;
      margin-top: 20px;
    }

    .img-card {
      position: relative;
      overflow: hidden;
      border-radius: 12px;
    }

    .img-card img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 12px;
    }

    .img-overlay {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      padding: 5px 10px;
      background: linear-gradient(to top, rgba(0,0,0,0.7), transparent);
      color: white;
      font-size: 14px;
      font-weight: 500;
    }


   .cardHldr{
    border: 1px solid #d8d8d8;
    border-radius: 16px;
    padding: 17px 27px;
}

    
    @media (max-width: 767px) {
      .main-img-col {
        height: 180px;
      }

      .sub-img-col {
        height: 85px;
      }
    }

    @media (min-width: 768px) {
      .main-img-col {
        height: 250px;
      }

      .sub-img-col {
        height: 120px;
      }
    }

    .cardHldr {
    border: 1px solid #d8d8d8;
    border-radius: 16px;
    padding: 16px;
}
.appendTop16 {
    margin-top: 16px;
}
.ovrlRating {
    align-items: center;
    display: flex
;
}
.ovrlRating__rating, .ovrlRating__taCont {
   align-items: center;
    background-color: #2757ae;
    border-radius: 16px;
    color: #fff;
    display: flex;
    flex-shrink: 0;
    font-size: 15px;
    /* font-weight: 900; */
    height: 35px;
    justify-content: center;
    margin-right: 16px;
    padding: 0 10px;
}

.blueBg {
    background: #0b58b4;
}
.locCard__desc {
    flex: 1;
}
.ovrlRating__desc  {
    flex: 1;
}
.ovrlRating__title {
    color: #2757ae;
    font-size: 15px;
    font-weight: 900;
    line-height: 20px;
}

html[dir=ltr] .appendLeft5 {
    margin-left: 5px;
}
.appendLeft5 {
    margin-left: 5px;
}
.lowText {
    text-transform: lowercase;
}

.textBtn {
       background: none;
    border: 0;
    color: #008cff;
    cursor: pointer;
    display: inline-flex;
    /* font-family: Lato; */
    font-size: 11px;
    font-weight: 500;
    outline: 0;
}
.locCard {
    align-items: center;
    display: flex;
}
.locCard__icon {
   flex-shrink: 0;
    height: 30px;
    margin-right: 10px;
    object-fit: cover;
    width: 50px;
}
.locCard__title {
    color: #000;
    font-size: 15px;
    font-weight: 900;
    line-height: 0px;
}
.locCard__subTitle {
       font-size: 14px;
    line-height: 1px;
    margin-top: 0px;
}

ul.dw {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  padding: 0;
  margin: 0;
  gap: 4px;
}

ul.dw li.ss {
  display: flex;
    align-items: center;
    /* background: #f5f5f5; */
    padding: 1px 8px;
    border-radius: 8px;
    font-size: 13px;
    transition: background 0.3s;
}

ul.dw li.ss:hover {
  background: #e0e0e0;
}

ul.dw li.ss i {
  font-size: 18px;
}


@media screen and (max-width: 576px) {
  ul.dw li.ss {
    width: 100%;
    justify-content: flex-start;
  }
}


.room-features {
columns: 2;
    font-size: 11px;
    color: #000000;
}

.package-benefits li {
  font-size: 13px;
  margin-bottom: 5px;
}



/* .package-price-select {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 20px;
  flex-wrap: wrap;
  margin-top: 1rem;
}

.package-price-select .price-block {
  text-align: right;
}

.package-price-select .price-block h3 {
  font-size: 1.8rem;
  margin: 0;
  color: #dc3545;
}

.package-price-select .price-block p {
  margin: 0;
}

.package-price-select .button-block {
  text-align: right;
}

.package-price-select .button-block .btn {
  min-width: 140px;
  display: inline-block;
}

@media (max-width: 576px) {
  .package-price-select {
    flex-direction: column-reverse;
    align-items: flex-start;
  }

  .package-price-select .price-block,
  .package-price-select .button-block {
    text-align: left;
    width: 100%;
  }

  .package-price-select .button-block .btn {
    width: 100%;
  }
} */


a.btn-box {
    background: linear-gradient(92deg, #53b2fe, #065af3);
    border-radius: 8px;
    box-shadow: 0 1px 7px 0 #0003;
    font-size: 11px;
    color: #ffffff;
    margin-top: auto;
    padding: 8px 20px;
}

 .hotel-card1 {
    border: 1px solid #ddd;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 0 6px rgba(0,0,0,0.1);
  }
  .hotel-card1 img {
    height: 160px;
    object-fit: cover;
    width: 100%;
  }
  .hotel-card1 .price {
    font-size: 1.25rem;
    font-weight: 600;
    color: #009933;
  }
  .rating-badge {
    background-color: #007bff;
    color: white;
    padding: 3px 8px;
    border-radius: 20px;
    font-size: 0.85rem;
    margin-right: 5px;
  }
  .info-box {
    background: #f8f9fa;
    padding: 8px;
    font-size: 14px;
    text-align: center;
    border-top: 1px solid #ddd;
  }

 .property-rules-box {
    border: 1px solid #ddd;
    border-radius: 10px;
    padding: 20px;
    background: #fff;
    margin-top: 20px;
  }

  .property-rules-box h6 {
    font-weight: 600;
    margin-bottom: 15px;
  }

  .property-rules-box ul {
    padding-left: 20px;
    list-style: circle;
    font-size: 14px;
  }

  .property-rules-box .btn-group a {
    margin: 5px 5px 0 0;
    font-size: 14px;
  }

  .property-rules-box .check-in-out {
    font-size: 14px;
    color: #333;
    margin-bottom: 10px;
  }

  .property-rules-box .rules-columns {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
  }

  @media(max-width: 576px){
    .property-rules-box .rules-columns {
      flex-direction: column;
    }
  }


   .rating {
        color: #555;
        font-size: 14px;
    }
    .highlight {
        color: #0073e6;
        cursor: pointer;
    }
    .guest-note {
        background: #f0f4ff;
        border-left: 4px solid #0073e6;
        padding: 10px;
        font-size: 14px;
        margin: 10px 0;
    }
    .map-container {
        display: flex;
        gap: 10px;
    }
    .map {
        flex: 2;
        height: 450px;
    }
    .sidebar {
        flex: 1;
        font-size: 14px;
    }
    .accordion {
        background-color: #ffffff;
        color: #333;
        cursor: pointer;
        padding: 10px;
        text-align: left;
        outline: none;
        font-weight: bold;
        transition: background-color 0.2s ease;
    }
    /* .accordion:hover {
        background-color: #eaeaea;
    } */
    .panel {
        padding: 0 10px;
        display: none;
        background-color: white;
        border-left: 1px solid #ccc;
        border-right: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
    }
    .panel ul {
        list-style-type: none;
        padding: 5px;
        margin: 0;
    }
    .panel ul li {
        padding: 5px 0;
        border-bottom: 1px solid #eee;
    }
      .rating-badge {
        background-color: #2f6fe0;
        color: white;
        border-radius: 8px;
        padding: 5px;
        text-align: center;
    }
    .rating-badge h4 {
        margin: 0;
    }
    .progress {
        height: 8px;
    }
    .tag {
        background: #f1f1f1;
        border-radius: 20px;
        padding: 5px 12px;
        margin: 5px;
        display: inline-block;
        font-size: 0.9rem;
        cursor: pointer;
    }
    .tag.active {
        background: #2f6fe0;
        color: white;
    }
    .review-box {
        border-bottom: 1px solid #ddd;
        padding-bottom: 10px;
        margin-bottom: 10px;
    }

    ul.rules {
    list-style-type: disc;
    padding: 6px 17px;
    font-size: 13px;
}
.small, small {
    font-size: 12px;
}

ul.list-group li {
    font-size: 13px;
    border: navajowhite;
    margin-bottom: -5px;
}
.rating-badge h4 {
    color: #ffffff;
}

.cardHldr {
  border: 1px solid #ddd;
  border-radius: 8px;
  padding: 10px 12px;
  background: #fff;
  margin-bottom: 30px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  font-family: 'Lato', sans-serif;
}

.bkngOption {
  width: 100%;
}

.makeFlex {
  display: flex;
  flex-wrap: wrap;
}

.spaceBetween {
  justify-content: space-between;
  align-items: center;
}

.hrtlCenter {
  justify-content: center;
  align-items: center;
}

.top {
  margin-bottom: 10px;
}

.bkngOption__title {
  font-size: 18px;
  font-weight: bold;
  color: #222;
}

.font16 {
  font-size: 16px;
}

.blackText {
  color: #111;
}

.appendTop5 {
  margin-top: 5px;
}

.appendTop10 {
  margin-top: 10px;
}

.appendTop16 {
  margin-top: 16px;
}

.appendTop20 {
  margin-top: 20px;
}

.incls {
  list-style: none;
  padding-left: 0;
}

.incls__item {
  display: flex;
  align-items: flex-start;
  margin-bottom: 0px;
}

.incls__iconholder {
  width: 24px;
  margin-right: 10px;
  margin-top: 4px;
}

.incls__iconholder img,
.incls__iconholder .sprite {
  width: 20px;
  height: 20px;
}

.incls__text {
  font-size: 14px;
  color: #333;
}

.defaultText {
  color: #999;
}

.onFcHover {
  position: relative;
  cursor: pointer;
}

.onFcHover:hover .FcDetails__outer {
  display: block;
}

.FcDetails__outer {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 10;
  width: 320px;
  background: #fff;
  border: 1px solid #ddd;
  padding: 10px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
  margin-top: 8px;
}

.rfnd__topBar {
  display: flex;
  margin-bottom: 10px;
}

.rfnd__topBar--col {
  flex: 1;
  text-align: center;
  position: relative;
}

.rfnd__topBar--oval {
  width: 10px;
  height: 10px;
  background: #1A7971;
  border-radius: 50%;
  margin: 0 auto 5px;
}

.rfnd__topBar--colText {
  font-size: 12px;
  font-weight: 600;
  color: #1A7971;
}

.rfnd__bottomBar {
  display: flex;
  justify-content: space-between;
  gap: 10px;
}

.rfnd__bottomBar--colText {
  font-size: 13px;
  font-weight: 600;
  color: #333;
}

.rfnd__bottomBar--colSubText {
  font-size: 12px;
  color: #777;
}

.lineThrough {
  text-decoration: line-through;
}

.midGreyText {
  color: #aaa;
}

.font14 {
  font-size: 14px;
}

.font28 {
  font-size: 28px;
}

.latoBlack {
  font-weight: 700;
}

.appendBottom5 {
  margin-bottom: 5px;
}

.appendLeft5 {
  margin-left: 5px;
}

.appendLeft30 {
  margin-left: 30px;
}

.makeRelative {
  position: relative;
}

.hintBoxWrapper .hintBox {
  display: none;
  position: absolute;
  top: 40px;
  left: 0;
  background: #fff;
  border: 1px solid #ddd;
  padding: 12px;
  z-index: 15;
  width: 300px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.hintBoxWrapper:hover .hintBox {
  display: block;
}

.hintBox .prcBrkpTooltip__body,
.hintBox .makeFlex {
  justify-content: space-between;
}

.appBtn {
  background-color: #008CFF;
  color: white;
  padding: 12px 25px;
  border: none;
  border-radius: 4px;
  font-weight: bold;
  cursor: pointer;
}

.appBtn.large {
  font-size: 16px;
}

.textBtn {
  background: none;
  border: none;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
}

.greenText {
  color: #1A7971;
}

ul.room-features.ps-3 li {
    line-height: 18px;
    margin: 0;
    padding-left: 0px;
    list-style-type: disc;
}


/* end hotel page detail */

/* header mmt */


/* ======= Header Nav Styles ======= */
.content {
    padding-top: 120px;
    padding-bottom: 60px;
}
.main-header {
    background: #ffffff;
}
.card {
    margin-top: 10px;
    margin-bottom: 10px;
}
.header-nav {
  width: 100%;
  background-color: #ffffff;
  box-shadow: 0 1px 4px rgb(100 100 100);
  padding: 5px 0;
  position: sticky;
  top: 0;
  z-index: 1000;
}

a.btn-box {
    background: linear-gradient(92deg, #53b2fe, #065af3);
    border-radius: 8px;
    box-shadow: 0 1px 7px 0 #0003;
    font-size: 11px;
    color: #ffffff;
    margin-top: auto;
    padding: 8px 20px;
}

.btn-box {
    background: linear-gradient(92deg, #53b2fe, #065af3);
    border-radius: 8px;
    box-shadow: 0 1px 7px 0 #0003;
    font-size: 11px;
    color: #ffffff;
    margin-top: auto;
    padding: 8px 20px;
}

.main-menu-wrapper {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

/* ======= Logo ======= */
.navbar-logo a {
  display: block;
}

.navbar-logo img.logo {
  height: 50px;
  width: auto;
  object-fit: contain;
}

/* ======= Nav Menu ======= */
#mobile-menu .main-nav {
  display: flex;
  align-items: center;
  gap: 0px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.main-nav .nav-item {
  position: relative;
}

.main-nav .nav-link {
    text-decoration: none;
    font-weight: 400;
    color: #333;
    font-size: 11px;
    transition: all 0.3s ease;
    display: grid;
    align-items: center;
    text-align: center;
    gap: 3px;
    background: none;
}

.main-nav .nav-link i {
  font-size: 16px;
  /* color: #0065b7; */
}

.main-nav .nav-link:hover,
.main-nav .nav-link.active {
  color: #0065b7;
}

/* ======= Contact Menu Item ======= */
.main-nav li a[href="contact-us.html"] {
  color: #444;
  font-weight: 500;
}

/* ======= Login Button ======= */
.header-btn .btn-white {
  font-weight: 500;
  font-size: 15px;
  padding: 8px 16px;
  border: none;
  border-radius: 8px;
  background-color: #0065b7;
  color: #fff;
  transition: background 0.3s ease;
}

.header-btn .btn-white:hover {
  background-color: #004a8f;
}

/* ======= Hamburger ======= */
.header__hamburger .isax {
  font-size: 24px;
  color: #333;
  cursor: pointer;
}

/* ======= Responsive Styles ======= */
@media (max-width: 991px) {
  #mobile-menu {
    display: none;
    width: 100%;
    background: #fff;
    padding: 15px;
    border-top: 1px solid #eee;
  }

  .header__hamburger {
    display: block;
  }

  .header-nav.active #mobile-menu {
    display: block;
  }

  .main-nav {
    flex-direction: column;
    gap: 12px;
  }

  .header-btn {
    justify-content: space-between;
    width: 100%;
    margin-top: 10px;
  }
}

@media (min-width: 992px) {
  .header__hamburger {
    display: none;
  }
}

.banner-form .form-info .form-item .form-control {
    font-size: 15px;
    font-weight: 600;
    padding: 0;
    background: transparent;
    border-color: transparent;
    box-shadow: none;
    min-height: 10px !important;
    line-height: .3;
}
    
.chSprite {
    background-image: url(../img/my.png);
    background-repeat: no-repeat;
    background-size: 155px 269px;
}

.user21{
    display: flex;
    gap: 7px;
}
.user {
    width: 38px;
    line-height: 1;
}
.userdata {
    font-size: 11px;
    font-weight: 500;
}



/* Base styles */
.nav-link {
  position: relative;
  display: inline-block;
 padding: 8px 5px;
  color: #333;
  text-decoration: none;
}

/* Tooltip style */
.nav-link::after {
  content: attr(data-trimmed);
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translateX(-50%);
  background-color: #333;
  color: #fff;
  white-space: nowrap;
  font-size: 12px;
  padding: 6px 10px;
  border-radius: 4px;
  opacity: 0;
  visibility: hidden;
  transition: 0.3s ease;
  pointer-events: none;
  z-index: 99;
}

/* Show on hover */
.nav-link:hover::after {
  opacity: 1;
  visibility: visible;
}



/* Common icon styles */
.tab-icon {
      display: inline-block;
    width: 36px;
    height: 33px;
    background-size: 100% auto;
    background-repeat: no-repeat;
    margin: 0 auto;
    text-align: center;
}

/* Sprite image for each tab */
.hotel-icon {
  background-image: url('../img/hotel.png');
  background-position: top;
}

.homestay-icon {
  background-image: url('../img/homestay.png');
  background-position: top;
}

.premium-villa-icon {
  background-image: url('../img/premium-villa21.png');
  background-position: top;
}

.holiday-icon {
  background-image: url('../img/holiday.png');
  background-position: top;
}

.contact-icon {
  background-image: url('../img/contact.png');
  background-position: top;
}

/* When active, show the bottom part of the sprite */
.nav-item.hotels.active .hotel-icon {
  background-position: bottom;
}

.nav-item.homestays.active .homestay-icon {
  background-position: bottom;
}

.nav-item.premium-villas.active .premium-villa-icon {
  background-position: bottom;
}

.nav-item.holiday-packages.active .holiday-icon {
  background-position: bottom;
}

.nav-link.contact.active .contact-icon {
  background-position: bottom;
}
 
/* header mmt */
/* 5-augus-t2025 */
/* hotel booking page */
.policy img {
    width: 43px;
    margin: 6px;
    border-radius: 7px;
}

/* end */


 .price-detail6 {
    border-radius: 40px;
    padding: 7px 10px;
    font-size: 11px;
    transition: all 0.5s;
    font-weight: 500;
}
    li.hotel-data-list {
        font-size: 12px;
    }
        p.text-primary.mb-2 {
        font-size: 11px;
    }

   .header-bar {
  position: fixed;       /* Fixed at the top */
  top: 0;
  left: 0;
  width: 100%;
  height: 50px;
  background-color: #ffffff; /* White background (change as needed) */
  box-shadow: 0 2px 4px rgba(0,0,0,0.1); /* Subtle shadow */
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 16px;
  z-index: 1000; /* Ensure it stays on top */
}

.header-icon {
    font-size: 16px;
    color: #6b6666;
    cursor: pointer;
}

.content.margin-class {
    margin-top: 60px;
}

.d-flex1 {
    display: flex;
}


/* hotel booking ki css 7-aug- 2025 */

.trip-body img {
    padding: 4px;
    border-radius: 8px;
    width: 50px;
}
        .price-card {

            background: #fff;
            border: 1px solid #ddd;
            border-radius: 6px;
            padding: 15px;
            box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        }

        .price-card h5 {
            font-weight: 600;
            margin-bottom: 15px;
        }

        .price-row {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin: 6px 0;
            font-size: 15px;
        }

        .price-row small {
            color: gray;
            display: block;
            font-size: 12px;
        }

        .discount {
            color: #00b15d;
            font-weight: 500;
        }

        .total-amount {
            font-weight: 600;
            font-size: 17px;
            border-top: 1px solid #ddd;
            padding-top: 8px;
            margin-top: 8px;
        }

        .coupon-card {

            background: #fff;
            border: 1px solid #ddd;
            border-radius: 6px;
            padding: 15px;
            box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        }

        .coupon-card h5 {
            font-weight: 600;
            margin-bottom: 15px;
        }

        .coupon-option {
            border: 2px solid #ddd;
            border-radius: 6px;
            padding: 10px;
            margin-bottom: 10px;
            cursor: pointer;
            position: relative;
        }

        .coupon-option.active {
            border-color: #007bff;
            background: #f0f8ff;
        }

        .coupon-option input[type="radio"] {
            position: absolute;
            top: 15px;
            left: 10px;
            transform: scale(1.2);
        }

        .coupon-code {
            font-weight: 600;
            color: #007bff;
            margin-left: 30px;
        }

        .coupon-desc {
            margin-left: 30px;
            font-size: 13px;
            color: #555;
        }

        .coupon-expire {
            display: inline-block;
            font-size: 12px;
            color: #a94442;
            border: 1px solid #e57373;
            padding: 2px 6px;
            border-radius: 12px;
            background: #fff0f0;
            margin-left: 30px;
            margin-top: 5px;
        }

        .gift-info {
            background: #fff4e5;
            color: #7a5a00;
            font-size: 13px;
            padding: 5px 8px;
            border-radius: 4px;
            margin-top: 10px;
        }

        .coupon-input {
            display: flex;
            margin-top: 10px;
            border: 1px solid #ddd;
            border-radius: 6px;
            overflow: hidden;
        }

        .coupon-input input {
            border: none;
            flex: 1;
            padding: 8px;
        }

        .coupon-input button {
            background: #007bff;
            color: #fff;
            border: none;
            padding: 0 15px;
        }

        /* .hotel-card {
            border: 1px solid #ddd;
            border-radius: 6px;
            padding: 15px;
            background: #fff;
            width: 800px;
        } */

        .hotel-title {
            font-weight: 700;
            font-size: 20px;
        }

        .hotel-info {
            font-size: 13px;
            color: #666;
        }

        .check-details {
            border-top: 1px dashed #ccc;
            border-bottom: 1px dashed #ccc;
            padding: 10px 0;
            margin: 10px 0;
            text-align: center;
        }

        .check-details div {
            flex: 1;
        }

        .room-features ul {
            padding-left: 20px;
            font-size: 14px;
        }

        .free-cancel {
            color: #00a651;
            font-weight: 500;
            font-size: 14px;
        }

        .refund-bar {
            display: flex;
            align-items: center;
            margin-top: 8px;
        }

        .refund-bar .bar {
            height: 8px;
            flex: 1;
            background: linear-gradient(to right, #00a651 50%, #f5c500 50%);
            border-radius: 5px;
            margin: 0 10px;
            position: relative;
        }

        .refund-bar .bar::after {
            content: "";
            position: absolute;
            left: 50%;
            top: -4px;
            width: 12px;
            height: 12px;
            background: white;
            border: 2px solid #00a651;
            border-radius: 50%;
        }

        .upgrade-box {
            border-top: 1px solid #eee;
            padding-top: 10px;
            margin-top: 10px;
        }

        .info-card {
            background: #fff;
            border: 1px solid #ddd;
            border-radius: 6px;
            padding: 15px;
            box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
            max-width: 900px;
        }

        .info-card h6 {
            font-weight: 700;
            font-size: 16px;
            margin-bottom: 10px;
        }

        .info-card ul {
            padding-left: 20px;
            margin-bottom: 5px;
        }

        .info-card ul li {
            font-size: 14px;
            margin-bottom: 6px;
        }

        .info-card a {
            font-size: 14px;
            text-decoration: none;
            color: #007bff;
            font-weight: 500;
        }

        .trip-card {
            background: #fff;
            border: 1px solid #ddd;
            border-radius: 6px;
            padding: 0;
            box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
            max-width: 900px;
            overflow: hidden;
        }

        .trip-header {
            background: #e6f8f0;
            padding: 10px 15px;
            font-size: 14px;
            color: #007a4d;
            display: flex;
            align-items: center;
            gap: 8px;
        }

        .trip-body {
            padding: 15px;
        }

        .trip-title {
            font-weight: 700;
            font-size: 16px;
        }

        .trip-subtitle {
            color: #00a0d2;
            font-size: 14px;
            margin-bottom: 10px;
        }

        .benefits-box {
            background: #f0f6ff;
            border-radius: 6px;
            padding: 10px;
            display: flex;
            justify-content: space-between;
            margin-bottom: 15px;
        }

        .benefits-list {
            font-size: 14px;
        }

        .benefits-list div {
            margin-bottom: 5px;
        }

        .benefit-title {
            font-weight: 500;
        }

        .benefit-price {
            text-align: right;
            white-space: nowrap;
        }

        .price-info {
            font-size: 14px;
            margin-bottom: 15px;
        }

        .radio-options label {
            display: block;
            padding: 8px;
            border: 1px solid #ddd;
            border-radius: 6px;
            margin-bottom: 8px;
            cursor: pointer;
        }

        .radio-options input[type="radio"] {
            margin-right: 8px;
        }

        .payment-card {
            background: #fff;
            border-radius: 6px;
            border: 1px solid #ddd;
            box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
            padding: 15px;
            max-width: 900px;
        }

        .payment-card h6 {
            font-weight: 600;
            margin-bottom: 15px;
        }

        .payment-option {
            border: 1px solid #ddd;
            border-radius: 6px;
            padding: 10px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 8px;
        }

        .payment-option input[type="radio"] {
            margin-right: 10px;
        }

        .payment-option.active {
            border-color: #007bff;
            background: #f0f8ff;
        }

        .option-details small {
            display: block;
            font-size: 13px;
            color: #555;
        }

        .pay-now-btn {
            background: linear-gradient(90deg, #007bff, #00a8ff);
            color: white;
            font-weight: 600;
            border: none;
            padding: 12px;
            width: 200px;
            border-radius: 6px;
            font-size: 16px;
        }
   

        .room-size {
    font-size: 13px;
}
.room-size img {
    width: 20px;
}


.bed-size {
    font-size: 13px;
}
.bed-size img {
    width: 20px;
}


.bath-size {
    font-size: 13px;
}
.bath-size img {
    width: 24px;
}

ul.dot-list {
    list-style-type: disc;
    font-size: 14px;
    margin-top: 11px;
}



 .imgThumbCont {
        height: 43px;
    position: relative;
    border-radius: 14px;
 }

.smokyBg {
    background: #000000b3;
}

._H .imgThumbCont:last-child .imgThumb {
    border-radius: 0 0 4px 0;
}
 .imgThumb {
    height: 100%;
    object-fit: cover;
    opacity: .8;
    overflow: hidden;
    transition: all .3s linear;
    width: 100%;
}

 .imgThumbList.imgThumbListPerNew .viewAllText {
    font-weight: 900;
}
 .viewAllText {
    align-items: center;
    backdrop-filter: blur(2px);
    border-radius: 0 0 4px 0;
    color: #fff;
    display: flex
;
    flex-direction: column;
    font-size: 9px;
    font-weight: 700;
    height: 100%;
    justify-content: center;
    left: 0;
    line-height: 15px;
    position: absolute;
    text-align: center;
    top: 0;
    width: 100%;
}


/* 11 august */
/* 
 .filterPills {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 25px rgba(0,0,0,0.1);
    padding: 20px;
    width: 350px;
  } */

  .filter-tags {
    list-style: none;
    padding: 0;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    /* margin-bottom: 20px; */
  }

  .filter-tag {
    border: 1px solid #d1d5db;
    background: #fff;
    padding: 8px 14px;
    font-size: 14px;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s;
  }

  .filter-tag:hover {
    border-color: #2563eb;
    background: rgba(37,99,235,0.05);
  }

  .view-btn {
    width: 100%;
    padding: 12px;
    background: #2563eb;
    color: white;
    font-size: 15px;
    font-weight: bold;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    transition: background 0.2s;
  }

  .view-btn:hover {
    background: #1e4fc3;
  }

  .primaryBtn1 {
    padding: 16px 45px;
    background-image: linear-gradient(96deg, #53b2fe, #065af3);
    box-shadow: 0 1px 7px 0 rgb(0 0 0 / 20%);
    display: inline-block;
    flex-shrink: 0;
    color: #fff;
    text-transform: uppercase;
    font-weight: 900;
    padding: 9px 20px;
    cursor: pointer;
    border-radius: 0px !important;
    width: 195px;
    height: 50px;
    font-size: 22px !important;
    outline: 0;
    border: 0;
    position: relative;
    top: 22px;
    text-align: center;
}


.fw-500 {
    font-weight: 500;
}
/* new card */