document.addEventListener('DOMContentLoaded', function () {
    new Splide('.hero-bg-slider', {
        type: 'fade',
        rewind: true,
        arrows: false,
        pagination: false,
        autoplay: true,
        interval: 4000,
        speed: 1200,
        pauseOnHover: false,
        pauseOnFocus: false,
        drag: false,
    }).mount();

    document.getElementById("whatsappForm").addEventListener("submit", function (e) {
        e.preventDefault();

        const name = document.getElementById("full-name").value;
        const phone = document.getElementById("phone").value;
        const service = document.getElementById("service").value;

        const message = `New Appointment Request:%0A
Name: ${name}%0A
Phone: ${phone}%0A
Service: ${service}`;

        const whatsappURL = `https://wa.me/966920015091?text=${message}`;

        window.open(whatsappURL, "_blank");
    });

    /* =========================
        FadeIn Animation
    ========================== */
    gsap.registerPlugin(ScrollTrigger);

    gsap.utils.toArray("section").forEach((sec) => {

        gsap.from(sec, {
            opacity: 0,
            y: 60,
            duration: 1,
            scrollTrigger: {
                trigger: sec,
                start: "top 85%",
            }
        });

        gsap.utils.toArray(sec.children).forEach((child) => {
            gsap.from(child, {
                opacity: 0,
                y: 40,
                duration: 1.2,
                scrollTrigger: {
                    trigger: child,
                    start: "top 82%",
                }
            });
        });

    });

    gsap.from("footer > *", {
        opacity: 0,
        y: 40,
        duration: 1.6,
        ease: "power2.out",
        stagger: 0.15,
        scrollTrigger: {
            trigger: "footer",
            start: "top 70%",
            toggleActions: "play none none none",
        }
    });

});