window.addEventListener("load", function () {
  if (window.location.href.indexOf("/checkout/") > -1) {
    var div = document.createElement("div");
    div.id = "wa-selia-checkout";
    div.style.cssText = "position:fixed;bottom:20px;right:20px;z-index:99999;background:#22c55e;border-radius:50%;width:55px;height:55px;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 10px rgba(0,0,0,0.3);";
    div.innerHTML = '<a href="https://wa.me/+966563602563?text=%D9%85%D8%B1%D8%AD%D8%A8%D8%A7%20..%20%D9%84%D8%AF%D9%8A%20%D8%A7%D8%B3%D8%AA%D9%81%D8%B3%D8%A7%D8%B1%20%D8%A8%D8%AE%D8%B5%D9%88%D8%B5%20" target="_blank" style="display:flex;align-items:center;justify-content:center;"><i class="sicon-whatsapp2" style="color:#fff;font-size:28px;"></i></a>';
    document.body.appendChild(div);
  }
});






document.addEventListener("DOMContentLoaded", function () {

  // شيل أي فوتر قديم
  document.querySelectorAll('footer:not(.custom-footer)').forEach(function(el) {
    el.remove();
  });

  if (!document.querySelector('.custom-footer')) {

    const footerHTML = `
<footer class="custom-footer">

<!-- footer top -->
<div class="footer-top">
  <div class="container">

    <div class="footer-grid">

      <!-- logo + about -->
      <div class="footer-col">
        <img src="https://cdn.files.salla.network/homepage/1372176879/cb847eb3-2f31-404c-9dcc-03a0c8249895.webp"
             height="80"
             alt="Potion"
             class="footer-logo">

        <p class="footer-text">
          عطور فاخرة تناسب جميع الأذواق، عطور رجالية فاخرة وعطور نسائية ساحرة وثبات يدوم طويلاً. شحن سريع في جميع مناطق السعودية والخليج.
        </p>
      </div>

      <!-- important links -->
      <div class="footer-col">
        <h3>روابط مهمة</h3>
        <ul>
          <li><a href="https://salla.sa/potionperfumes.shop/blog">المدونة</a></li>
          <li><a href="https://salla.sa/potionperfumes.shop/%D9%85%D8%B9%D9%84%D9%88%D9%85%D8%A7%D8%AA-%D8%B9%D9%86%D8%A7/page-38143457">معلومات عنا</a></li>
          <li><a href="https://salla.sa/potionperfumes.shop/%D8%AA%D8%B1%D8%A7%D8%AE%D9%8A%D8%B5-%D8%A7%D9%84%D9%85%D9%86%D8%AA%D8%AC%D8%A7%D8%AA-%D8%A7%D9%84%D8%BA%D8%B0%D8%A7%D8%A1-%D9%88%D8%A7%D9%84%D8%AF%D9%88%D8%A7%D8%A1/page-975424905">تراخيص المنتجات</a></li>
                 <li><a href="https://salla.sa/potionperfumes.shop/%D8%B3%D9%8A%D8%A7%D8%B3%D8%A7%D8%AA-%D8%A7%D9%84%D8%A7%D8%B3%D8%AA%D8%AE%D8%AF%D8%A7%D9%85-%D9%88%D8%A7%D9%84%D8%AE%D8%B5%D9%88%D8%B5%D9%8A%D8%A9/page-1572170660">سياسات الاستخدام والخصوصية</a></li>
          <li><a href="https://salla.sa/potionperfumes.shop/%D8%B3%D9%8A%D8%A7%D8%B3%D8%A9-%D8%A7%D9%84%D8%A7%D8%B3%D8%AA%D8%A8%D8%AF%D8%A7%D9%84-%D9%88%D8%A7%D9%84%D8%A7%D8%B3%D8%AA%D8%B1%D8%AC%D8%A7%D8%B9/page-798198437"> سياسة الاستبدال والاسترجاع</a></li>
          <li><a href="https://salla.sa/potionperfumes.shop/%D8%AA%D8%B1%D8%A7%D8%AE%D9%8A%D8%B5-%D8%A7%D9%84%D9%85%D9%86%D8%AA%D8%AC%D8%A7%D8%AA-%D8%A7%D9%84%D8%BA%D8%B0%D8%A7%D8%A1-%D9%88%D8%A7%D9%84%D8%AF%D9%88%D8%A7%D8%A1/page-975424905">تراخيص-المنتجات-الغذاء-والدواء</a></li>

        
        
        </ul>
      </div>

      <!-- contact -->
      <div class="footer-col">
        <h3>تواصل معنا</h3>
        <ul>
          <li><a href="tel:+966563602563">+966563602563</a></li>
          <li><a href="mailto:info@potionperfumes.shop">info@potionperfumes.shop</a></li>
          <li>مول العثيم، الرياض، السعودية</li>
        </ul>
      </div>

      <!-- store info -->
      <div class="footer-col">
        <h3>معلومات المتجر</h3>

        <ul>
          <li>
            <a href="https://www.google.com/maps?cid=17035606948587802884" target="_blank">
              موقعنا على الخريطة
            </a>
          </li>
          <li>
            <a href="https://cdn.files.salla.network/homepage/1372176879/d9d719e7-f2cf-4749-8e93-c1f5c2d3ead8.webp">
              شهادة السجل التجاري
            </a>
          </li>
        </ul>

        <div style="margin-top:10px; display:flex; flex-direction:row; gap:10px; align-items:center;">
            <a style="    width: 21%; " href="https://cdn.files.salla.network/homepage/1372176879/d9d719e7-f2cf-4749-8e93-c1f5c2d3ead8.webp" target="_blank">
              <img style="border-left:2px #fff solid; padding-left:10px; max-width:100% !important;"
                   src="https://cdn.salla.network/cdn-cgi/image/fit=scale-down,format=auto/images/commercial-register.png"
                   alt="السجل">
            </a>
              <div style=" gap:10px;">
            <div style="    display: flex;
    justify-content: flex-start;
    align-items: flex-start;    flex-direction: column; text-align:right; font-size:13px; color:#fff; line-height:1.8;">
              <div>السجل التجاري</div>
              <div><strong style="">7042988407</strong></div>
            </div>
          </div>
        </div>

        
     
        <img src="https://cdn.assets.salla.network/themes/581928698/1.174.0/images/ksa-arabic.svg"
               style="    height: 50px;
    margin-top: 12px;" alt="KSA">
        </div>


    </div>
  </div>
</div>

<!-- footer bottom -->
<div class="footer-bottom">
  <div class="container py-4">

    <div class="footer-bottom-flex">

      <div class="footer-rights">
        <p>© 2026 شركة دار النفائس الموثقة للتجارة. جميع الحقوق محفوظة.</p>
      </div>

      <div class="footer-payments">
        <salla-payments></salla-payments>
      </div>

      <div class="footer-social">
        <salla-social></salla-social>
      </div>

    </div>

  </div>
</div>

</footer>
`;

    document.body.insertAdjacentHTML("beforeend", footerHTML);

  }

});






