document.addEventListener('DOMContentLoaded', function () {
    const video = document.getElementById('banner-video');
    const playPauseBtn = document.getElementById('playPauseBtn');
    const muteUnmuteBtn = document.getElementById('muteUnmuteBtn');

    if (!video || !playPauseBtn || !muteUnmuteBtn) {
        console.warn("Video controls: required elements not found.");
        return;
    }

    const playIcon = document.getElementById('play-icon');
    const pauseIcon = document.getElementById('pause-icon');
    const muteIcon = document.getElementById('mute-icon');
    const unmuteIcon = document.getElementById('unmute-icon');

    // Play / Pause
    playPauseBtn.addEventListener('click', function () {
        if (video.paused) {
            video.play();
            if (playIcon) playIcon.style.display = 'none';
            if (pauseIcon) pauseIcon.style.display = 'inline';
        } else {
            video.pause();
            if (playIcon) playIcon.style.display = 'inline';
            if (pauseIcon) pauseIcon.style.display = 'none';
        }
    });

    // Mute / Unmute
    muteUnmuteBtn.addEventListener('click', function () {
        video.muted = !video.muted;

        if (video.muted) {
            if (muteIcon) muteIcon.style.display = 'inline';
            if (unmuteIcon) unmuteIcon.style.display = 'none';
        } else {
            if (muteIcon) muteIcon.style.display = 'none';
            if (unmuteIcon) unmuteIcon.style.display = 'inline';
        }
    });
});
