From e8f3bf8686e759b8639341603ca8894a8454cbc1 Mon Sep 17 00:00:00 2001
From: "Najjar\\NajjarV02" <mglnaj6>
Date: Fri, 22 May 2026 09:39:44 +0400
Subject: [PATCH] fix: enforce LTR layout across the application regardless of
 language

---
 src/app/globals.css                 |  3 +++
 src/components/I18nProvider.tsx     | 10 ++++------
 src/components/LanguageSwitcher.tsx |  6 +++---
 3 files changed, 10 insertions(+), 9 deletions(-)

diff --git a/src/app/globals.css b/src/app/globals.css
index f13000f..f52be2b 100644
--- a/src/app/globals.css
+++ b/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 {
diff --git a/src/components/I18nProvider.tsx b/src/components/I18nProvider.tsx
index daddb25..705350f 100644
--- a/src/components/I18nProvider.tsx
+++ b/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;
     };
 
diff --git a/src/components/LanguageSwitcher.tsx b/src/components/LanguageSwitcher.tsx
index 1b1da98..d6f4f90 100644
--- a/src/components/LanguageSwitcher.tsx
+++ b/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]);