(function () {
  function isHomePage() {
    var path = window.location.pathname;
    return (
      path === "/" ||
      path === "" ||
      path === "/potionperfumes.shop" ||
      path === "/potionperfumes.shop/" ||
      path.endsWith("/potionperfumes.shop") ||
      path.endsWith("/potionperfumes.shop/")
    );
  }

  function showPopup() {
    if (!isHomePage()) return;
    if (document.getElementById("eid-popup")) return;

    var popup = document.createElement("div");
    popup.innerHTML = `
      <div id="eid-popup" style="
        position:fixed;top:0;left:0;
        width:100%;height:100%;
        background:rgba(0,0,0,0.6);
        display:flex;align-items:center;justify-content:center;
        z-index:9999999999;
      ">
        <div style="
          width:400px;height:400px;background:#fff;
          overflow:hidden;text-align:center;
          box-shadow:0 10px 30px rgba(0,0,0,0.2);
          font-family:Tahoma,sans-serif;
          display:flex;flex-direction:column;align-items:center;
        ">
          <div style="
            width:100%;height:180px;
            background:url('https://cdn.files.salla.network/homepage/1372176879/5dd1eba4-4485-4f8b-a7f9-3a72eaece90f.webp') center/cover no-repeat;
          "></div>
          <div style="flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:10px;">
            <h2 style="font-size:22px;color:#000;margin-bottom:10px;font-weight:bold;">
              حبة عليك… والثانية علينا
            </h2>
            <p style="font-size:14px;margin-bottom:15px;color:#000;">
              اشتر حبة واحصل على حبة مجاناً
            </p>
            <a href="https://salla.sa/potionperfumes.shop/%D8%AC%D9%85%D9%8A%D8%B9%20%D8%A7%D9%84%D9%85%D9%86%D8%AA%D8%AC%D8%A7%D8%AA/c890261960"
              style="
              display:inline-block;padding:10px 22px;
              background:#fff;border:1px #000 solid;color:#000;
              border-radius:30px;text-decoration:none;font-size:13px;font-weight:bold;
            ">اطلب الآن</a>
          </div>
        </div>
      </div>
    `;
    document.body.appendChild(popup);
    document.getElementById("eid-popup").onclick = function (e) {
      if (e.target.id === "eid-popup") {
        document.getElementById("eid-popup").remove();
      }
    };
  }

  window.addEventListener("load", function () {
    setTimeout(showPopup, 1200);
  });
})();













