// ==========================
//  Navbar toggler
// ==========================
const toggler = document.querySelector(".navbar-toggler");
if (toggler) {
    toggler.addEventListener("click", () => {
        toggler.classList.toggle("active");
    });
}

// ==========================
//  Fancybox
// ==========================
$("[data-fancybox]").fancybox({
    selector: '[data-fancybox="images"]'
});

// ==========================
//      Swiper
// ==========================
$(document).ready(function () {

    const heroSwiper = new Swiper('.header .heroSwiper', {
        speed: 900,
        slidesPerView: 1,
        spaceBetween: 15,
        effect: 'fade',
        navigation: {
            nextEl: '.header .swiper-button-next',
            prevEl: '.header .swiper-button-prev',
        },
        pagination: {
            el: '.header .swiper-pagination',
            clickable: true
        },
        autoplay: {
            delay: 5000,
        },

    });

    const menuSwiper = new Swiper('.menu_sec .menuSwipe', {
        // loop: true,
        speed: 900,
        slidesPerView: 1,
        spaceBetween: 15,
        // centeredSlides: true,
        navigation: {
            nextEl: '.menu_sec .swiper-button-next',
            prevEl: '.menu_sec .swiper-button-prev',
        },
        pagination: {
            el: '.menu_sec .swiper-pagination',
            clickable: true
        },
        breakpoints: {
            640: { slidesPerView: 2 },
            768: { slidesPerView: 3 },
            1024: { slidesPerView: 5 }
        },
        autoplay: {
            delay: 5000,
        },

    });

    const servSwiper = new Swiper('.services_sec .serv_swiper', {
        speed: 900,
        slidesPerView: 1,
        spaceBetween: 15,
        navigation: {
            nextEl: '.services_sec .swiper-button-next',
            prevEl: '.services_sec .swiper-button-prev',
        },
        pagination: {
            el: '.services_sec .swiper-pagination',
            clickable: true
        },
        breakpoints: {
            640: { slidesPerView: 2 },
            768: { slidesPerView: 3 },
            1024: { slidesPerView: 4 }
        },
        autoplay: {
            delay: 5000,
        },

    });

    const testimonialsSwiper = new Swiper('.testimonials_sec .testimonials_swiper', {
        speed: 900,
        slidesPerView: 1,
        spaceBetween: 15,
        navigation: {
            nextEl: '.testimonials_sec .swiper-button-next',
            prevEl: '.testimonials_sec .swiper-button-prev',
        },
        pagination: {
            el: '.testimonials_sec .swiper-pagination',
            clickable: true
        },
        breakpoints: {
            640: { slidesPerView: 2 },
            1024: { slidesPerView: 3 }
        },
        autoplay: {
            delay: 5000,
        },

    });


    const instaSwiper = new Swiper('.instagram-slider', {
        slidesPerView: "auto",
        spaceBetween: 0,
        centeredSlides: true,
        pagination: false,
        navigation: false,
        mousewheel: false,
        keyboard: true,
        speed: 30000,
        allowTouchMove: false,
        a11y: false,
        autoplay: {
            delay: 1,
        },
        loop: true,
        breakpoints: {
            0: {
                slidesPerView: 2,
            },
            480: {
                slidesPerView: 2,
            },
            787: {
                slidesPerView: 3,
            },
            991: {
                slidesPerView: 4,
            },
            1200: {
                slidesPerView: 6,
            }
        }
    });

});


// ---------- add adress -----------
$(".ad-adress-btn").on("click", function(){
    $("#ad-adress").removeClass("d-none")
})
$(".cancel-adress-btn").on("click", function(){
    $("#ad-adress").addClass("d-none")
})


// ------------ SHOW HIDE PASS ----------
$(document).ready(function() {
    $(".show_hide_password .show_pass").on('click', function(event) {
        event.preventDefault();
        if($(this).siblings("input").attr("type") == "text"){
            $(this).siblings("input").attr('type', 'password');
            $(this).addClass( "fa-eye-slash" );
            $(this).removeClass( "fa-eye" );
        }else if($(this).siblings("input").attr("type") == "password"){
            $(this).siblings("input").attr('type', 'text');
            $(this).removeClass( "fa-eye-slash" );
            $(this).addClass( "fa-eye" );
        }
    });
});


