document.addEventListener('DOMContentLoaded', function() {
function fixSlider(containerSelector, perRow) {
const containers = document.querySelectorAll(containerSelector);
if (!containers.length) return;

containers.forEach(container => {  
  // ✅ تجاهل السلايدر العلوي (الذي لا يحتوي منتجات)  
  if (!container.querySelector('.s-product-card-vertical, .s-products-slider-card')) return;  

  const slides = container.querySelectorAll('.swiper-slide, .s-products-slider-card');  
  slides.forEach(s => {  
  s.style.flex = '0 0 ' + (100 / perRow) + '%';
  s.style.maxWidth = (100 / perRow) + '%';
  s.style.boxSizing = 'border-box';

  // ✅ إضافة مسافة صغيرة بين المنتجات على الكمبيوتر
  if (window.innerWidth > 768) {
    s.style.paddingRight = '2px'; // ← هنا المسافة بين البطاقات
  } else {
    s.style.paddingRight = '0';
  }
});

  
const wrapper = container.querySelector('.swiper-wrapper, .s-products-slider-wrapper');  
if (wrapper) {
  if (window.innerWidth > 768) {
    wrapper.style.gap = '4px'; // ← المسافة بين البطاقات على الكمبيوتر
  } else {
    wrapper.style.gap = '0'; // لا مسافة على الجوال
  }
}  
});
}

// الصفحة الرئيسية = 3 بطاقات
if (document.body.classList.contains('home-page')) {
fixSlider('.s-slider-container', 3);
fixSlider('.s-products-slider-wrapper', 3);
}

// صفحات التصنيفات = 2 بطاقات
if (document.body.classList.contains('collection-page')) {
fixSlider('.s-slider-container', 2);
fixSlider('.s-products-slider-wrapper', 2);
}

// عند تغيير حجم الشاشة
let resizeTimer;
window.addEventListener('resize', () => {
clearTimeout(resizeTimer);
resizeTimer = setTimeout(() => {
const per = (window.innerWidth <= 768) ? 2 : 3;
fixSlider('.s-slider-container', per);
fixSlider('.s-products-slider-wrapper', per);
}, 120);
});

// مراقبة تغير DOM (في حال تحميل ديناميكي)
const observer = new MutationObserver(() => {
const per = document.body.classList.contains('collection-page')
? 2
: (window.innerWidth <= 768 ? 2 : 3);
fixSlider('.s-slider-container', per);
fixSlider('.s-products-slider-wrapper', per);
});
observer.observe(document.body, { childList: true, subtree: true });
});

