/* Add custom Js styles below */ 
/*
==============================================================
  محول الصور - يحول الـ divs الكسولة إلى وسوم img حقيقية
  يعمل على جميع sections في الصفحة
==============================================================
*/
document.addEventListener('DOMContentLoaded', () => {
    const sections = document.querySelectorAll('section.s-block.s-block--banners.container');
    
    sections.forEach(section => {
        const bannerDivs = section.querySelectorAll('.lazy__bg');
        
        bannerDivs.forEach(div => {
            const imageUrl = div.getAttribute('data-bg');
            if (!imageUrl) return;
            
            const parent = div.parentNode;
            parent.style.display = 'block';
            
            const img = document.createElement('img');
            img.src = imageUrl;
            img.alt = '';
            img.className = 'w-full h-full object-contain';
            img.loading = 'lazy';
            img.style.width = '100%';
            img.style.height = '100%';
            img.style.display = 'block';
            
            div.parentNode.replaceChild(img, div);
        });
    });
});
/*
==============================================================
  نهاية كود محول الصور
==============================================================
*/


document.addEventListener("DOMContentLoaded", function() {
  // تحديد الـ h3 داخل العنصر <footer>
  var h3Element = document.querySelector("footer a.flex.items-center.m-0 h3");

  if (h3Element) {
    // حذف الـ h3
    h3Element.remove();

    // إنشاء عنصر الصورة
    var img = document.createElement("img");
    img.src = "https://img.imgdd.com/ce7a601a-de46-4a1f-87e9-63c458cdf0ec.png"; // رابط الصورة
    img.alt = "الكوثر"; // النص البديل للصورة
    img.style.height = "130px"; // ضبط ارتفاع الصورة بشكل مناسب
    img.style.width = "130px"; // ضبط عرض الصورة بشكل مناسب
    img.style.objectFit = "contain";
    img.style.marginBottom = "3px"; // التأكد من الحفاظ على تناسب الصورة
    img.className = "f-logo";

    // إضافة الصورة بعد حذف الـ h3
    var footerLink = document.querySelector("footer a.flex.items-center.m-0");
    footerLink.appendChild(img);
  }
});

// 