// ------------ increase products -----------
$(".qt-plus").click(function() {
    $(this).parent().children(".qt").html(parseInt($(this).parent().children(".qt").html()) + 1);
});
$(".qt-minus").click(function() {

    child = $(this).parent().children(".qt");

    if (parseInt(child.html()) > 1) {
        child.html(parseInt(child.html()) - 1);
    }

    $(this).parent().children(".full-price").addClass("minused");

});


// ---------- fixed nav -----------
const navbar = $('.navbar');

$(window).on('scroll', function () {
    const scrollTop = $(window).scrollTop();

    if (scrollTop > 400) {
        navbar.addClass('nav-scroll');
        navbar.removeClass('navbar-dark');
    } else {
        navbar.removeClass('nav-scroll');
        navbar.addClass('navbar-dark');
    }
});



// ==========================
//      Gsap
// ==========================
gsap.utils.toArray(".gs-sec-head").forEach(head => {

    const icon = head.querySelector(".icon");
    const title = head.querySelector(".title");
    const p = head.querySelector(".p");

    const tl = gsap.timeline({
        scrollTrigger: {
            trigger: head,
            start: "top 75%",
            toggleActions: "play none none none"
        }
    });

    if(icon) tl.from(icon, { autoAlpha:0, scale:0.85, duration:0.35, ease:"power2.out" });
    if(title) tl.from(title, { autoAlpha:0, y:22, duration:0.45, ease:"power3.out" }, "-=0.15");
    if(p) tl.from(p, { autoAlpha:0, y:16, duration:0.35, ease:"power2.out" }, "-=0.2");

});

gsap.utils.toArray(".gs-reveal-group").forEach(group => {

    gsap.from(group.children, {
        autoAlpha: 0,
        y: 60,
        scale: 0.92,
        duration: 0.7,
        ease: "power3.out",
        stagger: 0.08,
        scrollTrigger: {
            trigger: group,
            start: "top 70%"
        }
    });

});

gsap.utils.toArray(".gs-img-zoom").forEach(img => {

    gsap.from(img, {
        scale: 1.12,
        duration: 1.2,
        ease: "power2.out",
        scrollTrigger: {
            trigger: img,
            start: "top 80%"
        }
    });

});

gsap.utils.toArray("[data-parallax]").forEach(el => {

    const y = el.dataset.parallax;

    gsap.from(el, {
        y: y,
        scrollTrigger: {
            trigger: el.closest("section"),
            start: "top bottom",
            end: "bottom top",
            scrub: 1
        }
    });

});

gsap.utils.toArray(".gs-scale-in").forEach(el => {
    gsap.from(el, {
        autoAlpha: 0,
        scale: 0.85,
        duration: 0.4,
        ease: "back.out(1.6)",
        scrollTrigger: {
            trigger: el,
            start: "top 85%"
        }
    });
});

gsap.utils.toArray(".gs-about-logo").forEach(logo => {

    const tl = gsap.timeline({
        scrollTrigger: {
            trigger: logo,
            start: "top 80%",
            toggleActions: "play none none none"
        }
    });

    tl
    .from(logo.querySelector(".logo-curved-text"), {
        opacity: 0,
        y: 16,
        duration: 0.6,
        ease: "power3.out"
    })

    .from(logo.querySelector(".logo-since-text"), {
        opacity: 0,
        y: 8,
        duration: 0.45,
        ease: "power3.out"
    }, "-=0.25")

    .from(logo.querySelector(".logo-ribbon-shape"), {
        scaleX: 0,
        transformOrigin: "center center",
        duration: 0.55,
        ease: "power3.out"
    }, "-=0.25")

    .from(logo.querySelector(".logo-ribbon-text"), {
        opacity: 0,
        y: 4,
        duration: 0.35,
        ease: "power2.out"
    }, "-=0.2");

});

// ==========================
// Statics Counters 
// ==========================
gsap.utils.toArray(".statics_sec .counter").forEach(counter => {

    const rawText = counter.textContent.trim(); // e.g. "5240+"
    const value = parseInt(rawText.replace(/\D/g, ""), 10);
    const suffix = rawText.replace(/[0-9]/g, "");

    const obj = { val: 0 };

    gsap.to(obj, {
        val: value,
        duration: 1.8,
        ease: "power1.out",
        scrollTrigger: {
            trigger: counter,
            start: "top 85%",
            once: true
        },
        onUpdate() {
            counter.innerText =
                Math.floor(obj.val) + suffix;
        }
    });

});