/* الى هنا الستبق */// 🎯 // 🎯 خط أزرق غامق٧


          
    document.addEventListener("DOMContentLoaded", function () {
  if (!document.querySelector(".bottom-bar")) {
    // إنشاء الحاوية
    const container = document.createElement("div");
    container.className = "bottom-bar";

    const ul = document.createElement("ul");
    ul.className = "bottom-bar-list";

    // الأزرار مع روابطها الحقيقية
    const buttons = [
      { class: "home", icon: "sicon-house-door", text: "الرئيسية", link: "/" },
      { class: "menu", icon: "sicon-menu", text: "الأقسام", link: "#mobile-menu" },
      { class: "cart", icon: "sicon-shopping-bag", text: "السلة", link: "/cart", countClass: "s-cart-summary-count" },
      { class: "search", icon: "sicon-search", text: "بحث", link: "#search" },
      { class: "login", icon: "sicon-user-circle", text: "الحساب", link: "/profile" }
    ];

    buttons.forEach(btn => {
      const li = document.createElement("li");
      li.className = "bottom-bar-button";

      let countSpan = "";
      if (btn.countClass) {
        countSpan = `<span class="${btn.countClass}">0</span>`;
      }

      li.innerHTML = `<a href="${btn.link}"><i class="${btn.icon}"></i><span>${btn.text}</span>${countSpan}</a>`;
      ul.appendChild(li);
    });

    container.appendChild(ul);
    document.body.appendChild(container);

    // CSS
    const style = document.createElement("style"); 
    style.textContent = `
      .bottom-bar {
        position: fixed;
        bottom: 0px;
        left: 50%;
        transform: translateX(-50%);
        background:  #ffffff;
        padding: 5px 45px;
        border-radius: 15px;
        display: flex;
        justify-content: center;
        box-shadow: 0 4px 12px rgba(0,0,0,0.15);
        z-index: 99999;
        backdrop-filter: blur(10px);
        transition: opacity .25s ease, visibility .25s ease;
        color:#000;
      }
      .bottom-bar.hidden { opacity: 0; visibility: hidden; }
      .bottom-bar-list { display: flex; flex-direction: row; gap: 30px; margin: 0; padding: 0; list-style: none; }
      .bottom-bar-button a { text-align: center; display: flex; flex-direction: column; align-items: center; text-decoration: none; position: relative; }
      .bottom-bar-button i { font-size: 18px; margin-bottom: 1px; }
      .bottom-bar-button span { font-size: 10px; font-weight: 600; color:#000; }
      .s-cart-summary-count {
        position: absolute;
        top: -4px;
        right: -8px;
        background: red;
        color: white;
        font-size: 10px;
        padding: 2px 5px;
        border-radius: 50%;
      }
      .bottom-bar-button:hover { transform: scale(1.1); transition: transform 0.2s ease; }
    `;
    document.head.appendChild(style);

    // ---------------------
    // تحديث عداد السلة تلقائي
    // ---------------------
    function updateCartCount() {
      const mainCartCount = document.querySelector(".s-cart-summary-count");
      const bottomCartCount = container.querySelector(".s-cart-summary-count");

      if (mainCartCount && bottomCartCount) {
        bottomCartCount.textContent = mainCartCount.textContent;
      }
    }

    // تحديث كل ثانية أو عند أي تغيير في السلة
    setInterval(updateCartCount, 1000);

    // ---------------------
    // إخفاء تلقائي آمن
    // ---------------------
    function toggleBottomBar() {
      const popups = document.querySelectorAll(`
        .active,
        .open,
        .show,
        [aria-expanded="true"],
        [data-angelmodal-open],
        .drawer-open,
        .modal,
        .salla-modal,
        .side-menu,
        #mobile-menu
      `);
       
      let visiblePopup = false;

      popups.forEach(el => {
        if (!el || container.contains(el)) return;
        const style = window.getComputedStyle(el);
        const op = parseFloat(style.opacity || "1");
        if (style.display !== "none" && style.visibility !== "hidden" && op > 0.01 && el.offsetWidth > 0 && el.offsetHeight > 0) {
          visiblePopup = true;
        }
      });

      if (visiblePopup) {
        container.classList.add("hidden");
      } else {
        container.classList.remove("hidden");
      }
    }

    ['click','keyup','mouseover'].forEach(evt => {
      window.addEventListener(evt, toggleBottomBar, {passive:true});
    });

    toggleBottomBar();
    updateCartCount(); // تحديث أولي
  }
});

  
    
/* Add custom Js styles below */ 
// 🌟 تضمين CSS مخصص
const style = document.createElement('style');
style.textContent = `
  /* عنوان أقسام المتجر */
  .quick-links-title {
    text-align: center;
    font-size: 1.5rem;
    font-weight: bold;
    color: #000000;
    margin-bottom: 15px;
  }

  /* شبكة الروابط السريعة أفقية */
.quick-links-container {
  display: flex;
  flex-wrap: nowrap;        /* صف واحد فقط */
  gap: 2;                   /* مسافة بين الدوائر 0 */
  overflow-x: auto;         /* تمكين السحب الأفقي */
  padding: 3px;               /* إزالة الحشوة */
  margin: 3px;  
  background:  #ffffff; /* إزالة الهوامش */
}

.quick-link {
 /* flex: 0 0 auto;   */        /* لا ينكمش ولا يتمدد */
  width: 120px;  /* عرض ثابت لكل دائرة */
  text-align: center;
  margin: 5px;                /* إزالة أي margin إضافي */
  padding: 0;  /* إزالة أي padding إضافي */
  
}

  .quick-links-container::-webkit-scrollbar {
    height: 0px;
  }
  .quick-links-container::-webkit-scrollbar-thumb {
    background-color: #ffffff;
    border-radius: 4px;
  }

  .quick-link {
    flex: 0 0 auto;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 120px;
  }

  .quick-link img {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    object-fit: cover;
    border: 0px solid #d4af37;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
  }

  .quick-link img:hover {
    transform: scale(1.08);
    box-shadow: 0 4px 12px rgba(0,0,0,0.25);
  }

  .quick-link span {
    display: fixed ;
    margin-top: 5px;
    font-weight: 600;
    font-size: 16px;
    color: #333;
    
  }

  @media (max-width: 600px) {
    .quick-link {
      width: 90px;
    }
    .quick-link img {
      width: 90px;
      height: 90px;
    }
    .quick-link span {
      font-size: 14px;
    }
  }
`;
document.head.appendChild(style);

