/* =========================================
   1. تغيير الخط للنسخة العربية (خط Tajawal)
   ========================================= */
@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700&display=swap');

html[lang="ar"] body,
html[lang="ar"] p,
html[lang="ar"] h1, html[lang="ar"] h2, html[lang="ar"] h3, 
html[lang="ar"] h4, html[lang="ar"] h5, html[lang="ar"] h6,
html[lang="ar"] a, html[lang="ar"] div, html[lang="ar"] span,
html[lang="ar"] li {
    font-family: 'Tajawal', sans-serif !important;
}

/* =========================================
   2. إصلاح اختفاء قائمة الموبايل في العربي
   ========================================= */
@media screen and (max-width: 991px) {
    /* إجبار حاوية الموبايل الأساسية على الظهور */
    html[lang="ar"] .mobile {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: relative !important;
        z-index: 9999 !important;
    }
    
    /* إصلاح زر القائمة الخاص بـ Webflow في وضع الـ RTL */
    html[lang="ar"] .w-nav-button {
        display: block !important;
        float: right !important; /* لضبط مكانه في اليمين */
    }
    
    /* منع القائمة الديسكتوب من التداخل في الموبايل */
    html[lang="ar"] .navbar-logo-center-container-2 {
        display: none !important;
    }
}

/* =========================================
   3. إصلاح شكل ومكان أيقونة القائمة المعطلة
   ========================================= */
html[lang="ar"] .w-icon-nav-menu {
    font-family: sans-serif !important; /* منع تعارض خطوط الويب */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

html[lang="ar"] .w-icon-nav-menu::before {
    content: "\2630" !important; /* رمز القائمة الثلاثي القياسي */
    font-size: 28px !important;
    color: #000000 !important; /* لون الأيقونة - أسود */
}

/* تعديل اتجاه زر القائمة ليكون متوافقاً مع اللغة العربية */
html[lang="ar"] .w-nav-button {
    float: left !important;
    margin-right: auto !important;
}

/* =========================================
   4. إجبار زر القائمة على استقبال النقرات
   ========================================= */
html[lang="ar"] .w-nav-button {
    position: relative !important;
    z-index: 99999 !important; /* رفعه فوق أي عنصر شفاف يغطيه */
    pointer-events: auto !important; /* تفعيل النقر الإجباري */
    cursor: pointer !important;
}

/* التأكد من أن الحاوية لا تمنع النقر */
html[lang="ar"] .mobile {
    pointer-events: auto !important;
}