document.addEventListener("DOMContentLoaded", function () {
    // إنشاء شريط الأخبار المتحرك
    const danticker = document.createElement('div');
    danticker.classList.add('text-ticker', 'promation-tiker');
    danticker.innerHTML = `
        <div class="stock-ticker">
            <ul>
                ${Array(7).fill('<li class="minus"><span class="company">شكولاته من عالم آخر ... بطعم يفوق الخيال</span></li>').join('')}
            </ul>
        </div>
    `;
    document.querySelector('.index section:first-of-type')?.after(danticker);

    const faqContainer = document.createElement("div");
    faqContainer.innerHTML = `
        <div class="faq-header">إينما كنتم، تافي أقرب إليكم</div>
        <p class="faq-header-detailes">تحقق من مناطق التوصيل لدينا</p>
        <div class="faq-content">
            ${createFaqItem("منطقة الرياض", ["توصيل  من  ساعة إلى  ثلاث  ساعات  كحد أقصى", "الروضة", "السويدي", "الملقا", "المصيف", "لبن", "العليا", "النرجس", "اليرموك", "البديعة", "الخرج", "النسيم"])}
            ${createFaqItem("منطقة القصيم", ["بريدة"])}
            ${createFaqItem("المنطقة الشرقية", ["الدمام", "الهفوف"])}
            ${createFaqItem("المنطقة الغربية", ["جدة"])}
        </div>
    `;
    document.querySelector(".index .store-footer")?.before(faqContainer);
});

function createFaqItem(title, items) {
    return `
        <div class="faq-question">
            <input type="checkbox" class="panel" id="${title.replace(/\s+/g, '')}">
            <div class="plus">+</div>
            <label for="${title.replace(/\s+/g, '')}" class="panel-title">${title}</label>
            <div class="panel-content">
                ${items.map(item => `<p>${item}</p>`).join('')}
            </div>
        </div>
    `;
}

window.addEventListener("load", () => {
    document.querySelector(".copyright-text p")?.insertAdjacentHTML("afterend", `
        <div><span class="dev-link">:designed by <a href="https://wa.me/message/IZLDUASX6U3SC1">ddandesign</a></span></div>
    `);
});



window.onload=function(){    
let target2 = document.querySelector("header.store-header .main-nav-container .flex.items-center:first-child ");
let newEl2 = document.createElement("div");
newEl2.classList.add("new-logo")
target2.append(newEl2)
newEl2.innerHTML = `
<a class="navbar-brand" href="https://salla.sa/tafi">
<img fetchpriority="high" width="100%" height="100%" loading="eager" src="https://i.postimg.cc/GtwVbd8b/Artboard-10-2x.png" alt="TAFFY logo">
<h1 class="sr-only">TAFFY</h1>
</a>
        `;
        target2.after(newEl2);
};