/* ========================================================================== 
   APD 28.0 · buscador expandible de la ficha y scroll natural
   ========================================================================== */

/* Los elementos con hidden nunca deben recuperar caja, hover ni foco por una
   regla histórica más específica. Esto elimina la X aislada bajo el header. */
body.single-listing .apd5-search-panel[hidden],
body.single-listing .apd5-search-backdrop[hidden],
body.single-listing .apd26-field-clear[hidden],
body.single-listing .apd16-search-clear[hidden],
body.single-listing .apd28-date-clear[hidden],
body.single-listing .apd15-date-view[hidden],
body.single-listing .apd26-recent-destinations[hidden] {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

body.single-listing .apd28-date-clear {
    display: none !important;
}

@media (min-width: 1180px) {
    /* En el detalle el header pertenece al flujo del documento. Por eso se va
       ocultando al girar la rueda, igual que en la referencia, y no reaparece
       ni salta entre estados sticky intermedios. */
    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context,
    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-compact {
        position: relative !important;
        inset: auto !important;
        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        left: auto !important;
        z-index: 5001 !important;
        width: 100% !important;
        height: 82px !important;
        min-height: 82px !important;
        overflow: visible !important;
        background: #ffffff !important;
        border-bottom: 1px solid #e7e7e7 !important;
        box-shadow: none !important;
        transform: none !important;
        transition: none !important;
    }

    body.single-listing .apd12-header-spacer {
        display: none !important;
        height: 0 !important;
    }

    /* Estado abierto: una sola expansión limpia, sin reconstrucción ni rebote. */
    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded {
        height: 162px !important;
        min-height: 162px !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-header-row {
        position: relative !important;
        width: min(calc(100vw - 96px), 1460px) !important;
        max-width: 1460px !important;
        height: 162px !important;
        min-height: 162px !important;
        margin: 0 auto !important;
        padding: 0 !important;
        display: block !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-logo {
        position: absolute !important;
        top: 18px !important;
        left: 0 !important;
        width: 108px !important;
        min-width: 108px !important;
        height: 44px !important;
        margin: 0 !important;
        display: flex !important;
        align-items: center !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-logo img {
        width: 108px !important;
        height: 44px !important;
        object-fit: contain !important;
        object-position: left center !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-header-actions {
        position: absolute !important;
        top: 22px !important;
        right: 0 !important;
        width: auto !important;
        height: 40px !important;
        margin: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        transform: none !important;
    }

    /* En el detalle abierto se muestran las tres categorías de la referencia. */
    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-main-nav {
        position: absolute !important;
        top: 8px !important;
        left: 50% !important;
        z-index: 24 !important;
        width: auto !important;
        height: 64px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: flex !important;
        align-items: flex-start !important;
        justify-content: center !important;
        gap: 22px !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: translateX(-50%) !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-main-nav > a:first-child {
        display: none !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-main-nav a {
        min-width: 106px !important;
        height: 64px !important;
        padding: 3px 8px 7px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 7px !important;
        color: #505050 !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-main-nav a > span {
        width: 34px !important;
        height: 34px !important;
        flex: 0 0 34px !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-main-nav a strong {
        font-size: 13px !important;
        line-height: 1 !important;
        font-weight: 500 !important;
        white-space: nowrap !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-main-nav a.is-active {
        color: #222222 !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-main-nav a.is-active::after {
        right: 7px !important;
        bottom: 0 !important;
        left: 7px !important;
        height: 2px !important;
        background: #222222 !important;
    }

    /* Segunda fila: misma geometría estable para los tres paneles. */
    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd19-detail-header-search {
        position: absolute !important;
        z-index: 30 !important;
        top: 80px !important;
        left: 50% !important;
        width: 680px !important;
        min-width: 680px !important;
        max-width: 680px !important;
        height: 54px !important;
        min-height: 54px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: translateX(-50%) !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd20-detail-search-home {
        display: none !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd19-detail-header-search .apd5-search,
    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd19-detail-header-search .apd5-search.has-open-panel {
        position: relative !important;
        width: 680px !important;
        min-width: 680px !important;
        max-width: 680px !important;
        height: 54px !important;
        min-height: 54px !important;
        padding: 0 86px 0 0 !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1.04fr) 1px minmax(0, 1fr) 1px minmax(0, .72fr) !important;
        align-items: center !important;
        border: 1px solid #dddddd !important;
        border-radius: 999px !important;
        background: #ebebeb !important;
        box-shadow: none !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-field,
    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-field > button:first-child {
        position: relative !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 52px !important;
        min-height: 52px !important;
        max-height: 52px !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-field > button:first-child {
        padding: 8px 24px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        justify-content: center !important;
        gap: 2px !important;
        border: 0 !important;
        border-radius: 999px !important;
        background: transparent !important;
        box-shadow: none !important;
        text-align: left !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-field > button:first-child:hover {
        background: #dddddd !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-field.is-open > button:first-child {
        z-index: 3 !important;
        background: #ffffff !important;
        box-shadow: 0 5px 16px rgba(0, 0, 0, .14) !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-field > button:first-child > span:not(.apd26-search-leading-icon),
    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-field > button:first-child > strong[id] {
        display: block !important;
        max-width: 100% !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        opacity: 1 !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-field > button:first-child > span:not(.apd26-search-leading-icon) {
        color: #222222 !important;
        font-size: 11px !important;
        line-height: 1.05 !important;
        font-weight: 600 !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-field > button:first-child > strong[id] {
        margin: 0 !important;
        color: #6a6a6a !important;
        font-size: 13px !important;
        line-height: 1.08 !important;
        font-weight: 400 !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd26-compact-summary,
    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd26-search-leading-icon {
        display: none !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-separator {
        position: static !important;
        z-index: 1 !important;
        width: 1px !important;
        height: 32px !important;
        margin: 0 !important;
        align-self: center !important;
        background: #d2d2d2 !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-submit,
    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search.has-open-panel .apd5-search-submit {
        position: absolute !important;
        z-index: 10 !important;
        top: 6px !important;
        right: 7px !important;
        width: 78px !important;
        min-width: 78px !important;
        max-width: 78px !important;
        height: 42px !important;
        min-height: 42px !important;
        max-height: 42px !important;
        margin: 0 !important;
        padding: 0 14px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 6px !important;
        border: 0 !important;
        border-radius: 999px !important;
        background: linear-gradient(145deg, #173f91, #004bd6) !important;
        color: #ffffff !important;
        box-shadow: none !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-submit .apd5-icon,
    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-submit svg {
        width: 16px !important;
        height: 16px !important;
        flex: 0 0 16px !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-submit > span {
        display: inline !important;
        color: #ffffff !important;
        font-size: 13px !important;
        line-height: 1 !important;
        font-weight: 700 !important;
    }

    /* Editor real de destino dentro de la casilla activa. */
    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-field[data-search-field="location"].is-open > button:first-child > * {
        opacity: 0 !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-field[data-search-field="location"].is-open .apd26-inline-editor {
        position: absolute !important;
        inset: 7px 42px 7px 24px !important;
        z-index: 6 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        justify-content: center !important;
        gap: 2px !important;
        pointer-events: auto !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-field[data-search-field="location"].is-open .apd26-inline-editor > span {
        display: block !important;
        color: #222222 !important;
        font-size: 11px !important;
        line-height: 1 !important;
        font-weight: 600 !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-field[data-search-field="location"].is-open .apd26-search-inline-input {
        width: 100% !important;
        min-width: 0 !important;
        height: 17px !important;
        padding: 0 !important;
        border: 0 !important;
        outline: 0 !important;
        background: transparent !important;
        color: #6a6a6a !important;
        font-size: 13px !important;
        line-height: 17px !important;
        font-weight: 400 !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-field[data-search-field="location"].is-open .apd26-field-clear:not([hidden]) {
        position: absolute !important;
        top: 50% !important;
        right: 13px !important;
        z-index: 8 !important;
        width: 24px !important;
        min-width: 24px !important;
        height: 24px !important;
        min-height: 24px !important;
        display: grid !important;
        place-items: center !important;
        border-radius: 50% !important;
        transform: translateY(-50%) !important;
    }

    /* Fuera del estado abierto no existe ningún control X en la pastilla. */
    body.single-listing:not(.apd-header-search-expanded) .apd19-detail-header-search .apd26-field-clear,
    body.single-listing:not(.apd-header-search-expanded) .apd19-detail-header-search .apd16-search-clear,
    body.single-listing:not(.apd-header-search-expanded) .apd19-detail-header-search .apd28-date-clear {
        display: none !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-field[data-search-field="dates"].is-open .apd28-date-clear:not([hidden]) {
        position: absolute !important;
        top: 50% !important;
        right: 12px !important;
        z-index: 8 !important;
        width: 24px !important;
        min-width: 24px !important;
        max-width: 24px !important;
        height: 24px !important;
        min-height: 24px !important;
        max-height: 24px !important;
        padding: 0 !important;
        display: grid !important;
        place-items: center !important;
        border: 0 !important;
        border-radius: 50% !important;
        background: #ebebeb !important;
        color: #222222 !important;
        font: 400 17px/1 Arial, sans-serif !important;
        transform: translateY(-50%) !important;
        cursor: pointer !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-field[data-search-field="dates"]:has(.apd28-date-clear:not([hidden])) > button:first-child {
        padding-right: 45px !important;
    }

    /* Paneles: tamaño y ubicación equivalentes a las tres referencias. */
    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-panel {
        top: 64px !important;
        z-index: 60 !important;
        border: 1px solid #e5e5e5 !important;
        border-radius: 24px !important;
        background: #ffffff !important;
        box-shadow: 0 14px 38px rgba(0, 0, 0, .18) !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-location-panel {
        left: 0 !important;
        right: auto !important;
        width: 340px !important;
        max-width: min(340px, calc(100vw - 40px)) !important;
        max-height: 435px !important;
        padding: 24px 18px 18px !important;
        transform: none !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-date-panel,
    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-date-panel.is-flexible-mode {
        right: auto !important;
        left: 50% !important;
        width: 680px !important;
        max-width: calc(100vw - 48px) !important;
        min-height: 0 !important;
        padding: 27px 28px 28px !important;
        transform: translateX(-50%) !important;
        overflow: hidden !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-guests-panel {
        right: 0 !important;
        left: auto !important;
        width: 340px !important;
        max-width: min(340px, calc(100vw - 40px)) !important;
        padding: 20px 28px !important;
        transform: none !important;
    }

    /* En escritorio los paneles no llevan una X propia. Se cierran al cambiar
       de campo, hacer clic afuera o presionar Escape, igual que la referencia. */
    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-panel > .apd5-panel-title,
    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-search-panel > .apd5-panel-footer {
        display: none !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-date-panel .apd5-calendar-months {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 46px !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-date-panel .apd5-calendar-weekdays span,
    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-date-panel .apd5-calendar-days button,
    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-date-panel .apd5-calendar-days > span {
        width: 38px !important;
        height: 38px !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-date-panel .apd15-date-flexibility {
        flex-wrap: nowrap !important;
        gap: 8px !important;
    }

    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-guests-panel .apd5-guest-row {
        min-height: 74px !important;
        padding: 13px 0 !important;
    }

    /* La capa oscura cubre únicamente la página: el header y el panel quedan
       blancos por pertenecer al contexto superior. */
    body.single-listing .apd5-search-backdrop:not([hidden]) {
        position: fixed !important;
        inset: 0 !important;
        z-index: 4990 !important;
        display: block !important;
        background: rgba(0, 0, 0, .38) !important;
        pointer-events: auto !important;
    }

    /* Cuando la barra de secciones ya está activa, el header original quedó
       fuera de la ventana y no debe reaparecer por CSS histórico. */
    body.single-listing.apd19-detail-nav-visible:not(.apd-header-search-expanded) .apd5-header.is-detail-context .apd19-detail-header-search,
    body.single-listing.apd18-detail-nav-visible:not(.apd-header-search-expanded) .apd5-header.is-detail-context .apd19-detail-header-search {
        display: block !important;
    }

    body.single-listing .apd52-detail-nav {
        top: 0 !important;
    }
}

@media (min-width: 1180px) and (max-width: 1450px) {
    body.single-listing.apd-marketplace-ui .apd5-header.is-detail-context.is-search-expanded .apd5-header-row {
        width: calc(100vw - 64px) !important;
    }
}
