function popup(type, message) {
    let popup = document.getElementById("popup");
    let popupMessage = document.getElementById("popup_message");

    popup.classList.remove("success", "error", "show");

    if (type === "success") {
        popup.classList.add("success");
    } else if (type === "error") {
        popup.classList.add("error");
    }

    popupMessage.textContent = message;

    popup.classList.add("show");

    setTimeout(() => {
        popup.classList.remove("show");
    }, 3000);
}

document.addEventListener("DOMContentLoaded", function () {
    let popupData = document.getElementById("popup_data");

    let popupType = popupData.getAttribute("data-popup-type");
    let popupMessage = popupData.getAttribute("data-popup-message");

    if (popupType && popupMessage) {
        popup(popupType, popupMessage);
    }
});

let images = document.querySelectorAll(".loader-image");
let currentImageIndex = 0;

function cycleImages() {
    images.forEach((img, index) => {
        img.style.opacity = index === currentImageIndex ? "1" : "0";
    });
    currentImageIndex = (currentImageIndex + 1) % images.length;
}

setInterval(cycleImages, 300);

function showPreloader() {
    document.getElementById("preloader").style.display = "flex";
}

function hidePreloader() {
    document.getElementById("preloader").style.display = "none";
}

window.onload = function () {
    setTimeout(hidePreloader, 1500); 
};

document.addEventListener("DOMContentLoaded", function () {
    const updateLocationUrl = document.querySelector(
        "meta[name='update-location-url']"
    ).content;
    const csrfToken = document.querySelector("meta[name='csrf-token']").content;

    function updateLocation() {

        function clearLocationSession() {
            fetch(updateLocationUrl, {
                method: "POST",
                headers: {
                    "Content-Type": "application/json",
                    "X-CSRF-TOKEN": csrfToken,
                    "X-Requested-With": "XMLHttpRequest",
                },
                body: JSON.stringify({
                    latitude: null,
                    longitude: null,
                }),
            });
        }
        
        if (navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(
                function (position) {
                    fetch(updateLocationUrl, {
                        method: "POST",
                        headers: {
                            "Content-Type": "application/json",
                            "X-CSRF-TOKEN": csrfToken,
                            "X-Requested-With": "XMLHttpRequest",
                        },
                        body: JSON.stringify({
                            latitude: position.coords.latitude,
                            longitude: position.coords.longitude,
                        }),
                    });
                },
                function () {
                    clearLocationSession(); 
                }
            );
        } else {
            clearLocationSession(); 
        }
    }

    setInterval(updateLocation, 3000);
});

function menutoggle(event){
    let plus = event.querySelector('.toggle_plus');
    let minus = event.querySelector('.toggle_minus');
    let menu = document.querySelector('.header_menu_wrapper');
    let submenus = document.querySelectorAll('.submenu_toggle');

    if (!event.classList.contains('active')) {
        minus.classList.add('active');
        menu.classList.add('active');

        plus.classList.remove('active');

        event.classList.add('active');
    } else {
        plus.classList.add('active');

        event.classList.remove('active');
        minus.classList.remove('active');
        menu.classList.remove('active');

        submenus.forEach(submenu => {
            let plus = submenu.querySelector('.submenu_plus');
            let minus = submenu.querySelector('.submenu_minus');
            let nextElement = submenu.nextElementSibling;
            if (submenu.classList.contains('active')) {
                plus.classList.add('active');

                submenu.classList.remove('active');
                minus.classList.remove('active');
                nextElement.classList.remove('active');
            }
        });
    }
}

function submenutoggle(event) {
    let plus = event.querySelector('.submenu_plus');
    let minus = event.querySelector('.submenu_minus');
    let nextElement = event.nextElementSibling;

    if (!event.classList.contains('active')) {
        minus.classList.add('active');
        nextElement.classList.add('active');

        plus.classList.remove('active');

        event.classList.add('active');
    } else {
        plus.classList.add('active');

        event.classList.remove('active');
        minus.classList.remove('active');
        nextElement.classList.remove('active');
    }
}

window.addEventListener('scroll', function() {
    const topHeader = document.querySelector('.top_header');
    const contactHeader = document.querySelector('.top_contact_header');

    if (!topHeader || !contactHeader) return;   

    if (window.innerWidth > 999) {
        if (window.scrollY > 0) {
            topHeader.style.top = '0';
            topHeader.classList.add('active');
            if (contactHeader) {
                contactHeader.style.display = 'none';
            }
        } else {
            topHeader.style.top = '36px';
            topHeader.classList.remove('active');
            if (contactHeader) {
                contactHeader.style.display = 'flex';
            }
        }
    }else {
        topHeader.style.top = '0';
        contactHeader.style.display = 'none';
    }
});

const banners = document.querySelectorAll('.banner_session');
let bannercurrentIndex = 0;

if (banners.length > 0) {
    function showNextBanner() {
        banners.forEach((banner, index) => {
            banner.classList.remove('active');
        });

        banners[bannercurrentIndex].classList.add('active');

        bannercurrentIndex = (bannercurrentIndex + 1) % banners.length;
    }

    setInterval(showNextBanner, 4000);
    showNextBanner();
}

document.addEventListener('DOMContentLoaded', function() {
    const serviceItems = document.querySelectorAll('.service_item');
    let serviceIndex = 0;

    function initializeActiveService() {
        const screenWidth = window.innerWidth;

        if (screenWidth <= 699) {
            serviceItems.forEach(item => item.classList.remove('active'));
            serviceItems[0].classList.add('active');
            serviceIndex = 1;
        } else if (screenWidth > 699 && screenWidth <= 768) {
            serviceItems.forEach(item => item.classList.remove('active'));
            serviceItems[0].classList.add('active');
            if (serviceItems[1]) {
                serviceItems[1].classList.add('active');
            }
            serviceIndex = 2;
        } else {
            serviceItems.forEach(item => item.classList.add('active'));
            serviceIndex = serviceItems.length; 
        }
    }

    function showNextService() {
        const screenWidth = window.innerWidth;

        if (screenWidth <= 768) {
            serviceItems.forEach(item => item.classList.remove('active'));

            if (screenWidth <= 699) {
                serviceItems[serviceIndex % serviceItems.length].classList.add('active');
                serviceIndex = (serviceIndex + 1) % serviceItems.length;
            } else if (screenWidth > 699 && screenWidth <= 768) {
                serviceItems[serviceIndex % serviceItems.length].classList.add('active');
                serviceItems[(serviceIndex + 1) % serviceItems.length].classList.add('active');
                serviceIndex = (serviceIndex + 2) % serviceItems.length;
            }
        }
    }

    initializeActiveService();
    setInterval(showNextService, 6000);
});


document.addEventListener("DOMContentLoaded", function () {
    const observer = new IntersectionObserver((entries) => {
        entries.forEach(entry => {
            if (entry.isIntersecting) {
                entry.target.classList.add("animate");
                observer.unobserve(entry.target); // Remove if you want it to animate only once
            }
        });
    }, {
        threshold: 0.1
    });

    document.querySelectorAll(".service_section_group").forEach(el => {
        observer.observe(el);
    });
});