/* * ACDIVET - إصلاح شامل وجذري للنسخة العربية على الجوال * تم تصميم هذا الكود ليعالج مشاكل التداخل والـ Overflow الناتجة عن Elementor والثيم. * * تعديل: نقل overflow-x/position من إلى فقط لتفادي كسر * position:fixed لأي عنصر منبثق (مثل قائمة الموبايل) على متصفحات iOS Safari. */ /* 1. منع خروج أي محتوى عن عرض الشاشة */ /* لا نلمس html نفسها بـ overflow/position، فقط نضبط عرضها */ html[dir="rtl"] { max-width: 100% !important; width: 100% !important; margin: 0 !important; padding: 0 !important; } /* overflow-x + position:relative فقط على body، وليس على html */ html[dir="rtl"] body { max-width: 100% !important; overflow-x: hidden !important; position: relative !important; width: 100% !important; margin: 0 !important; padding: 0 !important; text-align: right !important; } @media (max-width: 991px) { /* 2. إصلاح الحاويات العامة */ html[dir="rtl"] .container, html[dir="rtl"] .elementor-container, html[dir="rtl"] .et-container { width: 100% !important; max-width: 100% !important; padding-left: 15px !important; padding-right: 15px !important; margin-left: auto !important; margin-right: auto !important; display: block !important; /* لضمان عدم تأثرها بـ flex خاطئ */ } /* 3. إصلاح الصفوف والأعمدة */ html[dir="rtl"] .row, html[dir="rtl"] .et-wrap-columns, html[dir="rtl"] .elementor-row { display: flex !important; flex-wrap: wrap !important; flex-direction: row-reverse !important; /* قلب الاتجاه للعربي */ margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html[dir="rtl"] [class*="col-"], html[dir="rtl"] [class*="et_col-"], html[dir="rtl"] .elementor-column { width: 100% !important; /* إجبار الأعمدة على أخذ العرض الكامل في الجوال */ max-width: 100% !important; flex: 0 0 100% !important; padding: 5px !important; box-sizing: border-box !important; float: none !important; } /* استثناء لصفوف الهيدر (نريد العناصر بجانب بعضها) */ html[dir="rtl"] .header-main .et-wrap-columns { flex-wrap: nowrap !important; } html[dir="rtl"] .header-main .et_column { width: auto !important; flex: 1 !important; } /* استثناء صريح لقائمة الموبايل المنبثقة: لا نريدها متأثرة بقلب row-reverse ولا بإجبار الأعمدة على 100%، لأنها ليست عمود شبكة بل popup كامل الشاشة */ html[dir="rtl"] .mobile-menu-popup, html[dir="rtl"] .mobile-menu-popup * { flex-direction: initial; } /* 4. إصلاح الهيدر (الشعار والقائمة) */ html[dir="rtl"] .et_b_header-logo { text-align: center !important; } html[dir="rtl"] .et_b_header-logo img { max-width: 120px !important; height: auto !important; } /* 5. إصلاح القائمة الجانبية (Sidebar) */ /* هام: لا نضع transform/right/left/width هون. الصندوق المرئي الفعلي هو الابن .et-popup (position:fixed + left:50%+transform:translate(-50%,-50%) من ثيم acdivet نفسه) وليس هذا الغلاف .mobile-menu-popup. أي transform على هذا الغلاف يجعله containing block جديد لأولاده position:fixed، فيكسر تمركز القائمة بالكامل بالنسبة للشاشة. */ html[dir="rtl"] .mobile-menu-popup { visibility: visible !important; display: none; /* سيتم التحكم به عبر JS الأصلي */ } html[dir="rtl"] .mobile-menu-popup.active, html[dir="rtl"] .mobile-menu-popup[style*="display: block"], html[dir="rtl"] .mobile-menu-popup[style*="display:block"] { display: block !important; } /* 6. إصلاح الأزرار العائمة (WhatsApp) */ html[dir="rtl"] .floating-actions { right: auto !important; left: 15px !important; direction: ltr !important; /* لإبقاء الأيقونات وتلميحاتها صحيحة */ } html[dir="rtl"] .float-item { transform: none !important; border-radius: 50% !important; margin-bottom: 10px !important; } /* 7. إخفاء أي عناصر تسبب عرضاً زائداً غير ضروري */ html[dir="rtl"] .dt-hide { display: none !important; } /* 8. إصلاح الصور الكبيرة */ html[dir="rtl"] img { max-width: 100% !important; height: auto !important; } /* 9. إصلاح النصوص والعناوين */ html[dir="rtl"] h1, html[dir="rtl"] h2, html[dir="rtl"] h3, html[dir="rtl"] p { word-wrap: break-word !important; overflow-wrap: break-word !important; } } /* إصلاح مشكلة السكرول الأفقي الناتجة عن Elementor */ .elementor-section-stretched { width: 100% !important; left: 0 !important; right: 0 !important; }