/**
 * Bajroshakti Smart Image Loader
 * Shimmer Wave + Smooth Fade-in
 * Version: 1.0.1
 */

/* ১. শিমার এনিমেশন কন্টেইনার */
.bsnp-ratio-16-9,
.ratio-16-9 {
    position: relative;
    overflow: hidden;
    background-color: var(--surface-color, #EDE9DC);
    background-image: linear-gradient(
        90deg,
        var(--surface-color, #EDE9DC) 0%,
        var(--border-color, #DDD9C8) 50%,
        var(--surface-color, #EDE9DC) 100%
    );
    background-repeat: no-repeat;
    background-size: 200% 100%;
    animation: bsnp_shimmer_wave 1.5s infinite linear;
}

/* ২. শিমার এনিমেশন কীফ্রেম */
@keyframes bsnp_shimmer_wave {
    0%   { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

/* ৩. ডার্ক মোড শিমানিং */
[data-theme="dark"] .bsnp-ratio-16-9,
[data-theme="dark"] .ratio-16-9 {
    background-color: #112240;
    background-image: linear-gradient(
        90deg,
        #112240 0%,
        #1e3a5f 50%,
        #112240 100%
    );
}

/* ৪. লেজি লোড ইমেজ - ফেড-ইন ট্রানজিশন */
.bsnp-lazy-image {
    opacity: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 5;
    transition: opacity 0.6s ease-in-out;
}

.bsnp-lazy-image.is-loaded {
    opacity: 1;
}

/* ৫. লোড সম্পন্ন হলে এনিমেশন বন্ধ */
.bsnp-stop-wave {
    background: none !important;
    animation: none !important;
}