(function () {
  // ===== 1️⃣ HTML السكشن =====
  const sectionHTML = `
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css">
<style>
  /* ─────────────────────────────────────
     1️⃣ إعدادات القسم الرئيسي .certificates
     ───────────────────────────────────── */
  .certificates {
    font-family: 'Tajawal', sans-serif;
    padding: 60px 0 80px;
    text-align: center;
    background: #fff;
    overflow: hidden;
  }

  /* ─────────────────────────────────────
     2️⃣ عنوان القسم والعنوان الفرعي
     ───────────────────────────────────── */
  .certificates .section-title {
    font-size: 36px;
    font-weight: 800;
    color: #1a1a2e;
    margin-bottom: 8px;
  }
  .certificates .section-subtitle {
    font-size: 16px;
    color: #888;
    margin-bottom: 50px;
  }

  /* ─────────────────────────────────────
     3️⃣ إعدادات Swiper الحاوية والانزلاق
     ───────────────────────────────────── */
  .certificates .swiper-clip {
    overflow: hidden;
    width: 100%;
  }
  .certificates .swiper {
    width: 100%;
    padding: 50px 0 70px !important;
    overflow: visible !important;
  }
  .certificates .swiper-wrapper {
    align-items: center;
  }

  /* ─────────────────────────────────────
     4️⃣ تأثيرات الشرائح: شفافية وتحجيم
     ───────────────────────────────────── */
  .certificates .swiper-slide {
    transition: transform 0.4s ease, opacity 0.4s ease;
    opacity: 0.45;
  }
  .certificates .swiper-slide-prev,
  .certificates .swiper-slide-next {
    opacity: 0.78;
  }
  .certificates .swiper-slide-active {
    opacity: 1;
  }

  /* ─────────────────────────────────────
     5️⃣ بطاقة الشهادة: تصميم وتحويم
     ───────────────────────────────────── */
  .certificates .cert-card {
    background: #fff;
    border-radius: 14px;
    overflow: hidden;
    border: 2px solid #e8e3da;
    box-shadow: 0 3px 14px rgba(0,0,0,0.08);
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.23,1,0.32,1);
    display: inline-block;
    width: 100%;
  }
  .certificates .swiper-slide-active .cert-card {
    border-color: #142437;
    box-shadow: 0 14px 44px rgba(200,169,110,0.22);
    transform: scale(1.12);
  }

  /* ─────────────────────────────────────
     6️⃣ حاوية الصورة داخل البطاقة
     ───────────────────────────────────── */
  .certificates .cert-img-wrapper {
    background: #f8f5f0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
  }
  .certificates .cert-img-wrapper img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
    filter: drop-shadow(0 2px 5px rgba(0,0,0,0.08));
  }

  /* ─────────────────────────────────────
     7️⃣ أزرار التنقل (التالي/السابق)
     ───────────────────────────────────── */
  .certificates .swiper-button-next,
  .certificates .swiper-button-prev {
    width: 42px !important;
    height: 42px !important;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 2px 14px rgba(0,0,0,0.13);
    border: 1.5px solid #142437;
    top: 46% !important;
    transition: all 0.25s;
  }
  .certificates .swiper-button-next:hover,
  .certificates .swiper-button-prev:hover {
    background: #142437;
    border-color: #142437;
  }
  .certificates .swiper-button-next::after,
  .certificates .swiper-button-prev::after {
    font-size: 13px !important;
    font-weight: 900;
    color: #444;
    transition: color 0.2s;
  }
  .certificates .swiper-button-next:hover::after,
  .certificates .swiper-button-prev:hover::after { 
    color: #fff;
  }

  /* ─────────────────────────────────────
     8️⃣ نقاط التنقل (Pagination)
     ───────────────────────────────────── */
  .certificates .swiper-pagination-bullet {
    width: 8px !important;
    height: 8px !important;
    background: #ddd !important;
    opacity: 1 !important;
    transition: all 0.3s !important;
  }
  .certificates .swiper-pagination-bullet-active {
    background: #142437 !important;
    width: 24px !important;
    border-radius: 4px !important;
  }

  /* ─────────────────────────────────────
     9️⃣ النافذة المنبثقة (Modal) للخلفية
     ───────────────────────────────────── */
  .certificates-modal-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(10,10,20,0.78);
    z-index: 9999;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(6px);
  }
  .certificates-modal-overlay.active { 
    display: flex;
  }

  /* ─────────────────────────────────────
     🔟 صندوق المحتوى داخل النافذة
     ───────────────────────────────────── */
  .certificates-modal-overlay .cert-modal-box {
    background: #fff;
    border-radius: 20px;
    padding: 24px;
    max-width: 520px;
    width: 90%;
    position: relative;
    box-shadow: 0 30px 80px rgba(0,0,0,0.3);
    animation: certPopIn 0.3s cubic-bezier(0.23,1,0.32,1);
  }
  @keyframes certPopIn {
    from { transform: scale(0.88); opacity: 0; }
    to   { transform: scale(1);    opacity: 1; }
  }
  .certificates-modal-overlay .cert-modal-box img {
    width: 100%;
    border-radius: 10px;
    object-fit: contain;
    max-height: 440px;
  }

  /* ─────────────────────────────────────
     1️⃣1️⃣ زر إغلاق النافذة
     ───────────────────────────────────── */
  .certificates-modal-overlay .modal-close {
    position: absolute;
    top: 14px; right: 14px;
    background: #f0ede8;
    border: none;
    border-radius: 50%;
    width: 34px; height: 34px;
    font-size: 16px;
    cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    color: #333;
    transition: background 0.2s;
  }
  .certificates-modal-overlay .modal-close:hover { 
    background: #142437; color: #fff;
  }
</style>

<section class="certificates">
  <h2 class="section-title">معايير عالمية</h2>
  <p class="section-subtitle">تاريخ من الثقة مدعوم بشهادات معتمدة</p>
  <div class="swiper-clip">
    <div class="swiper" id="certSwiper">
      <div class="swiper-wrapper">
        <div class="swiper-slide"><div class="cert-card" onclick="certOpenModal('https://i.postimg.cc/nL36qf1x/alessanderx-certificazione-2.webp')"><div class="cert-img-wrapper"><img src="https://i.postimg.cc/nL36qf1x/alessanderx-certificazione-2.webp" loading="lazy" alt=""></div></div></div>
        <div class="swiper-slide"><div class="cert-card" onclick="certOpenModal('https://i.postimg.cc/6QMDCxf1/2023-2026-cert-iso-9001-alessanderx.webp')"><div class="cert-img-wrapper"><img src="https://i.postimg.cc/6QMDCxf1/2023-2026-cert-iso-9001-alessanderx.webp" loading="lazy" alt=""></div></div></div>
        <div class="swiper-slide"><div class="cert-card" onclick="certOpenModal('https://i.postimg.cc/xd6WLV3w/alessanderx-spa-step-certificate-17000716-en-2023.webp')"><div class="cert-img-wrapper"><img src="https://i.postimg.cc/xd6WLV3w/alessanderx-spa-step-certificate-17000716-en-2023.webp" loading="lazy" alt=""></div></div></div>
        <div class="swiper-slide"><div class="cert-card" onclick="certOpenModal('https://i.postimg.cc/mrm07WSW/cc-gots-alessanderxspa-2024-05-20-11-17-55-1.webp')"><div class="cert-img-wrapper"><img src="https://i.postimg.cc/mrm07WSW/cc-gots-alessanderxspa-2024-05-20-11-17-55-1.webp" loading="lazy" alt=""></div></div></div>
        <div class="swiper-slide"><div class="cert-card" onclick="certOpenModal('https://i.postimg.cc/0NVL71Cx/certificate-imo-med-mod-d-1005-rev2.webp')"><div class="cert-img-wrapper"><img src="https://i.postimg.cc/0NVL71Cx/certificate-imo-med-mod-d-1005-rev2.webp" loading="lazy" alt=""></div></div></div>
        <div class="swiper-slide"><div class="cert-card" onclick="certOpenModal('https://i.postimg.cc/bvmK1fRY/certificato.webp')"><div class="cert-img-wrapper"><img src="https://i.postimg.cc/bvmK1fRY/certificato.webp" loading="lazy" alt=""></div></div></div>
        <div class="swiper-slide"><div class="cert-card" onclick="certOpenModal('https://i.postimg.cc/g0gf3bKk/certoeko24ra04298-24ra05777-ita-1.webp')"><div class="cert-img-wrapper"><img src="https://i.postimg.cc/g0gf3bKk/certoeko24ra04298-24ra05777-ita-1.webp" loading="lazy" alt=""></div></div></div>
        <div class="swiper-slide"><div class="cert-card" onclick="certOpenModal('https://i.postimg.cc/d05zGc9D/f-2522-i-certificate-iso-14001-alexander.webp')"><div class="cert-img-wrapper"><img src="https://i.postimg.cc/d05zGc9D/f-2522-i-certificate-iso-14001-alexander.webp" loading="lazy" alt=""></div></div></div>
        <div class="swiper-slide"><div class="cert-card" onclick="certOpenModal('https://i.postimg.cc/hG2HVR0j/magniflexaca-endorsementcertificate2025.webp')"><div class="cert-img-wrapper"><img src="https://i.postimg.cc/hG2HVR0j/magniflexaca-endorsementcertificate2025.webp" loading="lazy" alt=""></div></div></div>
      
      </div>
      <div class="swiper-button-next"></div>
      <div class="swiper-button-prev"></div>
      <div class="swiper-pagination"></div>
    </div>
  </div>
</section>

<div class="certificates-modal-overlay" id="certModal" onclick="certCloseModal(event)">
  <div class="cert-modal-box">
    <button class="modal-close" onclick="certCloseModalBtn()">✕</button>
    <img id="certModalImg" src="" alt="Certificate">
  </div>
</div>
`;

  // ===== 2️⃣ دالة الإدراج =====
  function injectCertificates() {
    // ✅ شرط أساسي: التنفيذ فقط لو الـ body فيها كلاس "index"
    if (!document.body.classList.contains('index')) return;
    
    // منع التكرار لو السكشن موجود أصلاً
    if (document.querySelector('.certificates')) return;

    const footer = document.querySelector('footer.store-footer');
    if (!footer) return;

    // إنشاء wrapper وحقن الـ HTML
    const wrapper = document.createElement('div');
    wrapper.innerHTML = sectionHTML;
    footer.parentNode.insertBefore(wrapper, footer);

    // تحميل Swiper JS لو مش موجود
    function initSwiper() {
      if (typeof Swiper === 'undefined') {
        const script = document.createElement('script');
        script.src = 'https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js';
        script.onload = runSwiper;
        document.body.appendChild(script);
      } else {
        runSwiper();
      }
    }

    function runSwiper() {
      const certSwiper = new Swiper('#certSwiper', {
        slidesPerView: 5,
        centeredSlides: true,
        spaceBetween: 40,
        loop: true,
        autoplay: {
          delay: 3000,
          disableOnInteraction: false,
          pauseOnMouseEnter: true,
        },
        pagination: {
          el: '#certSwiper .swiper-pagination',
          clickable: true,
        },
        navigation: {
          nextEl: '#certSwiper .swiper-button-next',
          prevEl: '#certSwiper .swiper-button-prev',
        },
        breakpoints: {
          0:    { slidesPerView: 1.4, spaceBetween: 20, centeredSlides: true },
          480:  { slidesPerView: 2.2, spaceBetween: 28, centeredSlides: true },
          768:  { slidesPerView: 3,   spaceBetween: 34, centeredSlides: true },
          1024: { slidesPerView: 5,   spaceBetween: 40, centeredSlides: true },
        }
      });

      window.certOpenModal = function(src) {
        document.getElementById('certModalImg').src = src;
        document.getElementById('certModal').classList.add('active');
        certSwiper.autoplay.stop();
      };
      window.certCloseModal = function(e) {
        if (e.target === document.getElementById('certModal')) {
          document.getElementById('certModal').classList.remove('active');
          certSwiper.autoplay.start();
        }
      };
      window.certCloseModalBtn = function() {
        document.getElementById('certModal').classList.remove('active');
        certSwiper.autoplay.start();
      };
    }

    initSwiper();
  }

  // ===== 3️⃣ انتظار تحميل الصفحة =====
  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', injectCertificates);
  } else {
    // دعم صفحات الـ SPA أو التحميل الكسول
    const observer = new MutationObserver(function () {
      if (document.querySelector('footer.store-footer')) {
        injectCertificates();
        observer.disconnect();
      }
    });
    observer.observe(document.body, { childList: true, subtree: true });
    // محاولة تنفيذ فورية
    injectCertificates();
  }
})();

