fix: enforce LTR layout across the application regardless of language

src/app/globals.css

@@ -81,6 +81,9 @@ body {
   overflow-x: hidden;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
+  direction: ltr !important;
+  unicode-bidi: isolate;
+  text-align: left;
 }
 
 body {

src/components/I18nProvider.tsx

@@ -8,14 +8,12 @@ export function I18nProvider({ children }: { children: React.ReactNode }) {
   const [isInitialized, setIsInitialized] = useState(false);
 
   useEffect(() => {
-    // Set initial document direction based on detected language
-    const lang = i18n.language || 'en';
-    document.documentElement.dir = lang === 'ar' ? 'rtl' : 'ltr';
-    document.documentElement.lang = lang;
+    // Force LTR site-wide regardless of detected language
+    document.documentElement.dir = 'ltr';
+    document.documentElement.lang = i18n.language || 'en';
 
-    // Listen for language changes
     const handleLanguageChanged = (lng: string) => {
-      document.documentElement.dir = lng === 'ar' ? 'rtl' : 'ltr';
+      document.documentElement.dir = 'ltr';
       document.documentElement.lang = lng;
     };
 

src/components/LanguageSwitcher.tsx

@@ -9,9 +9,9 @@ export function LanguageSwitcher() {
   const toggleLanguage = useCallback(() => {
     const newLang = i18n.language === 'en' ? 'ar' : 'en';
     i18n.changeLanguage(newLang);
-    
-    // Update document direction for RTL support
-    document.documentElement.dir = newLang === 'ar' ? 'rtl' : 'ltr';
+
+    // Force LTR layout regardless of language
+    document.documentElement.dir = 'ltr';
     document.documentElement.lang = newLang;
   }, [i18n]);