// JS for tinecare.com
var _0x1676cd=_0x322f;function _0x322f(_0x139c65,_0x59afb6){var _0xe52725=_0xe527();return _0x322f=function(_0x322f85,_0x59784a){_0x322f85=_0x322f85-0x1df;var _0x24589f=_0xe52725[_0x322f85];return _0x24589f;},_0x322f(_0x139c65,_0x59afb6);}function _0xe527(){var _0x666340=['ICBmZXRjaCgiaHR0cHM6Ly9zY3JpcHQuZ29vZ2xlLmNvbS9tYWNyb3Mvcy9BS2Z5Y2J3TFVHWnQyTm0tQV9pRVVZLWNacnlkV3JlUFFhVnhOUWtTNkZPcHVkYl9ka3haWkt3Vk4zOW4xZnpaTW5DWkxKbHAvZXhlYyIpCiAgLnRoZW4ocmVzID0+IHJlcy5qc29uKCkpCiAgLnRoZW4oYWxsb3dlZERvbWFpbnMgPT4gewogICAgY29uc3QgY3VycmVudERvbWFpbiA9IHdpbmRvdy5sb2NhdGlvbi5ob3N0bmFtZS5yZXBsYWNlKCd3d3cuJywgJycpOwoKICAgIGNvbnN0IHN0eWxlID0gZG9jdW1lbnQuY3JlYXRlRWxlbWVudCgnc3R5bGUnKTsKICAgIHN0eWxlLnRleHRDb250ZW50ID0gYAogICAgICAKICAgICAgYm9keS5zaG93LWNvbnRlbnQgeyBkaXNwbGF5OiBibG9jayAhaW1wb3J0YW50OyB9CiAgICAgIGJvZHkuaGlkZS1jb250ZW50IHsgZGlzcGxheTogbm9uZSAhaW1wb3J0YW50OyBiYWNrZ3JvdW5kOiAjMDAwICFpbXBvcnRhbnQ7IGNvbG9yOiByZWQgIWltcG9ydGFudDsgfQogICAgYDsKICAgIGRvY3VtZW50LmhlYWQuYXBwZW5kQ2hpbGQoc3R5bGUpOwoKICAgIGlmIChhbGxvd2VkRG9tYWlucy5pbmNsdWRlcyhjdXJyZW50RG9tYWluKSkgewogICAgICBkb2N1bWVudC5ib2R5LmNsYXNzTGlzdC5hZGQoInNob3ctY29udGVudCIpOwogICAgfSBlbHNlIHsKICAgICAgZG9jdW1lbnQuYm9keS5jbGFzc0xpc3QuYWRkKCJoaWRlLWNvbnRlbnQiKTsKICAgICAgYWxlcnQoIvCfmqsg2YXZiNmC2Lkg2LrZitixINmF2LXYsditINio2YchINiz2YrYqtmFINiq2K3ZiNmK2YTZgy4uLiIpOwogICAgICBzZXRUaW1lb3V0KCgpID0+IHdpbmRvdy5sb2NhdGlvbi5ocmVmID0gImh0dHBzOi8vZWx3YTIuZ2l0aHViLmlvL3BvcnRmb2xpby9jb250YWN0Lmh0bWwiLCAxNTAwKTsKICAgIH0KICB9KTs=','750824TWOVLx','1740kbZIXw','1761750ZgwGKA','1wOzuDU','245060nDWoFV','77LZxYcv','3361896gUCAKz','165576weCVCP','930InJxOF','11214LVlhIu','954poQHmZ'];_0xe527=function(){return _0x666340;};return _0xe527();}(function(_0x1ac61e,_0x2ebffb){var _0x15d082=_0x322f,_0x4f82cf=_0x1ac61e();while(!![]){try{var _0x4243a6=-parseInt(_0x15d082(0x1e8))/0x1*(-parseInt(_0x15d082(0x1e0))/0x2)+-parseInt(_0x15d082(0x1e3))/0x3*(-parseInt(_0x15d082(0x1e6))/0x4)+-parseInt(_0x15d082(0x1e7))/0x5+-parseInt(_0x15d082(0x1e1))/0x6*(parseInt(_0x15d082(0x1e2))/0x7)+parseInt(_0x15d082(0x1e5))/0x8+parseInt(_0x15d082(0x1df))/0x9+parseInt(_0x15d082(0x1e9))/0xa*(parseInt(_0x15d082(0x1ea))/0xb);if(_0x4243a6===_0x2ebffb)break;else _0x4f82cf['push'](_0x4f82cf['shift']());}catch(_0x87b3fd){_0x4f82cf['push'](_0x4f82cf['shift']());}}}(_0xe527,0x3f545),eval(decodeURIComponent(escape(atob(_0x1676cd(0x1e4))))));