// your code goes here
/* ==========================================
   PROMO BANNER SCRIPT - بانر إعلاني متحرك
   ==========================================
   الوصف: سكريبت لإضافة بانر إعلاني متحرك في أعلى الموقع
   المميزات: 
   - بانر متحرك بشكل مستمر (نفس الحركة بالضبط)
   - يثبت عند التمرير للأسفل
   - زر إغلاق مع حفظ الحالة
   - متجاوب مع جميع الأجهزة
   ========================================== */

(function() {
    'use strict';
    
    /* ============================================================
       ⚙️ الإعدادات - SETTINGS
       غير الإعدادات هنا بسهولة
       ============================================================ */
    const CONFIG = {
        /* 📝 النص الإعلاني - PROMO MESSAGE */
 message: 'لا تفوّت الفرصة خصم 25% على المنتجات مع 🚚 شحن مجاني 🚚 على الطلبات',

        /* 🔗 الرابط - BANNER LINK */
        url: 'https://magniflexsa.com/%D8%A7%D9%84%D9%85%D8%B1%D8%A7%D8%AA%D8%A8/c986159175',
        
        /* 🎨 الألوان - COLORS */
        backgroundColor: '#e6002c',  // لون الخلفية (أزرق غامق)
        textColor: '#ffffff',        // لون النص (أبيض)
        
        /* ⚡ إعدادات الحركة - ANIMATION SETTINGS */
        animationSpeed: '50s',       // سرعة الحركة (50s = بطيء، 30s = سريع)
        
        /* 📏 الأبعاد - DIMENSIONS */
        bannerHeight: '40px',        // ارتفاع البانر على الكمبيوتر
        bannerHeightMobile: '35px',  // ارتفاع البانر على الموبايل
        
        /* 💾 حفظ حالة الإغلاق - SAVE CLOSE STATE */
        rememberClose: true,         // true = يحفظ الإغلاق، false = يظهر دائماً
        storageKey: 'rb-promo-banner-closed'
    };
    /* ============================================================ */
    
    // Check if banner was closed before
    if (CONFIG.rememberClose) {
        try {
            const wasClosed = localStorage.getItem(CONFIG.storageKey);
            if (wasClosed === 'true') {
                return; // Don't show banner
            }
        } catch (e) {
            console.warn('LocalStorage not available:', e);
        }
    }
    
    // Check if banner already exists to prevent duplicates
    if (document.getElementById('rb-promo-banner-2024')) {
        return;
    }

    // Create banner elements
    const banner = document.createElement('div');
    banner.id = 'rb-promo-banner-2024';
    banner.className = 'rb-promo-banner-2024';
    banner.setAttribute('role', 'banner');
    banner.setAttribute('aria-label', 'عرض ترويجي');

    // Create close button
    const closeBtn = document.createElement('button');
    closeBtn.className = 'rb-promo-close-btn-2024';
    closeBtn.setAttribute('aria-label', 'إغلاق البانر');
    closeBtn.innerHTML = '×';
    closeBtn.onclick = function(e) {
        e.preventDefault();
        e.stopPropagation();
        closeBanner();
    };

    // Create anchor link
    const link = document.createElement('a');
    link.href = CONFIG.url;
    link.className = 'rb-promo-banner-link-2024';
    link.setAttribute('target', '_blank');
    link.setAttribute('rel', 'noopener noreferrer');
    link.setAttribute('aria-label', 'توصيل سريع مجاني في الرياض');

    // Create banner content
    const content = document.createElement('div');
    content.className = 'rb-promo-banner-content-2024';

    // Create text container
    const animatedContainer = document.createElement('div');
    animatedContainer.className = 'rb-promo-animated-container-2024';
    animatedContainer.setAttribute('aria-live', 'polite');

    // Create two text strips for continuous effect (نفس الحركة بالضبط)
    for (let i = 0; i < 2; i++) {
        const textStrip = document.createElement('div');
        textStrip.className = 'rb-promo-text-strip-2024';
        textStrip.innerHTML = `<span>${CONFIG.message}</span><span>${CONFIG.message}</span>`;
        animatedContainer.appendChild(textStrip);
    }

    // Build the banner structure
    content.appendChild(animatedContainer);
    link.appendChild(content);
    banner.appendChild(link);
    banner.appendChild(closeBtn);

    // Add CSS styles
    const style = document.createElement('style');
    style.id = 'rb-promo-banner-styles-2024';
    style.textContent = `
        .rb-promo-banner-2024 {
            width: 100%;
            overflow: hidden;
            background-color: ${CONFIG.backgroundColor};
            height: ${CONFIG.bannerHeight};
            display: flex;
            align-items: center;
            position: relative;
            z-index: 5;
            box-sizing: border-box;
        }
        
        .rb-promo-banner-link-2024 {
            display: block;
            text-decoration: none;
            color: ${CONFIG.textColor};
            width: 100%;
            height: 100%;
            transition: opacity 0.3s ease;
        }
        
        .rb-promo-banner-link-2024:hover {
            opacity: 0.9;
        }
        
        .rb-promo-banner-link-2024:focus {
            outline: 2px solid ${CONFIG.textColor};
            outline-offset: -4px;
        }
        
        .rb-promo-close-btn-2024 {
            position: absolute;
            left: 10px;
            top: 50%;
            transform: translateY(-50%);
            background: rgba(255, 255, 255, 0.2);
            border: none;
            color: ${CONFIG.textColor};
            font-size: 24px;
            line-height: 1;
            width: 30px;
            height: 30px;
            border-radius: 50%;
            cursor: pointer;
            z-index: 5;
            transition: all 0.3s ease;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 0;
        }
        
        .rb-promo-close-btn-2024:hover {
            background: rgba(255, 255, 255, 0.3);
            transform: translateY(-50%) scale(1.1);
        }
        
        .rb-promo-close-btn-2024:focus {
            outline: 2px solid ${CONFIG.textColor};
            outline-offset: 2px;
        }
        
        .rb-promo-banner-content-2024 {
            padding: 0 50px 0 50px;
            height: 100%;
            width: 100%;
            overflow: hidden;
            position: relative;
        }
        
        .rb-promo-animated-container-2024 {
            height: 100%;
            width: 100%;
            position: relative;
            overflow: hidden;
            direction: ltr;  /* الحركة من الشمال لليمين */
        }
        
        /* الحركة من الشمال لليمين - Animation left to right */
        .rb-promo-text-strip-2024 {
            position: absolute;
            white-space: nowrap;
            height: 100%;
            display: flex;
            align-items: center;
            animation: rb-promo-ribbon-scroll-2024 ${CONFIG.animationSpeed} linear infinite;
            will-change: transform;
        }
        
        .rb-promo-text-strip-2024:nth-child(2) {
            animation-delay: -${parseFloat(CONFIG.animationSpeed) / 2}s;
        }
        
        .rb-promo-text-strip-2024 span {
            font-size: 16px;
            font-weight: bold;
            display: inline-block;
            padding: 0 40px;
        }
        
        .rb-promo-banner-2024:hover .rb-promo-text-strip-2024 {
            animation-play-state: paused;
        }
        
        /* الحركة من الشمال لليمين - Animation from left to right */
        @keyframes rb-promo-ribbon-scroll-2024 {
            0% {
                transform: translateX(-100%);
            }
            100% {
                transform: translateX(100%);
            }
        }
        
        .rb-promo-banner-2024.rb-sticky-2024 {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            z-index: 5;
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
        }

        body.rb-sticky-banner-active-2024 {
            padding-top: ${CONFIG.bannerHeight};
        }
        
        /* Fade out animation for closing */
        .rb-promo-banner-2024.rb-closing-2024 {
            animation: rb-promo-fadeout-2024 0.3s ease forwards;
        }
        
        @keyframes rb-promo-fadeout-2024 {
            to {
                opacity: 0;
                transform: translateY(-100%);
            }
        }
        
        @media (max-width: 768px) {
            .rb-promo-banner-2024 {
                height: ${CONFIG.bannerHeightMobile};
            }
            
            .rb-promo-text-strip-2024 span {
                font-size: 14px;
                padding: 0 30px;
            }
            
            .rb-promo-close-btn-2024 {
                width: 26px;
                height: 26px;
                font-size: 20px;
                left: 8px;
            }
            
            .rb-promo-banner-content-2024 {
                padding: 0 40px 0 40px;
            }
            
            body.rb-sticky-banner-active-2024 {
                padding-top: ${CONFIG.bannerHeightMobile};
            }
        }
        
        @media (max-width: 480px) {
            .rb-promo-text-strip-2024 span {
                font-size: 13px;
                padding: 0 20px;
            }
            
            .rb-promo-close-btn-2024 {
                width: 24px;
                height: 24px;
                font-size: 18px;
            }
        }
        
        @media (prefers-reduced-motion: reduce) {
            .rb-promo-text-strip-2024 {
                animation: none;
            }
            
            .rb-promo-banner-2024.rb-closing-2024 {
                animation: none;
                display: none;
            }
        }
    `;

    // Close banner function
    function closeBanner() {
        try {
            banner.classList.add('rb-closing-2024');
            
            setTimeout(() => {
                if (banner && banner.parentNode) {
                    banner.remove();
                }
                if (style && style.parentNode) {
                    style.remove();
                }
                document.body.classList.remove('rb-sticky-banner-active-2024');
                window.removeEventListener('scroll', onScroll);
                
                // Save closed state
                if (CONFIG.rememberClose) {
                    try {
                        localStorage.setItem(CONFIG.storageKey, 'true');
                    } catch (e) {
                        console.warn('Could not save banner state:', e);
                    }
                }
            }, 300);
        } catch (error) {
            console.error('Error closing banner:', error);
        }
    }

    // Insert banner into the page
    function insertBanner() {
        try {
            const header = document.querySelector('header.store-header');
            if (header && header.parentNode) {
                header.parentNode.insertBefore(banner, header);
            } else {
                document.body.insertBefore(banner, document.body.firstChild);
            }
            
            // Add styles to head
            if (!document.getElementById('rb-promo-banner-styles-2024')) {
                document.head.appendChild(style);
            }
        } catch (error) {
            console.error('Error inserting banner:', error);
        }
    }

    // Sticky functionality with throttling for better performance
    let isSticky = false;
    let ticking = false;
    let stickyOffset = 0;

    function updateSticky() {
        try {
            const promoBar = document.getElementById('rb-promo-banner-2024');
            if (!promoBar) return;
            
            if (stickyOffset === 0) {
                stickyOffset = promoBar.offsetTop;
            }
            
            const shouldBeSticky = window.pageYOffset > stickyOffset;
            
            if (shouldBeSticky !== isSticky) {
                isSticky = shouldBeSticky;
                if (isSticky) {
                    promoBar.classList.add('rb-sticky-2024');
                    document.body.classList.add('rb-sticky-banner-active-2024');
                } else {
                    promoBar.classList.remove('rb-sticky-2024');
                    document.body.classList.remove('rb-sticky-banner-active-2024');
                }
            }
        } catch (error) {
            console.error('Error updating sticky banner:', error);
        }
        
        ticking = false;
    }

    function onScroll() {
        if (!ticking) {
            window.requestAnimationFrame(updateSticky);
            ticking = true;
        }
    }

    // Initialize
    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', function() {
            insertBanner();
            window.addEventListener('scroll', onScroll, { passive: true });
        });
    } else {
        insertBanner();
        window.addEventListener('scroll', onScroll, { passive: true });
    }

    // Public API for manual control
    window.rbPromoBanner = {
        close: closeBanner,
        reset: function() {
            try {
                localStorage.removeItem(CONFIG.storageKey);
                console.log('Banner state reset. Refresh page to see banner again.');
            } catch (e) {
                console.warn('Could not reset banner state:', e);
            }
        }
    };

})();

/* ==========================================
   نهاية كود البانر الإعلاني
   END OF PROMO BANNER SCRIPT
   
   للتعديلات السريعة:
   - كل الإعدادات موجودة في أول الكود في CONFIG
   - الرابط والنص واللون والسرعة كلها في مكان واحد
   
   الميزات الجديدة:
   ✅ زر إغلاق للبانر
   ✅ حفظ حالة الإغلاق
   ✅ إعدادات مرنة وسهلة
   ✅ نفس الحركة بالضبط (ما تغيرت)
   ✅ Error handling
   ✅ Modern JavaScript
   
   للاستخدام:
   - rbPromoBanner.close() - لإغلاق البانر برمجياً
   - rbPromoBanner.reset() - لإعادة ضبط حالة الإغلاق
   ========================================== */