const whatsappButton = document.createElement("button");
whatsappButton.id = "whatsapp-button";
whatsappButton.setAttribute("aria-label", "whatsapp-button-label");
whatsappButton.className = "whatsapp-button";
whatsappButton.innerHTML = `
  
 <a href="https://api.whatsapp.com/send/?phone=966508645832‎&text&type=phone_number&app_absent=0" target="_blank" title="Open WhatsApp in a new window">
 <i class="contact-icon sicon-whatsapp2" id="whats">    </i>
 </a>
  
`;

document.body.appendChild(whatsappButton);

<a href="#mobile-menu" class="hover:text-primary active:text-cursor-pointer text-[#676D75] flex lg:hidden" aria-label="فتح القائمة الجانبية">
    <!-- القائمة الرئيسية -->
</a>
<a data-sal="fade" data-sal-delay="70" data-sal-duration="700" href="#" class="static-banners-single-mobile w-full block md:hidden sal-animate" aria-label="عرض تفاصيل العرض الخاص">
    <!-- شريط المتجر -->
</a>
<a data-sal="fade" data-sal-delay="70" data-sal-duration="700" href="https://cocktail1.com/ar/redirect/categories/809667288" class="static-banners-single-mobile w-full block md:hidden sal-animate" aria-label="التسوق في الفئة المميزة">
    <!-- صورة عرض ترويجي -->
</a>
<a data-sal="fade" data-sal-delay="70" data-sal-duration="700" href="#" class="static-banners-single-mobile col-span-1 md:col-span-1 lg:col-span-1 w-full" aria-label="التسوق في الفئة الخاصة">
    <!-- خيارات متعددة للدفع -->
</a>

document.addEventListener('DOMContentLoaded', function() {
    const slides = document.querySelectorAll('.brands-single');
    
    function animateOnScroll() {
        const windowHeight = window.innerHeight;
        slides.forEach(slide => {
            const slideTop = slide.getBoundingClientRect().top;
            const slideDelay = parseInt(slide.getAttribute('data-sal-delay'), 10) || 0;
            
            if (slideTop < windowHeight && !slide.classList.contains('animated')) {
                setTimeout(() => {
                    slide.classList.add('animated');
                    slide.classList.add('sal-animate'); // This can be a custom class for the animation
                    slide.setAttribute('data-sal-duration', '700'); // Optional: adjust duration
                }, slideDelay);
            }
        });
    }

    // Run animation on initial load
    animateOnScroll();

    // Run animation when scrolling
    window.addEventListener('scroll', animateOnScroll);

    // Optional: Trigger animations when resizing (to ensure proper animations on resize)
    window.addEventListener('resize', animateOnScroll);
});


const swiperElement = document.querySelector("#swiper-wrapper-1397b711a2cc8f18");

if (swiperElement && swiperElement.swiper) {
    // تعطيل autoplay أولاً ثم تفعيله من جديد لضمان التغيير
    swiperElement.swiper.autoplay.stop();
    
    swiperElement.swiper.params.autoplay = {
        delay: 3000, // مدة الانتقال بين الشرائح
        disableOnInteraction: false
    };

    // إجبار Swiper على إعادة التهيئة وتشغيل autoplay
    swiperElement.swiper.autoplay.start();
} else {
    console.error("Swiper instance not found. Reinitializing...");

// حدد العنصر
const swiperElement = document.querySelector("#swiper-wrapper-1397b711a2cc8f18");

document.addEventListener("DOMContentLoaded", function () {
    // تحقق من وجود العنصر الصحيح
    const swiperContainer = document.querySelector("#swiper-wrapper-0c1191c311a5156c");

    if (!swiperContainer) {
        console.error("Swiper container not found!");
        return;
    }

    // قم بتدمير أي تهيئة سابقة لـ Swiper
    if (swiperContainer.swiper) {
        swiperContainer.swiper.destroy(true, true);
    }

    // إعادة تهيئة Swiper مع التشغيل التلقائي
    const swiper = new Swiper(".swiper", {
        loop: true,
        autoplay: {
            delay: 3000, // الانتقال كل 3 ثوانٍ
            disableOnInteraction: false,
        },
        navigation: {
            nextEl: ".brands-swiper-actions-center-next.next-135",
            prevEl: ".brands-swiper-actions-center-prev.prev-135",
        },
        pagination: {
            el: ".swiper-pagination",
            clickable: true,
        },
    });

    console.log("Swiper initialized successfully!");
});



document.addEventListener("DOMContentLoaded", function () {
    let delayedElement = document.querySelector("#custom-salla-product-card"); // استبدل بـ class أو ID للعنصر

    if (delayedElement) {
        // تأخير مؤقت للتأكد أن كل شيء تم تحميله
        setTimeout(() => {
            // إزالة أي `display: none` أو `opacity: 0` لمنع التأخير
            delayedElement.style.opacity = "1";
            delayedElement.style.display = "block";
            delayedElement.style.visibility = "visible";
            delayedElement.style.transition = "opacity 0.5s ease-in-out"; // تحسين ظهور العنصر بسلاسة
            
            console.log("العنصر ظهر بنجاح!"); // لمراقبة ظهور العنصر في Console
        }, 100); // التأخير بسيط جدًا لضمان ظهور العنصر بأسرع وقت
    }
});


// تحميل مكتبة Swiper.js ديناميكيًا
function loadSwiperScript(callback) {
    const script = document.createElement("script");
    script.src = "https://cdn.jsdelivr.net/npm/swiper@10/swiper-bundle.min.js";
    script.onload = callback; // تشغيل الكود بعد تحميل المكتبة
    document.body.appendChild(script);
}

// تحميل مكتبة Swiper CSS أيضًا
function loadSwiperStyles() {
    const link = document.createElement("link");
    link.rel = "stylesheet";
    link.href = "https://cdn.jsdelivr.net/npm/swiper@10/swiper-bundle.min.css";
    document.head.appendChild(link);
}

// تحميل Swiper ثم تشغيله بعد التأكد من تحميله بالكامل
loadSwiperStyles();
loadSwiperScript(() => {
    console.log("Swiper.js Loaded!");