// 🌟 عند تحميل الصفحة
document.addEventListener("DOMContentLoaded", function () {

  // ✅ الصفحة الرئيسية فقط
  if (window.location.pathname === "/" || window.location.pathname === "/index.html") {

    // ✅ عنوان أقسام المتجر
    const title = document.createElement("div");
    title.className = "quick-links-title";
    title.textContent = "أقسام المتجر";

    // ✅ بيانات الروابط السريعة
    const links = [
      { text: "هدايا رجالية", url: "https://basmat-hdaya.com/هدايا-رجالية/c1266504386", img: "https://cdn.salla.sa/NKXNOK/361bd36f-105f-4324-ba3f-fa958ef0087c-1000x1000-4CmqeaVWhwpNFfagjl7QYDNRvc3xgSJpo2CNyMMB.jpg" },
      { text: "نظارات", url: "https://basmat-hdaya.com/نظارات/c1514560202", img: "https://cdn.salla.sa/NKXNOK/64fb1efa-2e0f-4341-a73b-d5ee4343f549-1000x1000-7UegAcyrACKb5k7gzU6ZMUJyS4wWfPqIapjRFhwj.jpg" },
      { text: "اقلام", url: "https://basmat-hdaya.com/اقلام/c142162889", img: "https://cdn.salla.sa/NKXNOK/dd69baf2-7a5e-438a-abec-87ef07080af4-1000x1000-MHike7kOeN6XLCilT25nFy8PsH7Afu5mPtcO7ZVV.jpg" },
      { text: "ساعات", url: "https://basmat-hdaya.com/ساعات/c1050418376", img: "https://cdn.salla.sa/NKXNOK/fe28b4f8-eeed-4ca5-8e63-37e3606e858f-1000x1000-1OqnX04fay28UXvckSPfMTDgGnYemq0OPAxVjNYE.jpg" },
      { text: "بوكسات", url: "https://basmat-hdaya.com/بوكسات/c1091420109", img: "https://cdn.salla.sa/NKXNOK/2cbbfeba-45c0-4b60-926b-22cbac73ccc9-1000x1000-Z7U6MzLe8sUjJovanNHJZgeYUu8oREd4rDlINVtg.jpg" },
      { text: "اشمغه رجالية", url: "https://basmat-hdaya.com/شماغات/c1950614480", img: "https://cdn.salla.sa/NKXNOK/269ccb3a-5ca5-435b-86cb-d6ca9b3acedb-1000x1000-EuxjDMUEGaAXa0sBMVGM1ZIxdCqyS5Ut50xZyyYG.jpg" },
      { text: "هدايا شتويه", url: "https://basmat-hdaya.com/هدايا-شتويه/c736768753", img: "https://cdn.salla.sa/NKXNOK/7b1b620e-3294-4a1d-ad52-44ceddd67458-1000x1000-juhrDBSPKpULkLV9tPaJnHhFRqdkBoluwLgiQG8J.jpg" },
      { text: "هدايا نسائية", url: "https://basmat-hdaya.com/هدايا-نسائيه/c241298911", img: "https://cdn.salla.sa/NKXNOK/de87f818-8695-4b47-9009-ad0880e2b598-1000x1000-foOovkd9GlCc6qTIzbyA8gOEUQSk68FbXil7v2gh.jpg" },
      { text: "افكار هدايا ", url: "https://basmat-hdaya.com/افكار-هدايا/c1086856913", img: "https://cdn.salla.sa/NKXNOK/161be8a8-9e64-4ee4-bc0c-4aae28ba8129-1000x1000-fq654D9pr0VQhn02Yf4KjZMJBe0fAVLtkbplVT0v.jpg" },
      { text: "اقمشه رجالية ", url: "https://basmat-hdaya.com/اقمشه-رجاليه/c1927747258", img: "https://cdn.salla.sa/NKXNOK/ab204b18-d2e6-481e-b3f1-2b31a8916ea5-1000x1000-sYXU6ek35GLCwNDfJbrNKktih8SHXH4hiGg8PUX3.jpg" },
      { text: "بلوفرات رياضية ", url: "https://basmat-hdaya.com/بلوفرات-رياضية/c548793007", img: "https://cdn.salla.sa/NKXNOK/07752fd6-c498-403d-90e8-93115bab712e-1000x1000-w9zEOcOzk9Hc1NVFrYAyM5JclOQYCYmoLK3Sw5qi.jpg" },
      { text: "تيشرتات رياضيه", url: "https://basmat-hdaya.com/قسم-الملابس-الرياضية/c51592661", img: "https://cdn.salla.sa/NKXNOK/a8631b5d-2f3d-400f-8caa-918a8d087b45-1000x1000-3z7XphXzdCXkECCBKbE8K9EHANrbwt0FUHD1x5nI.jpg" }
    ];

    // ✅ إنشاء الحاوية
    const container = document.createElement("div");
    container.className = "quick-links-container";

    links.forEach(link => {
      const div = document.createElement("div");
      div.className = "quick-link";

      const a = document.createElement("a");
      a.href = link.url;
      a.target = "_blank";

      const img = document.createElement("img");
      img.src = link.img;
      img.alt = link.text;

      const span = document.createElement("span");
      span.textContent = link.text;

      a.appendChild(img);
      div.appendChild(a);
      div.appendChild(span);
      container.appendChild(div);
    });

    // ✅ إدراج العنوان والحاوية في الصفحة
    const wrapper = document.createElement("div");
    wrapper.appendChild(title);
    wrapper.appendChild(container);

    const slider = document.querySelector('[class*="slider"], [id*="slider"], [class*="slideshow"]');
    if (slider && slider.parentNode) {
      slider.parentNode.insertBefore(wrapper, slider.nextSibling);
    } else {
      document.body.insertBefore(wrapper, document.body.firstChild);
    }
  }

  // ✅ زر واتساب
  if (!document.getElementById("whatsapp-button")) {
    const wa = document.createElement("a");
    wa.href = "https://wa.me/966546491890?text=مرحباً%20أريد%20المساعدة";
    wa.id = "whatsapp-button";
    wa.target = "_blank";
    wa.rel = "noopener";

    const icon = document.createElement("img");
    icon.src = "https://cdn-icons-png.flaticon.com/512/124/124034.png";
    icon.alt = "WhatsApp";

    const text = document.createElement("span");
    text.textContent = "خدمة العملاء";

    wa.appendChild(icon);
    wa.appendChild(text);
    document.body.appendChild(wa);
  }

  // ✅ فقاعة الترحيب
  if (!sessionStorage.getItem("welcomeShown")) {
    const bubble = document.createElement("div");
    bubble.className = "whatsapp-bubble";
    bubble.textContent = "🛒 اذا كنت بحاجة لمساعدة في طلبك؟ نحن هنا من أجلك";
    document.body.appendChild(bubble);

    setTimeout(() => bubble.classList.add("hide"), 5000);
    sessionStorage.setItem("welcomeShown", "true");
  }
});
// 🌟 تمكين السحب الأفقي (Drag / Swipe)
document.addEventListener("DOMContentLoaded", function () {
  const slider = document.querySelector(".quick-links-container");
  if (!slider) return;

  let isDown = false;
  let startX;
  let scrollLeft;

  // 🖱️ ماوس
  slider.addEventListener("mousedown", (e) => {
    isDown = true;
    slider.classList.add("dragging");
    startX = e.pageX - slider.offsetLeft;
    scrollLeft = slider.scrollLeft;
  });

  slider.addEventListener("mouseleave", () => {
    isDown = false;
    slider.classList.remove("dragging");
  });

  slider.addEventListener("mouseup", () => {
    isDown = false;
    slider.classList.remove("dragging");
  });

  slider.addEventListener("mousemove", (e) => {
    if (!isDown) return;
    e.preventDefault();
    const x = e.pageX - slider.offsetLeft;
    const walk = (x - startX) * 1.5;
    slider.scrollLeft = scrollLeft - walk;
  });

  // 📱 لمس (جوال)
  slider.addEventListener("touchstart", (e) => {
    startX = e.touches[0].pageX;
    scrollLeft = slider.scrollLeft;
  });

  slider.addEventListener("touchmove", (e) => {
    const x = e.touches[0].pageX;
    const walk = (x - startX) * 1.5;
    slider.scrollLeft = scrollLeft - walk;
  });
});

