/* Managed by wowbrands1/rto-form-popups and deployed automatically. Edits made here are overwritten on the next deploy — change it in that repo instead. */

body.scrolllock-on {
    position: fixed;
    width: 100%;
    overflow: hidden
}
.popup {
    font-size: 16px;
    z-index: 999999;
}
.popup .popup-overlay {
    background-color: rgba(0, 0, 0, 0.85);
}
.popup .popup-content {
    max-height: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.popup .popup-close {
    background-color: transparent;
    width: 15px;
    height: 15px;
}
.popup .popup-close:before,
.popup .popup-close:after {
    content: '';
    display: block;
    position: absolute;
    width: 1px;
    height: 131.25%;
    background-color: #a1a1a1;
    transform: rotate(45deg)
}
.popup .popup-close:after {
    transform: rotate(-45deg)
}
.popup .popup-content .popup-close.uses-image {
    width: auto;
    height: auto;
}
.popup .popup-content .popup-close.uses-image:before,
.popup .popup-content .popup-close.uses-image:after {
    display: none;
}

@media screen and (max-width: 567px) {
    .popup .popup-content {
        width: 100%;
        max-width: 100%;
        height: 100%;
    }
}

/* ---- Keyboard-shrunk viewport -------------------------------------------
   Everything below applies only while WowViewport has the visual viewport
   measurably shorter than the layout viewport — in practice, while a soft
   keyboard is open over a popup. See the WowViewport comment in wow-main.js
   for why the caret ends up below the text without it.

   `:root.wow-viewport-fit` is three classes' worth of specificity, so these
   beat both core.css's own `.popup` rule and the `top-0` / `cont-full`
   utilities on the element, whatever order the theme happens to load them in.
   With the class absent not one of these rules matches, which is what keeps
   desktop and every non-keyboard case byte-for-byte as it was. */

/* The popup becomes exactly the part of the screen that is still visible, so
   there is nothing below the fold for iOS to scroll it to. `overflow: hidden`
   rather than core.css's `auto` is the other half of that: the scrolling has
   to happen one level in, or the popup is a scroller again and we are back
   where we started. */
:root.wow-viewport-fit .popup {
    top: var(--wow-viewport-top, 0px);
    height: var(--wow-viewport-height, 100%);
    overflow: hidden;
}

/* So the content box takes the scrolling. It is already `max-height: 100%`
   here, and it already carries the promo artwork, which stays put because a
   scroll container's background does not scroll with its content.

   `!important` because the promo stylesheets address this element as
   `#popup-<name> .popup-content` — 1568 of them across the fleet, with fixed
   heights from 488px to 600px, and 416 with `overflow: hidden` — and an id
   beats any number of classes. There is no selector available here that wins
   without it. A fixed height would pin the box to the shrunk popup and clip
   the fields under the keyboard away entirely: unreachable rather than merely
   mis-carated, which is the worse bug. `min-height` keeps the artwork filling
   the popup when the form is shorter than it. */
:root.wow-viewport-fit .popup > .popup-content {
    height: auto !important;
    min-height: 100%;
    max-height: 100% !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
}