body {
    background: #f7f9fc;
}

.hb-live-search-wrap {
    background: #fff;
    border-bottom: 1px solid #e8edf4;
    padding: 0 0 1.5rem;
}

.hb-live-search-form {
    align-items: end;
    background: #fff;
    border: 1px solid #e1e8f2;
    border-radius: 16px;
    box-shadow: 0 14px 40px rgba(17, 38, 75, 0.10);
    display: grid;
    gap: .8rem;
    grid-template-columns: minmax(210px, 2fr) repeat(2, minmax(145px, 1fr)) repeat(3, 86px) 120px;
    margin-top: -28px;
    padding: 1rem;
    position: relative;
    z-index: 10;
}

.hb-search-field {
    min-width: 0;
    position: relative;
}

.hb-search-field label {
    color: #24324b;
    display: block;
    font-size: .76rem;
    font-weight: 700;
    margin: 0 0 .4rem;
}

.hb-search-field .form-control {
    border-color: #dce4ef;
    min-height: 46px;
}

.hb-input-icon {
    position: relative;
}

.hb-input-icon > i {
    color: #4662f2;
    left: .85rem;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
}

.hb-input-icon .form-control {
    padding-left: 2.35rem;
}

.hb-search-button {
    align-items: center;
    display: flex;
    gap: .5rem;
    justify-content: center;
    min-height: 46px;
}

.hb-destination-suggestions {
    background: #fff;
    border: 1px solid #e1e8f2;
    border-radius: 12px;
    box-shadow: 0 18px 45px rgba(17, 38, 75, .16);
    left: 0;
    max-height: 320px;
    overflow-y: auto;
    padding: .4rem;
    position: absolute;
    right: 0;
    top: calc(100% + .4rem);
    z-index: 1000;
}

.hb-destination-option {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 9px;
    color: #17213a;
    display: flex;
    gap: .7rem;
    padding: .7rem .75rem;
    text-align: left;
    width: 100%;
}

.hb-destination-option:hover {
    background: #f2f5ff;
}

.hb-destination-option:focus-visible,
.listing-title a:focus-visible,
.listing-view-button:focus-visible,
.listing-wishlist-btn:focus-visible {
    outline: 3px solid #3155e7;
    outline-offset: 3px;
}

.listing-title a {
    color: inherit;
    text-decoration: none;
}

.listing-view-button {
    text-decoration: none;
}

.hb-destination-option i {
    color: #4662f2;
}

.hb-destination-option span {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.hb-destination-option small {
    color: #7b879d;
}

.hb-filter-panel {
    position: sticky;
    top: 92px;
}

.hb-filter-panel .filter-group {
    margin-bottom: 1.4rem;
}

.hb-sort-select {
    max-width: 205px;
}

.hb-loading-state,
.hb-empty-state {
    align-items: center;
    background: #fff;
    border: 1px solid #e4eaf2;
    border-radius: 18px;
    box-shadow: 0 10px 30px rgba(20, 36, 64, .06);
    display: flex;
    flex-direction: column;
    gap: 1rem;
    justify-content: center;
    min-height: 260px;
    padding: 2rem;
    text-align: center;
}

.hb-live-card {
    margin-bottom: 1rem;
}

.hb-live-card .listing-star-row {
    color: #f5ad18;
    font-size: 1rem;
    letter-spacing: .08em;
}

.hb-live-card .listing-facilities .is-refundable {
    background: #e9f8ef;
    color: #16884a;
}

.hb-live-card .hb-tax-note {
    display: block;
    margin: .25rem 0 .8rem;
    max-width: 150px;
}

.hb-live-card .listing-price-column {
    min-width: 155px;
}

.hotel-results.grid-view #hb-results-list {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.hotel-results.grid-view .premium-listing-card {
    display: flex;
    flex-direction: column;
    margin-bottom: 0;
}

.hotel-results.grid-view .listing-image-column {
    height: 220px;
    width: 100%;
}

.hotel-results.grid-view .premium-listing-img {
    height: 100%;
    width: 100%;
}

.hotel-results.grid-view .listing-content {
    display: flex;
    flex: 1;
    flex-direction: column;
}

