/*
 * PayDay desktop density (skala 0.9: isi 14px tampil 12,6px, caption 12px tampil 10,8px).
 *
 * CSS zoom is intentionally scoped to the application shell. Bootstrap
 * modals, SweetAlert, and other body-level overlays stay in the unscaled
 * viewport coordinate system. payday-ui-scale.js compensates libraries
 * (Popper/Select2) that calculate physical coordinates inside this shell.
 *
 * Do not replace this with transform-based scaling. A transformed ancestor
 * changes the containing block of position: fixed elements and causes modal
 * and popup drift while scrolling.
 */
:root {
    --payday-ui-scale: 0.9;
    --payday-ui-scale-inverse: 1.1111;
}

@media screen and (min-width: 992px) {
    @supports (zoom: 0.8) {
        .payday-ui-scale-root {
            zoom: var(--payday-ui-scale);
            min-height: calc(100vh * var(--payday-ui-scale-inverse));
        }

        /*
         * The vendor layout sizes these shells with 100vh. Viewport units are
         * also painted through zoom, so use the inverse value to keep the
         * visible shell exactly as tall as the browser viewport.
         */
        .payday-ui-scale-root .page-body-wrapper,
        .payday-ui-scale-root .main-panel {
            min-height: calc(100vh * var(--payday-ui-scale-inverse) - 60px);
        }

        .payday-ui-scale-root .page-body-wrapper.full-page-wrapper {
            min-height: calc(100vh * var(--payday-ui-scale-inverse));
        }

        /*
         * Overlay chrome stays in the real viewport, while only its visual
         * panel is scaled. The backdrop therefore still covers the screen and
         * fixed positioning remains stable.
         */
        .modal .modal-dialog,
        body > .swal2-container .swal2-popup,
        body > .tooltip,
        body > .popover {
            zoom: var(--payday-ui-scale);
        }
    }
}

/* Printing and small/touch layouts retain their existing 100% geometry. */
@media print, screen and (max-width: 991.98px) {
    .payday-ui-scale-root {
        zoom: 1;
        min-height: 100vh;
    }
}

/* Body-portalled Select2 dropdowns receive this class from the runtime. */
body > .select2-container.payday-select2-scaled {
    zoom: var(--payday-ui-scale);
}

/*
 * Dropdown Select2 selalu di atas seluruh isi modal (header/footer/isi) dan
 * daftar hasilnya tidak "membawa" scroll ke form di belakangnya saat mentok.
 */
.modal > .select2-container--open,
body > .select2-container--open {
    z-index: 2000;
}
.select2-container--open .select2-results__options {
    overscroll-behavior: contain;
}