feat(i18n,rtl): full Arabic localization + RTL sweep across all layouts

Frontend
- i18n: install tailwindcss-rtl, Cairo font, RTL-aware direction in index.css.
- Language toggle: localize aria-label / menu label, persist choice, update
  document dir synchronously.
- Sidebar: add `side` prop so the drawer pins to the right in RTL; wire up
  AdminLmsLayout, RoleLayout (student/teacher) and AppSidebar to pass
  side = i18n.dir() === 'rtl' ? 'right' : 'left'.
- AdminLmsLayout: convert every nav item from hard-coded title to titleKey,
  translate group labels (incl. the collapsible Training), breadcrumbs,
  user menu (Profile / Settings / Logout), help button and toggle aria
  labels; replace physical mr-/right- utilities with logical me-/end-.
- AI components (AiTipBanner, AiInsightsPanel, AiAlertBanner, AiSearchBar,
  AiAssistantDrawer): apply dir="auto" at the container level, localize
  titles, loading / error / empty states.
- Dashboards (admin / student / teacher): wrap numeric values in <bdi>,
  localize dates via ar-EG, fix flex direction for KPI and assignment cards.
- UI primitives (breadcrumb, calendar, carousel, dropdown-menu, menubar,
  context-menu, pagination, sidebar): flip chevrons in RTL via a scoped
  CSS rule, swap pl-/pr-/ml-/mr- for ps-/pe-/ms-/me-.
- Add logical-direction helpers and bidirectional isolation classes.

Locales
- Expand en.ts and ar.ts with full `nav`, `sidebarGroup`, `breadcrumb`,
  `userMenu`, `chrome`, `ai`, and dashboard key sets; keep key parity.

API client
- `api-client.ts` reads the active language from localStorage/i18n and sends
  `Accept-Language` on every request so the backend can localize AI output.

Backend (encoach_ai)
- openai_service: add _LANGUAGE_NAMES, normalize_language, language-aware
  system prompt injection for every OpenAI call.
- coach_service + controllers (coach_controller, ai_controller): thread
  the requested language from headers / user locale down to OpenAIService.
- ai_feedback: fix latent registry error by pointing course_id at op.course
  instead of the non-existent encoach.course.

Other
- .gitignore: ignore runtime odoo logs and local caches.

Made-with: Cursor

frontend/src/pages/student/DiagnosticTest.tsx

