/* Rophim-style smooth lazy load for theme-iq
   Safe: no extra section margins/min-height, avoids layout gap issues. */

:root {
    --rf-lazy-bg: rgba(255,255,255,.055);
    --rf-lazy-shine: rgba(255,255,255,.105);
    --rf-reveal-distance: 18px;
    --rf-reveal-time: .58s;
}

img.rf-lazy-img,
img[data-src] {
    background: linear-gradient(110deg, var(--rf-lazy-bg) 8%, var(--rf-lazy-shine) 18%, var(--rf-lazy-bg) 33%);
    background-size: 200% 100%;
    animation: rfSkeleton 1.25s linear infinite;
    filter: blur(8px);
    opacity: .72;
    transform: translateZ(0) scale(1.006);
    transition: opacity .55s ease, filter .65s ease, transform .65s ease, background .35s ease;
}

img.rf-lazy-loaded {
    opacity: 1;
    filter: blur(0);
    transform: translateZ(0) scale(1);
    background: transparent;
    animation: none;
}

@keyframes rfSkeleton {
    to { background-position-x: -200%; }
}

/* Reveal mượt giống app phim: nhẹ, không làm giãn layout */
.rf-reveal {
    opacity: 0;
    transform: translate3d(0, var(--rf-reveal-distance), 0);
    transition:
        opacity var(--rf-reveal-time) cubic-bezier(.2,.72,.25,1),
        transform var(--rf-reveal-time) cubic-bezier(.2,.72,.25,1);
    will-change: opacity, transform;
}

.rf-reveal.rf-visible {
    opacity: 1;
    transform: translate3d(0,0,0);
}

.splide__slide.rf-reveal,
.item-wrap.rf-reveal {
    transition-delay: calc(min(var(--rf-order, 0), 10) * 42ms);
}

/* Tránh nhảy layout ảnh poster/card */
.splide__img-wrap,
.item-img,
.slider__column .splide__slide > a,
.banner .wrap-banner,
.modal-img-wrap {
    overflow: hidden;
}

.splide__img,
.desc-img,
.item-img img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media (max-width: 767px) {
    :root {
        --rf-reveal-distance: 10px;
        --rf-reveal-time: .42s;
    }

    .splide__slide.rf-reveal,
    .item-wrap.rf-reveal {
        transition-delay: calc(min(var(--rf-order, 0), 6) * 24ms);
    }

    img.rf-lazy-img,
    img[data-src] {
        filter: blur(4px);
    }
}

@media (prefers-reduced-motion: reduce) {
    img.rf-lazy-img,
    img[data-src],
    .rf-reveal {
        transition: none !important;
        animation: none !important;
        transform: none !important;
        filter: none !important;
        opacity: 1 !important;
    }
}