/* ========================================================================== 
   APD 162.0 — homepage search geometry parity
   Supplied-reference corrections:
   1) 64px desktop capsule, 48px action with 8px optical inset.
   2) Hover fill occupies the complete Lugar/Fechas/Viajeros segment.
   3) Buscar is anchored to the search form, never to the header.
   4) Guest clear X sits immediately left of Buscar after a count is added.
   ========================================================================== */

@media (min-width: 1180px) {
    /* The screenshot reference uses a 64px discovery capsule. Keeping the
       form itself as the containing block also fixes the historical downward
       jump of Buscar while Viajeros is open. */
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search.apd5-search {
        position: relative !important;
        height: 64px !important;
        min-height: 64px !important;
        max-height: 64px !important;
        align-items: stretch !important;
        box-sizing: border-box !important;
    }

    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search .apd5-search-field {
        position: relative !important;
        height: 100% !important;
        min-height: 100% !important;
        align-self: stretch !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    /* Use a field-sized paint layer for hover instead of relying on a legacy
       button box. This removes the visible white strip along the lower edge. */
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search .apd5-search-field::before {
        content: "" !important;
        position: absolute !important;
        inset: 0 !important;
        z-index: 0 !important;
        display: block !important;
        border-radius: 999px !important;
        background: transparent !important;
        box-shadow: none !important;
        pointer-events: none !important;
        transition: background-color .16s ease !important;
    }

    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search .apd5-search-field > button:first-child {
        position: relative !important;
        z-index: 2 !important;
        width: 100% !important;
        height: 100% !important;
        min-height: 100% !important;
        max-height: 100% !important;
        margin: 0 !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        border-radius: 999px !important;
        background: transparent !important;
        box-sizing: border-box !important;
    }

    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search .apd5-search-field:not(.is-open) > button:first-child:hover,
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search[data-hover-field="location"] [data-search-field="location"]:not(.is-open) > button:first-child,
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search[data-hover-field="dates"] [data-search-field="dates"]:not(.is-open) > button:first-child,
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search[data-hover-field="guests"] [data-search-field="guests"]:not(.is-open) > button:first-child {
        background: transparent !important;
        box-shadow: none !important;
    }

    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search[data-hover-field="location"] [data-search-field="location"]:not(.is-open)::before,
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search[data-hover-field="dates"] [data-search-field="dates"]:not(.is-open)::before,
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search[data-hover-field="guests"] [data-search-field="guests"]:not(.is-open)::before,
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search .apd5-search-field:not(.is-open):hover::before {
        background: #ebebeb !important;
    }

    /* Open state: shell gray, selected segment white and raised. */
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search.has-open-panel,
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search:has(.apd5-search-field.is-open) {
        background: #ebebeb !important;
    }

    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search .apd5-search-field.is-open::before {
        background: transparent !important;
    }

    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search .apd5-search-field.is-open > button:first-child {
        height: 100% !important;
        min-height: 100% !important;
        max-height: 100% !important;
        background: #fff !important;
        box-shadow: 0 3px 12px rgba(0, 0, 0, .16) !important;
    }

    /* Search action: 48px control with an exact 8px inset inside 64px shell.
       Absolute positioning is now form-relative because the form is explicitly
       positioned above. */
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search .apd5-search-submit {
        position: absolute !important;
        top: 50% !important;
        right: 8px !important;
        bottom: auto !important;
        left: auto !important;
        z-index: 70 !important;
        width: 48px !important;
        min-width: 48px !important;
        max-width: 48px !important;
        height: 48px !important;
        min-height: 48px !important;
        max-height: 48px !important;
        margin: 0 !important;
        padding: 0 !important;
        translate: none !important;
        transform: translateY(-50%) !important;
        align-self: auto !important;
        justify-self: auto !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 7px !important;
        border-radius: 999px !important;
        box-sizing: border-box !important;
    }

    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search .apd5-search-submit span:not(.screen-reader-text) {
        display: none !important;
    }

    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search.has-open-panel .apd5-search-submit,
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search:has(.apd5-search-field.is-open) .apd5-search-submit {
        width: 96px !important;
        min-width: 96px !important;
        max-width: 96px !important;
        height: 48px !important;
        min-height: 48px !important;
        max-height: 48px !important;
        padding: 0 16px !important;
        top: 50% !important;
        right: 8px !important;
        margin: 0 !important;
        transform: translateY(-50%) !important;
    }

    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search.has-open-panel .apd5-search-submit span:not(.screen-reader-text),
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search:has(.apd5-search-field.is-open) .apd5-search-submit span:not(.screen-reader-text) {
        display: inline !important;
        color: #fff !important;
        white-space: nowrap !important;
    }

    /* Viajeros owns the complete right-hand selected capsule. Reserve room for
       Buscar, and when values exist place X just to its left as in reference. */
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search[data-active-panel="guests"] [data-search-field="guests"] > button:first-child,
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search:has([data-search-field="guests"].is-open) [data-search-field="guests"] > button:first-child {
        padding-right: 122px !important;
    }

    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search[data-active-panel="guests"] [data-search-field="guests"]:has(> .apd16-search-clear:not([hidden])) > button:first-child,
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search:has([data-search-field="guests"].is-open) [data-search-field="guests"]:has(> .apd16-search-clear:not([hidden])) > button:first-child {
        padding-right: 158px !important;
    }

    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search[data-active-panel="guests"] [data-search-field="guests"] > .apd16-search-clear:not([hidden]),
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search:has([data-search-field="guests"].is-open) [data-search-field="guests"] > .apd16-search-clear:not([hidden]) {
        position: absolute !important;
        top: 50% !important;
        right: 126px !important;
        bottom: auto !important;
        left: auto !important;
        z-index: 78 !important;
        width: 24px !important;
        min-width: 24px !important;
        max-width: 24px !important;
        height: 24px !important;
        min-height: 24px !important;
        max-height: 24px !important;
        margin: 0 !important;
        padding: 0 0 2px !important;
        translate: none !important;
        transform: translateY(-50%) !important;
        display: grid !important;
        place-items: center !important;
        border: 0 !important;
        border-radius: 50% !important;
        background: transparent !important;
        box-shadow: none !important;
        color: #222 !important;
        font: 400 17px/1 Arial, sans-serif !important;
    }

    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search[data-active-panel="guests"] [data-search-field="guests"] > .apd16-search-clear:not([hidden]):hover,
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search:has([data-search-field="guests"].is-open) [data-search-field="guests"] > .apd16-search-clear:not([hidden]):hover {
        background: #dedede !important;
    }

    /* Active Viajeros reaches the right edge underneath the overlaid action,
       so its white capsule visually contains X + Buscar exactly like Airbnb. */
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search.has-open-panel,
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search:has(.apd5-search-field.is-open) {
        grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr) 1px minmax(0, 1fr) 0 !important;
    }

    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search[data-active-panel="guests"] [data-search-field="guests"],
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search:has([data-search-field="guests"].is-open) [data-search-field="guests"] {
        z-index: 35 !important;
    }

    /* Keep the divider behavior tied to the full-size hover/selected pill. */
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search[data-hover-field="location"] .is-after-location,
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search[data-hover-field="dates"] :is(.is-after-location, .is-after-dates),
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search[data-hover-field="guests"] .is-after-dates,
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search:has([data-search-field="location"].is-open) .is-after-location,
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search:has([data-search-field="dates"].is-open) :is(.is-after-location, .is-after-dates),
    html body.apd162-search-geometry.home #apd5-header.is-discovery-context:not(.is-compact) #apd5-search:has([data-search-field="guests"].is-open) .is-after-dates {
        opacity: 0 !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html body.apd162-search-geometry #apd5-search * {
        transition-duration: .01ms !important;
    }
}