/*
 * WizShop — CSR skeleton overlay styles.
 *
 * Enqueued (via script-loader.php → wiz_get_style_configs()) when the
 * `csr_skeleton_enabled` tenant setting is on. Paired with
 * skeletons/index.js, which shows/hides the #wiz-skeleton-overlay element.
 */

#wiz-skeleton-overlay {
    position: fixed;
    inset: 0;
    z-index: 100;
    background: var(--wiz-skeleton-overlay-bg, #ffffff);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: none;
    -webkit-overflow-scrolling: touch;
    padding-top: calc(
        env(safe-area-inset-top, 0px)
        + var(--wiz-skeleton-overlay-offset-top, 72px)
        + var(--wiz-skeleton-overlay-padding, 24px)
    );
    padding-right: var(--wiz-skeleton-overlay-padding, 24px);
    padding-bottom: var(--wiz-skeleton-overlay-padding, 24px);
    padding-left: var(--wiz-skeleton-overlay-padding, 24px);
    box-sizing: border-box;
    animation: wiz-skeleton-overlay-fade-in 0.12s ease-out;
}
@keyframes wiz-skeleton-overlay-fade-in {
    from { opacity: 0; }
    to   { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
    #wiz-skeleton-overlay { animation: none; }
}
/* While the overlay is up, freeze the underlying page — prevents any
 * scroll chaining, keyboard scroll, or touch-drag from showing the
 * real content behind the skeleton. */
html.wiz-skeleton-scroll-lock,
body.wiz-skeleton-scroll-lock {
    overflow: hidden !important;
    touch-action: none;
}