.responsive-width {
    max-width: 100%;
}

@media (min-width: 1024px) {
    .responsive-width {
        max-width: 50%;
    }
}

.thumb-carousel-wrapper {
    position: relative;
    padding: 0 30px; 
}

.custom-thumb-prev,
.custom-thumb-next,
.custom-room-thumb-prev,
.custom-room-thumb-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    color: #7865fc;
    border: none;
    border-radius: 50%;
    z-index: 10;
    cursor: pointer;
}

.custom-thumb-prev {
    left: 0;
}

.custom-room-thumb-prev {
    left: 0;
}

.custom-thumb-next {
    right: 0;
}

.custom-room-thumb-next {
    right: 0;
}

.footerHeight {
    height: 600px; /* Default for larger screens */
}

.aboutImageSection {
    margin-top: -87px;
}

.aboutDescriptionArea {
    margin-top: -62px;
}

.aboutCtaArea {
    margin-top: -78px;
    margin-bottom: -99px;
}

.contactArea {
    margin-top: -64px;
    margin-bottom: -68px;
}

.searchInfoRow{
    margin-top: -59px;
}

.searchBannerRow {
    margin-top: -70px;
}

.searchPopularRoomType {
    margin-top: -70px;
    margin-bottom: -79px;
}

.hotelDetailMap {
    margin-bottom: -99px;
}

.card-font {
    font-size: 14px;
}

.price-font {
    font-size: 14px;
}

.HotelCardContainer {
    height: 100vh; /* or calc(100vh - footer height) if fixed footer */
    overflow-y: auto;
    overflow-x: hidden;
    padding-bottom: 45px;
}

.List-padding-top {
    padding-top: 90px;
}

@media (max-width: 768px) {
    .sort-mob-top{
        margin-top:154px;
    }

    .theme-btn {
        padding: 11px 8px;
    }

    .sortbydefaultmargin {
        margin-top: 140px;
    }

     #offcanvasBottom {
        height: 70vh !important;
        max-height: 100vh;
    }

     #price-range1 {
        width: 100%;
        touch-action: pan-y; /* Important for mobile touch gestures */
    }

    .noUi-connect {
        background: #7865fc!important;
    }

    .footerHeight {
        height: 765px; 
    }

    .aboutDescriptionArea {
        margin-top: -153px;
    }

    .aboutWhybookArea {
        margin-top: -46px;
    }

    .searchBannerRow {
        margin-top: -113px;
    }

    .hotelDetailMobile {
        margin-bottom: -72px;
    }

    .hotelDetailMap {
        margin-bottom: 0px;
    }

    .searchFooterMobile {
        margin-bottom: -82px;
    }

    .searchPopularRoomType {
        margin-bottom: 0px;
    }

    .card-font{
        font-size:12px;
    }

    .price-font {
        font-size: 13px;
    }

    .sort-margin-top {
        margin-top: 150px;
    }

    .HotelCardContainer {
        padding-bottom:0px !important;
    }

    .booking-sort {
        justify-content: center;
    }

    .List-padding-top {
        padding-top: 120px;
    }
   
}