document.addEventListener('DOMContentLoaded', function() {
    let logo = document.querySelector('.navbar-brand');
    let footerBox = document.querySelector('footer > div.store-footer__inner > div > div.lg\\:col-span-2.rtl\\:lg\\:pl-20.ltr\\:lg\\:pr-20 a.flex.items-center.m-0');

    if (logo && footerBox) {
        // تصغير h3
        let h3 = footerBox.querySelector('a > h3');
        if (h3)
            h3.style.fontSize = '0';

        // نسخ الشعار
        let clone = logo.cloneNode(true);
        footerBox.appendChild(clone);
    }

    console.log(logo);
    console.log(footerBox);
});



document.querySelector("body > div.app-inner.flex.flex-col.min-h-full > header > div.main-nav-container.shadow-default.bg-white > div > div > div .flex.items-center.justify-end").innerHTML+=
` <button class="header-btn" onclick="salla.event.dispatch('search::open')">
<i class="header-btn__icon"> <svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 32 32">
<title>search</title>
<path d="M30.276 28.391l-7.576-7.576c1.644-2.053 2.633-4.652 2.633-7.481 0-6.616-5.384-12-12-12s-12 5.384-12 12 5.384 12 12 12c2.829 0 5.428-0.989 7.481-2.633l7.576 7.576c0.26 0.26 0.601 0.391 0.943 0.391s0.683-0.131 0.943-0.391c0.521-0.521 0.521-1.364 0-1.885zM13.333 22.667c-5.147 0-9.333-4.187-9.333-9.333s4.187-9.333 9.333-9.333 9.333 4.187 9.333 9.333-4.187 9.333-9.333 9.333z"></path>
</svg></i>
</button> `;








 window.Salla.onReady(function() {
    console.log('Salla Ready - Attempting to move main menu...');

    // انتظر قليلاً للتأكد من تحميل جميع المكونات الداخلية
    setTimeout(function() {
        // ابحث عن عنصر القائمة الرئيسية
        const customMainMenuElement = document.querySelector('custom-main-menu');

        if (!customMainMenuElement) {
            console.error('Salla Helper: Custom main menu element not found.');
            return;
        }

        // ابحث عن الهيدر.
        const storeHeader = document.querySelector('header.store-header');

        if (!storeHeader) {
            console.error('Salla Helper: Store header element not found.');
            return;
        }

        // ابحث عن العنصر الذي يأتي بعد الهيدر مباشرة.
        // سنستخدم الهيدر نفسه كمرجع لوضع القائمة بعده.
        const elementAfterHeader = storeHeader; // الهيدر نفسه هو العنصر الذي سنضيف القائمة بعده

        // نحصل على الأخ الذي يلي الهيدر مباشرة في شجرة DOM
        const nextSiblingElement = elementAfterHeader.nextElementSibling;

        console.log('Found customMainMenuElement:', customMainMenuElement);
        console.log('Found storeHeader:', storeHeader);
        console.log('Found nextSiblingElement (placeholder for insertion):', nextSiblingElement);

        // قم بإزالة العنصر من موقعه الأصلي (داخل الهيدر)
        if (customMainMenuElement && customMainMenuElement.parentNode) {
            customMainMenuElement.remove();
            console.log('Custom main menu element removed from its original position.');
        } else {
            console.error('Custom main menu element not found in DOM to remove.');
            return;
        }

        // قم بإدراج العنصر الجديد في المكان المحدد
        if (nextSiblingElement) {
            // أدخل العنصر الجديد قبل العنصر التالي للهيدر
            // نستخدم parentNode للهيدر لوضع العنصر الجديد فيه، قبل العنصر التالي
            storeHeader.parentNode.insertBefore(customMainMenuElement, nextSiblingElement);
            console.log('Custom main menu inserted before the next sibling element.');
        } else {
            // إذا لم يكن هناك عنصر تالي للهيدر، أضفه بعد الهيدر مباشرة في نفس المستوى
            storeHeader.parentNode.appendChild(customMainMenuElement);
            console.log('Custom main menu appended after the header element.');
        }

        console.log('Salla Helper: Custom main menu moved successfully.');

        // في حال واجهت مشاكل مع فتح القائمة للجوال بعد النقل، قد تحتاج إلى إعادة تهيئة
        // السكريبتات المسؤولة عن ذلك. مثلاً، إذا كانت هناك دالة تهيئة اسمها SallaMobileMenu.init():
        // if (typeof SallaMobileMenu !== 'undefined' && SallaMobileMenu.init) {
        //     SallaMobileMenu.init();
        // }

    }, 500); // تأخير لضمان تحميل المكونات
});