document.addEventListener('DOMContentLoaded', function() {
  function initSticky() {
    var slider = document.querySelector('.product-single__slider');
    var info = document.querySelector('.product-single__info');
    if (!slider || !info) return;

    if (window.innerWidth < 768) return;

    var img = slider.querySelector('img');
    if (img && !img.complete) {
      img.addEventListener('load', function() {
        setTimeout(setup, 100);
      });
    } else {
      setup();
    }

    function setup() {
      var placeholder = document.createElement('div');
      placeholder.style.width = slider.offsetWidth + 'px';
      placeholder.style.height = slider.offsetHeight + 'px';
      placeholder.style.flexShrink = '0';
      placeholder.style.visibility = 'hidden';
      slider.parentElement.insertBefore(placeholder, slider);

      var headerHeight = 80;
      var sliderWidth = placeholder.offsetWidth;
      var sliderHeight = placeholder.offsetHeight;

      function getSliderRight() {
        return window.innerWidth - placeholder.getBoundingClientRect().right;
      }

      slider.style.cssText = [
        'position:absolute',
        'top:0',
        'right:0',
        'width:' + sliderWidth + 'px',
        'max-width:' + sliderWidth + 'px'
      ].join(';');

      slider.parentElement.style.position = 'relative';

      function updateSlider() {
        if (window.innerWidth < 768) {
          slider.style.cssText = '';
          slider.parentElement.style.position = '';
          return;
        }

        var scrollY = window.scrollY;
        var placeholderTop = placeholder.getBoundingClientRect().top + scrollY;
        var infoBottom = info.getBoundingClientRect().bottom + scrollY;
        var stickyStart = placeholderTop - headerHeight;
        var stickyEnd = infoBottom - sliderHeight - headerHeight;

        if (scrollY < stickyStart) {
          slider.style.cssText = [
            'position:absolute',
            'top:0',
            'right:0',
            'width:' + sliderWidth + 'px',
            'max-width:' + sliderWidth + 'px'
          ].join(';');
          slider.parentElement.style.position = 'relative';
        } else if (scrollY >= stickyStart && scrollY <= stickyEnd) {
          slider.style.cssText = [
            'position:fixed',
            'top:' + headerHeight + 'px',
            'right:' + getSliderRight() + 'px',
            'width:' + sliderWidth + 'px',
            'max-width:' + sliderWidth + 'px',
            'z-index:10'
          ].join(';');
          slider.parentElement.style.position = 'relative';
        } else {
          slider.style.cssText = [
            'position:absolute',
            'top:' + (infoBottom - placeholderTop - sliderHeight) + 'px',
            'right:0',
            'width:' + sliderWidth + 'px',
            'max-width:' + sliderWidth + 'px',
            'z-index:10'
          ].join(';');
          slider.parentElement.style.position = 'relative';
        }
      }

      window.addEventListener('scroll', updateSlider);
      window.addEventListener('resize', function() {
        if (window.innerWidth < 768) {
          slider.style.cssText = '';
          slider.parentElement.style.position = '';
          return;
        }
        sliderWidth = placeholder.offsetWidth;
        sliderHeight = placeholder.offsetHeight;
        updateSlider();
      });

      updateSlider();
    }
  }

  initSticky();
});

