.hotel-results.grid-view .listing-price-column {
    align-items: flex-start;
    border-left: 0;
    border-top: 1px solid #edf1f6;
    margin-top: 1rem;
    padding-left: 0;
    padding-top: 1rem;
    text-align: left;
}

@media (max-width: 1199.98px) {
    .hb-live-search-form {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }

    .hb-destination-field {
        grid-column: span 2;
    }

    .hb-search-button {
        grid-column: span 1;
    }
}

@media (max-width: 991.98px) {
    .hb-live-search-form {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        margin-top: 1rem;
    }

    .hb-destination-field {
        grid-column: 1 / -1;
    }

    .hb-compact-field,
    .hb-search-button {
        grid-column: span 1;
    }

    .hb-filter-panel {
        position: static;
    }
}

@media (max-width: 767.98px) {
    .hotel-results.grid-view #hb-results-list {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575.98px) {
    .hb-live-search-form {
        grid-template-columns: 1fr;
    }

    .hb-destination-field,
    .hb-compact-field,
    .hb-search-button {
        grid-column: auto;
    }

    .hb-sort-select {
        max-width: none;
        width: 100%;
    }
}

/* ==========================================================================
   Responsive hotel grid
   Desktop: 3 cards | Tablet: 2 cards | Phone: 1 card
   ========================================================================== */

.hotel-results.grid-view #hb-results-list {
    align-items: stretch;
    display: grid;
    gap: 1.25rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.hotel-results.grid-view .hb-live-card,
.hotel-results.grid-view .premium-listing-card {
    height: 100%;
    margin: 0;
    min-width: 0;
    overflow: hidden;
    width: 100%;
}

.hotel-results.grid-view .premium-listing-card {
    display: flex;
    flex-direction: column;
}

.hotel-results.grid-view .listing-image-column {
    flex: 0 0 auto;
    height: 210px;
    min-height: 210px;
    width: 100%;
}

