/*
 * PEMK Mobile Popup Fix 1.0.1
 * Zakres: wyłącznie formularze Eventów i Membership na małych ekranach.
 */

@media (max-width: 820px), (max-height: 680px) and (pointer: coarse) {
    #pemkEventModal.pemk-modal,
    #pemkMembershipModal.pemk-modal {
        box-sizing: border-box !important;
        height: 100vh !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        padding-top: calc(84px + env(safe-area-inset-top)) !important;
        padding-right: max(8px, env(safe-area-inset-right)) !important;
        padding-bottom: max(8px, env(safe-area-inset-bottom)) !important;
        padding-left: max(8px, env(safe-area-inset-left)) !important;
        overflow: hidden !important;
    }

    #pemkEventModal .pemk-modal-window,
    #pemkMembershipModal .pemk-modal-window {
        width: 100% !important;
        max-height: calc(100vh - 92px) !important;
        max-height: calc(100dvh - 92px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        touch-action: pan-y;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
    }

    #pemkEventModal .pemk-modal-x,
    #pemkMembershipModal .pemk-modal-x {
        position: fixed !important;
        z-index: 100001 !important;
        top: calc(86px + env(safe-area-inset-top)) !important;
        right: calc(10px + env(safe-area-inset-right)) !important;
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        min-height: 42px !important;
        margin: 0 !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }
}