document.addEventListener("DOMContentLoaded", function () {
  const meta = document.querySelector('meta[property="product:category"]');
  if (!meta) return;

  const categories = meta.getAttribute("content").split(",");
  
if (categories.includes("خصم اضافي 10% اليوم وطني")) {
    const priceEl = document.querySelector(".flex-div .n-price");
    const flexDiv = document.querySelector(".flex-div");
    if (!priceEl || !flexDiv) return;

    // تنظيف السعر من الفواصل وأي شيء غير الأرقام أو النقطة
    const priceText = priceEl.textContent.trim().replace(/[^\d.]/g, "");
    if (!priceText) return;

    const price = parseFloat(priceText);
    if (isNaN(price)) return;

    const discountValue = (price * 0.10); 
    const finalPrice = (price - discountValue).toFixed(2);

    // إزالة العنصر القديم إذا موجود
    const oldNote = flexDiv.querySelector(".extra-discount");
    if (oldNote) oldNote.remove();

    // إنشاء العنصر الجديد
    const noteEl = document.createElement("div");
    noteEl.className = "extra-discount";
    noteEl.textContent = `بعد الخصم الاضافي  ${finalPrice} SAR`;
    noteEl.style.marginTop = "8px";
    noteEl.style.padding = "0";
    noteEl.style.backgroundColor = "#f0f8f5";
    noteEl.style.color = "#d32f2f";
    noteEl.style.fontWeight = "bold";
    noteEl.style.borderRadius = "8px";
    noteEl.style.fontSize = "20px";

    flexDiv.appendChild(noteEl);
  }
});















const targetUrlPattern = /page-283079022/;

function injectCalculator() {
    const h1Element = document.querySelector('h1.font-bold.text-2xl.mb-6');
    if (!h1Element) {
        console.log('لم يتم العثور على العنصر h1 بالفئة المحددة');
        return;
    }

    const calculatorContainer = document.createElement('div');
    calculatorContainer.id = 'calculator-container';
    h1Element.insertAdjacentElement('afterend', calculatorContainer);

    calculatorContainer.innerHTML = `
        <style>
        @media (max-width: 768px) {
    .content--single-page.p-6

 {
        padding: 5px !important;
    }
}
            /*body#app :has(.calculator) .content-entry.mb-10, body#app :has(.calculator) h1.font-bold.text-2xl.mb-6 {
                display: none;
            }*/
            #calculator-container {
                font-family: Arial, sans-serif;
                text-align: center;
                direction: rtl;
            }
            .calculator {
                background-color: white;
                padding: 20px;
                border-radius: 10px;
                box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
                text-align: right;
                width: 90%;
                margin: auto;
            }
            .calculator h2 {
                color: #333;
                margin-bottom: 20px;
                font-size: 24px;
            }
            .calculator label {
                display: block;
                margin: 10px 0 5px;
                color: #555;
                font-size: 16px;
            }
            .calculator input {
                width: 100%;
                padding: 8px;
                margin-bottom: 10px;
                border: 1px solid #ccc;
                border-radius: 5px;
                box-sizing: border-box;
                font-size: 14px;
            }
            .calculator button {
                background-color: #297c43;
                color: white;
                padding: 5px 10px;
                border: none;
                border-radius: 5px;
                cursor: pointer;
                font-size: 16px;
                font-weight: bold;
                width: 100%;
            }
            .calculator button:hover {
                background-color: #000;
            }
            #result {
                margin-top: 20px;
                font-size: 18px;
                color: #333;
            }
            #result a {
                color: #297c43;
                text-decoration: none;
                font-size: 20px;
                line-height: 2;
                font-weight: bold;
            }
            #result a:hover {
                text-decoration: underline;
                color: #000;
            }
            #ac-iframe {
                width: 100%;
                height: 600px;
                border: none;
                margin-top: 20px;
            }
        </style>
        <div class="calculator">
            <h2>حاسبة وحدات التكييف</h2>
            <label for="length">طول الغرفة (متر):</label>
            <input type="number" id="length" step="0.01" min="0" placeholder="أدخل الطول">
            <label for="width">عرض الغرفة (متر):</label>
            <input type="number" id="width" step="0.01" min="0" placeholder="أدخل العرض">
            <label for="height">أرتفاع الغرفة (متر):</label>
            <input type="number" id="height" step="0.01" min="0" placeholder="أدخل الارتفاع">
            <button id="calculate-btn"> أحصل على المقاس المناسب للمكيف</button>
            <div id="result"></div>
        </div>
    `;

    document.getElementById('calculate-btn').addEventListener('click', calculateACUnits);
}