@@ -117,7 +117,7 @@ export default function DiagnosticTest() {
             )}
             <Button className="w-full" onClick={handleAnswer} disabled={!selectedAnswer || answerMutation.isPending}>
               {answerMutation.isPending && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
-              Submit Answer <ArrowRight className="ml-1 h-4 w-4" />
+              Submit Answer <ArrowRight className="ms-1 h-4 w-4 rtl:rotate-180" />
             </Button>
           </CardContent>
         </Card>

frontend/src/pages/student/LearningPlan.tsx

@@ -106,7 +106,7 @@ export default function LearningPlanPage() {
                 </div>
                 {(item.status === "available" || item.status === "in_progress") && (
                   <Button size="sm" onClick={() => navigate(`/student/topic/${item.topic_id}`)}>
-                    {item.status === "in_progress" ? "Continue" : "Start"} <ArrowRight className="ml-1 h-3 w-3" />
+                    {item.status === "in_progress" ? "Continue" : "Start"} <ArrowRight className="ms-1 h-3 w-3 rtl:rotate-180" />
                   </Button>
                 )}
                 {item.status === "completed" && (

frontend/src/pages/student/ProficiencyProfile.tsx

@@ -41,7 +41,7 @@ export default function ProficiencyProfile() {
         </div>
         <div className="flex gap-2">
           <Button variant="outline" onClick={() => navigate(`/student/diagnostic/${subjectId}`)}>Retake Diagnostic</Button>
-          <Button onClick={() => navigate(`/student/plan/${subjectId}`)}>Learning Plan <ArrowRight className="ml-1 h-4 w-4" /></Button>
+          <Button onClick={() => navigate(`/student/plan/${subjectId}`)}>Learning Plan <ArrowRight className="ms-1 h-4 w-4 rtl:rotate-180" /></Button>
         </div>
       </div>
 

frontend/src/pages/student/StudentCourseDetail.tsx

@@ -28,7 +28,7 @@ export default function StudentCourseDetail() {
   return (
     <div className="space-y-6">
       <div className="flex items-center gap-3">
-        <Button variant="ghost" size="icon" asChild><Link to="/student/courses"><ArrowLeft className="h-4 w-4" /></Link></Button>
+        <Button variant="ghost" size="icon" asChild><Link to="/student/courses"><ArrowLeft className="h-4 w-4 rtl:rotate-180" /></Link></Button>
         <div>
           <h1 className="text-2xl font-bold">{course.title}</h1>
           <p className="text-muted-foreground">{course.code} · {chapters.length} chapters</p>

frontend/src/pages/student/StudentDashboard.tsx

@@ -4,6 +4,7 @@ import { Badge } from "@/components/ui/badge";
 import { Progress } from "@/components/ui/progress";
 import { BookOpen, ClipboardList, BarChart3, Calendar, ArrowRight, Play } from "lucide-react";
 import { Link } from "react-router-dom";
+import { useTranslation } from "react-i18next";
 import { useMyEnrolledCourses, useGrades } from "@/hooks/queries";
 import { useAuth } from "@/contexts/AuthContext";
 import AiStudyCoach from "@/components/ai/AiStudyCoach";
@@ -11,6 +12,7 @@ import AiTipBanner from "@/components/ai/AiTipBanner";
 
 export default function StudentDashboard() {
   const { user } = useAuth();
+  const { t } = useTranslation();
   const { data: enrolledData, isLoading: lc } = useMyEnrolledCourses();
   const { data: gradesData, isLoading: lg } = useGrades();
   const myCourses = enrolledData?.items ?? [];
@@ -22,20 +24,20 @@ export default function StudentDashboard() {
   const avgGrade = gradeRecords.length > 0
     ? Math.round(gradeRecords.reduce((s, g) => s + (g.grade / g.max_grade) * 100, 0) / gradeRecords.length)
     : 0;
-  const firstName = user?.name?.split(" ")[0] || "Student";
+  const firstName = user?.name?.split(" ")[0] || t("dashboard.greetingFallback");
 
   const stats = [
-    { label: "Enrolled Courses", value: String(myCourses.length), icon: BookOpen, color: "text-primary" },
-    { label: "Overall Progress", value: `${avgProgress}%`, icon: ClipboardList, color: "text-warning" },
-    { label: "Average Grade", value: gradeRecords.length > 0 ? `${avgGrade}%` : "N/A", icon: BarChart3, color: "text-success" },
-    { label: "Total Chapters", value: String(myCourses.reduce((s, c) => s + c.chapter_count, 0)), icon: Calendar, color: "text-info" },
+    { label: t("studentDash.enrolledCourses"), value: String(myCourses.length), icon: BookOpen, color: "text-primary" },
+    { label: t("studentDash.overallProgress"), value: `${avgProgress}%`, icon: ClipboardList, color: "text-warning" },
+    { label: t("studentDash.averageGrade"), value: gradeRecords.length > 0 ? `${avgGrade}%` : "N/A", icon: BarChart3, color: "text-success" },
+    { label: t("studentDash.totalChapters"), value: String(myCourses.reduce((s, c) => s + c.chapter_count, 0)), icon: Calendar, color: "text-info" },
   ];
 
   return (
     <div className="space-y-6">
       <div>
-        <h1 className="text-2xl font-bold">Welcome back, {firstName}!</h1>
-        <p className="text-muted-foreground">Here's an overview of your learning progress.</p>
+        <h1 className="text-2xl font-bold">{t("studentDash.welcome", { name: firstName })}</h1>
+        <p className="text-muted-foreground">{t("studentDash.subtitle")}</p>
       </div>
 
       <AiTipBanner context="student-dashboard" variant="tip" />
@@ -46,12 +48,12 @@ export default function StudentDashboard() {
         {stats.map((s) => (
           <Card key={s.label}>
             <CardContent className="pt-6">
-              <div className="flex items-center justify-between">
-                <div>
+              <div className="flex items-center justify-between gap-3">
+                <div className="min-w-0">
                   <p className="text-sm text-muted-foreground">{s.label}</p>
-                  <p className="text-2xl font-bold">{s.value}</p>
+                  <p className="text-2xl font-bold"><bdi>{s.value}</bdi></p>
                 </div>
-                <s.icon className={`h-8 w-8 ${s.color} opacity-80`} />
+                <s.icon className={`h-8 w-8 ${s.color} opacity-80 shrink-0`} />
               </div>
             </CardContent>
           </Card>
@@ -61,22 +63,28 @@ export default function StudentDashboard() {
       <div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
         <Card>
           <CardHeader className="flex flex-row items-center justify-between pb-2">
-            <CardTitle className="text-lg">My Courses</CardTitle>
-            <Button variant="ghost" size="sm" asChild><Link to="/student/courses">View All <ArrowRight className="ml-1 h-3 w-3" /></Link></Button>
+            <CardTitle className="text-lg">{t("studentDash.myCourses")}</CardTitle>
+            <Button variant="ghost" size="sm" asChild>
+              <Link to="/student/courses">
+                {t("common.viewAll")} <ArrowRight className="ms-1 h-3 w-3 rtl:rotate-180" />
+              </Link>
+            </Button>
           </CardHeader>
           <CardContent className="space-y-4">
             {myCourses.length === 0 ? (
-              <p className="text-sm text-muted-foreground text-center py-4">No enrolled courses yet.</p>
+              <p className="text-sm text-muted-foreground text-center py-4">{t("studentDash.noEnrolledCourses")}</p>
             ) : myCourses.map((c) => (
               <Link to={`/student/courses/${c.id}`} key={c.id} className="block">
                 <div className="flex items-center justify-between p-3 rounded-lg border hover:bg-muted/50 transition-colors">
                   <div className="min-w-0">
                     <p className="font-medium text-sm truncate">{c.title || c.name}</p>
-                    <p className="text-xs text-muted-foreground">{c.chapter_count} chapters · {c.total_materials} materials</p>
+                    <p className="text-xs text-muted-foreground">
+                      {t("studentDash.chaptersMaterials", { chapters: c.chapter_count, materials: c.total_materials })}
+                    </p>
                   </div>
                   <div className="flex items-center gap-3 shrink-0">
                     <div className="w-24"><Progress value={c.progress} className="h-2" /></div>
-                    <span className="text-xs font-medium w-8 text-right">{c.progress}%</span>
+                    <span className="text-xs font-medium w-8 text-end"><bdi>{c.progress}%</bdi></span>
                   </div>
                 </div>
               </Link>
@@ -87,35 +95,45 @@ export default function StudentDashboard() {
         <div className="space-y-6">
           <Card>
             <CardHeader className="flex flex-row items-center justify-between pb-2">
-              <CardTitle className="text-lg">Quick Actions</CardTitle>
+              <CardTitle className="text-lg">{t("studentDash.quickActions")}</CardTitle>
             </CardHeader>
             <CardContent className="space-y-3">
               {myCourses.slice(0, 3).map(c => (
                 <Link key={c.id} to={`/student/courses/${c.id}`} className="flex items-center gap-3 p-3 rounded-lg border hover:bg-muted/50 transition-colors">
                   <Play className="h-4 w-4 text-primary shrink-0" />
                   <div className="flex-1 min-w-0">
-                    <p className="text-sm font-medium truncate">{c.progress > 0 ? "Continue" : "Start"} {c.title || c.name}</p>
-                    <p className="text-xs text-muted-foreground">{c.completed_chapters}/{c.chapter_count} chapters done</p>
+                    <p className="text-sm font-medium truncate">
+                      {c.progress > 0 ? t("studentDash.continue") : t("studentDash.start")} {c.title || c.name}
+                    </p>
+                    <p className="text-xs text-muted-foreground">
+                      {t("studentDash.chaptersDone", { done: c.completed_chapters, total: c.chapter_count })}
+                    </p>
                   </div>
-                  <Badge variant="outline">{c.progress}%</Badge>
+                  <Badge variant="outline"><bdi>{c.progress}%</bdi></Badge>
                 </Link>
               ))}
-              {myCourses.length === 0 && <p className="text-sm text-muted-foreground text-center py-4">Enroll in a course to get started.</p>}
+              {myCourses.length === 0 && (
+                <p className="text-sm text-muted-foreground text-center py-4">{t("studentDash.enrollToStart")}</p>
+              )}
             </CardContent>
           </Card>
 
           <Card>
             <CardHeader className="flex flex-row items-center justify-between pb-2">
-              <CardTitle className="text-lg">Recent Grades</CardTitle>
-              <Button variant="ghost" size="sm" asChild><Link to="/student/grades">View All <ArrowRight className="ml-1 h-3 w-3" /></Link></Button>
+              <CardTitle className="text-lg">{t("studentDash.recentGrades")}</CardTitle>
+              <Button variant="ghost" size="sm" asChild>
+                <Link to="/student/grades">
+                  {t("common.viewAll")} <ArrowRight className="ms-1 h-3 w-3 rtl:rotate-180" />
+                </Link>
+              </Button>
             </CardHeader>
             <CardContent className="space-y-3">
               {recentGrades.length === 0 ? (
-                <p className="text-sm text-muted-foreground text-center py-4">No grades yet.</p>
+                <p className="text-sm text-muted-foreground text-center py-4">{t("studentDash.noGradesYet")}</p>
               ) : recentGrades.map((g) => (
-                <div key={g.id} className="flex items-center justify-between p-2 rounded border">
-                  <div><p className="text-sm font-medium">{g.assignment_title}</p><p className="text-xs text-muted-foreground">{g.course_name}</p></div>
-                  <span className="text-sm font-bold text-primary">{g.grade}/{g.max_grade}</span>
+                <div key={g.id} className="flex items-center justify-between p-2 rounded border gap-3">
+                  <div className="min-w-0"><p className="text-sm font-medium truncate" dir="auto">{g.assignment_title}</p><p className="text-xs text-muted-foreground truncate" dir="auto">{g.course_name}</p></div>
+                  <span className="text-sm font-bold text-primary shrink-0"><bdi>{g.grade}/{g.max_grade}</bdi></span>
                 </div>
               ))}
             </CardContent>

frontend/src/pages/student/StudentDiscussionBoard.tsx

@@ -133,7 +133,7 @@ export default function StudentDiscussionBoard() {
         <div className="space-y-4">
           <div className="flex items-center justify-between">
             <Button variant="ghost" onClick={() => setSelectedBoardId(null)}>
-              <ArrowLeft className="mr-2 h-4 w-4" /> Back to Boards
+              <ArrowLeft className="me-2 h-4 w-4 rtl:rotate-180" /> Back to Boards
             </Button>
             <Dialog open={showNewPost} onOpenChange={setShowNewPost}>
               <Button onClick={() => setShowNewPost(true)}><MessageSquare className="mr-2 h-4 w-4" /> New Post</Button>

frontend/src/pages/student/SubjectSelection.tsx

@@ -58,7 +58,7 @@ export default function SubjectSelection() {
                         View Profile
                       </Button>
                       <Button size="sm" className="flex-1" onClick={() => navigate(`/student/plan/${subject.id}`)}>
-                        Learning Plan <ArrowRight className="ml-1 h-3 w-3" />
+                        Learning Plan <ArrowRight className="ms-1 h-3 w-3 rtl:rotate-180" />
                       </Button>
                     </div>
                   </>
@@ -66,7 +66,7 @@ export default function SubjectSelection() {
                   <>
                     <p className="text-sm text-muted-foreground">Take a diagnostic assessment to discover your proficiency level and get a personalized learning plan.</p>
                     <Button className="w-full" onClick={() => navigate(`/student/diagnostic/${subject.id}`)}>
-                      Start Diagnostic <ArrowRight className="ml-1 h-4 w-4" />
+                      Start Diagnostic <ArrowRight className="ms-1 h-4 w-4 rtl:rotate-180" />
                     </Button>
                   </>
                 )}