/* LQIP & Blur-up placeholder */
.wpmo-lqip,
.wpmo-lazy-blur-up {
    filter: blur(12px);
    transform: scale(1.03);
    opacity: 0.85;
    transition: filter .38s cubic-bezier(0.22, 1, 0.36, 1), transform .38s cubic-bezier(0.22, 1, 0.36, 1), opacity .38s ease;
}
.wpmo-lqip.is-loaded,
.wpmo-lazy-blur-up.is-loaded {
    filter: none;
    transform: none;
    opacity: 1;
}

/* Skeleton Shimmer (Animated gray loading box) */
@keyframes wpmo-skeleton-shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}
.wpmo-lazy-skeleton:not(.is-loaded) {
    background-color: #e2e8f0;
    background-image: linear-gradient(90deg, #e2e8f0 25%, #f1f5f9 50%, #e2e8f0 75%);
    background-size: 200% 100%;
    animation: wpmo-skeleton-shimmer 1.5s infinite linear;
}
.wpmo-lazy-skeleton {
    transition: opacity .3s ease, background-color .3s ease;
}
.wpmo-lazy-skeleton.is-loaded {
    background-image: none;
    background-color: transparent;
    animation: none;
}

/* Dominant Color Fill (Smooth solid color box fade-in) */
.wpmo-lazy-color-box:not(.is-loaded) {
    background-color: var(--wpmo-lazy-tint, #eef2ff);
}
.wpmo-lazy-color-box {
    transition: opacity .35s ease, background-color .35s ease;
}
.wpmo-lazy-color-box.is-loaded {
    background-color: transparent;
}

/* None (Fade-in opacity only) */
.wpmo-lazy-fade-only:not(.is-loaded) {
    opacity: 0.08;
}
.wpmo-lazy-fade-only {
    transition: opacity .3s ease;
}
.wpmo-lazy-fade-only.is-loaded {
    opacity: 1;
}

/* CSS content-visibility section deferral */
.wpmo-cv-auto {
    content-visibility: auto;
    contain-intrinsic-size: auto 500px;
}

/* Lazy CSS background */
[data-wpmo-bg] { background-color: #f0f0f1; transition: background-image .25s ease; }
[data-wpmo-bg].is-loaded { background-color: transparent; }

/* YouTube / Vimeo preview wrapper — replaces the iframe until clicked */
.wpmo-video-preview {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: var(--w, 16) / var(--h, 9);
    background: #000;
    cursor: pointer;
    overflow: hidden;
    border-radius: 6px;
}
.wpmo-video-preview img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: filter .25s ease, transform .25s ease;
}
.wpmo-video-preview:hover img {
    filter: brightness(.85);
    transform: scale(1.02);
}
.wpmo-video-preview .wpmo-video-play {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 68px; height: 48px;
    border: 0; border-radius: 14%;
    background: rgba(0, 0, 0, .7);
    cursor: pointer;
    transition: background .15s ease, transform .15s ease;
}
.wpmo-video-preview .wpmo-video-play::before {
    content: '';
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-40%, -50%);
    border-style: solid;
    border-width: 10px 0 10px 18px;
    border-color: transparent transparent transparent #fff;
}
.wpmo-video-preview:hover .wpmo-video-play {
    background: #f00; /* YouTube red */
    transform: translate(-50%, -50%) scale(1.08);
}
.wpmo-video-preview.is-playing { cursor: default; }
.wpmo-video-preview.is-playing iframe {
    position: absolute; inset: 0; width: 100%; height: 100%; border: 0;
}
