/* Shared Hotels search form: loaded by both landing and results pages. */
[data-hotel-search-form] {
    width: 100%;
    max-width: none;
}

[data-hotel-search-form] .hotel-search-params {
    overflow: visible;
}

[data-hotel-search-form] .search-field--hotel-destination {
    min-width: 0;
}

[data-hotel-search-form] .search-field_passengers input[readonly],
[data-hotel-search-form] [data-hotel-search-role="date-range"],
[data-hotel-search-form] [data-hotel-search-role="date-range"] input[readonly] {
    cursor: pointer;
}

/* Keep the floating range calendar above the sticky results search bar. */
.page-hotel-search-results .flatpickr-calendar.flatpickr-calendar--airtrack-range {
    z-index: 1100 !important;
}

[data-hotel-guests-modal] {
    z-index: 1055;
}

[data-hotel-guests-modal][data-desktop-open="true"] {
    z-index: 1200;
}

/* Desktop guests popover: the modal element, dialog and modal-content are
   positioning wrappers only. `.passenger-details` is the single painted
   surface, using the product's existing rounded popover styling. */
@media (min-width: 1025px) {
    [data-hotel-guests-modal][data-desktop-open="true"],
    [data-hotel-guests-modal][data-desktop-open="true"] > .modal-dialog,
    [data-hotel-guests-modal][data-desktop-open="true"] > .modal-dialog > .modal-content {
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        outline: 0 !important;
        overflow: visible !important;
    }

    [data-hotel-guests-modal][data-desktop-open="true"]::before,
    [data-hotel-guests-modal][data-desktop-open="true"]::after,
    [data-hotel-guests-modal][data-desktop-open="true"] > .modal-dialog::before,
    [data-hotel-guests-modal][data-desktop-open="true"] > .modal-dialog::after,
    [data-hotel-guests-modal][data-desktop-open="true"] > .modal-dialog > .modal-content::before,
    [data-hotel-guests-modal][data-desktop-open="true"] > .modal-dialog > .modal-content::after {
        content: none !important;
        display: none !important;
    }

    [data-hotel-guests-modal][data-desktop-open="true"] .passenger-details {
        max-height: calc(100vh - 24px);
        overflow-y: auto;
    }
}

[data-hotel-search-form] .hs-search-notice {
    margin: 10px 0 0;
    font-family: "Open Sans", sans-serif;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    color: #dc2626;
    text-align: center;
}

.hotel-search-form__cancel {
    display: none !important;
}

@media (min-width: 1025px) {
    [data-hotel-search-form] .search-field--hotel-destination {
        flex: 2.5 1 220px;
    }

    [data-hotel-search-form] .search-field.date-group {
        flex: none;
        width: 300px;
        min-width: 260px;
    }

    [data-hotel-search-form] .search-field_passengers {
        flex: 0 1 200px;
        min-width: 170px;
        max-width: 220px;
    }

    [data-hotel-search-form] .search-field_passengers input {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

@media (max-width: 1024px) {
    .hotel-search-compact .flight-search-compact__body {
        border-radius: 10px;
    }

    .hotel-search-compact .flight-search-compact__summary,
    .hotel-search-compact .flight-search-compact__details {
        min-width: 0;
    }

    .hotel-search-compact .flight-search-compact__details {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .hotel-mobile-search-modal .hotel-search-form {
        width: 100%;
    }

    .hotel-mobile-search-modal .hotel-search-form .hotel-search-params {
        border-radius: 10px;
    }

    .hotel-mobile-search-modal .mobile-search-modal__body
    .hotel-search-form .hotel-search-form__actions {
        display: flex;
        flex-direction: row;
        align-items: stretch;
        gap: 12px;
        width: 100%;
        padding: 16px 20px;
        border: 0;
    }

    .hotel-mobile-search-modal .hotel-search-form__cancel {
        display: flex !important;
    }

    .hotel-mobile-search-modal .hotel-search-form__actions .search-button {
        flex: 1;
        width: auto;
        max-width: none;
        margin: 0;
    }

    /* Hotel pickers reuse Price Tracker modal shells; only hotel-specific tweaks. */
    [data-hotel-mobile-picker="destination"] .location-modal__section--results {
        margin: 0;
    }

    [data-hotel-mobile-picker="destination"] .location-modal__empty {
        padding: 18px 0;
        color: #6e7279;
        font-size: 14px;
        line-height: 1.5;
        text-align: center;
    }

    [data-hotel-mobile-picker="destination"] .location-modal__result {
        align-items: center;
    }

    [data-hotel-mobile-picker="destination"] .location-modal__result.is-active,
    [data-hotel-mobile-picker="destination"] .location-modal__result:focus-visible {
        outline: 2px solid #1b99e0;
        outline-offset: -2px;
        background: #f0f9ff;
    }

    [data-hotel-mobile-picker="destination"] .location-modal__result-icon svg {
        width: 22px;
        height: 22px;
    }

    [data-hotel-mobile-picker="destination"] .location-modal__result-code {
        color: #6e7279;
        font-size: 13px;
    }

    [data-hotel-mobile-picker="guests"] .pcm-row {
        min-height: 68px;
    }
}

@media (min-width: 576px) and (max-width: 1024px) {
    [data-hotel-search-form] .hotel-search-params .search-field--hotel-destination,
    [data-hotel-search-form] .hotel-search-params .search-field.date-group {
        width: 100%;
        flex: 1 1 100%;
        max-width: 100%;
    }

    [data-hotel-search-form] .hotel-search-params .search-field--hotel-destination {
        border-right: none;
    }
}