// الحصول على الأيقونة من الـ HTML باستخدام المعرف
var waIcon = document.querySelector('#wa-angel');

// إنشاء حاوية للقائمة
var whatsappContainer = document.createElement('div');
whatsappContainer.id = 'whatsappContainer';

// إضافة الشعار أعلى القائمة
var logoContainer = document.createElement('div');
logoContainer.className = 'logo-container';
logoContainer.innerHTML = `<img src="https://cdn.salla.sa/wrbyg/lNTJekmQ09FZEi7BMIBjkui2jOYDemV1PmynrnZp.png" alt="Logo" class="logo">`;
whatsappContainer.appendChild(logoContainer);

// إنشاء قائمة واتساب
var whatsappList = document.createElement('div');
whatsappList.id = 'whatsappList';
whatsappList.innerHTML = `
    <div class="whatsapp-section">
        <h4>خدمة العملاء</h4>
        <a href="https://wa.me/+966531521038" target="_blank"><i class="sicon-whatsapp2 text-3xl text-white"></i>+966531521038</a>
    </div>
    <div class="whatsapp-section">
        <h4>بيع كوينزك علينا</h4>
        <a href="https://wa.me/+966531521038" target="_blank"><i class="sicon-whatsapp2 text-3xl text-white"></i>+966531521038</a>
    </div>

`;

// إضافة القائمة إلى الحاوية
whatsappContainer.appendChild(whatsappList);
document.body.appendChild(whatsappContainer);

// إخفاء القائمة والشعار في البداية
whatsappContainer.style.display = 'none'; // إخفاء الحاوية بالكامل (بما فيها الشعار والقائمة)

// منع تحويل الأيقونة لرابط
waIcon.addEventListener('click', function(event) {
    event.preventDefault(); // إلغاء التحويل للرابط

    // عرض أو إخفاء القائمة والشعار
    if (whatsappContainer.style.display === 'none' || whatsappContainer.style.display === '') {
        whatsappContainer.style.display = 'block'; // إظهار الحاوية بالكامل
    } else {
        whatsappContainer.style.display = 'none'; // إخفاء الحاوية بالكامل
    }
});