/* APD 551 — final interaction-integrity and Airbnb-grade mobile polish. */

:root {
    --apd551-heart: #ff385c;
    --apd551-ink: #222222;
    --apd551-line: #dddddd;
}

/* Quick-filter rail: no divider may cross or touch the pills. Every pill keeps
   the same geometry in both states, preventing layout movement on selection. */
.apd53-filter-strip {
    border: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
}

.apd53-filter-strip::before,
.apd53-filter-strip::after,
.apd53-filter-scroll::before,
.apd53-filter-scroll::after,
.apd53-filter-inner::before,
.apd53-filter-inner::after {
    content: none !important;
    display: none !important;
}

.apd53-filter-scroll {
    scrollbar-width: none;
    overscroll-behavior-x: contain;
    scroll-snap-type: none !important;
    -webkit-overflow-scrolling: touch;
}

.apd53-filter-scroll::-webkit-scrollbar {
    display: none;
}

.apd53-filter-inner {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 10px !important;
    min-width: max-content !important;
    padding: 10px 18px 12px !important;
    border: 0 !important;
}

.apd534-quick-chip,
.apd53-filter-inner > a,
.apd53-filter-inner > button {
    position: relative !important;
    flex: 0 0 auto !important;
    min-height: 46px !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 20px !important;
    border: 2px solid var(--apd551-line) !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    transform: none !important;
    white-space: nowrap !important;
    line-height: 42px !important;
    transition: border-color .12s ease, background-color .12s ease, color .12s ease !important;
}

.apd534-quick-chip.is-active,
.apd534-quick-chip[aria-pressed="true"],
.apd53-filter-inner > a.is-active,
.apd53-filter-inner > button.is-active,
.apd53-filter-inner > button[aria-pressed="true"] {
    border-color: var(--apd551-ink) !important;
    background: #ffffff !important;
    color: var(--apd551-ink) !important;
    box-shadow: inset 0 0 0 1px var(--apd551-ink) !important;
    transform: none !important;
}

.apd534-quick-chip:active,
.apd53-filter-inner > a:active,
.apd53-filter-inner > button:active {
    transform: none !important;
}

/* Unified favorite target across discovery, results, map previews, listings,
   experiences and services. The canonical controllers keep owning state. */
.apd5-favorite,
.add_fav[data-listid],
[data-apd-favorite],
[data-apd-favorite-button],
.apd534-map-preview-heart,
.apd547-card-heart,
.apd-listing-heart,
.homey_favorite {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    padding: 7px !important;
    border-radius: 999px !important;
    box-sizing: border-box !important;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

.apd5-favorite svg,
.add_fav[data-listid] svg,
[data-apd-favorite] svg,
[data-apd-favorite-button] svg,
.apd534-map-preview-heart svg,
.apd547-card-heart svg,
.apd-listing-heart svg,
.homey_favorite svg {
    width: 28px !important;
    height: 28px !important;
}

.apd5-favorite.is-favorite,
.apd5-favorite[aria-pressed="true"],
.add_fav[data-listid].is-favorite,
.add_fav[data-listid][aria-pressed="true"],
[data-apd-favorite].is-favorite,
[data-apd-favorite][aria-pressed="true"],
[data-apd-favorite-button].is-favorite,
[data-apd-favorite-button][aria-pressed="true"],
.apd534-map-preview-heart.is-favorite,
.apd547-card-heart.is-favorite,
.apd-listing-heart.is-favorite,
.homey_favorite.is-favorite {
    color: var(--apd551-heart) !important;
}

.apd5-favorite.is-favorite svg,
.apd5-favorite[aria-pressed="true"] svg,
.add_fav[data-listid].is-favorite svg,
.add_fav[data-listid][aria-pressed="true"] svg,
[data-apd-favorite].is-favorite svg,
[data-apd-favorite][aria-pressed="true"] svg,
[data-apd-favorite-button].is-favorite svg,
[data-apd-favorite-button][aria-pressed="true"] svg,
.apd534-map-preview-heart.is-favorite svg,
.apd547-card-heart.is-favorite svg,
.apd-listing-heart.is-favorite svg,
.homey_favorite.is-favorite svg {
    fill: var(--apd551-heart) !important;
    stroke: #ffffff !important;
}

/* The sheet remains draggable from its handle while images/cards themselves
   participate naturally in vertical scrolling. */
.apd53-results-pane {
    touch-action: pan-y !important;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch !important;
}

.apd53-result-card,
.apd53-result-image,
.apd547-result-gallery,
.apd547-result-gallery-track,
.apd547-result-gallery img {
    touch-action: pan-x pan-y pinch-zoom !important;
}

.apd53-result-card[data-apd-listing-url],
.apd534-map-preview[data-apd-listing-url] {
    cursor: pointer;
}

.apd53-result-card[data-apd-listing-url]:focus-visible,
.apd534-map-preview[data-apd-listing-url]:focus-visible {
    outline: 3px solid rgba(34, 34, 34, .32);
    outline-offset: 4px;
}

/* A listing must always be a real, fully scrollable document. */
html.apd551-single-listing-root,
html.apd551-single-listing-root body,
body.single-listing {
    min-height: 100% !important;
    height: auto !important;
    max-height: none !important;
    overflow-y: auto !important;
    overscroll-behavior-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
}

body.single-listing .apd52-listing-page,
body.single-listing main.apd52-listing-page,
body.single-listing .listing-page-content {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

/* Returning-user mode uses one action only. Prevent the generic identifier
   form and its duplicate Continue button from leaking below the welcome UI. */
#apd5-auth-modal [hidden] {
    display: none !important;
}

#apd5-auth-modal.apd471-screen-returning #apd5-auth-identifier-form,
body.single-listing #apd5-auth-modal.apd471-screen-returning #apd5-auth-identifier-form,
#apd5-auth-modal.apd471-screen-returning .apd5-auth-identifier-form {
    display: none !important;
}

@media (max-width: 767px) {
    .apd53-filter-inner {
        gap: 10px !important;
        padding-inline: 16px !important;
    }

    .apd534-quick-chip,
    .apd53-filter-inner > a,
    .apd53-filter-inner > button {
        min-height: 44px !important;
        padding-inline: 18px !important;
        line-height: 40px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .apd534-quick-chip,
    .apd53-filter-inner > a,
    .apd53-filter-inner > button {
        transition: none !important;
    }
}

/* APD 553 — clean mobile quick-filter rail.
   APD 534's scoped rule carried a one-pixel bottom divider with greater
   specificity than the generic APD 551 reset. Own that exact surface here so
   the rail finishes as clean white space while every pill keeps its own border. */
@media (max-width: 767px) {
    html body.apd534-airbnb-results #apd53-search-page > .apd53-filter-strip {
        border: 0 !important;
        border-bottom: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
        background-image: none !important;
    }

    html body.apd534-airbnb-results #apd53-search-page > .apd53-filter-strip::before,
    html body.apd534-airbnb-results #apd53-search-page > .apd53-filter-strip::after,
    html body.apd534-airbnb-results #apd53-search-page > .apd53-filter-strip > .apd53-filter-inner::before,
    html body.apd534-airbnb-results #apd53-search-page > .apd53-filter-strip > .apd53-filter-inner::after {
        content: none !important;
        display: none !important;
        border: 0 !important;
        box-shadow: none !important;
        background: transparent !important;
    }
}