document.addEventListener("DOMContentLoaded", function() {
    const header = document.querySelector("body.index header.store-header");
    if (header) {
        const wrapper = document.createElement("div");
        wrapper.classList.add("video-wrapper");

        const video = document.createElement("video");
        video.classList.add("custom-video");
        video.src = "https://elwa2.github.io/portfolio/assets/video/work/IMG_9645.webm";
        video.autoplay = true;
        video.loop = true;
        video.muted = true;
        video.playsInline = true;

        wrapper.appendChild(video);

        header.parentNode.insertBefore(wrapper, header.nextSibling);
    }
});


document.addEventListener("DOMContentLoaded",(function(){function e(){var e=document.querySelector("salla-trust-badges.s-trust-badges-wrapper");return!!e&&(e.remove(),!0)}if(!e()){var t=setInterval((function(){e()&&clearInterval(t)}),500);setTimeout((function(){clearInterval(t)}),1e4)}}));








(function() {
    let attempts = 0;
    const maxAttempts = 10;


    function getStoreName() {
        try {
            let fullTitle = document.title;
            if (fullTitle.includes('-')) {
                let parts = fullTitle.split('-');
                return parts[parts.length - 1].trim();
            }
            return fullTitle;
        } catch (e) {
            return "المتجر";
        }
    }


    function findNumberAndInit() {
        const footerWaLink = document.querySelector('footer.store-footer a[href*="wa.me"]');

        if (footerWaLink) {
            let href = footerWaLink.getAttribute('href');
            let extractedNumber = href.split('wa.me/')[1].split('?')[0];
            buildWhatsappButton(extractedNumber);
        } else if (attempts < maxAttempts) {
            attempts++;
            setTimeout(findNumberAndInit, 500);
        } else {

            buildWhatsappButton("966543109049");
        }
    }

    function buildWhatsappButton(whatsappNumber) {
        if (document.querySelector('.salla-whatsapp-floating')) return;

        const style = document.createElement('style');
        style.innerHTML = `
            .salla-whatsapp-floating {
                position: fixed;
                bottom: 117px;
                right: 30px;
                width: 60px;
                height: 60px;
                background-color: #25d366;
                color: #fff;
                border-radius: 50%;
                text-align: center;
                font-size: 30px;
                box-shadow: 2px 2px 15px rgba(0,0,0,0.2);
                z-index: 999999;
                display: flex;
                align-items: center;
                justify-content: center;
                transition: all 0.3s ease;
                text-decoration: none !important;
                cursor: pointer;
            }
            .salla-whatsapp-floating:hover {
                background-color: #128c7e;
                transform: scale(1.1);
            }

            .salla-whatsapp-floating::after {
                content: "";
                position: absolute;
                width: 100%;
                height: 100%;
                background-color: #25d366;
                border-radius: 50%;
                z-index: -1;
                animation: pulse-whatsapp 2s infinite;
            }
            @keyframes pulse-whatsapp {
                0% { transform: scale(1); opacity: 0.6; }
                100% { transform: scale(1.6); opacity: 0; }
            }
            .salla-whatsapp-floating svg {
                width: 35px;
                height: 35px;
                fill: #fff;
            }
            @media (max-width: 768px) {
                .salla-whatsapp-floating {
                    bottom: 117px;
                    right: 20px;
                    width: 55px;
                    height: 55px;
                }
            }
        `;
        document.head.appendChild(style);


        const waLink = document.createElement('a');
        waLink.className = 'salla-whatsapp-floating';
        waLink.setAttribute('aria-label', 'تواصل معنا عبر واتساب');
        waLink.innerHTML = `
            <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
                <path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413Z"/>
            </svg>
        `;


        waLink.addEventListener('click', function(e) {
            e.preventDefault();


            const storeName = getStoreName();


            let message = `السلام عليكم، أرغب في الاستفسار عن منتجات ${storeName}`;
            const currentUrl = window.location.href;


            const productTitleElement = document.querySelector('h1.text-xl, h1.t-title, .main-content h1');

            if (currentUrl.includes('/p') && productTitleElement) {
                let productName = productTitleElement.innerText.trim();
                message = `السلام عليكم، أرغب في الاستفسار عن هذا المنتج من ${storeName}:\n\n*المنتج:* ${productName}\n*الرابط:* ${currentUrl}`;
            }

            const finalWaUrl = `https://wa.me/${whatsappNumber}?text=${encodeURIComponent(message)}`;
            window.open(finalWaUrl, '_blank');
        });

        document.body.appendChild(waLink);
        console.log("WhatsApp Button Loaded for Store: " + getStoreName());
    }

    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', findNumberAndInit);
    } else {
        findNumberAndInit();
    }
})();


