// الصور + اللينكات
const items = [
  {
    img: "https://cdn.files.salla.network/homepage/684370437/c268a389-adb8-4540-b060-1ec0e02cc06d.webp",
    link: "https://luneabeauties.com/%D8%BA%D8%B3%D9%88%D9%84/c1891928553"
  },
  {
    img: "https://cdn.files.salla.network/homepage/684370437/62431b63-a911-433a-abf2-564c8f57369b.webp",
    link: "https://luneabeauties.com/%D8%A7%D9%84%D9%85%D8%B1%D8%B7%D8%A8%D8%A7%D8%AA/c228970467"
  },
  {
    img: "https://cdn.files.salla.network/homepage/684370437/469f24db-4491-4f5d-8565-899fb26ec9d6.webp",
    link: "https://luneabeauties.com/%D9%88%D8%A7%D9%82%D9%8A/c1400936477"
  },
  {
    img: "https://cdn.files.salla.network/homepage/684370437/356525e4-9f63-4e8a-8b2e-3f12be0d1a43.webp",
    link: "https://luneabeauties.com/%D8%AC%D9%84/c1569362162"
  }
];

// إنشاء السكشن
const section = document.createElement("div");
section.className = "custom-grid";

// توليد الصور
items.forEach(itemData => {
  const item = document.createElement("div");
  item.className = "item";

  item.innerHTML = `
    <a href="${itemData.link}">
      <img src="${itemData.img}" alt="">
    </a>
  `;

  section.appendChild(item);
});

// نجيب البلوك المطلوب
const target = document.querySelector(".V__micr");

// نحطه بعده مباشرة
if (target) {
  target.insertAdjacentElement("afterend", section);
}
document.addEventListener("DOMContentLoaded", function() {
    // 1. نصوص الشريط
    const messages = [
        "شحن مجانى لاى طلب اكثر من 299 ريال",
        "شحن مجانى لاى طلب اكثر من 299 ريال",
        "شحن مجانى لاى طلب اكثر من 299 ريال",
        "شحن مجانى لاى طلب اكثر من 299 ريال",
        "شحن مجانى لاى طلب اكثر من 299 ريال"
    ];

    // 2. إنشاء الـ HTML وإضافته لأول الصفحة
    const tickerHtml = `
        <div id="ticker-wrapper-js">
            <div id="ticker-content-js">
                ${messages.map(msg => `<span class="ticker-item-js">${msg}</span>`).join('')}
            </div>
        </div>
    `;
    document.body.insertAdjacentHTML('afterbegin', tickerHtml);

    // 3. إضافة الـ CSS للـ Head
    const style = document.createElement('style');
    style.textContent = `
        #ticker-wrapper-js {
            background: #F5F4EB;
            color: #026165;
            overflow: hidden;
            white-space: nowrap;
            padding: 8px 0;
            direction: rtl;
            cursor: pointer;

            display: flex;
        }
        #ticker-content-js {
            display: flex;
            gap: 50px;
            will-change: transform;
        }
        .ticker-item-js {
            font-family: sans-serif;
            font-size: 12px;
            font-weight: bold;
            flex-shrink: 0;
        }
    `;
    document.head.appendChild(style);

    // 4. منطق الحركة والـ Hover
    const tickerContent = document.getElementById('ticker-content-js');
    const tickerWrapper = document.getElementById('ticker-wrapper-js');
    
    // تكرار المحتوى لضمان حركة لا نهائية
    tickerContent.innerHTML += tickerContent.innerHTML;

    let currentPos = 0;
    let speed = 1; // السرعة الأساسية
    let isPaused = false; // حالة الإيقاف

    function step() {
        if (!isPaused) {
            currentPos += speed;
            
            // إعادة الشريط للبداية عند انتهاء نصف المحتوى (لأنه مكرر)
            if (currentPos >= tickerContent.scrollWidth / 2) {
                currentPos = 0;
            }
            
            tickerContent.style.transform = `translateX(${currentPos}px)`;
        }
        requestAnimationFrame(step);
    }

    // تشغيل الحركة
    step();

    // 5. أحداث الـ Hover (الإيقاف والتشغيل)
    tickerWrapper.addEventListener('mouseenter', () => {
        isPaused = true;
    });

    tickerWrapper.addEventListener('mouseleave', () => {
        isPaused = false;
    });
});
/* ================== WHATSAPP FLOAT BUTTON ================== */
document.addEventListener('DOMContentLoaded', function () {
  const whatsappBtn = document.createElement('a');
  whatsappBtn.href = 'https://wa.me/966540062006';
  whatsappBtn.target = '_blank';
  whatsappBtn.className = 'whatsapp-fixed-btn';
  whatsappBtn.innerHTML = '<i class="sicon-whatsapp"></i>';

  document.body.appendChild(whatsappBtn);
});
document.addEventListener("DOMContentLoaded", function() {
    const brandContainer = document.querySelector('.product-brand');
    const brandLink = document.querySelector('.brand-logo');

    if (brandContainer && brandLink) {
        const brandName = brandLink.getAttribute('title');
        const brandUrl = brandLink.getAttribute('href');

        // 🔥 لف كل النصوص في ديف واحد
        const infoWrapper = document.createElement('div');
        infoWrapper.className = 'brand-info-wrapper flex flex-col gap-2 ';

        infoWrapper.innerHTML = `
            <h4 class="text-green-500">جميع المنتجات أصلية 100%</h4>
            <div class="flex items-center gap-1">
                <a href="${brandUrl}" class="more-link">اضغط هنا للمزيد من ماركة</a>
                <a href="${brandUrl}" class="brand-title-link">${brandName}</a>
            </div>
        `;

        // 🧠 نخلي الكونتينر Flex أفقي
        brandContainer.style.display = 'flex';
        brandContainer.style.alignItems = 'center';
        brandContainer.style.gap = '10px';

        // نضيف النصوص جنب اللوجو
        brandContainer.appendChild(infoWrapper);
    }
});