/* الخصم */
document.addEventListener("DOMContentLoaded", () => {

  function normalizePrice(text) {
    const map = { '٠':0,'١':1,'٢':2,'٣':3,'٤':4,'٥':5,'٦':6,'٧':7,'٨':8,'٩':9 };

    return parseFloat(
      text
        // تحويل الأرقام العربية
        .replace(/[٠-٩]/g, d => map[d])
        // إزالة فواصل الآلاف (عربي / إنجليزي)
        .replace(/[٬,]/g, '')
        // إزالة أي شيء غير رقم أو نقطة
        .replace(/[^\d.]/g, '')
    );
  }

  function addDiscountBadge() {

    document.querySelectorAll(".s-product-card-image").forEach(imgContainer => {

      if (imgContainer.querySelector(".discount-badge")) return;

      const card =
        imgContainer.closest(".s-product-card-vertical")
        || imgContainer.closest(".s-product-card")
        || imgContainer.closest(".s-product-card-content");

      if (!card) return;

      const newPriceEl = card.querySelector(".s-product-card-sale-price h4");
      const oldPriceEl = card.querySelector(".s-product-card-sale-price span");

      if (!newPriceEl || !oldPriceEl) return;

      const newPrice = normalizePrice(newPriceEl.textContent);
      const oldPrice = normalizePrice(oldPriceEl.textContent);

      if (!newPrice || !oldPrice || oldPrice <= newPrice) return;

      const discount = Math.round(((oldPrice - newPrice) / oldPrice) * 100);
      if (discount <= 0) return;

      const badge = document.createElement("span");
      badge.className = "discount-badge";
      badge.textContent = `${discount}%`;

      imgContainer.style.position = "relative";
      imgContainer.appendChild(badge);
    });
  }

  // تشغيل مستمر ثابت
  addDiscountBadge();
  setInterval(addDiscountBadge, 1000);

});