(function () {
  // ديسكتوب بس
  if (window.innerWidth < 768) return;

  var style = document.createElement('style');
  style.innerHTML = `
    body.mm-ocd-opened { overflow: hidden !important; margin: 0 !important; width: 100% !important; }
    .mm-ocd { z-index: 99999 !important; }
    .mm-ocd__backdrop { z-index: 99998 !important; }
    .mm-ocd__content { position: relative !important; padding-top: 55px !important; height: 100% !important; overflow-y: auto !important; background: #fff !important; }
    .mm-ocd__content::before {
      content: "القائمة الرئيسية" !important;
      position: absolute !important; top: 15px !important; right: 20px !important;
      font-size: 16px !important; font-weight: 700 !important; color: #000 !important;
    }
    .mm-ocd__content .mobile-menu-clone .main-menu {
      display: block !important;
      flex-direction: unset !important;
      padding: 11px 71px !important;
      margin: 0 !important;
    }
    .mm-ocd__content .mobile-menu-clone li.\\!hidden { display: none !important; }
    .mm-ocd__content .mobile-menu-clone .main-menu > li.lg\\:hidden {
      display: block !important;
      border-bottom: 1px solid #f0f0f0 !important;
      list-style: none !important;
    }
    .mm-ocd__content .mobile-menu-clone .main-menu > li.lg\\:hidden > a,
    .mm-ocd__content .mobile-menu-clone .main-menu > li.lg\\:hidden > span {
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      padding: 24px 0 !important;
      font-size: 14px !important;
      font-weight: 600 !important;
      color: #000 !important;
      cursor: pointer !important;
      width: 100% !important;
      direction: rtl !important;
      text-decoration: none !important;
    }
    .mm-ocd__content .mobile-menu-clone .main-menu > li.lg\\:hidden > ul {
      display: none !important;
      padding-right: 15px !important;
      margin: 0 !important;
    }
    .mm-ocd__content .mobile-menu-clone .main-menu > li.lg\\:hidden.is-open > ul {
      display: block !important;
    }
    .mm-ocd__content .mobile-menu-clone ul ul li.\\!hidden { display: none !important; }
    .mm-ocd__content .mobile-menu-clone ul ul li.lg\\:hidden {
      display: block !important;
      list-style: none !important;
    }
    .mm-ocd__content .mobile-menu-clone ul ul li.lg\\:hidden > a,
    .mm-ocd__content .mobile-menu-clone ul ul li.lg\\:hidden > span {
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      padding: 20px 0 !important;
      font-size: 14px !important;
      color: #555 !important;
      direction: rtl !important;
      border-bottom: 1px solid #f5f5f5 !important;
      text-decoration: none !important;
    }
    .mm-ocd__content .mobile-menu-clone ul ul li.lg\\:hidden > ul {
      display: none !important;
      padding-right: 15px !important;
    }
    .mm-ocd__content .mobile-menu-clone ul ul li.lg\\:hidden.is-open > ul {
      display: block !important;
    }
    .mm-ocd__content .mobile-menu-clone img {
      width: 55px !important;
      height: 55px !important;
      border-radius: 50% !important;
      margin-left: -87px !important;
    }
    .mm-ocd__content .btn--close { display: none !important; }
    .menu-arrow { font-size: 16px; transition: transform 0.3s; color: #999; flex-shrink: 0; }
    .is-open > a > .menu-arrow, .is-open > span > .menu-arrow { transform: rotate(90deg); }

    #sticky-menu-btn {
      margin-top: 22px;
      position: relative;
      width: 32px;
      height: 21px;
      background: none;
      border: none;
      padding: 0;
      cursor: pointer;
      overflow: hidden;
    }
    #sticky-menu-btn::before,
    #sticky-menu-btn::after,
    #sticky-menu-btn span.bar {
      content: '';
      display: block;
      width: 100%;
      height: 2px;
      background: currentColor;
      border-radius: 2px;
      position: absolute;
      left: 0;
      right: 0;
    }
    #sticky-menu-btn::before { top: 0; }
    #sticky-menu-btn span.bar { top: 50%; transform: translateY(-50%); }
    #sticky-menu-btn::after { bottom: 0; }

    @keyframes slideOutLeft {
      0%   { transform: translateX(0); opacity: 1; }
      100% { transform: translateX(-120%); opacity: 0; }
    }
    @keyframes slideInRight {
      0%   { transform: translateX(120%); opacity: 0; }
      100% { transform: translateX(0); opacity: 1; }
    }

    #sticky-menu-btn:hover::before {
      animation: slideOutLeft 0.15s ease forwards, slideInRight 0.2s ease 0.15s forwards;
    }
    #sticky-menu-btn:hover span.bar {
      animation: slideOutLeft 0.15s ease 0.05s forwards, slideInRight 0.2s ease 0.2s forwards;
    }
    #sticky-menu-btn:hover::after {
      animation: slideOutLeft 0.15s ease 0.1s forwards, slideInRight 0.2s ease 0.25s forwards;
    }
  `;
  document.head.appendChild(style);

  function buildMenu() {
    var mmContent = document.querySelector('.mm-ocd__content');
    if (!mmContent || document.querySelector('.mobile-menu-clone')) return;

    var mobileMenu = document.getElementById('mobile-menu');
    if (!mobileMenu) return;

    var cloned = mobileMenu.cloneNode(true);
    cloned.removeAttribute('id');
    cloned.className = 'mobile-menu-clone';
    cloned.style.cssText = 'display:block !important;';
    mmContent.appendChild(cloned);

    var closeBtn = document.createElement('button');
    closeBtn.innerHTML = '✕';
    closeBtn.style.cssText = 'position:absolute; top:15px; left:15px; background:none; border:none; font-size:20px; cursor:pointer; color:#000; z-index:10;';
    closeBtn.onclick = function () {
      var mmOcd = document.querySelector('.mm-ocd');
      if (mmOcd) mmOcd.classList.remove('mm-ocd--open');
      document.body.classList.remove('mm-ocd-opened');
    };
    mmContent.appendChild(closeBtn);

    function setupAccordion(container) {
      var items = container.querySelectorAll(':scope > li.lg\\:hidden');
      items.forEach(function (li) {
        var subMenu = li.querySelector(':scope > ul');
        if (!subMenu) return;
        var trigger = li.querySelector(':scope > a, :scope > span');
        if (!trigger) return;

        var arrow = document.createElement('span');
        arrow.className = 'menu-arrow';
        arrow.innerHTML = '&#8250;';
        trigger.appendChild(arrow);

        trigger.addEventListener('click', function (e) {
          e.preventDefault();
          var isOpen = li.classList.contains('is-open');
          items.forEach(function (other) { other.classList.remove('is-open'); });
          if (!isOpen) li.classList.add('is-open');
        });

        setupAccordion(subMenu);
      });
    }

    var mainMenu = cloned.querySelector('.main-menu');
    if (mainMenu) setupAccordion(mainMenu);
  }

  window.addEventListener('scroll', function () {
    // تأكيد تاني عند كل scroll
    if (window.innerWidth < 768) return;

    var header = document.getElementById('mainnav');
    if (!header) return;
    var stickyBtn = document.getElementById('sticky-menu-btn');

    if (window.scrollY > 100) {
      if (!stickyBtn) {
        var btn = document.createElement('button');
        btn.id = 'sticky-menu-btn';
        btn.innerHTML = '<span class="bar"></span>';
        btn.style.cssText = 'display:flex; align-items:center; cursor:pointer;';

        btn.onclick = function () {
          buildMenu();
          var mmOcd = document.querySelector('.mm-ocd');
          if (!mmOcd) return;
          if (mmOcd.classList.contains('mm-ocd--open')) {
            mmOcd.classList.remove('mm-ocd--open');
            document.body.classList.remove('mm-ocd-opened');
          } else {
            mmOcd.classList.add('mm-ocd--open');
            document.body.classList.add('mm-ocd-opened');
          }
        };

        var firstChild = header.querySelector('.flex.items-stretch');
        if (firstChild) firstChild.prepend(btn);
      }
      stickyBtn.style.display = 'flex';
    } else {
      if (stickyBtn) stickyBtn.style.display = 'none';
    }
  });
})();




















