document.addEventListener('DOMContentLoaded', function() {
    const bgLeft = document.querySelector('.bg-left');
    const images = [
        'url(assets/img/bg-daun.jpg)',
        'url(assets/img/temulawak.jpg)',
        'url(assets/img/rempah-dan-herbal-edit.jpg)'
    ];
    let currentIndex = 0;

    function changeBackgroundImage() {
        bgLeft.style.opacity = 0; // Set opacity to 0 to start fade out
        setTimeout(() => {
            bgLeft.style.backgroundImage = images[currentIndex];
            bgLeft.style.opacity = 0.6; // Set opacity back to 0.6 to fade in
            currentIndex = (currentIndex + 1) % images.length;
        }, 1000); // Wait for 1 second to change the image
    }

    setInterval(changeBackgroundImage, 3000); // Ganti gambar setiap 3 detik
});