/* وفر */
document.addEventListener("DOMContentLoaded", () => {

  function normalizePrice(text) {
    const map = { '٠':0,'١':1,'٢':2,'٣':3,'٤':4,'٥':5,'٦':6,'٧':7,'٨':8,'٩':9 };
    return parseFloat(
      text
        .replace(/[٠-٩]/g, d => map[d])
        .replace(/[٬,]/g, '')
        .replace(/[^\d.]/g, '')
    );
  }

  function addSaveBox() {

    // 🔒 يعمل فقط في صفحة المنتج (وجود السعر بهذا الشكل)
    const newPriceEl = document.querySelector("h4.text-red-800");
    const oldPriceEl = document.querySelector("span.line-through");

    if (!newPriceEl || !oldPriceEl) return;

    const priceWrapper = newPriceEl.parentElement;
    if (!priceWrapper || priceWrapper.querySelector(".save-box")) return;

    const newPrice = normalizePrice(newPriceEl.textContent);
    const oldPrice = normalizePrice(oldPriceEl.textContent);

    if (isNaN(newPrice) || isNaN(oldPrice) || oldPrice <= newPrice) return;

    const saveAmount = Math.round(oldPrice - newPrice);
    if (saveAmount <= 0) return;

    const box = document.createElement("div");
    box.className = "save-box";

    box.innerHTML = `
      <span class="fire">🔥</span>
      <span class="text">
        وفّر
        <strong>${saveAmount} <i class="sicon-sar"></i></strong>
      </span>
    `;

    priceWrapper.appendChild(box);
  }

  addSaveBox();
  setInterval(addSaveBox, 600); // لأن سلة ديناميكية
});

document.addEventListener("DOMContentLoaded", () => {
  const target = document.querySelector(
    ".s-block--features__item h2"
  );

  if (!target) return;

  const maxNumber = 5450;
  const step = 150;
  let current = 0;
  let started = false;

  function startCounter() {
    if (started) return;
    started = true;

    const interval = setInterval(() => {
      current += step;

      if (current >= maxNumber) {
        current = maxNumber;
        clearInterval(interval);
      }

      target.textContent = `+${current}`;
    }, 60); // سرعة الزيادة (كل 150ms)
  }

  const observer = new IntersectionObserver(
    (entries) => {
      entries.forEach(entry => {
        if (entry.isIntersecting) {
          startCounter();
          observer.disconnect(); // يمنع التكرار
        }
      });
    },
    {
      threshold: 0.5 // يبدأ عند ظهور 50% من العنصر
    }
  );

  observer.observe(target);
});