// البحث عن عنصر h3 داخل footer .store-footer__inner a
const h3Element = document.querySelector('footer .store-footer__inner a h3');
if (h3Element) {
    // إنشاء عنصر img جديد
    const imgElement = document.createElement('img');
    imgElement.src ="https://i.postimg.cc/kX97yNJx/opxqpij3-C1f-M0-P4jm8we-TUD7-Ag0-Y7-LD2-Ia-ZCXGP8-1.png";
    imgElement.alt = 'Store Logo'; // يمكنك تغيير النص البديل حسب الحاجة
    
    // إضافة أي styles مطلوبة للصورة (اختياري)
    imgElement.style.maxWidth = '70%';
    imgElement.style.height = 'auto';
    
    // استبدال h3 بالصورة
    h3Element.parentNode.replaceChild(imgElement, h3Element);
}
  
  
 
  
  
  
  
  /******************************************/
  
  
  // Category Slider - بسيط ومايتكررش
(function() {
  'use strict';

  // منع التكرار
  if (window.categorySliderLoaded) return;
  window.categorySliderLoaded = true;

  const categories = [
    {
      img: "https://i.postimg.cc/d3V4qSR2/Group-10.png",
      url: "https://dafi-sa.com/%D9%85%D8%B1%D8%A7%D8%AA%D8%A8-%D8%B3%D8%B1%D9%8A%D8%B1-%D9%88%D9%84%D8%A8%D8%A7%D8%AF%D8%A7%D8%AA-%D9%88%D9%88%D8%A7%D9%82%D9%8A-%D9%85%D8%B1%D8%AA%D8%A8%D8%A9/c1197286169",
    },
    {
      img: "https://i.postimg.cc/Bb7NtcNd/Group-11.png",
      url: "https://dafi-sa.com/%D8%A7%D9%84%D9%85%D9%81%D8%A7%D8%B1%D8%B4/c709558655",
    },
    {
      img: "https://i.postimg.cc/QNff6hs0/Group-12.png",
      url: "https://dafi-sa.com/%D9%84%D8%A8%D8%A7%D8%AF%D8%A7%D8%AA/c2084577468",
    },
    {
      img: "https://i.postimg.cc/sxyv55B2/Group-7-1.png",
      url: "https://dafi-sa.com/%D9%85%D9%86%D8%A7%D8%B4%D9%81-%D9%88%D8%A7%D8%B1%D9%88%D8%A7%D8%A8-%D8%AD%D9%85%D8%A7%D9%85/c1455980467",
    },
    {
      img: "https://i.postimg.cc/fRtqtFG5/Group-4.png",
      url: "https://dafi-sa.com/%D9%84%D8%A8%D8%A7%D8%AF-%D8%B1%D9%88%D9%8A%D8%A7%D9%84/c1982592342",
    },
    {
      img: "https://i.postimg.cc/SxBTWdq4/Group-5.png",
      url: "https://dafi-sa.com/offers",
    },
    {
      img: "https://i.postimg.cc/4d5WRTc4/Group-6.png",
      url: "https://dafi-sa.com/%D8%A7%D9%84%D8%B3%D8%AC%D8%A7%D8%AF-%D9%88%D8%B4%D8%B1%D8%A7%D8%B4%D9%81-%D8%A7%D9%84%D8%B5%D9%84%D8%A7%D8%A9/c546741948",
    },
    {
      img: "https://i.postimg.cc/KYt9QTvM/Group-8.png",
      url: "https://dafi-sa.com/offers",
    },
    {
      img: "https://i.postimg.cc/mDRmnrt6/Group-9.png",
      url: "https://dafi-sa.com/%D9%88%D8%B3%D8%A7%D8%A6%D8%AF-%D9%88%D9%85%D8%AE%D8%AF%D8%A7%D8%AA/c1031263414",
    },
  ];

  function createSlider() {
    const slides = categories.map(item => `
      <div class="swiper-slide">
        <a href="${item.url}">
          <img src="${item.img}" alt="Category" loading="lazy">
        </a>
      </div>
    `).join('');

    return `
      <div class="category-slider-wrapper" id="uniqueSlider">
        <div class="custom-prev">‹</div>
        <div class="category-slider">
          <div class="swiper">
            <div class="swiper-wrapper">${slides}</div>
          </div>
        </div>
        <div class="custom-next">›</div>
      </div>
      <style>
        .category-slider-wrapper {
          margin: 20px auto;
          width: 100%;
          max-width: 100%;
          display: flex;
          align-items: center;
          justify-content: center;
          gap: 20px;
          touch-action: pan-y;
          overscroll-behavior-x: contain;
          padding: 0 20px;
        }
        .category-slider {
          width: 80%;
          position: relative;
        }
        .category-slider .swiper {
          padding: 10px 0;
        }
        .category-slider .swiper-slide {
          width: auto;
          flex-shrink: 0;
        }
        .category-slider .swiper-slide a {
          display: block;
          transition: transform 0.3s ease;
        }
        .category-slider .swiper-slide a:hover {
          transform: scale(1.05);
        }
        .category-slider img {
          width: 100%;
          height: auto;
          border-radius: 8px;
          display: block;
        }
        .custom-prev, .custom-next {
          width: 50px;
          height: 50px;
          background: white;
          border-radius: 50%;
          display: flex;
          align-items: center;
          justify-content: center;
          cursor: pointer;
          box-shadow: 0 4px 15px rgba(0,0,0,0.1);
          transition: all 0.3s ease;
          border: 2px solid #f0f0f0;
          color: #0b60b0;
          font-size: 24px;
          font-weight: bold;
          user-select: none;
          flex-shrink: 0;
          touch-action: manipulation;
          -webkit-touch-callout: none;
          -webkit-user-select: none;
          -khtml-user-select: none;
          -moz-user-select: none;
          -ms-user-select: none;
        }
        .custom-prev:hover, .custom-next:hover {
          transform: scale(1.1);
          box-shadow: 0 6px 20px rgba(11, 96, 176, 0.3);
          background: #0b60b0;
          color: white;
        }
        @media (max-width: 768px) {
          .category-slider-wrapper { 
            padding: 0 15px;
          }
          .custom-prev, .custom-next { width: 35px; height: 35px; font-size: 14px; }
          .category-slider { width: 80%; }
        }
        
        @media (max-width: 480px) {
          .category-slider-wrapper { 
            gap: 6px;
            padding: 0 12px;
          }
          .custom-prev, .custom-next { width: 32px; height: 32px; font-size: 12px; }
          .category-slider { width: 82%; }
        }
      </style>
    `;
  }

  function waitForSwiper() {
    return new Promise(resolve => {
      if (window.Swiper) {
        resolve(true);
        return;
      }
      
      let attempts = 0;
      const checkSwiper = () => {
        attempts++;
        if (window.Swiper) {
          resolve(true);
        } else if (attempts > 20) { // 2 ثانية فقط
          resolve(false);
        } else {
          setTimeout(checkSwiper, 100);
        }
      };
      checkSwiper();
    });
  }

  async function init() {
    // شيل أي slider موجود
    const existing = document.querySelector('#uniqueSlider');
    if (existing) return; // لو موجود خلاص، خروج

    // دور على مكان نضع فيه السليدر
    const target = document.querySelector('.s-block--photos-slider') || 
                  document.querySelector('main') || 
                  document.body;

    if (!target) return;

    // استنى Swiper
    const hasSwiperSuccess = await waitForSwiper();
    if (!hasSwiperSuccess) return; // لو مش موجودة، خروج

    // اضافة السليدر
    target.insertAdjacentHTML('afterend', createSlider());

    // تشغيل Swiper
    setTimeout(() => {
      const swiper = new window.Swiper('#uniqueSlider .swiper', {
        slidesPerView: 'auto',
        spaceBetween: 15,
        loop: true,
        autoplay: {
          delay: 3000,
          disableOnInteraction: false,
        },
        breakpoints: {
          320: { slidesPerView: 4, spaceBetween: 8 },
          480: { slidesPerView: 4, spaceBetween: 10 },
          768: { slidesPerView: 5, spaceBetween: 15 },
          1024: { slidesPerView: 7, spaceBetween: 15 },
        }
      });

      // الأزرار مع منع الـ scroll
      const prevBtn = document.querySelector('#uniqueSlider .custom-prev');
      const nextBtn = document.querySelector('#uniqueSlider .custom-next');

      if (prevBtn) {
        prevBtn.addEventListener('click', (e) => {
          e.preventDefault();
          e.stopPropagation();
          swiper.slidePrev();
        });
        
        prevBtn.addEventListener('touchstart', (e) => {
          e.preventDefault();
          e.stopPropagation();
        });
      }
      
      if (nextBtn) {
        nextBtn.addEventListener('click', (e) => {
          e.preventDefault();
          e.stopPropagation();
          swiper.slideNext();
        });
        
        nextBtn.addEventListener('touchstart', (e) => {
          e.preventDefault();
          e.stopPropagation();
        });
      }
    }, 200);
  }

  // تشغيل واحد بس
  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', init, { once: true });
  } else {
    init();
  }

})();