.hotel-results.grid-view .premium-listing-img {
    display: block;
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.hotel-results.grid-view .listing-content {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-width: 0;
    padding: 1.25rem;
}

.hotel-results.grid-view .listing-main {
    flex: 1 1 auto;
    min-width: 0;
}

.hotel-results.grid-view .listing-title {
    display: -webkit-box;
    font-size: 1.35rem;
    line-height: 1.25;
    margin-bottom: .75rem;
    min-height: 3.4rem;
    overflow: hidden;
    overflow-wrap: anywhere;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.hotel-results.grid-view .listing-location {
    margin-bottom: .6rem;
}

.hotel-results.grid-view .listing-facilities,
.hotel-results.grid-view .listing-tags {
    align-items: flex-start;
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
}

.hotel-results.grid-view .listing-facilities span,
.hotel-results.grid-view .listing-tags span {
    max-width: 100%;
    overflow-wrap: anywhere;
}

.hotel-results.grid-view .listing-price-column {
    align-items: stretch;
    border-left: 0;
    border-top: 1px solid #edf1f6;
    display: flex;
    flex-direction: column;
    margin-top: 1rem;
    min-width: 0;
    padding: 1rem 0 0;
    text-align: left;
    width: 100%;
}

.hotel-results.grid-view .listing-current-price {
    font-size: 1.8rem;
}

.hotel-results.grid-view .hb-tax-note {
    max-width: none;
}

.hotel-results.grid-view .listing-view-button {
    justify-content: center;
    margin-top: auto;
    width: 100%;
}

/* Tablet */
@media (min-width: 768px) and (max-width: 1199.98px) {
    .hotel-results.grid-view #hb-results-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Phone */
@media (max-width: 767.98px) {
    .hotel-results.grid-view #hb-results-list {
        grid-template-columns: minmax(0, 1fr);
    }

    .hotel-results.grid-view .listing-image-column {
        height: 230px;
        min-height: 230px;
    }

    .hotel-results.list-view .premium-listing-card,
    .hotel-results.list-view .listing-content {
        display: flex;
        flex-direction: column;
    }

    .hotel-results.list-view .listing-image-column {
        height: 220px;
        width: 100%;
    }

    .hotel-results.list-view .listing-price-column {
        align-items: stretch;
        border-left: 0;
        border-top: 1px solid #edf1f6;
        margin-top: 1rem;
        padding: 1rem 0 0;
        text-align: left;
        width: 100%;
    }

    .hotel-results.list-view .listing-view-button {
        justify-content: center;
        width: 100%;
    }
}

/* Premium results-page search bar */
.hb-live-search-wrap{background:linear-gradient(120deg,#183b40,#70615d);padding:1.25rem 0 1.5rem}.hb-live-search-form{grid-template-columns:minmax(250px,2.2fr) repeat(2,minmax(160px,1.15fr)) minmax(280px,1.8fr) 145px;gap:0;margin-top:0;padding:12px;border:1px solid rgba(255,255,255,.22);border-radius:22px;background:rgba(49,41,43,.8);box-shadow:0 20px 48px rgba(9,28,32,.22)}.hb-live-search-form>.hb-search-field,.hb-live-search-form>.hb-search-button{margin:0;padding-left:14px;padding-right:14px;border-right:1px solid rgba(255,255,255,.3)}.hb-live-search-form>.hb-search-button{border-right:0}.hb-live-search-form .hb-search-field>label,.hb-results-field-label{display:block;margin:0 0 .45rem;color:#fff;font-size:.75rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase}.hb-live-search-form .form-control,.hb-results-guests-trigger{min-height:54px;border:1px solid #dce4e8;border-radius:13px;background:#fff}.hb-input-icon>i{color:#ef5a36}.hb-search-button{min-height:54px;border:0;border-radius:13px;background:linear-gradient(135deg,#ff6b3d,#ed4e2c);font-weight:800;box-shadow:0 12px 24px rgba(237,78,44,.28)}.hb-results-guests-trigger{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;width:100%;padding:0 14px;color:#17231f;font-weight:750;text-align:left}.hb-results-guests-trigger>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hb-results-guests-trigger i{color:#ef5a36}.hb-results-guests-popover{position:absolute;z-index:60;top:calc(100% + 10px);right:155px;width:min(520px,calc(100% - 24px));max-height:70vh;overflow:auto;padding:22px;border:1px solid #e2e8e7;border-radius:20px;background:#fff;box-shadow:0 26px 65px rgba(10,27,34,.25)}.hb-results-guests-popover[hidden]{display:none}.hb-results-popover-head{display:flex;align-items:flex-start;justify-content:space-between;padding-bottom:15px;border-bottom:1px solid #e7ebea}.hb-results-popover-head small{color:#ef5a36;font-weight:900;letter-spacing:.12em}.hb-results-popover-head h2{margin:3px 0 0;font-size:1.3rem;font-weight:850}.hb-results-popover-head button{width:40px;height:40px;border:0;border-radius:50%;background:#f2f5f4}.hb-results-room-list{display:grid;gap:10px;margin-top:15px}.hb-results-room-card{margin:0;padding:12px;border:1px solid #e1e8e6;border-radius:14px;background:#f8faf9}.hb-results-room-card legend{float:none;width:auto;margin:0 0 8px;font-size:.9rem;font-weight:800}.hb-results-room-card label{color:#65716d!important;text-transform:none!important;letter-spacing:0!important}.hb-results-guests-done{width:100%;min-height:48px;margin-top:16px;border:0;border-radius:11px;background:#202426;color:#fff;font-weight:800}
@media(max-width:1199.98px){.hb-live-search-form{grid-template-columns:repeat(6,minmax(0,1fr))}.hb-destination-field{grid-column:span 6}.hb-live-search-form>.hb-search-field{grid-column:span 3;padding:9px;border-right:0}.hb-results-guests-field{grid-column:span 4!important}.hb-live-search-form>.hb-search-button{grid-column:span 2;padding:9px}.hb-results-guests-popover{right:12px}}
@media(max-width:767.98px){.hb-live-search-form>.hb-search-field,.hb-results-guests-field,.hb-live-search-form>.hb-search-button{grid-column:span 6!important}.hb-results-guests-popover{position:fixed;inset:auto 12px 12px;width:auto;max-height:82vh}}

@media (prefers-reduced-motion: reduce) {
    .hb-live-card,
    .hb-destination-option,
    .listing-view-button { scroll-behavior: auto; transition: none !important; }
}