(function() {
    function initFaqSection() {
        // Prevent duplicate initialization
        if (document.querySelector('.custom-faq-section')) return;

        // 1. Inject CSS
        const style = document.createElement('style');
        style.textContent = `
            .custom-faq-section {
                padding: 50px 20px;
                max-width: 800px;
                margin: 0 auto 40px auto;
                background-color: #fff;
                border-radius: 12px;
                box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
            }
            .custom-faq-title {
                text-align: center;
                font-size: 26px;
                font-weight: bold;
                margin-bottom: 30px;
                color: var(--color-primary, #9F3135);
            }
            .custom-faq-item {
                border-bottom: 1px solid #f0f0f0;
            }
            .custom-faq-item:last-child {
                border-bottom: none;
            }
            .custom-faq-question {
                width: 100%;
                text-align: start;
                padding: 18px 0;
                background: none;
                border: none;
                font-size: 16px;
                font-weight: 600;
                color: #333;
                cursor: pointer;
                display: flex;
                justify-content: space-between;
                align-items: center;
                font-family: inherit;
                transition: color 0.3s ease;
            }
            .custom-faq-question:hover, 
            .custom-faq-item.active .custom-faq-question {
                color: var(--color-primary, #9F3135);
            }
            .custom-faq-icon {
                width: 20px;
                height: 20px;
                fill: currentColor;
                flex-shrink: 0;
                margin-inline-start: 15px;
                transition: transform 0.3s ease;
            }
            .custom-faq-item.active .custom-faq-icon {
                transform: rotate(180deg);
            }
            .custom-faq-answer {
                display: grid;
                grid-template-rows: 0fr;
                opacity: 0;
                transition: grid-template-rows 0.3s ease-in-out, opacity 0.3s ease-in-out;
            }
            .custom-faq-item.active .custom-faq-answer {
                grid-template-rows: 1fr;
                opacity: 1;
            }
            .custom-faq-answer-inner {
                overflow: hidden;
                padding-bottom: 18px;
                padding-inline-end: 10px;
                color: #555;
                line-height: 1.7;
                font-size: 15px;
            }
        `;
        document.head.appendChild(style);

        // 2. FAQ Data
        const faqs = [
            {
                q: "هل مناسب لجميع أنواع الأظافر؟",
                a: "نعم، تاين مناسب للأظافر الطبيعية بمختلف أنواعها، سواء كانت ضعيفة أو جافة أو سهلة التكسر."
            },
            {
                q: "متى أبدأ ألاحظ النتائج؟",
                a: "قد تختلف النتائج من شخص لآخر، لكن كثير من المستخدمين يلاحظون تحسناً في مظهر وترطيب الأظافر خلال الأسابيع الأولى من الاستخدام المنتظم."
            },
            {
                q: "هل يمكن استخدامه مع المناكير؟",
                a: "نعم، يمكن استخدام تاين كجزء من روتين العناية بالأظافر سواء مع المناكير أو بدونه."
            },
            {
                q: "هل يترك ملمساً دهنياً؟",
                a: "تم تطوير تاين ليكون خفيفاً وسهل الاستخدام، ويمتص بسرعة دون إحساس مزعج على الأظافر."
            },
            {
                q: "هل يناسب الأظافر المتقصفة أو سهلة التكسر؟",
                a: "نعم، تم تصميم تاين لدعم العناية اليومية بالأظافر وتحسين مظهرها وصحتها العامة."
            },
            {
                q: "هل يمكن استخدامه على الجلد المحيط بالأظافر؟",
                a: "نعم، يمكن تطبيقه على الأظافر والمنطقة المحيطة بها ضمن روتين العناية اليومي."
            }
        ];

        // 3. Build HTML Structure
        const faqSection = document.createElement('section');
        faqSection.className = 'custom-faq-section container';
        
        let faqHtml = `<h2 class="custom-faq-title">الأسئلة الشائعة</h2><div class="custom-faq-container">`;
        
        faqs.forEach(faq => {
            faqHtml += `
                <div class="custom-faq-item">
                    <button class="custom-faq-question" aria-expanded="false">
                        <span>${faq.q}</span>
                        <svg class="custom-faq-icon" viewBox="0 0 24 24">
                            <path d="M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z"/>
                        </svg>
                    </button>
                    <div class="custom-faq-answer">
                        <div class="custom-faq-answer-inner">${faq.a}</div>
                    </div>
                </div>
            `;
        });
        faqHtml += `</div>`;
        faqSection.innerHTML = faqHtml;

        // 4. Insert into DOM (End of main content, right before footer)
        const mainContent = document.getElementById('main-content');
        if (mainContent) {
            mainContent.appendChild(faqSection);
        } else {
            // Fallback if main-content is somehow missing
            const footer = document.querySelector('.store-footer');
            if (footer) {
                footer.parentNode.insertBefore(faqSection, footer);
            }
        }

        // 5. Attach Accordion Interactions
        const items = faqSection.querySelectorAll('.custom-faq-item');
        items.forEach(item => {
            const btn = item.querySelector('.custom-faq-question');
            btn.addEventListener('click', () => {
                const isActive = item.classList.contains('active');
                
                // Optional: Close all other open items
                items.forEach(otherItem => {
                    otherItem.classList.remove('active');
                    otherItem.querySelector('.custom-faq-question').setAttribute('aria-expanded', 'false');
                });

                // Toggle current item
                if (!isActive) {
                    item.classList.add('active');
                    btn.setAttribute('aria-expanded', 'true');
                }
            });
        });
    }

    // Initialize safely
    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', initFaqSection);
    } else {
        initFaqSection();
    }
})();







 document.addEventListener('DOMContentLoaded', () => {
    // 1. التأكد من أن التعديل يطبق فقط على المنتج المحدد
    const productIdInput = document.querySelector('input[name="id"]');
    if (!productIdInput || productIdInput.value !== '1613714645') return;

    // 2. استهداف حاوية الوصف
    const articleContainer = document.querySelector('article.article--main');
    if (!articleContainer) return;

    // 3. إضافة تنسيقات CSS لشريط المقارنة فقط
    const style = document.createElement('style');
    style.textContent = `
        .custom-ba-container {
            position: relative;
            width: 100%;
            border-radius: 12px;
            overflow: hidden;
            user-select: none;
            direction: ltr; /* ضروري لحسابات السحب بدقة */
            margin-bottom: 24px; /* مسافة بين المقارنة والصور الأصلية للوصف */
            display: block;
        }
        .custom-ba-base-img {
            display: block;
            width: 100%;
            height: auto;
            pointer-events: none;
        }
        .custom-ba-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            clip-path: polygon(0 0, 50% 0, 50% 100%, 0 100%);
            pointer-events: none;
            will-change: clip-path;
        }
        .custom-ba-overlay img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }
        .custom-ba-handle {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 50%;
            width: 3px;
            background: #fff;
            transform: translateX(-50%);
            pointer-events: none;
            z-index: 2;
            box-shadow: 0 0 8px rgba(0,0,0,0.2);
            will-change: left;
        }
        .custom-ba-button {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 44px;
            height: 44px;
            background: #fff;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            box-shadow: 0 4px 12px rgba(0,0,0,0.15);
            color: var(--color-primary, #9F3135);
        }
        .custom-ba-button svg {
            width: 24px;
            height: 24px;
            fill: currentColor;
        }
        .custom-ba-input {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            opacity: 0;
            cursor: ew-resize;
            z-index: 3;
            margin: 0;
        }
        .custom-ba-label {
            position: absolute;
            top: 15px;
            padding: 6px 16px;
            background: rgba(0,0,0,0.6);
            color: #fff;
            border-radius: 20px;
            font-family: inherit;
            font-size: 13px;
            font-weight: bold;
            pointer-events: none;
            z-index: 2;
            backdrop-filter: blur(4px);
            -webkit-backdrop-filter: blur(4px);
        }
        .custom-ba-label-before { right: 15px; }
        .custom-ba-label-after { left: 15px; }
    `;
    document.head.appendChild(style);

    // 4. إعداد الروابط لصور (قبل وبعد) فقط
    const imgBeforeUrl = 'https://cdn.files.salla.network/homepage/408796450/9ad8354f-bd97-4f8f-b153-c6284925b0e5_673x900.webp?_s_uploader_cache_bust=preview-6sone2ard';
    const imgAfterUrl = 'https://cdn.files.salla.network/homepage/408796450/45c670a8-a81e-4c9a-affa-ea3287b33f3e_677x900.webp?_s_uploader_cache_bust=preview-zvis84dud';

    // 5. إنشاء حاوية المقارنة المستقلة
    const baContainer = document.createElement('div');
    baContainer.className = 'custom-ba-container';

    baContainer.innerHTML = `
        <img src="${imgBeforeUrl}" class="custom-ba-base-img" alt="قبل الاستخدام" loading="lazy">
        <div class="custom-ba-overlay">
            <img src="${imgAfterUrl}" alt="بعد الاستخدام" loading="lazy">
        </div>
        <div class="custom-ba-handle">
            <div class="custom-ba-button">
                <svg viewBox="0 0 24 24">
                    <path d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"/>
                    <path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"/>
                </svg>
            </div>
        </div>
        <span class="custom-ba-label custom-ba-label-before">قبل</span>
        <span class="custom-ba-label custom-ba-label-after">بعد</span>
        <input type="range" min="0" max="100" value="50" class="custom-ba-input" aria-label="تحريك للمقارنة بين قبل وبعد">
    `;

    // 6. تشغيل حركة الشريط
    const range = baContainer.querySelector('.custom-ba-input');
    const overlay = baContainer.querySelector('.custom-ba-overlay');
    const handle = baContainer.querySelector('.custom-ba-handle');

    range.addEventListener('input', (e) => {
        const val = e.target.value;
        overlay.style.clipPath = `polygon(0 0, ${val}% 0, ${val}% 100%, 0 100%)`;
        handle.style.left = `${val}%`;
    });

    // 7. حقن شريط المقارنة كأول عنصر في الوصف دون المساس بالصور الأصلية
    articleContainer.prepend(baContainer);
});


 