/* Add custom Js styles below */ 
(function () {
  function initDynamicPopup() {
    // إذا أغلق العميل النافذة سابقاً في هذه الجلسة، لا تظهرها
    if (sessionStorage.getItem('eid_popup_closed')) return;

    // البحث عن العناصر التي لا تظهر إلا في هوم بيدج سلة
    // سنبحث عن السلايدر أو قسم المميزات
    var homeElements = document.querySelector('.main-slider, .s-block-banners, .s-block-features-grid');
    
    if (homeElements) {
      if (!document.getElementById("eid-popup-ultimate")) {
        renderPopup();
      }
    } else {
      // إذا لم يجد عناصر الصفحة الرئيسية، يحذف البوب أب (في حال انتقل لصفحة أخرى)
      var existing = document.getElementById("eid-popup-ultimate");
      if (existing) existing.remove();
    }
  }

  function renderPopup() {
    var popup = document.createElement("div");
    popup.id = "eid-popup-ultimate";
    // تنسيق يضمن الظهور فوق كل شيء
    popup.style.cssText = "position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.85);display:flex;align-items:center;justify-content:center;z-index:999999999;direction:rtl;";

    popup.innerHTML = `
      <div style="width:85%;max-width:350px;background:#fff;position:relative;text-align:center;font-family:sans-serif;border-radius:20px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,0.5);animation: fadeInEid 0.4s ease;">
        <button id="close-eid-final" style="position:absolute;top:15px;right:15px;background:#000;color:#fff;border:none;width:28px;height:28px;border-radius:50%;cursor:pointer;font-size:14px;z-index:100;display:flex;align-items:center;justify-content:center;">✕</button>
        <div style="width:100%;height:160px;background:url('https://cdn.files.salla.network/homepage/1372176879/5dd1eba4-4485-4f8b-a7f9-3a72eaece90f.webp') center/cover no-repeat;"></div>
        <div style="padding:25px 15px;">
          <h2 style="font-size:20px;color:#000;margin-bottom:10px;font-weight:bold;">حبة عليك… والثانية علينا</h2>
          <p style="font-size:14px;color:#666;margin-bottom:20px;">اشترِ حبة واحصل على الثانية مجاناً</p>
          <a href="/جميع-المنتجات/c890261960" style="display:inline-block;padding:12px 35px;background:#000;color:#fff;border-radius:50px;text-decoration:none;font-weight:bold;width:80%;">اطلب الآن</a>
        </div>
      </div>
      <style>
        @keyframes fadeInEid { from { opacity: 0; transform: scale(0.9); } to { opacity: 1; transform: scale(1); } }
      </style>
    `;

    document.body.appendChild(popup);

    document.getElementById("close-eid-final").onclick = function() {
      popup.remove();
      sessionStorage.setItem('eid_popup_closed', 'true');
    };

    popup.onclick = function(e) {
      if (e.target === popup) {
        popup.remove();
        sessionStorage.setItem('eid_popup_closed', 'true');
      }
    };
  }

  // فحص مستمر كل ثانية لأن سلة تغير المحتوى ديناميكياً
  setInterval(initDynamicPopup, 1000);
})();