/*
 * Give the predictions wrapper a proper containing block.
 * The SDK renders .endereco-predictions-wrapper as position:absolute; height:0
 * so it floats over the form without pushing content down. It must be anchored
 * to the nearest .control div (wraps the input), otherwise it escapes to a
 * distant positioned ancestor and lands in the wrong place.
 */
.checkout-index-index .control,
.form-address-edit .control {
    position: relative;
}

/* Defensive z-index: the wrapper already has z-index:99001 but the inner list
   needs an explicit value so it wins any future sibling stacking conflicts. */
.endereco-predictions {
    z-index: 1;
}

/*
 * Keep the "Use selected" / "Auswahl übernehmen" button always visible when
 * multiple address suggestions are shown. Without this the SDK's default
 * overflow-y:auto on the whole modal lets the suggestions list push the
 * footer button out of the viewport.
 *
 * Fix: turn the modal into a flex column so the body section (suggestions)
 * scrolls internally while the header and footer stay anchored.
 */
.endereco-modal {
    display: flex;
    flex-direction: column;
    overflow: hidden;          /* body child handles its own scroll */
    /* Mobile: .endereco-popup-container has padding-top:80px + padding-bottom:120px,
       so the usable centering area is 100vh - 200px. Stay within that. */
    max-height: calc(100vh - 200px);
}

@media screen and (min-width: 768px) {
    .endereco-modal {
        /* Desktop: no container padding — keep 60px breathing room (30px each side). */
        max-height: calc(100vh - 60px);
    }
}

.endereco-modal__body {
    flex: 1 1 auto;
    overflow-y: auto;
    min-height: 0;             /* required for flex overflow to work in all browsers */
}