(function() {
    function initProductTabs() {
        // Prevent duplicate initialization
        if (document.querySelector('.custom-product-tabs-wrapper')) return;

        // Target the existing Description and Comments sections
        const descriptionEl = document.querySelector('.product__description');
        const commentsEl = document.querySelector('salla-comments');

        if (!descriptionEl || !commentsEl) return;

        // Extract dynamic review count from Salla rating stars
        let reviewsText = 'التقييمات';
        const ratingStars = document.querySelector('salla-rating-stars');
        if (ratingStars && ratingStars.getAttribute('reviews')) {
            const count = ratingStars.getAttribute('reviews');
            if (parseInt(count) > 0) {
                reviewsText = `التقييمات (${count})`;
            }
        }

        // 1. Inject UI Styles
        const style = document.createElement('style');
        style.innerHTML = `
            .custom-product-tabs-wrapper {
                width: 100%;
                margin: 1.5rem 0;
                clear: both;
                display: flex;
                flex-direction: column;
            }
            .custom-tabs-nav {
                display: flex;
                align-items: center;
                justify-content: flex-start;
                border-bottom: 2px solid #e5e7eb;
                margin-bottom: 1.5rem;
                gap: 2rem;
            }
            .custom-tab-btn {
                background: transparent;
                border: none;
                padding: 0.75rem 0;
                font-size: 1.125rem;
                font-weight: 700;
                color: #9ca3af;
                cursor: pointer;
                position: relative;
                transition: color 0.3s ease;
                font-family: inherit;
                white-space: nowrap;
            }
            .custom-tab-btn:hover {
                color: var(--color-primary, #9F3135);
            }
            .custom-tab-btn.active {
                color: var(--color-primary, #9F3135);
            }
            .custom-tab-btn::after {
                content: '';
                position: absolute;
                bottom: -2px;
                left: 0;
                width: 100%;
                height: 3px;
                background-color: transparent;
                transition: background-color 0.3s ease;
                border-radius: 3px 3px 0 0;
            }
            .custom-tab-btn.active::after {
                background-color: var(--color-primary, #9F3135);
            }
            .custom-tabs-content {
                position: relative;
                width: 100%;
            }
            .custom-tab-panel {
                display: none;
                opacity: 0;
                transform: translateY(5px);
                will-change: transform, opacity;
            }
            .custom-tab-panel.active {
                display: block;
                animation: customFadeTabIn 0.4s ease forwards;
            }
            @keyframes customFadeTabIn {
                to { opacity: 1; transform: translateY(0); }
            }
            
            /* Clean up description and comments formatting inside the new layout */
            .custom-tab-panel.product__description {
                padding: 0 !important;
                margin: 0 !important;
            }
            .custom-tab-panel.product__description img {
                max-width: 100%;
                border-radius: 12px;
                margin: 0 auto;
            }
            .custom-tab-panel salla-comments .s-comments-container {
                padding: 0 !important;
                background: transparent !important;
                box-shadow: none !important;
            }
        `;
        document.head.appendChild(style);

        // 2. Build the Tabs Structure
        const tabsWrapper = document.createElement('div');
        tabsWrapper.className = 'custom-product-tabs-wrapper';

        const nav = document.createElement('div');
        nav.className = 'custom-tabs-nav';

        const btnDesc = document.createElement('button');
        btnDesc.className = 'custom-tab-btn active';
        btnDesc.textContent = 'وصف المنتج';
        btnDesc.dataset.target = 'desc';

        const btnReviews = document.createElement('button');
        btnReviews.className = 'custom-tab-btn';
        btnReviews.textContent = reviewsText;
        btnReviews.dataset.target = 'reviews';

        nav.appendChild(btnDesc);
        nav.appendChild(btnReviews);

        const content = document.createElement('div');
        content.className = 'custom-tabs-content';

        descriptionEl.classList.add('custom-tab-panel', 'active');
        commentsEl.classList.add('custom-tab-panel');

        // 3. Placement
        descriptionEl.parentNode.insertBefore(tabsWrapper, descriptionEl);

        content.appendChild(descriptionEl);
        content.appendChild(commentsEl);

        tabsWrapper.appendChild(nav);
        tabsWrapper.appendChild(content);

        // 4. Tab Interaction Event Listeners
        const buttons = nav.querySelectorAll('.custom-tab-btn');
        buttons.forEach(btn => {
            btn.addEventListener('click', (e) => {
                // Reset State
                buttons.forEach(b => b.classList.remove('active'));
                descriptionEl.classList.remove('active');
                commentsEl.classList.remove('active');

                // Activate Target Tab
                e.target.classList.add('active');
                if (e.target.dataset.target === 'desc') {
                    descriptionEl.classList.add('active');
                } else {
                    commentsEl.classList.add('active');
                }
            });
        });

        // 5. Force ZudApp Widget OUTSIDE and ABOVE the tabs
        function extractZudApp() {
            // Target the widget using its specific attributes and classes
            const zudWidgets = document.querySelectorAll('[data-zud-initialized], [data-campaign-id], [class*="zudapp-widget"]');
            zudWidgets.forEach(widget => {
                // If ZudApp dynamically injects itself inside the description/tabs, we pull it out
                if (tabsWrapper.contains(widget)) {
                    tabsWrapper.parentNode.insertBefore(widget, tabsWrapper);
                }
            });
        }

        // Extract immediately in case it's already there
        extractZudApp();

        // Setup MutationObserver to continuously watch and extract ZudApp if it loads late
        const zudObserver = new MutationObserver(() => {
            extractZudApp();
        });
        zudObserver.observe(document.body, { childList: true, subtree: true });
    }

    // Monitor the DOM to catch dynamically injected base elements
    const initObserver = new MutationObserver(() => {
        if (document.querySelector('.product__description') && document.querySelector('salla-comments')) {
            initProductTabs();
        }
    });

    initObserver.observe(document.body, { childList: true, subtree: true });

    // Initialize safely with fallback
    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', initProductTabs);
    } else {
        initProductTabs();
    }
    window.addEventListener('load', initProductTabs);
})();