function calculateACUnits() {
    const length = parseFloat(document.getElementById('length').value);
    const width = parseFloat(document.getElementById('width').value);
    const height = parseFloat(document.getElementById('height').value);
    const resultDiv = document.getElementById('result');

    if (isNaN(length) || isNaN(width) || isNaN(height) || length <= 0 || width <= 0 || height <= 0) {
        resultDiv.innerHTML = '<p style="color: red;">يرجى إدخال أبعاد صحيحة (أكبر من صفر).</p>';
        return;
    }

    const btu = Math.round(length * width * height * 300);
    let tons = '';
    let link = '';
    let iframeSrc = '';

    if (btu < 12000) {
        tons = '1';
        link = `<a href="https://alghanim-store.com/%D9%85%D9%83%D9%8A%D9%81%D8%A7%D8%AA%201%20%D8%B7%D9%86/c1907528732" target="_blank">تصفح مكيفات 1 طن</a>`;
        iframeSrc = 'https://salla.takteek.net/salla/cat-1-ton-ghanem';
    } else if (btu >= 12000 && btu <= 17999) {
        tons = '1';
        link = `<a href="https://alghanim-store.com/%D9%85%D9%83%D9%8A%D9%81%D8%A7%D8%AA%201%20%D8%B7%D9%86/c1907528732" target="_blank">تصفح مكيفات 1 طن</a>`;
        iframeSrc = 'https://salla.takteek.net/salla/cat-1-ton-ghanem';
    } else if (btu >= 18000 && btu <= 23999) {
        tons = '1.5';
        link = `<a href="https://alghanim-store.com/%D9%85%D9%83%D9%8A%D9%81%D8%A7%D8%AA%201.5%20%D8%B7%D9%86/c1134539549" target="_blank">تصفح مكيفات 1.5 طن</a>`;
        iframeSrc = 'https://salla.takteek.net/salla/cat-1-5-ton-ghanem';
    } else if (btu >= 24000 && btu <= 29999) {
        tons = '2';
        link = `<a href="https://alghanim-store.com/%D9%85%D9%83%D9%8A%D9%81%D8%A7%D8%AA%202%20%D8%B7%D9%86/c493146654" target="_blank">تصفح مكيفات 2 طن</a>`;
        iframeSrc = 'https://salla.takteek.net/salla/cat-2-ton-ghanem';
    } else if (btu >= 30000 && btu <= 35999) {
        tons = '2.5';
        link = `<a href="https://alghanim-store.com/%D9%85%D9%83%D9%8A%D9%81%D8%A7%D8%AA%202.5%20%D8%B7%D9%86/c1866592543" target="_blank">تصفح مكيفات 2.5 طن</a>`;
        iframeSrc = 'https://salla.takteek.net/salla/cat-2-5-ton-ghanem';
    } else if (btu >= 36000 && btu <= 41999) {
        tons = '3';
        link = `<a href="https://alghanim-store.com/%D9%85%D9%83%D9%8A%D9%81%D8%A7%D8%AA%203%20%D8%B7%D9%86/c959320088" target="_blank">تصفح مكيفات 3 طن</a>`;
        iframeSrc = 'https://salla.takteek.net/salla/cat-3-ton-ghanem';
    } else if (btu >= 42000 && btu <= 47999) {
        tons = '3.5';
        link = `<a href="https://alghanim-store.com/%D9%85%D9%83%D9%8A%D9%81%D8%A7%D8%AA%203.5%20%D8%B7%D9%86/c10198116" target="_blank">تصفح mكيفات 3.5 طن</a>`;
        iframeSrc = 'https://salla.takteek.net/salla/cat-3-5-ton-ghanem';
    } else if (btu >= 48000) {
        const numUnits = Math.ceil(btu / 24000);
        if (numUnits * 24000 <= btu) {
            tons = '2+';
            link = `<a href="https://alghanim-store.com/%D9%85%D9%83%D9%8A%D9%81%D8%A7%D8%AA%202%20%D8%B7%D9%86/c493146654" target="_blank">اقتراح ${numUnits} مكيفات 2 طن</a>`;
            iframeSrc = 'https://salla.takteek.net/salla/cat-2-ton-ghanem';
        } else {
            const numUnits35 = Math.ceil(btu / 42000);
            tons = '3.5+';
            link = `<a href="https://alghanim-store.com/%D9%85%D9%83%D9%8A%D9%81%D8%A7%D8%AA%203.5%20%D8%B7%D9%86/c10198116" target="_blank">اقتراح ${numUnits35} مكيف 3.5 طن</a>`;
            iframeSrc = 'https://salla.takteek.net/salla/cat-3-5-ton-ghanem';
        }
    }

    resultDiv.innerHTML = `
        <p>الوحدات المطلوبة: ${btu} BTU (تقريبًا ${tons} طن).</p>
        ${link}
        <iframe id="ac-iframe" src="${iframeSrc}" scrolling="no" style="width: 100%; height: 850;border: none;"></iframe> 
    `;
}

function checkAndInject() {
    if (targetUrlPattern.test(window.location.href)) {
        injectCalculator();
    } else {
        console.log('الرابط لا يتطابق مع النمط المطلوب');
    }
}

document.addEventListener('DOMContentLoaded', checkAndInject);
document.addEventListener("DOMContentLoaded", function () {
    // البحث عن العنصر الذي يحتوي على اسم الكولكشن
    const pageMainTitle = document.querySelector('#page-main-title');

    if (!pageMainTitle) {
        console.error("العنصر #page-main-title غير موجود. تأكد من صحة المعرف.");
        return;
    }

    // استخراج النص الأولي عند التحميل
    const initialText = pageMainTitle.textContent.trim();

    // التحقق من وجود علامة "|" لاستخراج القسم الفرعي
    const collectionName = initialText.includes('|') 
        ? initialText.split('|').pop().trim() // النص بعد "|"
        : initialText;

    // تعيين النص الأولي مباشرة
    pageMainTitle.textContent = collectionName;

    // مراقبة التغييرات على العنصر باستخدام MutationObserver
    const observer = new MutationObserver((mutations) => {
        mutations.forEach((mutation) => {
            // التحقق إذا كان النص قد تغير
            if (pageMainTitle.textContent !== collectionName) {
                pageMainTitle.textContent = collectionName;
            }
        });
    });

    // تفعيل المراقبة مع إعدادات محسنة
    observer.observe(pageMainTitle, { 
        childList: true, 
        subtree: true, 
        characterData: true 
    });

    // إيقاف المراقبة بعد وقت معين (اختياري، لتحسين الأداء)
    setTimeout(() => {
        observer.disconnect();
        console.log("تم إيقاف مراقبة التغييرات على #page-main-title");
    }, 10000); // إيقاف بعد 10 ثوانٍ (يمكن تعديل المدة حسب الحاجة)
});