(() => {
"use strict";

// يعمل فقط على صفحة المنتج المحددة
if (!location.pathname.includes("/p1883361925")) return;

function init() {

    if (document.getElementById("viber-open-calculator"))
        return true;

    const tabs = document.querySelector(".tabs.tabs__product");

    if (!tabs)
        return false;

    // زر فتح الحاسبة
    const btn = document.createElement("button");

    btn.type = "button";
    btn.id = "viber-open-calculator";
    btn.textContent = " لحساب كم راح نحولك (اضغظ هنا)";

    btn.style.cssText = `
        width:100%;
        padding:14px;
        margin:15px 0;
        background:#6d28d9;
        color:#fff;
        border:none;
        border-radius:10px;
        font-size:16px;
        font-weight:bold;
        cursor:pointer;
    `;

    tabs.insertAdjacentElement("afterend", btn);

    // إنشاء النافذة
    const wrapper = document.createElement("div");

    wrapper.innerHTML = `

<style>

#viber-modal{
display:none;
position:fixed;
inset:0;
background:rgba(0,0,0,.55);
z-index:999999;
align-items:center;
justify-content:center;
padding:20px;
}

#viber-box{
background:#fff;
width:100%;
max-width:420px;
border-radius:16px;
padding:24px;
direction:rtl;
box-sizing:border-box;
animation:popup .2s;
}

@keyframes popup{
from{
transform:scale(.9);
opacity:0;
}
to{
transform:scale(1);
opacity:1;
}
}

#viber-box h2{
margin:0 0 18px;
font-size:22px;
color:#6d28d9;
text-align:center;
}

#viber-box input{
width:100%;
padding:14px;
font-size:18px;
border:1px solid #ddd;
border-radius:10px;
margin-top:10px;
box-sizing:border-box;
}
#viber-calc{

width:100%;
margin-top:15px;
padding:14px;
background:#6d28d9;
color:#fff;
border:none;
border-radius:10px;
cursor:pointer;
font-size:16px;

}

#viber-close{

width:100%;
margin-top:15px;
padding:12px;
background:#eee;
border:none;
border-radius:10px;
cursor:pointer;
font-size:15px;

}

#viber-price{

display:none;
margin-top:20px;
text-align:center;
font-size:30px;
font-weight:bold;
color:#16a34a;

}

</style>

<div id="viber-modal">

<div id="viber-box">

<h2> اكتب مجموع الرصيد (بدون ضريبة)</h2>

<input
id="viber-balance"
type="number"
placeholder="مثال: 500">

<button
type="button"
id="viber-calc">
احسب
</button>

<div id="viber-price"></div>

<button
type="button"
id="viber-close">
إغلاق
</button>

</div>

</div>

`;

document.body.appendChild(wrapper);

const popup = document.getElementById("viber-modal");

btn.addEventListener("click",function(e){

e.preventDefault();
e.stopPropagation();

popup.style.display="flex";

});

document.getElementById("viber-close").addEventListener("click",function(e){

e.preventDefault();
e.stopPropagation();

popup.style.display="none";

});
  popup.addEventListener("click",function(e){

    if(e.target===popup){

        popup.style.display="none";

    }

});

document.getElementById("viber-calc").addEventListener("click",function(e){

    e.preventDefault();
    e.stopPropagation();

    const value = parseFloat(
        document.getElementById("viber-balance").value
    );

    if(isNaN(value) || value <= 0){

        alert("أدخل قيمة صحيحة");

        return;

    }

    const total = (value * 0.90) - 1.5;

    const result = document.getElementById("viber-price");

    result.style.display = "block";

    result.innerHTML = `
        <div style="
            background:#f5f3ff;
            border:1px solid #d8b4fe;
            padding:15px;
            border-radius:10px;
        ">
            <div style="
                font-size:16px;
                color:#666;
                margin-bottom:8px;
            ">
                سعر الشراء
            </div>

            <div style="
                font-size:32px;
                font-weight:bold;
                color:#16a34a;
            ">
                ${total.toFixed(2)} ريال
            </div>
        </div>
    `;

});

return true;

}const timer = setInterval(function(){

    if(init()){

        clearInterval(timer);

    }

},300);

})();