From 2d4ec221457072fe2d44a330a830a72e904cc5db Mon Sep 17 00:00:00 2001
From: horacioskrp <hervekudayah@gmail.com>
Date: Thu, 12 Nov 2026 04:12:08 +0000
Subject: [PATCH 01/12] =?UTF-8?q?feat(i18n):=20param=C3=A8tres=20=E2=80=94?=
 =?UTF-8?q?=20mati=C3=A8res=20(liste,=20cr=C3=A9ation,=20=C3=A9dition,=20d?=
 =?UTF-8?q?=C3=A9tail)=20(FR/EN)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 lang/en/parametres.php                        | 62 +++++++++++++++++++
 lang/fr/parametres.php                        | 62 +++++++++++++++++++
 .../js/components/Subjects/subject-form.tsx   | 42 +++++++------
 .../js/pages/Parametres/Subjects/Create.tsx   |  8 ++-
 .../js/pages/Parametres/Subjects/Edit.tsx     |  8 ++-
 .../js/pages/Parametres/Subjects/Index.tsx    | 58 ++++++++---------
 .../js/pages/Parametres/Subjects/Show.tsx     | 33 +++++-----
 7 files changed, 204 insertions(+), 69 deletions(-)

diff --git a/lang/en/parametres.php b/lang/en/parametres.php
index c79e6570..61c76954 100644
--- a/lang/en/parametres.php
+++ b/lang/en/parametres.php
@@ -248,4 +248,66 @@
         'mention_label_ph' => 'Label (e.g. Congratulations)',
         'mentions_hint' => 'The honor applied is the one with the highest threshold less than or equal to the average.',
     ],
+
+    'subjects' => [
+        'head' => 'Subjects',
+        'title' => 'Subjects',
+        'subtitle' => 'Manage the subjects taught',
+        'new' => 'New subject',
+        'stat_total' => 'Total subjects',
+        'stat_shown' => 'Results shown',
+        'stat_page' => 'Page',
+        'search_ph' => 'Search a subject by name or code...',
+        'search_results' => 'Results for:',
+        'th_code' => 'Code',
+        'th_name' => 'Name',
+        'th_description' => 'Description',
+        'no_description' => 'No description',
+        'empty' => 'No subject found',
+        'page_showing' => 'Showing',
+        'page_to' => 'to',
+        'page_of' => 'of',
+        'page_unit' => 'subjects',
+        'page_label' => 'Page',
+        'delete_title' => 'Delete subject',
+        'delete_desc' => 'Are you sure you want to delete this subject? This action is irreversible.',
+        'deleting' => 'Deleting...',
+
+        'create_head' => 'Create a subject',
+        'create_title' => 'Create a subject',
+        'create_subtitle' => 'Enter the subject information.',
+        'edit_head' => 'Edit :name',
+        'edit_title' => 'Edit a subject',
+        'edit_subtitle' => 'Update the information for :name.',
+
+        'show_subtitle' => 'Subject detail and tracking.',
+        'info_section' => 'Subject information',
+        'description' => 'Description',
+        'show_no_description' => 'No description provided for this subject.',
+        'history' => 'History',
+        'created_on' => 'Created on',
+        'updated_on' => 'Last updated',
+        'summary' => 'Summary',
+        'summary_before' => 'The subject',
+        'summary_middle' => 'is identified by the code',
+        'summary_stats' => 'Usage statistics will be shown here as soon as they are available.',
+        'edit_this' => 'Edit this subject',
+
+        'form_section' => 'Subject information',
+        'code_label' => 'Code *',
+        'code_ph' => 'e.g. MATH101',
+        'code_hint' => 'Unique code used to identify the subject.',
+        'name_label' => 'Name *',
+        'name_ph' => 'e.g. Mathematics',
+        'parent_label' => 'Parent subject (sub-subject)',
+        'no_parent' => 'None (main subject)',
+        'parent_hint' => 'Attach this subject to a main subject to make it a sub-subject (e.g. "Dictation" under "French").',
+        'description_label' => 'Description',
+        'description_ph' => 'Briefly describe the content and objectives of the subject...',
+        'description_hint' => 'Optional, maximum 1000 characters.',
+        'preview' => 'Preview',
+        'preview_code' => 'CODE',
+        'preview_name' => 'Subject name',
+        'submit_create' => 'Create subject',
+    ],
 ];
diff --git a/lang/fr/parametres.php b/lang/fr/parametres.php
index 521ca92e..c4cf5bc3 100644
--- a/lang/fr/parametres.php
+++ b/lang/fr/parametres.php
@@ -248,4 +248,66 @@
         'mention_label_ph' => 'Libellé (ex : Félicitations)',
         'mentions_hint' => 'La mention retenue est celle dont le seuil est le plus élevé et inférieur ou égal à la moyenne.',
     ],
+
+    'subjects' => [
+        'head' => 'Matières',
+        'title' => 'Matières',
+        'subtitle' => 'Gérez les matières enseignées',
+        'new' => 'Nouvelle matière',
+        'stat_total' => 'Matières totales',
+        'stat_shown' => 'Résultats affichés',
+        'stat_page' => 'Page',
+        'search_ph' => 'Rechercher une matière par nom ou code...',
+        'search_results' => 'Résultats pour :',
+        'th_code' => 'Code',
+        'th_name' => 'Nom',
+        'th_description' => 'Description',
+        'no_description' => 'Aucune description',
+        'empty' => 'Aucune matière trouvée',
+        'page_showing' => 'Affichage',
+        'page_to' => 'à',
+        'page_of' => 'sur',
+        'page_unit' => 'matières',
+        'page_label' => 'Page',
+        'delete_title' => 'Supprimer la matière',
+        'delete_desc' => 'Êtes-vous sûr de vouloir supprimer cette matière ? Cette action est irréversible.',
+        'deleting' => 'Suppression...',
+
+        'create_head' => 'Créer une matière',
+        'create_title' => 'Créer une matière',
+        'create_subtitle' => 'Renseignez les informations de la matière.',
+        'edit_head' => 'Éditer :name',
+        'edit_title' => 'Éditer une matière',
+        'edit_subtitle' => 'Mettez à jour les informations de :name.',
+
+        'show_subtitle' => 'Détail et suivi de la matière.',
+        'info_section' => 'Informations de la matière',
+        'description' => 'Description',
+        'show_no_description' => 'Aucune description renseignée pour cette matière.',
+        'history' => 'Historique',
+        'created_on' => 'Créée le',
+        'updated_on' => 'Dernière modification',
+        'summary' => 'Résumé',
+        'summary_before' => 'La matière',
+        'summary_middle' => 'est identifiée par le code',
+        'summary_stats' => 'Les statistiques d\'utilisation seront affichées ici dès qu\'elles seront disponibles.',
+        'edit_this' => 'Modifier cette matière',
+
+        'form_section' => 'Informations de la matière',
+        'code_label' => 'Code *',
+        'code_ph' => 'Ex: MATH101',
+        'code_hint' => 'Code unique utilisé pour identifier la matière.',
+        'name_label' => 'Nom *',
+        'name_ph' => 'Ex: Mathématiques',
+        'parent_label' => 'Matière parente (sous-matière)',
+        'no_parent' => 'Aucune (matière principale)',
+        'parent_hint' => 'Rattachez cette matière à une matière principale pour en faire une sous-matière (ex. « Dictée » sous « Français »).',
+        'description_label' => 'Description',
+        'description_ph' => 'Décrivez brièvement le contenu et les objectifs de la matière...',
+        'description_hint' => 'Optionnel, maximum 1000 caractères.',
+        'preview' => 'Aperçu',
+        'preview_code' => 'CODE',
+        'preview_name' => 'Nom de la matière',
+        'submit_create' => 'Créer la matière',
+    ],
 ];
diff --git a/resources/js/components/Subjects/subject-form.tsx b/resources/js/components/Subjects/subject-form.tsx
index 13d9279e..868a69e6 100644
--- a/resources/js/components/Subjects/subject-form.tsx
+++ b/resources/js/components/Subjects/subject-form.tsx
@@ -3,6 +3,7 @@ import { Button } from '@/components/ui/button';
 import { Input } from '@/components/ui/input';
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
 import { Textarea } from '@/components/ui/textarea';
+import { useTranslation } from '@/helpers/i18n';
 
 export interface SubjectFormData {
     name: string;
@@ -36,14 +37,15 @@ export function SubjectForm({
     onSubmit,
     setData,
 }: Readonly<SubjectFormProps>) {
-    let submitLabel = 'Mettre à jour';
+    const { t } = useTranslation();
+    let submitLabel = t('parametres.common.update');
 
     if (processing && mode === 'create') {
-        submitLabel = 'Création...';
+        submitLabel = t('parametres.common.creating');
     } else if (processing) {
-        submitLabel = 'Mise à jour...';
+        submitLabel = t('parametres.common.updating');
     } else if (mode === 'create') {
-        submitLabel = 'Créer la matière';
+        submitLabel = t('parametres.subjects.submit_create');
     }
 
     return (
@@ -53,39 +55,39 @@ export function SubjectForm({
                     <div className="w-9 h-9 rounded-full bg-blue-100 flex items-center justify-center">
                         <BookOpen className="w-5 h-5 text-blue-600" />
                     </div>
-                    <h3 className="text-lg font-semibold text-gray-900">Informations de la matière</h3>
+                    <h3 className="text-lg font-semibold text-gray-900">{t('parametres.subjects.form_section')}</h3>
                 </div>
 
                 <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
                     <div>
-                        <label htmlFor="code" className="block text-sm font-medium text-gray-900 mb-2">Code *</label>
+                        <label htmlFor="code" className="block text-sm font-medium text-gray-900 mb-2">{t('parametres.subjects.code_label')}</label>
                         <Input
                             id="code"
                             value={data.code}
                             onChange={(event) => setData('code', event.target.value.toUpperCase())}
                             disabled={processing}
-                            placeholder="Ex: MATH101"
+                            placeholder={t('parametres.subjects.code_ph')}
                             className={errors.code ? 'border-red-500 bg-red-50/40' : 'border-gray-200 bg-white focus-visible:ring-blue-500'}
                         />
-                        <p className="text-xs text-gray-500 mt-1">Code unique utilise pour identifier la matière.</p>
+                        <p className="text-xs text-gray-500 mt-1">{t('parametres.subjects.code_hint')}</p>
                         {errors.code && <p className="text-sm text-red-600 mt-1">{errors.code}</p>}
                     </div>
 
                     <div>
-                        <label htmlFor="name" className="block text-sm font-medium text-gray-900 mb-2">Nom *</label>
+                        <label htmlFor="name" className="block text-sm font-medium text-gray-900 mb-2">{t('parametres.subjects.name_label')}</label>
                         <Input
                             id="name"
                             value={data.name}
                             onChange={(event) => setData('name', event.target.value)}
                             disabled={processing}
-                            placeholder="Ex: Mathématiques"
+                            placeholder={t('parametres.subjects.name_ph')}
                             className={errors.name ? 'border-red-500 bg-red-50/40' : 'border-gray-200 bg-white focus-visible:ring-blue-500'}
                         />
                         {errors.name && <p className="text-sm text-red-600 mt-1">{errors.name}</p>}
                     </div>
 
                     <div className="md:col-span-2">
-                        <label className="block text-sm font-medium text-gray-900 mb-2">Matière parente (sous-matière)</label>
+                        <label className="block text-sm font-medium text-gray-900 mb-2">{t('parametres.subjects.parent_label')}</label>
                         <Select
                             value={data.parent_id || NO_PARENT}
                             onValueChange={(v) => setData('parent_id', v === NO_PARENT ? '' : v)}
@@ -95,26 +97,26 @@ export function SubjectForm({
                                 <SelectValue />
                             </SelectTrigger>
                             <SelectContent>
-                                <SelectItem value={NO_PARENT}>Aucune (matière principale)</SelectItem>
+                                <SelectItem value={NO_PARENT}>{t('parametres.subjects.no_parent')}</SelectItem>
                                 {parents.map((p) => <SelectItem key={p.id} value={p.id}>{p.name}</SelectItem>)}
                             </SelectContent>
                         </Select>
-                        <p className="text-xs text-gray-500 mt-1">Rattachez cette matière à une matière principale pour en faire une sous-matière (ex. « Dictée » sous « Français »).</p>
+                        <p className="text-xs text-gray-500 mt-1">{t('parametres.subjects.parent_hint')}</p>
                     </div>
 
                     <div className="md:col-span-2">
-                        <label htmlFor="description" className="block text-sm font-medium text-gray-900 mb-2">Description</label>
+                        <label htmlFor="description" className="block text-sm font-medium text-gray-900 mb-2">{t('parametres.subjects.description_label')}</label>
                         <Textarea
                             id="description"
                             rows={4}
                             value={data.description}
                             onChange={(event) => setData('description', event.target.value)}
                             disabled={processing}
-                            placeholder="Décrivez brièvement le contenu et les objectifs de la matière..."
+                            placeholder={t('parametres.subjects.description_ph')}
                             className={errors.description ? 'border-red-500 bg-red-50/40' : 'border-gray-200 bg-white focus-visible:ring-blue-500'}
                         />
                         <div className="flex items-center justify-between mt-1">
-                            <p className="text-xs text-gray-500">Optionnel, maximum 1000 caractères.</p>
+                            <p className="text-xs text-gray-500">{t('parametres.subjects.description_hint')}</p>
                             <p className="text-xs text-gray-500">{data.description.length}/1000</p>
                         </div>
                         {errors.description && <p className="text-sm text-red-600 mt-1">{errors.description}</p>}
@@ -127,18 +129,18 @@ export function SubjectForm({
                     <div className="w-9 h-9 rounded-full bg-amber-100 flex items-center justify-center">
                         <Sparkles className="w-5 h-5 text-amber-600" />
                     </div>
-                    <h3 className="text-lg font-semibold text-gray-900">Aperçu</h3>
+                    <h3 className="text-lg font-semibold text-gray-900">{t('parametres.subjects.preview')}</h3>
                 </div>
                 <p className="text-sm text-gray-700">
-                    <span className="font-medium">{data.code || 'CODE'}</span>
+                    <span className="font-medium">{data.code || t('parametres.subjects.preview_code')}</span>
                     {' · '}
-                    <span className="font-medium">{data.name || 'Nom de la matière'}</span>
+                    <span className="font-medium">{data.name || t('parametres.subjects.preview_name')}</span>
                 </p>
             </div>
 
             <div className="flex gap-3 pt-2">
                 <Button type="button" variant="outline" onClick={onCancel} disabled={processing} className="flex-1 border-gray-200 text-gray-700 hover:bg-gray-50">
-                    Annuler
+                    {t('parametres.common.cancel')}
                 </Button>
                 <Button type="submit" disabled={processing} className="flex-1 gap-2 bg-blue-600 hover:bg-blue-700 shadow-sm">
                     <Save className="w-4 h-4" />
diff --git a/resources/js/pages/Parametres/Subjects/Create.tsx b/resources/js/pages/Parametres/Subjects/Create.tsx
index cdb778f5..a031c276 100644
--- a/resources/js/pages/Parametres/Subjects/Create.tsx
+++ b/resources/js/pages/Parametres/Subjects/Create.tsx
@@ -5,6 +5,7 @@ import {
     type SubjectFormData,
 } from '@/components/Subjects/subject-form';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 const initialValues: SubjectFormData = {
@@ -17,6 +18,7 @@ const initialValues: SubjectFormData = {
 interface ParentSubject { id: string; name: string }
 
 export default function Create({ parents = [] }: Readonly<{ parents?: ParentSubject[] }>) {
+    const { t } = useTranslation();
     const { data, setData, post, processing, errors } = useForm<SubjectFormData>(initialValues);
 
     const handleSubmit = (event: React.SubmitEvent<HTMLFormElement>) => {
@@ -26,7 +28,7 @@ export default function Create({ parents = [] }: Readonly<{ parents?: ParentSubj
 
     return (
         <AppLayout>
-            <Head title="Créer une matière" />
+            <Head title={t('parametres.subjects.create_head')} />
 
             <div className="w-full space-y-6">
                 <div className="flex items-center gap-4">
@@ -38,8 +40,8 @@ export default function Create({ parents = [] }: Readonly<{ parents?: ParentSubj
                         <ArrowLeft className="w-5 h-5 text-gray-600" />
                     </button>
                     <div>
-                        <h1 className="text-4xl font-bold tracking-tight text-gray-900">Créer une matière</h1>
-                        <p className="mt-2 text-gray-600">Renseignez les informations de la matière.</p>
+                        <h1 className="text-4xl font-bold tracking-tight text-gray-900">{t('parametres.subjects.create_title')}</h1>
+                        <p className="mt-2 text-gray-600">{t('parametres.subjects.create_subtitle')}</p>
                     </div>
                 </div>
 
diff --git a/resources/js/pages/Parametres/Subjects/Edit.tsx b/resources/js/pages/Parametres/Subjects/Edit.tsx
index 9995f16a..4bb3158d 100644
--- a/resources/js/pages/Parametres/Subjects/Edit.tsx
+++ b/resources/js/pages/Parametres/Subjects/Edit.tsx
@@ -5,6 +5,7 @@ import {
     type SubjectFormData,
 } from '@/components/Subjects/subject-form';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface Subject {
@@ -23,6 +24,7 @@ interface EditProps {
 }
 
 export default function Edit({ subject, parents = [] }: Readonly<EditProps>) {
+    const { t } = useTranslation();
     const { data, setData, put, processing, errors } = useForm<SubjectFormData>({
         name: subject.name,
         code: subject.code,
@@ -37,7 +39,7 @@ export default function Edit({ subject, parents = [] }: Readonly<EditProps>) {
 
     return (
         <AppLayout>
-            <Head title={`Éditer ${subject.name}`} />
+            <Head title={t('parametres.subjects.edit_head', { name: subject.name })} />
 
             <div className="w-full space-y-6">
                 <div className="flex items-center gap-4">
@@ -49,8 +51,8 @@ export default function Edit({ subject, parents = [] }: Readonly<EditProps>) {
                         <ArrowLeft className="w-5 h-5 text-gray-600" />
                     </button>
                     <div>
-                        <h1 className="text-4xl font-bold tracking-tight text-gray-900">Éditer une matière</h1>
-                        <p className="mt-2 text-gray-600">Mettez à jour les informations de {subject.name}.</p>
+                        <h1 className="text-4xl font-bold tracking-tight text-gray-900">{t('parametres.subjects.edit_title')}</h1>
+                        <p className="mt-2 text-gray-600">{t('parametres.subjects.edit_subtitle', { name: subject.name })}</p>
                     </div>
                 </div>
 
diff --git a/resources/js/pages/Parametres/Subjects/Index.tsx b/resources/js/pages/Parametres/Subjects/Index.tsx
index 7a3f7acb..df3ccf68 100644
--- a/resources/js/pages/Parametres/Subjects/Index.tsx
+++ b/resources/js/pages/Parametres/Subjects/Index.tsx
@@ -22,6 +22,7 @@ import {
     TableRow,
 } from '@/components/ui/table';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface Subject {
@@ -51,6 +52,7 @@ interface IndexProps {
 }
 
 export default function Index({ subjects, message, filters }: Readonly<IndexProps>) {
+    const { t } = useTranslation();
     const [deleteConfirm, setDeleteConfirm] = useState<string | null>(null);
     const [isDeleting, setIsDeleting] = useState(false);
     const [searchQuery, setSearchQuery] = useState(filters.search || '');
@@ -85,7 +87,7 @@ export default function Index({ subjects, message, filters }: Readonly<IndexProp
 
     const statsCards = [
         {
-            title: 'Matières totales',
+            title: t('parametres.subjects.stat_total'),
             value: subjects.total,
             icon: BookOpen,
             cardClass: 'bg-linear-to-br from-blue-50/70 to-white ring-1 ring-blue-100',
@@ -93,7 +95,7 @@ export default function Index({ subjects, message, filters }: Readonly<IndexProp
             textColor: 'text-blue-600',
         },
         {
-            title: 'Résultats affichés',
+            title: t('parametres.subjects.stat_shown'),
             value: subjects.data.length,
             icon: CheckCircle2,
             cardClass: 'bg-linear-to-br from-emerald-50/70 to-white ring-1 ring-emerald-100',
@@ -101,7 +103,7 @@ export default function Index({ subjects, message, filters }: Readonly<IndexProp
             textColor: 'text-green-600',
         },
         {
-            title: 'Page',
+            title: t('parametres.subjects.stat_page'),
             value: `${subjects.current_page}/${subjects.last_page}`,
             icon: BookOpen,
             cardClass: 'bg-linear-to-br from-violet-50/70 to-white ring-1 ring-violet-100',
@@ -112,25 +114,25 @@ export default function Index({ subjects, message, filters }: Readonly<IndexProp
 
     return (
         <AppLayout>
-            <Head title="Matières" />
+            <Head title={t('parametres.subjects.head')} />
 
             <div className="w-full space-y-6">
                 {/* Header */}
                 <div className="flex items-start justify-between">
                     <div>
                         <h1 className="text-4xl font-bold tracking-tight text-gray-900 flex items-center gap-3"><BookOpen className="h-7 w-7 text-blue-600 shrink-0" />
-                            Matières
+                            {t('parametres.subjects.title')}
                         </h1>
                         <p className="mt-2 text-lg text-gray-600">
-                            Gérez les matières enseignées
+                            {t('parametres.subjects.subtitle')}
                         </p>
                     </div>
-                    <Button 
+                    <Button
                         onClick={() => router.get(route('subjects.create'))}
                         className="gap-2 bg-blue-600 hover:bg-blue-700"
                     >
                         <Plus className="w-5 h-5" />
-                        Nouvelle matière
+                        {t('parametres.subjects.new')}
                     </Button>
                 </div>
 
@@ -177,7 +179,7 @@ export default function Index({ subjects, message, filters }: Readonly<IndexProp
                                 <Search className="absolute left-3 top-1/2 -translate-y-1/2 w-5 h-5 text-blue-400 group-focus-within:text-blue-600 transition" />
                                 <Input
                                     type="text"
-                                    placeholder="Rechercher une matière par nom ou code..."
+                                    placeholder={t('parametres.subjects.search_ph')}
                                     value={searchQuery}
                                     onChange={(e) => setSearchQuery(e.target.value)}
                                     onKeyDown={(e) => e.key === 'Enter' && handleSearch()}
@@ -197,12 +199,12 @@ export default function Index({ subjects, message, filters }: Readonly<IndexProp
                                 className="bg-blue-600 hover:bg-blue-700 text-white gap-2 shrink-0 transition"
                             >
                                 <Search className="w-4 h-4" />
-                                Rechercher
+                                {t('parametres.common.search')}
                             </Button>
                         </div>
                         {searchQuery && (
                             <p className="text-sm text-gray-500 mt-3">
-                                Résultats pour : <span className="font-semibold text-gray-700">« {searchQuery} »</span>
+                                {t('parametres.subjects.search_results')} <span className="font-semibold text-gray-700">« {searchQuery} »</span>
                             </p>
                         )}
                     </div>
@@ -214,10 +216,10 @@ export default function Index({ subjects, message, filters }: Readonly<IndexProp
                         <Table>
                             <TableHeader className="bg-gray-50">
                                 <TableRow className="border-b border-gray-200">
-                                    <TableHead className="font-semibold text-gray-900">Code</TableHead>
-                                    <TableHead className="font-semibold text-gray-900">Nom</TableHead>
-                                    <TableHead className="font-semibold text-gray-900">Description</TableHead>
-                                    <TableHead className="text-center font-semibold text-gray-900 w-24">Actions</TableHead>
+                                    <TableHead className="font-semibold text-gray-900">{t('parametres.subjects.th_code')}</TableHead>
+                                    <TableHead className="font-semibold text-gray-900">{t('parametres.subjects.th_name')}</TableHead>
+                                    <TableHead className="font-semibold text-gray-900">{t('parametres.subjects.th_description')}</TableHead>
+                                    <TableHead className="text-center font-semibold text-gray-900 w-24">{t('parametres.common.actions')}</TableHead>
                                 </TableRow>
                             </TableHeader>
                             <TableBody>
@@ -229,7 +231,7 @@ export default function Index({ subjects, message, filters }: Readonly<IndexProp
                                         >
                                             <div className="flex flex-col items-center gap-2">
                                                 <BookOpen className="w-12 h-12 text-gray-300" />
-                                                <p className="text-lg">Aucune matière trouvée</p>
+                                                <p className="text-lg">{t('parametres.subjects.empty')}</p>
                                             </div>
                                         </TableCell>
                                     </TableRow>
@@ -248,25 +250,25 @@ export default function Index({ subjects, message, filters }: Readonly<IndexProp
                                                 {subject.description ? (
                                                     <span className="line-clamp-2">{subject.description}</span>
                                                 ) : (
-                                                    <span className="text-gray-400 italic">Aucune description</span>
+                                                    <span className="text-gray-400 italic">{t('parametres.subjects.no_description')}</span>
                                                 )}
                                             </TableCell>
                                             <TableCell className="text-center">
                                                 <div className="flex gap-2 justify-center">
                                                     <IconButton
-                                                        label="Voir"
+                                                        label={t('parametres.common.view')}
                                                         icon={<Eye className="w-4 h-4" />}
                                                         className="border-gray-300 text-gray-700 hover:bg-gray-50 hover:text-gray-900"
                                                         onClick={() => router.visit(route('subjects.show', subject.id))}
                                                     />
                                                     <IconButton
-                                                        label="Modifier"
+                                                        label={t('parametres.common.edit')}
                                                         icon={<Pencil className="w-4 h-4" />}
                                                         className="border-gray-300 text-gray-700 hover:bg-gray-50 hover:text-gray-900"
                                                         onClick={() => router.get(route('subjects.edit', subject.id))}
                                                     />
                                                     <IconButton
-                                                        label="Supprimer"
+                                                        label={t('parametres.common.delete')}
                                                         icon={<Trash2 className="w-4 h-4" />}
                                                         className="border-red-300 text-red-600 hover:bg-red-50 hover:text-red-700"
                                                         onClick={() => setDeleteConfirm(subject.id)}
@@ -286,7 +288,7 @@ export default function Index({ subjects, message, filters }: Readonly<IndexProp
                     <div className="bg-white rounded-2xl shadow-sm ring-1 ring-gray-100 p-4">
                         <div className="flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between">
                             <p className="text-sm text-gray-600">
-                                Affichage <span className="font-semibold">{subjects.from}</span> à <span className="font-semibold">{subjects.to}</span> sur <span className="font-semibold">{subjects.total}</span> matières
+                                {t('parametres.subjects.page_showing')} <span className="font-semibold">{subjects.from}</span> {t('parametres.subjects.page_to')} <span className="font-semibold">{subjects.to}</span> {t('parametres.subjects.page_of')} <span className="font-semibold">{subjects.total}</span> {t('parametres.subjects.page_unit')}
                             </p>
                             <div className="flex items-center gap-2">
                                 <Button
@@ -300,7 +302,7 @@ export default function Index({ subjects, message, filters }: Readonly<IndexProp
                                     className="border-gray-300 text-gray-700 hover:bg-blue-50 hover:text-blue-700 hover:border-blue-300 disabled:opacity-50 disabled:cursor-not-allowed"
                                 >
                                     <ChevronLeft className="w-4 h-4 mr-1" />
-                                    Précédent
+                                    {t('parametres.common.prev')}
                                 </Button>
                                 <div className="flex gap-1">
                                     {Array.from({ length: Math.min(5, subjects.last_page) }, (_, i) => {
@@ -338,12 +340,12 @@ export default function Index({ subjects, message, filters }: Readonly<IndexProp
                                     }, { preserveScroll: true })}
                                     className="border-gray-300 text-gray-700 hover:bg-blue-50 hover:text-blue-700 hover:border-blue-300 disabled:opacity-50 disabled:cursor-not-allowed"
                                 >
-                                    Suivant
+                                    {t('parametres.common.next')}
                                     <ChevronRight className="w-4 h-4 ml-1" />
                                 </Button>
                             </div>
                             <p className="text-sm text-gray-600">
-                                Page <span className="font-semibold">{subjects.current_page}</span> sur <span className="font-semibold">{subjects.last_page}</span>
+                                {t('parametres.subjects.page_label')} <span className="font-semibold">{subjects.current_page}</span> {t('parametres.subjects.page_of')} <span className="font-semibold">{subjects.last_page}</span>
                             </p>
                         </div>
                     </div>
@@ -354,19 +356,19 @@ export default function Index({ subjects, message, filters }: Readonly<IndexProp
             <AlertDialog open={!!deleteConfirm} onOpenChange={() => setDeleteConfirm(null)}>
                 <AlertDialogContent>
                     <AlertDialogHeader>
-                        <AlertDialogTitle>Supprimer la matière</AlertDialogTitle>
+                        <AlertDialogTitle>{t('parametres.subjects.delete_title')}</AlertDialogTitle>
                         <AlertDialogDescription>
-                            Êtes-vous sûr de vouloir supprimer cette matière ? Cette action est irréversible.
+                            {t('parametres.subjects.delete_desc')}
                         </AlertDialogDescription>
                     </AlertDialogHeader>
                     <div className="flex gap-3 justify-end">
-                        <AlertDialogCancel>Annuler</AlertDialogCancel>
+                        <AlertDialogCancel>{t('parametres.common.cancel')}</AlertDialogCancel>
                         <AlertDialogAction
                             onClick={() => deleteConfirm && handleDelete(deleteConfirm)}
                             disabled={isDeleting}
                             className="bg-red-600 hover:bg-red-700"
                         >
-                            {isDeleting ? 'Suppression...' : 'Supprimer'}
+                            {isDeleting ? t('parametres.subjects.deleting') : t('parametres.common.delete')}
                         </AlertDialogAction>
                     </div>
                 </AlertDialogContent>
diff --git a/resources/js/pages/Parametres/Subjects/Show.tsx b/resources/js/pages/Parametres/Subjects/Show.tsx
index 466554d8..43b4393c 100644
--- a/resources/js/pages/Parametres/Subjects/Show.tsx
+++ b/resources/js/pages/Parametres/Subjects/Show.tsx
@@ -2,6 +2,7 @@ import { Head, router } from '@inertiajs/react';
 import { ArrowLeft, BookOpen, Calendar, FileText, Pencil } from 'lucide-react';
 import { Button } from '@/components/ui/button';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface Subject {
@@ -18,8 +19,10 @@ interface ShowProps {
 }
 
 export default function Show({ subject }: Readonly<ShowProps>) {
+    const { t, locale } = useTranslation();
+    const dateLocale = locale === 'en' ? 'en-GB' : 'fr-FR';
     const formatDate = (date: string) => {
-        return new Date(date).toLocaleDateString('fr-FR', {
+        return new Date(date).toLocaleDateString(dateLocale, {
             year: 'numeric',
             month: 'long',
             day: 'numeric',
@@ -48,7 +51,7 @@ export default function Show({ subject }: Readonly<ShowProps>) {
                             </div>
                             <div>
                                 <h1 className="text-4xl font-bold tracking-tight text-gray-900">{subject.name}</h1>
-                                <p className="mt-2 text-gray-600">Détail et suivi de la matière.</p>
+                                <p className="mt-2 text-gray-600">{t('parametres.subjects.show_subtitle')}</p>
                                 <span className="inline-block mt-2 px-3 py-1 bg-blue-100 text-blue-800 text-sm font-medium rounded-full">
                                     {subject.code}
                                 </span>
@@ -60,7 +63,7 @@ export default function Show({ subject }: Readonly<ShowProps>) {
                         className="bg-blue-600 hover:bg-blue-700 gap-2"
                     >
                         <Pencil className="w-4 h-4" />
-                        Modifier
+                        {t('parametres.common.edit')}
                     </Button>
                 </div>
 
@@ -71,15 +74,15 @@ export default function Show({ subject }: Readonly<ShowProps>) {
                                 <div className="w-9 h-9 rounded-full bg-blue-100 flex items-center justify-center">
                                     <BookOpen className="w-5 h-5 text-blue-600" />
                                 </div>
-                                <h2 className="text-lg font-semibold text-gray-900">Informations de la matière</h2>
+                                <h2 className="text-lg font-semibold text-gray-900">{t('parametres.subjects.info_section')}</h2>
                             </div>
                             <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
                                 <div className="rounded-xl bg-white/80 ring-1 ring-blue-100 px-4 py-3">
-                                    <p className="text-xs uppercase tracking-wide text-gray-500">Code</p>
+                                    <p className="text-xs uppercase tracking-wide text-gray-500">{t('parametres.subjects.th_code')}</p>
                                     <p className="font-semibold text-gray-900 mt-1">{subject.code}</p>
                                 </div>
                                 <div className="rounded-xl bg-white/80 ring-1 ring-blue-100 px-4 py-3">
-                                    <p className="text-xs uppercase tracking-wide text-gray-500">Nom</p>
+                                    <p className="text-xs uppercase tracking-wide text-gray-500">{t('parametres.subjects.th_name')}</p>
                                     <p className="font-semibold text-gray-900 mt-1">{subject.name}</p>
                                 </div>
                             </div>
@@ -90,10 +93,10 @@ export default function Show({ subject }: Readonly<ShowProps>) {
                                 <div className="w-9 h-9 rounded-full bg-violet-100 flex items-center justify-center">
                                     <FileText className="w-5 h-5 text-violet-600" />
                                 </div>
-                                <h2 className="text-lg font-semibold text-gray-900">Description</h2>
+                                <h2 className="text-lg font-semibold text-gray-900">{t('parametres.subjects.description')}</h2>
                             </div>
                             <p className="text-gray-700 whitespace-pre-wrap leading-relaxed">
-                                {subject.description || 'Aucune description renseignée pour cette matière.'}
+                                {subject.description || t('parametres.subjects.show_no_description')}
                             </p>
                         </div>
                     </div>
@@ -104,29 +107,29 @@ export default function Show({ subject }: Readonly<ShowProps>) {
                                 <div className="w-9 h-9 rounded-full bg-emerald-100 flex items-center justify-center">
                                     <Calendar className="w-5 h-5 text-emerald-600" />
                                 </div>
-                                <h2 className="text-lg font-semibold text-gray-900">Historique</h2>
+                                <h2 className="text-lg font-semibold text-gray-900">{t('parametres.subjects.history')}</h2>
                             </div>
                             <div className="space-y-3">
                                 <div className="rounded-xl bg-white/80 ring-1 ring-emerald-100 px-4 py-3">
-                                    <p className="text-xs uppercase tracking-wide text-gray-500">Créée le</p>
+                                    <p className="text-xs uppercase tracking-wide text-gray-500">{t('parametres.subjects.created_on')}</p>
                                     <p className="font-semibold text-gray-900 mt-1">{formatDate(subject.created_at)}</p>
                                 </div>
                                 <div className="rounded-xl bg-white/80 ring-1 ring-emerald-100 px-4 py-3">
-                                    <p className="text-xs uppercase tracking-wide text-gray-500">Dernière modification</p>
+                                    <p className="text-xs uppercase tracking-wide text-gray-500">{t('parametres.subjects.updated_on')}</p>
                                     <p className="font-semibold text-gray-900 mt-1">{formatDate(subject.updated_at)}</p>
                                 </div>
                             </div>
                         </div>
 
                         <div className="rounded-2xl p-5 bg-linear-to-br from-amber-50/60 to-white ring-1 ring-amber-100 shadow-sm">
-                            <h2 className="text-lg font-semibold text-gray-900">Résumé</h2>
+                            <h2 className="text-lg font-semibold text-gray-900">{t('parametres.subjects.summary')}</h2>
                             <p className="text-sm text-gray-700 mt-2">
-                                La matière <span className="font-semibold">{subject.name}</span> est identifiée par le code
+                                {t('parametres.subjects.summary_before')} <span className="font-semibold">{subject.name}</span> {t('parametres.subjects.summary_middle')}
                                 {' '}
                                 <span className="font-semibold">{subject.code}</span>.
                             </p>
                             <p className="text-xs text-gray-500 mt-3">
-                                Les statistiques d'utilisation seront affichées ici dès qu'elles seront disponibles.
+                                {t('parametres.subjects.summary_stats')}
                             </p>
                             <Button
                                 type="button"
@@ -134,7 +137,7 @@ export default function Show({ subject }: Readonly<ShowProps>) {
                                 className="mt-4 w-full border-gray-200 text-gray-700 hover:bg-gray-50"
                                 onClick={() => router.get(route('subjects.edit', subject.id))}
                             >
-                                Modifier cette matière
+                                {t('parametres.subjects.edit_this')}
                             </Button>
                         </div>
                     </div>

From b2dcdf55a44c523d6d422b62bf0abc259b04a5c3 Mon Sep 17 00:00:00 2001
From: horacioskrp <hervekudayah@gmail.com>
Date: Thu, 12 Nov 2026 04:16:24 +0000
Subject: [PATCH 02/12] =?UTF-8?q?feat(i18n):=20param=C3=A8tres=20=E2=80=94?=
 =?UTF-8?q?=20cat=C3=A9gories=20de=20frais=20(liste,=20cr=C3=A9ation,=20?=
 =?UTF-8?q?=C3=A9dition,=20d=C3=A9tail)=20(FR/EN)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 lang/en/parametres.php                        | 36 +++++++++++++++
 lang/fr/parametres.php                        | 36 +++++++++++++++
 .../pages/Parametres/FeeCategories/Create.tsx | 22 ++++-----
 .../pages/Parametres/FeeCategories/Edit.tsx   | 22 ++++-----
 .../pages/Parametres/FeeCategories/Index.tsx  | 45 ++++++++++---------
 .../pages/Parametres/FeeCategories/Show.tsx   | 35 ++++++++-------
 6 files changed, 139 insertions(+), 57 deletions(-)

diff --git a/lang/en/parametres.php b/lang/en/parametres.php
index 61c76954..485ddd79 100644
--- a/lang/en/parametres.php
+++ b/lang/en/parametres.php
@@ -310,4 +310,40 @@
         'preview_name' => 'Subject name',
         'submit_create' => 'Create subject',
     ],
+
+    'fee_categories' => [
+        'head' => 'Fee categories',
+        'title' => 'Fee categories',
+        'subtitle' => 'Manage school fee categories',
+        'new' => 'New category',
+        'stat_total' => 'Total categories',
+        'search_ph' => 'Search by name or description...',
+        'th_name' => 'Name',
+        'th_description' => 'Description',
+        'th_created' => 'Created date',
+        'empty' => 'No category found',
+        'delete_title' => 'Delete category',
+        'delete_desc' => 'This action cannot be undone. Are you sure you want to delete this category?',
+        'deleting' => 'Deleting...',
+
+        'create_head' => 'New fee category',
+        'create_title' => 'Create a fee category',
+        'edit_head' => 'Edit fee category',
+        'edit_title' => 'Edit fee category',
+        'identity' => 'Category identity',
+        'name_label' => 'Name *',
+        'name_ph' => 'e.g. Tuition fees, Canteen fees...',
+        'description' => 'Description',
+        'description_ph' => 'Describe this fee category...',
+        'create' => 'Create',
+
+        'show_head' => 'Category: :name',
+        'show_title' => 'Category detail',
+        'name' => 'Name',
+        'created_on' => 'Created on',
+        'show_no_description' => 'No description provided',
+        'updated_on' => 'Last updated',
+        'id' => 'ID',
+        'delete_desc_show' => 'This action cannot be undone. Are you sure you want to delete this fee category?',
+    ],
 ];
diff --git a/lang/fr/parametres.php b/lang/fr/parametres.php
index c4cf5bc3..18dece2f 100644
--- a/lang/fr/parametres.php
+++ b/lang/fr/parametres.php
@@ -310,4 +310,40 @@
         'preview_name' => 'Nom de la matière',
         'submit_create' => 'Créer la matière',
     ],
+
+    'fee_categories' => [
+        'head' => 'Catégories de frais',
+        'title' => 'Catégories de frais',
+        'subtitle' => 'Gérez les catégories de frais scolaires',
+        'new' => 'Nouvelle catégorie',
+        'stat_total' => 'Catégories totales',
+        'search_ph' => 'Rechercher par nom ou description...',
+        'th_name' => 'Nom',
+        'th_description' => 'Description',
+        'th_created' => 'Date de création',
+        'empty' => 'Aucune catégorie trouvée',
+        'delete_title' => 'Supprimer la catégorie',
+        'delete_desc' => 'Cette action ne peut pas être annulée. Êtes-vous sûr de vouloir supprimer cette catégorie ?',
+        'deleting' => 'Suppression...',
+
+        'create_head' => 'Nouvelle catégorie de frais',
+        'create_title' => 'Créer une catégorie de frais',
+        'edit_head' => 'Modifier la catégorie de frais',
+        'edit_title' => 'Modifier la catégorie de frais',
+        'identity' => 'Identité de la catégorie',
+        'name_label' => 'Nom *',
+        'name_ph' => 'Ex: Frais de scolarité, Frais de cantine...',
+        'description' => 'Description',
+        'description_ph' => 'Décrivez cette catégorie de frais...',
+        'create' => 'Créer',
+
+        'show_head' => 'Catégorie : :name',
+        'show_title' => 'Détail de la catégorie',
+        'name' => 'Nom',
+        'created_on' => 'Créée le',
+        'show_no_description' => 'Aucune description fournie',
+        'updated_on' => 'Dernière modification',
+        'id' => 'ID',
+        'delete_desc_show' => 'Cette action ne peut pas être annulée. Êtes-vous sûr de vouloir supprimer cette catégorie de frais ?',
+    ],
 ];
diff --git a/resources/js/pages/Parametres/FeeCategories/Create.tsx b/resources/js/pages/Parametres/FeeCategories/Create.tsx
index fc0209a4..58230d51 100644
--- a/resources/js/pages/Parametres/FeeCategories/Create.tsx
+++ b/resources/js/pages/Parametres/FeeCategories/Create.tsx
@@ -4,9 +4,11 @@ import { useState } from 'react';
 import { Button } from '@/components/ui/button';
 import { Input } from '@/components/ui/input';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 export default function Create() {
+    const { t } = useTranslation();
     const [formData, setFormData] = useState({
         name: '',
         description: '',
@@ -30,7 +32,7 @@ export default function Create() {
 
     return (
         <AppLayout>
-            <Head title="Nouvelle catégorie de frais" />
+            <Head title={t('parametres.fee_categories.create_head')} />
 
             <div className="space-y-6">
                 <div className="flex items-center gap-4">
@@ -42,7 +44,7 @@ export default function Create() {
                         <ArrowLeft className="w-5 h-5 text-gray-600" />
                     </button>
                     <div>
-                        <h1 className="text-3xl font-bold text-gray-900">Créer une catégorie de frais</h1>
+                        <h1 className="text-3xl font-bold text-gray-900">{t('parametres.fee_categories.create_title')}</h1>
                     </div>
                 </div>
 
@@ -51,11 +53,11 @@ export default function Create() {
                         <div className="rounded-2xl bg-linear-to-br from-amber-50 to-white ring-1 ring-amber-100 p-6 shadow-sm space-y-4">
                             <div className="flex items-center gap-2 text-amber-700">
                                 <Tag className="h-4 w-4" />
-                                <p className="text-sm font-semibold">Identité de la catégorie</p>
+                                <p className="text-sm font-semibold">{t('parametres.fee_categories.identity')}</p>
                             </div>
                             <div>
                                 <label htmlFor="name" className="block text-sm font-medium text-gray-900 mb-2">
-                                    Nom *
+                                    {t('parametres.fee_categories.name_label')}
                                 </label>
                                 <Input
                                     id="name"
@@ -63,7 +65,7 @@ export default function Create() {
                                     value={formData.name}
                                     onChange={(event) => setFormData((prev) => ({ ...prev, name: event.target.value }))}
                                     className={`${errors.name ? 'border-red-500 bg-white/90' : 'border-slate-200 bg-white/90'}`}
-                                    placeholder="Ex: Frais de scolarité, Frais de cantine..."
+                                    placeholder={t('parametres.fee_categories.name_ph')}
                                 />
                                 {errors.name && <p className="text-red-600 text-sm mt-1">{errors.name}</p>}
                             </div>
@@ -72,11 +74,11 @@ export default function Create() {
                         <div className="rounded-2xl bg-linear-to-br from-cyan-50 to-white ring-1 ring-cyan-100 p-6 shadow-sm space-y-4">
                             <div className="flex items-center gap-2 text-cyan-700">
                                 <FileText className="h-4 w-4" />
-                                <p className="text-sm font-semibold">Description</p>
+                                <p className="text-sm font-semibold">{t('parametres.fee_categories.description')}</p>
                             </div>
                             <div>
                                 <label htmlFor="description" className="block text-sm font-medium text-gray-900 mb-2">
-                                    Description
+                                    {t('parametres.fee_categories.description')}
                                 </label>
                                 <textarea
                                     id="description"
@@ -85,7 +87,7 @@ export default function Create() {
                                     className={`w-full px-3 py-2 rounded-lg bg-white/90 focus:outline-none focus:ring-2 focus:ring-cyan-500 ${
                                         errors.description ? 'border border-red-500' : 'border border-slate-200'
                                     }`}
-                                    placeholder="Décrivez cette catégorie de frais..."
+                                    placeholder={t('parametres.fee_categories.description_ph')}
                                     rows={4}
                                 />
                                 {errors.description && <p className="text-red-600 text-sm mt-1">{errors.description}</p>}
@@ -95,7 +97,7 @@ export default function Create() {
 
                     <div className="flex gap-3">
                         <Button type="submit" disabled={isSubmitting} className="bg-blue-600 hover:bg-blue-700">
-                            {isSubmitting ? 'Création...' : 'Créer'}
+                            {isSubmitting ? t('parametres.common.creating') : t('parametres.fee_categories.create')}
                         </Button>
                         <Button
                             type="button"
@@ -103,7 +105,7 @@ export default function Create() {
                             className="border-slate-200 text-gray-700"
                             onClick={() => router.get(route('fee-categories.index'))}
                         >
-                            Annuler
+                            {t('parametres.common.cancel')}
                         </Button>
                     </div>
                 </form>
diff --git a/resources/js/pages/Parametres/FeeCategories/Edit.tsx b/resources/js/pages/Parametres/FeeCategories/Edit.tsx
index 20a9ae9c..7f2f45a5 100644
--- a/resources/js/pages/Parametres/FeeCategories/Edit.tsx
+++ b/resources/js/pages/Parametres/FeeCategories/Edit.tsx
@@ -4,6 +4,7 @@ import { useState } from 'react';
 import { Button } from '@/components/ui/button';
 import { Input } from '@/components/ui/input';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface FeeCategorie {
@@ -17,6 +18,7 @@ interface EditProps {
 }
 
 export default function Edit({ feeCategorie }: Readonly<EditProps>) {
+    const { t } = useTranslation();
     const [formData, setFormData] = useState({
         name: feeCategorie.name,
         description: feeCategorie.description || '',
@@ -40,7 +42,7 @@ export default function Edit({ feeCategorie }: Readonly<EditProps>) {
 
     return (
         <AppLayout>
-            <Head title="Modifier la catégorie de frais" />
+            <Head title={t('parametres.fee_categories.edit_head')} />
 
             <div className="space-y-6">
                 <div className="flex items-center gap-4">
@@ -52,7 +54,7 @@ export default function Edit({ feeCategorie }: Readonly<EditProps>) {
                         <ArrowLeft className="w-5 h-5 text-gray-600" />
                     </button>
                     <div>
-                        <h1 className="text-3xl font-bold text-gray-900">Modifier la catégorie de frais</h1>
+                        <h1 className="text-3xl font-bold text-gray-900">{t('parametres.fee_categories.edit_title')}</h1>
                     </div>
                 </div>
 
@@ -61,11 +63,11 @@ export default function Edit({ feeCategorie }: Readonly<EditProps>) {
                         <div className="rounded-2xl bg-linear-to-br from-amber-50 to-white ring-1 ring-amber-100 p-6 shadow-sm space-y-4">
                             <div className="flex items-center gap-2 text-amber-700">
                                 <Tag className="h-4 w-4" />
-                                <p className="text-sm font-semibold">Identité de la catégorie</p>
+                                <p className="text-sm font-semibold">{t('parametres.fee_categories.identity')}</p>
                             </div>
                             <div>
                                 <label htmlFor="name" className="block text-sm font-medium text-gray-900 mb-2">
-                                    Nom *
+                                    {t('parametres.fee_categories.name_label')}
                                 </label>
                                 <Input
                                     id="name"
@@ -73,7 +75,7 @@ export default function Edit({ feeCategorie }: Readonly<EditProps>) {
                                     value={formData.name}
                                     onChange={(event) => setFormData((prev) => ({ ...prev, name: event.target.value }))}
                                     className={`${errors.name ? 'border-red-500 bg-white/90' : 'border-slate-200 bg-white/90'}`}
-                                    placeholder="Ex: Frais de scolarité, Frais de cantine..."
+                                    placeholder={t('parametres.fee_categories.name_ph')}
                                 />
                                 {errors.name && <p className="text-red-600 text-sm mt-1">{errors.name}</p>}
                             </div>
@@ -82,11 +84,11 @@ export default function Edit({ feeCategorie }: Readonly<EditProps>) {
                         <div className="rounded-2xl bg-linear-to-br from-cyan-50 to-white ring-1 ring-cyan-100 p-6 shadow-sm space-y-4">
                             <div className="flex items-center gap-2 text-cyan-700">
                                 <FileText className="h-4 w-4" />
-                                <p className="text-sm font-semibold">Description</p>
+                                <p className="text-sm font-semibold">{t('parametres.fee_categories.description')}</p>
                             </div>
                             <div>
                                 <label htmlFor="description" className="block text-sm font-medium text-gray-900 mb-2">
-                                    Description
+                                    {t('parametres.fee_categories.description')}
                                 </label>
                                 <textarea
                                     id="description"
@@ -95,7 +97,7 @@ export default function Edit({ feeCategorie }: Readonly<EditProps>) {
                                     className={`w-full px-3 py-2 rounded-lg bg-white/90 focus:outline-none focus:ring-2 focus:ring-cyan-500 ${
                                         errors.description ? 'border border-red-500' : 'border border-slate-200'
                                     }`}
-                                    placeholder="Décrivez cette catégorie de frais..."
+                                    placeholder={t('parametres.fee_categories.description_ph')}
                                     rows={4}
                                 />
                                 {errors.description && <p className="text-red-600 text-sm mt-1">{errors.description}</p>}
@@ -105,7 +107,7 @@ export default function Edit({ feeCategorie }: Readonly<EditProps>) {
 
                     <div className="flex gap-3">
                         <Button type="submit" disabled={isSubmitting} className="bg-blue-600 hover:bg-blue-700">
-                            {isSubmitting ? 'Mise à jour...' : 'Mettre à jour'}
+                            {isSubmitting ? t('parametres.common.updating') : t('parametres.common.update')}
                         </Button>
                         <Button
                             type="button"
@@ -113,7 +115,7 @@ export default function Edit({ feeCategorie }: Readonly<EditProps>) {
                             className="border-slate-200 text-gray-700"
                             onClick={() => router.get(route('fee-categories.index'))}
                         >
-                            Annuler
+                            {t('parametres.common.cancel')}
                         </Button>
                     </div>
                 </form>
diff --git a/resources/js/pages/Parametres/FeeCategories/Index.tsx b/resources/js/pages/Parametres/FeeCategories/Index.tsx
index 7b37298f..a9836420 100644
--- a/resources/js/pages/Parametres/FeeCategories/Index.tsx
+++ b/resources/js/pages/Parametres/FeeCategories/Index.tsx
@@ -22,6 +22,7 @@ import {
     TableRow,
 } from '@/components/ui/table';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface FeeCategorie {
@@ -50,6 +51,8 @@ interface IndexProps {
 }
 
 export default function Index({ feeCategories, message, filters }: Readonly<IndexProps>) {
+    const { t, locale } = useTranslation();
+    const dateLocale = locale === 'en' ? 'en-GB' : 'fr-FR';
     const [deleteConfirm, setDeleteConfirm] = useState<string | null>(null);
     const [isDeleting, setIsDeleting] = useState(false);
     const [searchQuery, setSearchQuery] = useState(filters.search || '');
@@ -90,25 +93,25 @@ export default function Index({ feeCategories, message, filters }: Readonly<Inde
 
     return (
         <AppLayout>
-            <Head title="Catégories de frais" />
+            <Head title={t('parametres.fee_categories.head')} />
 
             <div className="space-y-6">
                 {/* Header avec titre et bouton */}
                 <div className="flex items-start justify-between">
                     <div>
                         <h1 className="text-4xl font-bold tracking-tight text-gray-900 flex items-center gap-3"><Percent className="h-7 w-7 text-blue-600 shrink-0" />
-                            Catégories de frais
+                            {t('parametres.fee_categories.title')}
                         </h1>
                         <p className="mt-2 text-lg text-gray-600">
-                            Gérez les catégories de frais scolaires
+                            {t('parametres.fee_categories.subtitle')}
                         </p>
                     </div>
-                    <Button 
+                    <Button
                         onClick={() => router.get(route('fee-categories.create'))}
                         className="gap-2 bg-blue-600 hover:bg-blue-700"
                     >
                         <Plus className="w-5 h-5" />
-                        Nouvelle catégorie
+                        {t('parametres.fee_categories.new')}
                     </Button>
                 </div>
 
@@ -116,7 +119,7 @@ export default function Index({ feeCategories, message, filters }: Readonly<Inde
                 <div className="bg-linear-to-r from-blue-50 to-cyan-50 rounded-2xl p-6 ring-1 ring-blue-100 shadow-sm">
                     <div className="flex items-center justify-between">
                         <div>
-                            <p className="text-sm font-medium text-gray-600">Catégories totales</p>
+                            <p className="text-sm font-medium text-gray-600">{t('parametres.fee_categories.stat_total')}</p>
                             <p className="text-3xl font-bold text-gray-900 mt-2">{feeCategories.total}</p>
                         </div>
                         <Tag className="w-12 h-12 text-blue-600 opacity-20" />
@@ -129,7 +132,7 @@ export default function Index({ feeCategories, message, filters }: Readonly<Inde
                         <div className="flex-1 relative">
                             <Search className="absolute left-3 top-3 w-5 h-5 text-gray-400" />
                             <Input
-                                placeholder="Rechercher par nom ou description..."
+                                placeholder={t('parametres.fee_categories.search_ph')}
                                 className="pl-10 border-slate-200 focus:border-blue-500"
                                 value={searchQuery}
                                 onChange={(e) => setSearchQuery(e.target.value)}
@@ -166,10 +169,10 @@ export default function Index({ feeCategories, message, filters }: Readonly<Inde
                     <Table>
                         <TableHeader className="bg-gray-50 border-b border-slate-200">
                             <TableRow>
-                                <TableHead className="text-gray-700 font-semibold">Nom</TableHead>
-                                <TableHead className="text-gray-700 font-semibold">Description</TableHead>
-                                <TableHead className="text-gray-700 font-semibold">Date de création</TableHead>
-                                <TableHead className="text-gray-700 font-semibold text-right">Actions</TableHead>
+                                <TableHead className="text-gray-700 font-semibold">{t('parametres.fee_categories.th_name')}</TableHead>
+                                <TableHead className="text-gray-700 font-semibold">{t('parametres.fee_categories.th_description')}</TableHead>
+                                <TableHead className="text-gray-700 font-semibold">{t('parametres.fee_categories.th_created')}</TableHead>
+                                <TableHead className="text-gray-700 font-semibold text-right">{t('parametres.common.actions')}</TableHead>
                             </TableRow>
                         </TableHeader>
                         <TableBody>
@@ -181,24 +184,24 @@ export default function Index({ feeCategories, message, filters }: Readonly<Inde
                                             {category.description || '-'}
                                         </TableCell>
                                         <TableCell className="text-gray-600">
-                                            {new Date(category.created_at).toLocaleDateString('fr-FR')}
+                                            {new Date(category.created_at).toLocaleDateString(dateLocale)}
                                         </TableCell>
                                         <TableCell className="text-right">
                                             <div className="flex justify-end gap-2">
                                                 <IconButton
-                                                    label="Voir"
+                                                    label={t('parametres.common.view')}
                                                     icon={<Eye className="w-4 h-4" />}
                                                     className="border-slate-200 text-gray-700 hover:bg-gray-100"
                                                     onClick={() => router.get(route('fee-categories.show', category.id))}
                                                 />
                                                 <IconButton
-                                                    label="Modifier"
+                                                    label={t('parametres.common.edit')}
                                                     icon={<Pencil className="w-4 h-4" />}
                                                     className="border-slate-200 text-gray-700 hover:bg-gray-100"
                                                     onClick={() => router.get(route('fee-categories.edit', category.id))}
                                                 />
                                                 <IconButton
-                                                    label="Supprimer"
+                                                    label={t('parametres.common.delete')}
                                                     icon={<Trash2 className="w-4 h-4" />}
                                                     className="border-slate-200 text-gray-700 hover:bg-red-50 hover:text-red-600"
                                                     onClick={() => setDeleteConfirm(category.id)}
@@ -210,7 +213,7 @@ export default function Index({ feeCategories, message, filters }: Readonly<Inde
                             ) : (
                                 <TableRow>
                                     <TableCell colSpan={4} className="text-center py-8">
-                                        <p className="text-gray-600 font-medium">Aucune catégorie trouvée</p>
+                                        <p className="text-gray-600 font-medium">{t('parametres.fee_categories.empty')}</p>
                                     </TableCell>
                                 </TableRow>
                             )}
@@ -222,7 +225,7 @@ export default function Index({ feeCategories, message, filters }: Readonly<Inde
                 {feeCategories.last_page > 1 && (
                     <div className="flex items-center justify-between">
                         <p className="text-sm text-gray-600">
-                            Affichage {feeCategories.from} à {feeCategories.to} sur {feeCategories.total}
+                            {t('parametres.common.showing', { from: feeCategories.from, to: feeCategories.to, total: feeCategories.total })}
                         </p>
                         <div className="flex gap-2">
                             <Button
@@ -257,19 +260,19 @@ export default function Index({ feeCategories, message, filters }: Readonly<Inde
                 <AlertDialog open={!!deleteConfirm} onOpenChange={(open) => !open && setDeleteConfirm(null)}>
                     <AlertDialogContent>
                         <AlertDialogHeader>
-                            <AlertDialogTitle>Supprimer la catégorie</AlertDialogTitle>
+                            <AlertDialogTitle>{t('parametres.fee_categories.delete_title')}</AlertDialogTitle>
                             <AlertDialogDescription>
-                                Cette action ne peut pas être annulée. Êtes-vous sûr de vouloir supprimer cette catégorie?
+                                {t('parametres.fee_categories.delete_desc')}
                             </AlertDialogDescription>
                         </AlertDialogHeader>
                         <div className="flex justify-end gap-3">
-                            <AlertDialogCancel className="border-slate-200">Annuler</AlertDialogCancel>
+                            <AlertDialogCancel className="border-slate-200">{t('parametres.common.cancel')}</AlertDialogCancel>
                             <AlertDialogAction
                                 onClick={() => deleteConfirm && handleDelete(deleteConfirm)}
                                 disabled={isDeleting}
                                 className="bg-red-600 hover:bg-red-700"
                             >
-                                {isDeleting ? 'Suppression...' : 'Supprimer'}
+                                {isDeleting ? t('parametres.fee_categories.deleting') : t('parametres.common.delete')}
                             </AlertDialogAction>
                         </div>
                     </AlertDialogContent>
diff --git a/resources/js/pages/Parametres/FeeCategories/Show.tsx b/resources/js/pages/Parametres/FeeCategories/Show.tsx
index bafcf005..1532c9c7 100644
--- a/resources/js/pages/Parametres/FeeCategories/Show.tsx
+++ b/resources/js/pages/Parametres/FeeCategories/Show.tsx
@@ -12,6 +12,7 @@ import {
 } from '@/components/ui/alert-dialog';
 import { Button } from '@/components/ui/button';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface FeeCategorie {
@@ -27,6 +28,8 @@ interface ShowProps {
 }
 
 export default function Show({ feeCategorie }: Readonly<ShowProps>) {
+    const { t, locale } = useTranslation();
+    const dateLocale = locale === 'en' ? 'en-GB' : 'fr-FR';
     const [deleteConfirm, setDeleteConfirm] = useState(false);
     const [isDeleting, setIsDeleting] = useState(false);
 
@@ -45,7 +48,7 @@ export default function Show({ feeCategorie }: Readonly<ShowProps>) {
 
     return (
         <AppLayout>
-            <Head title={`Catégorie: ${feeCategorie.name}`} />
+            <Head title={t('parametres.fee_categories.show_head', { name: feeCategorie.name })} />
 
             <div className="space-y-6">
                 <div className="flex items-center justify-between">
@@ -58,7 +61,7 @@ export default function Show({ feeCategorie }: Readonly<ShowProps>) {
                             <ArrowLeft className="w-5 h-5 text-gray-600" />
                         </button>
                         <div>
-                            <h1 className="text-3xl font-bold text-gray-900">Détail de la catégorie</h1>
+                            <h1 className="text-3xl font-bold text-gray-900">{t('parametres.fee_categories.show_title')}</h1>
                         </div>
                     </div>
                     <div className="flex gap-3">
@@ -67,7 +70,7 @@ export default function Show({ feeCategorie }: Readonly<ShowProps>) {
                             className="gap-2 bg-blue-600 hover:bg-blue-700"
                         >
                             <Pencil className="w-4 h-4" />
-                            Modifier
+                            {t('parametres.common.edit')}
                         </Button>
                         <Button
                             onClick={() => setDeleteConfirm(true)}
@@ -75,7 +78,7 @@ export default function Show({ feeCategorie }: Readonly<ShowProps>) {
                             className="gap-2 border-red-300 text-red-600 hover:bg-red-50"
                         >
                             <Trash2 className="w-4 h-4" />
-                            Supprimer
+                            {t('parametres.common.delete')}
                         </Button>
                     </div>
                 </div>
@@ -84,13 +87,13 @@ export default function Show({ feeCategorie }: Readonly<ShowProps>) {
                     {/* Informations principales */}
                     <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
                         <div className="rounded-xl bg-white/80 ring-1 ring-amber-100 p-4">
-                            <div className="text-sm font-medium text-amber-700 mb-2 flex items-center gap-2"><Tag className="h-4 w-4" />Nom</div>
+                            <div className="text-sm font-medium text-amber-700 mb-2 flex items-center gap-2"><Tag className="h-4 w-4" />{t('parametres.fee_categories.name')}</div>
                             <p className="text-lg font-semibold text-gray-900">{feeCategorie.name}</p>
                         </div>
                         <div className="rounded-xl bg-white/80 ring-1 ring-amber-100 p-4">
-                            <div className="text-sm font-medium text-amber-700 mb-2 flex items-center gap-2"><CalendarDays className="h-4 w-4" />Créée le</div>
+                            <div className="text-sm font-medium text-amber-700 mb-2 flex items-center gap-2"><CalendarDays className="h-4 w-4" />{t('parametres.fee_categories.created_on')}</div>
                             <p className="text-lg font-semibold text-gray-900">
-                                {new Date(feeCategorie.created_at).toLocaleDateString('fr-FR', {
+                                {new Date(feeCategorie.created_at).toLocaleDateString(dateLocale, {
                                     year: 'numeric',
                                     month: 'long',
                                     day: 'numeric',
@@ -103,9 +106,9 @@ export default function Show({ feeCategorie }: Readonly<ShowProps>) {
 
                     {/* Description */}
                     <div className="rounded-xl bg-white/80 ring-1 ring-cyan-100 p-4">
-                        <div className="text-sm font-medium text-cyan-700 mb-2 flex items-center gap-2"><FileText className="h-4 w-4" />Description</div>
+                        <div className="text-sm font-medium text-cyan-700 mb-2 flex items-center gap-2"><FileText className="h-4 w-4" />{t('parametres.fee_categories.description')}</div>
                         <p className="text-gray-900 whitespace-pre-wrap bg-white rounded p-4 border border-slate-200">
-                            {feeCategorie.description || 'Aucune description fournie'}
+                            {feeCategorie.description || t('parametres.fee_categories.show_no_description')}
                         </p>
                     </div>
 
@@ -113,9 +116,9 @@ export default function Show({ feeCategorie }: Readonly<ShowProps>) {
                     <div className="pt-4 border-t border-slate-200">
                         <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
                             <div>
-                                <div className="block text-sm font-medium text-gray-600 mb-2">Dernière modification</div>
+                                <div className="block text-sm font-medium text-gray-600 mb-2">{t('parametres.fee_categories.updated_on')}</div>
                                 <p className="text-sm text-gray-900">
-                                    {new Date(feeCategorie.updated_at).toLocaleDateString('fr-FR', {
+                                    {new Date(feeCategorie.updated_at).toLocaleDateString(dateLocale, {
                                         year: 'numeric',
                                         month: 'long',
                                         day: 'numeric',
@@ -125,7 +128,7 @@ export default function Show({ feeCategorie }: Readonly<ShowProps>) {
                                 </p>
                             </div>
                             <div>
-                                <div className="block text-sm font-medium text-gray-600 mb-2">ID</div>
+                                <div className="block text-sm font-medium text-gray-600 mb-2">{t('parametres.fee_categories.id')}</div>
                                 <p className="text-sm text-gray-600 font-mono">{feeCategorie.id}</p>
                             </div>
                         </div>
@@ -136,19 +139,19 @@ export default function Show({ feeCategorie }: Readonly<ShowProps>) {
                 <AlertDialog open={deleteConfirm} onOpenChange={setDeleteConfirm}>
                     <AlertDialogContent>
                         <AlertDialogHeader>
-                            <AlertDialogTitle>Supprimer la catégorie</AlertDialogTitle>
+                            <AlertDialogTitle>{t('parametres.fee_categories.delete_title')}</AlertDialogTitle>
                             <AlertDialogDescription>
-                                Cette action ne peut pas être annulée. Êtes-vous sûr de vouloir supprimer cette catégorie de frais?
+                                {t('parametres.fee_categories.delete_desc_show')}
                             </AlertDialogDescription>
                         </AlertDialogHeader>
                         <div className="flex justify-end gap-3">
-                            <AlertDialogCancel className="border-slate-200">Annuler</AlertDialogCancel>
+                            <AlertDialogCancel className="border-slate-200">{t('parametres.common.cancel')}</AlertDialogCancel>
                             <AlertDialogAction
                                 onClick={handleDelete}
                                 disabled={isDeleting}
                                 className="bg-red-600 hover:bg-red-700"
                             >
-                                {isDeleting ? 'Suppression...' : 'Supprimer'}
+                                {isDeleting ? t('parametres.fee_categories.deleting') : t('parametres.common.delete')}
                             </AlertDialogAction>
                         </div>
                     </AlertDialogContent>

From 6767cab2e49751d8c94090ec2aeab42fa4129d1d Mon Sep 17 00:00:00 2001
From: horacioskrp <hervekudayah@gmail.com>
Date: Thu, 12 Nov 2026 04:21:38 +0000
Subject: [PATCH 03/12] =?UTF-8?q?feat(i18n):=20param=C3=A8tres=20=E2=80=94?=
 =?UTF-8?q?=20types=20de=20classes=20(liste,=20cr=C3=A9ation,=20=C3=A9diti?=
 =?UTF-8?q?on,=20d=C3=A9tail)=20(FR/EN)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 lang/en/parametres.php                        | 67 +++++++++++++++++++
 lang/fr/parametres.php                        | 67 +++++++++++++++++++
 .../ClassroomTypes/classroom-type-form.tsx    | 34 +++++-----
 .../Parametres/ClassroomTypes/Create.tsx      |  8 ++-
 .../pages/Parametres/ClassroomTypes/Edit.tsx  |  8 ++-
 .../pages/Parametres/ClassroomTypes/Index.tsx | 61 ++++++++---------
 .../pages/Parametres/ClassroomTypes/Show.tsx  | 41 ++++++------
 7 files changed, 215 insertions(+), 71 deletions(-)

diff --git a/lang/en/parametres.php b/lang/en/parametres.php
index 485ddd79..284be257 100644
--- a/lang/en/parametres.php
+++ b/lang/en/parametres.php
@@ -346,4 +346,71 @@
         'id' => 'ID',
         'delete_desc_show' => 'This action cannot be undone. Are you sure you want to delete this fee category?',
     ],
+
+    'classroom_types' => [
+        'head' => 'Class types',
+        'title' => 'Class types',
+        'subtitle' => 'Manage the available class types',
+        'new' => 'New type',
+        'stat_total' => 'Total types',
+        'stat_active' => 'Active types',
+        'stat_page' => 'Page',
+        'search_ph' => 'Search a type...',
+        'reset' => 'Reset',
+        'th_name' => 'Name',
+        'th_description' => 'Description',
+        'th_status' => 'Status',
+        'empty' => 'No type found',
+        'active' => '✓ Active',
+        'inactive' => 'Inactive',
+        'page_showing_before' => 'Showing',
+        'page_showing_to' => 'to',
+        'page_showing_on' => 'of',
+        'page_unit' => 'types',
+        'page_label' => 'Page',
+        'page_of' => 'of',
+        'delete_title' => 'Delete type',
+        'delete_desc' => 'Are you sure you want to delete this class type? This action is irreversible.',
+        'deleting' => 'Deleting...',
+
+        'create_head' => 'New class type',
+        'create_title' => 'Create a class type',
+        'create_subtitle' => 'Enter the type information.',
+        'edit_head' => 'Edit :name',
+        'edit_title' => 'Edit a class type',
+        'edit_subtitle' => 'Update the information for :name.',
+
+        'show_status' => 'Status',
+        'show_active' => '✓ Active',
+        'show_inactive' => 'Inactive',
+        'linked_classrooms' => 'Linked classrooms',
+        'created_on' => 'Created on',
+        'updated_on' => 'Last updated',
+        'classes_using' => 'Classrooms using this type',
+        'classes_using_sub' => 'Showing all classrooms assigned to this type',
+        'no_classroom' => 'No classroom uses this type yet',
+        'create_classroom' => 'Create a classroom',
+        'cr_name' => 'Name',
+        'cr_code' => 'Code',
+        'cr_capacity' => 'Capacity',
+        'cr_status' => 'Status',
+        'cr_action' => 'Action',
+        'cr_places' => ':n seats',
+        'cr_active' => '✓ Active',
+        'cr_inactive' => 'Inactive',
+        'cr_view' => 'View',
+
+        'form_section' => 'Type information',
+        'name_label' => 'Name *',
+        'name_ph' => 'e.g. General class',
+        'description_label' => 'Description',
+        'description_ph' => 'Class type description...',
+        'period_label' => 'Period system *',
+        'period_trimestre' => 'Trimester (3 periods)',
+        'period_semestre' => 'Semester (2 periods)',
+        'period_hint' => 'Determines how the year is split (report cards, assessments) for this class type.',
+        'status_section' => 'Status',
+        'active_label' => 'Active type',
+        'submit_create' => 'Create type',
+    ],
 ];
diff --git a/lang/fr/parametres.php b/lang/fr/parametres.php
index 18dece2f..e1f37ae8 100644
--- a/lang/fr/parametres.php
+++ b/lang/fr/parametres.php
@@ -346,4 +346,71 @@
         'id' => 'ID',
         'delete_desc_show' => 'Cette action ne peut pas être annulée. Êtes-vous sûr de vouloir supprimer cette catégorie de frais ?',
     ],
+
+    'classroom_types' => [
+        'head' => 'Types de classes',
+        'title' => 'Types de classes',
+        'subtitle' => 'Gérez les types de classes disponibles',
+        'new' => 'Nouveau type',
+        'stat_total' => 'Total des types',
+        'stat_active' => 'Types actifs',
+        'stat_page' => 'Page',
+        'search_ph' => 'Rechercher un type...',
+        'reset' => 'Réinitialiser',
+        'th_name' => 'Nom',
+        'th_description' => 'Description',
+        'th_status' => 'État',
+        'empty' => 'Aucun type trouvé',
+        'active' => '✓ Actif',
+        'inactive' => 'Inactif',
+        'page_showing_before' => 'Affichage de',
+        'page_showing_to' => 'à',
+        'page_showing_on' => 'sur',
+        'page_unit' => 'types',
+        'page_label' => 'Page',
+        'page_of' => 'sur',
+        'delete_title' => 'Supprimer le type',
+        'delete_desc' => 'Êtes-vous sûr de vouloir supprimer ce type de classe ? Cette action est irréversible.',
+        'deleting' => 'Suppression...',
+
+        'create_head' => 'Nouveau type de classe',
+        'create_title' => 'Créer un type de classe',
+        'create_subtitle' => 'Renseignez les informations du type.',
+        'edit_head' => 'Éditer :name',
+        'edit_title' => 'Éditer un type de classe',
+        'edit_subtitle' => 'Mettez à jour les informations de :name.',
+
+        'show_status' => 'État',
+        'show_active' => '✓ Actif',
+        'show_inactive' => 'Inactif',
+        'linked_classrooms' => 'Classes associées',
+        'created_on' => 'Créé le',
+        'updated_on' => 'Dernière modification',
+        'classes_using' => 'Classes utilisant ce type',
+        'classes_using_sub' => 'Affichage de toutes les classes assignées à ce type',
+        'no_classroom' => 'Aucune classe n\'utilise ce type pour le moment',
+        'create_classroom' => 'Créer une classe',
+        'cr_name' => 'Nom',
+        'cr_code' => 'Code',
+        'cr_capacity' => 'Capacité',
+        'cr_status' => 'État',
+        'cr_action' => 'Action',
+        'cr_places' => ':n places',
+        'cr_active' => '✓ Active',
+        'cr_inactive' => 'Inactive',
+        'cr_view' => 'Voir',
+
+        'form_section' => 'Informations du type',
+        'name_label' => 'Nom *',
+        'name_ph' => 'Ex: Classe générale',
+        'description_label' => 'Description',
+        'description_ph' => 'Description du type de classe...',
+        'period_label' => 'Système de périodes *',
+        'period_trimestre' => 'Trimestre (3 périodes)',
+        'period_semestre' => 'Semestre (2 périodes)',
+        'period_hint' => 'Détermine le découpage de l\'année (bulletins, évaluations) pour ce type de classe.',
+        'status_section' => 'Statut',
+        'active_label' => 'Type actif',
+        'submit_create' => 'Créer le type',
+    ],
 ];
diff --git a/resources/js/components/ClassroomTypes/classroom-type-form.tsx b/resources/js/components/ClassroomTypes/classroom-type-form.tsx
index a17317f9..b67801d2 100644
--- a/resources/js/components/ClassroomTypes/classroom-type-form.tsx
+++ b/resources/js/components/ClassroomTypes/classroom-type-form.tsx
@@ -4,6 +4,7 @@ import { Checkbox } from '@/components/ui/checkbox';
 import { Input } from '@/components/ui/input';
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
 import { Textarea } from '@/components/ui/textarea';
+import { useTranslation } from '@/helpers/i18n';
 
 export interface ClassroomTypeFormData {
     name: string;
@@ -31,14 +32,15 @@ export function ClassroomTypeForm({
     onSubmit,
     setData,
 }: Readonly<ClassroomTypeFormProps>) {
-    let submitLabel = 'Mettre à jour';
+    const { t } = useTranslation();
+    let submitLabel = t('parametres.common.update');
 
     if (processing && mode === 'create') {
-        submitLabel = 'Création...';
+        submitLabel = t('parametres.common.creating');
     } else if (processing) {
-        submitLabel = 'Mise à jour...';
+        submitLabel = t('parametres.common.updating');
     } else if (mode === 'create') {
-        submitLabel = 'Créer le type';
+        submitLabel = t('parametres.classroom_types.submit_create');
     }
 
     return (
@@ -48,25 +50,25 @@ export function ClassroomTypeForm({
                     <div className="w-9 h-9 rounded-full bg-blue-100 flex items-center justify-center">
                         <Tag className="w-5 h-5 text-blue-600" />
                     </div>
-                    <h3 className="text-lg font-semibold text-gray-900">Informations du type</h3>
+                    <h3 className="text-lg font-semibold text-gray-900">{t('parametres.classroom_types.form_section')}</h3>
                 </div>
 
                 <div className="grid grid-cols-1 gap-4">
                     <div>
-                        <label htmlFor="name" className="block text-sm font-medium text-gray-900 mb-2">Nom *</label>
+                        <label htmlFor="name" className="block text-sm font-medium text-gray-900 mb-2">{t('parametres.classroom_types.name_label')}</label>
                         <Input
                             id="name"
                             value={data.name}
                             onChange={(event) => setData('name', event.target.value)}
                             disabled={processing}
                             className={errors.name ? 'border-red-500 bg-red-50/40' : 'border-gray-200 bg-white focus-visible:ring-blue-500'}
-                            placeholder="Ex: Classe générale"
+                            placeholder={t('parametres.classroom_types.name_ph')}
                         />
                         {errors.name && <p className="text-sm text-red-600 mt-1">{errors.name}</p>}
                     </div>
 
                     <div>
-                        <label htmlFor="description" className="block text-sm font-medium text-gray-900 mb-2">Description</label>
+                        <label htmlFor="description" className="block text-sm font-medium text-gray-900 mb-2">{t('parametres.classroom_types.description_label')}</label>
                         <Textarea
                             id="description"
                             rows={4}
@@ -74,7 +76,7 @@ export function ClassroomTypeForm({
                             onChange={(event) => setData('description', event.target.value)}
                             disabled={processing}
                             className={errors.description ? 'border-red-500 bg-red-50/40' : 'border-gray-200 bg-white focus-visible:ring-blue-500'}
-                            placeholder="Description du type de classe..."
+                            placeholder={t('parametres.classroom_types.description_ph')}
                         />
                         {errors.description && <p className="text-sm text-red-600 mt-1">{errors.description}</p>}
                     </div>
@@ -82,16 +84,16 @@ export function ClassroomTypeForm({
                     <div>
                         <label className="flex items-center gap-2 text-sm font-medium text-gray-900 mb-2">
                             <CalendarRange className="w-4 h-4 text-blue-600" />
-                            Système de périodes *
+                            {t('parametres.classroom_types.period_label')}
                         </label>
                         <Select value={data.period_system} onValueChange={(v) => setData('period_system', v as 'trimestre' | 'semestre')} disabled={processing}>
                             <SelectTrigger className={errors.period_system ? 'border-red-500' : ''}><SelectValue /></SelectTrigger>
                             <SelectContent>
-                                <SelectItem value="trimestre">Trimestre (3 périodes)</SelectItem>
-                                <SelectItem value="semestre">Semestre (2 périodes)</SelectItem>
+                                <SelectItem value="trimestre">{t('parametres.classroom_types.period_trimestre')}</SelectItem>
+                                <SelectItem value="semestre">{t('parametres.classroom_types.period_semestre')}</SelectItem>
                             </SelectContent>
                         </Select>
-                        <p className="text-xs text-gray-400 mt-1">Détermine le découpage de l'année (bulletins, évaluations) pour ce type de classe.</p>
+                        <p className="text-xs text-gray-400 mt-1">{t('parametres.classroom_types.period_hint')}</p>
                         {errors.period_system && <p className="text-sm text-red-600 mt-1">{errors.period_system}</p>}
                     </div>
                 </div>
@@ -102,7 +104,7 @@ export function ClassroomTypeForm({
                     <div className="w-9 h-9 rounded-full bg-emerald-100 flex items-center justify-center">
                         <CheckCircle2 className="w-5 h-5 text-emerald-600" />
                     </div>
-                    <h3 className="text-lg font-semibold text-gray-900">Statut</h3>
+                    <h3 className="text-lg font-semibold text-gray-900">{t('parametres.classroom_types.status_section')}</h3>
                 </div>
 
                 <div className="flex items-center gap-3">
@@ -111,13 +113,13 @@ export function ClassroomTypeForm({
                         checked={data.active}
                         onCheckedChange={(checked) => setData('active', checked === true)}
                     />
-                    <label htmlFor="active" className="text-sm font-medium text-gray-700">Type actif</label>
+                    <label htmlFor="active" className="text-sm font-medium text-gray-700">{t('parametres.classroom_types.active_label')}</label>
                 </div>
             </div>
 
             <div className="flex gap-3 pt-2">
                 <Button type="button" variant="outline" onClick={onCancel} disabled={processing} className="flex-1 border-gray-200 text-gray-700 hover:bg-gray-50">
-                    Annuler
+                    {t('parametres.common.cancel')}
                 </Button>
                 <Button type="submit" disabled={processing} className="flex-1 gap-2 bg-blue-600 hover:bg-blue-700 shadow-sm">
                     <Save className="w-4 h-4" />
diff --git a/resources/js/pages/Parametres/ClassroomTypes/Create.tsx b/resources/js/pages/Parametres/ClassroomTypes/Create.tsx
index e84c7e33..cf1a4e5d 100644
--- a/resources/js/pages/Parametres/ClassroomTypes/Create.tsx
+++ b/resources/js/pages/Parametres/ClassroomTypes/Create.tsx
@@ -5,6 +5,7 @@ import {
     type ClassroomTypeFormData,
 } from '@/components/ClassroomTypes/classroom-type-form';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 const initialValues: ClassroomTypeFormData = {
@@ -15,6 +16,7 @@ const initialValues: ClassroomTypeFormData = {
 };
 
 export default function Create() {
+    const { t } = useTranslation();
     const { data, setData, post, processing, errors } = useForm<ClassroomTypeFormData>(initialValues);
 
     const handleSubmit = (event: React.SubmitEvent<HTMLFormElement>) => {
@@ -24,7 +26,7 @@ export default function Create() {
 
     return (
         <AppLayout>
-            <Head title="Nouveau type de classe" />
+            <Head title={t('parametres.classroom_types.create_head')} />
 
             <div className="w-full space-y-6">
                 <div className="flex items-center gap-4">
@@ -36,8 +38,8 @@ export default function Create() {
                         <ArrowLeft className="w-5 h-5 text-gray-600" />
                     </button>
                     <div>
-                        <h1 className="text-4xl font-bold tracking-tight text-gray-900">Créer un type de classe</h1>
-                        <p className="mt-2 text-gray-600">Renseignez les informations du type.</p>
+                        <h1 className="text-4xl font-bold tracking-tight text-gray-900">{t('parametres.classroom_types.create_title')}</h1>
+                        <p className="mt-2 text-gray-600">{t('parametres.classroom_types.create_subtitle')}</p>
                     </div>
                 </div>
 
diff --git a/resources/js/pages/Parametres/ClassroomTypes/Edit.tsx b/resources/js/pages/Parametres/ClassroomTypes/Edit.tsx
index 24562e49..a63afdd5 100644
--- a/resources/js/pages/Parametres/ClassroomTypes/Edit.tsx
+++ b/resources/js/pages/Parametres/ClassroomTypes/Edit.tsx
@@ -5,6 +5,7 @@ import {
     type ClassroomTypeFormData,
 } from '@/components/ClassroomTypes/classroom-type-form';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface ClassroomType {
@@ -20,6 +21,7 @@ interface EditProps {
 }
 
 export default function Edit({ classroomType }: Readonly<EditProps>) {
+    const { t } = useTranslation();
     const { data, setData, put, processing, errors } = useForm<ClassroomTypeFormData>({
         name: classroomType.name,
         description: classroomType.description || '',
@@ -34,7 +36,7 @@ export default function Edit({ classroomType }: Readonly<EditProps>) {
 
     return (
         <AppLayout>
-            <Head title={`Éditer ${classroomType.name}`} />
+            <Head title={t('parametres.classroom_types.edit_head', { name: classroomType.name })} />
 
             <div className="w-full space-y-6">
                 <div className="flex items-center gap-4">
@@ -46,8 +48,8 @@ export default function Edit({ classroomType }: Readonly<EditProps>) {
                         <ArrowLeft className="w-5 h-5 text-gray-600" />
                     </button>
                     <div>
-                        <h1 className="text-4xl font-bold tracking-tight text-gray-900">Éditer un type de classe</h1>
-                        <p className="mt-2 text-gray-600">Mettez à jour les informations de {classroomType.name}.</p>
+                        <h1 className="text-4xl font-bold tracking-tight text-gray-900">{t('parametres.classroom_types.edit_title')}</h1>
+                        <p className="mt-2 text-gray-600">{t('parametres.classroom_types.edit_subtitle', { name: classroomType.name })}</p>
                     </div>
                 </div>
 
diff --git a/resources/js/pages/Parametres/ClassroomTypes/Index.tsx b/resources/js/pages/Parametres/ClassroomTypes/Index.tsx
index 644c0960..1af82c31 100644
--- a/resources/js/pages/Parametres/ClassroomTypes/Index.tsx
+++ b/resources/js/pages/Parametres/ClassroomTypes/Index.tsx
@@ -22,6 +22,7 @@ import {
     TableRow,
 } from '@/components/ui/table';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface ClassroomType {
@@ -48,6 +49,7 @@ interface IndexProps {
 }
 
 export default function Index({ classroomTypes, activeCount, message }: Readonly<IndexProps>) {
+    const { t } = useTranslation();
     const [deleteConfirm, setDeleteConfirm] = useState<string | null>(null);
     const [isDeleting, setIsDeleting] = useState(false);
     const [searchQuery, setSearchQuery] = useState('');
@@ -76,7 +78,7 @@ export default function Index({ classroomTypes, activeCount, message }: Readonly
 
     const statsCards = [
         {
-            title: 'Total des types',
+            title: t('parametres.classroom_types.stat_total'),
             value: classroomTypes.total,
             icon: Tag,
             bgColor: 'bg-blue-50',
@@ -84,7 +86,7 @@ export default function Index({ classroomTypes, activeCount, message }: Readonly
             borderColor: 'border-blue-200',
         },
         {
-            title: 'Types actifs',
+            title: t('parametres.classroom_types.stat_active'),
             value: activeCount,
             icon: CheckCircle2,
             bgColor: 'bg-green-50',
@@ -92,7 +94,7 @@ export default function Index({ classroomTypes, activeCount, message }: Readonly
             borderColor: 'border-green-200',
         },
         {
-            title: 'Page',
+            title: t('parametres.classroom_types.stat_page'),
             value: `${classroomTypes.current_page}/${classroomTypes.last_page}`,
             icon: Plus,
             bgColor: 'bg-purple-50',
@@ -103,16 +105,16 @@ export default function Index({ classroomTypes, activeCount, message }: Readonly
 
     return (
         <AppLayout>
-            <Head title="Types de classes" />
+            <Head title={t('parametres.classroom_types.head')} />
 
                     <div className="space-y-6">
                         <div className="flex items-start justify-between">
                             <div>
                                 <h1 className="text-4xl font-bold tracking-tight text-gray-900 flex items-center gap-3"><Tag className="h-7 w-7 text-blue-600 shrink-0" />
-                                    Types de classes
+                                    {t('parametres.classroom_types.title')}
                                 </h1>
                                 <p className="mt-2 text-lg text-gray-600">
-                                    Gérez les types de classes disponibles
+                                    {t('parametres.classroom_types.subtitle')}
                                 </p>
                             </div>
                             <Button
@@ -120,7 +122,7 @@ export default function Index({ classroomTypes, activeCount, message }: Readonly
                                 className="gap-2 bg-blue-600 hover:bg-blue-700"
                             >
                                 <Plus className="w-5 h-5" />
-                                Nouveau type
+                                {t('parametres.classroom_types.new')}
                             </Button>
                         </div>
 
@@ -161,7 +163,7 @@ export default function Index({ classroomTypes, activeCount, message }: Readonly
                                     <Search className="absolute left-3 top-3 w-5 h-5 text-gray-400" />
                                     <Input
                                         type="text"
-                                        placeholder="Rechercher un type..."
+                                        placeholder={t('parametres.classroom_types.search_ph')}
                                         value={searchQuery}
                                         onChange={(e) => setSearchQuery(e.target.value)}
                                         className="pl-10 bg-gray-50 border-gray-300"
@@ -172,7 +174,7 @@ export default function Index({ classroomTypes, activeCount, message }: Readonly
                                     className="bg-blue-600 hover:bg-blue-700 text-white gap-2"
                                 >
                                     <Search className="w-4 h-4" />
-                                    Rechercher
+                                    {t('parametres.common.search')}
                                 </Button>
                                 {searchQuery && (
                                     <Button
@@ -180,7 +182,7 @@ export default function Index({ classroomTypes, activeCount, message }: Readonly
                                         onClick={handleClearSearch}
                                         className="border-gray-300 text-gray-700 hover:bg-gray-50"
                                     >
-                                        Réinitialiser
+                                        {t('parametres.classroom_types.reset')}
                                     </Button>
                                 )}
                             </div>
@@ -191,10 +193,10 @@ export default function Index({ classroomTypes, activeCount, message }: Readonly
                                 <Table>
                                     <TableHeader className="bg-gray-50">
                                         <TableRow className="border-b border-gray-200">
-                                            <TableHead className="font-semibold text-gray-900">Nom</TableHead>
-                                            <TableHead className="font-semibold text-gray-900">Description</TableHead>
-                                            <TableHead className="font-semibold text-gray-900">État</TableHead>
-                                            <TableHead className="text-center font-semibold text-gray-900 w-28">Actions</TableHead>
+                                            <TableHead className="font-semibold text-gray-900">{t('parametres.classroom_types.th_name')}</TableHead>
+                                            <TableHead className="font-semibold text-gray-900">{t('parametres.classroom_types.th_description')}</TableHead>
+                                            <TableHead className="font-semibold text-gray-900">{t('parametres.classroom_types.th_status')}</TableHead>
+                                            <TableHead className="text-center font-semibold text-gray-900 w-28">{t('parametres.common.actions')}</TableHead>
                                         </TableRow>
                                     </TableHeader>
                                     <TableBody>
@@ -206,7 +208,7 @@ export default function Index({ classroomTypes, activeCount, message }: Readonly
                                                 >
                                                     <div className="flex flex-col items-center gap-2">
                                                         <Tag className="w-12 h-12 text-gray-300" />
-                                                        <p className="text-lg">Aucun type trouvé</p>
+                                                        <p className="text-lg">{t('parametres.classroom_types.empty')}</p>
                                                     </div>
                                                 </TableCell>
                                             </TableRow>
@@ -236,25 +238,25 @@ export default function Index({ classroomTypes, activeCount, message }: Readonly
                                                                     : 'bg-gray-100 text-gray-800'
                                                             }`}
                                                         >
-                                                            {type.active ? '✓ Actif' : 'Inactif'}
+                                                            {type.active ? t('parametres.classroom_types.active') : t('parametres.classroom_types.inactive')}
                                                         </span>
                                                     </TableCell>
                                                     <TableCell className="text-center">
                                                         <div className="flex gap-2 justify-center">
                                                             <IconButton
-                                                                label="Voir"
+                                                                label={t('parametres.common.view')}
                                                                 icon={<Eye className="w-4 h-4" />}
                                                                 className="border-gray-300 text-gray-700 hover:bg-gray-50 hover:text-gray-900"
                                                                 onClick={() => router.visit(route('classroom-types.show', type.id))}
                                                             />
                                                             <IconButton
-                                                                label="Modifier"
+                                                                label={t('parametres.common.edit')}
                                                                 icon={<Pencil className="w-4 h-4" />}
                                                                 className="border-gray-300 text-gray-700 hover:bg-gray-50 hover:text-gray-900"
                                                                 onClick={() => router.visit(route('classroom-types.edit', type.id))}
                                                             />
                                                             <IconButton
-                                                                label="Supprimer"
+                                                                label={t('parametres.common.delete')}
                                                                 icon={<Trash2 className="w-4 h-4" />}
                                                                 className="border-red-300 text-red-600 hover:bg-red-50 hover:text-red-700"
                                                                 onClick={() => setDeleteConfirm(type.id)}
@@ -272,9 +274,9 @@ export default function Index({ classroomTypes, activeCount, message }: Readonly
                         {classroomTypes.last_page > 1 && (
                             <div className="flex items-center justify-between bg-white rounded-lg p-4 shadow-sm">
                                 <div className="text-sm text-gray-600">
-                                    Affichage de <span className="font-semibold">{classroomTypes.from}</span> à{' '}
-                                    <span className="font-semibold">{classroomTypes.to}</span> sur{' '}
-                                    <span className="font-semibold">{classroomTypes.total}</span> types
+                                    {t('parametres.classroom_types.page_showing_before')} <span className="font-semibold">{classroomTypes.from}</span> {t('parametres.classroom_types.page_showing_to')}{' '}
+                                    <span className="font-semibold">{classroomTypes.to}</span> {t('parametres.classroom_types.page_showing_on')}{' '}
+                                    <span className="font-semibold">{classroomTypes.total}</span> {t('parametres.classroom_types.page_unit')}
                                 </div>
                                 <div className="flex gap-2">
                                     {classroomTypes.current_page > 1 && (
@@ -288,11 +290,11 @@ export default function Index({ classroomTypes, activeCount, message }: Readonly
                                                 )
                                             }
                                         >
-                                            ← Précédent
+                                            ← {t('parametres.common.prev')}
                                         </Button>
                                     )}
                                     <span className="flex items-center px-4 text-sm font-medium text-gray-700">
-                                        Page {classroomTypes.current_page} sur {classroomTypes.last_page}
+                                        {t('parametres.classroom_types.page_label')} {classroomTypes.current_page} {t('parametres.classroom_types.page_of')} {classroomTypes.last_page}
                                     </span>
                                     {classroomTypes.current_page < classroomTypes.last_page && (
                                         <Button
@@ -305,7 +307,7 @@ export default function Index({ classroomTypes, activeCount, message }: Readonly
                                                 )
                                             }
                                         >
-                                            Suivant →
+                                            {t('parametres.common.next')} →
                                         </Button>
                                     )}
                                 </div>
@@ -321,22 +323,21 @@ export default function Index({ classroomTypes, activeCount, message }: Readonly
             >
                 <AlertDialogContent>
                     <AlertDialogHeader>
-                        <AlertDialogTitle>Supprimer le type</AlertDialogTitle>
+                        <AlertDialogTitle>{t('parametres.classroom_types.delete_title')}</AlertDialogTitle>
                         <AlertDialogDescription>
-                            Êtes-vous sûr de vouloir supprimer ce type de classe ?
-                            Cette action est irréversible.
+                            {t('parametres.classroom_types.delete_desc')}
                         </AlertDialogDescription>
                     </AlertDialogHeader>
                     <div className="flex gap-3 justify-end">
                         <AlertDialogCancel disabled={isDeleting}>
-                            Annuler
+                            {t('parametres.common.cancel')}
                         </AlertDialogCancel>
                         <AlertDialogAction
                             onClick={() => deleteConfirm && handleDelete(deleteConfirm)}
                             disabled={isDeleting}
                             className="bg-red-600 hover:bg-red-700"
                         >
-                            {isDeleting ? 'Suppression...' : 'Supprimer'}
+                            {isDeleting ? t('parametres.classroom_types.deleting') : t('parametres.common.delete')}
                         </AlertDialogAction>
                     </div>
                 </AlertDialogContent>
diff --git a/resources/js/pages/Parametres/ClassroomTypes/Show.tsx b/resources/js/pages/Parametres/ClassroomTypes/Show.tsx
index 3fbb8bf9..ade15b25 100644
--- a/resources/js/pages/Parametres/ClassroomTypes/Show.tsx
+++ b/resources/js/pages/Parametres/ClassroomTypes/Show.tsx
@@ -10,6 +10,7 @@ import {
     TableRow,
 } from '@/components/ui/table';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface Classroom {
@@ -35,8 +36,10 @@ interface ShowProps {
 }
 
 export default function Show({ classroomType }: Readonly<ShowProps>) {
+    const { t, locale } = useTranslation();
+    const dateLocale = locale === 'en' ? 'en-GB' : 'fr-FR';
     const formatDate = (date: string) => {
-        return new Date(date).toLocaleDateString('fr-FR', {
+        return new Date(date).toLocaleDateString(dateLocale, {
             year: 'numeric',
             month: 'long',
             day: 'numeric',
@@ -81,7 +84,7 @@ export default function Show({ classroomType }: Readonly<ShowProps>) {
                             router.visit(route('classroom-types.edit', classroomType.id))
                         }
                     >
-                        Modifier
+                        {t('parametres.common.edit')}
                     </Button>
                 </div>
 
@@ -89,9 +92,9 @@ export default function Show({ classroomType }: Readonly<ShowProps>) {
                     <div className="bg-white rounded-lg p-6 shadow-sm border border-gray-100">
                         <div className="flex items-center justify-between">
                             <div>
-                                <p className="text-sm font-medium text-gray-600">État</p>
+                                <p className="text-sm font-medium text-gray-600">{t('parametres.classroom_types.show_status')}</p>
                                 <p className="text-3xl font-bold text-gray-900 mt-2">
-                                    {classroomType.active ? '✓ Actif' : 'Inactif'}
+                                    {classroomType.active ? t('parametres.classroom_types.show_active') : t('parametres.classroom_types.show_inactive')}
                                 </p>
                             </div>
                             <CheckCircle2
@@ -103,7 +106,7 @@ export default function Show({ classroomType }: Readonly<ShowProps>) {
                     <div className="bg-white rounded-lg p-6 shadow-sm border border-gray-100">
                         <div className="flex items-center justify-between">
                             <div>
-                                <p className="text-sm font-medium text-gray-600">Classes associées</p>
+                                <p className="text-sm font-medium text-gray-600">{t('parametres.classroom_types.linked_classrooms')}</p>
                                 <p className="text-3xl font-bold text-gray-900 mt-2">
                                     {classroomType.classrooms.length}
                                 </p>
@@ -113,11 +116,11 @@ export default function Show({ classroomType }: Readonly<ShowProps>) {
                     </div>
 
                     <div className="bg-white rounded-lg p-6 shadow-sm border border-gray-100">
-                        <p className="text-sm font-medium text-gray-600 mb-3">Créé le</p>
+                        <p className="text-sm font-medium text-gray-600 mb-3">{t('parametres.classroom_types.created_on')}</p>
                         <p className="text-sm text-gray-600">
                             {formatDate(classroomType.created_at)}
                         </p>
-                        <p className="text-sm font-medium text-gray-600 mt-4 mb-2">Dernière modification</p>
+                        <p className="text-sm font-medium text-gray-600 mt-4 mb-2">{t('parametres.classroom_types.updated_on')}</p>
                         <p className="text-sm text-gray-600">
                             {formatDate(classroomType.updated_at)}
                         </p>
@@ -127,10 +130,10 @@ export default function Show({ classroomType }: Readonly<ShowProps>) {
                 <div className="bg-white rounded-lg shadow-sm border border-gray-100 overflow-hidden">
                     <div className="p-6 border-b border-gray-100">
                         <h2 className="text-2xl font-bold text-gray-900">
-                            Classes utilisant ce type
+                            {t('parametres.classroom_types.classes_using')}
                         </h2>
                         <p className="text-sm text-gray-600 mt-1">
-                            Affichage de toutes les classes assignées à ce type
+                            {t('parametres.classroom_types.classes_using_sub')}
                         </p>
                     </div>
 
@@ -139,13 +142,13 @@ export default function Show({ classroomType }: Readonly<ShowProps>) {
                             <div className="text-center">
                                 <AlertCircle className="w-12 h-12 text-gray-300 mx-auto mb-2" />
                                 <p className="text-lg text-gray-500">
-                                    Aucune classe n'utilise ce type pour le moment
+                                    {t('parametres.classroom_types.no_classroom')}
                                 </p>
                                 <Button
                                     className="mt-4 bg-blue-600 hover:bg-blue-700"
                                     onClick={() => router.visit(route('classrooms.index'))}
                                 >
-                                    Créer une classe
+                                    {t('parametres.classroom_types.create_classroom')}
                                 </Button>
                             </div>
                         </div>
@@ -155,19 +158,19 @@ export default function Show({ classroomType }: Readonly<ShowProps>) {
                                 <TableHeader className="bg-gray-50">
                                     <TableRow className="border-b border-gray-200">
                                         <TableHead className="font-semibold text-gray-900">
-                                            Nom
+                                            {t('parametres.classroom_types.cr_name')}
                                         </TableHead>
                                         <TableHead className="font-semibold text-gray-900">
-                                            Code
+                                            {t('parametres.classroom_types.cr_code')}
                                         </TableHead>
                                         <TableHead className="font-semibold text-gray-900">
-                                            Capacité
+                                            {t('parametres.classroom_types.cr_capacity')}
                                         </TableHead>
                                         <TableHead className="font-semibold text-gray-900">
-                                            État
+                                            {t('parametres.classroom_types.cr_status')}
                                         </TableHead>
                                         <TableHead className="text-center font-semibold text-gray-900">
-                                            Action
+                                            {t('parametres.classroom_types.cr_action')}
                                         </TableHead>
                                     </TableRow>
                                 </TableHeader>
@@ -186,7 +189,7 @@ export default function Show({ classroomType }: Readonly<ShowProps>) {
                                                 </code>
                                             </TableCell>
                                             <TableCell className="text-gray-600">
-                                                {classroom.capacity} places
+                                                {t('parametres.classroom_types.cr_places', { n: classroom.capacity })}
                                             </TableCell>
                                             <TableCell className="text-gray-600">
                                                 <span
@@ -196,7 +199,7 @@ export default function Show({ classroomType }: Readonly<ShowProps>) {
                                                             : 'bg-gray-100 text-gray-800'
                                                     }`}
                                                 >
-                                                    {classroom.active ? '✓ Active' : 'Inactive'}
+                                                    {classroom.active ? t('parametres.classroom_types.cr_active') : t('parametres.classroom_types.cr_inactive')}
                                                 </span>
                                             </TableCell>
                                             <TableCell className="text-center">
@@ -210,7 +213,7 @@ export default function Show({ classroomType }: Readonly<ShowProps>) {
                                                         )
                                                     }
                                                 >
-                                                    Voir
+                                                    {t('parametres.classroom_types.cr_view')}
                                                 </Button>
                                             </TableCell>
                                         </TableRow>

From d9ff2a7053fadf0f05351ea5b6e079b78063c646 Mon Sep 17 00:00:00 2001
From: horacioskrp <hervekudayah@gmail.com>
Date: Thu, 12 Nov 2026 04:28:19 +0000
Subject: [PATCH 04/12] =?UTF-8?q?feat(i18n):=20param=C3=A8tres=20=E2=80=94?=
 =?UTF-8?q?=20bourses=20(liste,=20cr=C3=A9ation,=20=C3=A9dition,=20d=C3=A9?=
 =?UTF-8?q?tail)=20(FR/EN)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 lang/en/parametres.php                        | 53 ++++++++++++++++
 lang/fr/parametres.php                        | 53 ++++++++++++++++
 .../pages/Parametres/Scholarships/Create.tsx  | 32 +++++-----
 .../js/pages/Parametres/Scholarships/Edit.tsx | 32 +++++-----
 .../pages/Parametres/Scholarships/Index.tsx   | 61 ++++++++++---------
 .../js/pages/Parametres/Scholarships/Show.tsx | 33 +++++-----
 6 files changed, 190 insertions(+), 74 deletions(-)

diff --git a/lang/en/parametres.php b/lang/en/parametres.php
index 284be257..85d5a3c5 100644
--- a/lang/en/parametres.php
+++ b/lang/en/parametres.php
@@ -413,4 +413,57 @@
         'active_label' => 'Active type',
         'submit_create' => 'Create type',
     ],
+
+    'scholarships' => [
+        'head' => 'Scholarships',
+        'title' => 'Scholarships',
+        'subtitle' => 'Manage tuition fee reductions',
+        'new' => 'New scholarship',
+        'stat_total' => 'Total scholarships',
+        'stat_percentage' => 'Percentage scholarships',
+        'stat_fixed' => 'Fixed amounts',
+        'search_ph' => 'Search a scholarship...',
+        'search_results' => 'Results for:',
+        'th_name' => 'Name',
+        'th_type' => 'Type',
+        'th_value' => 'Value',
+        'th_created' => 'Created date',
+        'empty' => 'No scholarship found',
+        'type_percentage' => 'Percentage',
+        'type_fixed' => 'Fixed amount',
+        'page_showing' => 'Showing',
+        'page_to' => 'to',
+        'page_of' => 'of',
+        'page_unit' => 'scholarships',
+        'page_label' => 'Page',
+        'delete_title' => 'Delete scholarship',
+        'delete_desc' => 'Are you sure you want to delete this scholarship? This action is irreversible.',
+        'deleting' => 'Deleting...',
+
+        'create_head' => 'Create a scholarship',
+        'create_title' => 'Create a new scholarship',
+        'edit_head' => 'Edit :name',
+        'edit_title' => 'Edit :name',
+        'form_section' => 'Scholarship information',
+        'name_label' => 'Name *',
+        'name_ph' => 'e.g. Excellence scholarship',
+        'type_label' => 'Type *',
+        'type_ph' => 'Select a type',
+        'value_label_pct' => 'Value (%) *',
+        'value_label_fixed' => 'Value (amount) *',
+        'value_ph_pct' => 'e.g. 15',
+        'value_ph_fixed' => 'e.g. 100.00',
+        'description' => 'Description',
+        'description_ph' => 'Describe the scholarship...',
+        'submit_create' => 'Create scholarship',
+
+        'show_value' => 'Value',
+        'show_description' => 'Description',
+        'show_no_description' => 'No description available',
+        'history' => 'History',
+        'created_on' => 'Created on',
+        'updated_on' => 'Last updated',
+        'summary' => 'Summary',
+        'current_value' => 'Current value',
+    ],
 ];
diff --git a/lang/fr/parametres.php b/lang/fr/parametres.php
index e1f37ae8..55e2c2a2 100644
--- a/lang/fr/parametres.php
+++ b/lang/fr/parametres.php
@@ -413,4 +413,57 @@
         'active_label' => 'Type actif',
         'submit_create' => 'Créer le type',
     ],
+
+    'scholarships' => [
+        'head' => 'Bourses',
+        'title' => 'Bourses',
+        'subtitle' => 'Gérez les réductions de frais de scolarité',
+        'new' => 'Nouvelle bourse',
+        'stat_total' => 'Bourses totales',
+        'stat_percentage' => 'Bourses en %',
+        'stat_fixed' => 'Montants fixes',
+        'search_ph' => 'Rechercher une bourse...',
+        'search_results' => 'Résultats pour :',
+        'th_name' => 'Nom',
+        'th_type' => 'Type',
+        'th_value' => 'Valeur',
+        'th_created' => 'Date de création',
+        'empty' => 'Aucune bourse trouvée',
+        'type_percentage' => 'Pourcentage',
+        'type_fixed' => 'Montant fixe',
+        'page_showing' => 'Affichage',
+        'page_to' => 'à',
+        'page_of' => 'sur',
+        'page_unit' => 'bourses',
+        'page_label' => 'Page',
+        'delete_title' => 'Supprimer la bourse',
+        'delete_desc' => 'Êtes-vous sûr de vouloir supprimer cette bourse ? Cette action est irréversible.',
+        'deleting' => 'Suppression...',
+
+        'create_head' => 'Créer une bourse',
+        'create_title' => 'Créer une nouvelle bourse',
+        'edit_head' => 'Modifier :name',
+        'edit_title' => 'Modifier :name',
+        'form_section' => 'Informations de la bourse',
+        'name_label' => 'Nom *',
+        'name_ph' => 'Ex: Bourse d\'excellence',
+        'type_label' => 'Type *',
+        'type_ph' => 'Sélectionner un type',
+        'value_label_pct' => 'Valeur (%) *',
+        'value_label_fixed' => 'Valeur (montant) *',
+        'value_ph_pct' => 'Ex: 15',
+        'value_ph_fixed' => 'Ex: 100.00',
+        'description' => 'Description',
+        'description_ph' => 'Décrivez la bourse...',
+        'submit_create' => 'Créer la bourse',
+
+        'show_value' => 'Valeur',
+        'show_description' => 'Description',
+        'show_no_description' => 'Aucune description disponible',
+        'history' => 'Historique',
+        'created_on' => 'Créée le',
+        'updated_on' => 'Dernière modification',
+        'summary' => 'Résumé',
+        'current_value' => 'Valeur actuelle',
+    ],
 ];
diff --git a/resources/js/pages/Parametres/Scholarships/Create.tsx b/resources/js/pages/Parametres/Scholarships/Create.tsx
index ee524e43..85b10f53 100644
--- a/resources/js/pages/Parametres/Scholarships/Create.tsx
+++ b/resources/js/pages/Parametres/Scholarships/Create.tsx
@@ -11,11 +11,13 @@ import {
     SelectValue,
 } from '@/components/ui/select';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 type ScholarshipType = 'percentage' | 'fixed';
 
 export default function Create() {
+    const { t } = useTranslation();
     const [formData, setFormData] = useState({
         name: '',
         description: '',
@@ -43,7 +45,7 @@ export default function Create() {
 
     return (
         <AppLayout>
-            <Head title="Créer une bourse" />
+            <Head title={t('parametres.scholarships.create_head')} />
 
             <div className="space-y-6">
                 <div className="flex items-center gap-4">
@@ -55,25 +57,25 @@ export default function Create() {
                     </button>
                     <div>
                         <h1 className="text-3xl font-bold text-gray-900">
-                            Créer une nouvelle bourse
+                            {t('parametres.scholarships.create_title')}
                         </h1>
                     </div>
                 </div>
 
                 <form onSubmit={handleSubmit} className="space-y-6">
                     <div className="bg-white rounded-lg border border-gray-200 p-6">
-                        <h2 className="text-lg font-semibold text-gray-900 mb-4">Informations de la bourse</h2>
+                        <h2 className="text-lg font-semibold text-gray-900 mb-4">{t('parametres.scholarships.form_section')}</h2>
                         <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
                             <div>
                                 <label htmlFor="name" className="block text-sm font-medium text-gray-900 mb-2">
-                                    Nom *
+                                    {t('parametres.scholarships.name_label')}
                                 </label>
                                 <Input
                                     id="name"
                                     type="text"
                                     value={formData.name}
                                     onChange={(e) => setFormData((prev) => ({ ...prev, name: e.target.value }))}
-                                    placeholder="Ex: Bourse d'excellence"
+                                    placeholder={t('parametres.scholarships.name_ph')}
                                     className={errors.name ? 'border-red-500' : ''}
                                 />
                                 {errors.name && (
@@ -83,18 +85,18 @@ export default function Create() {
 
                             <div>
                                 <label htmlFor="type" className="block text-sm font-medium text-gray-900 mb-2">
-                                    Type *
+                                    {t('parametres.scholarships.type_label')}
                                 </label>
                                 <Select
                                     value={formData.type}
                                     onValueChange={(value: ScholarshipType) => setFormData((prev) => ({ ...prev, type: value }))}
                                 >
                                     <SelectTrigger className={errors.type ? 'border-red-500' : ''}>
-                                        <SelectValue placeholder="Sélectionner un type" />
+                                        <SelectValue placeholder={t('parametres.scholarships.type_ph')} />
                                     </SelectTrigger>
                                     <SelectContent>
-                                        <SelectItem value="fixed">Montant fixe</SelectItem>
-                                        <SelectItem value="percentage">Pourcentage</SelectItem>
+                                        <SelectItem value="fixed">{t('parametres.scholarships.type_fixed')}</SelectItem>
+                                        <SelectItem value="percentage">{t('parametres.scholarships.type_percentage')}</SelectItem>
                                     </SelectContent>
                                 </Select>
                                 {errors.type && (
@@ -104,7 +106,7 @@ export default function Create() {
 
                             <div>
                                 <label htmlFor="value" className="block text-sm font-medium text-gray-900 mb-2">
-                                    Valeur {formData.type === 'percentage' ? '(%)' : '(montant)'} *
+                                    {formData.type === 'percentage' ? t('parametres.scholarships.value_label_pct') : t('parametres.scholarships.value_label_fixed')}
                                 </label>
                                 <Input
                                     id="value"
@@ -113,7 +115,7 @@ export default function Create() {
                                     min="0"
                                     value={formData.value}
                                     onChange={(e) => setFormData((prev) => ({ ...prev, value: e.target.value }))}
-                                    placeholder={formData.type === 'percentage' ? 'Ex: 15' : 'Ex: 100.00'}
+                                    placeholder={formData.type === 'percentage' ? t('parametres.scholarships.value_ph_pct') : t('parametres.scholarships.value_ph_fixed')}
                                     className={errors.value ? 'border-red-500' : ''}
                                 />
                                 {errors.value && (
@@ -123,13 +125,13 @@ export default function Create() {
 
                             <div className="md:col-span-2">
                                 <label htmlFor="description" className="block text-sm font-medium text-gray-900 mb-2">
-                                    Description
+                                    {t('parametres.scholarships.description')}
                                 </label>
                                 <textarea
                                     id="description"
                                     value={formData.description}
                                     onChange={(e) => setFormData((prev) => ({ ...prev, description: e.target.value }))}
-                                    placeholder="Décrivez la bourse..."
+                                    placeholder={t('parametres.scholarships.description_ph')}
                                     rows={4}
                                     className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
                                 />
@@ -146,14 +148,14 @@ export default function Create() {
                             disabled={isSubmitting}
                             className="bg-blue-600 hover:bg-blue-700"
                         >
-                            {isSubmitting ? 'Création...' : 'Créer la bourse'}
+                            {isSubmitting ? t('parametres.common.creating') : t('parametres.scholarships.submit_create')}
                         </Button>
                         <Button
                             type="button"
                             variant="outline"
                             onClick={() => router.get(route('scholarships.index'))}
                         >
-                            Annuler
+                            {t('parametres.common.cancel')}
                         </Button>
                     </div>
                 </form>
diff --git a/resources/js/pages/Parametres/Scholarships/Edit.tsx b/resources/js/pages/Parametres/Scholarships/Edit.tsx
index be5cb645..ff6c2f58 100644
--- a/resources/js/pages/Parametres/Scholarships/Edit.tsx
+++ b/resources/js/pages/Parametres/Scholarships/Edit.tsx
@@ -11,6 +11,7 @@ import {
     SelectValue,
 } from '@/components/ui/select';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 type ScholarshipType = 'percentage' | 'fixed';
@@ -28,6 +29,7 @@ interface EditProps {
 }
 
 export default function Edit({ scholarship }: Readonly<EditProps>) {
+    const { t } = useTranslation();
     const [formData, setFormData] = useState({
         name: scholarship.name,
         description: scholarship.description || '',
@@ -55,7 +57,7 @@ export default function Edit({ scholarship }: Readonly<EditProps>) {
 
     return (
         <AppLayout>
-            <Head title={`Modifier ${scholarship.name}`} />
+            <Head title={t('parametres.scholarships.edit_head', { name: scholarship.name })} />
 
             <div className="space-y-6">
                 <div className="flex items-center gap-4">
@@ -67,25 +69,25 @@ export default function Edit({ scholarship }: Readonly<EditProps>) {
                     </button>
                     <div>
                         <h1 className="text-3xl font-bold text-gray-900">
-                            Modifier {scholarship.name}
+                            {t('parametres.scholarships.edit_title', { name: scholarship.name })}
                         </h1>
                     </div>
                 </div>
 
                 <form onSubmit={handleSubmit} className="space-y-6">
                     <div className="bg-white rounded-lg border border-gray-200 p-6">
-                        <h2 className="text-lg font-semibold text-gray-900 mb-4">Informations de la bourse</h2>
+                        <h2 className="text-lg font-semibold text-gray-900 mb-4">{t('parametres.scholarships.form_section')}</h2>
                         <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
                             <div>
                                 <label htmlFor="name" className="block text-sm font-medium text-gray-900 mb-2">
-                                    Nom *
+                                    {t('parametres.scholarships.name_label')}
                                 </label>
                                 <Input
                                     id="name"
                                     type="text"
                                     value={formData.name}
                                     onChange={(e) => setFormData((prev) => ({ ...prev, name: e.target.value }))}
-                                    placeholder="Ex: Bourse d'excellence"
+                                    placeholder={t('parametres.scholarships.name_ph')}
                                     className={errors.name ? 'border-red-500' : ''}
                                 />
                                 {errors.name && (
@@ -95,18 +97,18 @@ export default function Edit({ scholarship }: Readonly<EditProps>) {
 
                             <div>
                                 <label htmlFor="type" className="block text-sm font-medium text-gray-900 mb-2">
-                                    Type *
+                                    {t('parametres.scholarships.type_label')}
                                 </label>
                                 <Select
                                     value={formData.type}
                                     onValueChange={(value: ScholarshipType) => setFormData((prev) => ({ ...prev, type: value }))}
                                 >
                                     <SelectTrigger className={errors.type ? 'border-red-500' : ''}>
-                                        <SelectValue placeholder="Sélectionner un type" />
+                                        <SelectValue placeholder={t('parametres.scholarships.type_ph')} />
                                     </SelectTrigger>
                                     <SelectContent>
-                                        <SelectItem value="fixed">Montant fixe</SelectItem>
-                                        <SelectItem value="percentage">Pourcentage</SelectItem>
+                                        <SelectItem value="fixed">{t('parametres.scholarships.type_fixed')}</SelectItem>
+                                        <SelectItem value="percentage">{t('parametres.scholarships.type_percentage')}</SelectItem>
                                     </SelectContent>
                                 </Select>
                                 {errors.type && (
@@ -116,7 +118,7 @@ export default function Edit({ scholarship }: Readonly<EditProps>) {
 
                             <div>
                                 <label htmlFor="value" className="block text-sm font-medium text-gray-900 mb-2">
-                                    Valeur {formData.type === 'percentage' ? '(%)' : '(montant)'} *
+                                    {formData.type === 'percentage' ? t('parametres.scholarships.value_label_pct') : t('parametres.scholarships.value_label_fixed')}
                                 </label>
                                 <Input
                                     id="value"
@@ -125,7 +127,7 @@ export default function Edit({ scholarship }: Readonly<EditProps>) {
                                     min="0"
                                     value={formData.value}
                                     onChange={(e) => setFormData((prev) => ({ ...prev, value: e.target.value }))}
-                                    placeholder={formData.type === 'percentage' ? 'Ex: 15' : 'Ex: 100.00'}
+                                    placeholder={formData.type === 'percentage' ? t('parametres.scholarships.value_ph_pct') : t('parametres.scholarships.value_ph_fixed')}
                                     className={errors.value ? 'border-red-500' : ''}
                                 />
                                 {errors.value && (
@@ -135,13 +137,13 @@ export default function Edit({ scholarship }: Readonly<EditProps>) {
 
                             <div className="md:col-span-2">
                                 <label htmlFor="description" className="block text-sm font-medium text-gray-900 mb-2">
-                                    Description
+                                    {t('parametres.scholarships.description')}
                                 </label>
                                 <textarea
                                     id="description"
                                     value={formData.description}
                                     onChange={(e) => setFormData((prev) => ({ ...prev, description: e.target.value }))}
-                                    placeholder="Décrivez la bourse..."
+                                    placeholder={t('parametres.scholarships.description_ph')}
                                     rows={4}
                                     className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
                                 />
@@ -158,14 +160,14 @@ export default function Edit({ scholarship }: Readonly<EditProps>) {
                             disabled={isSubmitting}
                             className="bg-blue-600 hover:bg-blue-700"
                         >
-                            {isSubmitting ? 'Mise à jour...' : 'Mettre à jour'}
+                            {isSubmitting ? t('parametres.common.updating') : t('parametres.common.update')}
                         </Button>
                         <Button
                             type="button"
                             variant="outline"
                             onClick={() => router.get(route('scholarships.index'))}
                         >
-                            Annuler
+                            {t('parametres.common.cancel')}
                         </Button>
                     </div>
                 </form>
diff --git a/resources/js/pages/Parametres/Scholarships/Index.tsx b/resources/js/pages/Parametres/Scholarships/Index.tsx
index 2f2501ec..9c0569d7 100644
--- a/resources/js/pages/Parametres/Scholarships/Index.tsx
+++ b/resources/js/pages/Parametres/Scholarships/Index.tsx
@@ -23,6 +23,7 @@ import {
     TableRow,
 } from '@/components/ui/table';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface Scholarship {
@@ -53,6 +54,8 @@ interface IndexProps {
 }
 
 export default function Index({ scholarships, message, filters }: Readonly<IndexProps>) {
+    const { t, locale } = useTranslation();
+    const dateLocale = locale === 'en' ? 'en-GB' : 'fr-FR';
     const fmtMoney = useMoney();
     const [deleteConfirm, setDeleteConfirm] = useState<string | null>(null);
     const [isDeleting, setIsDeleting] = useState(false);
@@ -91,21 +94,21 @@ export default function Index({ scholarships, message, filters }: Readonly<Index
 
     const statsCards = [
         {
-            title: 'Bourses totales',
+            title: t('parametres.scholarships.stat_total'),
             value: scholarships.total,
             icon: Percent,
             bgColor: 'bg-blue-50',
             textColor: 'text-blue-600',
         },
         {
-            title: 'Bourses en %',
+            title: t('parametres.scholarships.stat_percentage'),
             value: percentageCount,
             icon: Percent,
             bgColor: 'bg-green-50',
             textColor: 'text-green-600',
         },
         {
-            title: 'Montants fixes',
+            title: t('parametres.scholarships.stat_fixed'),
             value: fixedCount,
             icon: Wallet,
             bgColor: 'bg-purple-50',
@@ -123,7 +126,7 @@ export default function Index({ scholarships, message, filters }: Readonly<Index
     };
 
     const formatDate = (date: string) => {
-        return new Intl.DateTimeFormat('fr-FR', {
+        return new Intl.DateTimeFormat(dateLocale, {
             day: '2-digit',
             month: '2-digit',
             year: 'numeric',
@@ -132,16 +135,16 @@ export default function Index({ scholarships, message, filters }: Readonly<Index
 
     return (
         <AppLayout>
-            <Head title="Bourses" />
+            <Head title={t('parametres.scholarships.head')} />
 
             <div className="space-y-6">
                 <div className="flex items-start justify-between">
                     <div>
                         <h1 className="text-4xl font-bold tracking-tight text-gray-900 flex items-center gap-3"><Percent className="h-7 w-7 text-blue-600 shrink-0" />
-                            Bourses
+                            {t('parametres.scholarships.title')}
                         </h1>
                         <p className="mt-2 text-lg text-gray-600">
-                            Gérez les réductions de frais de scolarité
+                            {t('parametres.scholarships.subtitle')}
                         </p>
                     </div>
                     <Button
@@ -149,7 +152,7 @@ export default function Index({ scholarships, message, filters }: Readonly<Index
                         className="gap-2 bg-blue-600 hover:bg-blue-700"
                     >
                         <Plus className="w-5 h-5" />
-                        Nouvelle bourse
+                        {t('parametres.scholarships.new')}
                     </Button>
                 </div>
 
@@ -191,7 +194,7 @@ export default function Index({ scholarships, message, filters }: Readonly<Index
                                 <Search className="absolute left-3 top-1/2 -translate-y-1/2 w-5 h-5 text-blue-400 group-focus-within:text-blue-600 transition" />
                                 <Input
                                     type="text"
-                                    placeholder="Rechercher une bourse..."
+                                    placeholder={t('parametres.scholarships.search_ph')}
                                     value={searchQuery}
                                     onChange={(e) => setSearchQuery(e.target.value)}
                                     onKeyDown={(e) => e.key === 'Enter' && handleSearch()}
@@ -211,12 +214,12 @@ export default function Index({ scholarships, message, filters }: Readonly<Index
                                 className="bg-blue-600 hover:bg-blue-700 text-white gap-2 shrink-0 transition"
                             >
                                 <Search className="w-4 h-4" />
-                                Rechercher
+                                {t('parametres.common.search')}
                             </Button>
                         </div>
                         {searchQuery && (
                             <p className="text-sm text-gray-500 mt-3">
-                                Résultats pour : <span className="font-semibold text-gray-700">« {searchQuery} »</span>
+                                {t('parametres.scholarships.search_results')} <span className="font-semibold text-gray-700">« {searchQuery} »</span>
                             </p>
                         )}
                     </div>
@@ -227,11 +230,11 @@ export default function Index({ scholarships, message, filters }: Readonly<Index
                         <Table>
                             <TableHeader className="bg-gray-50">
                                 <TableRow className="border-b border-gray-200">
-                                    <TableHead className="font-semibold text-gray-900">Nom</TableHead>
-                                    <TableHead className="font-semibold text-gray-900">Type</TableHead>
-                                    <TableHead className="font-semibold text-gray-900">Valeur</TableHead>
-                                    <TableHead className="font-semibold text-gray-900">Date de création</TableHead>
-                                    <TableHead className="text-center font-semibold text-gray-900 w-24">Actions</TableHead>
+                                    <TableHead className="font-semibold text-gray-900">{t('parametres.scholarships.th_name')}</TableHead>
+                                    <TableHead className="font-semibold text-gray-900">{t('parametres.scholarships.th_type')}</TableHead>
+                                    <TableHead className="font-semibold text-gray-900">{t('parametres.scholarships.th_value')}</TableHead>
+                                    <TableHead className="font-semibold text-gray-900">{t('parametres.scholarships.th_created')}</TableHead>
+                                    <TableHead className="text-center font-semibold text-gray-900 w-24">{t('parametres.common.actions')}</TableHead>
                                 </TableRow>
                             </TableHeader>
                             <TableBody>
@@ -243,7 +246,7 @@ export default function Index({ scholarships, message, filters }: Readonly<Index
                                         >
                                             <div className="flex flex-col items-center gap-2">
                                                 <Percent className="w-12 h-12 text-gray-300" />
-                                                <p className="text-lg">Aucune bourse trouvée</p>
+                                                <p className="text-lg">{t('parametres.scholarships.empty')}</p>
                                             </div>
                                         </TableCell>
                                     </TableRow>
@@ -260,7 +263,7 @@ export default function Index({ scholarships, message, filters }: Readonly<Index
                                             </TableCell>
                                             <TableCell>
                                                 <span className="bg-blue-100 text-blue-800 px-3 py-1 rounded-full text-sm font-medium">
-                                                    {scholarship.type === 'percentage' ? 'Pourcentage' : 'Montant fixe'}
+                                                    {scholarship.type === 'percentage' ? t('parametres.scholarships.type_percentage') : t('parametres.scholarships.type_fixed')}
                                                 </span>
                                             </TableCell>
                                             <TableCell className="font-medium text-gray-900">
@@ -272,19 +275,19 @@ export default function Index({ scholarships, message, filters }: Readonly<Index
                                             <TableCell className="text-center">
                                                 <div className="flex gap-2 justify-center">
                                                     <IconButton
-                                                        label="Voir"
+                                                        label={t('parametres.common.view')}
                                                         icon={<Eye className="w-4 h-4" />}
                                                         className="border-gray-300 text-gray-700 hover:bg-gray-50 hover:text-gray-900"
                                                         onClick={() => router.visit(route('scholarships.show', scholarship.id))}
                                                     />
                                                     <IconButton
-                                                        label="Modifier"
+                                                        label={t('parametres.common.edit')}
                                                         icon={<Pencil className="w-4 h-4" />}
                                                         className="border-gray-300 text-gray-700 hover:bg-gray-50 hover:text-gray-900"
                                                         onClick={() => router.get(route('scholarships.edit', scholarship.id))}
                                                     />
                                                     <IconButton
-                                                        label="Supprimer"
+                                                        label={t('parametres.common.delete')}
                                                         icon={<Trash2 className="w-4 h-4" />}
                                                         className="border-red-300 text-red-600 hover:bg-red-50 hover:text-red-700"
                                                         onClick={() => setDeleteConfirm(scholarship.id)}
@@ -303,7 +306,7 @@ export default function Index({ scholarships, message, filters }: Readonly<Index
                     <div className="bg-white rounded-lg shadow-sm border border-gray-100 p-4">
                         <div className="flex items-center justify-between">
                             <p className="text-sm text-gray-600">
-                                Affichage <span className="font-semibold">{scholarships.from}</span> à <span className="font-semibold">{scholarships.to}</span> sur <span className="font-semibold">{scholarships.total}</span> bourses
+                                {t('parametres.scholarships.page_showing')} <span className="font-semibold">{scholarships.from}</span> {t('parametres.scholarships.page_to')} <span className="font-semibold">{scholarships.to}</span> {t('parametres.scholarships.page_of')} <span className="font-semibold">{scholarships.total}</span> {t('parametres.scholarships.page_unit')}
                             </p>
                             <div className="flex items-center gap-2">
                                 <Button
@@ -317,7 +320,7 @@ export default function Index({ scholarships, message, filters }: Readonly<Index
                                     className="border-gray-300 text-gray-700 hover:bg-blue-50 hover:text-blue-700 hover:border-blue-300 disabled:opacity-50 disabled:cursor-not-allowed"
                                 >
                                     <ChevronLeft className="w-4 h-4 mr-1" />
-                                    Précédent
+                                    {t('parametres.common.prev')}
                                 </Button>
                                 <div className="flex gap-1">
                                     {Array.from({ length: Math.min(5, scholarships.last_page) }, (_, i) => {
@@ -355,12 +358,12 @@ export default function Index({ scholarships, message, filters }: Readonly<Index
                                     }, { preserveScroll: true })}
                                     className="border-gray-300 text-gray-700 hover:bg-blue-50 hover:text-blue-700 hover:border-blue-300 disabled:opacity-50 disabled:cursor-not-allowed"
                                 >
-                                    Suivant
+                                    {t('parametres.common.next')}
                                     <ChevronRight className="w-4 h-4 ml-1" />
                                 </Button>
                             </div>
                             <p className="text-sm text-gray-600">
-                                Page <span className="font-semibold">{scholarships.current_page}</span> sur <span className="font-semibold">{scholarships.last_page}</span>
+                                {t('parametres.scholarships.page_label')} <span className="font-semibold">{scholarships.current_page}</span> {t('parametres.scholarships.page_of')} <span className="font-semibold">{scholarships.last_page}</span>
                             </p>
                         </div>
                     </div>
@@ -370,19 +373,19 @@ export default function Index({ scholarships, message, filters }: Readonly<Index
             <AlertDialog open={!!deleteConfirm} onOpenChange={() => setDeleteConfirm(null)}>
                 <AlertDialogContent>
                     <AlertDialogHeader>
-                        <AlertDialogTitle>Supprimer la bourse</AlertDialogTitle>
+                        <AlertDialogTitle>{t('parametres.scholarships.delete_title')}</AlertDialogTitle>
                         <AlertDialogDescription>
-                            Êtes-vous sûr de vouloir supprimer cette bourse ? Cette action est irréversible.
+                            {t('parametres.scholarships.delete_desc')}
                         </AlertDialogDescription>
                     </AlertDialogHeader>
                     <div className="flex gap-3 justify-end">
-                        <AlertDialogCancel>Annuler</AlertDialogCancel>
+                        <AlertDialogCancel>{t('parametres.common.cancel')}</AlertDialogCancel>
                         <AlertDialogAction
                             onClick={() => deleteConfirm && handleDelete(deleteConfirm)}
                             disabled={isDeleting}
                             className="bg-red-600 hover:bg-red-700"
                         >
-                            {isDeleting ? 'Suppression...' : 'Supprimer'}
+                            {isDeleting ? t('parametres.scholarships.deleting') : t('parametres.common.delete')}
                         </AlertDialogAction>
                     </div>
                 </AlertDialogContent>
diff --git a/resources/js/pages/Parametres/Scholarships/Show.tsx b/resources/js/pages/Parametres/Scholarships/Show.tsx
index 12cf9ae0..a10319b2 100644
--- a/resources/js/pages/Parametres/Scholarships/Show.tsx
+++ b/resources/js/pages/Parametres/Scholarships/Show.tsx
@@ -3,6 +3,7 @@ import { useMoney } from '@/helpers/money';
 import { ArrowLeft, Percent, Calendar, FileText, Wallet } from 'lucide-react';
 import { Button } from '@/components/ui/button';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 type ScholarshipType = 'percentage' | 'fixed';
@@ -22,9 +23,11 @@ interface ShowProps {
 }
 
 export default function Show({ scholarship }: Readonly<ShowProps>) {
+    const { t, locale } = useTranslation();
+    const dateLocale = locale === 'en' ? 'en-GB' : 'fr-FR';
     const fmtMoney = useMoney();
     const formatDate = (date: string) => {
-        return new Date(date).toLocaleDateString('fr-FR', {
+        return new Date(date).toLocaleDateString(dateLocale, {
             year: 'numeric',
             month: 'long',
             day: 'numeric',
@@ -57,7 +60,7 @@ export default function Show({ scholarship }: Readonly<ShowProps>) {
                                     {scholarship.name}
                                 </h1>
                                 <span className="inline-block mt-1 px-3 py-1 bg-blue-100 text-blue-800 text-sm font-medium rounded-full">
-                                    {scholarship.type === 'percentage' ? 'Pourcentage' : 'Montant fixe'}
+                                    {scholarship.type === 'percentage' ? t('parametres.scholarships.type_percentage') : t('parametres.scholarships.type_fixed')}
                                 </span>
                             </div>
                         </div>
@@ -66,7 +69,7 @@ export default function Show({ scholarship }: Readonly<ShowProps>) {
                         onClick={() => router.get(route('scholarships.edit', scholarship.id))}
                         className="bg-blue-600 hover:bg-blue-700"
                     >
-                        Modifier
+                        {t('parametres.common.edit')}
                     </Button>
                 </div>
 
@@ -75,15 +78,15 @@ export default function Show({ scholarship }: Readonly<ShowProps>) {
                         <div className="bg-white rounded-lg border border-gray-200 p-6">
                             <h2 className="text-lg font-semibold text-gray-900 mb-4 flex items-center gap-2">
                                 <Percent className="w-5 h-5 text-blue-600" />
-                                Informations de la bourse
+                                {t('parametres.scholarships.form_section')}
                             </h2>
                             <div className="grid grid-cols-2 gap-4">
                                 <div>
-                                    <p className="text-sm text-gray-600">Nom</p>
+                                    <p className="text-sm text-gray-600">{t('parametres.scholarships.th_name')}</p>
                                     <p className="font-medium text-gray-900 mt-1">{scholarship.name}</p>
                                 </div>
                                 <div>
-                                    <p className="text-sm text-gray-600">Valeur</p>
+                                    <p className="text-sm text-gray-600">{t('parametres.scholarships.show_value')}</p>
                                     <p className="font-medium text-gray-900 mt-1">{formattedValue}</p>
                                 </div>
                             </div>
@@ -92,30 +95,30 @@ export default function Show({ scholarship }: Readonly<ShowProps>) {
                         <div className="bg-white rounded-lg border border-gray-200 p-6">
                             <h2 className="text-lg font-semibold text-gray-900 mb-4 flex items-center gap-2">
                                 <FileText className="w-5 h-5 text-blue-600" />
-                                Description
+                                {t('parametres.scholarships.show_description')}
                             </h2>
                             <p className="text-gray-700 whitespace-pre-wrap">
-                                {scholarship.description || 'Aucune description disponible'}
+                                {scholarship.description || t('parametres.scholarships.show_no_description')}
                             </p>
                         </div>
 
                         <div className="bg-white rounded-lg border border-gray-200 p-6">
                             <h2 className="text-lg font-semibold text-gray-900 mb-4 flex items-center gap-2">
                                 <Calendar className="w-5 h-5 text-blue-600" />
-                                Historique
+                                {t('parametres.scholarships.history')}
                             </h2>
                             <div className="space-y-3">
                                 <div className="flex items-start gap-3">
                                     <div className="w-2 h-2 bg-blue-600 rounded-full mt-2"></div>
                                     <div>
-                                        <p className="text-sm text-gray-600">Créée le</p>
+                                        <p className="text-sm text-gray-600">{t('parametres.scholarships.created_on')}</p>
                                         <p className="font-medium text-gray-900">{formatDate(scholarship.created_at)}</p>
                                     </div>
                                 </div>
                                 <div className="flex items-start gap-3">
                                     <div className="w-2 h-2 bg-gray-400 rounded-full mt-2"></div>
                                     <div>
-                                        <p className="text-sm text-gray-600">Dernière modification</p>
+                                        <p className="text-sm text-gray-600">{t('parametres.scholarships.updated_on')}</p>
                                         <p className="font-medium text-gray-900">{formatDate(scholarship.updated_at)}</p>
                                     </div>
                                 </div>
@@ -125,16 +128,16 @@ export default function Show({ scholarship }: Readonly<ShowProps>) {
 
                     <div className="lg:col-span-1 space-y-6">
                         <div className="bg-white rounded-lg border border-gray-200 p-6">
-                            <h2 className="text-lg font-semibold text-gray-900 mb-4">Résumé</h2>
+                            <h2 className="text-lg font-semibold text-gray-900 mb-4">{t('parametres.scholarships.summary')}</h2>
                             <div className="space-y-4">
                                 <div className="p-4 bg-blue-50 rounded-lg">
-                                    <p className="text-sm text-gray-600">Type</p>
+                                    <p className="text-sm text-gray-600">{t('parametres.scholarships.th_type')}</p>
                                     <p className="text-xl font-bold text-blue-600 mt-1">
-                                        {scholarship.type === 'percentage' ? 'Pourcentage' : 'Montant fixe'}
+                                        {scholarship.type === 'percentage' ? t('parametres.scholarships.type_percentage') : t('parametres.scholarships.type_fixed')}
                                     </p>
                                 </div>
                                 <div className="p-4 bg-green-50 rounded-lg">
-                                    <p className="text-sm text-gray-600">Valeur actuelle</p>
+                                    <p className="text-sm text-gray-600">{t('parametres.scholarships.current_value')}</p>
                                     <p className="text-xl font-bold text-green-600 mt-1 flex items-center gap-1">
                                         <Wallet className="w-5 h-5" />
                                         {formattedValue}

From 8f8df9d8d5daaf19a89250a63d52c895c3120071 Mon Sep 17 00:00:00 2001
From: horacioskrp <hervekudayah@gmail.com>
Date: Thu, 12 Nov 2026 04:32:14 +0000
Subject: [PATCH 05/12] =?UTF-8?q?feat(i18n):=20param=C3=A8tres=20=E2=80=94?=
 =?UTF-8?q?=20mod=C3=A8le=20de=20bulletin=20(FR/EN)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 lang/en/parametres.php                        | 22 +++++++++++
 lang/fr/parametres.php                        | 22 +++++++++++
 .../Parametres/BulletinTemplates/Edit.tsx     | 38 ++++++++++---------
 3 files changed, 64 insertions(+), 18 deletions(-)

diff --git a/lang/en/parametres.php b/lang/en/parametres.php
index 85d5a3c5..902d231d 100644
--- a/lang/en/parametres.php
+++ b/lang/en/parametres.php
@@ -466,4 +466,26 @@
         'summary' => 'Summary',
         'current_value' => 'Current value',
     ],
+
+    'bulletin_templates' => [
+        'head' => 'Report card template',
+        'title' => 'Report card template',
+        'subtitle_before' => 'Build the report card columns for :name. The',
+        'subtitle_after' => 'token becomes "Term." or "Sem." depending on the class type.',
+        'load_preset' => 'Load a preset…',
+        'saving' => 'Saving…',
+        'columns' => 'Columns (:n)',
+        'total_width' => 'Total width: :w%',
+        'default_column' => 'Column',
+        'label_ph' => 'Label',
+        'type_prefix' => 'Type: :name',
+        'add_column' => 'Add a column',
+        'footer' => 'Report card footer',
+        'opt_class_stats' => 'Show class statistics (highest / lowest / overall average)',
+        'opt_period_recap' => 'Show inter-period recap + annual average',
+        'opt_discipline' => 'Show the discipline block (lateness, absences, board decision)',
+        'signatory_left' => 'Signatory (left)',
+        'signatory_right' => 'Signatory (right)',
+        'legal_note' => 'Legal notice (N.B.)',
+    ],
 ];
diff --git a/lang/fr/parametres.php b/lang/fr/parametres.php
index 55e2c2a2..12d20fce 100644
--- a/lang/fr/parametres.php
+++ b/lang/fr/parametres.php
@@ -466,4 +466,26 @@
         'summary' => 'Résumé',
         'current_value' => 'Valeur actuelle',
     ],
+
+    'bulletin_templates' => [
+        'head' => 'Modèle de bulletin',
+        'title' => 'Modèle de bulletin',
+        'subtitle_before' => 'Composez les colonnes du bulletin de :name. Le jeton',
+        'subtitle_after' => 'devient « Trim. » ou « Sem. » selon le type de classe.',
+        'load_preset' => 'Charger un preset…',
+        'saving' => 'Enregistrement…',
+        'columns' => 'Colonnes (:n)',
+        'total_width' => 'Largeur totale : :w%',
+        'default_column' => 'Colonne',
+        'label_ph' => 'Libellé',
+        'type_prefix' => 'Type : :name',
+        'add_column' => 'Ajouter une colonne',
+        'footer' => 'Pied de bulletin',
+        'opt_class_stats' => 'Afficher les statistiques de la classe (moyenne la plus forte / faible / générale)',
+        'opt_period_recap' => 'Afficher le récapitulatif inter-périodes + moyenne annuelle',
+        'opt_discipline' => 'Afficher le bloc discipline (retards, absences, décision du conseil)',
+        'signatory_left' => 'Signataire (gauche)',
+        'signatory_right' => 'Signataire (droite)',
+        'legal_note' => 'Mention légale (N.B.)',
+    ],
 ];
diff --git a/resources/js/pages/Parametres/BulletinTemplates/Edit.tsx b/resources/js/pages/Parametres/BulletinTemplates/Edit.tsx
index ae1532f5..1395025e 100644
--- a/resources/js/pages/Parametres/BulletinTemplates/Edit.tsx
+++ b/resources/js/pages/Parametres/BulletinTemplates/Edit.tsx
@@ -7,6 +7,7 @@ import { Checkbox } from '@/components/ui/checkbox';
 import { Input } from '@/components/ui/input';
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 // Alias de type (et non `interface`) : seuls les alias reçoivent une signature
@@ -36,12 +37,13 @@ interface Props {
 const uid = () => `col_${Date.now()}_${Math.floor(Math.random() * 1000)}`;
 
 export default function Edit({ columns: initialColumns, options: initialOptions, columnTypes, noteSources, evaluationTypes, presets, school }: Readonly<Props>) {
+    const { t } = useTranslation();
     const [columns, setColumns] = useState<Column[]>(initialColumns);
     const [options, setOptions] = useState<Options>(initialOptions);
     const [saving, setSaving] = useState(false);
 
     const patch = (i: number, p: Partial<Column>) => setColumns((c) => c.map((col, j) => (j === i ? { ...col, ...p } : col)));
-    const add = () => setColumns((c) => [...c, { key: uid(), label: 'Colonne', width: 10, type: 'text', source: null }]);
+    const add = () => setColumns((c) => [...c, { key: uid(), label: t('parametres.bulletin_templates.default_column'), width: 10, type: 'text', source: null }]);
     const remove = (i: number) => setColumns((c) => c.filter((_, j) => j !== i));
     const move = (i: number, dir: -1 | 1) => setColumns((c) => {
         const next = [...c];
@@ -68,24 +70,24 @@ export default function Edit({ columns: initialColumns, options: initialOptions,
 
     return (
         <AppLayout>
-            <Head title="Modèle de bulletin" />
+            <Head title={t('parametres.bulletin_templates.head')} />
             <div className="w-full space-y-6">
                 <div className="flex items-start justify-between gap-4 flex-wrap">
                     <div>
                         <h1 className="text-4xl font-bold tracking-tight text-gray-900 flex items-center gap-3">
-                            <LayoutGrid className="h-7 w-7 text-blue-600 shrink-0" /> Modèle de bulletin
+                            <LayoutGrid className="h-7 w-7 text-blue-600 shrink-0" /> {t('parametres.bulletin_templates.title')}
                         </h1>
-                        <p className="mt-2 text-gray-500">Composez les colonnes du bulletin de {school.name}. Le jeton <code className="font-mono">{'{periode}'}</code> devient « Trim. » ou « Sem. » selon le type de classe.</p>
+                        <p className="mt-2 text-gray-500">{t('parametres.bulletin_templates.subtitle_before', { name: school.name })} <code className="font-mono">{'{periode}'}</code> {t('parametres.bulletin_templates.subtitle_after')}</p>
                     </div>
                     <div className="flex items-center gap-2">
                         <Select onValueChange={loadPreset}>
-                            <SelectTrigger className="w-52"><SelectValue placeholder="Charger un preset…" /></SelectTrigger>
+                            <SelectTrigger className="w-52"><SelectValue placeholder={t('parametres.bulletin_templates.load_preset')} /></SelectTrigger>
                             <SelectContent>
                                 {presets.map((p) => <SelectItem key={p.name} value={p.name}>{p.name}</SelectItem>)}
                             </SelectContent>
                         </Select>
                         <Button onClick={save} disabled={saving} className="bg-blue-600 hover:bg-blue-700 gap-2">
-                            <Save className="w-4 h-4" /> {saving ? 'Enregistrement…' : 'Enregistrer'}
+                            <Save className="w-4 h-4" /> {saving ? t('parametres.bulletin_templates.saving') : t('parametres.common.save')}
                         </Button>
                     </div>
                 </div>
@@ -93,8 +95,8 @@ export default function Edit({ columns: initialColumns, options: initialOptions,
                 {/* Colonnes */}
                 <div className="rounded-2xl bg-white p-5 shadow-sm ring-1 ring-slate-100 space-y-3">
                     <div className="flex items-center justify-between">
-                        <p className="text-xs font-semibold uppercase tracking-wide text-gray-400">Colonnes ({columns.length})</p>
-                        <span className={`text-xs ${Math.round(totalWidth) === 100 ? 'text-emerald-600' : 'text-amber-600'}`}>Largeur totale : {Math.round(totalWidth)}%</span>
+                        <p className="text-xs font-semibold uppercase tracking-wide text-gray-400">{t('parametres.bulletin_templates.columns', { n: columns.length })}</p>
+                        <span className={`text-xs ${Math.round(totalWidth) === 100 ? 'text-emerald-600' : 'text-amber-600'}`}>{t('parametres.bulletin_templates.total_width', { w: Math.round(totalWidth) })}</span>
                     </div>
 
                     <div className="space-y-2">
@@ -104,7 +106,7 @@ export default function Edit({ columns: initialColumns, options: initialOptions,
                                     <button onClick={() => move(i, -1)} className="text-gray-400 hover:text-gray-700"><ArrowUp className="w-3.5 h-3.5" /></button>
                                     <button onClick={() => move(i, 1)} className="text-gray-400 hover:text-gray-700"><ArrowDown className="w-3.5 h-3.5" /></button>
                                 </div>
-                                <Input value={col.label} onChange={(e) => patch(i, { label: e.target.value })} placeholder="Libellé" className="h-9 flex-1 min-w-40" />
+                                <Input value={col.label} onChange={(e) => patch(i, { label: e.target.value })} placeholder={t('parametres.bulletin_templates.label_ph')} className="h-9 flex-1 min-w-40" />
                                 <Select value={col.type} onValueChange={(v) => patch(i, { type: v, source: v === 'note' ? (col.source ?? 'moyenne') : null })}>
                                     <SelectTrigger className="h-9 w-44"><SelectValue /></SelectTrigger>
                                     <SelectContent>
@@ -116,7 +118,7 @@ export default function Edit({ columns: initialColumns, options: initialOptions,
                                         <SelectTrigger className="h-9 w-48"><SelectValue /></SelectTrigger>
                                         <SelectContent>
                                             {Object.entries(noteSources).map(([v, label]) => <SelectItem key={v} value={v}>{label}</SelectItem>)}
-                                            {evaluationTypes.map((t) => <SelectItem key={t.id} value={`type:${t.id}`}>Type : {t.name}</SelectItem>)}
+                                            {evaluationTypes.map((et) => <SelectItem key={et.id} value={`type:${et.id}`}>{t('parametres.bulletin_templates.type_prefix', { name: et.name })}</SelectItem>)}
                                         </SelectContent>
                                     </Select>
                                 )}
@@ -133,37 +135,37 @@ export default function Edit({ columns: initialColumns, options: initialOptions,
                     </div>
 
                     <Button variant="outline" size="sm" className="gap-1.5" onClick={add}>
-                        <Plus className="w-3.5 h-3.5" /> Ajouter une colonne
+                        <Plus className="w-3.5 h-3.5" /> {t('parametres.bulletin_templates.add_column')}
                     </Button>
                 </div>
 
                 {/* Options du pied */}
                 <div className="rounded-2xl bg-white p-5 shadow-sm ring-1 ring-slate-100 space-y-4">
-                    <p className="text-xs font-semibold uppercase tracking-wide text-gray-400">Pied de bulletin</p>
+                    <p className="text-xs font-semibold uppercase tracking-wide text-gray-400">{t('parametres.bulletin_templates.footer')}</p>
                     <label className="flex items-center gap-2 text-sm">
                         <Checkbox checked={Boolean(options.show_class_stats)} onCheckedChange={(v) => setOptions({ ...options, show_class_stats: Boolean(v) })} />
-                        Afficher les statistiques de la classe (moyenne la plus forte / faible / générale)
+                        {t('parametres.bulletin_templates.opt_class_stats')}
                     </label>
                     <label className="flex items-center gap-2 text-sm">
                         <Checkbox checked={Boolean(options.show_period_recap)} onCheckedChange={(v) => setOptions({ ...options, show_period_recap: Boolean(v) })} />
-                        Afficher le récapitulatif inter-périodes + moyenne annuelle
+                        {t('parametres.bulletin_templates.opt_period_recap')}
                     </label>
                     <label className="flex items-center gap-2 text-sm">
                         <Checkbox checked={Boolean(options.show_discipline)} onCheckedChange={(v) => setOptions({ ...options, show_discipline: Boolean(v) })} />
-                        Afficher le bloc discipline (retards, absences, décision du conseil)
+                        {t('parametres.bulletin_templates.opt_discipline')}
                     </label>
                     <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
                         <div className="space-y-1.5">
-                            <label className="text-sm font-medium text-gray-700">Signataire (gauche)</label>
+                            <label className="text-sm font-medium text-gray-700">{t('parametres.bulletin_templates.signatory_left')}</label>
                             <Input value={options.signataire_titulaire ?? ''} onChange={(e) => setOptions({ ...options, signataire_titulaire: e.target.value })} />
                         </div>
                         <div className="space-y-1.5">
-                            <label className="text-sm font-medium text-gray-700">Signataire (droite)</label>
+                            <label className="text-sm font-medium text-gray-700">{t('parametres.bulletin_templates.signatory_right')}</label>
                             <Input value={options.signataire_chef ?? ''} onChange={(e) => setOptions({ ...options, signataire_chef: e.target.value })} />
                         </div>
                     </div>
                     <div className="space-y-1.5">
-                        <label className="text-sm font-medium text-gray-700">Mention légale (N.B.)</label>
+                        <label className="text-sm font-medium text-gray-700">{t('parametres.bulletin_templates.legal_note')}</label>
                         <Input value={options.nb_text ?? ''} onChange={(e) => setOptions({ ...options, nb_text: e.target.value })} />
                     </div>
                 </div>

From 37571623b5d02971d9eb8b6f5c999bf80100c060 Mon Sep 17 00:00:00 2001
From: horacioskrp <hervekudayah@gmail.com>
Date: Thu, 12 Nov 2026 04:40:05 +0000
Subject: [PATCH 06/12] =?UTF-8?q?feat(i18n):=20param=C3=A8tres=20=E2=80=94?=
 =?UTF-8?q?=20fichiers=20&=20stockage,=20sauvegardes=20(FR/EN)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 lang/en/parametres.php                        | 117 +++++++++++++++
 lang/fr/parametres.php                        | 117 +++++++++++++++
 resources/js/pages/Parametres/Backups.tsx     | 135 +++++++++---------
 resources/js/pages/Parametres/FileStorage.tsx |  58 ++++----
 4 files changed, 330 insertions(+), 97 deletions(-)

diff --git a/lang/en/parametres.php b/lang/en/parametres.php
index 902d231d..ee015706 100644
--- a/lang/en/parametres.php
+++ b/lang/en/parametres.php
@@ -488,4 +488,121 @@
         'signatory_right' => 'Signatory (right)',
         'legal_note' => 'Legal notice (N.B.)',
     ],
+
+    'file_storage' => [
+        'head' => 'Files & Storage',
+        'title' => 'Files & Storage',
+        'subtitle' => 'Configure where uploaded files (logos, documents) will be stored.',
+        'toast_saved_title' => 'Configuration saved',
+        'toast_saved_desc' => 'Storage settings have been updated.',
+        'toast_error_title' => 'Error',
+        'toast_error_desc' => 'Check the fields and try again.',
+        'toast_test_ok_title' => 'Connection successful',
+        'toast_test_ok_desc' => 'The ":driver" disk is accessible and working.',
+        'toast_test_fail_title' => 'Connection failed',
+        'toast_unknown_error' => 'Unknown error.',
+        'toast_unreachable' => 'Unable to reach the storage.',
+        'driver_local' => 'Local storage',
+        'driver_local_desc' => 'Files on the Laravel server (public/storage)',
+        'driver_s3' => 'S3 cloud storage',
+        'driver_s3_desc' => 'AWS S3, Cloudflare R2, MinIO or S3-compatible',
+        's3_section' => 'S3 / Cloudflare R2 configuration',
+        'access_key' => 'Access Key',
+        'secret_key' => 'Secret Key',
+        'keep_hint' => '(leave empty to keep)',
+        'bucket' => 'Bucket *',
+        'region' => 'Region *',
+        'region_ph' => 'auto (R2) or eu-west-1 (AWS)',
+        'endpoint' => 'Endpoint',
+        'endpoint_hint' => '(R2/MinIO — leave empty for AWS)',
+        'public_url' => 'Public URL',
+        'public_url_hint' => '(CDN or custom domain)',
+        'r2_title' => 'Cloudflare R2 (recommended)',
+        'r2_region' => '• Region:',
+        'r2_endpoint' => '• Endpoint:',
+        'r2_bandwidth' => '• No egress bandwidth fees (ideal for Africa)',
+        'local_active' => 'Local storage active',
+        'local_active_before' => 'Files are stored in',
+        'local_active_middle' => 'and served via',
+        'test_connection' => 'Test connection',
+        'save' => 'Save',
+    ],
+
+    'backups' => [
+        'head' => 'Backups',
+        'title' => 'Backups',
+        'subtitle' => 'Back up the database (JSON / SQL) and schedule automatic backups.',
+        'size_mb' => ':n MB',
+        'size_kb' => ':n KB',
+        'day_1' => 'Monday',
+        'day_2' => 'Tuesday',
+        'day_3' => 'Wednesday',
+        'day_4' => 'Thursday',
+        'day_5' => 'Friday',
+        'day_6' => 'Saturday',
+        'day_7' => 'Sunday',
+        'dest_label' => 'Destination:',
+        'dest_remote' => 'Remote repository (S3 / R2)',
+        'dest_local' => 'Local server storage',
+        'dest_remote_desc' => 'Backups are sent to your configured cloud storage.',
+        'dest_local_desc' => 'Configure S3/R2 storage in "Files & Storage" to externalize backups.',
+        'manual_title' => 'Back up now',
+        'include_media' => 'Include media (documents, photos)',
+        'running' => 'Backing up…',
+        'run_backup' => 'Run backup',
+        'manual_hint_before' => 'With media, the backup is produced in',
+        'manual_hint_after' => 'format (database + uploaded files). Otherwise, only the database is backed up.',
+        'archive_title' => 'Archive a school year',
+        'archive_desc_before' => 'Generates a complete',
+        'archive_desc_locked' => 'locked',
+        'archive_desc_after' => 'snapshot kept long-term (excluded from automatic retention). The archive is also created automatically when a year is closed.',
+        'academic_year' => 'School year',
+        'choose_year' => 'Choose a year…',
+        'already_archived' => ' — already archived',
+        'archiving' => 'Archiving…',
+        'archive_year' => 'Archive the year',
+        'schedule_title' => 'Automatic scheduling',
+        'frequency' => 'Frequency',
+        'freq_none' => 'Disabled',
+        'freq_daily' => 'Daily',
+        'freq_weekly' => 'Weekly',
+        'time' => 'Time',
+        'day' => 'Day',
+        'retention' => 'Retention (number kept)',
+        'formats_generated' => 'Generated formats',
+        'schedule_hint_before' => 'Scheduling requires the Laravel scheduler to run on the server',
+        'schedule_hint_after' => 'via cron, every minute).',
+        'save_schedule' => 'Save schedule',
+        'restore_title' => 'Restore the database',
+        'restore_warn_before' => 'Restoring',
+        'restore_warn_bold' => 'overwrites current data',
+        'restore_warn_after' => 'with the file content. A safety backup (JSON) is created automatically before the operation.',
+        'restoring' => 'Restoring…',
+        'restore' => 'Restore',
+        'restore_one_table' => 'Restore a single table (optional)',
+        'all_tables' => 'Whole database',
+        'restore_table_hint_before' => 'Table-targeted restore is only available with',
+        'restore_table_hint_after' => '(or .json.gz) files and only overwrites the chosen table.',
+        'accepted_formats' => 'Accepted formats: .json, .sql, .gz (compressed), .dump (PostgreSQL) or .zip (database + media) from this application — max 200 MB.',
+        'history_title' => 'Backup history',
+        'th_file' => 'File',
+        'th_format' => 'Format',
+        'th_size' => 'Size',
+        'th_origin' => 'Origin',
+        'th_status' => 'Status',
+        'th_date' => 'Date',
+        'empty' => 'No backup yet.',
+        'badge_archive' => 'Archive',
+        'badge_media' => '+ media',
+        'origin_scheduled' => 'Scheduled',
+        'origin_manual' => 'Manual',
+        'status_ok' => 'OK',
+        'status_fail' => 'Failed',
+        'verify_integrity' => 'Verify integrity',
+        'restore_confirm_title' => 'Confirm restore?',
+        'restore_confirm_desc' => 'All current data will be replaced by the content of ":name". A safety backup is created first. This action is irreversible.',
+        'restore_now' => 'Restore now',
+        'delete_title' => 'Delete this backup?',
+        'delete_desc' => 'The file will be permanently deleted from storage.',
+    ],
 ];
diff --git a/lang/fr/parametres.php b/lang/fr/parametres.php
index 12d20fce..ae7060c8 100644
--- a/lang/fr/parametres.php
+++ b/lang/fr/parametres.php
@@ -488,4 +488,121 @@
         'signatory_right' => 'Signataire (droite)',
         'legal_note' => 'Mention légale (N.B.)',
     ],
+
+    'file_storage' => [
+        'head' => 'Fichiers & Stockage',
+        'title' => 'Fichiers & Stockage',
+        'subtitle' => 'Configurez où les fichiers uploadés (logos, documents) seront stockés.',
+        'toast_saved_title' => 'Configuration sauvegardée',
+        'toast_saved_desc' => 'Les paramètres de stockage ont été mis à jour.',
+        'toast_error_title' => 'Erreur',
+        'toast_error_desc' => 'Vérifiez les champs et réessayez.',
+        'toast_test_ok_title' => 'Connexion réussie',
+        'toast_test_ok_desc' => 'Le disque ":driver" est accessible et fonctionnel.',
+        'toast_test_fail_title' => 'Connexion échouée',
+        'toast_unknown_error' => 'Erreur inconnue.',
+        'toast_unreachable' => 'Impossible de joindre le stockage.',
+        'driver_local' => 'Stockage local',
+        'driver_local_desc' => 'Fichiers sur le serveur Laravel (public/storage)',
+        'driver_s3' => 'Stockage cloud S3',
+        'driver_s3_desc' => 'AWS S3, Cloudflare R2, MinIO ou compatible S3',
+        's3_section' => 'Configuration S3 / Cloudflare R2',
+        'access_key' => 'Access Key',
+        'secret_key' => 'Secret Key',
+        'keep_hint' => '(laisser vide pour conserver)',
+        'bucket' => 'Bucket *',
+        'region' => 'Région *',
+        'region_ph' => 'auto (R2) ou eu-west-1 (AWS)',
+        'endpoint' => 'Endpoint',
+        'endpoint_hint' => '(R2/MinIO — laisser vide pour AWS)',
+        'public_url' => 'URL publique',
+        'public_url_hint' => '(CDN ou domaine custom)',
+        'r2_title' => 'Cloudflare R2 (recommandé)',
+        'r2_region' => '• Région :',
+        'r2_endpoint' => '• Endpoint :',
+        'r2_bandwidth' => '• Aucun frais de bande passante sortante (idéal Afrique)',
+        'local_active' => 'Stockage local actif',
+        'local_active_before' => 'Les fichiers sont stockés dans',
+        'local_active_middle' => 'et servis via',
+        'test_connection' => 'Tester la connexion',
+        'save' => 'Enregistrer',
+    ],
+
+    'backups' => [
+        'head' => 'Sauvegardes',
+        'title' => 'Sauvegardes',
+        'subtitle' => 'Sauvegardez la base de données (JSON / SQL) et planifiez des sauvegardes automatiques.',
+        'size_mb' => ':n Mo',
+        'size_kb' => ':n Ko',
+        'day_1' => 'Lundi',
+        'day_2' => 'Mardi',
+        'day_3' => 'Mercredi',
+        'day_4' => 'Jeudi',
+        'day_5' => 'Vendredi',
+        'day_6' => 'Samedi',
+        'day_7' => 'Dimanche',
+        'dest_label' => 'Destination :',
+        'dest_remote' => 'Dépôt distant (S3 / R2)',
+        'dest_local' => 'Stockage local du serveur',
+        'dest_remote_desc' => 'Les sauvegardes sont envoyées sur votre stockage cloud configuré.',
+        'dest_local_desc' => 'Configurez un stockage S3/R2 dans « Fichiers & Stockage » pour externaliser les sauvegardes.',
+        'manual_title' => 'Sauvegarder maintenant',
+        'include_media' => 'Inclure les médias (documents, photos)',
+        'running' => 'Sauvegarde…',
+        'run_backup' => 'Lancer la sauvegarde',
+        'manual_hint_before' => 'Avec les médias, la sauvegarde est produite au format',
+        'manual_hint_after' => '(base + fichiers uploadés). Sinon, seule la base est sauvegardée.',
+        'archive_title' => 'Archiver une année scolaire',
+        'archive_desc_before' => 'Génère un instantané complet',
+        'archive_desc_locked' => 'verrouillé',
+        'archive_desc_after' => 'et conservé à long terme (exclu de la rétention automatique). L\'archive est aussi créée automatiquement à la clôture d\'une année.',
+        'academic_year' => 'Année scolaire',
+        'choose_year' => 'Choisir une année…',
+        'already_archived' => ' — déjà archivée',
+        'archiving' => 'Archivage…',
+        'archive_year' => 'Archiver l\'année',
+        'schedule_title' => 'Planification automatique',
+        'frequency' => 'Fréquence',
+        'freq_none' => 'Désactivée',
+        'freq_daily' => 'Quotidienne',
+        'freq_weekly' => 'Hebdomadaire',
+        'time' => 'Heure',
+        'day' => 'Jour',
+        'retention' => 'Rétention (nb conservés)',
+        'formats_generated' => 'Formats générés',
+        'schedule_hint_before' => 'La planification nécessite que le planificateur Laravel tourne sur le serveur',
+        'schedule_hint_after' => 'via cron, chaque minute).',
+        'save_schedule' => 'Enregistrer la planification',
+        'restore_title' => 'Restaurer la base de données',
+        'restore_warn_before' => 'La restauration',
+        'restore_warn_bold' => 'écrase les données actuelles',
+        'restore_warn_after' => 'avec le contenu du fichier. Une sauvegarde de sécurité (JSON) est créée automatiquement avant l\'opération.',
+        'restoring' => 'Restauration…',
+        'restore' => 'Restaurer',
+        'restore_one_table' => 'Restaurer une seule table (optionnel)',
+        'all_tables' => 'Toute la base',
+        'restore_table_hint_before' => 'La restauration ciblée par table n\'est disponible qu\'avec les fichiers',
+        'restore_table_hint_after' => '(ou .json.gz) et n\'écrase que la table choisie.',
+        'accepted_formats' => 'Formats acceptés : .json, .sql, .gz (compressé), .dump (PostgreSQL) ou .zip (base + médias) issus de cette application — max 200 Mo.',
+        'history_title' => 'Historique des sauvegardes',
+        'th_file' => 'Fichier',
+        'th_format' => 'Format',
+        'th_size' => 'Taille',
+        'th_origin' => 'Origine',
+        'th_status' => 'Statut',
+        'th_date' => 'Date',
+        'empty' => 'Aucune sauvegarde pour le moment.',
+        'badge_archive' => 'Archive',
+        'badge_media' => '+ médias',
+        'origin_scheduled' => 'Planifiée',
+        'origin_manual' => 'Manuelle',
+        'status_ok' => 'OK',
+        'status_fail' => 'Échec',
+        'verify_integrity' => 'Vérifier l\'intégrité',
+        'restore_confirm_title' => 'Confirmer la restauration ?',
+        'restore_confirm_desc' => 'Toutes les données actuelles seront remplacées par le contenu de « :name ». Une sauvegarde de sécurité est créée avant. Cette action est irréversible.',
+        'restore_now' => 'Restaurer maintenant',
+        'delete_title' => 'Supprimer cette sauvegarde ?',
+        'delete_desc' => 'Le fichier sera définitivement supprimé du stockage.',
+    ],
 ];
diff --git a/resources/js/pages/Parametres/Backups.tsx b/resources/js/pages/Parametres/Backups.tsx
index 44e3d8c1..379a4589 100644
--- a/resources/js/pages/Parametres/Backups.tsx
+++ b/resources/js/pages/Parametres/Backups.tsx
@@ -14,6 +14,7 @@ import { Input } from '@/components/ui/input';
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface BackupRow {
@@ -29,14 +30,13 @@ interface Props { backups: BackupRow[]; settings: Settings; storageDriver: strin
 
 const ALL_TABLES = '__all__';
 
-const DAYS = [
-    { v: '1', l: 'Lundi' }, { v: '2', l: 'Mardi' }, { v: '3', l: 'Mercredi' },
-    { v: '4', l: 'Jeudi' }, { v: '5', l: 'Vendredi' }, { v: '6', l: 'Samedi' }, { v: '7', l: 'Dimanche' },
-];
-
-const fmtSize = (b: number) => b > 1048576 ? `${(b / 1048576).toFixed(1)} Mo` : `${Math.max(1, Math.round(b / 1024))} Ko`;
+const DAY_KEYS = ['1', '2', '3', '4', '5', '6', '7'] as const;
 
 export default function Backups({ backups, settings, storageDriver, academicYears, tables }: Readonly<Props>) {
+    const { t } = useTranslation();
+    const fmtSize = (b: number) => b > 1048576
+        ? t('parametres.backups.size_mb', { n: (b / 1048576).toFixed(1) })
+        : t('parametres.backups.size_kb', { n: Math.max(1, Math.round(b / 1024)) });
     const [deleteId, setDeleteId] = useState<string | null>(null);
     const [restoreTable, setRestoreTable] = useState<string>(ALL_TABLES);
     const [runFormats, setRunFormats] = useState<string[]>(['json', 'sql']);
@@ -103,14 +103,14 @@ export default function Backups({ backups, settings, storageDriver, academicYear
 
     return (
         <AppLayout>
-            <Head title="Sauvegardes" />
+            <Head title={t('parametres.backups.head')} />
             <div className="w-full space-y-6">
 
                 <div>
                     <h1 className="text-3xl font-bold tracking-tight text-gray-900 flex items-center gap-2">
-                        <DatabaseBackup className="w-7 h-7 text-blue-600" /> Sauvegardes
+                        <DatabaseBackup className="w-7 h-7 text-blue-600" /> {t('parametres.backups.title')}
                     </h1>
-                    <p className="mt-2 text-gray-500">Sauvegardez la base de données (JSON / SQL) et planifiez des sauvegardes automatiques.</p>
+                    <p className="mt-2 text-gray-500">{t('parametres.backups.subtitle')}</p>
                 </div>
 
                 {/* Destination de stockage */}
@@ -118,12 +118,12 @@ export default function Backups({ backups, settings, storageDriver, academicYear
                     {isRemote ? <Cloud className="w-5 h-5 text-emerald-600" /> : <HardDrive className="w-5 h-5 text-amber-600" />}
                     <div className="text-sm">
                         <p className="font-semibold text-gray-900">
-                            Destination : {isRemote ? 'Dépôt distant (S3 / R2)' : 'Stockage local du serveur'}
+                            {t('parametres.backups.dest_label')} {isRemote ? t('parametres.backups.dest_remote') : t('parametres.backups.dest_local')}
                         </p>
                         <p className="text-gray-500">
                             {isRemote
-                                ? 'Les sauvegardes sont envoyées sur votre stockage cloud configuré.'
-                                : 'Configurez un stockage S3/R2 dans « Fichiers & Stockage » pour externaliser les sauvegardes.'}
+                                ? t('parametres.backups.dest_remote_desc')
+                                : t('parametres.backups.dest_local_desc')}
                         </p>
                     </div>
                 </div>
@@ -131,7 +131,7 @@ export default function Backups({ backups, settings, storageDriver, academicYear
                 {/* Sauvegarde manuelle */}
                 <div className="bg-white rounded-2xl shadow-sm ring-1 ring-gray-100 p-5">
                     <h2 className="font-semibold text-gray-900 flex items-center gap-2 mb-4">
-                        <Play className="w-4 h-4 text-blue-600" /> Sauvegarder maintenant
+                        <Play className="w-4 h-4 text-blue-600" /> {t('parametres.backups.manual_title')}
                     </h2>
                     <div className="flex flex-wrap items-center gap-6">
                         <div className="flex items-center gap-4">
@@ -144,42 +144,41 @@ export default function Backups({ backups, settings, storageDriver, academicYear
                         </div>
                         <label className="flex items-center gap-2 text-sm cursor-pointer">
                             <Checkbox checked={withMedia} onCheckedChange={() => setWithMedia(v => !v)} />
-                            <span className="font-medium text-gray-700">Inclure les médias (documents, photos)</span>
+                            <span className="font-medium text-gray-700">{t('parametres.backups.include_media')}</span>
                         </label>
                         <Button onClick={runNow} disabled={running || runFormats.length === 0} className="bg-blue-600 hover:bg-blue-700 gap-2">
-                            <Database className="w-4 h-4" /> {running ? 'Sauvegarde…' : 'Lancer la sauvegarde'}
+                            <Database className="w-4 h-4" /> {running ? t('parametres.backups.running') : t('parametres.backups.run_backup')}
                         </Button>
                     </div>
                     <p className="mt-3 text-xs text-gray-400">
-                        Avec les médias, la sauvegarde est produite au format <strong>.zip</strong> (base + fichiers uploadés). Sinon, seule la base est sauvegardée.
+                        {t('parametres.backups.manual_hint_before')} <strong>.zip</strong> {t('parametres.backups.manual_hint_after')}
                     </p>
                 </div>
 
                 {/* Archive d'année scolaire */}
                 <div className="bg-white rounded-2xl shadow-sm ring-1 ring-gray-100 p-5">
                     <h2 className="font-semibold text-gray-900 flex items-center gap-2 mb-1">
-                        <Archive className="w-4 h-4 text-cyan-600" /> Archiver une année scolaire
+                        <Archive className="w-4 h-4 text-cyan-600" /> {t('parametres.backups.archive_title')}
                     </h2>
                     <p className="text-sm text-gray-500 mb-4">
-                        Génère un instantané complet <strong>verrouillé</strong> et conservé à long terme (exclu de la rétention automatique).
-                        L'archive est aussi créée automatiquement à la clôture d'une année.
+                        {t('parametres.backups.archive_desc_before')} <strong>{t('parametres.backups.archive_desc_locked')}</strong> {t('parametres.backups.archive_desc_after')}
                     </p>
                     <div className="flex flex-wrap items-end gap-3">
                         <div className="space-y-1.5 min-w-56">
-                            <label className="text-sm font-medium text-gray-700">Année scolaire</label>
+                            <label className="text-sm font-medium text-gray-700">{t('parametres.backups.academic_year')}</label>
                             <Select value={archiveYear} onValueChange={setArchiveYear}>
-                                <SelectTrigger><SelectValue placeholder="Choisir une année…" /></SelectTrigger>
+                                <SelectTrigger><SelectValue placeholder={t('parametres.backups.choose_year')} /></SelectTrigger>
                                 <SelectContent>
                                     {academicYears.map(y => (
                                         <SelectItem key={y.id} value={y.id} disabled={y.archived}>
-                                            {y.year}{y.archived ? ' — déjà archivée' : ''}
+                                            {y.year}{y.archived ? t('parametres.backups.already_archived') : ''}
                                         </SelectItem>
                                     ))}
                                 </SelectContent>
                             </Select>
                         </div>
                         <Button onClick={runArchive} disabled={archiving || !archiveYear} className="bg-cyan-600 hover:bg-cyan-700 gap-2">
-                            <Archive className="w-4 h-4" /> {archiving ? 'Archivage…' : "Archiver l'année"}
+                            <Archive className="w-4 h-4" /> {archiving ? t('parametres.backups.archiving') : t('parametres.backups.archive_year')}
                         </Button>
                     </div>
                 </div>
@@ -187,42 +186,42 @@ export default function Backups({ backups, settings, storageDriver, academicYear
                 {/* Planification */}
                 <form onSubmit={saveSchedule} className="bg-white rounded-2xl shadow-sm ring-1 ring-gray-100 p-5 space-y-4">
                     <h2 className="font-semibold text-gray-900 flex items-center gap-2">
-                        <Clock className="w-4 h-4 text-indigo-600" /> Planification automatique
+                        <Clock className="w-4 h-4 text-indigo-600" /> {t('parametres.backups.schedule_title')}
                     </h2>
                     <div className="grid sm:grid-cols-2 lg:grid-cols-4 gap-4">
                         <div className="space-y-1.5">
-                            <label className="text-sm font-medium text-gray-700">Fréquence</label>
+                            <label className="text-sm font-medium text-gray-700">{t('parametres.backups.frequency')}</label>
                             <Select value={data.frequency} onValueChange={v => setData('frequency', v)}>
                                 <SelectTrigger><SelectValue /></SelectTrigger>
                                 <SelectContent>
-                                    <SelectItem value="none">Désactivée</SelectItem>
-                                    <SelectItem value="daily">Quotidienne</SelectItem>
-                                    <SelectItem value="weekly">Hebdomadaire</SelectItem>
+                                    <SelectItem value="none">{t('parametres.backups.freq_none')}</SelectItem>
+                                    <SelectItem value="daily">{t('parametres.backups.freq_daily')}</SelectItem>
+                                    <SelectItem value="weekly">{t('parametres.backups.freq_weekly')}</SelectItem>
                                 </SelectContent>
                             </Select>
                         </div>
                         <div className="space-y-1.5">
-                            <label className="text-sm font-medium text-gray-700">Heure</label>
+                            <label className="text-sm font-medium text-gray-700">{t('parametres.backups.time')}</label>
                             <Input type="time" value={data.time} onChange={e => setData('time', e.target.value)} />
                         </div>
                         {data.frequency === 'weekly' && (
                             <div className="space-y-1.5">
-                                <label className="text-sm font-medium text-gray-700">Jour</label>
+                                <label className="text-sm font-medium text-gray-700">{t('parametres.backups.day')}</label>
                                 <Select value={data.day_of_week} onValueChange={v => setData('day_of_week', v)}>
                                     <SelectTrigger><SelectValue /></SelectTrigger>
                                     <SelectContent>
-                                        {DAYS.map(d => <SelectItem key={d.v} value={d.v}>{d.l}</SelectItem>)}
+                                        {DAY_KEYS.map(d => <SelectItem key={d} value={d}>{t(`parametres.backups.day_${d}`)}</SelectItem>)}
                                     </SelectContent>
                                 </Select>
                             </div>
                         )}
                         <div className="space-y-1.5">
-                            <label className="text-sm font-medium text-gray-700">Rétention (nb conservés)</label>
+                            <label className="text-sm font-medium text-gray-700">{t('parametres.backups.retention')}</label>
                             <Input type="number" min={0} max={365} value={data.retention} onChange={e => setData('retention', e.target.value)} />
                         </div>
                     </div>
                     <div className="space-y-1.5">
-                        <label className="text-sm font-medium text-gray-700">Formats générés</label>
+                        <label className="text-sm font-medium text-gray-700">{t('parametres.backups.formats_generated')}</label>
                         <div className="flex items-center gap-4">
                             {['json', 'sql'].map(f => (
                                 <label key={f} className="flex items-center gap-2 text-sm cursor-pointer">
@@ -233,24 +232,23 @@ export default function Backups({ backups, settings, storageDriver, academicYear
                         </div>
                     </div>
                     <p className="text-xs text-gray-400">
-                        La planification nécessite que le planificateur Laravel tourne sur le serveur
-                        (<code>php artisan schedule:run</code> via cron, chaque minute).
+                        {t('parametres.backups.schedule_hint_before')}
+                        (<code>php artisan schedule:run</code> {t('parametres.backups.schedule_hint_after')}
                     </p>
                     <div className="flex justify-end">
-                        <Button type="submit" disabled={processing} className="bg-indigo-600 hover:bg-indigo-700">Enregistrer la planification</Button>
+                        <Button type="submit" disabled={processing} className="bg-indigo-600 hover:bg-indigo-700">{t('parametres.backups.save_schedule')}</Button>
                     </div>
                 </form>
 
                 {/* Restauration */}
                 <div className="bg-white rounded-2xl shadow-sm ring-1 ring-red-100 p-5 space-y-4">
                     <h2 className="font-semibold text-gray-900 flex items-center gap-2">
-                        <Upload className="w-4 h-4 text-red-600" /> Restaurer la base de données
+                        <Upload className="w-4 h-4 text-red-600" /> {t('parametres.backups.restore_title')}
                     </h2>
                     <div className="flex items-start gap-3 rounded-xl bg-red-50 ring-1 ring-red-100 p-3 text-sm">
                         <AlertTriangle className="w-5 h-5 text-red-600 shrink-0 mt-0.5" />
                         <p className="text-red-700">
-                            La restauration <strong>écrase les données actuelles</strong> avec le contenu du fichier.
-                            Une sauvegarde de sécurité (JSON) est créée automatiquement avant l'opération.
+                            {t('parametres.backups.restore_warn_before')} <strong>{t('parametres.backups.restore_warn_bold')}</strong> {t('parametres.backups.restore_warn_after')}
                         </p>
                     </div>
                     <div className="flex flex-wrap items-center gap-3">
@@ -266,66 +264,66 @@ export default function Backups({ backups, settings, storageDriver, academicYear
                             disabled={!restoreFile || restoring}
                             className="bg-red-600 hover:bg-red-700 gap-2"
                         >
-                            <Upload className="w-4 h-4" /> {restoring ? 'Restauration…' : 'Restaurer'}
+                            <Upload className="w-4 h-4" /> {restoring ? t('parametres.backups.restoring') : t('parametres.backups.restore')}
                         </Button>
                     </div>
                     <div className="space-y-1.5 max-w-md">
-                        <label className="text-sm font-medium text-gray-700">Restaurer une seule table (optionnel)</label>
+                        <label className="text-sm font-medium text-gray-700">{t('parametres.backups.restore_one_table')}</label>
                         <Select value={restoreTable} onValueChange={setRestoreTable}>
                             <SelectTrigger><SelectValue /></SelectTrigger>
                             <SelectContent>
-                                <SelectItem value={ALL_TABLES}>Toute la base</SelectItem>
-                                {tables.map(t => <SelectItem key={t} value={t}>{t}</SelectItem>)}
+                                <SelectItem value={ALL_TABLES}>{t('parametres.backups.all_tables')}</SelectItem>
+                                {tables.map(tbl => <SelectItem key={tbl} value={tbl}>{tbl}</SelectItem>)}
                             </SelectContent>
                         </Select>
                         <p className="text-xs text-gray-400">
-                            La restauration ciblée par table n'est disponible qu'avec les fichiers <strong>.json</strong> (ou .json.gz) et n'écrase que la table choisie.
+                            {t('parametres.backups.restore_table_hint_before')} <strong>.json</strong> {t('parametres.backups.restore_table_hint_after')}
                         </p>
                     </div>
-                    <p className="text-xs text-gray-400">Formats acceptés : .json, .sql, .gz (compressé), .dump (PostgreSQL) ou .zip (base + médias) issus de cette application — max 200 Mo.</p>
+                    <p className="text-xs text-gray-400">{t('parametres.backups.accepted_formats')}</p>
                 </div>
 
                 {/* Historique */}
                 <div className="bg-white rounded-2xl shadow-sm ring-1 ring-gray-100 overflow-hidden">
-                    <h2 className="font-semibold text-gray-900 px-5 pt-5 pb-3">Historique des sauvegardes</h2>
+                    <h2 className="font-semibold text-gray-900 px-5 pt-5 pb-3">{t('parametres.backups.history_title')}</h2>
                     <Table>
                         <TableHeader className="bg-gray-50">
                             <TableRow>
-                                <TableHead>Fichier</TableHead>
-                                <TableHead>Format</TableHead>
-                                <TableHead>Taille</TableHead>
-                                <TableHead>Origine</TableHead>
-                                <TableHead>Statut</TableHead>
-                                <TableHead>Date</TableHead>
-                                <TableHead className="text-center w-28">Actions</TableHead>
+                                <TableHead>{t('parametres.backups.th_file')}</TableHead>
+                                <TableHead>{t('parametres.backups.th_format')}</TableHead>
+                                <TableHead>{t('parametres.backups.th_size')}</TableHead>
+                                <TableHead>{t('parametres.backups.th_origin')}</TableHead>
+                                <TableHead>{t('parametres.backups.th_status')}</TableHead>
+                                <TableHead>{t('parametres.backups.th_date')}</TableHead>
+                                <TableHead className="text-center w-28">{t('parametres.common.actions')}</TableHead>
                             </TableRow>
                         </TableHeader>
                         <TableBody>
                             {backups.length === 0 ? (
-                                <TableRow><TableCell colSpan={7} className="py-12 text-center text-gray-400">Aucune sauvegarde pour le moment.</TableCell></TableRow>
+                                <TableRow><TableCell colSpan={7} className="py-12 text-center text-gray-400">{t('parametres.backups.empty')}</TableCell></TableRow>
                             ) : backups.map(b => (
                                 <TableRow key={b.id} className="hover:bg-gray-50">
                                     <TableCell className="font-mono text-xs text-gray-700">
                                         {b.filename}
                                         {b.locked && (
                                             <span className="ml-2 inline-flex items-center gap-1 rounded-full bg-cyan-50 px-2 py-0.5 font-sans text-[11px] font-medium text-cyan-700 ring-1 ring-cyan-100">
-                                                <Lock className="w-3 h-3" /> {b.label ?? 'Archive'}
+                                                <Lock className="w-3 h-3" /> {b.label ?? t('parametres.backups.badge_archive')}
                                             </span>
                                         )}
                                         {b.includes_media && (
                                             <span className="ml-2 inline-flex items-center gap-1 rounded-full bg-violet-50 px-2 py-0.5 font-sans text-[11px] font-medium text-violet-700 ring-1 ring-violet-100">
-                                                <Archive className="w-3 h-3" /> + médias
+                                                <Archive className="w-3 h-3" /> {t('parametres.backups.badge_media')}
                                             </span>
                                         )}
                                     </TableCell>
                                     <TableCell><span className="text-xs font-bold uppercase text-blue-600">{b.format}</span></TableCell>
                                     <TableCell className="text-sm text-gray-600">{b.status === 'completed' ? fmtSize(b.size) : '—'}</TableCell>
-                                    <TableCell className="text-xs text-gray-500">{b.scheduled ? 'Planifiée' : (b.created_by ?? 'Manuelle')}</TableCell>
+                                    <TableCell className="text-xs text-gray-500">{b.scheduled ? t('parametres.backups.origin_scheduled') : (b.created_by ?? t('parametres.backups.origin_manual'))}</TableCell>
                                     <TableCell>
                                         {b.status === 'completed' ? (
-                                            <span className="inline-flex items-center gap-1 text-xs text-emerald-600"><CheckCircle2 className="w-3.5 h-3.5" /> OK</span>
+                                            <span className="inline-flex items-center gap-1 text-xs text-emerald-600"><CheckCircle2 className="w-3.5 h-3.5" /> {t('parametres.backups.status_ok')}</span>
                                         ) : (
-                                            <span className="inline-flex items-center gap-1 text-xs text-red-600" title={b.error ?? ''}><AlertCircle className="w-3.5 h-3.5" /> Échec</span>
+                                            <span className="inline-flex items-center gap-1 text-xs text-red-600" title={b.error ?? ''}><AlertCircle className="w-3.5 h-3.5" /> {t('parametres.backups.status_fail')}</span>
                                         )}
                                     </TableCell>
                                     <TableCell className="text-sm text-gray-600">{b.created_at}</TableCell>
@@ -338,7 +336,7 @@ export default function Backups({ backups, settings, storageDriver, academicYear
                                             )}
                                             {b.status === 'completed' && b.checksum && (
                                                 <Button variant="outline" size="sm" className="text-xs text-emerald-600 border-emerald-200 hover:bg-emerald-50"
-                                                    title="Vérifier l'intégrité"
+                                                    title={t('parametres.backups.verify_integrity')}
                                                     onClick={() => router.post(route('backups.verify', b.id), {}, { preserveScroll: true })}>
                                                     <ShieldCheck className="w-3.5 h-3.5" />
                                                 </Button>
@@ -358,16 +356,15 @@ export default function Backups({ backups, settings, storageDriver, academicYear
             <AlertDialog open={restoreConfirm} onOpenChange={setRestoreConfirm}>
                 <AlertDialogContent>
                     <AlertDialogHeader>
-                        <AlertDialogTitle>Confirmer la restauration ?</AlertDialogTitle>
+                        <AlertDialogTitle>{t('parametres.backups.restore_confirm_title')}</AlertDialogTitle>
                         <AlertDialogDescription>
-                            Toutes les données actuelles seront remplacées par le contenu de
-                            « {restoreFile?.name} ». Une sauvegarde de sécurité est créée avant. Cette action est irréversible.
+                            {t('parametres.backups.restore_confirm_desc', { name: restoreFile?.name ?? '' })}
                         </AlertDialogDescription>
                     </AlertDialogHeader>
                     <div className="flex justify-end gap-2">
-                        <AlertDialogCancel>Annuler</AlertDialogCancel>
+                        <AlertDialogCancel>{t('parametres.common.cancel')}</AlertDialogCancel>
                         <AlertDialogAction className="bg-red-600 hover:bg-red-700" onClick={runRestore}>
-                            Restaurer maintenant
+                            {t('parametres.backups.restore_now')}
                         </AlertDialogAction>
                     </div>
                 </AlertDialogContent>
@@ -376,13 +373,13 @@ export default function Backups({ backups, settings, storageDriver, academicYear
             <AlertDialog open={!!deleteId} onOpenChange={() => setDeleteId(null)}>
                 <AlertDialogContent>
                     <AlertDialogHeader>
-                        <AlertDialogTitle>Supprimer cette sauvegarde ?</AlertDialogTitle>
-                        <AlertDialogDescription>Le fichier sera définitivement supprimé du stockage.</AlertDialogDescription>
+                        <AlertDialogTitle>{t('parametres.backups.delete_title')}</AlertDialogTitle>
+                        <AlertDialogDescription>{t('parametres.backups.delete_desc')}</AlertDialogDescription>
                     </AlertDialogHeader>
                     <div className="flex justify-end gap-2">
-                        <AlertDialogCancel>Annuler</AlertDialogCancel>
+                        <AlertDialogCancel>{t('parametres.common.cancel')}</AlertDialogCancel>
                         <AlertDialogAction className="bg-red-600 hover:bg-red-700" onClick={() => deleteId && router.delete(route('backups.destroy', deleteId), { preserveScroll: true, onSuccess: () => setDeleteId(null) })}>
-                            Supprimer
+                            {t('parametres.common.delete')}
                         </AlertDialogAction>
                     </div>
                 </AlertDialogContent>
diff --git a/resources/js/pages/Parametres/FileStorage.tsx b/resources/js/pages/Parametres/FileStorage.tsx
index 6a3dc47f..faeaf9f0 100644
--- a/resources/js/pages/Parametres/FileStorage.tsx
+++ b/resources/js/pages/Parametres/FileStorage.tsx
@@ -6,6 +6,7 @@ import { Button } from '@/components/ui/button';
 import { Input } from '@/components/ui/input';
 import { useToast } from '@/components/ui/toast';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface Settings {
@@ -25,6 +26,7 @@ interface Props {
 }
 
 export default function FileStorage({ settings, hasKey, hasSecret }: Readonly<Props>) {
+    const { t } = useTranslation();
     // Les credentials arrivent masqués : on part de champs vides pour ne pas
     // renvoyer la valeur masquée au serveur (qui la conserverait telle quelle).
     const { data, setData, post, processing, errors } = useForm<Settings>({
@@ -38,8 +40,8 @@ export default function FileStorage({ settings, hasKey, hasSecret }: Readonly<Pr
     const handleSubmit = (e: React.FormEvent) => {
         e.preventDefault();
         post(route('file-storage.update'), {
-            onSuccess: () => toast({ title: 'Configuration sauvegardée', description: 'Les paramètres de stockage ont été mis à jour.', variant: 'success' }),
-            onError:   () => toast({ title: 'Erreur', description: 'Vérifiez les champs et réessayez.', variant: 'error' }),
+            onSuccess: () => toast({ title: t('parametres.file_storage.toast_saved_title'), description: t('parametres.file_storage.toast_saved_desc'), variant: 'success' }),
+            onError:   () => toast({ title: t('parametres.file_storage.toast_error_title'), description: t('parametres.file_storage.toast_error_desc'), variant: 'error' }),
         });
     };
 
@@ -54,16 +56,16 @@ export default function FileStorage({ settings, hasKey, hasSecret }: Readonly<Pr
             );
             if (res.data?.success) {
                 toast({
-                    title: 'Connexion réussie',
-                    description: `Le disque "${res.data.driver}" est accessible et fonctionnel.`,
+                    title: t('parametres.file_storage.toast_test_ok_title'),
+                    description: t('parametres.file_storage.toast_test_ok_desc', { driver: res.data.driver }),
                     variant: 'success',
                 });
             } else {
-                toast({ title: 'Connexion échouée', description: res.data?.error ?? 'Erreur inconnue.', variant: 'error' });
+                toast({ title: t('parametres.file_storage.toast_test_fail_title'), description: res.data?.error ?? t('parametres.file_storage.toast_unknown_error'), variant: 'error' });
             }
         } catch (err: any) {
-            const message = err?.response?.data?.error ?? err?.message ?? 'Impossible de joindre le stockage.';
-            toast({ title: 'Connexion échouée', description: message, variant: 'error' });
+            const message = err?.response?.data?.error ?? err?.message ?? t('parametres.file_storage.toast_unreachable');
+            toast({ title: t('parametres.file_storage.toast_test_fail_title'), description: message, variant: 'error' });
         } finally {
             setTesting(false);
         }
@@ -73,12 +75,12 @@ export default function FileStorage({ settings, hasKey, hasSecret }: Readonly<Pr
 
     return (
         <AppLayout>
-            <Head title="Fichiers & Stockage" />
+            <Head title={t('parametres.file_storage.head')} />
             <div className="w-full space-y-6">
 
                 <div>
-                    <h1 className="text-4xl font-bold tracking-tight text-gray-900 flex items-center gap-3"><HardDrive className="h-7 w-7 text-blue-600 shrink-0" />Fichiers & Stockage</h1>
-                    <p className="mt-2 text-gray-500">Configurez où les fichiers uploadés (logos, documents) seront stockés.</p>
+                    <h1 className="text-4xl font-bold tracking-tight text-gray-900 flex items-center gap-3"><HardDrive className="h-7 w-7 text-blue-600 shrink-0" />{t('parametres.file_storage.title')}</h1>
+                    <p className="mt-2 text-gray-500">{t('parametres.file_storage.subtitle')}</p>
                 </div>
 
                 <form onSubmit={handleSubmit} className="space-y-6">
@@ -86,8 +88,8 @@ export default function FileStorage({ settings, hasKey, hasSecret }: Readonly<Pr
                     {/* Choix du driver */}
                     <div className="grid grid-cols-2 gap-4">
                         {([
-                            { value: 'local', label: 'Stockage local',   desc: 'Fichiers sur le serveur Laravel (public/storage)',    Icon: HardDrive,   ring: 'ring-blue-500',   bg: 'bg-blue-50',   iconBg: 'bg-blue-100',   iconColor: 'text-blue-600' },
-                            { value: 's3',    label: 'Stockage cloud S3', desc: 'AWS S3, Cloudflare R2, MinIO ou compatible S3',       Icon: CloudUpload, ring: 'ring-violet-500', bg: 'bg-violet-50', iconBg: 'bg-violet-100', iconColor: 'text-violet-600' },
+                            { value: 'local', label: t('parametres.file_storage.driver_local'),   desc: t('parametres.file_storage.driver_local_desc'),    Icon: HardDrive,   ring: 'ring-blue-500',   bg: 'bg-blue-50',   iconBg: 'bg-blue-100',   iconColor: 'text-blue-600' },
+                            { value: 's3',    label: t('parametres.file_storage.driver_s3'), desc: t('parametres.file_storage.driver_s3_desc'),       Icon: CloudUpload, ring: 'ring-violet-500', bg: 'bg-violet-50', iconBg: 'bg-violet-100', iconColor: 'text-violet-600' },
                         ] as const).map(opt => {
                             const active = data.driver === opt.value;
                             return (
@@ -112,13 +114,13 @@ export default function FileStorage({ settings, hasKey, hasSecret }: Readonly<Pr
                         <div className="rounded-2xl bg-violet-50/60 ring-1 ring-violet-100 p-6 space-y-4">
                             <h2 className="text-base font-semibold text-gray-900 flex items-center gap-2">
                                 <CloudUpload className="w-4 h-4 text-violet-600" />
-                                Configuration S3 / Cloudflare R2
+                                {t('parametres.file_storage.s3_section')}
                             </h2>
 
                             <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
                                 <div className="space-y-1.5">
                                     <label className="text-sm font-medium text-gray-700">
-                                        Access Key {hasKey ? <span className="text-gray-400 font-normal">(laisser vide pour conserver)</span> : '*'}
+                                        {t('parametres.file_storage.access_key')} {hasKey ? <span className="text-gray-400 font-normal">{t('parametres.file_storage.keep_hint')}</span> : '*'}
                                     </label>
                                     <Input value={data.s3_key} onChange={e => setData('s3_key', e.target.value)} placeholder={hasKey ? (settings.s3_key || '••••••••') : 'AKIAIOSFODNN7EXAMPLE'} className={errors.s3_key ? 'border-red-400' : ''} />
                                     {errors.s3_key && <p className="text-xs text-red-500">{errors.s3_key}</p>}
@@ -126,44 +128,44 @@ export default function FileStorage({ settings, hasKey, hasSecret }: Readonly<Pr
 
                                 <div className="space-y-1.5">
                                     <label className="text-sm font-medium text-gray-700">
-                                        Secret Key {hasSecret ? <span className="text-gray-400 font-normal">(laisser vide pour conserver)</span> : '*'}
+                                        {t('parametres.file_storage.secret_key')} {hasSecret ? <span className="text-gray-400 font-normal">{t('parametres.file_storage.keep_hint')}</span> : '*'}
                                     </label>
                                     <Input type="password" value={data.s3_secret} onChange={e => setData('s3_secret', e.target.value)} placeholder={hasSecret ? '••••••••' : 'wJalrXUtnFEMI...'} className={errors.s3_secret ? 'border-red-400' : ''} />
                                     {errors.s3_secret && <p className="text-xs text-red-500">{errors.s3_secret}</p>}
                                 </div>
 
                                 <div className="space-y-1.5">
-                                    <label className="text-sm font-medium text-gray-700">Bucket *</label>
+                                    <label className="text-sm font-medium text-gray-700">{t('parametres.file_storage.bucket')}</label>
                                     <Input value={data.s3_bucket} onChange={e => setData('s3_bucket', e.target.value)} placeholder="mon-bucket" className={errors.s3_bucket ? 'border-red-400' : ''} />
                                     {errors.s3_bucket && <p className="text-xs text-red-500">{errors.s3_bucket}</p>}
                                 </div>
 
                                 <div className="space-y-1.5">
-                                    <label className="text-sm font-medium text-gray-700">Région *</label>
-                                    <Input value={data.s3_region} onChange={e => setData('s3_region', e.target.value)} placeholder="auto (R2) ou eu-west-1 (AWS)" className={errors.s3_region ? 'border-red-400' : ''} />
+                                    <label className="text-sm font-medium text-gray-700">{t('parametres.file_storage.region')}</label>
+                                    <Input value={data.s3_region} onChange={e => setData('s3_region', e.target.value)} placeholder={t('parametres.file_storage.region_ph')} className={errors.s3_region ? 'border-red-400' : ''} />
                                     {errors.s3_region && <p className="text-xs text-red-500">{errors.s3_region}</p>}
                                 </div>
 
                                 <div className="space-y-1.5 md:col-span-2">
                                     <label className="text-sm font-medium text-gray-700">
-                                        Endpoint <span className="text-gray-400 font-normal">(R2/MinIO — laisser vide pour AWS)</span>
+                                        {t('parametres.file_storage.endpoint')} <span className="text-gray-400 font-normal">{t('parametres.file_storage.endpoint_hint')}</span>
                                     </label>
                                     <Input value={data.s3_endpoint} onChange={e => setData('s3_endpoint', e.target.value)} placeholder="https://<account_id>.r2.cloudflarestorage.com" />
                                 </div>
 
                                 <div className="space-y-1.5 md:col-span-2">
                                     <label className="text-sm font-medium text-gray-700">
-                                        URL publique <span className="text-gray-400 font-normal">(CDN ou domaine custom)</span>
+                                        {t('parametres.file_storage.public_url')} <span className="text-gray-400 font-normal">{t('parametres.file_storage.public_url_hint')}</span>
                                     </label>
                                     <Input value={data.s3_url} onChange={e => setData('s3_url', e.target.value)} placeholder="https://files.monecole.tg" />
                                 </div>
                             </div>
 
                             <div className="rounded-xl bg-white/70 ring-1 ring-violet-100 p-4 text-xs text-gray-500 space-y-1">
-                                <p className="font-semibold text-gray-700">Cloudflare R2 (recommandé)</p>
-                                <p>• Région : <code className="bg-gray-100 px-1 rounded">auto</code></p>
-                                <p>• Endpoint : <code className="bg-gray-100 px-1 rounded">https://{'<ACCOUNT_ID>'}.r2.cloudflarestorage.com</code></p>
-                                <p>• Aucun frais de bande passante sortante (idéal Afrique)</p>
+                                <p className="font-semibold text-gray-700">{t('parametres.file_storage.r2_title')}</p>
+                                <p>{t('parametres.file_storage.r2_region')} <code className="bg-gray-100 px-1 rounded">auto</code></p>
+                                <p>{t('parametres.file_storage.r2_endpoint')} <code className="bg-gray-100 px-1 rounded">https://{'<ACCOUNT_ID>'}.r2.cloudflarestorage.com</code></p>
+                                <p>{t('parametres.file_storage.r2_bandwidth')}</p>
                             </div>
                         </div>
                     )}
@@ -173,8 +175,8 @@ export default function FileStorage({ settings, hasKey, hasSecret }: Readonly<Pr
                         <div className="rounded-xl bg-blue-50 ring-1 ring-blue-100 p-4 flex gap-3 text-sm text-blue-700">
                             <ServerCrash className="w-5 h-5 shrink-0 mt-0.5" />
                             <div>
-                                <p className="font-semibold">Stockage local actif</p>
-                                <p className="text-blue-600 mt-0.5">Les fichiers sont stockés dans <code className="bg-blue-100 px-1 rounded">storage/app/public/</code> et servis via <code className="bg-blue-100 px-1 rounded">/storage/</code>.</p>
+                                <p className="font-semibold">{t('parametres.file_storage.local_active')}</p>
+                                <p className="text-blue-600 mt-0.5">{t('parametres.file_storage.local_active_before')} <code className="bg-blue-100 px-1 rounded">storage/app/public/</code> {t('parametres.file_storage.local_active_middle')} <code className="bg-blue-100 px-1 rounded">/storage/</code>.</p>
                             </div>
                         </div>
                     )}
@@ -183,12 +185,12 @@ export default function FileStorage({ settings, hasKey, hasSecret }: Readonly<Pr
                     <div className="flex items-center justify-between pt-2">
                         <Button type="button" variant="outline" onClick={handleTest} disabled={testing} className="gap-2">
                             {testing ? <Loader2 className="w-4 h-4 animate-spin" /> : <HardDrive className="w-4 h-4" />}
-                            Tester la connexion
+                            {t('parametres.file_storage.test_connection')}
                         </Button>
 
                         <Button type="submit" disabled={processing} className="bg-blue-600 hover:bg-blue-700 gap-2">
                             {processing ? <Loader2 className="w-4 h-4 animate-spin" /> : null}
-                            Enregistrer
+                            {t('parametres.file_storage.save')}
                         </Button>
                     </div>
                 </form>

From 23620702186fe6551aa1a270c1b51f9bec1b2618 Mon Sep 17 00:00:00 2001
From: horacioskrp <hervekudayah@gmail.com>
Date: Fri, 13 Nov 2026 10:01:43 +0000
Subject: [PATCH 07/12] =?UTF-8?q?feat(i18n):=20param=C3=A8tres=20=E2=80=94?=
 =?UTF-8?q?=20ann=C3=A9es=20scolaires=20(liste,=20cr=C3=A9ation,=20=C3=A9d?=
 =?UTF-8?q?ition,=20d=C3=A9tail)=20(FR/EN)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 lang/en/parametres.php                        | 51 ++++++++++++++++
 lang/fr/parametres.php                        | 51 ++++++++++++++++
 .../pages/Parametres/AcademicYears/Create.tsx | 26 ++++----
 .../pages/Parametres/AcademicYears/Edit.tsx   | 26 ++++----
 .../pages/Parametres/AcademicYears/Index.tsx  | 59 ++++++++++---------
 .../pages/Parametres/AcademicYears/Show.tsx   | 55 +++++++++--------
 6 files changed, 190 insertions(+), 78 deletions(-)

diff --git a/lang/en/parametres.php b/lang/en/parametres.php
index ee015706..1c5b4025 100644
--- a/lang/en/parametres.php
+++ b/lang/en/parametres.php
@@ -605,4 +605,55 @@
         'delete_title' => 'Delete this backup?',
         'delete_desc' => 'The file will be permanently deleted from storage.',
     ],
+
+    'academic_years' => [
+        'head' => 'Academic years',
+        'title' => 'Academic years',
+        'subtitle' => 'Manage academic years',
+        'new' => 'New year',
+        'stat_total' => 'Total years',
+        'stat_active' => 'Active years',
+        'stat_page' => 'Page',
+        'search_ph' => 'Search for a year...',
+        'th_year' => 'Year',
+        'th_start' => 'Start date',
+        'th_end' => 'End date',
+        'th_status' => 'Status',
+        'status_active' => 'Active',
+        'status_inactive' => 'Inactive',
+        'empty' => 'No academic year found',
+        'delete_title' => 'Confirm deletion',
+        'delete_desc' => 'Are you sure you want to delete this academic year? This action is irreversible.',
+        'deleting' => 'Deleting...',
+        'create_head' => 'Create an academic year',
+        'create_title' => 'Create a new academic year',
+        'edit_head' => 'Edit :year',
+        'edit_title' => 'Edit :year',
+        'section_period' => 'Academic period',
+        'label_year' => 'Year',
+        'year_ph' => 'e.g. 2025-2026',
+        'label_start' => 'Start date',
+        'label_end' => 'End date',
+        'section_activation' => 'Activation',
+        'active_label' => 'Active year',
+        'active_hint' => 'Check this box if it is the current academic year',
+        'submit_create' => 'Create academic year',
+        'info_title' => 'Academic year information',
+        'field_status' => 'Status',
+        'field_status_active' => 'Active',
+        'field_status_inactive' => 'Inactive',
+        'period_title' => 'Period',
+        'period_from' => 'From',
+        'period_to' => 'To',
+        'history_title' => 'History',
+        'stats_title' => 'Statistics',
+        'stats_classes' => 'Classes',
+        'stats_students' => 'Enrolled students',
+        'stats_teachers' => 'Teachers',
+        'state_title' => 'State',
+        'state_active_title' => 'Current year',
+        'state_active_desc' => 'This year is currently active',
+        'state_inactive_title' => 'Inactive year',
+        'state_inactive_desc' => 'This year is not active',
+    ],
 ];
diff --git a/lang/fr/parametres.php b/lang/fr/parametres.php
index ae7060c8..d560ebac 100644
--- a/lang/fr/parametres.php
+++ b/lang/fr/parametres.php
@@ -605,4 +605,55 @@
         'delete_title' => 'Supprimer cette sauvegarde ?',
         'delete_desc' => 'Le fichier sera définitivement supprimé du stockage.',
     ],
+
+    'academic_years' => [
+        'head' => 'Années académiques',
+        'title' => 'Années académiques',
+        'subtitle' => 'Gérez les années académiques',
+        'new' => 'Nouvelle année',
+        'stat_total' => 'Années totales',
+        'stat_active' => 'Années actives',
+        'stat_page' => 'Page',
+        'search_ph' => 'Rechercher une année...',
+        'th_year' => 'Année',
+        'th_start' => 'Date de début',
+        'th_end' => 'Date de fin',
+        'th_status' => 'Statut',
+        'status_active' => 'Active',
+        'status_inactive' => 'Inactive',
+        'empty' => 'Aucune année académique trouvée',
+        'delete_title' => 'Confirmer la suppression',
+        'delete_desc' => 'Êtes-vous sûr de vouloir supprimer cette année académique ? Cette action est irréversible.',
+        'deleting' => 'Suppression...',
+        'create_head' => 'Créer une année académique',
+        'create_title' => 'Créer une nouvelle année académique',
+        'edit_head' => 'Modifier :year',
+        'edit_title' => 'Modifier :year',
+        'section_period' => 'Période académique',
+        'label_year' => 'Année',
+        'year_ph' => 'Ex: 2025-2026',
+        'label_start' => 'Date de début',
+        'label_end' => 'Date de fin',
+        'section_activation' => 'Activation',
+        'active_label' => 'Année active',
+        'active_hint' => 'Cochez cette case si c\'est l\'année académique en cours',
+        'submit_create' => 'Créer l\'année académique',
+        'info_title' => 'Informations de l\'année académique',
+        'field_status' => 'Statut',
+        'field_status_active' => 'Active',
+        'field_status_inactive' => 'Inactive',
+        'period_title' => 'Période',
+        'period_from' => 'Du',
+        'period_to' => 'Au',
+        'history_title' => 'Historique',
+        'stats_title' => 'Statistiques',
+        'stats_classes' => 'Classes',
+        'stats_students' => 'Étudiants inscrits',
+        'stats_teachers' => 'Enseignants',
+        'state_title' => 'État',
+        'state_active_title' => 'Année en cours',
+        'state_active_desc' => 'Cette année est actuellement active',
+        'state_inactive_title' => 'Année inactive',
+        'state_inactive_desc' => 'Cette année n\'est pas active',
+    ],
 ];
diff --git a/resources/js/pages/Parametres/AcademicYears/Create.tsx b/resources/js/pages/Parametres/AcademicYears/Create.tsx
index b503ba6f..6690494e 100644
--- a/resources/js/pages/Parametres/AcademicYears/Create.tsx
+++ b/resources/js/pages/Parametres/AcademicYears/Create.tsx
@@ -4,9 +4,11 @@ import { useState } from 'react';
 import { Button } from '@/components/ui/button';
 import { Input } from '@/components/ui/input';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 export default function Create() {
+    const { t } = useTranslation();
     const [formData, setFormData] = useState({
         year: '',
         start_date: '',
@@ -34,7 +36,7 @@ export default function Create() {
 
     return (
         <AppLayout>
-            <Head title="Créer une année académique" />
+            <Head title={t('parametres.academic_years.create_head')} />
 
             <div className="space-y-6">
                 {/* Header */}
@@ -47,7 +49,7 @@ export default function Create() {
                     </button>
                     <div>
                         <h1 className="text-3xl font-bold text-gray-900">
-                            Créer une nouvelle année académique
+                            {t('parametres.academic_years.create_title')}
                         </h1>
                     </div>
                 </div>
@@ -57,18 +59,18 @@ export default function Create() {
                         <div className="rounded-2xl bg-linear-to-br from-indigo-50 to-white ring-1 ring-indigo-100 p-6 shadow-sm space-y-4">
                             <div className="flex items-center gap-2 text-indigo-700">
                                 <CalendarDays className="h-4 w-4" />
-                                <p className="text-sm font-semibold">Période académique</p>
+                                <p className="text-sm font-semibold">{t('parametres.academic_years.section_period')}</p>
                             </div>
                             <div>
                                 <label htmlFor="year" className="block text-sm font-medium text-gray-900 mb-2">
-                                    Année *
+                                    {t('parametres.academic_years.label_year')} *
                                 </label>
                                 <Input
                                     id="year"
                                     type="text"
                                     value={formData.year}
                                     onChange={(e) => setFormData(prev => ({ ...prev, year: e.target.value }))}
-                                    placeholder="Ex: 2025-2026"
+                                    placeholder={t('parametres.academic_years.year_ph')}
                                     className={errors.year ? 'border-red-500 bg-white/90' : 'border-slate-200 bg-white/90'}
                                 />
                                 {errors.year && (
@@ -78,7 +80,7 @@ export default function Create() {
 
                             <div>
                                 <label htmlFor="start_date" className="block text-sm font-medium text-gray-900 mb-2">
-                                    Date de début *
+                                    {t('parametres.academic_years.label_start')} *
                                 </label>
                                 <Input
                                     id="start_date"
@@ -94,7 +96,7 @@ export default function Create() {
 
                             <div>
                                 <label htmlFor="end_date" className="block text-sm font-medium text-gray-900 mb-2">
-                                    Date de fin *
+                                    {t('parametres.academic_years.label_end')} *
                                 </label>
                                 <Input
                                     id="end_date"
@@ -112,7 +114,7 @@ export default function Create() {
                         <div className="rounded-2xl bg-linear-to-br from-emerald-50 to-white ring-1 ring-emerald-100 p-6 shadow-sm space-y-4">
                             <div className="flex items-center gap-2 text-emerald-700">
                                 <ToggleLeft className="h-4 w-4" />
-                                <p className="text-sm font-semibold">Activation</p>
+                                <p className="text-sm font-semibold">{t('parametres.academic_years.section_activation')}</p>
                             </div>
                             <div>
                                 <label className="flex items-center gap-2 cursor-pointer">
@@ -123,11 +125,11 @@ export default function Create() {
                                         className="w-4 h-4 text-blue-600 border-slate-300 rounded focus:ring-blue-500"
                                     />
                                     <span className="text-sm font-medium text-gray-900">
-                                        Année active
+                                        {t('parametres.academic_years.active_label')}
                                     </span>
                                 </label>
                                 <p className="text-sm text-gray-500 mt-3">
-                                    Cochez cette case si c'est l'année académique en cours
+                                    {t('parametres.academic_years.active_hint')}
                                 </p>
                             </div>
                         </div>
@@ -140,7 +142,7 @@ export default function Create() {
                             disabled={isSubmitting}
                             className="bg-blue-600 hover:bg-blue-700"
                         >
-                            {isSubmitting ? 'Création...' : 'Créer l\'année académique'}
+                            {isSubmitting ? t('parametres.common.creating') : t('parametres.academic_years.submit_create')}
                         </Button>
                         <Button
                             type="button"
@@ -148,7 +150,7 @@ export default function Create() {
                             className="border-slate-200"
                             onClick={() => router.get(route('academic-years.index'))}
                         >
-                            Annuler
+                            {t('parametres.common.cancel')}
                         </Button>
                     </div>
                 </form>
diff --git a/resources/js/pages/Parametres/AcademicYears/Edit.tsx b/resources/js/pages/Parametres/AcademicYears/Edit.tsx
index 068fc20d..75319678 100644
--- a/resources/js/pages/Parametres/AcademicYears/Edit.tsx
+++ b/resources/js/pages/Parametres/AcademicYears/Edit.tsx
@@ -4,6 +4,7 @@ import { useState } from 'react';
 import { Button } from '@/components/ui/button';
 import { Input } from '@/components/ui/input';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface AcademicYear {
@@ -19,6 +20,7 @@ interface EditProps {
 }
 
 export default function Edit({ academicYear }: Readonly<EditProps>) {
+    const { t } = useTranslation();
     const [formData, setFormData] = useState({
         year: academicYear.year,
         start_date: academicYear.start_date,
@@ -46,7 +48,7 @@ export default function Edit({ academicYear }: Readonly<EditProps>) {
 
     return (
         <AppLayout>
-            <Head title={`Modifier ${academicYear.year}`} />
+            <Head title={t('parametres.academic_years.edit_head', { year: academicYear.year })} />
 
             <div className="space-y-6">
                 {/* Header */}
@@ -59,7 +61,7 @@ export default function Edit({ academicYear }: Readonly<EditProps>) {
                     </button>
                     <div>
                         <h1 className="text-3xl font-bold text-gray-900">
-                            Modifier {academicYear.year}
+                            {t('parametres.academic_years.edit_title', { year: academicYear.year })}
                         </h1>
                     </div>
                 </div>
@@ -69,18 +71,18 @@ export default function Edit({ academicYear }: Readonly<EditProps>) {
                         <div className="rounded-2xl bg-linear-to-br from-indigo-50 to-white ring-1 ring-indigo-100 p-6 shadow-sm space-y-4">
                             <div className="flex items-center gap-2 text-indigo-700">
                                 <CalendarDays className="h-4 w-4" />
-                                <p className="text-sm font-semibold">Période académique</p>
+                                <p className="text-sm font-semibold">{t('parametres.academic_years.section_period')}</p>
                             </div>
                             <div>
                                 <label htmlFor="year" className="block text-sm font-medium text-gray-900 mb-2">
-                                    Année *
+                                    {t('parametres.academic_years.label_year')} *
                                 </label>
                                 <Input
                                     id="year"
                                     type="text"
                                     value={formData.year}
                                     onChange={(e) => setFormData(prev => ({ ...prev, year: e.target.value }))}
-                                    placeholder="Ex: 2025-2026"
+                                    placeholder={t('parametres.academic_years.year_ph')}
                                     className={errors.year ? 'border-red-500 bg-white/90' : 'border-slate-200 bg-white/90'}
                                 />
                                 {errors.year && (
@@ -90,7 +92,7 @@ export default function Edit({ academicYear }: Readonly<EditProps>) {
 
                             <div>
                                 <label htmlFor="start_date" className="block text-sm font-medium text-gray-900 mb-2">
-                                    Date de début *
+                                    {t('parametres.academic_years.label_start')} *
                                 </label>
                                 <Input
                                     id="start_date"
@@ -106,7 +108,7 @@ export default function Edit({ academicYear }: Readonly<EditProps>) {
 
                             <div>
                                 <label htmlFor="end_date" className="block text-sm font-medium text-gray-900 mb-2">
-                                    Date de fin *
+                                    {t('parametres.academic_years.label_end')} *
                                 </label>
                                 <Input
                                     id="end_date"
@@ -124,7 +126,7 @@ export default function Edit({ academicYear }: Readonly<EditProps>) {
                         <div className="rounded-2xl bg-linear-to-br from-emerald-50 to-white ring-1 ring-emerald-100 p-6 shadow-sm space-y-4">
                             <div className="flex items-center gap-2 text-emerald-700">
                                 <ToggleLeft className="h-4 w-4" />
-                                <p className="text-sm font-semibold">Activation</p>
+                                <p className="text-sm font-semibold">{t('parametres.academic_years.section_activation')}</p>
                             </div>
                             <div>
                                 <label className="flex items-center gap-2 cursor-pointer">
@@ -135,11 +137,11 @@ export default function Edit({ academicYear }: Readonly<EditProps>) {
                                         className="w-4 h-4 text-blue-600 border-slate-300 rounded focus:ring-blue-500"
                                     />
                                     <span className="text-sm font-medium text-gray-900">
-                                        Année active
+                                        {t('parametres.academic_years.active_label')}
                                     </span>
                                 </label>
                                 <p className="text-sm text-gray-500 mt-3">
-                                    Cochez cette case si c'est l'année académique en cours
+                                    {t('parametres.academic_years.active_hint')}
                                 </p>
                             </div>
                         </div>
@@ -152,7 +154,7 @@ export default function Edit({ academicYear }: Readonly<EditProps>) {
                             disabled={isSubmitting}
                             className="bg-blue-600 hover:bg-blue-700"
                         >
-                            {isSubmitting ? 'Mise à jour...' : 'Mettre à jour'}
+                            {isSubmitting ? t('parametres.common.updating') : t('parametres.common.update')}
                         </Button>
                         <Button
                             type="button"
@@ -160,7 +162,7 @@ export default function Edit({ academicYear }: Readonly<EditProps>) {
                             className="border-slate-200"
                             onClick={() => router.get(route('academic-years.index'))}
                         >
-                            Annuler
+                            {t('parametres.common.cancel')}
                         </Button>
                     </div>
                 </form>
diff --git a/resources/js/pages/Parametres/AcademicYears/Index.tsx b/resources/js/pages/Parametres/AcademicYears/Index.tsx
index 2d997ddb..8f57c1df 100644
--- a/resources/js/pages/Parametres/AcademicYears/Index.tsx
+++ b/resources/js/pages/Parametres/AcademicYears/Index.tsx
@@ -22,6 +22,7 @@ import {
     TableRow,
 } from '@/components/ui/table';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface AcademicYear {
@@ -51,6 +52,8 @@ interface IndexProps {
 }
 
 export default function Index({ academicYears, filters }: Readonly<IndexProps>) {
+    const { t, locale } = useTranslation();
+    const dateLocale = locale === 'en' ? 'en-GB' : 'fr-FR';
     const [deleteConfirm, setDeleteConfirm] = useState<string | null>(null);
     const [isDeleting, setIsDeleting] = useState(false);
     const [searchQuery, setSearchQuery] = useState(filters.search || '');
@@ -87,21 +90,21 @@ export default function Index({ academicYears, filters }: Readonly<IndexProps>)
 
     const statsCards = [
         {
-            title: 'Années totales',
+            title: t('parametres.academic_years.stat_total'),
             value: academicYears.total,
             icon: Calendar,
             bgColor: 'bg-blue-50',
             textColor: 'text-blue-600',
         },
         {
-            title: 'Années actives',
+            title: t('parametres.academic_years.stat_active'),
             value: activeYears,
             icon: CheckCircle2,
             bgColor: 'bg-green-50',
             textColor: 'text-green-600',
         },
         {
-            title: 'Page',
+            title: t('parametres.academic_years.stat_page'),
             value: `${academicYears.current_page}/${academicYears.last_page}`,
             icon: Calendar,
             bgColor: 'bg-purple-50',
@@ -110,7 +113,7 @@ export default function Index({ academicYears, filters }: Readonly<IndexProps>)
     ];
 
     const formatDate = (dateString: string) => {
-        return new Date(dateString).toLocaleDateString('fr-FR', {
+        return new Date(dateString).toLocaleDateString(dateLocale, {
             day: '2-digit',
             month: '2-digit',
             year: 'numeric'
@@ -119,17 +122,17 @@ export default function Index({ academicYears, filters }: Readonly<IndexProps>)
 
     return (
         <AppLayout>
-            <Head title="Années académiques" />
+            <Head title={t('parametres.academic_years.head')} />
 
             <div className="space-y-6">
                 {/* Header */}
                 <div className="flex items-start justify-between">
                     <div>
                         <h1 className="text-4xl font-bold tracking-tight text-gray-900 flex items-center gap-3"><Calendar className="h-7 w-7 text-blue-600 shrink-0" />
-                            Années académiques
+                            {t('parametres.academic_years.title')}
                         </h1>
                         <p className="mt-2 text-lg text-gray-600">
-                            Gérez les années académiques
+                            {t('parametres.academic_years.subtitle')}
                         </p>
                     </div>
                     <Button 
@@ -137,7 +140,7 @@ export default function Index({ academicYears, filters }: Readonly<IndexProps>)
                         className="gap-2 bg-blue-600 hover:bg-blue-700"
                     >
                         <Plus className="w-5 h-5" />
-                        Nouvelle année
+                        {t('parametres.academic_years.new')}
                     </Button>
                 </div>
 
@@ -175,7 +178,7 @@ export default function Index({ academicYears, filters }: Readonly<IndexProps>)
                             <Search className="absolute left-3 top-1/2 -translate-y-1/2 w-5 h-5 text-gray-400" />
                             <Input
                                 type="text"
-                                placeholder="Rechercher une année..."
+                                placeholder={t('parametres.academic_years.search_ph')}
                                 value={searchQuery}
                                 onChange={(e) => setSearchQuery(e.target.value)}
                                 onKeyDown={(e) => {
@@ -198,7 +201,7 @@ export default function Index({ academicYears, filters }: Readonly<IndexProps>)
                             onClick={handleSearch}
                             className="bg-blue-600 hover:bg-blue-700"
                         >
-                            Rechercher
+                            {t('parametres.common.search')}
                         </Button>
                     </div>
                 </div>
@@ -208,18 +211,18 @@ export default function Index({ academicYears, filters }: Readonly<IndexProps>)
                     <Table>
                         <TableHeader>
                             <TableRow className="bg-gray-50">
-                                <TableHead className="font-semibold text-gray-900">Année</TableHead>
-                                <TableHead className="font-semibold text-gray-900">Date de début</TableHead>
-                                <TableHead className="font-semibold text-gray-900">Date de fin</TableHead>
-                                <TableHead className="font-semibold text-gray-900">Statut</TableHead>
-                                <TableHead className="text-right font-semibold text-gray-900">Actions</TableHead>
+                                <TableHead className="font-semibold text-gray-900">{t('parametres.academic_years.th_year')}</TableHead>
+                                <TableHead className="font-semibold text-gray-900">{t('parametres.academic_years.th_start')}</TableHead>
+                                <TableHead className="font-semibold text-gray-900">{t('parametres.academic_years.th_end')}</TableHead>
+                                <TableHead className="font-semibold text-gray-900">{t('parametres.academic_years.th_status')}</TableHead>
+                                <TableHead className="text-right font-semibold text-gray-900">{t('parametres.common.actions')}</TableHead>
                             </TableRow>
                         </TableHeader>
                         <TableBody>
                             {academicYears.data.length === 0 ? (
                                 <TableRow>
                                     <TableCell colSpan={5} className="text-center py-8 text-gray-500">
-                                        Aucune année académique trouvée
+                                        {t('parametres.academic_years.empty')}
                                     </TableCell>
                                 </TableRow>
                             ) : (
@@ -242,32 +245,32 @@ export default function Index({ academicYears, filters }: Readonly<IndexProps>)
                                             {academicYear.active ? (
                                                 <span className="inline-flex items-center gap-1 px-3 py-1 rounded-full text-sm font-medium bg-green-100 text-green-700">
                                                     <CheckCircle2 className="w-4 h-4" />
-                                                    Active
+                                                    {t('parametres.academic_years.status_active')}
                                                 </span>
                                             ) : (
                                                 <span className="inline-flex items-center px-3 py-1 rounded-full text-sm font-medium bg-gray-100 text-gray-700">
-                                                    Inactive
+                                                    {t('parametres.academic_years.status_inactive')}
                                                 </span>
                                             )}
                                         </TableCell>
                                         <TableCell className="text-right">
                                             <div className="flex justify-end gap-2">
                                                 <IconButton
-                                                    label="Voir"
+                                                    label={t('parametres.common.view')}
                                                     variant="ghost"
                                                     icon={<Eye className="w-4 h-4" />}
                                                     onClick={() => router.get(route('academic-years.show', academicYear.id))}
                                                     className="text-blue-600 hover:text-blue-700 hover:bg-blue-50"
                                                 />
                                                 <IconButton
-                                                    label="Modifier"
+                                                    label={t('parametres.common.edit')}
                                                     variant="ghost"
                                                     icon={<Pencil className="w-4 h-4" />}
                                                     onClick={() => router.get(route('academic-years.edit', academicYear.id))}
                                                     className="text-gray-600 hover:text-gray-700 hover:bg-gray-50"
                                                 />
                                                 <IconButton
-                                                    label="Supprimer"
+                                                    label={t('parametres.common.delete')}
                                                     variant="ghost"
                                                     icon={<Trash2 className="w-4 h-4" />}
                                                     onClick={() => setDeleteConfirm(academicYear.id)}
@@ -286,7 +289,7 @@ export default function Index({ academicYears, filters }: Readonly<IndexProps>)
                 {academicYears.last_page > 1 && (
                     <div className="flex items-center justify-between bg-white rounded-lg shadow-sm p-4 border border-gray-200">
                         <div className="text-sm text-gray-600">
-                            Affichage de {academicYears.from} à {academicYears.to} sur {academicYears.total} résultats
+                            {t('parametres.common.showing', { from: academicYears.from, to: academicYears.to, total: academicYears.total })}
                         </div>
                         <div className="flex items-center gap-2">
                             <Button
@@ -302,7 +305,7 @@ export default function Index({ academicYears, filters }: Readonly<IndexProps>)
                                 className="gap-1"
                             >
                                 <ChevronLeft className="w-4 h-4" />
-                                Précédent
+                                {t('parametres.common.prev')}
                             </Button>
 
                             <div className="flex gap-1">
@@ -349,7 +352,7 @@ export default function Index({ academicYears, filters }: Readonly<IndexProps>)
                                 disabled={academicYears.current_page === academicYears.last_page}
                                 className="gap-1"
                             >
-                                Suivant
+                                {t('parametres.common.next')}
                                 <ChevronRight className="w-4 h-4" />
                             </Button>
                         </div>
@@ -361,19 +364,19 @@ export default function Index({ academicYears, filters }: Readonly<IndexProps>)
             <AlertDialog open={!!deleteConfirm} onOpenChange={() => setDeleteConfirm(null)}>
                 <AlertDialogContent>
                     <AlertDialogHeader>
-                        <AlertDialogTitle>Confirmer la suppression</AlertDialogTitle>
+                        <AlertDialogTitle>{t('parametres.academic_years.delete_title')}</AlertDialogTitle>
                         <AlertDialogDescription>
-                            Êtes-vous sûr de vouloir supprimer cette année académique ? Cette action est irréversible.
+                            {t('parametres.academic_years.delete_desc')}
                         </AlertDialogDescription>
                     </AlertDialogHeader>
                     <div className="flex justify-end gap-3">
-                        <AlertDialogCancel disabled={isDeleting}>Annuler</AlertDialogCancel>
+                        <AlertDialogCancel disabled={isDeleting}>{t('parametres.common.cancel')}</AlertDialogCancel>
                         <AlertDialogAction
                             onClick={() => deleteConfirm && handleDelete(deleteConfirm)}
                             disabled={isDeleting}
                             className="bg-red-600 hover:bg-red-700"
                         >
-                            {isDeleting ? 'Suppression...' : 'Supprimer'}
+                            {isDeleting ? t('parametres.academic_years.deleting') : t('parametres.common.delete')}
                         </AlertDialogAction>
                     </div>
                 </AlertDialogContent>
diff --git a/resources/js/pages/Parametres/AcademicYears/Show.tsx b/resources/js/pages/Parametres/AcademicYears/Show.tsx
index 1aeafeb8..ecbc0db1 100644
--- a/resources/js/pages/Parametres/AcademicYears/Show.tsx
+++ b/resources/js/pages/Parametres/AcademicYears/Show.tsx
@@ -2,6 +2,7 @@ import { Head, router } from '@inertiajs/react';
 import { ArrowLeft, Calendar, CheckCircle2, Clock, FileText, XCircle } from 'lucide-react';
 import { Button } from '@/components/ui/button';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface AcademicYear {
@@ -19,8 +20,10 @@ interface ShowProps {
 }
 
 export default function Show({ academicYear }: Readonly<ShowProps>) {
+    const { t, locale } = useTranslation();
+    const dateLocale = locale === 'en' ? 'en-GB' : 'fr-FR';
     const formatDate = (date: string) => {
-        return new Date(date).toLocaleDateString('fr-FR', {
+        return new Date(date).toLocaleDateString(dateLocale, {
             year: 'numeric',
             month: 'long',
             day: 'numeric'
@@ -28,7 +31,7 @@ export default function Show({ academicYear }: Readonly<ShowProps>) {
     };
 
     const formatDateShort = (date: string) => {
-        return new Date(date).toLocaleDateString('fr-FR', {
+        return new Date(date).toLocaleDateString(dateLocale, {
             day: '2-digit',
             month: '2-digit',
             year: 'numeric'
@@ -61,12 +64,12 @@ export default function Show({ academicYear }: Readonly<ShowProps>) {
                                     {academicYear.active ? (
                                         <span className="inline-flex items-center gap-1 px-3 py-1 bg-green-100 text-green-800 text-sm font-medium rounded-full">
                                             <CheckCircle2 className="w-4 h-4" />
-                                            Année active
+                                            {t('parametres.academic_years.active_label')}
                                         </span>
                                     ) : (
                                         <span className="inline-flex items-center gap-1 px-3 py-1 bg-gray-100 text-gray-800 text-sm font-medium rounded-full">
                                             <XCircle className="w-4 h-4" />
-                                            Inactive
+                                            {t('parametres.academic_years.status_inactive')}
                                         </span>
                                     )}
                                 </div>
@@ -77,7 +80,7 @@ export default function Show({ academicYear }: Readonly<ShowProps>) {
                         onClick={() => router.get(route('academic-years.edit', academicYear.id))}
                         className="bg-blue-600 hover:bg-blue-700"
                     >
-                        Modifier
+                        {t('parametres.common.edit')}
                     </Button>
                 </div>
 
@@ -87,27 +90,27 @@ export default function Show({ academicYear }: Readonly<ShowProps>) {
                         <div className="bg-white rounded-lg border p-6">
                             <h2 className="text-lg font-semibold text-gray-900 mb-4 flex items-center gap-2">
                                 <Calendar className="w-5 h-5 text-blue-600" />
-                                Informations de l'année académique
+                                {t('parametres.academic_years.info_title')}
                             </h2>
                             <div className="grid grid-cols-2 gap-4">
                                 <div>
-                                    <p className="text-sm text-gray-600">Année</p>
+                                    <p className="text-sm text-gray-600">{t('parametres.academic_years.th_year')}</p>
                                     <p className="font-medium text-gray-900 mt-1">{academicYear.year}</p>
                                 </div>
                                 <div>
-                                    <p className="text-sm text-gray-600">Statut</p>
+                                    <p className="text-sm text-gray-600">{t('parametres.academic_years.field_status')}</p>
                                     <p className="font-medium text-gray-900 mt-1">
-                                        {academicYear.active ? 'Active' : 'Inactive'}
+                                        {academicYear.active ? t('parametres.academic_years.field_status_active') : t('parametres.academic_years.field_status_inactive')}
                                     </p>
                                 </div>
                                 <div>
-                                    <p className="text-sm text-gray-600">Date de début</p>
+                                    <p className="text-sm text-gray-600">{t('parametres.academic_years.th_start')}</p>
                                     <p className="font-medium text-gray-900 mt-1">
                                         {formatDateShort(academicYear.start_date)}
                                     </p>
                                 </div>
                                 <div>
-                                    <p className="text-sm text-gray-600">Date de fin</p>
+                                    <p className="text-sm text-gray-600">{t('parametres.academic_years.th_end')}</p>
                                     <p className="font-medium text-gray-900 mt-1">
                                         {formatDateShort(academicYear.end_date)}
                                     </p>
@@ -119,19 +122,19 @@ export default function Show({ academicYear }: Readonly<ShowProps>) {
                         <div className="bg-white rounded-lg border p-6">
                             <h2 className="text-lg font-semibold text-gray-900 mb-4 flex items-center gap-2">
                                 <Clock className="w-5 h-5 text-blue-600" />
-                                Période
+                                {t('parametres.academic_years.period_title')}
                             </h2>
                             <div className="bg-blue-50 rounded-lg p-4">
                                 <div className="flex items-center justify-between">
                                     <div>
-                                        <p className="text-sm text-gray-600">Du</p>
+                                        <p className="text-sm text-gray-600">{t('parametres.academic_years.period_from')}</p>
                                         <p className="text-lg font-bold text-blue-600 mt-1">
                                             {formatDate(academicYear.start_date)}
                                         </p>
                                     </div>
                                     <div className="w-12 h-0.5 bg-blue-300"></div>
                                     <div>
-                                        <p className="text-sm text-gray-600">Au</p>
+                                        <p className="text-sm text-gray-600">{t('parametres.academic_years.period_to')}</p>
                                         <p className="text-lg font-bold text-blue-600 mt-1">
                                             {formatDate(academicYear.end_date)}
                                         </p>
@@ -144,20 +147,20 @@ export default function Show({ academicYear }: Readonly<ShowProps>) {
                         <div className="bg-white rounded-lg border p-6">
                             <h2 className="text-lg font-semibold text-gray-900 mb-4 flex items-center gap-2">
                                 <FileText className="w-5 h-5 text-blue-600" />
-                                Historique
+                                {t('parametres.academic_years.history_title')}
                             </h2>
                             <div className="space-y-3">
                                 <div className="flex items-start gap-3">
                                     <div className="w-2 h-2 bg-blue-600 rounded-full mt-2"></div>
                                     <div>
-                                        <p className="text-sm text-gray-600">Créée le</p>
+                                        <p className="text-sm text-gray-600">{t('parametres.common.created_on')}</p>
                                         <p className="font-medium text-gray-900">{formatDate(academicYear.created_at)}</p>
                                     </div>
                                 </div>
                                 <div className="flex items-start gap-3">
                                     <div className="w-2 h-2 bg-gray-400 rounded-full mt-2"></div>
                                     <div>
-                                        <p className="text-sm text-gray-600">Dernière modification</p>
+                                        <p className="text-sm text-gray-600">{t('parametres.common.updated_on')}</p>
                                         <p className="font-medium text-gray-900">{formatDate(academicYear.updated_at)}</p>
                                     </div>
                                 </div>
@@ -168,18 +171,18 @@ export default function Show({ academicYear }: Readonly<ShowProps>) {
                     {/* Statistiques */}
                     <div className="lg:col-span-1 space-y-6">
                         <div className="bg-white rounded-lg border p-6">
-                            <h2 className="text-lg font-semibold text-gray-900 mb-4">Statistiques</h2>
+                            <h2 className="text-lg font-semibold text-gray-900 mb-4">{t('parametres.academic_years.stats_title')}</h2>
                             <div className="space-y-4">
                                 <div className="p-4 bg-blue-50 rounded-lg">
-                                    <p className="text-sm text-gray-600">Classes</p>
+                                    <p className="text-sm text-gray-600">{t('parametres.academic_years.stats_classes')}</p>
                                     <p className="text-2xl font-bold text-blue-600 mt-1">0</p>
                                 </div>
                                 <div className="p-4 bg-green-50 rounded-lg">
-                                    <p className="text-sm text-gray-600">Étudiants inscrits</p>
+                                    <p className="text-sm text-gray-600">{t('parametres.academic_years.stats_students')}</p>
                                     <p className="text-2xl font-bold text-green-600 mt-1">0</p>
                                 </div>
                                 <div className="p-4 bg-purple-50 rounded-lg">
-                                    <p className="text-sm text-gray-600">Enseignants</p>
+                                    <p className="text-sm text-gray-600">{t('parametres.academic_years.stats_teachers')}</p>
                                     <p className="text-2xl font-bold text-purple-600 mt-1">0</p>
                                 </div>
                             </div>
@@ -187,16 +190,16 @@ export default function Show({ academicYear }: Readonly<ShowProps>) {
 
                         {/* État */}
                         <div className="bg-white rounded-lg border p-6">
-                            <h2 className="text-lg font-semibold text-gray-900 mb-4">État</h2>
+                            <h2 className="text-lg font-semibold text-gray-900 mb-4">{t('parametres.academic_years.state_title')}</h2>
                             <div className={`p-4 rounded-lg ${academicYear.active ? 'bg-green-50' : 'bg-gray-50'}`}>
                                 <div className="flex items-center gap-2">
                                     {academicYear.active ? (
                                         <>
                                             <CheckCircle2 className="w-6 h-6 text-green-600" />
                                             <div>
-                                                <p className="font-semibold text-green-900">Année en cours</p>
+                                                <p className="font-semibold text-green-900">{t('parametres.academic_years.state_active_title')}</p>
                                                 <p className="text-sm text-green-700 mt-0.5">
-                                                    Cette année est actuellement active
+                                                    {t('parametres.academic_years.state_active_desc')}
                                                 </p>
                                             </div>
                                         </>
@@ -204,9 +207,9 @@ export default function Show({ academicYear }: Readonly<ShowProps>) {
                                         <>
                                             <XCircle className="w-6 h-6 text-gray-600" />
                                             <div>
-                                                <p className="font-semibold text-gray-900">Année inactive</p>
+                                                <p className="font-semibold text-gray-900">{t('parametres.academic_years.state_inactive_title')}</p>
                                                 <p className="text-sm text-gray-700 mt-0.5">
-                                                    Cette année n'est pas active
+                                                    {t('parametres.academic_years.state_inactive_desc')}
                                                 </p>
                                             </div>
                                         </>

From 3fd58d459d06db92db37e7d0a62b83c8001248df Mon Sep 17 00:00:00 2001
From: horacioskrp <hervekudayah@gmail.com>
Date: Fri, 13 Nov 2026 10:08:11 +0000
Subject: [PATCH 08/12] =?UTF-8?q?feat(i18n):=20param=C3=A8tres=20=E2=80=94?=
 =?UTF-8?q?=20p=C3=A9riodes=20acad=C3=A9miques=20(liste,=20cr=C3=A9ation,?=
 =?UTF-8?q?=20=C3=A9dition,=20d=C3=A9tail)=20(FR/EN)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 lang/en/parametres.php                        | 58 +++++++++++++++++
 lang/fr/parametres.php                        | 58 +++++++++++++++++
 .../Parametres/AcademicPeriods/Create.tsx     | 56 ++++++++--------
 .../pages/Parametres/AcademicPeriods/Edit.tsx | 54 +++++++--------
 .../Parametres/AcademicPeriods/Index.tsx      | 65 ++++++++++---------
 .../pages/Parametres/AcademicPeriods/Show.tsx | 42 ++++++------
 6 files changed, 229 insertions(+), 104 deletions(-)

diff --git a/lang/en/parametres.php b/lang/en/parametres.php
index 1c5b4025..36fdcf7b 100644
--- a/lang/en/parametres.php
+++ b/lang/en/parametres.php
@@ -656,4 +656,62 @@
         'state_inactive_title' => 'Inactive year',
         'state_inactive_desc' => 'This year is not active',
     ],
+
+    'academic_periods' => [
+        'head' => 'Academic periods',
+        'title' => 'Academic periods',
+        'subtitle' => 'Manage academic periods (terms and semesters)',
+        'new' => 'New period',
+        'stat_total' => 'Total periods',
+        'stat_active' => 'Active periods',
+        'stat_page' => 'Page',
+        'search_ph' => 'Search for a period...',
+        'th_name' => 'Name',
+        'th_year' => 'Year',
+        'th_type' => 'Type',
+        'th_order' => 'Order',
+        'th_period' => 'Period',
+        'th_status' => 'Status',
+        'type_trimester' => 'Term',
+        'type_semester' => 'Semester',
+        'status_active' => 'Active',
+        'status_inactive' => 'Inactive',
+        'empty' => 'No academic period found',
+        'delete_title' => 'Confirm deletion',
+        'delete_desc' => 'Are you sure you want to delete this academic period? This action is irreversible.',
+        'deleting' => 'Deleting...',
+        'create_head' => 'Create an academic period',
+        'create_title' => 'Create an academic period',
+        'create_subtitle' => 'Set the information for the new period.',
+        'edit_head' => 'Edit :name',
+        'edit_title' => 'Edit period',
+        'section_identification' => 'Identification',
+        'label_name' => 'Name',
+        'name_ph' => 'e.g. Term 1, Semester 1...',
+        'label_year' => 'Academic year',
+        'year_ph' => 'Select a year',
+        'section_classification' => 'Classification',
+        'label_type' => 'Type',
+        'label_order' => 'Order',
+        'order_ph' => '1, 2, 3...',
+        'label_class_type' => 'Class type',
+        'class_type_all' => 'All classes (global)',
+        'class_type_hint' => 'Leave "global" to apply to all class types.',
+        'label_weight' => 'Weight (annual average)',
+        'section_calendar' => 'Calendar',
+        'label_start' => 'Start date',
+        'label_end' => 'End date',
+        'section_details' => 'Details & Status',
+        'label_description' => 'Description',
+        'description_ph' => 'Period description...',
+        'active_label' => 'Active period (current)',
+        'submit_create' => 'Create period',
+        'saving' => 'Saving...',
+        'submit_update' => 'Save changes',
+        'info_title' => 'Period information',
+        'system_title' => 'System information',
+        'label_id' => 'Identifier',
+        'about_title' => 'About',
+        'about_desc' => 'Academic periods divide the school year into terms or semesters to organize assessment and student tracking.',
+    ],
 ];
diff --git a/lang/fr/parametres.php b/lang/fr/parametres.php
index d560ebac..62198a9b 100644
--- a/lang/fr/parametres.php
+++ b/lang/fr/parametres.php
@@ -656,4 +656,62 @@
         'state_inactive_title' => 'Année inactive',
         'state_inactive_desc' => 'Cette année n\'est pas active',
     ],
+
+    'academic_periods' => [
+        'head' => 'Périodes académiques',
+        'title' => 'Périodes académiques',
+        'subtitle' => 'Gérez les périodes académiques (trimestres et semestres)',
+        'new' => 'Nouvelle période',
+        'stat_total' => 'Périodes totales',
+        'stat_active' => 'Périodes actives',
+        'stat_page' => 'Page',
+        'search_ph' => 'Rechercher une période...',
+        'th_name' => 'Nom',
+        'th_year' => 'Année',
+        'th_type' => 'Type',
+        'th_order' => 'Ordre',
+        'th_period' => 'Période',
+        'th_status' => 'Statut',
+        'type_trimester' => 'Trimestre',
+        'type_semester' => 'Semestre',
+        'status_active' => 'Active',
+        'status_inactive' => 'Inactive',
+        'empty' => 'Aucune période académique trouvée',
+        'delete_title' => 'Confirmer la suppression',
+        'delete_desc' => 'Êtes-vous sûr de vouloir supprimer cette période académique ? Cette action est irréversible.',
+        'deleting' => 'Suppression...',
+        'create_head' => 'Créer une période académique',
+        'create_title' => 'Créer une période académique',
+        'create_subtitle' => 'Définissez les informations de la nouvelle période.',
+        'edit_head' => 'Modifier :name',
+        'edit_title' => 'Modifier la période',
+        'section_identification' => 'Identification',
+        'label_name' => 'Nom',
+        'name_ph' => 'Ex: Trimestre 1, Semestre 1...',
+        'label_year' => 'Année académique',
+        'year_ph' => 'Sélectionner une année',
+        'section_classification' => 'Classification',
+        'label_type' => 'Type',
+        'label_order' => 'Ordre',
+        'order_ph' => '1, 2, 3...',
+        'label_class_type' => 'Type de classe',
+        'class_type_all' => 'Toutes les classes (global)',
+        'class_type_hint' => 'Laisser « global » pour appliquer à tous les types de classe.',
+        'label_weight' => 'Poids (moyenne annuelle)',
+        'section_calendar' => 'Calendrier',
+        'label_start' => 'Date de début',
+        'label_end' => 'Date de fin',
+        'section_details' => 'Détails & Statut',
+        'label_description' => 'Description',
+        'description_ph' => 'Description de la période...',
+        'active_label' => 'Période active (en cours)',
+        'submit_create' => 'Créer la période',
+        'saving' => 'Enregistrement...',
+        'submit_update' => 'Enregistrer les modifications',
+        'info_title' => 'Informations de la période',
+        'system_title' => 'Informations système',
+        'label_id' => 'Identifiant',
+        'about_title' => 'À propos',
+        'about_desc' => 'Les périodes académiques permettent de diviser l\'année scolaire en trimestres ou semestres pour organiser l\'évaluation et le suivi des élèves.',
+    ],
 ];
diff --git a/resources/js/pages/Parametres/AcademicPeriods/Create.tsx b/resources/js/pages/Parametres/AcademicPeriods/Create.tsx
index 636a77ce..38cc307d 100644
--- a/resources/js/pages/Parametres/AcademicPeriods/Create.tsx
+++ b/resources/js/pages/Parametres/AcademicPeriods/Create.tsx
@@ -19,6 +19,7 @@ import { Input } from '@/components/ui/input';
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
 import { Textarea } from '@/components/ui/textarea';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface AcademicYear {
@@ -34,6 +35,7 @@ interface CreateProps {
 }
 
 export default function Create({ academicYears, classroomTypes = [] }: Readonly<CreateProps>) {
+    const { t } = useTranslation();
     const [formData, setFormData] = useState({
         name: '',
         description: '',
@@ -68,7 +70,7 @@ export default function Create({ academicYears, classroomTypes = [] }: Readonly<
 
     return (
         <AppLayout>
-            <Head title="Créer une période académique" />
+            <Head title={t('parametres.academic_periods.create_head')} />
 
             <div className="space-y-6">
                 {/* En-tête */}
@@ -82,9 +84,9 @@ export default function Create({ academicYears, classroomTypes = [] }: Readonly<
                     </button>
                     <div>
                         <h1 className="text-3xl font-bold tracking-tight text-gray-900">
-                            Créer une période académique
+                            {t('parametres.academic_periods.create_title')}
                         </h1>
-                        <p className="text-gray-500 mt-1 text-sm">Définissez les informations de la nouvelle période.</p>
+                        <p className="text-gray-500 mt-1 text-sm">{t('parametres.academic_periods.create_subtitle')}</p>
                     </div>
                 </div>
 
@@ -94,21 +96,21 @@ export default function Create({ academicYears, classroomTypes = [] }: Readonly<
                     <div className="rounded-2xl p-6 bg-linear-to-br from-indigo-50 to-blue-50 border border-indigo-100 shadow-sm">
                         <h2 className="text-base font-semibold text-indigo-800 mb-5 flex items-center gap-2">
                             <GraduationCap className="w-5 h-5 text-indigo-500" />
-                            Identification
+                            {t('parametres.academic_periods.section_identification')}
                         </h2>
                         <div className="grid grid-cols-1 md:grid-cols-2 gap-5">
                             {/* Nom */}
                             <div className="space-y-1.5">
                                 <label htmlFor="name" className="flex items-center gap-1.5 text-sm font-medium text-gray-700">
                                     <FileText className="w-4 h-4 text-indigo-400" />
-                                    Nom <span className="text-red-500">*</span>
+                                    {t('parametres.academic_periods.label_name')} <span className="text-red-500">*</span>
                                 </label>
                                 <Input
                                     id="name"
                                     type="text"
                                     value={formData.name}
                                     onChange={(e) => setFormData((prev) => ({ ...prev, name: e.target.value }))}
-                                    placeholder="Ex: Trimestre 1, Semestre 1..."
+                                    placeholder={t('parametres.academic_periods.name_ph')}
                                     className={errors.name ? 'border-red-400 bg-red-50/40 ring-1 ring-red-300' : 'border-indigo-200 bg-white focus-visible:ring-indigo-400'}
                                 />
                                 {errors.name && <p className="text-red-600 text-xs flex items-center gap-1"><X className="w-3 h-3" />{errors.name}</p>}
@@ -118,7 +120,7 @@ export default function Create({ academicYears, classroomTypes = [] }: Readonly<
                             <div className="space-y-1.5">
                                 <label htmlFor="academic_year_id" className="flex items-center gap-1.5 text-sm font-medium text-gray-700">
                                     <GraduationCap className="w-4 h-4 text-indigo-400" />
-                                    Année académique <span className="text-red-500">*</span>
+                                    {t('parametres.academic_periods.label_year')} <span className="text-red-500">*</span>
                                 </label>
                                 <Select
                                     value={formData.academic_year_id}
@@ -128,7 +130,7 @@ export default function Create({ academicYears, classroomTypes = [] }: Readonly<
                                         id="academic_year_id"
                                         className={`bg-white ${errors.academic_year_id ? 'border-red-400 ring-1 ring-red-300' : 'border-indigo-200'}`}
                                     >
-                                        <SelectValue placeholder="Sélectionner une année" />
+                                        <SelectValue placeholder={t('parametres.academic_periods.year_ph')} />
                                     </SelectTrigger>
                                     <SelectContent>
                                         {academicYears.map((year) => (
@@ -145,14 +147,14 @@ export default function Create({ academicYears, classroomTypes = [] }: Readonly<
                     <div className="rounded-2xl p-6 bg-linear-to-br from-violet-50 to-purple-50 border border-violet-100 shadow-sm">
                         <h2 className="text-base font-semibold text-violet-800 mb-5 flex items-center gap-2">
                             <Hash className="w-5 h-5 text-violet-500" />
-                            Classification
+                            {t('parametres.academic_periods.section_classification')}
                         </h2>
                         <div className="grid grid-cols-1 md:grid-cols-2 gap-5">
                             {/* Type */}
                             <div className="space-y-1.5">
                                 <label htmlFor="type" className="flex items-center gap-1.5 text-sm font-medium text-gray-700">
                                     <Hash className="w-4 h-4 text-violet-400" />
-                                    Type <span className="text-red-500">*</span>
+                                    {t('parametres.academic_periods.label_type')} <span className="text-red-500">*</span>
                                 </label>
                                 <Select
                                     value={formData.type}
@@ -165,8 +167,8 @@ export default function Create({ academicYears, classroomTypes = [] }: Readonly<
                                         <SelectValue />
                                     </SelectTrigger>
                                     <SelectContent>
-                                        <SelectItem value="trimestre">Trimestre</SelectItem>
-                                        <SelectItem value="semestre">Semestre</SelectItem>
+                                        <SelectItem value="trimestre">{t('parametres.academic_periods.type_trimester')}</SelectItem>
+                                        <SelectItem value="semestre">{t('parametres.academic_periods.type_semester')}</SelectItem>
                                     </SelectContent>
                                 </Select>
                                 {errors.type && <p className="text-red-600 text-xs flex items-center gap-1"><X className="w-3 h-3" />{errors.type}</p>}
@@ -176,7 +178,7 @@ export default function Create({ academicYears, classroomTypes = [] }: Readonly<
                             <div className="space-y-1.5">
                                 <label htmlFor="order" className="flex items-center gap-1.5 text-sm font-medium text-gray-700">
                                     <ListOrdered className="w-4 h-4 text-violet-400" />
-                                    Ordre
+                                    {t('parametres.academic_periods.label_order')}
                                 </label>
                                 <Input
                                     id="order"
@@ -184,7 +186,7 @@ export default function Create({ academicYears, classroomTypes = [] }: Readonly<
                                     min="1"
                                     value={formData.order}
                                     onChange={(e) => setFormData((prev) => ({ ...prev, order: e.target.value }))}
-                                    placeholder="1, 2, 3..."
+                                    placeholder={t('parametres.academic_periods.order_ph')}
                                     className={errors.order ? 'border-red-400 bg-red-50/40 ring-1 ring-red-300' : 'border-violet-200 bg-white focus-visible:ring-violet-400'}
                                 />
                                 {errors.order && <p className="text-red-600 text-xs flex items-center gap-1"><X className="w-3 h-3" />{errors.order}</p>}
@@ -194,7 +196,7 @@ export default function Create({ academicYears, classroomTypes = [] }: Readonly<
                             <div className="space-y-1.5">
                                 <label htmlFor="class_type_id" className="flex items-center gap-1.5 text-sm font-medium text-gray-700">
                                     <GraduationCap className="w-4 h-4 text-violet-400" />
-                                    Type de classe
+                                    {t('parametres.academic_periods.label_class_type')}
                                 </label>
                                 <Select
                                     value={formData.class_type_id}
@@ -204,20 +206,20 @@ export default function Create({ academicYears, classroomTypes = [] }: Readonly<
                                         <SelectValue />
                                     </SelectTrigger>
                                     <SelectContent>
-                                        <SelectItem value="all">Toutes les classes (global)</SelectItem>
+                                        <SelectItem value="all">{t('parametres.academic_periods.class_type_all')}</SelectItem>
                                         {classroomTypes.map((ct) => (
                                             <SelectItem key={ct.id} value={ct.id}>{ct.name}</SelectItem>
                                         ))}
                                     </SelectContent>
                                 </Select>
-                                <p className="text-xs text-gray-400">Laisser « global » pour appliquer à tous les types de classe.</p>
+                                <p className="text-xs text-gray-400">{t('parametres.academic_periods.class_type_hint')}</p>
                             </div>
 
                             {/* Poids (moyenne annuelle) */}
                             <div className="space-y-1.5">
                                 <label htmlFor="weight" className="flex items-center gap-1.5 text-sm font-medium text-gray-700">
                                     <Hash className="w-4 h-4 text-violet-400" />
-                                    Poids (moyenne annuelle)
+                                    {t('parametres.academic_periods.label_weight')}
                                 </label>
                                 <Input
                                     id="weight"
@@ -237,14 +239,14 @@ export default function Create({ academicYears, classroomTypes = [] }: Readonly<
                     <div className="rounded-2xl p-6 bg-linear-to-br from-teal-50 to-emerald-50 border border-teal-100 shadow-sm">
                         <h2 className="text-base font-semibold text-teal-800 mb-5 flex items-center gap-2">
                             <CalendarRange className="w-5 h-5 text-teal-500" />
-                            Calendrier
+                            {t('parametres.academic_periods.section_calendar')}
                         </h2>
                         <div className="grid grid-cols-1 md:grid-cols-2 gap-5">
                             {/* Date de début */}
                             <div className="space-y-1.5">
                                 <label htmlFor="start_date" className="flex items-center gap-1.5 text-sm font-medium text-gray-700">
                                     <CalendarDays className="w-4 h-4 text-teal-400" />
-                                    Date de début <span className="text-red-500">*</span>
+                                    {t('parametres.academic_periods.label_start')} <span className="text-red-500">*</span>
                                 </label>
                                 <Input
                                     id="start_date"
@@ -260,7 +262,7 @@ export default function Create({ academicYears, classroomTypes = [] }: Readonly<
                             <div className="space-y-1.5">
                                 <label htmlFor="end_date" className="flex items-center gap-1.5 text-sm font-medium text-gray-700">
                                     <CalendarDays className="w-4 h-4 text-teal-400" />
-                                    Date de fin <span className="text-red-500">*</span>
+                                    {t('parametres.academic_periods.label_end')} <span className="text-red-500">*</span>
                                 </label>
                                 <Input
                                     id="end_date"
@@ -278,20 +280,20 @@ export default function Create({ academicYears, classroomTypes = [] }: Readonly<
                     <div className="rounded-2xl p-6 bg-linear-to-br from-amber-50 to-orange-50 border border-amber-100 shadow-sm">
                         <h2 className="text-base font-semibold text-amber-800 mb-5 flex items-center gap-2">
                             <Star className="w-5 h-5 text-amber-500" />
-                            Détails &amp; Statut
+                            {t('parametres.academic_periods.section_details')}
                         </h2>
                         <div className="space-y-5">
                             {/* Description */}
                             <div className="space-y-1.5">
                                 <label htmlFor="description" className="flex items-center gap-1.5 text-sm font-medium text-gray-700">
                                     <FileText className="w-4 h-4 text-amber-400" />
-                                    Description
+                                    {t('parametres.academic_periods.label_description')}
                                 </label>
                                 <Textarea
                                     id="description"
                                     value={formData.description}
                                     onChange={(e) => setFormData((prev) => ({ ...prev, description: e.target.value }))}
-                                    placeholder="Description de la période..."
+                                    placeholder={t('parametres.academic_periods.description_ph')}
                                     rows={3}
                                     className={errors.description ? 'border-red-400 bg-red-50/40 ring-1 ring-red-300 resize-none' : 'border-amber-200 bg-white focus-visible:ring-amber-400 resize-none'}
                                 />
@@ -309,7 +311,7 @@ export default function Create({ academicYears, classroomTypes = [] }: Readonly<
                                 />
                                 <span className="flex items-center gap-1.5 text-sm font-medium text-gray-700">
                                     <Star className="w-4 h-4 text-amber-400" />
-                                    Période active (en cours)
+                                    {t('parametres.academic_periods.active_label')}
                                 </span>
                             </label>
                         </div>
@@ -323,7 +325,7 @@ export default function Create({ academicYears, classroomTypes = [] }: Readonly<
                             className="bg-indigo-600 hover:bg-indigo-700 text-white shadow-sm min-w-40"
                         >
                             <Plus className="w-4 h-4 mr-2" />
-                            {isSubmitting ? 'Création...' : 'Créer la période'}
+                            {isSubmitting ? t('parametres.common.creating') : t('parametres.academic_periods.submit_create')}
                         </Button>
                         <Button
                             type="button"
@@ -332,7 +334,7 @@ export default function Create({ academicYears, classroomTypes = [] }: Readonly<
                             onClick={() => router.get(route('academic-periods.index'))}
                         >
                             <X className="w-4 h-4 mr-1.5" />
-                            Annuler
+                            {t('parametres.common.cancel')}
                         </Button>
                     </div>
                 </form>
diff --git a/resources/js/pages/Parametres/AcademicPeriods/Edit.tsx b/resources/js/pages/Parametres/AcademicPeriods/Edit.tsx
index a5e99480..22737c7b 100644
--- a/resources/js/pages/Parametres/AcademicPeriods/Edit.tsx
+++ b/resources/js/pages/Parametres/AcademicPeriods/Edit.tsx
@@ -19,6 +19,7 @@ import { Input } from '@/components/ui/input';
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
 import { Textarea } from '@/components/ui/textarea';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface AcademicYear {
@@ -50,6 +51,7 @@ interface EditProps {
 }
 
 export default function Edit({ academicPeriod, academicYears, classroomTypes = [] }: Readonly<EditProps>) {
+    const { t } = useTranslation();
     const [formData, setFormData] = useState({
         name: academicPeriod.name,
         description: academicPeriod.description || '',
@@ -84,7 +86,7 @@ export default function Edit({ academicPeriod, academicYears, classroomTypes = [
 
     return (
         <AppLayout>
-            <Head title={`Modifier ${academicPeriod.name}`} />
+            <Head title={t('parametres.academic_periods.edit_head', { name: academicPeriod.name })} />
 
             <div className="space-y-6">
                 {/* En-tête */}
@@ -98,7 +100,7 @@ export default function Edit({ academicPeriod, academicYears, classroomTypes = [
                     </button>
                     <div>
                         <h1 className="text-3xl font-bold tracking-tight text-gray-900">
-                            Modifier la période
+                            {t('parametres.academic_periods.edit_title')}
                         </h1>
                         <p className="text-gray-500 mt-1 text-sm">
                             {academicPeriod.name} — {academicPeriod.academic_year.year}
@@ -112,21 +114,21 @@ export default function Edit({ academicPeriod, academicYears, classroomTypes = [
                     <div className="rounded-2xl p-6 bg-linear-to-br from-indigo-50 to-blue-50 border border-indigo-100 shadow-sm">
                         <h2 className="text-base font-semibold text-indigo-800 mb-5 flex items-center gap-2">
                             <GraduationCap className="w-5 h-5 text-indigo-500" />
-                            Identification
+                            {t('parametres.academic_periods.section_identification')}
                         </h2>
                         <div className="grid grid-cols-1 md:grid-cols-2 gap-5">
                             {/* Nom */}
                             <div className="space-y-1.5">
                                 <label htmlFor="name" className="flex items-center gap-1.5 text-sm font-medium text-gray-700">
                                     <FileText className="w-4 h-4 text-indigo-400" />
-                                    Nom <span className="text-red-500">*</span>
+                                    {t('parametres.academic_periods.label_name')} <span className="text-red-500">*</span>
                                 </label>
                                 <Input
                                     id="name"
                                     type="text"
                                     value={formData.name}
                                     onChange={(e) => setFormData((prev) => ({ ...prev, name: e.target.value }))}
-                                    placeholder="Ex: Trimestre 1, Semestre 1..."
+                                    placeholder={t('parametres.academic_periods.name_ph')}
                                     className={errors.name ? 'border-red-400 bg-red-50/40 ring-1 ring-red-300' : 'border-indigo-200 bg-white focus-visible:ring-indigo-400'}
                                 />
                                 {errors.name && <p className="text-red-600 text-xs flex items-center gap-1"><X className="w-3 h-3" />{errors.name}</p>}
@@ -136,7 +138,7 @@ export default function Edit({ academicPeriod, academicYears, classroomTypes = [
                             <div className="space-y-1.5">
                                 <label htmlFor="academic_year_id" className="flex items-center gap-1.5 text-sm font-medium text-gray-700">
                                     <GraduationCap className="w-4 h-4 text-indigo-400" />
-                                    Année académique <span className="text-red-500">*</span>
+                                    {t('parametres.academic_periods.label_year')} <span className="text-red-500">*</span>
                                 </label>
                                 <Select
                                     value={formData.academic_year_id}
@@ -146,7 +148,7 @@ export default function Edit({ academicPeriod, academicYears, classroomTypes = [
                                         id="academic_year_id"
                                         className={`bg-white ${errors.academic_year_id ? 'border-red-400 ring-1 ring-red-300' : 'border-indigo-200'}`}
                                     >
-                                        <SelectValue placeholder="Sélectionner une année" />
+                                        <SelectValue placeholder={t('parametres.academic_periods.year_ph')} />
                                     </SelectTrigger>
                                     <SelectContent>
                                         {academicYears.map((year) => (
@@ -163,14 +165,14 @@ export default function Edit({ academicPeriod, academicYears, classroomTypes = [
                     <div className="rounded-2xl p-6 bg-linear-to-br from-violet-50 to-purple-50 border border-violet-100 shadow-sm">
                         <h2 className="text-base font-semibold text-violet-800 mb-5 flex items-center gap-2">
                             <Hash className="w-5 h-5 text-violet-500" />
-                            Classification
+                            {t('parametres.academic_periods.section_classification')}
                         </h2>
                         <div className="grid grid-cols-1 md:grid-cols-2 gap-5">
                             {/* Type */}
                             <div className="space-y-1.5">
                                 <label htmlFor="type" className="flex items-center gap-1.5 text-sm font-medium text-gray-700">
                                     <Hash className="w-4 h-4 text-violet-400" />
-                                    Type <span className="text-red-500">*</span>
+                                    {t('parametres.academic_periods.label_type')} <span className="text-red-500">*</span>
                                 </label>
                                 <Select
                                     value={formData.type}
@@ -183,8 +185,8 @@ export default function Edit({ academicPeriod, academicYears, classroomTypes = [
                                         <SelectValue />
                                     </SelectTrigger>
                                     <SelectContent>
-                                        <SelectItem value="trimestre">Trimestre</SelectItem>
-                                        <SelectItem value="semestre">Semestre</SelectItem>
+                                        <SelectItem value="trimestre">{t('parametres.academic_periods.type_trimester')}</SelectItem>
+                                        <SelectItem value="semestre">{t('parametres.academic_periods.type_semester')}</SelectItem>
                                     </SelectContent>
                                 </Select>
                                 {errors.type && <p className="text-red-600 text-xs flex items-center gap-1"><X className="w-3 h-3" />{errors.type}</p>}
@@ -194,7 +196,7 @@ export default function Edit({ academicPeriod, academicYears, classroomTypes = [
                             <div className="space-y-1.5">
                                 <label htmlFor="order" className="flex items-center gap-1.5 text-sm font-medium text-gray-700">
                                     <ListOrdered className="w-4 h-4 text-violet-400" />
-                                    Ordre
+                                    {t('parametres.academic_periods.label_order')}
                                 </label>
                                 <Input
                                     id="order"
@@ -202,7 +204,7 @@ export default function Edit({ academicPeriod, academicYears, classroomTypes = [
                                     min="1"
                                     value={formData.order}
                                     onChange={(e) => setFormData((prev) => ({ ...prev, order: e.target.value }))}
-                                    placeholder="1, 2, 3..."
+                                    placeholder={t('parametres.academic_periods.order_ph')}
                                     className={errors.order ? 'border-red-400 bg-red-50/40 ring-1 ring-red-300' : 'border-violet-200 bg-white focus-visible:ring-violet-400'}
                                 />
                                 {errors.order && <p className="text-red-600 text-xs flex items-center gap-1"><X className="w-3 h-3" />{errors.order}</p>}
@@ -212,7 +214,7 @@ export default function Edit({ academicPeriod, academicYears, classroomTypes = [
                             <div className="space-y-1.5">
                                 <label htmlFor="class_type_id" className="flex items-center gap-1.5 text-sm font-medium text-gray-700">
                                     <GraduationCap className="w-4 h-4 text-violet-400" />
-                                    Type de classe
+                                    {t('parametres.academic_periods.label_class_type')}
                                 </label>
                                 <Select
                                     value={formData.class_type_id}
@@ -222,20 +224,20 @@ export default function Edit({ academicPeriod, academicYears, classroomTypes = [
                                         <SelectValue />
                                     </SelectTrigger>
                                     <SelectContent>
-                                        <SelectItem value="all">Toutes les classes (global)</SelectItem>
+                                        <SelectItem value="all">{t('parametres.academic_periods.class_type_all')}</SelectItem>
                                         {classroomTypes.map((ct) => (
                                             <SelectItem key={ct.id} value={ct.id}>{ct.name}</SelectItem>
                                         ))}
                                     </SelectContent>
                                 </Select>
-                                <p className="text-xs text-gray-400">Laisser « global » pour appliquer à tous les types de classe.</p>
+                                <p className="text-xs text-gray-400">{t('parametres.academic_periods.class_type_hint')}</p>
                             </div>
 
                             {/* Poids (moyenne annuelle) */}
                             <div className="space-y-1.5">
                                 <label htmlFor="weight" className="flex items-center gap-1.5 text-sm font-medium text-gray-700">
                                     <Hash className="w-4 h-4 text-violet-400" />
-                                    Poids (moyenne annuelle)
+                                    {t('parametres.academic_periods.label_weight')}
                                 </label>
                                 <Input
                                     id="weight"
@@ -255,14 +257,14 @@ export default function Edit({ academicPeriod, academicYears, classroomTypes = [
                     <div className="rounded-2xl p-6 bg-linear-to-br from-teal-50 to-emerald-50 border border-teal-100 shadow-sm">
                         <h2 className="text-base font-semibold text-teal-800 mb-5 flex items-center gap-2">
                             <CalendarRange className="w-5 h-5 text-teal-500" />
-                            Calendrier
+                            {t('parametres.academic_periods.section_calendar')}
                         </h2>
                         <div className="grid grid-cols-1 md:grid-cols-2 gap-5">
                             {/* Date de début */}
                             <div className="space-y-1.5">
                                 <label htmlFor="start_date" className="flex items-center gap-1.5 text-sm font-medium text-gray-700">
                                     <CalendarDays className="w-4 h-4 text-teal-400" />
-                                    Date de début <span className="text-red-500">*</span>
+                                    {t('parametres.academic_periods.label_start')} <span className="text-red-500">*</span>
                                 </label>
                                 <Input
                                     id="start_date"
@@ -278,7 +280,7 @@ export default function Edit({ academicPeriod, academicYears, classroomTypes = [
                             <div className="space-y-1.5">
                                 <label htmlFor="end_date" className="flex items-center gap-1.5 text-sm font-medium text-gray-700">
                                     <CalendarDays className="w-4 h-4 text-teal-400" />
-                                    Date de fin <span className="text-red-500">*</span>
+                                    {t('parametres.academic_periods.label_end')} <span className="text-red-500">*</span>
                                 </label>
                                 <Input
                                     id="end_date"
@@ -296,20 +298,20 @@ export default function Edit({ academicPeriod, academicYears, classroomTypes = [
                     <div className="rounded-2xl p-6 bg-linear-to-br from-amber-50 to-orange-50 border border-amber-100 shadow-sm">
                         <h2 className="text-base font-semibold text-amber-800 mb-5 flex items-center gap-2">
                             <Star className="w-5 h-5 text-amber-500" />
-                            Détails &amp; Statut
+                            {t('parametres.academic_periods.section_details')}
                         </h2>
                         <div className="space-y-5">
                             {/* Description */}
                             <div className="space-y-1.5">
                                 <label htmlFor="description" className="flex items-center gap-1.5 text-sm font-medium text-gray-700">
                                     <FileText className="w-4 h-4 text-amber-400" />
-                                    Description
+                                    {t('parametres.academic_periods.label_description')}
                                 </label>
                                 <Textarea
                                     id="description"
                                     value={formData.description}
                                     onChange={(e) => setFormData((prev) => ({ ...prev, description: e.target.value }))}
-                                    placeholder="Description de la période..."
+                                    placeholder={t('parametres.academic_periods.description_ph')}
                                     rows={3}
                                     className={errors.description ? 'border-red-400 bg-red-50/40 ring-1 ring-red-300 resize-none' : 'border-amber-200 bg-white focus-visible:ring-amber-400 resize-none'}
                                 />
@@ -327,7 +329,7 @@ export default function Edit({ academicPeriod, academicYears, classroomTypes = [
                                 />
                                 <span className="flex items-center gap-1.5 text-sm font-medium text-gray-700">
                                     <Star className="w-4 h-4 text-amber-400" />
-                                    Période active (en cours)
+                                    {t('parametres.academic_periods.active_label')}
                                 </span>
                             </label>
                         </div>
@@ -341,7 +343,7 @@ export default function Edit({ academicPeriod, academicYears, classroomTypes = [
                             className="bg-indigo-600 hover:bg-indigo-700 text-white shadow-sm min-w-40"
                         >
                             <Save className="w-4 h-4 mr-2" />
-                            {isSubmitting ? 'Enregistrement...' : 'Enregistrer les modifications'}
+                            {isSubmitting ? t('parametres.academic_periods.saving') : t('parametres.academic_periods.submit_update')}
                         </Button>
                         <Button
                             type="button"
@@ -350,7 +352,7 @@ export default function Edit({ academicPeriod, academicYears, classroomTypes = [
                             onClick={() => router.get(route('academic-periods.index'))}
                         >
                             <X className="w-4 h-4 mr-1.5" />
-                            Annuler
+                            {t('parametres.common.cancel')}
                         </Button>
                     </div>
                 </form>
diff --git a/resources/js/pages/Parametres/AcademicPeriods/Index.tsx b/resources/js/pages/Parametres/AcademicPeriods/Index.tsx
index d7d3ce6b..28beb4f0 100644
--- a/resources/js/pages/Parametres/AcademicPeriods/Index.tsx
+++ b/resources/js/pages/Parametres/AcademicPeriods/Index.tsx
@@ -22,6 +22,7 @@ import {
     TableRow,
 } from '@/components/ui/table';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface AcademicYear {
@@ -63,6 +64,8 @@ interface IndexProps {
 }
 
 export default function Index({ academicPeriods, filters }: Readonly<IndexProps>) {
+    const { t, locale } = useTranslation();
+    const dateLocale = locale === 'en' ? 'en-GB' : 'fr-FR';
     const [deleteConfirm, setDeleteConfirm] = useState<string | null>(null);
     const [isDeleting, setIsDeleting] = useState(false);
     const [searchQuery, setSearchQuery] = useState(filters.search || '');
@@ -99,21 +102,21 @@ export default function Index({ academicPeriods, filters }: Readonly<IndexProps>
 
     const statsCards = [
         {
-            title: 'Périodes totales',
+            title: t('parametres.academic_periods.stat_total'),
             value: academicPeriods.total,
             icon: Calendar,
             bgColor: 'bg-blue-50',
             textColor: 'text-blue-600',
         },
         {
-            title: 'Périodes actives',
+            title: t('parametres.academic_periods.stat_active'),
             value: currentPeriods,
             icon: CheckCircle2,
             bgColor: 'bg-green-50',
             textColor: 'text-green-600',
         },
         {
-            title: 'Page',
+            title: t('parametres.academic_periods.stat_page'),
             value: `${academicPeriods.current_page}/${academicPeriods.last_page}`,
             icon: Clock,
             bgColor: 'bg-purple-50',
@@ -122,7 +125,7 @@ export default function Index({ academicPeriods, filters }: Readonly<IndexProps>
     ];
 
     const formatDate = (dateString: string) => {
-        return new Date(dateString).toLocaleDateString('fr-FR', {
+        return new Date(dateString).toLocaleDateString(dateLocale, {
             day: '2-digit',
             month: '2-digit',
             year: 'numeric'
@@ -130,22 +133,22 @@ export default function Index({ academicPeriods, filters }: Readonly<IndexProps>
     };
 
     const getTypeLabel = (type: string) => {
-        return type === 'trimestre' ? 'Trimestre' : 'Semestre';
+        return type === 'trimestre' ? t('parametres.academic_periods.type_trimester') : t('parametres.academic_periods.type_semester');
     };
 
     return (
         <AppLayout>
-            <Head title="Périodes académiques" />
+            <Head title={t('parametres.academic_periods.head')} />
 
             <div className="space-y-6">
                 {/* Header */}
                 <div className="flex items-start justify-between">
                     <div>
                         <h1 className="text-4xl font-bold tracking-tight text-gray-900 flex items-center gap-3"><Clock className="h-7 w-7 text-blue-600 shrink-0" />
-                            Périodes académiques
+                            {t('parametres.academic_periods.title')}
                         </h1>
                         <p className="mt-2 text-lg text-gray-600">
-                            Gérez les périodes académiques (trimestres et semestres)
+                            {t('parametres.academic_periods.subtitle')}
                         </p>
                     </div>
                     <Button 
@@ -153,7 +156,7 @@ export default function Index({ academicPeriods, filters }: Readonly<IndexProps>
                         className="gap-2 bg-blue-600 hover:bg-blue-700"
                     >
                         <Plus className="w-5 h-5" />
-                        Nouvelle période
+                        {t('parametres.academic_periods.new')}
                     </Button>
                 </div>
 
@@ -191,7 +194,7 @@ export default function Index({ academicPeriods, filters }: Readonly<IndexProps>
                             <Search className="absolute left-3 top-1/2 -translate-y-1/2 w-5 h-5 text-gray-400" />
                             <Input
                                 type="text"
-                                placeholder="Rechercher une période..."
+                                placeholder={t('parametres.academic_periods.search_ph')}
                                 value={searchQuery}
                                 onChange={(e) => setSearchQuery(e.target.value)}
                                 onKeyDown={(e) => {
@@ -214,7 +217,7 @@ export default function Index({ academicPeriods, filters }: Readonly<IndexProps>
                             onClick={handleSearch}
                             className="bg-blue-600 hover:bg-blue-700"
                         >
-                            Rechercher
+                            {t('parametres.common.search')}
                         </Button>
                     </div>
                 </div>
@@ -224,13 +227,13 @@ export default function Index({ academicPeriods, filters }: Readonly<IndexProps>
                     <Table>
                         <TableHeader>
                             <TableRow className="bg-gray-50">
-                                <TableHead className="font-semibold text-gray-900">Nom</TableHead>
-                                <TableHead className="font-semibold text-gray-900">Année</TableHead>
-                                <TableHead className="font-semibold text-gray-900">Type</TableHead>
-                                <TableHead className="font-semibold text-gray-900">Ordre</TableHead>
-                                <TableHead className="font-semibold text-gray-900">Période</TableHead>
-                                <TableHead className="font-semibold text-gray-900">Statut</TableHead>
-                                <TableHead className="text-right font-semibold text-gray-900">Actions</TableHead>
+                                <TableHead className="font-semibold text-gray-900">{t('parametres.academic_periods.th_name')}</TableHead>
+                                <TableHead className="font-semibold text-gray-900">{t('parametres.academic_periods.th_year')}</TableHead>
+                                <TableHead className="font-semibold text-gray-900">{t('parametres.academic_periods.th_type')}</TableHead>
+                                <TableHead className="font-semibold text-gray-900">{t('parametres.academic_periods.th_order')}</TableHead>
+                                <TableHead className="font-semibold text-gray-900">{t('parametres.academic_periods.th_period')}</TableHead>
+                                <TableHead className="font-semibold text-gray-900">{t('parametres.academic_periods.th_status')}</TableHead>
+                                <TableHead className="text-right font-semibold text-gray-900">{t('parametres.common.actions')}</TableHead>
                             </TableRow>
                         </TableHeader>
                         <TableBody>
@@ -239,7 +242,7 @@ export default function Index({ academicPeriods, filters }: Readonly<IndexProps>
                                     <TableCell colSpan={7} className="text-center py-12">
                                         <div className="flex flex-col items-center gap-2">
                                             <Clock className="w-12 h-12 text-gray-300" />
-                                            <p className="text-gray-500 font-medium">Aucune période académique trouvée</p>
+                                            <p className="text-gray-500 font-medium">{t('parametres.academic_periods.empty')}</p>
                                         </div>
                                     </TableCell>
                                 </TableRow>
@@ -287,32 +290,32 @@ export default function Index({ academicPeriods, filters }: Readonly<IndexProps>
                                             {period.is_current ? (
                                                 <span className="inline-flex items-center gap-1 px-3 py-1 rounded-full text-sm font-medium bg-green-100 text-green-700">
                                                     <CheckCircle2 className="w-4 h-4" />
-                                                    Active
+                                                    {t('parametres.academic_periods.status_active')}
                                                 </span>
                                             ) : (
                                                 <span className="inline-flex items-center px-3 py-1 rounded-full text-sm font-medium bg-gray-100 text-gray-700">
-                                                    Inactive
+                                                    {t('parametres.academic_periods.status_inactive')}
                                                 </span>
                                             )}
                                         </TableCell>
                                         <TableCell className="text-right">
                                             <div className="flex justify-end gap-2">
                                                 <IconButton
-                                                    label="Voir"
+                                                    label={t('parametres.common.view')}
                                                     variant="ghost"
                                                     icon={<Eye className="w-4 h-4" />}
                                                     onClick={() => router.get(route('academic-periods.show', period.id))}
                                                     className="text-blue-600 hover:text-blue-700 hover:bg-blue-50"
                                                 />
                                                 <IconButton
-                                                    label="Modifier"
+                                                    label={t('parametres.common.edit')}
                                                     variant="ghost"
                                                     icon={<Pencil className="w-4 h-4" />}
                                                     onClick={() => router.get(route('academic-periods.edit', period.id))}
                                                     className="text-gray-600 hover:text-gray-700 hover:bg-gray-50"
                                                 />
                                                 <IconButton
-                                                    label="Supprimer"
+                                                    label={t('parametres.common.delete')}
                                                     variant="ghost"
                                                     icon={<Trash2 className="w-4 h-4" />}
                                                     onClick={() => setDeleteConfirm(period.id)}
@@ -331,7 +334,7 @@ export default function Index({ academicPeriods, filters }: Readonly<IndexProps>
                 {academicPeriods.last_page > 1 && (
                     <div className="flex items-center justify-between bg-white rounded-lg shadow-sm p-4 border border-gray-200">
                         <div className="text-sm text-gray-600">
-                            Affichage de {academicPeriods.from} à {academicPeriods.to} sur {academicPeriods.total} résultats
+                            {t('parametres.common.showing', { from: academicPeriods.from, to: academicPeriods.to, total: academicPeriods.total })}
                         </div>
                         <div className="flex items-center gap-2">
                             <Button
@@ -347,7 +350,7 @@ export default function Index({ academicPeriods, filters }: Readonly<IndexProps>
                                 className="gap-1"
                             >
                                 <ChevronLeft className="w-4 h-4" />
-                                Précédent
+                                {t('parametres.common.prev')}
                             </Button>
 
                             <div className="flex gap-1">
@@ -394,7 +397,7 @@ export default function Index({ academicPeriods, filters }: Readonly<IndexProps>
                                 disabled={academicPeriods.current_page === academicPeriods.last_page}
                                 className="gap-1"
                             >
-                                Suivant
+                                {t('parametres.common.next')}
                                 <ChevronRight className="w-4 h-4" />
                             </Button>
                         </div>
@@ -406,19 +409,19 @@ export default function Index({ academicPeriods, filters }: Readonly<IndexProps>
             <AlertDialog open={!!deleteConfirm} onOpenChange={() => setDeleteConfirm(null)}>
                 <AlertDialogContent>
                     <AlertDialogHeader>
-                        <AlertDialogTitle>Confirmer la suppression</AlertDialogTitle>
+                        <AlertDialogTitle>{t('parametres.academic_periods.delete_title')}</AlertDialogTitle>
                         <AlertDialogDescription>
-                            Êtes-vous sûr de vouloir supprimer cette période académique ? Cette action est irréversible.
+                            {t('parametres.academic_periods.delete_desc')}
                         </AlertDialogDescription>
                     </AlertDialogHeader>
                     <div className="flex justify-end gap-3">
-                        <AlertDialogCancel disabled={isDeleting}>Annuler</AlertDialogCancel>
+                        <AlertDialogCancel disabled={isDeleting}>{t('parametres.common.cancel')}</AlertDialogCancel>
                         <AlertDialogAction
                             onClick={() => deleteConfirm && handleDelete(deleteConfirm)}
                             disabled={isDeleting}
                             className="bg-red-600 hover:bg-red-700"
                         >
-                            {isDeleting ? 'Suppression...' : 'Supprimer'}
+                            {isDeleting ? t('parametres.academic_periods.deleting') : t('parametres.common.delete')}
                         </AlertDialogAction>
                     </div>
                 </AlertDialogContent>
diff --git a/resources/js/pages/Parametres/AcademicPeriods/Show.tsx b/resources/js/pages/Parametres/AcademicPeriods/Show.tsx
index 4ea912cf..c7f548a2 100644
--- a/resources/js/pages/Parametres/AcademicPeriods/Show.tsx
+++ b/resources/js/pages/Parametres/AcademicPeriods/Show.tsx
@@ -2,6 +2,7 @@ import { Head, router } from '@inertiajs/react';
 import { ArrowLeft, Calendar, CheckCircle2, Clock, Info } from 'lucide-react';
 import { Button } from '@/components/ui/button';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface AcademicYear {
@@ -29,8 +30,10 @@ interface ShowProps {
 }
 
 export default function Show({ academicPeriod }: Readonly<ShowProps>) {
+    const { t, locale } = useTranslation();
+    const dateLocale = locale === 'en' ? 'en-GB' : 'fr-FR';
     const formatDate = (date: string) => {
-        return new Date(date).toLocaleDateString('fr-FR', {
+        return new Date(date).toLocaleDateString(dateLocale, {
             year: 'numeric',
             month: 'long',
             day: 'numeric'
@@ -38,7 +41,7 @@ export default function Show({ academicPeriod }: Readonly<ShowProps>) {
     };
 
     const formatDateShort = (date: string) => {
-        return new Date(date).toLocaleDateString('fr-FR', {
+        return new Date(date).toLocaleDateString(dateLocale, {
             day: '2-digit',
             month: '2-digit',
             year: 'numeric'
@@ -46,7 +49,7 @@ export default function Show({ academicPeriod }: Readonly<ShowProps>) {
     };
 
     const getTypeLabel = (type: string) => {
-        return type === 'trimestre' ? 'Trimestre' : 'Semestre';
+        return type === 'trimestre' ? t('parametres.academic_periods.type_trimester') : t('parametres.academic_periods.type_semester');
     };
 
     return (
@@ -76,7 +79,7 @@ export default function Show({ academicPeriod }: Readonly<ShowProps>) {
                                 {academicPeriod.is_current && (
                                     <span className="inline-flex items-center gap-1 px-2 py-1 rounded-full text-xs font-medium bg-green-100 text-green-700">
                                         <CheckCircle2 className="w-3 h-3" />
-                                        Active
+                                        {t('parametres.academic_periods.status_active')}
                                     </span>
                                 )}
                             </div>
@@ -86,7 +89,7 @@ export default function Show({ academicPeriod }: Readonly<ShowProps>) {
                         onClick={() => router.get(route('academic-periods.edit', academicPeriod.id))}
                         className="bg-blue-600 hover:bg-blue-700"
                     >
-                        Modifier
+                        {t('parametres.common.edit')}
                     </Button>
                 </div>
 
@@ -96,33 +99,33 @@ export default function Show({ academicPeriod }: Readonly<ShowProps>) {
                         <div className="bg-white rounded-lg border p-6">
                             <h2 className="text-lg font-semibold text-gray-900 mb-4 flex items-center gap-2">
                                 <Calendar className="w-5 h-5 text-blue-600" />
-                                Informations de la période
+                                {t('parametres.academic_periods.info_title')}
                             </h2>
                             <div className="grid grid-cols-2 gap-4">
                                 <div>
-                                    <p className="text-sm text-gray-600">Nom</p>
+                                    <p className="text-sm text-gray-600">{t('parametres.academic_periods.th_name')}</p>
                                     <p className="font-medium text-gray-900 mt-1">{academicPeriod.name}</p>
                                 </div>
                                 <div>
-                                    <p className="text-sm text-gray-600">Type</p>
+                                    <p className="text-sm text-gray-600">{t('parametres.academic_periods.th_type')}</p>
                                     <p className="font-medium text-gray-900 mt-1">{getTypeLabel(academicPeriod.type)}</p>
                                 </div>
                                 <div>
-                                    <p className="text-sm text-gray-600">Année académique</p>
+                                    <p className="text-sm text-gray-600">{t('parametres.academic_periods.label_year')}</p>
                                     <p className="font-medium text-gray-900 mt-1">{academicPeriod.academic_year.year}</p>
                                 </div>
                                 <div>
-                                    <p className="text-sm text-gray-600">Ordre</p>
+                                    <p className="text-sm text-gray-600">{t('parametres.academic_periods.th_order')}</p>
                                     <p className="font-medium text-gray-900 mt-1">{academicPeriod.order || '-'}</p>
                                 </div>
                                 <div>
-                                    <p className="text-sm text-gray-600">Date de début</p>
+                                    <p className="text-sm text-gray-600">{t('parametres.academic_periods.label_start')}</p>
                                     <p className="font-medium text-gray-900 mt-1">
                                         {formatDateShort(academicPeriod.start_date)}
                                     </p>
                                 </div>
                                 <div>
-                                    <p className="text-sm text-gray-600">Date de fin</p>
+                                    <p className="text-sm text-gray-600">{t('parametres.academic_periods.label_end')}</p>
                                     <p className="font-medium text-gray-900 mt-1">
                                         {formatDateShort(academicPeriod.end_date)}
                                     </p>
@@ -134,7 +137,7 @@ export default function Show({ academicPeriod }: Readonly<ShowProps>) {
                             <div className="bg-white rounded-lg border p-6">
                                 <h2 className="text-lg font-semibold text-gray-900 mb-4 flex items-center gap-2">
                                     <Info className="w-5 h-5 text-blue-600" />
-                                    Description
+                                    {t('parametres.academic_periods.label_description')}
                                 </h2>
                                 <p className="text-gray-700 leading-relaxed">{academicPeriod.description}</p>
                             </div>
@@ -146,19 +149,19 @@ export default function Show({ academicPeriod }: Readonly<ShowProps>) {
                         <div className="bg-white rounded-lg border p-6">
                             <h2 className="text-lg font-semibold text-gray-900 mb-4 flex items-center gap-2">
                                 <Clock className="w-5 h-5 text-blue-600" />
-                                Informations système
+                                {t('parametres.academic_periods.system_title')}
                             </h2>
                             <div className="space-y-4">
                                 <div>
-                                    <p className="text-sm text-gray-600">Date de création</p>
+                                    <p className="text-sm text-gray-600">{t('parametres.common.created_at')}</p>
                                     <p className="text-sm text-gray-900 mt-1">{formatDate(academicPeriod.created_at)}</p>
                                 </div>
                                 <div>
-                                    <p className="text-sm text-gray-600">Dernière modification</p>
+                                    <p className="text-sm text-gray-600">{t('parametres.common.updated_on')}</p>
                                     <p className="text-sm text-gray-900 mt-1">{formatDate(academicPeriod.updated_at)}</p>
                                 </div>
                                 <div>
-                                    <p className="text-sm text-gray-600">Identifiant</p>
+                                    <p className="text-sm text-gray-600">{t('parametres.academic_periods.label_id')}</p>
                                     <p className="text-xs text-gray-500 mt-1 font-mono break-all">
                                         {academicPeriod.id}
                                     </p>
@@ -169,11 +172,10 @@ export default function Show({ academicPeriod }: Readonly<ShowProps>) {
                         <div className="bg-blue-50 rounded-lg border border-blue-200 p-6">
                             <h3 className="font-semibold text-blue-900 mb-2 flex items-center gap-2">
                                 <Info className="w-4 h-4" />
-                                À propos
+                                {t('parametres.academic_periods.about_title')}
                             </h3>
                             <p className="text-sm text-blue-700">
-                                Les périodes académiques permettent de diviser l'année scolaire en trimestres ou semestres 
-                                pour organiser l'évaluation et le suivi des élèves.
+                                {t('parametres.academic_periods.about_desc')}
                             </p>
                         </div>
                     </div>

From 3aacdf52ab6bfe01ef1097f075680d6eefac26c1 Mon Sep 17 00:00:00 2001
From: horacioskrp <hervekudayah@gmail.com>
Date: Fri, 13 Nov 2026 10:14:09 +0000
Subject: [PATCH 09/12] =?UTF-8?q?feat(i18n):=20param=C3=A8tres=20=E2=80=94?=
 =?UTF-8?q?=20classes=20&=20attributions=20de=20mati=C3=A8res=20(FR/EN)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 lang/en/parametres.php                        | 71 +++++++++++++++++++
 lang/fr/parametres.php                        | 71 +++++++++++++++++++
 .../components/Classrooms/classroom-form.tsx  | 38 +++++-----
 .../js/pages/Parametres/Classrooms/Create.tsx |  8 ++-
 .../js/pages/Parametres/Classrooms/Edit.tsx   |  8 ++-
 .../js/pages/Parametres/Classrooms/Index.tsx  | 53 +++++++-------
 .../js/pages/Parametres/Classrooms/Show.tsx   | 37 +++++-----
 .../Classrooms/SubjectAssignments.tsx         | 32 +++++----
 8 files changed, 236 insertions(+), 82 deletions(-)

diff --git a/lang/en/parametres.php b/lang/en/parametres.php
index 36fdcf7b..f1dfe002 100644
--- a/lang/en/parametres.php
+++ b/lang/en/parametres.php
@@ -714,4 +714,75 @@
         'about_title' => 'About',
         'about_desc' => 'Academic periods divide the school year into terms or semesters to organize assessment and student tracking.',
     ],
+
+    'classrooms' => [
+        'head' => 'Classes',
+        'title' => 'Classes',
+        'subtitle' => 'Manage your school\'s classes',
+        'new' => 'New class',
+        'stat_total' => 'Total classes',
+        'stat_active' => 'Active classes',
+        'stat_page' => 'Page',
+        'search_ph' => 'Search for a class...',
+        'reset' => 'Reset',
+        'th_name' => 'Name',
+        'th_code' => 'Code',
+        'th_type' => 'Type',
+        'th_capacity' => 'Capacity',
+        'empty' => 'No class found',
+        'assign_subjects' => 'Assign subjects',
+        'showing_sep' => 'of',
+        'showing_unit' => 'classes',
+        'delete_title' => 'Delete class',
+        'delete_desc' => 'Are you sure you want to delete this class? This action is irreversible.',
+        'deleting' => 'Deleting...',
+        'create_head' => 'New class',
+        'create_title' => 'Create a class',
+        'create_subtitle' => 'Enter the class information.',
+        'edit_head' => 'Edit :name',
+        'edit_title' => 'Edit a class',
+        'edit_subtitle' => 'Update the information for :name.',
+        'form_info' => 'Class information',
+        'label_name' => 'Name',
+        'name_ph' => 'e.g. 6th A',
+        'label_code' => 'Code',
+        'code_ph' => 'e.g. 6A-2026',
+        'label_capacity' => 'Capacity',
+        'label_expected_age' => 'Expected age',
+        'expected_age_ph' => 'e.g. 12',
+        'expected_age_hint' => 'Official expected age (basis for over-age calculation).',
+        'label_type' => 'Class type',
+        'type_none' => 'No type',
+        'preview' => 'Preview',
+        'preview_text_before' => 'This class will accommodate up to',
+        'preview_text_after' => 'students.',
+        'submit_create' => 'Create class',
+        'creating' => 'Creating...',
+        'show_code' => 'Code',
+        'show_capacity' => 'Capacity',
+        'show_capacity_hint' => 'available seats',
+        'show_type' => 'Class type',
+        'show_created_on' => 'Created on',
+        'show_updated_on' => 'Updated on',
+        'subjects_title' => 'Subjects and Coefficients',
+        'subjects_summary' => ':n subject(s) • Total coefficients: :total',
+        'select_year_ph' => 'Select a year',
+        'coef' => 'Coef.',
+        'no_assignments' => 'No subject assigned for this academic year',
+        // Assignments
+        'assign_head' => 'Assignments - :name',
+        'assign_title' => 'Assign subjects',
+        'assign_class_before' => 'Class:',
+        'assign_year_section' => 'Academic year',
+        'assign_year_ph' => 'Select an academic year',
+        'assign_subjects_section' => 'Subjects and coefficients',
+        'assign_search_ph' => 'Search for a subject...',
+        'assign_coef_ph' => 'Coef',
+        'assign_selected_count' => ':n subject(s) selected',
+        'assign_submit' => 'Save assignments',
+        'assign_saving' => 'Saving...',
+        'err_year_required' => 'The academic year is required.',
+        'err_subjects_required' => 'Please select at least one subject.',
+        'err_coef_invalid' => 'Invalid coefficient (must be > 0).',
+    ],
 ];
diff --git a/lang/fr/parametres.php b/lang/fr/parametres.php
index 62198a9b..2fe4f79b 100644
--- a/lang/fr/parametres.php
+++ b/lang/fr/parametres.php
@@ -714,4 +714,75 @@
         'about_title' => 'À propos',
         'about_desc' => 'Les périodes académiques permettent de diviser l\'année scolaire en trimestres ou semestres pour organiser l\'évaluation et le suivi des élèves.',
     ],
+
+    'classrooms' => [
+        'head' => 'Classes',
+        'title' => 'Classes',
+        'subtitle' => 'Gérez les classes de votre établissement',
+        'new' => 'Nouvelle classe',
+        'stat_total' => 'Total des classes',
+        'stat_active' => 'Classes actives',
+        'stat_page' => 'Page',
+        'search_ph' => 'Rechercher une classe...',
+        'reset' => 'Réinitialiser',
+        'th_name' => 'Nom',
+        'th_code' => 'Code',
+        'th_type' => 'Type',
+        'th_capacity' => 'Capacité',
+        'empty' => 'Aucune classe trouvée',
+        'assign_subjects' => 'Attribuer des matières',
+        'showing_sep' => 'sur',
+        'showing_unit' => 'classes',
+        'delete_title' => 'Supprimer la classe',
+        'delete_desc' => 'Êtes-vous sûr de vouloir supprimer cette classe ? Cette action est irréversible.',
+        'deleting' => 'Suppression...',
+        'create_head' => 'Nouvelle classe',
+        'create_title' => 'Créer une classe',
+        'create_subtitle' => 'Renseignez les informations de la classe.',
+        'edit_head' => 'Éditer :name',
+        'edit_title' => 'Éditer une classe',
+        'edit_subtitle' => 'Mettez à jour les informations de :name.',
+        'form_info' => 'Informations de la classe',
+        'label_name' => 'Nom',
+        'name_ph' => 'Ex: 6e A',
+        'label_code' => 'Code',
+        'code_ph' => 'Ex: 6A-2026',
+        'label_capacity' => 'Capacité',
+        'label_expected_age' => 'Âge attendu',
+        'expected_age_ph' => 'Ex. 12',
+        'expected_age_hint' => 'Âge officiel attendu (base du calcul de sur-âge).',
+        'label_type' => 'Type de classe',
+        'type_none' => 'Aucun type',
+        'preview' => 'Aperçu',
+        'preview_text_before' => 'Cette classe accueillera jusqu\'à',
+        'preview_text_after' => 'élèves.',
+        'submit_create' => 'Créer la classe',
+        'creating' => 'Création...',
+        'show_code' => 'Code',
+        'show_capacity' => 'Capacité',
+        'show_capacity_hint' => 'places disponibles',
+        'show_type' => 'Type de classe',
+        'show_created_on' => 'Créée le',
+        'show_updated_on' => 'Modifiée le',
+        'subjects_title' => 'Matières et Coefficients',
+        'subjects_summary' => ':n matière(s) • Total des coefficients : :total',
+        'select_year_ph' => 'Sélectionner une année',
+        'coef' => 'Coef.',
+        'no_assignments' => 'Aucune matière assignée pour cette année académique',
+        // Attributions
+        'assign_head' => 'Attributions - :name',
+        'assign_title' => 'Attribuer des matières',
+        'assign_class_before' => 'Classe :',
+        'assign_year_section' => 'Année académique',
+        'assign_year_ph' => 'Sélectionnez une année académique',
+        'assign_subjects_section' => 'Matières et coefficients',
+        'assign_search_ph' => 'Rechercher une matière...',
+        'assign_coef_ph' => 'Coef',
+        'assign_selected_count' => ':n matière(s) sélectionnée(s)',
+        'assign_submit' => 'Enregistrer les attributions',
+        'assign_saving' => 'Enregistrement...',
+        'err_year_required' => 'L\'année académique est requise.',
+        'err_subjects_required' => 'Veuillez sélectionner au moins une matière.',
+        'err_coef_invalid' => 'Coefficient invalide (doit être > 0).',
+    ],
 ];
diff --git a/resources/js/components/Classrooms/classroom-form.tsx b/resources/js/components/Classrooms/classroom-form.tsx
index 8b686462..d1e7651e 100644
--- a/resources/js/components/Classrooms/classroom-form.tsx
+++ b/resources/js/components/Classrooms/classroom-form.tsx
@@ -1,6 +1,7 @@
 import { Building2, Save, Users } from 'lucide-react';
 import { Button } from '@/components/ui/button';
 import { Input } from '@/components/ui/input';
+import { useTranslation } from '@/helpers/i18n';
 
 export interface ClassroomTypeOption {
     id: string;
@@ -36,14 +37,15 @@ export function ClassroomForm({
     onSubmit,
     setData,
 }: Readonly<ClassroomFormProps>) {
-    let submitLabel = 'Mettre à jour';
+    const { t } = useTranslation();
+    let submitLabel = t('parametres.common.update');
 
     if (processing && mode === 'create') {
-        submitLabel = 'Création...';
+        submitLabel = t('parametres.classrooms.creating');
     } else if (processing) {
-        submitLabel = 'Mise à jour...';
+        submitLabel = t('parametres.common.updating');
     } else if (mode === 'create') {
-        submitLabel = 'Créer la classe';
+        submitLabel = t('parametres.classrooms.submit_create');
     }
 
     return (
@@ -53,38 +55,38 @@ export function ClassroomForm({
                     <div className="w-9 h-9 rounded-full bg-blue-100 flex items-center justify-center">
                         <Building2 className="w-5 h-5 text-blue-600" />
                     </div>
-                    <h3 className="text-lg font-semibold text-gray-900">Informations de la classe</h3>
+                    <h3 className="text-lg font-semibold text-gray-900">{t('parametres.classrooms.form_info')}</h3>
                 </div>
 
                 <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
                     <div>
-                        <label htmlFor="name" className="block text-sm font-medium text-gray-900 mb-2">Nom *</label>
+                        <label htmlFor="name" className="block text-sm font-medium text-gray-900 mb-2">{t('parametres.classrooms.label_name')} *</label>
                         <Input
                             id="name"
                             value={data.name}
                             onChange={(event) => setData('name', event.target.value)}
                             disabled={processing}
                             className={errors.name ? 'border-red-500 bg-red-50/40' : 'border-gray-200 bg-white focus-visible:ring-blue-500'}
-                            placeholder="Ex: 6e A"
+                            placeholder={t('parametres.classrooms.name_ph')}
                         />
                         {errors.name && <p className="text-sm text-red-600 mt-1">{errors.name}</p>}
                     </div>
 
                     <div>
-                        <label htmlFor="code" className="block text-sm font-medium text-gray-900 mb-2">Code *</label>
+                        <label htmlFor="code" className="block text-sm font-medium text-gray-900 mb-2">{t('parametres.classrooms.label_code')} *</label>
                         <Input
                             id="code"
                             value={data.code}
                             onChange={(event) => setData('code', event.target.value)}
                             disabled={processing}
                             className={errors.code ? 'border-red-500 bg-red-50/40' : 'border-gray-200 bg-white focus-visible:ring-blue-500'}
-                            placeholder="Ex: 6A-2026"
+                            placeholder={t('parametres.classrooms.code_ph')}
                         />
                         {errors.code && <p className="text-sm text-red-600 mt-1">{errors.code}</p>}
                     </div>
 
                     <div>
-                        <label htmlFor="capacity" className="block text-sm font-medium text-gray-900 mb-2">Capacité *</label>
+                        <label htmlFor="capacity" className="block text-sm font-medium text-gray-900 mb-2">{t('parametres.classrooms.label_capacity')} *</label>
                         <Input
                             id="capacity"
                             type="number"
@@ -102,13 +104,13 @@ export function ClassroomForm({
                     </div>
 
                     <div>
-                        <label htmlFor="expected_age" className="block text-sm font-medium text-gray-900 mb-2">Âge attendu</label>
+                        <label htmlFor="expected_age" className="block text-sm font-medium text-gray-900 mb-2">{t('parametres.classrooms.label_expected_age')}</label>
                         <Input
                             id="expected_age"
                             type="number"
                             min={3}
                             max={30}
-                            placeholder="Ex. 12"
+                            placeholder={t('parametres.classrooms.expected_age_ph')}
                             value={data.expected_age ?? ''}
                             onChange={(event) => {
                                 const v = event.target.value;
@@ -117,12 +119,12 @@ export function ClassroomForm({
                             disabled={processing}
                             className={errors.expected_age ? 'border-red-500 bg-red-50/40' : 'border-gray-200 bg-white focus-visible:ring-blue-500'}
                         />
-                        <p className="text-xs text-gray-400 mt-1">Âge officiel attendu (base du calcul de sur-âge).</p>
+                        <p className="text-xs text-gray-400 mt-1">{t('parametres.classrooms.expected_age_hint')}</p>
                         {errors.expected_age && <p className="text-sm text-red-600 mt-1">{errors.expected_age}</p>}
                     </div>
 
                     <div>
-                        <label htmlFor="classroom_type_id" className="block text-sm font-medium text-gray-900 mb-2">Type de classe</label>
+                        <label htmlFor="classroom_type_id" className="block text-sm font-medium text-gray-900 mb-2">{t('parametres.classrooms.label_type')}</label>
                         <select
                             id="classroom_type_id"
                             value={data.classroom_type_id}
@@ -134,7 +136,7 @@ export function ClassroomForm({
                                     : 'border-gray-200 bg-white focus-visible:ring-2 focus-visible:ring-blue-500'
                             }`}
                         >
-                            <option value="">Aucun type</option>
+                            <option value="">{t('parametres.classrooms.type_none')}</option>
                             {classroomTypes.map((type) => (
                                 <option key={type.id} value={type.id}>
                                     {type.name}
@@ -151,16 +153,16 @@ export function ClassroomForm({
                     <div className="w-9 h-9 rounded-full bg-emerald-100 flex items-center justify-center">
                         <Users className="w-5 h-5 text-emerald-600" />
                     </div>
-                    <h3 className="text-lg font-semibold text-gray-900">Aperçu</h3>
+                    <h3 className="text-lg font-semibold text-gray-900">{t('parametres.classrooms.preview')}</h3>
                 </div>
                 <p className="text-sm text-gray-700">
-                    Cette classe accueillera jusqu'à <span className="font-semibold">{data.capacity || 0}</span> élèves.
+                    {t('parametres.classrooms.preview_text_before')} <span className="font-semibold">{data.capacity || 0}</span> {t('parametres.classrooms.preview_text_after')}
                 </p>
             </div>
 
             <div className="flex gap-3 pt-2">
                 <Button type="button" variant="outline" onClick={onCancel} disabled={processing} className="flex-1 border-gray-200 text-gray-700 hover:bg-gray-50">
-                    Annuler
+                    {t('parametres.common.cancel')}
                 </Button>
                 <Button type="submit" disabled={processing} className="flex-1 gap-2 bg-blue-600 hover:bg-blue-700 shadow-sm">
                     <Save className="w-4 h-4" />
diff --git a/resources/js/pages/Parametres/Classrooms/Create.tsx b/resources/js/pages/Parametres/Classrooms/Create.tsx
index 2946a9cd..1a17c3f5 100644
--- a/resources/js/pages/Parametres/Classrooms/Create.tsx
+++ b/resources/js/pages/Parametres/Classrooms/Create.tsx
@@ -6,6 +6,7 @@ import {
     type ClassroomTypeOption,
 } from '@/components/Classrooms/classroom-form';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface CreateProps {
@@ -21,6 +22,7 @@ const initialValues: ClassroomFormData = {
 };
 
 export default function Create({ classroomTypes }: Readonly<CreateProps>) {
+    const { t } = useTranslation();
     const { data, setData, post, processing, errors } = useForm<ClassroomFormData>(initialValues);
 
     const handleSubmit = (event: React.SubmitEvent<HTMLFormElement>) => {
@@ -30,7 +32,7 @@ export default function Create({ classroomTypes }: Readonly<CreateProps>) {
 
     return (
         <AppLayout>
-            <Head title="Nouvelle classe" />
+            <Head title={t('parametres.classrooms.create_head')} />
 
             <div className="max-w-4xl space-y-6">
                 <div className="flex items-center gap-4">
@@ -42,8 +44,8 @@ export default function Create({ classroomTypes }: Readonly<CreateProps>) {
                         <ArrowLeft className="w-5 h-5 text-gray-600" />
                     </button>
                     <div>
-                        <h1 className="text-4xl font-bold tracking-tight text-gray-900">Créer une classe</h1>
-                        <p className="mt-2 text-gray-600">Renseignez les informations de la classe.</p>
+                        <h1 className="text-4xl font-bold tracking-tight text-gray-900">{t('parametres.classrooms.create_title')}</h1>
+                        <p className="mt-2 text-gray-600">{t('parametres.classrooms.create_subtitle')}</p>
                     </div>
                 </div>
 
diff --git a/resources/js/pages/Parametres/Classrooms/Edit.tsx b/resources/js/pages/Parametres/Classrooms/Edit.tsx
index d9172b03..00b7983c 100644
--- a/resources/js/pages/Parametres/Classrooms/Edit.tsx
+++ b/resources/js/pages/Parametres/Classrooms/Edit.tsx
@@ -6,6 +6,7 @@ import {
     type ClassroomTypeOption,
 } from '@/components/Classrooms/classroom-form';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface Classroom {
@@ -24,6 +25,7 @@ interface EditProps {
 }
 
 export default function Edit({ classroom, classroomTypes }: Readonly<EditProps>) {
+    const { t } = useTranslation();
     const { data, setData, put, processing, errors } = useForm<ClassroomFormData>({
         name: classroom.name,
         code: classroom.code,
@@ -39,7 +41,7 @@ export default function Edit({ classroom, classroomTypes }: Readonly<EditProps>)
 
     return (
         <AppLayout>
-            <Head title={`Éditer ${classroom.name}`} />
+            <Head title={t('parametres.classrooms.edit_head', { name: classroom.name })} />
 
             <div className="max-w-4xl space-y-6">
                 <div className="flex items-center gap-4">
@@ -51,8 +53,8 @@ export default function Edit({ classroom, classroomTypes }: Readonly<EditProps>)
                         <ArrowLeft className="w-5 h-5 text-gray-600" />
                     </button>
                     <div>
-                        <h1 className="text-4xl font-bold tracking-tight text-gray-900">Éditer une classe</h1>
-                        <p className="mt-2 text-gray-600">Mettez à jour les informations de {classroom.name}.</p>
+                        <h1 className="text-4xl font-bold tracking-tight text-gray-900">{t('parametres.classrooms.edit_title')}</h1>
+                        <p className="mt-2 text-gray-600">{t('parametres.classrooms.edit_subtitle', { name: classroom.name })}</p>
                     </div>
                 </div>
 
diff --git a/resources/js/pages/Parametres/Classrooms/Index.tsx b/resources/js/pages/Parametres/Classrooms/Index.tsx
index ab90c938..d4bcd4ff 100644
--- a/resources/js/pages/Parametres/Classrooms/Index.tsx
+++ b/resources/js/pages/Parametres/Classrooms/Index.tsx
@@ -22,6 +22,7 @@ import {
     TableRow,
 } from '@/components/ui/table';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface ClassroomType {
@@ -63,6 +64,7 @@ function getPages(current: number, last: number): (number | '...')[] {
 }
 
 export default function Index({ classrooms, activeCount, filters, message }: Readonly<IndexProps>) {
+    const { t } = useTranslation();
     const [deleteConfirm, setDeleteConfirm] = useState<string | null>(null);
     const [isDeleting, setIsDeleting] = useState(false);
     const [searchQuery, setSearchQuery] = useState(filters.search ?? '');
@@ -95,7 +97,7 @@ export default function Index({ classrooms, activeCount, filters, message }: Rea
 
     const statsCards = [
         {
-            title: 'Total des classes',
+            title: t('parametres.classrooms.stat_total'),
             value: classrooms.total,
             icon: Layers,
             bgColor: 'bg-blue-50',
@@ -103,7 +105,7 @@ export default function Index({ classrooms, activeCount, filters, message }: Rea
             borderColor: 'border-blue-200',
         },
         {
-            title: 'Classes actives',
+            title: t('parametres.classrooms.stat_active'),
             value: activeCount,
             icon: Users,
             bgColor: 'bg-green-50',
@@ -111,7 +113,7 @@ export default function Index({ classrooms, activeCount, filters, message }: Rea
             borderColor: 'border-green-200',
         },
         {
-            title: 'Page',
+            title: t('parametres.classrooms.stat_page'),
             value: `${classrooms.current_page}/${classrooms.last_page}`,
             icon: Plus,
             bgColor: 'bg-purple-50',
@@ -122,16 +124,16 @@ export default function Index({ classrooms, activeCount, filters, message }: Rea
 
     return (
         <AppLayout>
-            <Head title="Classes" />
+            <Head title={t('parametres.classrooms.head')} />
 
                     <div className="space-y-6">
                         <div className="flex items-start justify-between">
                             <div>
                                 <h1 className="text-4xl font-bold tracking-tight text-gray-900 flex items-center gap-3"><Layers className="h-7 w-7 text-blue-600 shrink-0" />
-                                    Classes
+                                    {t('parametres.classrooms.title')}
                                 </h1>
                                 <p className="mt-2 text-lg text-gray-600">
-                                    Gérez les classes de votre établissement
+                                    {t('parametres.classrooms.subtitle')}
                                 </p>
                             </div>
                             <Button
@@ -139,7 +141,7 @@ export default function Index({ classrooms, activeCount, filters, message }: Rea
                                 className="gap-2 bg-blue-600 hover:bg-blue-700"
                             >
                                 <Plus className="w-5 h-5" />
-                                Nouvelle classe
+                                {t('parametres.classrooms.new')}
                             </Button>
                         </div>
 
@@ -180,7 +182,7 @@ export default function Index({ classrooms, activeCount, filters, message }: Rea
                                     <Search className="absolute left-3 top-3 w-5 h-5 text-gray-400" />
                                     <Input
                                         type="text"
-                                        placeholder="Rechercher une classe..."
+                                        placeholder={t('parametres.classrooms.search_ph')}
                                         value={searchQuery}
                                         onChange={(e) => setSearchQuery(e.target.value)}
                                         className="pl-10 bg-gray-50 border-gray-300"
@@ -191,7 +193,7 @@ export default function Index({ classrooms, activeCount, filters, message }: Rea
                                     className="bg-blue-600 hover:bg-blue-700 text-white gap-2"
                                 >
                                     <Search className="w-4 h-4" />
-                                    Rechercher
+                                    {t('parametres.common.search')}
                                 </Button>
                                 {searchQuery && (
                                     <Button
@@ -199,7 +201,7 @@ export default function Index({ classrooms, activeCount, filters, message }: Rea
                                         onClick={handleClearSearch}
                                         className="border-gray-300 text-gray-700 hover:bg-gray-50"
                                     >
-                                        Réinitialiser
+                                        {t('parametres.classrooms.reset')}
                                     </Button>
                                 )}
                             </div>
@@ -210,11 +212,11 @@ export default function Index({ classrooms, activeCount, filters, message }: Rea
                                 <Table>
                                     <TableHeader className="bg-gray-50">
                                         <TableRow className="border-b border-gray-200">
-                                            <TableHead className="font-semibold text-gray-900">Nom</TableHead>
-                                            <TableHead className="font-semibold text-gray-900">Code</TableHead>
-                                            <TableHead className="font-semibold text-gray-900">Type</TableHead>
-                                            <TableHead className="font-semibold text-gray-900">Capacité</TableHead>
-                                            <TableHead className="text-center font-semibold text-gray-900 w-36">Actions</TableHead>
+                                            <TableHead className="font-semibold text-gray-900">{t('parametres.classrooms.th_name')}</TableHead>
+                                            <TableHead className="font-semibold text-gray-900">{t('parametres.classrooms.th_code')}</TableHead>
+                                            <TableHead className="font-semibold text-gray-900">{t('parametres.classrooms.th_type')}</TableHead>
+                                            <TableHead className="font-semibold text-gray-900">{t('parametres.classrooms.th_capacity')}</TableHead>
+                                            <TableHead className="text-center font-semibold text-gray-900 w-36">{t('parametres.common.actions')}</TableHead>
                                         </TableRow>
                                     </TableHeader>
                                     <TableBody>
@@ -226,7 +228,7 @@ export default function Index({ classrooms, activeCount, filters, message }: Rea
                                                 >
                                                     <div className="flex flex-col items-center gap-2">
                                                         <Layers className="w-12 h-12 text-gray-300" />
-                                                        <p className="text-lg">Aucune classe trouvée</p>
+                                                        <p className="text-lg">{t('parametres.classrooms.empty')}</p>
                                                     </div>
                                                 </TableCell>
                                             </TableRow>
@@ -264,25 +266,25 @@ export default function Index({ classrooms, activeCount, filters, message }: Rea
                                                     <TableCell className="text-center">
                                                         <div className="flex gap-2 justify-center">
                                                             <IconButton
-                                                                label="Attribuer des matières"
+                                                                label={t('parametres.classrooms.assign_subjects')}
                                                                 icon={<BookPlus className="w-4 h-4" />}
                                                                 className="border-blue-300 text-blue-600 transition-colors duration-200 ease-out hover:bg-blue-50 hover:text-blue-700"
                                                                 onClick={() => router.get(route('classrooms.subject-assignments.create', classroom.id))}
                                                             />
                                                             <IconButton
-                                                                label="Voir"
+                                                                label={t('parametres.common.view')}
                                                                 icon={<Eye className="w-4 h-4" />}
                                                                 className="border-gray-300 text-gray-700 transition-colors duration-200 ease-out hover:bg-blue-50/60 hover:text-blue-800"
                                                                 onClick={() => router.visit(route('classrooms.show', classroom.id))}
                                                             />
                                                             <IconButton
-                                                                label="Modifier"
+                                                                label={t('parametres.common.edit')}
                                                                 icon={<Pencil className="w-4 h-4" />}
                                                                 className="border-gray-300 text-gray-700 transition-colors duration-200 ease-out hover:bg-blue-50/60 hover:text-blue-800"
                                                                 onClick={() => router.visit(route('classrooms.edit', classroom.id))}
                                                             />
                                                             <IconButton
-                                                                label="Supprimer"
+                                                                label={t('parametres.common.delete')}
                                                                 icon={<Trash2 className="w-4 h-4" />}
                                                                 className="border-red-300 text-red-600 transition-colors duration-200 ease-out hover:bg-red-50 hover:text-red-700"
                                                                 onClick={() => setDeleteConfirm(classroom.id)}
@@ -300,7 +302,7 @@ export default function Index({ classrooms, activeCount, filters, message }: Rea
                         {classrooms.last_page > 1 && (
                             <div className="flex items-center justify-between bg-white rounded-lg px-4 py-3 shadow-sm">
                                 <p className="text-sm text-gray-500">
-                                    <span className="font-semibold text-gray-700">{classrooms.from}</span>–<span className="font-semibold text-gray-700">{classrooms.to}</span> sur <span className="font-semibold text-gray-700">{classrooms.total}</span> classes
+                                    <span className="font-semibold text-gray-700">{classrooms.from}</span>–<span className="font-semibold text-gray-700">{classrooms.to}</span> {t('parametres.classrooms.showing_sep')} <span className="font-semibold text-gray-700">{classrooms.total}</span> {t('parametres.classrooms.showing_unit')}
                                 </p>
                                 <div className="flex items-center gap-1">
                                     <Button
@@ -346,22 +348,21 @@ export default function Index({ classrooms, activeCount, filters, message }: Rea
             >
                 <AlertDialogContent>
                     <AlertDialogHeader>
-                        <AlertDialogTitle>Supprimer la classe</AlertDialogTitle>
+                        <AlertDialogTitle>{t('parametres.classrooms.delete_title')}</AlertDialogTitle>
                         <AlertDialogDescription>
-                            Êtes-vous sûr de vouloir supprimer cette classe ?
-                            Cette action est irréversible.
+                            {t('parametres.classrooms.delete_desc')}
                         </AlertDialogDescription>
                     </AlertDialogHeader>
                     <div className="flex gap-3 justify-end">
                         <AlertDialogCancel disabled={isDeleting}>
-                            Annuler
+                            {t('parametres.common.cancel')}
                         </AlertDialogCancel>
                         <AlertDialogAction
                             onClick={() => deleteConfirm && handleDelete(deleteConfirm)}
                             disabled={isDeleting}
                             className="bg-red-600 hover:bg-red-700"
                         >
-                            {isDeleting ? 'Suppression...' : 'Supprimer'}
+                            {isDeleting ? t('parametres.classrooms.deleting') : t('parametres.common.delete')}
                         </AlertDialogAction>
                     </div>
                 </AlertDialogContent>
diff --git a/resources/js/pages/Parametres/Classrooms/Show.tsx b/resources/js/pages/Parametres/Classrooms/Show.tsx
index 62829fda..a3576f23 100644
--- a/resources/js/pages/Parametres/Classrooms/Show.tsx
+++ b/resources/js/pages/Parametres/Classrooms/Show.tsx
@@ -4,6 +4,7 @@ import { useState } from 'react';
 import { Button } from '@/components/ui/button';
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface ClassroomType {
@@ -47,6 +48,8 @@ interface ShowProps {
 }
 
 export default function Show({ classroom, academicYears, subjectAssignments }: Readonly<ShowProps>) {
+    const { t, locale } = useTranslation();
+    const dateLocale = locale === 'en' ? 'en-GB' : 'fr-FR';
     const [selectedYearId, setSelectedYearId] = useState<string>(
         academicYears.find((year) => year.active)?.id || academicYears[0]?.id || ''
     );
@@ -80,7 +83,7 @@ export default function Show({ classroom, academicYears, subjectAssignments }: R
                                         {classroom.name}
                                     </h1>
                                     <p className="text-sm text-gray-600 mt-1">
-                                        Code: <span className="font-semibold">{classroom.code}</span>
+                                        {t('parametres.classrooms.show_code')}: <span className="font-semibold">{classroom.code}</span>
                                     </p>
                                 </div>
                             </div>
@@ -93,14 +96,14 @@ export default function Show({ classroom, academicYears, subjectAssignments }: R
                             onClick={() => router.visit(route('classrooms.subject-assignments.create', classroom.id))}
                         >
                             <BookOpen className="w-4 h-4 mr-2" />
-                            Attribuer des matières
+                            {t('parametres.classrooms.assign_subjects')}
                         </Button>
                         <Button
                             className="bg-blue-600 hover:bg-blue-700"
                             onClick={() => router.visit(route('classrooms.edit', classroom.id))}
                         >
                             <Edit className="w-4 h-4 mr-2" />
-                            Modifier
+                            {t('parametres.common.edit')}
                         </Button>
                     </div>
                 </div>
@@ -108,24 +111,24 @@ export default function Show({ classroom, academicYears, subjectAssignments }: R
                 {/* Informations cards */}
                 <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
                     <div className="bg-white rounded-lg p-6 shadow-sm border border-gray-100">
-                        <p className="text-sm font-medium text-gray-600">Capacité</p>
+                        <p className="text-sm font-medium text-gray-600">{t('parametres.classrooms.show_capacity')}</p>
                         <p className="text-3xl font-bold text-gray-900 mt-2">
                             {classroom.capacity}
                         </p>
-                        <p className="text-xs text-gray-500 mt-1">places disponibles</p>
+                        <p className="text-xs text-gray-500 mt-1">{t('parametres.classrooms.show_capacity_hint')}</p>
                     </div>
 
                     <div className="bg-white rounded-lg p-6 shadow-sm border border-gray-100">
-                        <p className="text-sm font-medium text-gray-600">Type de classe</p>
+                        <p className="text-sm font-medium text-gray-600">{t('parametres.classrooms.show_type')}</p>
                         <p className="text-2xl font-bold text-gray-900 mt-2">
                             {classroom.type?.name || '—'}
                         </p>
                     </div>
 
                     <div className="bg-white rounded-lg p-6 shadow-sm border border-gray-100">
-                        <p className="text-sm font-medium text-gray-600 mb-3">Créée le</p>
+                        <p className="text-sm font-medium text-gray-600 mb-3">{t('parametres.classrooms.show_created_on')}</p>
                         <p className="text-sm text-gray-600">
-                            {new Date(classroom.created_at).toLocaleDateString('fr-FR', {
+                            {new Date(classroom.created_at).toLocaleDateString(dateLocale, {
                                 year: 'numeric',
                                 month: 'long',
                                 day: 'numeric',
@@ -133,9 +136,9 @@ export default function Show({ classroom, academicYears, subjectAssignments }: R
                                 minute: '2-digit',
                             })}
                         </p>
-                        <p className="text-sm font-medium text-gray-600 mt-4 mb-2">Modifiée le</p>
+                        <p className="text-sm font-medium text-gray-600 mt-4 mb-2">{t('parametres.classrooms.show_updated_on')}</p>
                         <p className="text-sm text-gray-600">
-                            {new Date(classroom.updated_at).toLocaleDateString('fr-FR', {
+                            {new Date(classroom.updated_at).toLocaleDateString(dateLocale, {
                                 year: 'numeric',
                                 month: 'long',
                                 day: 'numeric',
@@ -152,17 +155,17 @@ export default function Show({ classroom, academicYears, subjectAssignments }: R
                         <div className="flex items-center justify-between">
                             <div>
                                 <h2 className="text-2xl font-bold text-gray-900">
-                                    Matières et Coefficients
+                                    {t('parametres.classrooms.subjects_title')}
                                 </h2>
                                 <p className="text-sm text-gray-600 mt-1">
-                                    {currentAssignments.length} matière(s) • Total des coefficients: {totalCoefficients.toFixed(2)}
+                                    {t('parametres.classrooms.subjects_summary', { n: currentAssignments.length, total: totalCoefficients.toFixed(2) })}
                                 </p>
                             </div>
                             {academicYears.length > 0 && (
                                 <div className="w-64">
                                     <Select value={selectedYearId} onValueChange={setSelectedYearId}>
                                         <SelectTrigger className="border-gray-200">
-                                            <SelectValue placeholder="Sélectionner une année" />
+                                            <SelectValue placeholder={t('parametres.classrooms.select_year_ph')} />
                                         </SelectTrigger>
                                         <SelectContent>
                                             {academicYears.map((year) => (
@@ -194,12 +197,12 @@ export default function Show({ classroom, academicYears, subjectAssignments }: R
                                                     {assignment.subject.name}
                                                 </p>
                                                 <p className="text-xs text-gray-500">
-                                                    Code: {assignment.subject.code}
+                                                    {t('parametres.classrooms.show_code')}: {assignment.subject.code}
                                                 </p>
                                             </div>
                                         </div>
                                         <span className="inline-flex items-center px-3 py-1 rounded-full text-sm font-semibold bg-amber-100 text-amber-800">
-                                            Coef. {assignment.coefficient}
+                                            {t('parametres.classrooms.coef')} {assignment.coefficient}
                                         </span>
                                     </div>
                                 ))}
@@ -210,13 +213,13 @@ export default function Show({ classroom, academicYears, subjectAssignments }: R
                             <div className="text-center">
                                 <BookOpen className="mx-auto h-12 w-12 text-gray-300" />
                                 <p className="mt-4 text-lg text-gray-500">
-                                    Aucune matière assignée pour cette année académique
+                                    {t('parametres.classrooms.no_assignments')}
                                 </p>
                                 <Button
                                     className="mt-4 bg-blue-600 hover:bg-blue-700"
                                     onClick={() => router.visit(route('classrooms.subject-assignments.create', classroom.id))}
                                 >
-                                    Attribuer des matières
+                                    {t('parametres.classrooms.assign_subjects')}
                                 </Button>
                             </div>
                         </div>
diff --git a/resources/js/pages/Parametres/Classrooms/SubjectAssignments.tsx b/resources/js/pages/Parametres/Classrooms/SubjectAssignments.tsx
index 952c1242..222fb126 100644
--- a/resources/js/pages/Parametres/Classrooms/SubjectAssignments.tsx
+++ b/resources/js/pages/Parametres/Classrooms/SubjectAssignments.tsx
@@ -12,6 +12,7 @@ import {
     SelectValue,
 } from '@/components/ui/select';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface Classroom {
@@ -51,6 +52,7 @@ export default function SubjectAssignments({
     academicYears,
     existingAssignmentsByYear,
 }: Readonly<SubjectAssignmentsProps>) {
+    const { t } = useTranslation();
     const [academicYearId, setAcademicYearId] = useState('');
     const [selectedSubjects, setSelectedSubjects] = useState<string[]>([]);
     const [coefficients, setCoefficients] = useState<Record<string, string>>({});
@@ -124,17 +126,17 @@ export default function SubjectAssignments({
         const newErrors: Record<string, string> = {};
 
         if (!academicYearId) {
-            newErrors.academic_year_id = 'L\'année académique est requise.';
+            newErrors.academic_year_id = t('parametres.classrooms.err_year_required');
         }
 
         if (selectedSubjects.length === 0) {
-            newErrors.subjects = 'Veuillez sélectionner au moins une matière.';
+            newErrors.subjects = t('parametres.classrooms.err_subjects_required');
         }
 
         selectedSubjects.forEach((subjectId) => {
             const coefficient = normalizeCoefficient(coefficients[subjectId] ?? '');
             if (!Number.isFinite(coefficient) || coefficient <= 0) {
-                newErrors[`coefficient_${subjectId}`] = 'Coefficient invalide (doit être > 0).';
+                newErrors[`coefficient_${subjectId}`] = t('parametres.classrooms.err_coef_invalid');
             }
         });
 
@@ -166,7 +168,7 @@ export default function SubjectAssignments({
 
     return (
         <AppLayout>
-            <Head title={`Attributions - ${classroom.name}`} />
+            <Head title={t('parametres.classrooms.assign_head', { name: classroom.name })} />
 
             <div className="space-y-6">
                 <div className="flex items-center gap-4">
@@ -178,24 +180,24 @@ export default function SubjectAssignments({
                     </button>
                     <div>
                         <h1 className="text-3xl font-bold text-gray-900">
-                            Attribuer des matières
+                            {t('parametres.classrooms.assign_title')}
                         </h1>
                         <p className="text-gray-600 mt-1">
-                            Classe : <span className="font-semibold text-gray-900">{classroom.name} ({classroom.code})</span>
+                            {t('parametres.classrooms.assign_class_before')} <span className="font-semibold text-gray-900">{classroom.name} ({classroom.code})</span>
                         </p>
                     </div>
                 </div>
 
                 <form onSubmit={handleSubmit} className="space-y-6">
                     <div className="bg-white rounded-lg p-6 shadow-sm">
-                        <h2 className="text-lg font-semibold text-gray-900 mb-4">Année académique</h2>
+                        <h2 className="text-lg font-semibold text-gray-900 mb-4">{t('parametres.classrooms.assign_year_section')}</h2>
                         <div className="max-w-md">
                             <Select
                                 value={academicYearId}
                                 onValueChange={handleAcademicYearChange}
                             >
                                 <SelectTrigger className={errors.academic_year_id ? 'border-red-500' : ''}>
-                                    <SelectValue placeholder="Sélectionnez une année académique" />
+                                    <SelectValue placeholder={t('parametres.classrooms.assign_year_ph')} />
                                 </SelectTrigger>
                                 <SelectContent>
                                     {academicYears.map((year) => (
@@ -212,13 +214,13 @@ export default function SubjectAssignments({
                     </div>
 
                     <div className="bg-white rounded-lg p-6 shadow-sm">
-                        <h2 className="text-lg font-semibold text-gray-900 mb-4">Matières et coefficients</h2>
+                        <h2 className="text-lg font-semibold text-gray-900 mb-4">{t('parametres.classrooms.assign_subjects_section')}</h2>
 
                         <div className="mb-4 relative max-w-xl">
                             <Search className="absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-400" />
                             <Input
                                 type="text"
-                                placeholder="Rechercher une matière..."
+                                placeholder={t('parametres.classrooms.assign_search_ph')}
                                 value={searchQuery}
                                 onChange={(e) => setSearchQuery(e.target.value)}
                                 className="pl-10 pr-10"
@@ -250,7 +252,7 @@ export default function SubjectAssignments({
                                         className="flex-1 text-left"
                                     >
                                         <p className="text-sm font-medium text-gray-900">{subject.name}</p>
-                                        <p className="text-xs text-gray-500">Code: {subject.code}</p>
+                                        <p className="text-xs text-gray-500">{t('parametres.classrooms.show_code')}: {subject.code}</p>
                                     </button>
                                     {selectedSubjects.includes(subject.id) && (
                                         <div className="w-32">
@@ -259,7 +261,7 @@ export default function SubjectAssignments({
                                                 inputMode="decimal"
                                                 value={coefficients[subject.id] ?? '1'}
                                                 onChange={(e) => updateCoefficient(subject.id, e.target.value)}
-                                                placeholder="Coef"
+                                                placeholder={t('parametres.classrooms.assign_coef_ph')}
                                                 className={errors[`coefficient_${subject.id}`] ? 'border-red-500' : ''}
                                             />
                                         </div>
@@ -274,7 +276,7 @@ export default function SubjectAssignments({
 
                     <div className="bg-blue-50 border border-blue-200 rounded-lg p-4">
                         <p className="text-sm text-blue-900">
-                            <span className="font-semibold">{selectedSubjects.length}</span> matière(s) sélectionnée(s)
+                            {t('parametres.classrooms.assign_selected_count', { n: selectedSubjects.length })}
                         </p>
                     </div>
 
@@ -284,14 +286,14 @@ export default function SubjectAssignments({
                             disabled={isSubmitting}
                             className="bg-blue-600 hover:bg-blue-700"
                         >
-                            {isSubmitting ? 'Enregistrement...' : 'Enregistrer les attributions'}
+                            {isSubmitting ? t('parametres.classrooms.assign_saving') : t('parametres.classrooms.assign_submit')}
                         </Button>
                         <Button
                             type="button"
                             variant="outline"
                             onClick={() => router.get(route('classrooms.index'))}
                         >
-                            Annuler
+                            {t('parametres.common.cancel')}
                         </Button>
                     </div>
                 </form>

From ff47520f7a2b0de00278f387267ece7d52e5012d Mon Sep 17 00:00:00 2001
From: horacioskrp <hervekudayah@gmail.com>
Date: Fri, 13 Nov 2026 10:37:21 +0000
Subject: [PATCH 10/12] =?UTF-8?q?feat(i18n):=20param=C3=A8tres=20=E2=80=94?=
 =?UTF-8?q?=20documents=20(mod=C3=A8les,=20registre,=20d=C3=A9tail,=20?=
 =?UTF-8?q?=C3=A9dition,=20en-t=C3=AAte)=20(FR/EN)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 lang/en/parametres.php                        | 122 ++++++++++++++++++
 lang/fr/parametres.php                        | 122 ++++++++++++++++++
 .../js/pages/Parametres/Documents/Edit.tsx    |  72 ++++++-----
 .../Parametres/Documents/HeaderDesigner.tsx   |  86 ++++++------
 .../js/pages/Parametres/Documents/Index.tsx   |  52 ++++----
 .../pages/Parametres/Documents/Registry.tsx   |  24 ++--
 .../js/pages/Parametres/Documents/Show.tsx    |  39 +++---
 7 files changed, 385 insertions(+), 132 deletions(-)

diff --git a/lang/en/parametres.php b/lang/en/parametres.php
index f1dfe002..12bebdee 100644
--- a/lang/en/parametres.php
+++ b/lang/en/parametres.php
@@ -785,4 +785,126 @@
         'err_subjects_required' => 'Please select at least one subject.',
         'err_coef_invalid' => 'Invalid coefficient (must be > 0).',
     ],
+
+    'documents' => [
+        // Index
+        'head' => 'Document templates',
+        'title' => 'Document templates',
+        'subtitle' => 'Manage certificate, attestation and report card templates exportable to PDF.',
+        'btn_header' => 'Header',
+        'btn_registry' => 'Registry',
+        'btn_new' => 'New template',
+        'cat_empty' => 'No template in this category.',
+        'badge_default' => 'Default',
+        'status_active' => '● Active',
+        'status_inactive' => '● Inactive',
+        'delete_title' => 'Delete this template?',
+        'delete_desc' => 'This action is irreversible. Documents already issued are not affected.',
+        // Registry
+        'registry_head' => 'Document registry',
+        'registry_title' => 'Document registry',
+        'registry_subtitle' => 'Traceability of all issued documents (:n).',
+        'registry_search_ph' => 'Reference no., student name or ID...',
+        'registry_th_ref' => 'Reference',
+        'registry_th_doc' => 'Document',
+        'registry_th_student' => 'Student',
+        'registry_th_issuer' => 'Issued by',
+        'registry_th_date' => 'Date',
+        'registry_empty' => 'No document issued.',
+        // Show
+        'cat_certificat' => 'Certificate',
+        'cat_attestation' => 'Attestation',
+        'cat_bulletin' => 'Report card',
+        'show_features' => 'Characteristics',
+        'show_type' => 'Type',
+        'show_orientation' => 'Orientation',
+        'show_signatory' => 'Signatory',
+        'orientation_portrait' => 'Portrait',
+        'orientation_landscape' => 'Landscape',
+        'flag_header' => 'Official header',
+        'flag_signature' => 'Signature block',
+        'show_default' => 'Default template',
+        'show_active' => 'Active',
+        'show_inactive' => 'Inactive',
+        'show_sample_note' => 'The preview uses sample data. Variables will be replaced with the student\'s real information at generation.',
+        'show_preview' => 'Document preview',
+        // Edit
+        'edit_head' => 'Edit template',
+        'create_head' => 'New template',
+        'edit_title' => 'Edit template',
+        'create_title' => 'New document template',
+        'edit_subtitle' => 'Configure the document and its content with dynamic variables.',
+        'toast_saved_title' => 'Saved',
+        'toast_saved_desc' => 'Template saved.',
+        'toast_error_title' => 'Error',
+        'toast_error_desc' => 'Check the fields.',
+        'toast_preview_error' => 'Preview failed.',
+        'label_category' => 'Category',
+        'label_type' => 'Type',
+        'type_ph' => 'Choose a type',
+        'label_name' => 'Template name',
+        'name_ph' => 'e.g. Standard enrollment certificate',
+        'label_description' => 'Description',
+        'description_ph' => 'Template usage (optional)',
+        'label_source' => 'Body source',
+        'label_layout' => 'Predefined layout',
+        'layout_ph' => 'Choose a layout',
+        'layout_hint' => 'Layout provided by the application (logic, tables). The school header, signature and watermark still apply.',
+        'label_content' => 'Document content',
+        'content_tip' => 'Tip: place the cursor then click a variable on the right to insert it.',
+        'variables_title' => 'Available variables',
+        'insert_var' => 'Insert :var',
+        'options_title' => 'Layout',
+        'label_orientation' => 'Orientation',
+        'label_signatory' => 'Signatory title',
+        'signatory_ph' => 'The Principal',
+        'opt_header' => 'Official header (logo, term, motto)',
+        'opt_signature' => 'Signature block',
+        'opt_default' => 'Default template for this type',
+        'opt_active' => 'Active',
+        'btn_preview' => 'Preview',
+        'preview_sample_title' => 'Preview (sample data)',
+        // HeaderDesigner
+        'hd_head' => 'Document header',
+        'hd_title' => 'Document header',
+        'hd_subtitle' => 'Compose the header used for certificates, attestations and report cards. Drag the blocks to position them.',
+        'hd_reset' => 'Reset',
+        'hd_saving' => 'Saving…',
+        'hd_preset_label' => 'Header template',
+        'hd_watermark_both' => 'The watermark applies to both templates.',
+        'hd_ministerial_title' => 'Ministerial header (official)',
+        'hd_ministerial_p1' => 'The three-column header (Ministry & school · logo · Republic & motto) is generated automatically from the school information. Drag-and-drop is disabled for this template.',
+        'hd_ministerial_p2' => 'To change the ministry, name, logo or motto, go to the school settings.',
+        'hd_add_block' => 'Add a block',
+        'hd_block_logo' => 'Logo',
+        'hd_block_name' => 'Name',
+        'hd_block_motto' => 'Motto',
+        'hd_block_term' => 'Term',
+        'hd_block_contact' => 'Contact details',
+        'hd_block_text' => 'Text',
+        'hd_default_text' => 'Free text',
+        'hd_canvas_title' => 'Preview (A4 width)',
+        'hd_height' => 'Height',
+        'hd_canvas_hint' => 'Click a block to edit it, drag it to move it.',
+        'hd_block_props' => 'Block properties',
+        'hd_select_block' => 'Select a block in the preview.',
+        'hd_size_px' => 'Size (px)',
+        'hd_delete' => 'Delete',
+        'hd_content' => 'Content',
+        'hd_insert_var_ph' => 'Insert a variable…',
+        'hd_size' => 'Size',
+        'hd_width' => 'Width',
+        'hd_delete_block' => 'Delete block',
+        'hd_color' => 'Color',
+        'hd_watermark' => 'Watermark',
+        'hd_enable' => 'Enable',
+        'hd_wm_text' => 'Text',
+        'hd_wm_image' => 'Image / logo',
+        'hd_wm_text_ph' => 'Watermark text',
+        'hd_opacity' => 'Opacity: :n%',
+        'hd_wm_size' => 'Size: :n',
+        'hd_rotation' => 'Rotation: :n°',
+        'hd_var_note_before' => 'Variables like',
+        'hd_var_note_after' => 'are replaced when each document is generated.',
+    ],
 ];
diff --git a/lang/fr/parametres.php b/lang/fr/parametres.php
index 2fe4f79b..9a2ccf32 100644
--- a/lang/fr/parametres.php
+++ b/lang/fr/parametres.php
@@ -785,4 +785,126 @@
         'err_subjects_required' => 'Veuillez sélectionner au moins une matière.',
         'err_coef_invalid' => 'Coefficient invalide (doit être > 0).',
     ],
+
+    'documents' => [
+        // Index
+        'head' => 'Modèles de documents',
+        'title' => 'Modèles de documents',
+        'subtitle' => 'Gérez les modèles de certificats, attestations et bulletins exportables en PDF.',
+        'btn_header' => 'En-tête',
+        'btn_registry' => 'Registre',
+        'btn_new' => 'Nouveau modèle',
+        'cat_empty' => 'Aucun modèle dans cette catégorie.',
+        'badge_default' => 'Défaut',
+        'status_active' => '● Actif',
+        'status_inactive' => '● Inactif',
+        'delete_title' => 'Supprimer ce modèle ?',
+        'delete_desc' => 'Cette action est irréversible. Les documents déjà émis ne sont pas affectés.',
+        // Registry
+        'registry_head' => 'Registre des documents',
+        'registry_title' => 'Registre des documents',
+        'registry_subtitle' => 'Traçabilité de tous les documents délivrés (:n).',
+        'registry_search_ph' => 'N° de référence, nom ou matricule de l\'élève...',
+        'registry_th_ref' => 'Référence',
+        'registry_th_doc' => 'Document',
+        'registry_th_student' => 'Élève',
+        'registry_th_issuer' => 'Délivré par',
+        'registry_th_date' => 'Date',
+        'registry_empty' => 'Aucun document délivré.',
+        // Show
+        'cat_certificat' => 'Certificat',
+        'cat_attestation' => 'Attestation',
+        'cat_bulletin' => 'Bulletin',
+        'show_features' => 'Caractéristiques',
+        'show_type' => 'Type',
+        'show_orientation' => 'Orientation',
+        'show_signatory' => 'Signataire',
+        'orientation_portrait' => 'Portrait',
+        'orientation_landscape' => 'Paysage',
+        'flag_header' => 'En-tête officiel',
+        'flag_signature' => 'Bloc signature',
+        'show_default' => 'Modèle par défaut',
+        'show_active' => 'Actif',
+        'show_inactive' => 'Inactif',
+        'show_sample_note' => 'L\'aperçu utilise des données d\'exemple. Les variables seront remplacées par les informations réelles de l\'élève à la génération.',
+        'show_preview' => 'Aperçu du document',
+        // Edit
+        'edit_head' => 'Modifier le modèle',
+        'create_head' => 'Nouveau modèle',
+        'edit_title' => 'Modifier le modèle',
+        'create_title' => 'Nouveau modèle de document',
+        'edit_subtitle' => 'Configurez le document et son contenu avec variables dynamiques.',
+        'toast_saved_title' => 'Enregistré',
+        'toast_saved_desc' => 'Modèle sauvegardé.',
+        'toast_error_title' => 'Erreur',
+        'toast_error_desc' => 'Vérifiez les champs.',
+        'toast_preview_error' => 'Prévisualisation impossible.',
+        'label_category' => 'Catégorie',
+        'label_type' => 'Type',
+        'type_ph' => 'Choisir un type',
+        'label_name' => 'Nom du modèle',
+        'name_ph' => 'Ex: Certificat de scolarité standard',
+        'label_description' => 'Description',
+        'description_ph' => 'Usage du modèle (optionnel)',
+        'label_source' => 'Source du corps',
+        'label_layout' => 'Mise en page prédéfinie',
+        'layout_ph' => 'Choisir une mise en page',
+        'layout_hint' => 'Mise en page fournie par l\'application (logique, tableaux). En-tête, signature et filigrane de l\'école restent appliqués.',
+        'label_content' => 'Contenu du document',
+        'content_tip' => 'Astuce : placez le curseur puis cliquez une variable à droite pour l\'insérer.',
+        'variables_title' => 'Variables disponibles',
+        'insert_var' => 'Insérer :var',
+        'options_title' => 'Mise en page',
+        'label_orientation' => 'Orientation',
+        'label_signatory' => 'Titre du signataire',
+        'signatory_ph' => 'Le Directeur',
+        'opt_header' => 'En-tête officiel (logo, terme, devise)',
+        'opt_signature' => 'Bloc signature',
+        'opt_default' => 'Modèle par défaut pour ce type',
+        'opt_active' => 'Actif',
+        'btn_preview' => 'Prévisualiser',
+        'preview_sample_title' => 'Aperçu (données d\'exemple)',
+        // HeaderDesigner
+        'hd_head' => 'En-tête des documents',
+        'hd_title' => 'En-tête des documents',
+        'hd_subtitle' => 'Composez l\'en-tête utilisé pour les certificats, attestations et bulletins. Glissez les blocs pour les positionner.',
+        'hd_reset' => 'Réinitialiser',
+        'hd_saving' => 'Enregistrement…',
+        'hd_preset_label' => 'Modèle d\'en-tête',
+        'hd_watermark_both' => 'Le filigrane s\'applique aux deux modèles.',
+        'hd_ministerial_title' => 'En-tête ministériel (officiel)',
+        'hd_ministerial_p1' => 'L\'en-tête à trois colonnes (Ministère & établissement · logo · République & devise) est généré automatiquement à partir des informations de l\'école. Le glisser-déposer est désactivé pour ce modèle.',
+        'hd_ministerial_p2' => 'Pour modifier le ministère, le nom, le logo ou la devise, rendez-vous dans les réglages de l\'école.',
+        'hd_add_block' => 'Ajouter un bloc',
+        'hd_block_logo' => 'Logo',
+        'hd_block_name' => 'Nom',
+        'hd_block_motto' => 'Devise',
+        'hd_block_term' => 'Terme',
+        'hd_block_contact' => 'Coordonnées',
+        'hd_block_text' => 'Texte',
+        'hd_default_text' => 'Texte libre',
+        'hd_canvas_title' => 'Aperçu (largeur A4)',
+        'hd_height' => 'Hauteur',
+        'hd_canvas_hint' => 'Cliquez un bloc pour le modifier, glissez-le pour le déplacer.',
+        'hd_block_props' => 'Propriétés du bloc',
+        'hd_select_block' => 'Sélectionnez un bloc dans l\'aperçu.',
+        'hd_size_px' => 'Taille (px)',
+        'hd_delete' => 'Supprimer',
+        'hd_content' => 'Contenu',
+        'hd_insert_var_ph' => 'Insérer une variable…',
+        'hd_size' => 'Taille',
+        'hd_width' => 'Largeur',
+        'hd_delete_block' => 'Supprimer le bloc',
+        'hd_color' => 'Couleur',
+        'hd_watermark' => 'Filigrane',
+        'hd_enable' => 'Activer',
+        'hd_wm_text' => 'Texte',
+        'hd_wm_image' => 'Image / logo',
+        'hd_wm_text_ph' => 'Texte du filigrane',
+        'hd_opacity' => 'Opacité : :n%',
+        'hd_wm_size' => 'Taille : :n',
+        'hd_rotation' => 'Rotation : :n°',
+        'hd_var_note_before' => 'Les variables comme',
+        'hd_var_note_after' => 'sont remplacées à la génération de chaque document.',
+    ],
 ];
diff --git a/resources/js/pages/Parametres/Documents/Edit.tsx b/resources/js/pages/Parametres/Documents/Edit.tsx
index d371f1aa..7685fd45 100644
--- a/resources/js/pages/Parametres/Documents/Edit.tsx
+++ b/resources/js/pages/Parametres/Documents/Edit.tsx
@@ -10,6 +10,7 @@ import { Input } from '@/components/ui/input';
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
 import { useToast } from '@/components/ui/toast';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface Template {
@@ -42,6 +43,7 @@ interface Props {
 }
 
 export default function Edit({ template, categories, types, sources, layouts, variables }: Readonly<Props>) {
+    const { t } = useTranslation();
     const isEdit = !!template;
     const { toast } = useToast();
     const editorRef = useRef<Editor | null>(null);
@@ -74,8 +76,8 @@ export default function Edit({ template, categories, types, sources, layouts, va
     const submit = (e: React.FormEvent) => {
         e.preventDefault();
         const opts = {
-            onSuccess: () => toast({ title: 'Enregistré', description: 'Modèle sauvegardé.', variant: 'success' as const }),
-            onError:   () => toast({ title: 'Erreur', description: 'Vérifiez les champs.', variant: 'error' as const }),
+            onSuccess: () => toast({ title: t('parametres.documents.toast_saved_title'), description: t('parametres.documents.toast_saved_desc'), variant: 'success' as const }),
+            onError:   () => toast({ title: t('parametres.documents.toast_error_title'), description: t('parametres.documents.toast_error_desc'), variant: 'error' as const }),
         };
         if (isEdit) put(route('document-templates.update', template!.id), opts);
         else post(route('document-templates.store'), opts);
@@ -95,7 +97,7 @@ export default function Edit({ template, categories, types, sources, layouts, va
             }, { headers: { 'X-CSRF-TOKEN': csrf, 'X-Requested-With': 'XMLHttpRequest' } });
             setPreviewHtml(res.data.html);
         } catch {
-            toast({ title: 'Erreur', description: 'Prévisualisation impossible.', variant: 'error' });
+            toast({ title: t('parametres.documents.toast_error_title'), description: t('parametres.documents.toast_preview_error'), variant: 'error' });
         } finally {
             setPreviewing(false);
         }
@@ -105,7 +107,7 @@ export default function Edit({ template, categories, types, sources, layouts, va
 
     return (
         <AppLayout>
-            <Head title={isEdit ? 'Modifier le modèle' : 'Nouveau modèle'} />
+            <Head title={isEdit ? t('parametres.documents.edit_head') : t('parametres.documents.create_head')} />
             <div className="w-full space-y-6">
 
                 <div className="flex items-center gap-4">
@@ -113,8 +115,8 @@ export default function Edit({ template, categories, types, sources, layouts, va
                         <ArrowLeft className="w-5 h-5 text-gray-600" />
                     </button>
                     <div>
-                        <h1 className="text-3xl font-bold text-gray-900">{isEdit ? 'Modifier le modèle' : 'Nouveau modèle de document'}</h1>
-                        <p className="text-gray-500 mt-1">Configurez le document et son contenu avec variables dynamiques.</p>
+                        <h1 className="text-3xl font-bold text-gray-900">{isEdit ? t('parametres.documents.edit_title') : t('parametres.documents.create_title')}</h1>
+                        <p className="text-gray-500 mt-1">{t('parametres.documents.edit_subtitle')}</p>
                     </div>
                 </div>
 
@@ -125,7 +127,7 @@ export default function Edit({ template, categories, types, sources, layouts, va
                         <div className="bg-white rounded-2xl ring-1 ring-gray-100 shadow-sm p-6 space-y-4">
                             <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
                                 <div className="space-y-1.5">
-                                    <label className="text-sm font-medium text-gray-700">Catégorie *</label>
+                                    <label className="text-sm font-medium text-gray-700">{t('parametres.documents.label_category')} *</label>
                                     <Select value={data.category} onValueChange={v => { setData('category', v); setData('type', ''); }}>
                                         <SelectTrigger><SelectValue /></SelectTrigger>
                                         <SelectContent>
@@ -134,9 +136,9 @@ export default function Edit({ template, categories, types, sources, layouts, va
                                     </Select>
                                 </div>
                                 <div className="space-y-1.5">
-                                    <label className="text-sm font-medium text-gray-700">Type *</label>
+                                    <label className="text-sm font-medium text-gray-700">{t('parametres.documents.label_type')} *</label>
                                     <Select value={data.type} onValueChange={v => setData('type', v)}>
-                                        <SelectTrigger className={errors.type ? 'border-red-400' : ''}><SelectValue placeholder="Choisir un type" /></SelectTrigger>
+                                        <SelectTrigger className={errors.type ? 'border-red-400' : ''}><SelectValue placeholder={t('parametres.documents.type_ph')} /></SelectTrigger>
                                         <SelectContent>
                                             {Object.entries(typeOptions).map(([k, label]) => <SelectItem key={k} value={k}>{label}</SelectItem>)}
                                         </SelectContent>
@@ -147,13 +149,13 @@ export default function Edit({ template, categories, types, sources, layouts, va
 
                             <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
                                 <div className="space-y-1.5">
-                                    <label className="text-sm font-medium text-gray-700">Nom du modèle *</label>
-                                    <Input value={data.name} onChange={e => setData('name', e.target.value)} placeholder="Ex: Certificat de scolarité standard" className={errors.name ? 'border-red-400' : ''} />
+                                    <label className="text-sm font-medium text-gray-700">{t('parametres.documents.label_name')} *</label>
+                                    <Input value={data.name} onChange={e => setData('name', e.target.value)} placeholder={t('parametres.documents.name_ph')} className={errors.name ? 'border-red-400' : ''} />
                                     {errors.name && <p className="text-xs text-red-500">{errors.name}</p>}
                                 </div>
                                 <div className="space-y-1.5">
-                                    <label className="text-sm font-medium text-gray-700">Description</label>
-                                    <Input value={data.description} onChange={e => setData('description', e.target.value)} placeholder="Usage du modèle (optionnel)" />
+                                    <label className="text-sm font-medium text-gray-700">{t('parametres.documents.label_description')}</label>
+                                    <Input value={data.description} onChange={e => setData('description', e.target.value)} placeholder={t('parametres.documents.description_ph')} />
                                 </div>
                             </div>
                         </div>
@@ -161,7 +163,7 @@ export default function Edit({ template, categories, types, sources, layouts, va
                         {/* Source du corps : mise en page prédéfinie (Blade) ou éditeur libre */}
                         <div className="bg-white rounded-2xl ring-1 ring-gray-100 shadow-sm p-6 space-y-4">
                             <div className="space-y-1.5">
-                                <label className="text-sm font-medium text-gray-700">Source du corps *</label>
+                                <label className="text-sm font-medium text-gray-700">{t('parametres.documents.label_source')} *</label>
                                 <Select value={data.source} onValueChange={v => setData('source', v as 'wysiwyg' | 'blade')}>
                                     <SelectTrigger><SelectValue /></SelectTrigger>
                                     <SelectContent>
@@ -172,21 +174,21 @@ export default function Edit({ template, categories, types, sources, layouts, va
 
                             {data.source === 'blade' ? (
                                 <div className="space-y-1.5">
-                                    <label className="text-sm font-medium text-gray-700">Mise en page prédéfinie *</label>
+                                    <label className="text-sm font-medium text-gray-700">{t('parametres.documents.label_layout')} *</label>
                                     <Select value={data.layout} onValueChange={v => setData('layout', v)}>
-                                        <SelectTrigger className={errors.layout ? 'border-red-400' : ''}><SelectValue placeholder="Choisir une mise en page" /></SelectTrigger>
+                                        <SelectTrigger className={errors.layout ? 'border-red-400' : ''}><SelectValue placeholder={t('parametres.documents.layout_ph')} /></SelectTrigger>
                                         <SelectContent>
                                             {Object.entries(layouts).map(([k, label]) => <SelectItem key={k} value={k}>{label}</SelectItem>)}
                                         </SelectContent>
                                     </Select>
                                     {errors.layout && <p className="text-xs text-red-500">{errors.layout}</p>}
-                                    <p className="text-xs text-gray-400">Mise en page fournie par l'application (logique, tableaux). En-tête, signature et filigrane de l'école restent appliqués.</p>
+                                    <p className="text-xs text-gray-400">{t('parametres.documents.layout_hint')}</p>
                                 </div>
                             ) : (
                                 <div className="space-y-3">
-                                    <label className="text-sm font-medium text-gray-700">Contenu du document</label>
+                                    <label className="text-sm font-medium text-gray-700">{t('parametres.documents.label_content')}</label>
                                     <RichTextEditor value={data.content} onChange={v => setData('content', v)} onReady={handleEditorReady} />
-                                    <p className="text-xs text-gray-400">Astuce : placez le curseur puis cliquez une variable à droite pour l'insérer.</p>
+                                    <p className="text-xs text-gray-400">{t('parametres.documents.content_tip')}</p>
                                 </div>
                             )}
                         </div>
@@ -196,7 +198,7 @@ export default function Edit({ template, categories, types, sources, layouts, va
                     <div className="space-y-6">
                         {/* Variables */}
                         <div className="bg-white rounded-2xl ring-1 ring-gray-100 shadow-sm p-5">
-                            <h3 className="text-sm font-semibold text-gray-900 mb-3">Variables disponibles</h3>
+                            <h3 className="text-sm font-semibold text-gray-900 mb-3">{t('parametres.documents.variables_title')}</h3>
                             <div className="space-y-4 max-h-80 overflow-y-auto pr-1">
                                 {Object.entries(variables).map(([groupKey, group]) => (
                                     <div key={groupKey}>
@@ -207,7 +209,7 @@ export default function Edit({ template, categories, types, sources, layouts, va
                                                     key={key}
                                                     type="button"
                                                     onClick={() => insertVariable(key)}
-                                                    title={`Insérer {{ ${key} }}`}
+                                                    title={t('parametres.documents.insert_var', { var: `{{ ${key} }}` })}
                                                     className="inline-flex items-center gap-1 text-xs bg-gray-50 hover:bg-blue-50 hover:text-blue-700 ring-1 ring-gray-200 rounded-md px-2 py-1 transition-colors"
                                                 >
                                                     <Plus className="w-3 h-3" /> {label}
@@ -221,39 +223,39 @@ export default function Edit({ template, categories, types, sources, layouts, va
 
                         {/* Options */}
                         <div className="bg-white rounded-2xl ring-1 ring-gray-100 shadow-sm p-5 space-y-4">
-                            <h3 className="text-sm font-semibold text-gray-900">Mise en page</h3>
+                            <h3 className="text-sm font-semibold text-gray-900">{t('parametres.documents.options_title')}</h3>
 
                             <div className="space-y-1.5">
-                                <label className="text-sm font-medium text-gray-700">Orientation</label>
+                                <label className="text-sm font-medium text-gray-700">{t('parametres.documents.label_orientation')}</label>
                                 <Select value={data.orientation} onValueChange={v => setData('orientation', v as 'portrait' | 'landscape')}>
                                     <SelectTrigger><SelectValue /></SelectTrigger>
                                     <SelectContent>
-                                        <SelectItem value="portrait">Portrait</SelectItem>
-                                        <SelectItem value="landscape">Paysage</SelectItem>
+                                        <SelectItem value="portrait">{t('parametres.documents.orientation_portrait')}</SelectItem>
+                                        <SelectItem value="landscape">{t('parametres.documents.orientation_landscape')}</SelectItem>
                                     </SelectContent>
                                 </Select>
                             </div>
 
                             <div className="space-y-1.5">
-                                <label className="text-sm font-medium text-gray-700">Titre du signataire</label>
-                                <Input value={data.signatory_title} onChange={e => setData('signatory_title', e.target.value)} placeholder="Le Directeur" />
+                                <label className="text-sm font-medium text-gray-700">{t('parametres.documents.label_signatory')}</label>
+                                <Input value={data.signatory_title} onChange={e => setData('signatory_title', e.target.value)} placeholder={t('parametres.documents.signatory_ph')} />
                             </div>
 
                             <label className="flex items-center gap-2.5 cursor-pointer">
                                 <Checkbox checked={data.header_enabled} onCheckedChange={c => setData('header_enabled', c === true)} />
-                                <span className="text-sm text-gray-700">En-tête officiel (logo, terme, devise)</span>
+                                <span className="text-sm text-gray-700">{t('parametres.documents.opt_header')}</span>
                             </label>
                             <label className="flex items-center gap-2.5 cursor-pointer">
                                 <Checkbox checked={data.show_signature} onCheckedChange={c => setData('show_signature', c === true)} />
-                                <span className="text-sm text-gray-700">Bloc signature</span>
+                                <span className="text-sm text-gray-700">{t('parametres.documents.opt_signature')}</span>
                             </label>
                             <label className="flex items-center gap-2.5 cursor-pointer">
                                 <Checkbox checked={data.is_default} onCheckedChange={c => setData('is_default', c === true)} />
-                                <span className="text-sm text-gray-700">Modèle par défaut pour ce type</span>
+                                <span className="text-sm text-gray-700">{t('parametres.documents.opt_default')}</span>
                             </label>
                             <label className="flex items-center gap-2.5 cursor-pointer">
                                 <Checkbox checked={data.is_active} onCheckedChange={c => setData('is_active', c === true)} />
-                                <span className="text-sm text-gray-700">Actif</span>
+                                <span className="text-sm text-gray-700">{t('parametres.documents.opt_active')}</span>
                             </label>
                         </div>
 
@@ -261,11 +263,11 @@ export default function Edit({ template, categories, types, sources, layouts, va
                         <div className="flex flex-col gap-2">
                             <Button type="button" variant="outline" onClick={handlePreview} disabled={previewing} className="gap-2">
                                 {previewing ? <Loader2 className="w-4 h-4 animate-spin" /> : <Eye className="w-4 h-4" />}
-                                Prévisualiser
+                                {t('parametres.documents.btn_preview')}
                             </Button>
                             <Button type="submit" disabled={processing} className="bg-blue-600 hover:bg-blue-700 gap-2">
                                 {processing ? <Loader2 className="w-4 h-4 animate-spin" /> : <Save className="w-4 h-4" />}
-                                Enregistrer
+                                {t('parametres.common.save')}
                             </Button>
                         </div>
                     </div>
@@ -275,9 +277,9 @@ export default function Edit({ template, categories, types, sources, layouts, va
                 {previewHtml && (
                     <div className="bg-white rounded-2xl ring-1 ring-gray-100 shadow-sm p-6">
                         <h3 className="text-sm font-semibold text-gray-900 mb-3 flex items-center gap-2">
-                            <Eye className="w-4 h-4" /> Aperçu (données d'exemple)
+                            <Eye className="w-4 h-4" /> {t('parametres.documents.preview_sample_title')}
                         </h3>
-                        <iframe title="Aperçu" srcDoc={previewHtml} className="w-full h-[600px] rounded-lg ring-1 ring-gray-200 bg-white" />
+                        <iframe title={t('parametres.documents.preview_sample_title')} srcDoc={previewHtml} className="w-full h-[600px] rounded-lg ring-1 ring-gray-200 bg-white" />
                     </div>
                 )}
             </div>
diff --git a/resources/js/pages/Parametres/Documents/HeaderDesigner.tsx b/resources/js/pages/Parametres/Documents/HeaderDesigner.tsx
index d700a466..42153ae7 100644
--- a/resources/js/pages/Parametres/Documents/HeaderDesigner.tsx
+++ b/resources/js/pages/Parametres/Documents/HeaderDesigner.tsx
@@ -12,6 +12,7 @@ import {
     Select, SelectContent, SelectItem, SelectTrigger, SelectValue,
 } from '@/components/ui/select';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 type Align = 'left' | 'center' | 'right';
@@ -60,6 +61,7 @@ const uid = () => (crypto.randomUUID ? crypto.randomUUID() : `el-${Date.now()}-$
 const clamp = (v: number, min: number, max: number) => Math.max(min, Math.min(max, v));
 
 export default function HeaderDesigner({ header, preset: initialPreset, presets, default: fallback, watermarkImageUrl, variables, canvasWidth, school }: Readonly<Props>) {
+    const { t } = useTranslation();
     const [preset, setPreset] = useState<string>(initialPreset ?? 'ministeriel');
     const [elements, setElements] = useState<El[]>(header.layout.elements ?? []);
     const [height, setHeight] = useState<number>(header.layout.height ?? 130);
@@ -92,7 +94,7 @@ export default function HeaderDesigner({ header, preset: initialPreset, presets,
 
     const addElement = (preset: Partial<El>) => {
         const el: El = {
-            id: uid(), type: 'text', x: 24, y: 20, w: 240, content: 'Texte',
+            id: uid(), type: 'text', x: 24, y: 20, w: 240, content: t('parametres.documents.hd_block_text'),
             fontSize: 13, bold: false, italic: false, align: 'left', color: '#1a1a1a', ...preset,
         };
         setElements((els) => [...els, el]);
@@ -166,37 +168,37 @@ export default function HeaderDesigner({ header, preset: initialPreset, presets,
 
     return (
         <AppLayout>
-            <Head title="En-tête des documents" />
+            <Head title={t('parametres.documents.hd_head')} />
             <div className="w-full space-y-6">
 
                 {/* En-tête de page */}
                 <div className="flex items-start justify-between gap-4 flex-wrap">
                     <div>
                         <h1 className="text-4xl font-bold tracking-tight text-gray-900 flex items-center gap-3">
-                            <LayoutTemplate className="h-7 w-7 text-blue-600 shrink-0" /> En-tête des documents
+                            <LayoutTemplate className="h-7 w-7 text-blue-600 shrink-0" /> {t('parametres.documents.hd_title')}
                         </h1>
-                        <p className="mt-2 text-gray-500">Composez l'en-tête utilisé pour les certificats, attestations et bulletins. Glissez les blocs pour les positionner.</p>
+                        <p className="mt-2 text-gray-500">{t('parametres.documents.hd_subtitle')}</p>
                     </div>
                     <div className="flex items-center gap-2">
                         <Button variant="outline" className="gap-2" onClick={resetDefault}>
-                            <RotateCcw className="w-4 h-4" /> Réinitialiser
+                            <RotateCcw className="w-4 h-4" /> {t('parametres.documents.hd_reset')}
                         </Button>
                         <Button className="gap-2 bg-blue-600 hover:bg-blue-700" onClick={save} disabled={saving}>
-                            <Save className="w-4 h-4" /> {saving ? 'Enregistrement…' : 'Enregistrer'}
+                            <Save className="w-4 h-4" /> {saving ? t('parametres.documents.hd_saving') : t('parametres.common.save')}
                         </Button>
                     </div>
                 </div>
 
                 {/* Préréglage d'en-tête */}
                 <div className="rounded-2xl bg-white p-4 shadow-sm ring-1 ring-slate-100 flex flex-wrap items-center gap-3">
-                    <p className="text-xs font-semibold uppercase tracking-wide text-gray-400">Modèle d'en-tête</p>
+                    <p className="text-xs font-semibold uppercase tracking-wide text-gray-400">{t('parametres.documents.hd_preset_label')}</p>
                     <Select value={preset} onValueChange={setPreset}>
                         <SelectTrigger className="w-72"><SelectValue /></SelectTrigger>
                         <SelectContent>
                             {Object.entries(presets).map(([k, label]) => <SelectItem key={k} value={k}>{label}</SelectItem>)}
                         </SelectContent>
                     </Select>
-                    <p className="text-xs text-gray-400">Le filigrane s'applique aux deux modèles.</p>
+                    <p className="text-xs text-gray-400">{t('parametres.documents.hd_watermark_both')}</p>
                 </div>
 
                 <div className="grid grid-cols-1 lg:grid-cols-[1fr_320px] gap-6">
@@ -204,33 +206,33 @@ export default function HeaderDesigner({ header, preset: initialPreset, presets,
                     <div className="space-y-4">
                         {preset !== 'personnalise' && (
                             <div className="rounded-2xl bg-blue-50/60 p-5 ring-1 ring-blue-100 text-sm text-gray-700 space-y-2">
-                                <p className="font-semibold text-gray-900">En-tête ministériel (officiel)</p>
-                                <p>L'en-tête à trois colonnes (Ministère &amp; établissement · logo · République &amp; devise) est généré automatiquement à partir des informations de l'école. Le glisser-déposer est désactivé pour ce modèle.</p>
-                                <p className="text-xs text-gray-500">Pour modifier le ministère, le nom, le logo ou la devise, rendez-vous dans les réglages de l'école.</p>
+                                <p className="font-semibold text-gray-900">{t('parametres.documents.hd_ministerial_title')}</p>
+                                <p>{t('parametres.documents.hd_ministerial_p1')}</p>
+                                <p className="text-xs text-gray-500">{t('parametres.documents.hd_ministerial_p2')}</p>
                             </div>
                         )}
                         {preset === 'personnalise' && (<>
                         {/* Palette */}
                         <div className="rounded-2xl bg-white p-4 shadow-sm ring-1 ring-slate-100">
-                            <p className="text-xs font-semibold uppercase tracking-wide text-gray-400 mb-3">Ajouter un bloc</p>
+                            <p className="text-xs font-semibold uppercase tracking-wide text-gray-400 mb-3">{t('parametres.documents.hd_add_block')}</p>
                             <div className="flex flex-wrap gap-2">
                                 <Button size="sm" variant="outline" className="gap-1.5" onClick={() => school.logo_url ? addElement({ type: 'logo', content: '', w: 70 }) : undefined} disabled={!school.logo_url}>
-                                    <ImageIcon className="w-4 h-4" /> Logo
+                                    <ImageIcon className="w-4 h-4" /> {t('parametres.documents.hd_block_logo')}
                                 </Button>
                                 <Button size="sm" variant="outline" className="gap-1.5" onClick={() => addElement({ content: '{{ecole.nom}}', fontSize: 16, bold: true, align: 'center', w: 360 })}>
-                                    <Plus className="w-4 h-4" /> Nom
+                                    <Plus className="w-4 h-4" /> {t('parametres.documents.hd_block_name')}
                                 </Button>
                                 <Button size="sm" variant="outline" className="gap-1.5" onClick={() => addElement({ content: '{{ecole.devise}}', fontSize: 11, italic: true, align: 'center', w: 360, color: '#444444' })}>
-                                    <Plus className="w-4 h-4" /> Devise
+                                    <Plus className="w-4 h-4" /> {t('parametres.documents.hd_block_motto')}
                                 </Button>
                                 <Button size="sm" variant="outline" className="gap-1.5" onClick={() => addElement({ content: '{{ecole.terme}}', fontSize: 13, bold: true, align: 'center', w: 360 })}>
-                                    <Plus className="w-4 h-4" /> Terme
+                                    <Plus className="w-4 h-4" /> {t('parametres.documents.hd_block_term')}
                                 </Button>
                                 <Button size="sm" variant="outline" className="gap-1.5" onClick={() => addElement({ content: '{{ecole.bp}} – {{ecole.ville}} – {{ecole.telephone}}', fontSize: 10, align: 'center', w: 420, color: '#555555' })}>
-                                    <Plus className="w-4 h-4" /> Coordonnées
+                                    <Plus className="w-4 h-4" /> {t('parametres.documents.hd_block_contact')}
                                 </Button>
-                                <Button size="sm" variant="outline" className="gap-1.5" onClick={() => addElement({ content: 'Texte libre' })}>
-                                    <Type className="w-4 h-4" /> Texte
+                                <Button size="sm" variant="outline" className="gap-1.5" onClick={() => addElement({ content: t('parametres.documents.hd_default_text') })}>
+                                    <Type className="w-4 h-4" /> {t('parametres.documents.hd_block_text')}
                                 </Button>
                             </div>
                         </div>
@@ -238,9 +240,9 @@ export default function HeaderDesigner({ header, preset: initialPreset, presets,
                         {/* Canvas */}
                         <div className="rounded-2xl bg-white p-4 shadow-sm ring-1 ring-slate-100">
                             <div className="flex items-center justify-between mb-3">
-                                <p className="text-xs font-semibold uppercase tracking-wide text-gray-400">Aperçu (largeur A4)</p>
+                                <p className="text-xs font-semibold uppercase tracking-wide text-gray-400">{t('parametres.documents.hd_canvas_title')}</p>
                                 <div className="flex items-center gap-2">
-                                    <Label className="text-xs text-gray-500">Hauteur</Label>
+                                    <Label className="text-xs text-gray-500">{t('parametres.documents.hd_height')}</Label>
                                     <Input type="number" value={height} min={60} max={400}
                                         onChange={(e) => setHeight(clamp(Number(e.target.value) || 130, 60, 400))}
                                         className="h-8 w-20" />
@@ -273,7 +275,7 @@ export default function HeaderDesigner({ header, preset: initialPreset, presets,
                                     ))}
                                 </div>
                             </div>
-                            <p className="mt-2 text-xs text-gray-400">Cliquez un bloc pour le modifier, glissez-le pour le déplacer.</p>
+                            <p className="mt-2 text-xs text-gray-400">{t('parametres.documents.hd_canvas_hint')}</p>
                         </div>
                         </>)}
                     </div>
@@ -282,29 +284,29 @@ export default function HeaderDesigner({ header, preset: initialPreset, presets,
                     <div className="space-y-4">
                         {preset === 'personnalise' && (
                         <div className="rounded-2xl bg-white p-4 shadow-sm ring-1 ring-slate-100">
-                            <p className="text-xs font-semibold uppercase tracking-wide text-gray-400 mb-3">Propriétés du bloc</p>
+                            <p className="text-xs font-semibold uppercase tracking-wide text-gray-400 mb-3">{t('parametres.documents.hd_block_props')}</p>
                             {!selected ? (
-                                <p className="text-sm text-gray-400">Sélectionnez un bloc dans l'aperçu.</p>
+                                <p className="text-sm text-gray-400">{t('parametres.documents.hd_select_block')}</p>
                             ) : selected.type === 'logo' ? (
                                 <div className="space-y-3">
                                     <div className="space-y-1.5">
-                                        <Label className="text-xs">Taille (px)</Label>
+                                        <Label className="text-xs">{t('parametres.documents.hd_size_px')}</Label>
                                         <Input type="number" value={selected.w} min={20} max={300}
                                             onChange={(e) => update(selected.id, { w: clamp(Number(e.target.value) || 70, 20, 300) })} className="h-9" />
                                     </div>
                                     <Button variant="outline" size="sm" className="w-full gap-1.5 border-red-200 text-red-500 hover:bg-red-50" onClick={removeSelected}>
-                                        <Trash2 className="w-3.5 h-3.5" /> Supprimer
+                                        <Trash2 className="w-3.5 h-3.5" /> {t('parametres.documents.hd_delete')}
                                     </Button>
                                 </div>
                             ) : (
                                 <div className="space-y-3">
                                     <div className="space-y-1.5">
-                                        <Label className="text-xs">Contenu</Label>
+                                        <Label className="text-xs">{t('parametres.documents.hd_content')}</Label>
                                         <textarea value={selected.content} rows={2}
                                             onChange={(e) => update(selected.id, { content: e.target.value })}
                                             className="w-full rounded-md border border-gray-300 px-2.5 py-1.5 text-sm" />
                                         <Select onValueChange={(v) => update(selected.id, { content: `${selected.content} {{${v}}}` })}>
-                                            <SelectTrigger className="h-8 text-xs"><SelectValue placeholder="Insérer une variable…" /></SelectTrigger>
+                                            <SelectTrigger className="h-8 text-xs"><SelectValue placeholder={t('parametres.documents.hd_insert_var_ph')} /></SelectTrigger>
                                             <SelectContent>
                                                 {flatVariables.map(([key, label]) => (
                                                     <SelectItem key={key} value={key} className="text-xs">{label}</SelectItem>
@@ -314,12 +316,12 @@ export default function HeaderDesigner({ header, preset: initialPreset, presets,
                                     </div>
                                     <div className="grid grid-cols-2 gap-3">
                                         <div className="space-y-1.5">
-                                            <Label className="text-xs">Taille</Label>
+                                            <Label className="text-xs">{t('parametres.documents.hd_size')}</Label>
                                             <Input type="number" value={selected.fontSize} min={6} max={48}
                                                 onChange={(e) => update(selected.id, { fontSize: clamp(Number(e.target.value) || 12, 6, 48) })} className="h-9" />
                                         </div>
                                         <div className="space-y-1.5">
-                                            <Label className="text-xs">Largeur</Label>
+                                            <Label className="text-xs">{t('parametres.documents.hd_width')}</Label>
                                             <Input type="number" value={selected.w} min={40} max={canvasWidth}
                                                 onChange={(e) => update(selected.id, { w: clamp(Number(e.target.value) || 200, 40, canvasWidth) })} className="h-9" />
                                         </div>
@@ -338,10 +340,10 @@ export default function HeaderDesigner({ header, preset: initialPreset, presets,
                                             ))}
                                         </div>
                                         <input type="color" value={selected.color} onChange={(e) => update(selected.id, { color: e.target.value })}
-                                            className="h-9 w-9 rounded-md border border-gray-200 p-0.5" aria-label="Couleur" />
+                                            className="h-9 w-9 rounded-md border border-gray-200 p-0.5" aria-label={t('parametres.documents.hd_color')} />
                                     </div>
                                     <Button variant="outline" size="sm" className="w-full gap-1.5 border-red-200 text-red-500 hover:bg-red-50" onClick={removeSelected}>
-                                        <Trash2 className="w-3.5 h-3.5" /> Supprimer le bloc
+                                        <Trash2 className="w-3.5 h-3.5" /> {t('parametres.documents.hd_delete_block')}
                                     </Button>
                                 </div>
                             )}
@@ -351,10 +353,10 @@ export default function HeaderDesigner({ header, preset: initialPreset, presets,
                         {/* Filigrane */}
                         <div className="rounded-2xl bg-white p-4 shadow-sm ring-1 ring-slate-100">
                             <div className="flex items-center justify-between mb-3">
-                                <p className="text-xs font-semibold uppercase tracking-wide text-gray-400">Filigrane</p>
+                                <p className="text-xs font-semibold uppercase tracking-wide text-gray-400">{t('parametres.documents.hd_watermark')}</p>
                                 <label className="flex items-center gap-2 text-sm">
                                     <Checkbox checked={watermark.enabled} onCheckedChange={(v) => setWatermark({ ...watermark, enabled: Boolean(v) })} />
-                                    Activer
+                                    {t('parametres.documents.hd_enable')}
                                 </label>
                             </div>
 
@@ -362,17 +364,17 @@ export default function HeaderDesigner({ header, preset: initialPreset, presets,
                                 <Select value={watermark.type} onValueChange={(v: 'text' | 'image') => setWatermark({ ...watermark, type: v })}>
                                     <SelectTrigger className="h-9"><SelectValue /></SelectTrigger>
                                     <SelectContent>
-                                        <SelectItem value="text">Texte</SelectItem>
-                                        <SelectItem value="image">Image / logo</SelectItem>
+                                        <SelectItem value="text">{t('parametres.documents.hd_wm_text')}</SelectItem>
+                                        <SelectItem value="image">{t('parametres.documents.hd_wm_image')}</SelectItem>
                                     </SelectContent>
                                 </Select>
 
                                 {watermark.type === 'text' ? (
                                     <div className="flex items-center gap-2">
-                                        <Input value={watermark.text} placeholder="Texte du filigrane"
+                                        <Input value={watermark.text} placeholder={t('parametres.documents.hd_wm_text_ph')}
                                             onChange={(e) => setWatermark({ ...watermark, text: e.target.value })} className="h-9" />
                                         <input type="color" value={watermark.color} onChange={(e) => setWatermark({ ...watermark, color: e.target.value })}
-                                            className="h-9 w-9 rounded-md border border-gray-200 p-0.5" aria-label="Couleur" />
+                                            className="h-9 w-9 rounded-md border border-gray-200 p-0.5" aria-label={t('parametres.documents.hd_color')} />
                                     </div>
                                 ) : (
                                     <div className="space-y-2">
@@ -382,17 +384,17 @@ export default function HeaderDesigner({ header, preset: initialPreset, presets,
                                 )}
 
                                 <div className="space-y-1.5">
-                                    <Label className="text-xs">Opacité : {watermark.opacity}%</Label>
+                                    <Label className="text-xs">{t('parametres.documents.hd_opacity', { n: watermark.opacity })}</Label>
                                     <input type="range" min={2} max={50} value={watermark.opacity}
                                         onChange={(e) => setWatermark({ ...watermark, opacity: Number(e.target.value) })} className="w-full" />
                                 </div>
                                 <div className="space-y-1.5">
-                                    <Label className="text-xs">Taille : {watermark.size}</Label>
+                                    <Label className="text-xs">{t('parametres.documents.hd_wm_size', { n: watermark.size })}</Label>
                                     <input type="range" min={20} max={120} value={watermark.size}
                                         onChange={(e) => setWatermark({ ...watermark, size: Number(e.target.value) })} className="w-full" />
                                 </div>
                                 <div className="space-y-1.5">
-                                    <Label className="text-xs">Rotation : {watermark.rotation}°</Label>
+                                    <Label className="text-xs">{t('parametres.documents.hd_rotation', { n: watermark.rotation })}</Label>
                                     <input type="range" min={-90} max={90} value={watermark.rotation}
                                         onChange={(e) => setWatermark({ ...watermark, rotation: Number(e.target.value) })} className="w-full" />
                                 </div>
@@ -401,7 +403,7 @@ export default function HeaderDesigner({ header, preset: initialPreset, presets,
 
                         <div className="rounded-2xl bg-blue-50/60 p-4 ring-1 ring-blue-100 text-xs text-blue-800 flex gap-2">
                             <Tag className="w-4 h-4 shrink-0 mt-0.5" />
-                            Les variables comme <code className="font-mono">{'{{ecole.nom}}'}</code> sont remplacées à la génération de chaque document.
+                            {t('parametres.documents.hd_var_note_before')} <code className="font-mono">{'{{ecole.nom}}'}</code> {t('parametres.documents.hd_var_note_after')}
                         </div>
                     </div>
                 </div>
diff --git a/resources/js/pages/Parametres/Documents/Index.tsx b/resources/js/pages/Parametres/Documents/Index.tsx
index 8958dbcf..1eee36cd 100644
--- a/resources/js/pages/Parametres/Documents/Index.tsx
+++ b/resources/js/pages/Parametres/Documents/Index.tsx
@@ -7,6 +7,7 @@ import {
 } from '@/components/ui/alert-dialog';
 import { Button } from '@/components/ui/button';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface Template {
@@ -30,6 +31,7 @@ const CATEGORY_META: Record<string, { icon: typeof FileText; color: string; bg:
 };
 
 export default function Index({ templatesByCategory, categories }: Readonly<Props>) {
+    const { t } = useTranslation();
     const [deleteId, setDeleteId] = useState<string | null>(null);
     const canHeader = (usePage().props.auth?.permissions ?? []).includes('view_document_headers');
 
@@ -42,25 +44,25 @@ export default function Index({ templatesByCategory, categories }: Readonly<Prop
 
     return (
         <AppLayout>
-            <Head title="Modèles de documents" />
+            <Head title={t('parametres.documents.head')} />
             <div className="w-full space-y-6">
 
                 <div className="flex items-start justify-between gap-4 flex-wrap">
                     <div>
-                        <h1 className="text-4xl font-bold tracking-tight text-gray-900 flex items-center gap-3"><FileBadge className="h-7 w-7 text-blue-600 shrink-0" />Modèles de documents</h1>
-                        <p className="mt-2 text-gray-500">Gérez les modèles de certificats, attestations et bulletins exportables en PDF.</p>
+                        <h1 className="text-4xl font-bold tracking-tight text-gray-900 flex items-center gap-3"><FileBadge className="h-7 w-7 text-blue-600 shrink-0" />{t('parametres.documents.title')}</h1>
+                        <p className="mt-2 text-gray-500">{t('parametres.documents.subtitle')}</p>
                     </div>
                     <div className="flex items-center gap-2">
                         {canHeader && (
                             <Button variant="outline" className="gap-2" onClick={() => router.get(route('document-header.edit'))}>
-                                <LayoutTemplate className="w-4 h-4" /> En-tête
+                                <LayoutTemplate className="w-4 h-4" /> {t('parametres.documents.btn_header')}
                             </Button>
                         )}
                         <Button variant="outline" className="gap-2" onClick={() => router.get(route('document-templates.registry'))}>
-                            <FileText className="w-4 h-4" /> Registre
+                            <FileText className="w-4 h-4" /> {t('parametres.documents.btn_registry')}
                         </Button>
                         <Button className="gap-2 bg-blue-600 hover:bg-blue-700" onClick={() => router.get(route('document-templates.create'))}>
-                            <Plus className="w-4 h-4" /> Nouveau modèle
+                            <Plus className="w-4 h-4" /> {t('parametres.documents.btn_new')}
                         </Button>
                     </div>
                 </div>
@@ -83,38 +85,38 @@ export default function Index({ templatesByCategory, categories }: Readonly<Prop
                             {templates.length === 0 ? (
                                 <div className="rounded-2xl ring-1 ring-dashed ring-gray-200 p-8 text-center text-gray-400 text-sm">
                                     <FileBadge className="w-8 h-8 mx-auto mb-2 opacity-30" />
-                                    Aucun modèle dans cette catégorie.
+                                    {t('parametres.documents.cat_empty')}
                                 </div>
                             ) : (
                                 <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
-                                    {templates.map(t => (
-                                        <div key={t.id} className="bg-white rounded-2xl ring-1 ring-gray-100 shadow-sm p-5 flex flex-col">
+                                    {templates.map(tpl => (
+                                        <div key={tpl.id} className="bg-white rounded-2xl ring-1 ring-gray-100 shadow-sm p-5 flex flex-col">
                                             <div className="flex items-start justify-between gap-2">
                                                 <div>
-                                                    <p className="font-semibold text-gray-900">{t.name}</p>
-                                                    <p className="text-xs text-gray-400 mt-0.5">{t.type_label}</p>
+                                                    <p className="font-semibold text-gray-900">{tpl.name}</p>
+                                                    <p className="text-xs text-gray-400 mt-0.5">{tpl.type_label}</p>
                                                 </div>
-                                                {t.is_default && (
+                                                {tpl.is_default && (
                                                     <span className="inline-flex items-center gap-1 text-xs bg-amber-100 text-amber-700 rounded-full px-2 py-0.5 shrink-0">
-                                                        <Star className="w-3 h-3" /> Défaut
+                                                        <Star className="w-3 h-3" /> {t('parametres.documents.badge_default')}
                                                     </span>
                                                 )}
                                             </div>
 
                                             <div className="mt-2">
-                                                {t.is_active
-                                                    ? <span className="text-xs text-emerald-600 font-medium">● Actif</span>
-                                                    : <span className="text-xs text-gray-400 font-medium">● Inactif</span>}
+                                                {tpl.is_active
+                                                    ? <span className="text-xs text-emerald-600 font-medium">{t('parametres.documents.status_active')}</span>
+                                                    : <span className="text-xs text-gray-400 font-medium">{t('parametres.documents.status_inactive')}</span>}
                                             </div>
 
                                             <div className="flex gap-2 mt-4 pt-4 border-t border-gray-50">
-                                                <Button variant="outline" size="sm" className="flex-1 gap-1.5" onClick={() => router.get(route('document-templates.show', t.id))}>
-                                                    <Eye className="w-3.5 h-3.5" /> Voir
+                                                <Button variant="outline" size="sm" className="flex-1 gap-1.5" onClick={() => router.get(route('document-templates.show', tpl.id))}>
+                                                    <Eye className="w-3.5 h-3.5" /> {t('parametres.common.view')}
                                                 </Button>
-                                                <Button variant="outline" size="sm" className="flex-1 gap-1.5" onClick={() => router.get(route('document-templates.edit', t.id))}>
-                                                    <Pencil className="w-3.5 h-3.5" /> Modifier
+                                                <Button variant="outline" size="sm" className="flex-1 gap-1.5" onClick={() => router.get(route('document-templates.edit', tpl.id))}>
+                                                    <Pencil className="w-3.5 h-3.5" /> {t('parametres.common.edit')}
                                                 </Button>
-                                                <Button variant="outline" size="sm" className="border-red-200 text-red-500 hover:bg-red-50" onClick={() => setDeleteId(t.id)}>
+                                                <Button variant="outline" size="sm" className="border-red-200 text-red-500 hover:bg-red-50" onClick={() => setDeleteId(tpl.id)}>
                                                     <Trash2 className="w-3.5 h-3.5" />
                                                 </Button>
                                             </div>
@@ -130,12 +132,12 @@ export default function Index({ templatesByCategory, categories }: Readonly<Prop
             <AlertDialog open={!!deleteId} onOpenChange={() => setDeleteId(null)}>
                 <AlertDialogContent>
                     <AlertDialogHeader>
-                        <AlertDialogTitle>Supprimer ce modèle ?</AlertDialogTitle>
-                        <AlertDialogDescription>Cette action est irréversible. Les documents déjà émis ne sont pas affectés.</AlertDialogDescription>
+                        <AlertDialogTitle>{t('parametres.documents.delete_title')}</AlertDialogTitle>
+                        <AlertDialogDescription>{t('parametres.documents.delete_desc')}</AlertDialogDescription>
                     </AlertDialogHeader>
                     <div className="flex justify-end gap-2">
-                        <AlertDialogCancel>Annuler</AlertDialogCancel>
-                        <AlertDialogAction className="bg-red-600 hover:bg-red-700" onClick={() => deleteId && onDelete(deleteId)}>Supprimer</AlertDialogAction>
+                        <AlertDialogCancel>{t('parametres.common.cancel')}</AlertDialogCancel>
+                        <AlertDialogAction className="bg-red-600 hover:bg-red-700" onClick={() => deleteId && onDelete(deleteId)}>{t('parametres.common.delete')}</AlertDialogAction>
                     </div>
                 </AlertDialogContent>
             </AlertDialog>
diff --git a/resources/js/pages/Parametres/Documents/Registry.tsx b/resources/js/pages/Parametres/Documents/Registry.tsx
index cc8911d6..9012e30a 100644
--- a/resources/js/pages/Parametres/Documents/Registry.tsx
+++ b/resources/js/pages/Parametres/Documents/Registry.tsx
@@ -5,6 +5,7 @@ import { Button } from '@/components/ui/button';
 import { Input } from '@/components/ui/input';
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface Issuance {
@@ -29,6 +30,7 @@ interface Props {
 }
 
 export default function Registry({ issuances, filters }: Readonly<Props>) {
+    const { t } = useTranslation();
     const [search, setSearch] = useState(filters.search ?? '');
 
     const apply = (value = search) => {
@@ -37,7 +39,7 @@ export default function Registry({ issuances, filters }: Readonly<Props>) {
 
     return (
         <AppLayout>
-            <Head title="Registre des documents" />
+            <Head title={t('parametres.documents.registry_head')} />
             <div className="w-full space-y-6">
 
                 <div className="flex items-center gap-4">
@@ -45,8 +47,8 @@ export default function Registry({ issuances, filters }: Readonly<Props>) {
                         <ArrowLeft className="w-5 h-5 text-gray-600" />
                     </button>
                     <div>
-                        <h1 className="text-4xl font-bold tracking-tight text-gray-900">Registre des documents</h1>
-                        <p className="mt-2 text-gray-500">Traçabilité de tous les documents délivrés ({issuances.total}).</p>
+                        <h1 className="text-4xl font-bold tracking-tight text-gray-900">{t('parametres.documents.registry_title')}</h1>
+                        <p className="mt-2 text-gray-500">{t('parametres.documents.registry_subtitle', { n: issuances.total })}</p>
                     </div>
                 </div>
 
@@ -58,7 +60,7 @@ export default function Registry({ issuances, filters }: Readonly<Props>) {
                             value={search}
                             onChange={e => setSearch(e.target.value)}
                             onKeyDown={e => e.key === 'Enter' && apply()}
-                            placeholder="N° de référence, nom ou matricule de l'élève..."
+                            placeholder={t('parametres.documents.registry_search_ph')}
                             className="pl-9"
                         />
                         {search && (
@@ -67,7 +69,7 @@ export default function Registry({ issuances, filters }: Readonly<Props>) {
                             </button>
                         )}
                     </div>
-                    <Button onClick={() => apply()} className="bg-blue-600 hover:bg-blue-700">Rechercher</Button>
+                    <Button onClick={() => apply()} className="bg-blue-600 hover:bg-blue-700">{t('parametres.common.search')}</Button>
                 </div>
 
                 {/* Table */}
@@ -75,11 +77,11 @@ export default function Registry({ issuances, filters }: Readonly<Props>) {
                     <Table>
                         <TableHeader className="bg-gray-50">
                             <TableRow>
-                                <TableHead>Référence</TableHead>
-                                <TableHead>Document</TableHead>
-                                <TableHead>Élève</TableHead>
-                                <TableHead>Délivré par</TableHead>
-                                <TableHead className="text-right">Date</TableHead>
+                                <TableHead>{t('parametres.documents.registry_th_ref')}</TableHead>
+                                <TableHead>{t('parametres.documents.registry_th_doc')}</TableHead>
+                                <TableHead>{t('parametres.documents.registry_th_student')}</TableHead>
+                                <TableHead>{t('parametres.documents.registry_th_issuer')}</TableHead>
+                                <TableHead className="text-right">{t('parametres.documents.registry_th_date')}</TableHead>
                             </TableRow>
                         </TableHeader>
                         <TableBody>
@@ -87,7 +89,7 @@ export default function Registry({ issuances, filters }: Readonly<Props>) {
                                 <TableRow>
                                     <TableCell colSpan={5} className="py-16 text-center text-gray-400">
                                         <FileText className="w-10 h-10 mx-auto mb-2 opacity-20" />
-                                        Aucun document délivré.
+                                        {t('parametres.documents.registry_empty')}
                                     </TableCell>
                                 </TableRow>
                             ) : issuances.data.map(i => (
diff --git a/resources/js/pages/Parametres/Documents/Show.tsx b/resources/js/pages/Parametres/Documents/Show.tsx
index 669660f6..1beb038d 100644
--- a/resources/js/pages/Parametres/Documents/Show.tsx
+++ b/resources/js/pages/Parametres/Documents/Show.tsx
@@ -2,6 +2,7 @@ import { Head, router } from '@inertiajs/react';
 import { ArrowLeft, CheckCircle2, Pencil, Star } from 'lucide-react';
 import { Button } from '@/components/ui/button';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface Template {
@@ -24,13 +25,13 @@ interface Props {
     html: string;
 }
 
-const CATEGORY_LABELS: Record<string, string> = {
-    certificat: 'Certificat',
-    attestation: 'Attestation',
-    bulletin: 'Bulletin',
-};
-
 export default function Show({ template, html }: Readonly<Props>) {
+    const { t } = useTranslation();
+    const categoryLabels: Record<string, string> = {
+        certificat: t('parametres.documents.cat_certificat'),
+        attestation: t('parametres.documents.cat_attestation'),
+        bulletin: t('parametres.documents.cat_bulletin'),
+    };
     return (
         <AppLayout>
             <Head title={template.name} />
@@ -43,13 +44,13 @@ export default function Show({ template, html }: Readonly<Props>) {
                             <ArrowLeft className="w-5 h-5 text-gray-600" />
                         </button>
                         <div>
-                            <p className="text-xs text-gray-400 uppercase tracking-wide">{CATEGORY_LABELS[template.category] ?? template.category}</p>
+                            <p className="text-xs text-gray-400 uppercase tracking-wide">{categoryLabels[template.category] ?? template.category}</p>
                             <h1 className="text-3xl font-bold text-gray-900">{template.name}</h1>
                             {template.description && <p className="text-gray-500 mt-1">{template.description}</p>}
                         </div>
                     </div>
                     <Button className="gap-2 bg-blue-600 hover:bg-blue-700" onClick={() => router.get(route('document-templates.edit', template.id))}>
-                        <Pencil className="w-4 h-4" /> Modifier
+                        <Pencil className="w-4 h-4" /> {t('parametres.common.edit')}
                     </Button>
                 </div>
 
@@ -57,39 +58,39 @@ export default function Show({ template, html }: Readonly<Props>) {
                     {/* Métadonnées */}
                     <div className="space-y-4">
                         <div className="bg-white rounded-2xl ring-1 ring-gray-100 shadow-sm p-5 space-y-3">
-                            <h3 className="text-sm font-semibold text-gray-900">Caractéristiques</h3>
+                            <h3 className="text-sm font-semibold text-gray-900">{t('parametres.documents.show_features')}</h3>
 
-                            <Meta label="Type" value={template.type_label} />
-                            <Meta label="Orientation" value={template.orientation === 'portrait' ? 'Portrait' : 'Paysage'} />
-                            <Meta label="Signataire" value={template.signatory_title ?? '—'} />
+                            <Meta label={t('parametres.documents.show_type')} value={template.type_label} />
+                            <Meta label={t('parametres.documents.show_orientation')} value={template.orientation === 'portrait' ? t('parametres.documents.orientation_portrait') : t('parametres.documents.orientation_landscape')} />
+                            <Meta label={t('parametres.documents.show_signatory')} value={template.signatory_title ?? '—'} />
 
                             <div className="space-y-2 pt-1">
-                                <Flag on={template.header_enabled} label="En-tête officiel" />
-                                <Flag on={template.show_signature} label="Bloc signature" />
+                                <Flag on={template.header_enabled} label={t('parametres.documents.flag_header')} />
+                                <Flag on={template.show_signature} label={t('parametres.documents.flag_signature')} />
                             </div>
 
                             <div className="flex flex-wrap gap-2 pt-2">
                                 {template.is_default && (
                                     <span className="inline-flex items-center gap-1 text-xs bg-amber-100 text-amber-700 rounded-full px-2 py-0.5">
-                                        <Star className="w-3 h-3" /> Modèle par défaut
+                                        <Star className="w-3 h-3" /> {t('parametres.documents.show_default')}
                                     </span>
                                 )}
                                 <span className={`inline-flex items-center gap-1 text-xs rounded-full px-2 py-0.5 ${template.is_active ? 'bg-emerald-100 text-emerald-700' : 'bg-gray-100 text-gray-500'}`}>
-                                    {template.is_active ? 'Actif' : 'Inactif'}
+                                    {template.is_active ? t('parametres.documents.show_active') : t('parametres.documents.show_inactive')}
                                 </span>
                             </div>
                         </div>
 
                         <p className="text-xs text-gray-400 px-1">
-                            L'aperçu utilise des données d'exemple. Les variables seront remplacées par les informations réelles de l'élève à la génération.
+                            {t('parametres.documents.show_sample_note')}
                         </p>
                     </div>
 
                     {/* Aperçu rendu */}
                     <div className="lg:col-span-2">
                         <div className="bg-white rounded-2xl ring-1 ring-gray-100 shadow-sm p-6">
-                            <h3 className="text-sm font-semibold text-gray-900 mb-3">Aperçu du document</h3>
-                            <iframe title="Aperçu" srcDoc={html} className="w-full h-[700px] rounded-lg ring-1 ring-gray-200 bg-white" />
+                            <h3 className="text-sm font-semibold text-gray-900 mb-3">{t('parametres.documents.show_preview')}</h3>
+                            <iframe title={t('parametres.documents.show_preview')} srcDoc={html} className="w-full h-[700px] rounded-lg ring-1 ring-gray-200 bg-white" />
                         </div>
                     </div>
                 </div>

From b0991cfc9554b95808b9ba047db324fbac9a031b Mon Sep 17 00:00:00 2001
From: horacioskrp <hervekudayah@gmail.com>
Date: Fri, 13 Nov 2026 10:46:25 +0000
Subject: [PATCH 11/12] =?UTF-8?q?feat(i18n):=20param=C3=A8tres=20=E2=80=94?=
 =?UTF-8?q?=20attribution=20mati=C3=A8res/classes=20(liste,=20cr=C3=A9atio?=
 =?UTF-8?q?n,=20=C3=A9dition,=20d=C3=A9tail)=20(FR/EN)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 lang/en/parametres.php                        | 66 +++++++++++++++++++
 lang/fr/parametres.php                        | 66 +++++++++++++++++++
 .../pages/Parametres/ClassSubjects/Create.tsx | 50 +++++++-------
 .../pages/Parametres/ClassSubjects/Edit.tsx   | 46 ++++++-------
 .../pages/Parametres/ClassSubjects/Index.tsx  | 57 ++++++++--------
 .../pages/Parametres/ClassSubjects/Show.tsx   | 58 ++++++++--------
 6 files changed, 241 insertions(+), 102 deletions(-)

diff --git a/lang/en/parametres.php b/lang/en/parametres.php
index 12bebdee..f06629ca 100644
--- a/lang/en/parametres.php
+++ b/lang/en/parametres.php
@@ -907,4 +907,70 @@
         'hd_var_note_before' => 'Variables like',
         'hd_var_note_after' => 'are replaced when each document is generated.',
     ],
+
+    'class_subjects' => [
+        // Index
+        'head' => 'Subject assignment to classes',
+        'title' => 'Subject assignment to classes',
+        'subtitle' => 'Manage the assignment of subjects to each class',
+        'new' => 'Add an assignment',
+        'stat_assignments' => 'Assignments',
+        'stat_classes' => 'Classes covered',
+        'search_ph' => 'Search for a class or subject...',
+        'search_results' => 'Results for:',
+        'th_class' => 'Class',
+        'th_subjects' => 'Assigned subjects',
+        'th_year' => 'Academic year',
+        'coef' => 'Coef',
+        'empty' => 'No assignment found',
+        'showing' => 'Showing :from to :to of :total assignments',
+        'page_of' => 'Page :current of :last',
+        'delete_title' => 'Confirm deletion',
+        'delete_desc' => 'Are you sure you want to delete this assignment? This action is irreversible.',
+        'deleting' => 'Deleting...',
+        // Create / Edit shared
+        'create_head' => 'Assign subjects to a class',
+        'create_title' => 'Assign subjects to a class',
+        'create_subtitle' => 'Select a class, an academic year and the subjects to teach',
+        'edit_head' => 'Edit assigned subjects',
+        'edit_title' => 'Edit assigned subjects',
+        'edit_subtitle' => 'Update the subjects assigned to this class',
+        'section_base' => 'Basic selection',
+        'label_class' => 'Class',
+        'class_ph' => 'Select a class',
+        'label_year' => 'Academic year',
+        'year_ph' => 'Select an academic year',
+        'section_subjects' => 'Subject and coefficient selection',
+        'search_subjects' => 'Search subjects',
+        'search_subjects_ph' => 'Search by name or code...',
+        'code' => 'Code',
+        'coef_ph' => 'Coef',
+        'group_required' => 'Required',
+        'group_optional' => 'Optional',
+        'no_subjects' => 'No subject found',
+        'selected_count' => ':n subject(s) selected with coefficient',
+        'submit_create' => 'Assign subjects',
+        'creating' => 'Assigning...',
+        'submit_update' => 'Update',
+        'updating' => 'Updating...',
+        'err_class_required' => 'The class is required.',
+        'err_year_required' => 'The academic year is required.',
+        'err_subjects_required' => 'Please select at least one subject.',
+        'err_coef_invalid' => 'Invalid coefficient (must be > 0).',
+        // Show
+        'show_head' => 'Assignment details',
+        'show_title' => 'Assignment details',
+        'show_subtitle' => 'Information about the subject assignment to the class',
+        'show_class' => 'Class',
+        'show_subject' => 'Subject',
+        'show_name' => 'Name',
+        'show_coef' => 'Coefficient',
+        'show_year' => 'Academic year',
+        'show_year_label' => 'Year',
+        'show_start' => 'Start date',
+        'show_end' => 'End date',
+        'show_tracking' => 'Tracking information',
+        'show_created_on' => 'Created on',
+        'show_updated_on' => 'Updated on',
+    ],
 ];
diff --git a/lang/fr/parametres.php b/lang/fr/parametres.php
index 9a2ccf32..f954dce4 100644
--- a/lang/fr/parametres.php
+++ b/lang/fr/parametres.php
@@ -907,4 +907,70 @@
         'hd_var_note_before' => 'Les variables comme',
         'hd_var_note_after' => 'sont remplacées à la génération de chaque document.',
     ],
+
+    'class_subjects' => [
+        // Index
+        'head' => 'Attribution des matières aux classes',
+        'title' => 'Attribution des matières aux classes',
+        'subtitle' => 'Gérez l\'attribution des matières à chaque classe',
+        'new' => 'Ajouter une attribution',
+        'stat_assignments' => 'Attributions',
+        'stat_classes' => 'Classes couvertes',
+        'search_ph' => 'Rechercher une classe ou matière...',
+        'search_results' => 'Résultats pour :',
+        'th_class' => 'Classe',
+        'th_subjects' => 'Matières attribuées',
+        'th_year' => 'Année académique',
+        'coef' => 'Coef',
+        'empty' => 'Aucune attribution trouvée',
+        'showing' => 'Affichage :from à :to sur :total attributions',
+        'page_of' => 'Page :current sur :last',
+        'delete_title' => 'Confirmer la suppression',
+        'delete_desc' => 'Êtes-vous sûr de vouloir supprimer cette attribution ? Cette action est irréversible.',
+        'deleting' => 'Suppression...',
+        // Create / Edit shared
+        'create_head' => 'Assigner des matières à une classe',
+        'create_title' => 'Assigner des matières à une classe',
+        'create_subtitle' => 'Sélectionnez une classe, une année académique et les matières à enseigner',
+        'edit_head' => 'Modifier les matières attribuées',
+        'edit_title' => 'Modifier les matières attribuées',
+        'edit_subtitle' => 'Mettez à jour les matières assignées à cette classe',
+        'section_base' => 'Sélection de base',
+        'label_class' => 'Classe',
+        'class_ph' => 'Sélectionnez une classe',
+        'label_year' => 'Année académique',
+        'year_ph' => 'Sélectionnez une année académique',
+        'section_subjects' => 'Sélection des matières et coefficients',
+        'search_subjects' => 'Rechercher les matières',
+        'search_subjects_ph' => 'Rechercher par nom ou code...',
+        'code' => 'Code',
+        'coef_ph' => 'Coef',
+        'group_required' => 'Obligatoire',
+        'group_optional' => 'Facultatif',
+        'no_subjects' => 'Aucune matière trouvée',
+        'selected_count' => ':n matière(s) sélectionnée(s) avec coefficient',
+        'submit_create' => 'Attribuer les matières',
+        'creating' => 'Attribution en cours...',
+        'submit_update' => 'Mettre à jour',
+        'updating' => 'Mise à jour en cours...',
+        'err_class_required' => 'La classe est requise.',
+        'err_year_required' => 'L\'année académique est requise.',
+        'err_subjects_required' => 'Veuillez sélectionner au moins une matière.',
+        'err_coef_invalid' => 'Coefficient invalide (doit être > 0).',
+        // Show
+        'show_head' => 'Détails de l\'attribution',
+        'show_title' => 'Détails de l\'attribution',
+        'show_subtitle' => 'Informations sur l\'attribution de matière à la classe',
+        'show_class' => 'Classe',
+        'show_subject' => 'Matière',
+        'show_name' => 'Nom',
+        'show_coef' => 'Coefficient',
+        'show_year' => 'Année académique',
+        'show_year_label' => 'Année',
+        'show_start' => 'Date de début',
+        'show_end' => 'Date de fin',
+        'show_tracking' => 'Informations de suivi',
+        'show_created_on' => 'Créé le',
+        'show_updated_on' => 'Modifié le',
+    ],
 ];
diff --git a/resources/js/pages/Parametres/ClassSubjects/Create.tsx b/resources/js/pages/Parametres/ClassSubjects/Create.tsx
index 8e5fb196..653a4b5a 100644
--- a/resources/js/pages/Parametres/ClassSubjects/Create.tsx
+++ b/resources/js/pages/Parametres/ClassSubjects/Create.tsx
@@ -13,6 +13,7 @@ import {
     SelectValue,
 } from '@/components/ui/select';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface Classroom {
@@ -41,6 +42,7 @@ interface CreateProps {
 }
 
 export default function Create({ classrooms, subjects, academicYears }: Readonly<CreateProps>) {
+    const { t } = useTranslation();
     const [formData, setFormData] = useState({
         class_id: '',
         academic_year_id: '',
@@ -106,21 +108,21 @@ export default function Create({ classrooms, subjects, academicYears }: Readonly
         const newErrors: Record<string, string> = {};
 
         if (!formData.class_id) {
-            newErrors.class_id = 'La classe est requise.';
+            newErrors.class_id = t('parametres.class_subjects.err_class_required');
         }
 
         if (!formData.academic_year_id) {
-            newErrors.academic_year_id = 'L\'année académique est requise.';
+            newErrors.academic_year_id = t('parametres.class_subjects.err_year_required');
         }
 
         if (selectedSubjects.length === 0) {
-            newErrors.subjects = 'Veuillez sélectionner au moins une matière.';
+            newErrors.subjects = t('parametres.class_subjects.err_subjects_required');
         }
 
         selectedSubjects.forEach((subjectId) => {
             const coefficient = normalizeCoefficient(coefficients[subjectId] ?? '');
             if (!Number.isFinite(coefficient) || coefficient <= 0) {
-                newErrors[`coefficient_${subjectId}`] = 'Coefficient invalide (doit être > 0).';
+                newErrors[`coefficient_${subjectId}`] = t('parametres.class_subjects.err_coef_invalid');
             }
         });
 
@@ -153,7 +155,7 @@ export default function Create({ classrooms, subjects, academicYears }: Readonly
 
     return (
         <AppLayout>
-            <Head title="Assigner des matières à une classe" />
+            <Head title={t('parametres.class_subjects.create_head')} />
 
             <div className="space-y-6">
                 {/* Header */}
@@ -166,10 +168,10 @@ export default function Create({ classrooms, subjects, academicYears }: Readonly
                     </button>
                     <div>
                         <h1 className="text-3xl font-bold text-gray-900">
-                            Assigner des matières à une classe
+                            {t('parametres.class_subjects.create_title')}
                         </h1>
                         <p className="text-gray-600 mt-1">
-                            Sélectionnez une classe, une année académique et les matières à enseigner
+                            {t('parametres.class_subjects.create_subtitle')}
                         </p>
                     </div>
                 </div>
@@ -178,13 +180,13 @@ export default function Create({ classrooms, subjects, academicYears }: Readonly
                     {/* Class and Year Selection */}
                     <div className="bg-white rounded-lg p-6">
                         <h2 className="text-lg font-semibold text-gray-900 mb-4">
-                            Sélection de base
+                            {t('parametres.class_subjects.section_base')}
                         </h2>
                         <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
                             {/* Classe */}
                             <div>
                                 <label htmlFor="class_id" className="block text-sm font-medium text-gray-900 mb-2">
-                                    Classe *
+                                    {t('parametres.class_subjects.label_class')} *
                                 </label>
                                 <Select
                                     value={formData.class_id}
@@ -200,7 +202,7 @@ export default function Create({ classrooms, subjects, academicYears }: Readonly
                                             errors.class_id ? 'border-red-500' : ''
                                         }
                                     >
-                                        <SelectValue placeholder="Sélectionnez une classe" />
+                                        <SelectValue placeholder={t('parametres.class_subjects.class_ph')} />
                                     </SelectTrigger>
                                     <SelectContent>
                                         {classrooms.map((classroom) => (
@@ -223,7 +225,7 @@ export default function Create({ classrooms, subjects, academicYears }: Readonly
                             {/* Année Académique */}
                             <div>
                                 <label htmlFor="academic_year_id" className="block text-sm font-medium text-gray-900 mb-2">
-                                    Année académique *
+                                    {t('parametres.class_subjects.label_year')} *
                                 </label>
                                 <Select
                                     value={formData.academic_year_id}
@@ -241,7 +243,7 @@ export default function Create({ classrooms, subjects, academicYears }: Readonly
                                                 : ''
                                         }
                                     >
-                                        <SelectValue placeholder="Sélectionnez une année académique" />
+                                        <SelectValue placeholder={t('parametres.class_subjects.year_ph')} />
                                     </SelectTrigger>
                                     <SelectContent>
                                         {academicYears.map((year) => (
@@ -263,20 +265,20 @@ export default function Create({ classrooms, subjects, academicYears }: Readonly
                     {/* Subject Selection with Search */}
                     <div className="bg-white rounded-lg p-6">
                         <h2 className="text-lg font-semibold text-gray-900 mb-4">
-                            Sélection des matières et coefficients
+                            {t('parametres.class_subjects.section_subjects')}
                         </h2>
 
                         {/* Search Box */}
                         <div className="mb-4">
                             <label htmlFor="search" className="block text-sm font-medium text-gray-900 mb-2">
-                                Rechercher les matières
+                                {t('parametres.class_subjects.search_subjects')}
                             </label>
                             <div className="relative">
                                 <Search className="absolute left-3 top-1/2 transform -translate-y-1/2 w-4 h-4 text-gray-400" />
                                 <Input
                                     id="search"
                                     type="text"
-                                    placeholder="Rechercher par nom ou code..."
+                                    placeholder={t('parametres.class_subjects.search_subjects_ph')}
                                     value={searchQuery}
                                     onChange={(e) => setSearchQuery(e.target.value)}
                                     className="pl-10"
@@ -294,7 +296,7 @@ export default function Create({ classrooms, subjects, academicYears }: Readonly
                                             key={subjectId}
                                             className="bg-blue-100 text-blue-800 px-3 py-1 rounded-full text-sm font-medium flex items-center gap-2"
                                         >
-                                            {subject?.name} · Coef {coefficients[subjectId] ?? '1'}
+                                            {subject?.name} · {t('parametres.class_subjects.coef')} {coefficients[subjectId] ?? '1'}
                                             <button
                                                 type="button"
                                                 onClick={() =>
@@ -331,7 +333,7 @@ export default function Create({ classrooms, subjects, academicYears }: Readonly
                                                 {subject.name}
                                             </p>
                                             <p className="text-xs text-gray-500">
-                                                Code: {subject.code}
+                                                {t('parametres.class_subjects.code')}: {subject.code}
                                             </p>
                                         </button>
                                         {selectedSubjects.includes(subject.id) && (
@@ -341,14 +343,14 @@ export default function Create({ classrooms, subjects, academicYears }: Readonly
                                                     inputMode="decimal"
                                                     value={coefficients[subject.id] ?? '1'}
                                                     onChange={(e) => updateCoefficient(subject.id, e.target.value)}
-                                                    placeholder="Coef"
+                                                    placeholder={t('parametres.class_subjects.coef_ph')}
                                                     className={`w-20 ${errors[`coefficient_${subject.id}`] ? 'border-red-500' : ''}`}
                                                 />
                                                 <Select value={groups[subject.id] ?? 'obligatoire'} onValueChange={(v) => updateGroup(subject.id, v)}>
                                                     <SelectTrigger className="w-36 h-9"><SelectValue /></SelectTrigger>
                                                     <SelectContent>
-                                                        <SelectItem value="obligatoire">Obligatoire</SelectItem>
-                                                        <SelectItem value="facultatif">Facultatif</SelectItem>
+                                                        <SelectItem value="obligatoire">{t('parametres.class_subjects.group_required')}</SelectItem>
+                                                        <SelectItem value="facultatif">{t('parametres.class_subjects.group_optional')}</SelectItem>
                                                     </SelectContent>
                                                 </Select>
                                             </div>
@@ -357,7 +359,7 @@ export default function Create({ classrooms, subjects, academicYears }: Readonly
                                 ))
                             ) : (
                                 <p className="text-center text-gray-500 py-4">
-                                    Aucune matière trouvée
+                                    {t('parametres.class_subjects.no_subjects')}
                                 </p>
                             )}
                         </div>
@@ -387,7 +389,7 @@ export default function Create({ classrooms, subjects, academicYears }: Readonly
                     {/* Summary */}
                     <div className="bg-blue-50 border border-blue-200 rounded-lg p-4">
                         <p className="text-sm text-blue-900">
-                            <span className="font-semibold">{selectedSubjects.length}</span> matière(s) sélectionnée(s) avec coefficient
+                            {t('parametres.class_subjects.selected_count', { n: selectedSubjects.length })}
                         </p>
                     </div>
 
@@ -398,14 +400,14 @@ export default function Create({ classrooms, subjects, academicYears }: Readonly
                             disabled={isSubmitting}
                             className="bg-blue-600 hover:bg-blue-700"
                         >
-                            {isSubmitting ? 'Attribution en cours...' : 'Attribuer les matières'}
+                            {isSubmitting ? t('parametres.class_subjects.creating') : t('parametres.class_subjects.submit_create')}
                         </Button>
                         <Button
                             type="button"
                             variant="outline"
                             onClick={() => router.get(route('class-subjects.index'))}
                         >
-                            Annuler
+                            {t('parametres.common.cancel')}
                         </Button>
                     </div>
                 </form>
diff --git a/resources/js/pages/Parametres/ClassSubjects/Edit.tsx b/resources/js/pages/Parametres/ClassSubjects/Edit.tsx
index c2f8f198..b331013a 100644
--- a/resources/js/pages/Parametres/ClassSubjects/Edit.tsx
+++ b/resources/js/pages/Parametres/ClassSubjects/Edit.tsx
@@ -13,6 +13,7 @@ import {
     SelectValue,
 } from '@/components/ui/select';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface Classroom {
@@ -61,6 +62,7 @@ export default function Edit({
     academicYears,
     assignedSubjects,
 }: Readonly<EditProps>) {
+    const { t } = useTranslation();
     const [formData, setFormData] = useState({
         class_id: classSubject.class_id,
         academic_year_id: classSubject.academic_year_id,
@@ -134,13 +136,13 @@ export default function Edit({
         const newErrors: Record<string, string> = {};
 
         if (selectedSubjects.length === 0) {
-            newErrors.subjects = 'Veuillez sélectionner au moins une matière.';
+            newErrors.subjects = t('parametres.class_subjects.err_subjects_required');
         }
 
         selectedSubjects.forEach((subjectId) => {
             const coefficient = normalizeCoefficient(coefficients[subjectId] ?? '');
             if (!Number.isFinite(coefficient) || coefficient <= 0) {
-                newErrors[`coefficient_${subjectId}`] = 'Coefficient invalide (doit être > 0).';
+                newErrors[`coefficient_${subjectId}`] = t('parametres.class_subjects.err_coef_invalid');
             }
         });
 
@@ -176,7 +178,7 @@ export default function Edit({
 
     return (
         <AppLayout>
-            <Head title="Modifier les matières attribuées" />
+            <Head title={t('parametres.class_subjects.edit_head')} />
 
             <div className="space-y-6">
                 {/* Header */}
@@ -189,10 +191,10 @@ export default function Edit({
                     </button>
                     <div>
                         <h1 className="text-3xl font-bold text-gray-900">
-                            Modifier les matières attribuées
+                            {t('parametres.class_subjects.edit_title')}
                         </h1>
                         <p className="text-gray-600 mt-1">
-                            Mettez à jour les matières assignées à cette classe
+                            {t('parametres.class_subjects.edit_subtitle')}
                         </p>
                     </div>
                 </div>
@@ -201,13 +203,13 @@ export default function Edit({
                     {/* Class and Year Selection */}
                     <div className="bg-white rounded-lg p-6">
                         <h2 className="text-lg font-semibold text-gray-900 mb-4">
-                            Sélection de base
+                            {t('parametres.class_subjects.section_base')}
                         </h2>
                         <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
                             {/* Classe */}
                             <div>
                                 <label htmlFor="class_id" className="block text-sm font-medium text-gray-900 mb-2">
-                                    Classe *
+                                    {t('parametres.class_subjects.label_class')} *
                                 </label>
                                 <Select
                                     value={formData.class_id}
@@ -223,7 +225,7 @@ export default function Edit({
                                             errors.class_id ? 'border-red-500' : ''
                                         }
                                     >
-                                        <SelectValue placeholder="Sélectionnez une classe" />
+                                        <SelectValue placeholder={t('parametres.class_subjects.class_ph')} />
                                     </SelectTrigger>
                                     <SelectContent>
                                         {classrooms.map((classroom) => (
@@ -246,7 +248,7 @@ export default function Edit({
                             {/* Année Académique */}
                             <div>
                                 <label htmlFor="academic_year_id" className="block text-sm font-medium text-gray-900 mb-2">
-                                    Année académique *
+                                    {t('parametres.class_subjects.label_year')} *
                                 </label>
                                 <Select
                                     value={formData.academic_year_id}
@@ -264,7 +266,7 @@ export default function Edit({
                                                 : ''
                                         }
                                     >
-                                        <SelectValue placeholder="Sélectionnez une année académique" />
+                                        <SelectValue placeholder={t('parametres.class_subjects.year_ph')} />
                                     </SelectTrigger>
                                     <SelectContent>
                                         {academicYears.map((year) => (
@@ -286,20 +288,20 @@ export default function Edit({
                     {/* Subject Selection with Search */}
                     <div className="bg-white rounded-lg p-6">
                         <h2 className="text-lg font-semibold text-gray-900 mb-4">
-                            Sélection des matières et coefficients
+                            {t('parametres.class_subjects.section_subjects')}
                         </h2>
 
                         {/* Search Box */}
                         <div className="mb-4">
                             <label htmlFor="search" className="block text-sm font-medium text-gray-900 mb-2">
-                                Rechercher les matières
+                                {t('parametres.class_subjects.search_subjects')}
                             </label>
                             <div className="relative">
                                 <Search className="absolute left-3 top-1/2 transform -translate-y-1/2 w-4 h-4 text-gray-400" />
                                 <Input
                                     id="search"
                                     type="text"
-                                    placeholder="Rechercher par nom ou code..."
+                                    placeholder={t('parametres.class_subjects.search_subjects_ph')}
                                     value={searchQuery}
                                     onChange={(e) => setSearchQuery(e.target.value)}
                                     className="pl-10"
@@ -317,7 +319,7 @@ export default function Edit({
                                             key={subjectId}
                                             className="bg-blue-100 text-blue-800 px-3 py-1 rounded-full text-sm font-medium flex items-center gap-2"
                                         >
-                                            {subject?.name} · Coef {coefficients[subjectId] ?? '1'}
+                                            {subject?.name} · {t('parametres.class_subjects.coef')} {coefficients[subjectId] ?? '1'}
                                             <button
                                                 type="button"
                                                 onClick={() =>
@@ -354,7 +356,7 @@ export default function Edit({
                                                 {subject.name}
                                             </p>
                                             <p className="text-xs text-gray-500">
-                                                Code: {subject.code}
+                                                {t('parametres.class_subjects.code')}: {subject.code}
                                             </p>
                                         </button>
                                         {selectedSubjects.includes(subject.id) && (
@@ -364,14 +366,14 @@ export default function Edit({
                                                     inputMode="decimal"
                                                     value={coefficients[subject.id] ?? '1'}
                                                     onChange={(e) => updateCoefficient(subject.id, e.target.value)}
-                                                    placeholder="Coef"
+                                                    placeholder={t('parametres.class_subjects.coef_ph')}
                                                     className={`w-20 ${errors[`coefficient_${subject.id}`] ? 'border-red-500' : ''}`}
                                                 />
                                                 <Select value={groups[subject.id] ?? 'obligatoire'} onValueChange={(v) => updateGroup(subject.id, v)}>
                                                     <SelectTrigger className="w-36 h-9"><SelectValue /></SelectTrigger>
                                                     <SelectContent>
-                                                        <SelectItem value="obligatoire">Obligatoire</SelectItem>
-                                                        <SelectItem value="facultatif">Facultatif</SelectItem>
+                                                        <SelectItem value="obligatoire">{t('parametres.class_subjects.group_required')}</SelectItem>
+                                                        <SelectItem value="facultatif">{t('parametres.class_subjects.group_optional')}</SelectItem>
                                                     </SelectContent>
                                                 </Select>
                                             </div>
@@ -380,7 +382,7 @@ export default function Edit({
                                 ))
                             ) : (
                                 <p className="text-center text-gray-500 py-4">
-                                    Aucune matière trouvée
+                                    {t('parametres.class_subjects.no_subjects')}
                                 </p>
                             )}
                         </div>
@@ -410,7 +412,7 @@ export default function Edit({
                     {/* Summary */}
                     <div className="bg-blue-50 border border-blue-200 rounded-lg p-4">
                         <p className="text-sm text-blue-900">
-                            <span className="font-semibold">{selectedSubjects.length}</span> matière(s) sélectionnée(s) avec coefficient
+                            {t('parametres.class_subjects.selected_count', { n: selectedSubjects.length })}
                         </p>
                     </div>
 
@@ -421,14 +423,14 @@ export default function Edit({
                             disabled={isSubmitting}
                             className="bg-blue-600 hover:bg-blue-700"
                         >
-                            {isSubmitting ? 'Mise à jour en cours...' : 'Mettre à jour'}
+                            {isSubmitting ? t('parametres.class_subjects.updating') : t('parametres.class_subjects.submit_update')}
                         </Button>
                         <Button
                             type="button"
                             variant="outline"
                             onClick={() => router.get(route('class-subjects.index'))}
                         >
-                            Annuler
+                            {t('parametres.common.cancel')}
                         </Button>
                     </div>
                 </form>
diff --git a/resources/js/pages/Parametres/ClassSubjects/Index.tsx b/resources/js/pages/Parametres/ClassSubjects/Index.tsx
index a2e0ea07..d417aa8a 100644
--- a/resources/js/pages/Parametres/ClassSubjects/Index.tsx
+++ b/resources/js/pages/Parametres/ClassSubjects/Index.tsx
@@ -22,6 +22,7 @@ import {
     TableRow,
 } from '@/components/ui/table';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface Classroom {
@@ -73,6 +74,7 @@ interface IndexProps {
 }
 
 export default function Index({ classSubjects, message, filters }: Readonly<IndexProps>) {
+    const { t } = useTranslation();
     const [deleteConfirm, setDeleteConfirm] = useState<string | null>(null);
     const [isDeleting, setIsDeleting] = useState(false);
     const [searchQuery, setSearchQuery] = useState(filters.search || '');
@@ -131,14 +133,14 @@ export default function Index({ classSubjects, message, filters }: Readonly<Inde
 
     const statsCards = [
         {
-            title: 'Attributions',
+            title: t('parametres.class_subjects.stat_assignments'),
             value: classSubjects.total,
             icon: BookOpen,
             bgColor: 'bg-blue-50',
             textColor: 'text-blue-600',
         },
         {
-            title: 'Classes couvertes',
+            title: t('parametres.class_subjects.stat_classes'),
             value: new Set(classSubjects.data.map(cs => cs.class.id)).size,
             icon: CheckCircle2,
             bgColor: 'bg-green-50',
@@ -162,25 +164,25 @@ export default function Index({ classSubjects, message, filters }: Readonly<Inde
 
     return (
         <AppLayout>
-            <Head title="Attribution des matières aux classes" />
+            <Head title={t('parametres.class_subjects.head')} />
 
             <div className="space-y-6">
                 {/* Header */}
                 <div className="flex items-start justify-between">
                     <div>
                         <h1 className="text-4xl font-bold tracking-tight text-gray-900 flex items-center gap-3"><BookOpen className="h-7 w-7 text-blue-600 shrink-0" />
-                            Attribution des matières aux classes
+                            {t('parametres.class_subjects.title')}
                         </h1>
                         <p className="mt-2 text-lg text-gray-600">
-                            Gérez l'attribution des matières à chaque classe
+                            {t('parametres.class_subjects.subtitle')}
                         </p>
                     </div>
-                    <Button 
+                    <Button
                         onClick={() => router.get(route('class-subjects.create'))}
                         className="gap-2 bg-blue-600 hover:bg-blue-700"
                     >
                         <Plus className="w-5 h-5" />
-                        Ajouter une attribution
+                        {t('parametres.class_subjects.new')}
                     </Button>
                 </div>
 
@@ -222,7 +224,7 @@ export default function Index({ classSubjects, message, filters }: Readonly<Inde
                                 <Search className="absolute left-3 top-1/2 -translate-y-1/2 w-5 h-5 text-blue-400 group-focus-within:text-blue-600 transition" />
                                 <Input
                                     type="text"
-                                    placeholder="Rechercher une classe ou matière..."
+                                    placeholder={t('parametres.class_subjects.search_ph')}
                                     value={searchQuery}
                                     onChange={(e) => setSearchQuery(e.target.value)}
                                     onKeyDown={(e) => e.key === 'Enter' && handleSearch()}
@@ -242,12 +244,12 @@ export default function Index({ classSubjects, message, filters }: Readonly<Inde
                                 className="bg-blue-600 hover:bg-blue-700 text-white gap-2 shrink-0 transition"
                             >
                                 <Search className="w-4 h-4" />
-                                Rechercher
+                                {t('parametres.common.search')}
                             </Button>
                         </div>
                         {searchQuery && (
                             <p className="text-sm text-gray-500 mt-3">
-                                Résultats pour : <span className="font-semibold text-gray-700">« {searchQuery} »</span>
+                                {t('parametres.class_subjects.search_results')} <span className="font-semibold text-gray-700">« {searchQuery} »</span>
                             </p>
                         )}
                     </div>
@@ -259,10 +261,10 @@ export default function Index({ classSubjects, message, filters }: Readonly<Inde
                         <Table>
                             <TableHeader className="bg-gray-50">
                                 <TableRow className="border-b border-gray-200">
-                                    <TableHead className="font-semibold text-gray-900">Classe</TableHead>
-                                    <TableHead className="font-semibold text-gray-900">Matières attribuées</TableHead>
-                                    <TableHead className="font-semibold text-gray-900">Année académique</TableHead>
-                                    <TableHead className="text-center font-semibold text-gray-900 w-24">Actions</TableHead>
+                                    <TableHead className="font-semibold text-gray-900">{t('parametres.class_subjects.th_class')}</TableHead>
+                                    <TableHead className="font-semibold text-gray-900">{t('parametres.class_subjects.th_subjects')}</TableHead>
+                                    <TableHead className="font-semibold text-gray-900">{t('parametres.class_subjects.th_year')}</TableHead>
+                                    <TableHead className="text-center font-semibold text-gray-900 w-24">{t('parametres.common.actions')}</TableHead>
                                 </TableRow>
                             </TableHeader>
                             <TableBody>
@@ -284,7 +286,7 @@ export default function Index({ classSubjects, message, filters }: Readonly<Inde
                                                             key={subject.id}
                                                             className={`inline-flex items-center px-3 py-1 rounded-full text-sm font-medium ${getSubjectBadgeClass(subject.name)}`}
                                                         >
-                                                            {subject.name} · Coef {subject.coefficient}
+                                                            {subject.name} · {t('parametres.class_subjects.coef')} {subject.coefficient}
                                                         </span>
                                                     ))}
                                                 </div>
@@ -295,19 +297,19 @@ export default function Index({ classSubjects, message, filters }: Readonly<Inde
                                             <TableCell className="text-center">
                                                 <div className="flex gap-2 justify-center">
                                                     <IconButton
-                                                        label="Voir"
+                                                        label={t('parametres.common.view')}
                                                         icon={<Eye className="w-4 h-4" />}
                                                         className="border-gray-300 text-gray-700 hover:bg-gray-50 hover:text-gray-900"
                                                         onClick={() => router.visit(route('class-subjects.show', group.firstId))}
                                                     />
                                                     <IconButton
-                                                        label="Modifier"
+                                                        label={t('parametres.common.edit')}
                                                         icon={<Pencil className="w-4 h-4" />}
                                                         className="border-gray-300 text-gray-700 hover:bg-gray-50 hover:text-gray-900"
                                                         onClick={() => router.get(route('class-subjects.edit', group.firstId))}
                                                     />
                                                     <IconButton
-                                                        label="Supprimer"
+                                                        label={t('parametres.common.delete')}
                                                         icon={<Trash2 className="w-4 h-4" />}
                                                         className="border-red-300 text-red-600 hover:bg-red-50 hover:text-red-700"
                                                         onClick={() => setDeleteConfirm(group.firstId)}
@@ -324,7 +326,7 @@ export default function Index({ classSubjects, message, filters }: Readonly<Inde
                                         >
                                             <div className="flex flex-col items-center gap-2">
                                                 <BookOpen className="w-12 h-12 text-gray-300" />
-                                                <p className="text-lg">Aucune attribution trouvée</p>
+                                                <p className="text-lg">{t('parametres.class_subjects.empty')}</p>
                                             </div>
                                         </TableCell>
                                     </TableRow>
@@ -339,7 +341,7 @@ export default function Index({ classSubjects, message, filters }: Readonly<Inde
                     <div className="bg-white rounded-lg shadow-sm border border-gray-100 p-4">
                         <div className="flex items-center justify-between">
                             <p className="text-sm text-gray-600">
-                                Affichage <span className="font-semibold">{classSubjects.from}</span> à <span className="font-semibold">{classSubjects.to}</span> sur <span className="font-semibold">{classSubjects.total}</span> attributions
+                                {t('parametres.class_subjects.showing', { from: classSubjects.from, to: classSubjects.to, total: classSubjects.total })}
                             </p>
                             <div className="flex items-center gap-2">
                                 <Button
@@ -355,7 +357,7 @@ export default function Index({ classSubjects, message, filters }: Readonly<Inde
                                     className="border-gray-300 text-gray-700 hover:bg-blue-50 hover:text-blue-700 hover:border-blue-300 disabled:opacity-50 disabled:cursor-not-allowed"
                                 >
                                     <ChevronLeft className="w-4 h-4 mr-1" />
-                                    Précédent
+                                    {t('parametres.common.prev')}
                                 </Button>
                                 <div className="flex gap-1">
                                     {Array.from({ length: Math.min(5, classSubjects.last_page) }, (_, i) => {
@@ -397,12 +399,12 @@ export default function Index({ classSubjects, message, filters }: Readonly<Inde
                                     }, { preserveScroll: true })}
                                     className="border-gray-300 text-gray-700 hover:bg-blue-50 hover:text-blue-700 hover:border-blue-300 disabled:opacity-50 disabled:cursor-not-allowed"
                                 >
-                                    Suivant
+                                    {t('parametres.common.next')}
                                     <ChevronRight className="w-4 h-4 ml-1" />
                                 </Button>
                             </div>
                             <p className="text-sm text-gray-600">
-                                Page <span className="font-semibold">{classSubjects.current_page}</span> sur <span className="font-semibold">{classSubjects.last_page}</span>
+                                {t('parametres.class_subjects.page_of', { current: classSubjects.current_page, last: classSubjects.last_page })}
                             </p>
                         </div>
                     </div>
@@ -413,14 +415,13 @@ export default function Index({ classSubjects, message, filters }: Readonly<Inde
             <AlertDialog open={!!deleteConfirm} onOpenChange={() => setDeleteConfirm(null)}>
                 <AlertDialogContent>
                     <AlertDialogHeader>
-                        <AlertDialogTitle>Confirmer la suppression</AlertDialogTitle>
+                        <AlertDialogTitle>{t('parametres.class_subjects.delete_title')}</AlertDialogTitle>
                         <AlertDialogDescription>
-                            Êtes-vous sûr de vouloir supprimer cette attribution ? Cette action
-                            est irréversible.
+                            {t('parametres.class_subjects.delete_desc')}
                         </AlertDialogDescription>
                     </AlertDialogHeader>
                     <div className="flex gap-3 justify-end">
-                        <AlertDialogCancel>Annuler</AlertDialogCancel>
+                        <AlertDialogCancel>{t('parametres.common.cancel')}</AlertDialogCancel>
                         <AlertDialogAction
                             onClick={() => {
                                 if (deleteConfirm) {
@@ -430,7 +431,7 @@ export default function Index({ classSubjects, message, filters }: Readonly<Inde
                             disabled={isDeleting}
                             className="bg-red-600 hover:bg-red-700"
                         >
-                            {isDeleting ? 'Suppression...' : 'Supprimer'}
+                            {isDeleting ? t('parametres.class_subjects.deleting') : t('parametres.common.delete')}
                         </AlertDialogAction>
                     </div>
                 </AlertDialogContent>
diff --git a/resources/js/pages/Parametres/ClassSubjects/Show.tsx b/resources/js/pages/Parametres/ClassSubjects/Show.tsx
index 7eb53010..3b39dca9 100644
--- a/resources/js/pages/Parametres/ClassSubjects/Show.tsx
+++ b/resources/js/pages/Parametres/ClassSubjects/Show.tsx
@@ -12,6 +12,7 @@ import {
 } from '@/components/ui/alert-dialog';
 import { Button } from '@/components/ui/button';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface Classroom {
@@ -48,6 +49,8 @@ interface ShowProps {
 }
 
 export default function Show({ classSubject }: Readonly<ShowProps>) {
+    const { t, locale } = useTranslation();
+    const dateLocale = locale === 'en' ? 'en-GB' : 'fr-FR';
     const [deleteConfirm, setDeleteConfirm] = useState(false);
     const [isDeleting, setIsDeleting] = useState(false);
 
@@ -66,7 +69,7 @@ export default function Show({ classSubject }: Readonly<ShowProps>) {
 
     return (
         <AppLayout>
-            <Head title="Détails de l'attribution" />
+            <Head title={t('parametres.class_subjects.show_head')} />
 
             <div className="space-y-6">
                 {/* Header */}
@@ -80,10 +83,10 @@ export default function Show({ classSubject }: Readonly<ShowProps>) {
                         </button>
                         <div>
                             <h1 className="text-3xl font-bold text-gray-900">
-                                Détails de l'attribution
+                                {t('parametres.class_subjects.show_title')}
                             </h1>
                             <p className="text-gray-600 mt-1">
-                                Informations sur l'attribution de matière à la classe
+                                {t('parametres.class_subjects.show_subtitle')}
                             </p>
                         </div>
                     </div>
@@ -97,7 +100,7 @@ export default function Show({ classSubject }: Readonly<ShowProps>) {
                             className="bg-blue-600 hover:bg-blue-700 gap-2"
                         >
                             <Pencil className="w-4 h-4" />
-                            Modifier
+                            {t('parametres.common.edit')}
                         </Button>
                         <Button
                             onClick={() => setDeleteConfirm(true)}
@@ -105,7 +108,7 @@ export default function Show({ classSubject }: Readonly<ShowProps>) {
                             className="gap-2"
                         >
                             <Trash2 className="w-4 h-4" />
-                            Supprimer
+                            {t('parametres.common.delete')}
                         </Button>
                     </div>
                 </div>
@@ -115,17 +118,17 @@ export default function Show({ classSubject }: Readonly<ShowProps>) {
                     {/* Classe */}
                     <div className="bg-white rounded-lg p-6">
                         <h2 className="text-lg font-semibold text-gray-900 mb-4">
-                            Classe
+                            {t('parametres.class_subjects.show_class')}
                         </h2>
                         <div className="space-y-3">
                             <div>
-                                <p className="text-sm text-gray-600">Nom</p>
+                                <p className="text-sm text-gray-600">{t('parametres.class_subjects.show_name')}</p>
                                 <p className="text-lg font-medium text-gray-900">
                                     {classSubject.class.name}
                                 </p>
                             </div>
                             <div>
-                                <p className="text-sm text-gray-600">Code</p>
+                                <p className="text-sm text-gray-600">{t('parametres.class_subjects.code')}</p>
                                 <p className="text-lg font-medium text-gray-900">
                                     {classSubject.class.code}
                                 </p>
@@ -136,23 +139,23 @@ export default function Show({ classSubject }: Readonly<ShowProps>) {
                     {/* Matière */}
                     <div className="bg-white rounded-lg p-6">
                         <h2 className="text-lg font-semibold text-gray-900 mb-4">
-                            Matière
+                            {t('parametres.class_subjects.show_subject')}
                         </h2>
                         <div className="space-y-3">
                             <div>
-                                <p className="text-sm text-gray-600">Nom</p>
+                                <p className="text-sm text-gray-600">{t('parametres.class_subjects.show_name')}</p>
                                 <p className="text-lg font-medium text-gray-900">
                                     {classSubject.subject.name}
                                 </p>
                             </div>
                             <div>
-                                <p className="text-sm text-gray-600">Code</p>
+                                <p className="text-sm text-gray-600">{t('parametres.class_subjects.code')}</p>
                                 <p className="text-lg font-medium text-gray-900">
                                     {classSubject.subject.code}
                                 </p>
                             </div>
                             <div>
-                                <p className="text-sm text-gray-600">Coefficient</p>
+                                <p className="text-sm text-gray-600">{t('parametres.class_subjects.show_coef')}</p>
                                 <p className="text-lg font-medium text-gray-900">
                                     {classSubject.coefficient}
                                 </p>
@@ -163,26 +166,26 @@ export default function Show({ classSubject }: Readonly<ShowProps>) {
                     {/* Année Académique */}
                     <div className="bg-white rounded-lg p-6 md:col-span-2">
                         <h2 className="text-lg font-semibold text-gray-900 mb-4">
-                            Année académique
+                            {t('parametres.class_subjects.show_year')}
                         </h2>
                         <div className="space-y-3">
                             <div>
-                                <p className="text-sm text-gray-600">Année</p>
+                                <p className="text-sm text-gray-600">{t('parametres.class_subjects.show_year_label')}</p>
                                 <p className="text-lg font-medium text-gray-900">
                                     {classSubject.academicYear.year}
                                 </p>
                             </div>
                             <div className="grid grid-cols-2 gap-4">
                                 <div>
-                                    <p className="text-sm text-gray-600">Date de début</p>
+                                    <p className="text-sm text-gray-600">{t('parametres.class_subjects.show_start')}</p>
                                     <p className="text-lg font-medium text-gray-900">
-                                        {new Date(classSubject.academicYear.start_date).toLocaleDateString('fr-FR')}
+                                        {new Date(classSubject.academicYear.start_date).toLocaleDateString(dateLocale)}
                                     </p>
                                 </div>
                                 <div>
-                                    <p className="text-sm text-gray-600">Date de fin</p>
+                                    <p className="text-sm text-gray-600">{t('parametres.class_subjects.show_end')}</p>
                                     <p className="text-lg font-medium text-gray-900">
-                                        {new Date(classSubject.academicYear.end_date).toLocaleDateString('fr-FR')}
+                                        {new Date(classSubject.academicYear.end_date).toLocaleDateString(dateLocale)}
                                     </p>
                                 </div>
                             </div>
@@ -193,14 +196,14 @@ export default function Show({ classSubject }: Readonly<ShowProps>) {
                 {/* Dates */}
                 <div className="bg-white rounded-lg p-6">
                     <h2 className="text-lg font-semibold text-gray-900 mb-4">
-                        Informations de suivi
+                        {t('parametres.class_subjects.show_tracking')}
                     </h2>
                     <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
                         <div>
-                            <p className="text-sm text-gray-600">Créé le</p>
+                            <p className="text-sm text-gray-600">{t('parametres.class_subjects.show_created_on')}</p>
                             <p className="text-lg font-medium text-gray-900">
                                 {new Date(classSubject.created_at).toLocaleDateString(
-                                    'fr-FR',
+                                    dateLocale,
                                     {
                                         year: 'numeric',
                                         month: 'long',
@@ -212,10 +215,10 @@ export default function Show({ classSubject }: Readonly<ShowProps>) {
                             </p>
                         </div>
                         <div>
-                            <p className="text-sm text-gray-600">Modifié le</p>
+                            <p className="text-sm text-gray-600">{t('parametres.class_subjects.show_updated_on')}</p>
                             <p className="text-lg font-medium text-gray-900">
                                 {new Date(classSubject.updated_at).toLocaleDateString(
-                                    'fr-FR',
+                                    dateLocale,
                                     {
                                         year: 'numeric',
                                         month: 'long',
@@ -234,20 +237,19 @@ export default function Show({ classSubject }: Readonly<ShowProps>) {
             <AlertDialog open={deleteConfirm} onOpenChange={setDeleteConfirm}>
                 <AlertDialogContent>
                     <AlertDialogHeader>
-                        <AlertDialogTitle>Confirmer la suppression</AlertDialogTitle>
+                        <AlertDialogTitle>{t('parametres.class_subjects.delete_title')}</AlertDialogTitle>
                         <AlertDialogDescription>
-                            Êtes-vous sûr de vouloir supprimer cette attribution ?
-                            Cette action est irréversible.
+                            {t('parametres.class_subjects.delete_desc')}
                         </AlertDialogDescription>
                     </AlertDialogHeader>
                     <div className="flex gap-3 justify-end">
-                        <AlertDialogCancel>Annuler</AlertDialogCancel>
+                        <AlertDialogCancel>{t('parametres.common.cancel')}</AlertDialogCancel>
                         <AlertDialogAction
                             onClick={handleDelete}
                             disabled={isDeleting}
                             className="bg-red-600 hover:bg-red-700"
                         >
-                            {isDeleting ? 'Suppression...' : 'Supprimer'}
+                            {isDeleting ? t('parametres.class_subjects.deleting') : t('parametres.common.delete')}
                         </AlertDialogAction>
                     </div>
                 </AlertDialogContent>

From 3827ec0994c4bb3e030e5e642b1d05485e6ba1a8 Mon Sep 17 00:00:00 2001
From: horacioskrp <hervekudayah@gmail.com>
Date: Fri, 13 Nov 2026 10:57:39 +0000
Subject: [PATCH 12/12] =?UTF-8?q?feat(i18n):=20param=C3=A8tres=20=E2=80=94?=
 =?UTF-8?q?=20structures=20de=20frais=20(liste,=20cr=C3=A9ation,=20=C3=A9d?=
 =?UTF-8?q?ition,=20d=C3=A9tail)=20(FR/EN)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 lang/en/parametres.php                        | 116 ++++++++++++++++++
 lang/fr/parametres.php                        | 116 ++++++++++++++++++
 .../pages/Parametres/FeeStructures/Create.tsx |  42 ++++---
 .../pages/Parametres/FeeStructures/Edit.tsx   |  38 +++---
 .../pages/Parametres/FeeStructures/Index.tsx  |  89 +++++++-------
 .../pages/Parametres/FeeStructures/Show.tsx   | 101 +++++++--------
 6 files changed, 371 insertions(+), 131 deletions(-)

diff --git a/lang/en/parametres.php b/lang/en/parametres.php
index f06629ca..672e0ad8 100644
--- a/lang/en/parametres.php
+++ b/lang/en/parametres.php
@@ -973,4 +973,120 @@
         'show_created_on' => 'Created on',
         'show_updated_on' => 'Updated on',
     ],
+
+    'fee_structures' => [
+        // Index
+        'head' => 'Fee structures',
+        'title' => 'Fee structures',
+        'subtitle' => 'Manage fee amounts by category, class and academic year',
+        'replicate_year' => 'Replicate a year',
+        'new' => 'New structure',
+        'stat_total' => 'Total amount',
+        'stat_average' => 'Average amount',
+        'stat_classes' => 'Classes covered',
+        'stat_categories' => 'Categories covered',
+        'stat_gap' => 'Min/max gap',
+        'stat_gap_detail' => 'Min :min | Max :max',
+        'search_ph' => 'Search by category, class or year...',
+        'filter_year' => 'Academic year',
+        'filter_all_years' => 'All years',
+        'active_suffix' => ' (active)',
+        'filter_category' => 'Category',
+        'filter_all_categories' => 'All categories',
+        'filter_class' => 'Class',
+        'filter_all_classes' => 'All classes',
+        'filter_amount_min' => 'Min amount',
+        'filter_amount_max' => 'Max amount',
+        'search' => 'Search',
+        'reset' => 'Reset',
+        'filtered_count' => ':count filtered structure(s) | Max: :max',
+        'col_year' => 'Academic year',
+        'col_category' => 'Category',
+        'col_class' => 'Class',
+        'col_amount' => 'Amount',
+        'col_actions' => 'Actions',
+        'empty' => 'No fee structure found',
+        'pagination' => 'Showing :from to :to of :total results',
+        // Delete dialog
+        'delete_title' => 'Confirm deletion',
+        'delete_desc' => 'Are you sure you want to delete this fee structure? This action is irreversible.',
+        'cancel' => 'Cancel',
+        'deleting' => 'Deleting...',
+        'delete' => 'Delete',
+        // Replicate dialog
+        'replicate_title' => 'Replicate fee structures',
+        'replicate_desc' => 'Copies all structures (and their installments) from one year to the active year. Category / class combinations already present are ignored.',
+        'replicate_target' => 'Target year (active):',
+        'replicate_source' => 'Source year *',
+        'replicate_source_ph' => 'Choose the year to copy',
+        'replicating' => 'Replicating...',
+        'replicate' => 'Replicate',
+        'replicate_no_active' => 'No active academic year. Activate a year before replicating.',
+        // Create / Edit
+        'create_head' => 'New fee structure',
+        'create_title' => 'New fee structure',
+        'create_subtitle' => 'Create a new fee structure for an academic year, category and class',
+        'edit_head' => 'Edit fee structure',
+        'edit_title' => 'Edit fee structure',
+        'edit_subtitle' => 'Edit the information for this fee structure',
+        'back' => 'Back',
+        'section_academic' => 'Academic context',
+        'active_year' => 'Active academic year',
+        'active_badge' => 'Active',
+        'no_active_year' => 'No active academic year. Activate one first.',
+        'auto_attach' => 'The structure is automatically attached to the active year.',
+        'field_year' => 'Academic year',
+        'field_year_ph' => 'Select an academic year',
+        'field_category' => 'Fee category',
+        'field_category_ph' => 'Select a category',
+        'field_class_section' => 'Class concerned',
+        'field_class' => 'Class',
+        'field_class_ph' => 'Select a class',
+        'field_amount' => 'Amount',
+        'field_amount_currency' => 'Amount (:currency)',
+        'field_amount_ph' => 'Ex: 50000',
+        'saving' => 'Saving...',
+        'save' => 'Save',
+        'updating' => 'Updating...',
+        'update' => 'Update',
+        // Show
+        'show_head' => 'Fee structure details',
+        'manage_installments' => 'Manage installments',
+        'edit' => 'Edit',
+        'show_heading' => 'Fee structure',
+        'show_amount_total' => 'Total amount',
+        'installments_count' => ':count installment(s)',
+        'show_general' => 'General information',
+        'show_year' => 'Academic year',
+        'show_category' => 'Fee category',
+        'show_class' => 'Class concerned',
+        'show_code' => 'Code',
+        'show_amount_section' => 'Amount and installments',
+        'installments' => 'Installments',
+        'manage' => 'Manage',
+        'installment_num' => 'Installment :num',
+        'no_installments' => 'No installment defined',
+        'show_system' => 'System information',
+        'show_created_on' => 'Created on',
+        'show_updated_on' => 'Last modified',
+        'show_uid' => 'Unique identifier',
+        // Installments modal
+        'modal_title' => 'Manage installments',
+        'modal_desc' => 'Add or edit the installments for this fee structure.',
+        'current_structure' => 'Current structure',
+        'current_total' => 'Total amount:',
+        'current_installments' => 'Current installments:',
+        'configured_total' => 'Total of configured installments',
+        'installments_total_label' => 'Total installment amount:',
+        'installment_name' => 'Installment name',
+        'installment_name_ph' => 'Ex: First installment',
+        'installment_number_label' => 'No.',
+        'installment_amount' => 'Amount',
+        'add_installment' => 'Add an installment',
+        'save_installments' => 'Save installments',
+        'total_exceeds' => 'The installment total (:total) exceeds the structure amount (:amount)',
+        'err_valid_installment' => 'Please add at least one valid installment.',
+        'err_total_exceeds' => 'The installment total cannot exceed the fee structure amount.',
+        'err_saving' => 'Error while saving the installments.',
+    ],
 ];
diff --git a/lang/fr/parametres.php b/lang/fr/parametres.php
index f954dce4..3d865e95 100644
--- a/lang/fr/parametres.php
+++ b/lang/fr/parametres.php
@@ -973,4 +973,120 @@
         'show_created_on' => 'Créé le',
         'show_updated_on' => 'Modifié le',
     ],
+
+    'fee_structures' => [
+        // Index
+        'head' => 'Structures de frais',
+        'title' => 'Structures de frais',
+        'subtitle' => 'Gérez les montants des frais par catégorie, classe et année académique',
+        'replicate_year' => 'Répliquer une année',
+        'new' => 'Nouvelle structure',
+        'stat_total' => 'Montant total',
+        'stat_average' => 'Montant moyen',
+        'stat_classes' => 'Classes couvertes',
+        'stat_categories' => 'Catégories couvertes',
+        'stat_gap' => 'Écart min/max',
+        'stat_gap_detail' => 'Min :min | Max :max',
+        'search_ph' => 'Rechercher par catégorie, classe ou année...',
+        'filter_year' => 'Année académique',
+        'filter_all_years' => 'Toutes les années',
+        'active_suffix' => ' (active)',
+        'filter_category' => 'Catégorie',
+        'filter_all_categories' => 'Toutes les catégories',
+        'filter_class' => 'Classe',
+        'filter_all_classes' => 'Toutes les classes',
+        'filter_amount_min' => 'Montant min',
+        'filter_amount_max' => 'Montant max',
+        'search' => 'Rechercher',
+        'reset' => 'Réinitialiser',
+        'filtered_count' => ':count structure(s) filtrée(s) | Max : :max',
+        'col_year' => 'Année académique',
+        'col_category' => 'Catégorie',
+        'col_class' => 'Classe',
+        'col_amount' => 'Montant',
+        'col_actions' => 'Actions',
+        'empty' => 'Aucune structure de frais trouvée',
+        'pagination' => 'Affichage de :from à :to sur :total résultats',
+        // Delete dialog
+        'delete_title' => 'Confirmer la suppression',
+        'delete_desc' => 'Êtes-vous sûr de vouloir supprimer cette structure de frais ? Cette action est irréversible.',
+        'cancel' => 'Annuler',
+        'deleting' => 'Suppression...',
+        'delete' => 'Supprimer',
+        // Replicate dialog
+        'replicate_title' => 'Répliquer les structures de frais',
+        'replicate_desc' => 'Copie toutes les structures (et leurs tranches) d\'une année vers l\'année active. Les combinaisons catégorie / classe déjà présentes sont ignorées.',
+        'replicate_target' => 'Année cible (active) :',
+        'replicate_source' => 'Année source *',
+        'replicate_source_ph' => 'Choisir l\'année à copier',
+        'replicating' => 'Réplication...',
+        'replicate' => 'Répliquer',
+        'replicate_no_active' => 'Aucune année académique active. Activez une année avant de répliquer.',
+        // Create / Edit
+        'create_head' => 'Nouvelle structure de frais',
+        'create_title' => 'Nouvelle structure de frais',
+        'create_subtitle' => 'Créez une nouvelle structure de frais pour une année académique, catégorie et classe',
+        'edit_head' => 'Modifier la structure de frais',
+        'edit_title' => 'Modifier la structure de frais',
+        'edit_subtitle' => 'Modifiez les informations de cette structure de frais',
+        'back' => 'Retour',
+        'section_academic' => 'Contexte académique',
+        'active_year' => 'Année académique active',
+        'active_badge' => 'Active',
+        'no_active_year' => 'Aucune année académique active. Activez-en une d\'abord.',
+        'auto_attach' => 'La structure est automatiquement rattachée à l\'année active.',
+        'field_year' => 'Année académique',
+        'field_year_ph' => 'Sélectionner une année académique',
+        'field_category' => 'Catégorie de frais',
+        'field_category_ph' => 'Sélectionner une catégorie',
+        'field_class_section' => 'Classe concernée',
+        'field_class' => 'Classe',
+        'field_class_ph' => 'Sélectionner une classe',
+        'field_amount' => 'Montant',
+        'field_amount_currency' => 'Montant (:currency)',
+        'field_amount_ph' => 'Ex: 50000',
+        'saving' => 'Enregistrement...',
+        'save' => 'Enregistrer',
+        'updating' => 'Mise à jour...',
+        'update' => 'Mettre à jour',
+        // Show
+        'show_head' => 'Détails de la structure de frais',
+        'manage_installments' => 'Gérer les tranches',
+        'edit' => 'Modifier',
+        'show_heading' => 'Structure de frais',
+        'show_amount_total' => 'Montant total',
+        'installments_count' => ':count tranche(s)',
+        'show_general' => 'Informations générales',
+        'show_year' => 'Année académique',
+        'show_category' => 'Catégorie de frais',
+        'show_class' => 'Classe concernée',
+        'show_code' => 'Code',
+        'show_amount_section' => 'Montant et tranches',
+        'installments' => 'Tranches',
+        'manage' => 'Gérer',
+        'installment_num' => 'Tranche :num',
+        'no_installments' => 'Aucune tranche définie',
+        'show_system' => 'Informations système',
+        'show_created_on' => 'Créée le',
+        'show_updated_on' => 'Dernière modification',
+        'show_uid' => 'Identifiant unique',
+        // Installments modal
+        'modal_title' => 'Gérer les tranches',
+        'modal_desc' => 'Ajoutez ou modifiez les tranches pour cette structure de frais.',
+        'current_structure' => 'Structure actuelle',
+        'current_total' => 'Montant total:',
+        'current_installments' => 'Tranches actuelles:',
+        'configured_total' => 'Total des tranches configurées',
+        'installments_total_label' => 'Montant total des tranches:',
+        'installment_name' => 'Nom de la tranche',
+        'installment_name_ph' => 'Ex: Première tranche',
+        'installment_number_label' => 'N°',
+        'installment_amount' => 'Montant',
+        'add_installment' => 'Ajouter une tranche',
+        'save_installments' => 'Enregistrer les tranches',
+        'total_exceeds' => 'Le total des tranches (:total) dépasse le montant de la structure (:amount)',
+        'err_valid_installment' => 'Veuillez ajouter au moins une tranche valide.',
+        'err_total_exceeds' => 'Le total des tranches ne peut pas dépasser le montant de la structure de frais.',
+        'err_saving' => 'Erreur lors de l\'enregistrement des tranches.',
+    ],
 ];
diff --git a/resources/js/pages/Parametres/FeeStructures/Create.tsx b/resources/js/pages/Parametres/FeeStructures/Create.tsx
index fcf8ea90..16ed1ce3 100644
--- a/resources/js/pages/Parametres/FeeStructures/Create.tsx
+++ b/resources/js/pages/Parametres/FeeStructures/Create.tsx
@@ -6,6 +6,7 @@ import { Input } from '@/components/ui/input';
 import { Label } from '@/components/ui/label';
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface FeeCategory {
@@ -26,6 +27,7 @@ interface CreateProps {
 }
 
 export default function Create({ activeYear, feeCategories, classrooms }: Readonly<CreateProps>) {
+    const { t } = useTranslation();
     const currency = useCurrencySymbol();
     const { data, setData, post, processing, errors } = useForm({
         academic_year_id: activeYear?.id ?? '',
@@ -41,7 +43,7 @@ export default function Create({ activeYear, feeCategories, classrooms }: Readon
 
     return (
         <AppLayout>
-            <Head title="Nouvelle structure de frais" />
+            <Head title={t('parametres.fee_structures.create_head')} />
 
             <div className="space-y-6">
                 <div className="flex items-center gap-4">
@@ -52,16 +54,16 @@ export default function Create({ activeYear, feeCategories, classrooms }: Readon
                         className="text-gray-600 hover:text-gray-900"
                     >
                         <ArrowLeft className="h-4 w-4 mr-2" />
-                        Retour
+                        {t('parametres.fee_structures.back')}
                     </Button>
                 </div>
 
                 <div>
                     <h1 className="text-4xl font-bold tracking-tight text-gray-900 flex items-center gap-3"><DollarSign className="h-7 w-7 text-blue-600 shrink-0" />
-                        Nouvelle structure de frais
+                        {t('parametres.fee_structures.create_title')}
                     </h1>
                     <p className="mt-3 text-base text-gray-600">
-                        Créez une nouvelle structure de frais pour une année académique, catégorie et classe
+                        {t('parametres.fee_structures.create_subtitle')}
                     </p>
                 </div>
 
@@ -70,19 +72,19 @@ export default function Create({ activeYear, feeCategories, classrooms }: Readon
                     <div className="rounded-2xl bg-linear-to-br from-indigo-50 to-white ring-1 ring-indigo-100 p-6 space-y-4">
                         <div className="flex items-center gap-2 text-indigo-700">
                             <CalendarDays className="h-4 w-4" />
-                            <p className="text-sm font-semibold">Contexte académique</p>
+                            <p className="text-sm font-semibold">{t('parametres.fee_structures.section_academic')}</p>
                         </div>
                         <div className="space-y-2">
-                        <Label>Année académique active</Label>
+                        <Label>{t('parametres.fee_structures.active_year')}</Label>
                         {activeYear ? (
                             <div className="flex items-center gap-2 rounded-md border border-slate-200 bg-white/90 px-3 py-2">
                                 <span className="text-base font-semibold text-gray-900">{activeYear.year}</span>
-                                <span className="text-xs rounded-full bg-indigo-100 text-indigo-700 px-2 py-0.5">active</span>
+                                <span className="text-xs rounded-full bg-indigo-100 text-indigo-700 px-2 py-0.5">{t('parametres.fee_structures.active_badge')}</span>
                             </div>
                         ) : (
-                            <p className="text-sm text-red-600">Aucune année académique active. Activez-en une d'abord.</p>
+                            <p className="text-sm text-red-600">{t('parametres.fee_structures.no_active_year')}</p>
                         )}
-                        <p className="text-xs text-gray-500">La structure est automatiquement rattachée à l'année active.</p>
+                        <p className="text-xs text-gray-500">{t('parametres.fee_structures.auto_attach')}</p>
                         {errors.academic_year_id && (
                             <p className="text-sm text-red-600">{errors.academic_year_id}</p>
                         )}
@@ -92,18 +94,18 @@ export default function Create({ activeYear, feeCategories, classrooms }: Readon
                     <div className="rounded-2xl bg-linear-to-br from-amber-50 to-white ring-1 ring-amber-100 p-6 space-y-4">
                         <div className="flex items-center gap-2 text-amber-700">
                             <Layers className="h-4 w-4" />
-                            <p className="text-sm font-semibold">Catégorie de frais</p>
+                            <p className="text-sm font-semibold">{t('parametres.fee_structures.field_category')}</p>
                         </div>
                         <div className="space-y-2">
                         <Label htmlFor="fee_category_id">
-                            Catégorie de frais <span className="text-red-600">*</span>
+                            {t('parametres.fee_structures.field_category')} <span className="text-red-600">*</span>
                         </Label>
                         <Select
                             value={data.fee_category_id}
                             onValueChange={(value) => setData('fee_category_id', value)}
                         >
                             <SelectTrigger id="fee_category_id" className="border-slate-200 bg-white/90">
-                                <SelectValue placeholder="Sélectionner une catégorie" />
+                                <SelectValue placeholder={t('parametres.fee_structures.field_category_ph')} />
                             </SelectTrigger>
                             <SelectContent>
                                 {feeCategories.map((category) => (
@@ -122,18 +124,18 @@ export default function Create({ activeYear, feeCategories, classrooms }: Readon
                     <div className="rounded-2xl bg-linear-to-br from-sky-50 to-white ring-1 ring-sky-100 p-6 space-y-4">
                         <div className="flex items-center gap-2 text-sky-700">
                             <School className="h-4 w-4" />
-                            <p className="text-sm font-semibold">Classe concernée</p>
+                            <p className="text-sm font-semibold">{t('parametres.fee_structures.field_class_section')}</p>
                         </div>
                         <div className="space-y-2">
                         <Label htmlFor="class_id">
-                            Classe <span className="text-red-600">*</span>
+                            {t('parametres.fee_structures.field_class')} <span className="text-red-600">*</span>
                         </Label>
                         <Select
                             value={data.class_id}
                             onValueChange={(value) => setData('class_id', value)}
                         >
                             <SelectTrigger id="class_id" className="border-slate-200 bg-white/90">
-                                <SelectValue placeholder="Sélectionner une classe" />
+                                <SelectValue placeholder={t('parametres.fee_structures.field_class_ph')} />
                             </SelectTrigger>
                             <SelectContent>
                                 {classrooms.map((classroom) => (
@@ -152,18 +154,18 @@ export default function Create({ activeYear, feeCategories, classrooms }: Readon
                     <div className="rounded-2xl bg-linear-to-br from-emerald-50 to-white ring-1 ring-emerald-100 p-6 space-y-4">
                         <div className="flex items-center gap-2 text-emerald-700">
                             <Banknote className="h-4 w-4" />
-                            <p className="text-sm font-semibold">Montant</p>
+                            <p className="text-sm font-semibold">{t('parametres.fee_structures.field_amount')}</p>
                         </div>
                         <div className="space-y-2">
                         <Label htmlFor="amount">
-                            Montant ({currency}) <span className="text-red-600">*</span>
+                            {t('parametres.fee_structures.field_amount_currency', { currency })} <span className="text-red-600">*</span>
                         </Label>
                         <Input
                             id="amount"
                             type="number"
                             step="0.01"
                             min="0"
-                            placeholder="Ex: 50000"
+                            placeholder={t('parametres.fee_structures.field_amount_ph')}
                             value={data.amount}
                             onChange={(e) => setData('amount', e.target.value)}
                             className="border-slate-200 bg-white/90"
@@ -183,14 +185,14 @@ export default function Create({ activeYear, feeCategories, classrooms }: Readon
                             disabled={processing}
                             className="border-slate-200"
                         >
-                            Annuler
+                            {t('parametres.fee_structures.cancel')}
                         </Button>
                         <Button
                             type="submit"
                             disabled={processing || !activeYear}
                             className="bg-blue-600 hover:bg-blue-700"
                         >
-                            {processing ? 'Enregistrement...' : 'Enregistrer'}
+                            {processing ? t('parametres.fee_structures.saving') : t('parametres.fee_structures.save')}
                         </Button>
                     </div>
                 </form>
diff --git a/resources/js/pages/Parametres/FeeStructures/Edit.tsx b/resources/js/pages/Parametres/FeeStructures/Edit.tsx
index fbe607ee..5efd63fa 100644
--- a/resources/js/pages/Parametres/FeeStructures/Edit.tsx
+++ b/resources/js/pages/Parametres/FeeStructures/Edit.tsx
@@ -6,6 +6,7 @@ import { Input } from '@/components/ui/input';
 import { Label } from '@/components/ui/label';
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface AcademicYear {
@@ -40,6 +41,7 @@ interface EditProps {
 }
 
 export default function Edit({ feeStructure, academicYears, feeCategories, classrooms }: Readonly<EditProps>) {
+    const { t } = useTranslation();
     const currency = useCurrencySymbol();
     const { data, setData, put, processing, errors } = useForm({
         academic_year_id: feeStructure.academic_year_id,
@@ -55,7 +57,7 @@ export default function Edit({ feeStructure, academicYears, feeCategories, class
 
     return (
         <AppLayout>
-            <Head title="Modifier la structure de frais" />
+            <Head title={t('parametres.fee_structures.edit_head')} />
 
             <div className="space-y-6">
                 <div className="flex items-center gap-4">
@@ -66,16 +68,16 @@ export default function Edit({ feeStructure, academicYears, feeCategories, class
                         className="text-gray-600 hover:text-gray-900"
                     >
                         <ArrowLeft className="h-4 w-4 mr-2" />
-                        Retour
+                        {t('parametres.fee_structures.back')}
                     </Button>
                 </div>
 
                 <div>
                     <h1 className="text-4xl font-bold tracking-tight text-gray-900 flex items-center gap-3"><DollarSign className="h-7 w-7 text-blue-600 shrink-0" />
-                        Modifier la structure de frais
+                        {t('parametres.fee_structures.edit_title')}
                     </h1>
                     <p className="mt-3 text-base text-gray-600">
-                        Modifiez les informations de cette structure de frais
+                        {t('parametres.fee_structures.edit_subtitle')}
                     </p>
                 </div>
 
@@ -84,18 +86,18 @@ export default function Edit({ feeStructure, academicYears, feeCategories, class
                     <div className="rounded-2xl bg-linear-to-br from-indigo-50 to-white ring-1 ring-indigo-100 p-6 space-y-4">
                         <div className="flex items-center gap-2 text-indigo-700">
                             <CalendarDays className="h-4 w-4" />
-                            <p className="text-sm font-semibold">Contexte académique</p>
+                            <p className="text-sm font-semibold">{t('parametres.fee_structures.section_academic')}</p>
                         </div>
                         <div className="space-y-2">
                         <Label htmlFor="academic_year_id">
-                            Année académique <span className="text-red-600">*</span>
+                            {t('parametres.fee_structures.field_year')} <span className="text-red-600">*</span>
                         </Label>
                         <Select
                             value={data.academic_year_id}
                             onValueChange={(value) => setData('academic_year_id', value)}
                         >
                             <SelectTrigger id="academic_year_id" className="border-slate-200 bg-white/90">
-                                <SelectValue placeholder="Sélectionner une année académique" />
+                                <SelectValue placeholder={t('parametres.fee_structures.field_year_ph')} />
                             </SelectTrigger>
                             <SelectContent>
                                 {academicYears.map((year) => (
@@ -114,18 +116,18 @@ export default function Edit({ feeStructure, academicYears, feeCategories, class
                     <div className="rounded-2xl bg-linear-to-br from-amber-50 to-white ring-1 ring-amber-100 p-6 space-y-4">
                         <div className="flex items-center gap-2 text-amber-700">
                             <Layers className="h-4 w-4" />
-                            <p className="text-sm font-semibold">Catégorie de frais</p>
+                            <p className="text-sm font-semibold">{t('parametres.fee_structures.field_category')}</p>
                         </div>
                         <div className="space-y-2">
                         <Label htmlFor="fee_category_id">
-                            Catégorie de frais <span className="text-red-600">*</span>
+                            {t('parametres.fee_structures.field_category')} <span className="text-red-600">*</span>
                         </Label>
                         <Select
                             value={data.fee_category_id}
                             onValueChange={(value) => setData('fee_category_id', value)}
                         >
                             <SelectTrigger id="fee_category_id" className="border-slate-200 bg-white/90">
-                                <SelectValue placeholder="Sélectionner une catégorie" />
+                                <SelectValue placeholder={t('parametres.fee_structures.field_category_ph')} />
                             </SelectTrigger>
                             <SelectContent>
                                 {feeCategories.map((category) => (
@@ -144,18 +146,18 @@ export default function Edit({ feeStructure, academicYears, feeCategories, class
                     <div className="rounded-2xl bg-linear-to-br from-sky-50 to-white ring-1 ring-sky-100 p-6 space-y-4">
                         <div className="flex items-center gap-2 text-sky-700">
                             <School className="h-4 w-4" />
-                            <p className="text-sm font-semibold">Classe concernée</p>
+                            <p className="text-sm font-semibold">{t('parametres.fee_structures.field_class_section')}</p>
                         </div>
                         <div className="space-y-2">
                         <Label htmlFor="class_id">
-                            Classe <span className="text-red-600">*</span>
+                            {t('parametres.fee_structures.field_class')} <span className="text-red-600">*</span>
                         </Label>
                         <Select
                             value={data.class_id}
                             onValueChange={(value) => setData('class_id', value)}
                         >
                             <SelectTrigger id="class_id" className="border-slate-200 bg-white/90">
-                                <SelectValue placeholder="Sélectionner une classe" />
+                                <SelectValue placeholder={t('parametres.fee_structures.field_class_ph')} />
                             </SelectTrigger>
                             <SelectContent>
                                 {classrooms.map((classroom) => (
@@ -174,18 +176,18 @@ export default function Edit({ feeStructure, academicYears, feeCategories, class
                     <div className="rounded-2xl bg-linear-to-br from-emerald-50 to-white ring-1 ring-emerald-100 p-6 space-y-4">
                         <div className="flex items-center gap-2 text-emerald-700">
                             <Banknote className="h-4 w-4" />
-                            <p className="text-sm font-semibold">Montant</p>
+                            <p className="text-sm font-semibold">{t('parametres.fee_structures.field_amount')}</p>
                         </div>
                         <div className="space-y-2">
                         <Label htmlFor="amount">
-                            Montant ({currency}) <span className="text-red-600">*</span>
+                            {t('parametres.fee_structures.field_amount_currency', { currency })} <span className="text-red-600">*</span>
                         </Label>
                         <Input
                             id="amount"
                             type="number"
                             step="0.01"
                             min="0"
-                            placeholder="Ex: 50000"
+                            placeholder={t('parametres.fee_structures.field_amount_ph')}
                             value={data.amount}
                             onChange={(e) => setData('amount', e.target.value)}
                             className="border-slate-200 bg-white/90"
@@ -205,14 +207,14 @@ export default function Edit({ feeStructure, academicYears, feeCategories, class
                             disabled={processing}
                             className="border-slate-200"
                         >
-                            Annuler
+                            {t('parametres.fee_structures.cancel')}
                         </Button>
                         <Button
                             type="submit"
                             disabled={processing}
                             className="bg-blue-600 hover:bg-blue-700"
                         >
-                            {processing ? 'Mise à jour...' : 'Mettre à jour'}
+                            {processing ? t('parametres.fee_structures.updating') : t('parametres.fee_structures.update')}
                         </Button>
                     </div>
                 </form>
diff --git a/resources/js/pages/Parametres/FeeStructures/Index.tsx b/resources/js/pages/Parametres/FeeStructures/Index.tsx
index b493e051..f727dd61 100644
--- a/resources/js/pages/Parametres/FeeStructures/Index.tsx
+++ b/resources/js/pages/Parametres/FeeStructures/Index.tsx
@@ -30,6 +30,7 @@ import {
     TableRow,
 } from '@/components/ui/table';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface AcademicYear {
@@ -95,6 +96,7 @@ interface IndexProps {
 }
 
 export default function Index({ feeStructures, academicYears, feeCategories, classrooms, stats, message, filters }: Readonly<IndexProps>) {
+    const { t } = useTranslation();
     const [deleteConfirm, setDeleteConfirm] = useState<string | null>(null);
     const [isDeleting, setIsDeleting] = useState(false);
     const [searchQuery, setSearchQuery] = useState(filters.search || '');
@@ -183,17 +185,17 @@ export default function Index({ feeStructures, academicYears, feeCategories, cla
 
     return (
         <AppLayout>
-            <Head title="Structures de frais" />
+            <Head title={t('parametres.fee_structures.head')} />
 
             <div className="space-y-6">
                 {/* Header avec titre et bouton */}
                 <div className="flex items-start justify-between">
                     <div>
                         <h1 className="text-4xl font-bold tracking-tight text-gray-900 flex items-center gap-3"><DollarSign className="h-7 w-7 text-blue-600 shrink-0" />
-                            Structures de frais
+                            {t('parametres.fee_structures.title')}
                         </h1>
                         <p className="mt-3 text-base text-gray-600">
-                            Gérez les montants des frais par catégorie, classe et année académique
+                            {t('parametres.fee_structures.subtitle')}
                         </p>
                     </div>
                     <div className="flex gap-3">
@@ -203,14 +205,14 @@ export default function Index({ feeStructures, academicYears, feeCategories, cla
                             className="border-indigo-300 text-indigo-600 hover:bg-indigo-50"
                         >
                             <Copy className="h-4 w-4 mr-2" />
-                            Répliquer une année
+                            {t('parametres.fee_structures.replicate_year')}
                         </Button>
                         <Button
                             onClick={() => router.visit(route('fee-structures.create'))}
                             className="bg-blue-600 hover:bg-blue-700 text-white"
                         >
                             <Plus className="h-4 w-4 mr-2" />
-                            Nouvelle structure
+                            {t('parametres.fee_structures.new')}
                         </Button>
                     </div>
                 </div>
@@ -230,7 +232,7 @@ export default function Index({ feeStructures, academicYears, feeCategories, cla
                                 <DollarSign className="h-6 w-6 text-blue-600" />
                             </div>
                             <div>
-                                <p className="text-sm font-medium text-gray-600">Montant total</p>
+                                <p className="text-sm font-medium text-gray-600">{t('parametres.fee_structures.stat_total')}</p>
                                 <p className="text-2xl font-bold text-blue-700">{formatMoney(stats.amount_total)}</p>
                             </div>
                         </div>
@@ -241,7 +243,7 @@ export default function Index({ feeStructures, academicYears, feeCategories, cla
                                 <TrendingUp className="h-6 w-6 text-emerald-600" />
                             </div>
                             <div>
-                                <p className="text-sm font-medium text-gray-600">Montant moyen</p>
+                                <p className="text-sm font-medium text-gray-600">{t('parametres.fee_structures.stat_average')}</p>
                                 <p className="text-2xl font-bold text-emerald-700">{formatMoney(stats.amount_avg)}</p>
                             </div>
                         </div>
@@ -252,7 +254,7 @@ export default function Index({ feeStructures, academicYears, feeCategories, cla
                                 <School className="h-6 w-6 text-amber-600" />
                             </div>
                             <div>
-                                <p className="text-sm font-medium text-gray-600">Classes couvertes</p>
+                                <p className="text-sm font-medium text-gray-600">{t('parametres.fee_structures.stat_classes')}</p>
                                 <p className="text-2xl font-bold text-amber-700">{stats.classes_covered}</p>
                             </div>
                         </div>
@@ -263,7 +265,7 @@ export default function Index({ feeStructures, academicYears, feeCategories, cla
                                 <Layers className="h-6 w-6 text-violet-600" />
                             </div>
                             <div>
-                                <p className="text-sm font-medium text-gray-600">Catégories couvertes</p>
+                                <p className="text-sm font-medium text-gray-600">{t('parametres.fee_structures.stat_categories')}</p>
                                 <p className="text-2xl font-bold text-violet-700">{stats.categories_covered}</p>
                             </div>
                         </div>
@@ -274,9 +276,9 @@ export default function Index({ feeStructures, academicYears, feeCategories, cla
                                 <TrendingUp className="h-6 w-6 text-rose-600" />
                             </div>
                             <div>
-                                <p className="text-sm font-medium text-gray-600">Écart min/max</p>
+                                <p className="text-sm font-medium text-gray-600">{t('parametres.fee_structures.stat_gap')}</p>
                                 <p className="text-2xl font-bold text-rose-700">{formatMoney(stats.amount_range)}</p>
-                                <p className="text-xs text-gray-500">Min {formatMoney(stats.amount_min)} | Max {formatMoney(stats.amount_max)}</p>
+                                <p className="text-xs text-gray-500">{t('parametres.fee_structures.stat_gap_detail', { min: formatMoney(stats.amount_min), max: formatMoney(stats.amount_max) })}</p>
                             </div>
                         </div>
                     </div>
@@ -289,7 +291,7 @@ export default function Index({ feeStructures, academicYears, feeCategories, cla
                             <Search className="absolute left-3 top-1/2 -translate-y-1/2 h-5 w-5 text-gray-400" />
                             <Input
                                 type="text"
-                                placeholder="Rechercher par catégorie, classe ou année..."
+                                placeholder={t('parametres.fee_structures.search_ph')}
                                 value={searchQuery}
                                 onChange={(e) => setSearchQuery(e.target.value)}
                                 onKeyDown={handleKeyPress}
@@ -298,21 +300,21 @@ export default function Index({ feeStructures, academicYears, feeCategories, cla
                         </div>
                         <Select value={academicYearId} onValueChange={setAcademicYearId}>
                             <SelectTrigger className="border-slate-200">
-                                <SelectValue placeholder="Année académique" />
+                                <SelectValue placeholder={t('parametres.fee_structures.filter_year')} />
                             </SelectTrigger>
                             <SelectContent>
-                                <SelectItem value="all">Toutes les années</SelectItem>
+                                <SelectItem value="all">{t('parametres.fee_structures.filter_all_years')}</SelectItem>
                                 {academicYears.map((year) => (
-                                    <SelectItem key={year.id} value={year.id}>{year.year}{year.active ? ' (active)' : ''}</SelectItem>
+                                    <SelectItem key={year.id} value={year.id}>{year.year}{year.active ? t('parametres.fee_structures.active_suffix') : ''}</SelectItem>
                                 ))}
                             </SelectContent>
                         </Select>
                         <Select value={feeCategoryId} onValueChange={setFeeCategoryId}>
                             <SelectTrigger className="border-slate-200">
-                                <SelectValue placeholder="Catégorie" />
+                                <SelectValue placeholder={t('parametres.fee_structures.filter_category')} />
                             </SelectTrigger>
                             <SelectContent>
-                                <SelectItem value="all">Toutes les catégories</SelectItem>
+                                <SelectItem value="all">{t('parametres.fee_structures.filter_all_categories')}</SelectItem>
                                 {feeCategories.map((category) => (
                                     <SelectItem key={category.id} value={category.id}>{category.name}</SelectItem>
                                 ))}
@@ -320,10 +322,10 @@ export default function Index({ feeStructures, academicYears, feeCategories, cla
                         </Select>
                         <Select value={classId} onValueChange={setClassId}>
                             <SelectTrigger className="border-slate-200">
-                                <SelectValue placeholder="Classe" />
+                                <SelectValue placeholder={t('parametres.fee_structures.filter_class')} />
                             </SelectTrigger>
                             <SelectContent>
-                                <SelectItem value="all">Toutes les classes</SelectItem>
+                                <SelectItem value="all">{t('parametres.fee_structures.filter_all_classes')}</SelectItem>
                                 {classrooms.map((classroom) => (
                                     <SelectItem key={classroom.id} value={classroom.id}>{classroom.name} ({classroom.code})</SelectItem>
                                 ))}
@@ -332,7 +334,7 @@ export default function Index({ feeStructures, academicYears, feeCategories, cla
                         <Input
                             type="number"
                             min="0"
-                            placeholder="Montant min"
+                            placeholder={t('parametres.fee_structures.filter_amount_min')}
                             value={minAmount}
                             onChange={(e) => setMinAmount(e.target.value)}
                             className="border-slate-200"
@@ -340,7 +342,7 @@ export default function Index({ feeStructures, academicYears, feeCategories, cla
                         <Input
                             type="number"
                             min="0"
-                            placeholder="Montant max"
+                            placeholder={t('parametres.fee_structures.filter_amount_max')}
                             value={maxAmount}
                             onChange={(e) => setMaxAmount(e.target.value)}
                             className="border-slate-200"
@@ -352,7 +354,7 @@ export default function Index({ feeStructures, academicYears, feeCategories, cla
                             className="bg-blue-600 hover:bg-blue-700"
                         >
                             <Search className="h-4 w-4 mr-2" />
-                            Rechercher
+                            {t('parametres.fee_structures.search')}
                         </Button>
                         <Button
                             variant="outline"
@@ -360,10 +362,10 @@ export default function Index({ feeStructures, academicYears, feeCategories, cla
                             className="border-slate-200"
                         >
                             <X className="h-4 w-4 mr-2" />
-                            Réinitialiser
+                            {t('parametres.fee_structures.reset')}
                         </Button>
                         <div className="text-sm text-gray-600 self-center">
-                            {stats.count} structure(s) filtrée(s) | Max: {formatMoney(stats.amount_max)}
+                            {t('parametres.fee_structures.filtered_count', { count: stats.count, max: formatMoney(stats.amount_max) })}
                         </div>
                     </div>
                 </div>
@@ -374,11 +376,11 @@ export default function Index({ feeStructures, academicYears, feeCategories, cla
                     <Table>
                         <TableHeader className="bg-gray-50">
                             <TableRow className="border-b border-gray-200">
-                                <TableHead className="font-semibold text-gray-900">Année académique</TableHead>
-                                <TableHead className="font-semibold text-gray-900">Catégorie</TableHead>
-                                <TableHead className="font-semibold text-gray-900">Classe</TableHead>
-                                <TableHead className="font-semibold text-gray-900">Montant</TableHead>
-                                <TableHead className="font-semibold text-gray-900 text-center">Actions</TableHead>
+                                <TableHead className="font-semibold text-gray-900">{t('parametres.fee_structures.col_year')}</TableHead>
+                                <TableHead className="font-semibold text-gray-900">{t('parametres.fee_structures.col_category')}</TableHead>
+                                <TableHead className="font-semibold text-gray-900">{t('parametres.fee_structures.col_class')}</TableHead>
+                                <TableHead className="font-semibold text-gray-900">{t('parametres.fee_structures.col_amount')}</TableHead>
+                                <TableHead className="font-semibold text-gray-900 text-center">{t('parametres.fee_structures.col_actions')}</TableHead>
                             </TableRow>
                         </TableHeader>
                         <TableBody>
@@ -387,7 +389,7 @@ export default function Index({ feeStructures, academicYears, feeCategories, cla
                                     <TableCell colSpan={5} className="text-center py-12 text-gray-500">
                                         <div className="flex flex-col items-center gap-2">
                                             <DollarSign className="w-12 h-12 text-gray-300" />
-                                            <p className="text-lg">Aucune structure de frais trouvée</p>
+                                            <p className="text-lg">{t('parametres.fee_structures.empty')}</p>
                                         </div>
                                     </TableCell>
                                 </TableRow>
@@ -456,7 +458,7 @@ export default function Index({ feeStructures, academicYears, feeCategories, cla
                     {feeStructures.last_page > 1 && (
                         <div className="flex items-center justify-between border-t border-gray-100 bg-white px-6 py-4">
                             <div className="text-sm text-gray-600">
-                                Affichage de {feeStructures.from} à {feeStructures.to} sur {feeStructures.total} résultats
+                                {t('parametres.fee_structures.pagination', { from: feeStructures.from, to: feeStructures.to, total: feeStructures.total })}
                             </div>
                             <div className="flex gap-2">
                                 <Button
@@ -493,19 +495,19 @@ export default function Index({ feeStructures, academicYears, feeCategories, cla
             <AlertDialog open={!!deleteConfirm} onOpenChange={() => setDeleteConfirm(null)}>
                 <AlertDialogContent>
                     <AlertDialogHeader>
-                        <AlertDialogTitle>Confirmer la suppression</AlertDialogTitle>
+                        <AlertDialogTitle>{t('parametres.fee_structures.delete_title')}</AlertDialogTitle>
                         <AlertDialogDescription>
-                            Êtes-vous sûr de vouloir supprimer cette structure de frais ? Cette action est irréversible.
+                            {t('parametres.fee_structures.delete_desc')}
                         </AlertDialogDescription>
                     </AlertDialogHeader>
                     <div className="flex justify-end gap-3">
-                        <AlertDialogCancel disabled={isDeleting}>Annuler</AlertDialogCancel>
+                        <AlertDialogCancel disabled={isDeleting}>{t('parametres.fee_structures.cancel')}</AlertDialogCancel>
                         <AlertDialogAction
                             onClick={() => deleteConfirm && handleDelete(deleteConfirm)}
                             disabled={isDeleting}
                             className="bg-red-600 hover:bg-red-700"
                         >
-                            {isDeleting ? 'Suppression...' : 'Supprimer'}
+                            {isDeleting ? t('parametres.fee_structures.deleting') : t('parametres.fee_structures.delete')}
                         </AlertDialogAction>
                     </div>
                 </AlertDialogContent>
@@ -515,24 +517,23 @@ export default function Index({ feeStructures, academicYears, feeCategories, cla
             <Dialog open={replicateOpen} onOpenChange={setReplicateOpen}>
                 <DialogContent>
                     <DialogHeader>
-                        <DialogTitle>Répliquer les structures de frais</DialogTitle>
+                        <DialogTitle>{t('parametres.fee_structures.replicate_title')}</DialogTitle>
                         <DialogDescription>
-                            Copie toutes les structures (et leurs tranches) d'une année vers l'année active.
-                            Les combinaisons catégorie / classe déjà présentes sont ignorées.
+                            {t('parametres.fee_structures.replicate_desc')}
                         </DialogDescription>
                     </DialogHeader>
 
                     {activeYear ? (
                         <div className="space-y-4 py-2">
                             <div className="rounded-lg bg-indigo-50 ring-1 ring-indigo-100 p-3 text-sm">
-                                <span className="text-gray-600">Année cible (active) :</span>
+                                <span className="text-gray-600">{t('parametres.fee_structures.replicate_target')}</span>
                                 <span className="font-semibold text-indigo-700 ml-2">{activeYear.year}</span>
                             </div>
                             <div className="space-y-2">
-                                <label className="text-sm font-medium text-gray-700">Année source *</label>
+                                <label className="text-sm font-medium text-gray-700">{t('parametres.fee_structures.replicate_source')}</label>
                                 <Select value={sourceYearId} onValueChange={setSourceYearId}>
                                     <SelectTrigger>
-                                        <SelectValue placeholder="Choisir l'année à copier" />
+                                        <SelectValue placeholder={t('parametres.fee_structures.replicate_source_ph')} />
                                     </SelectTrigger>
                                     <SelectContent>
                                         {academicYears.filter((y) => y.id !== activeYear.id).map((y) => (
@@ -542,20 +543,20 @@ export default function Index({ feeStructures, academicYears, feeCategories, cla
                                 </Select>
                             </div>
                             <div className="flex justify-end gap-2 pt-2">
-                                <Button variant="outline" onClick={() => setReplicateOpen(false)}>Annuler</Button>
+                                <Button variant="outline" onClick={() => setReplicateOpen(false)}>{t('parametres.fee_structures.cancel')}</Button>
                                 <Button
                                     onClick={handleReplicate}
                                     disabled={!sourceYearId || replicating}
                                     className="bg-indigo-600 hover:bg-indigo-700"
                                 >
                                     <Copy className="h-4 w-4 mr-2" />
-                                    {replicating ? 'Réplication...' : 'Répliquer'}
+                                    {replicating ? t('parametres.fee_structures.replicating') : t('parametres.fee_structures.replicate')}
                                 </Button>
                             </div>
                         </div>
                     ) : (
                         <p className="text-sm text-red-600 py-4">
-                            Aucune année académique active. Activez une année avant de répliquer.
+                            {t('parametres.fee_structures.replicate_no_active')}
                         </p>
                     )}
                 </DialogContent>
diff --git a/resources/js/pages/Parametres/FeeStructures/Show.tsx b/resources/js/pages/Parametres/FeeStructures/Show.tsx
index 4e76b689..2127cbd9 100644
--- a/resources/js/pages/Parametres/FeeStructures/Show.tsx
+++ b/resources/js/pages/Parametres/FeeStructures/Show.tsx
@@ -20,6 +20,7 @@ import {
     DialogTitle,
 } from '@/components/ui/dialog';
 import { route } from '@/helpers/route';
+import { useTranslation } from '@/helpers/i18n';
 import AppLayout from '@/layouts/app-layout';
 
 interface AcademicYear {
@@ -65,6 +66,8 @@ interface ShowProps {
 const uid = () => (typeof crypto !== 'undefined' && crypto.randomUUID ? crypto.randomUUID() : Math.random().toString(36).slice(2));
 
 export default function Show({ feeStructure }: Readonly<ShowProps>) {
+    const { t, locale } = useTranslation();
+    const dateLocale = locale === 'en' ? 'en-GB' : 'fr-FR';
     const [deleteConfirm, setDeleteConfirm] = useState(false);
     const [isDeleting, setIsDeleting] = useState(false);
     const [installmentsModal, setInstallmentsModal] = useState(false);
@@ -92,7 +95,7 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
         }, 0);
 
         if (newTotal > feeStructure.amount) {
-            setInstallmentsError(`Le total des tranches (${formatMoney(newTotal)}) dépasse le montant de la structure (${formatMoney(feeStructure.amount)})`);
+            setInstallmentsError(t('parametres.fee_structures.total_exceeds', { total: formatMoney(newTotal), amount: formatMoney(feeStructure.amount) }));
         } else {
             setInstallmentsError('');
         }
@@ -109,7 +112,7 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
         }, 0);
 
         if (newTotal > feeStructure.amount) {
-            setInstallmentsError(`Le total des tranches (${formatMoney(newTotal)}) dépasse le montant de la structure (${formatMoney(feeStructure.amount)})`);
+            setInstallmentsError(t('parametres.fee_structures.total_exceeds', { total: formatMoney(newTotal), amount: formatMoney(feeStructure.amount) }));
         } else {
             setInstallmentsError('');
         }
@@ -127,7 +130,7 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
         }, 0);
 
         if (newTotal > feeStructure.amount) {
-            setInstallmentsError(`Le total des tranches (${formatMoney(newTotal)}) dépasse le montant de la structure (${formatMoney(feeStructure.amount)})`);
+            setInstallmentsError(t('parametres.fee_structures.total_exceeds', { total: formatMoney(newTotal), amount: formatMoney(feeStructure.amount) }));
         } else {
             setInstallmentsError('');
         }
@@ -164,7 +167,7 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
 
     return (
         <AppLayout>
-            <Head title="Détails de la structure de frais" />
+            <Head title={t('parametres.fee_structures.show_head')} />
 
             <div className="space-y-6">
                 {/* Header */}
@@ -177,7 +180,7 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                             className="text-gray-600 hover:text-gray-900"
                         >
                             <ArrowLeft className="h-4 w-4 mr-2" />
-                            Retour
+                            {t('parametres.fee_structures.back')}
                         </Button>
                     </div>
                     <div className="flex gap-3">
@@ -200,7 +203,7 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                             className="border-blue-300 text-blue-600 hover:bg-blue-50"
                         >
                             <Layers className="h-4 w-4 mr-2" />
-                            Gérer les tranches
+                            {t('parametres.fee_structures.manage_installments')}
                         </Button>
                         <Button
                             variant="outline"
@@ -208,7 +211,7 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                             className="border-slate-200"
                         >
                             <Pencil className="h-4 w-4 mr-2" />
-                            Modifier
+                            {t('parametres.fee_structures.edit')}
                         </Button>
                         <Button
                             variant="outline"
@@ -216,7 +219,7 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                             className="border-red-300 text-red-600 hover:bg-red-50"
                         >
                             <Trash2 className="h-4 w-4 mr-2" />
-                            Supprimer
+                            {t('parametres.fee_structures.delete')}
                         </Button>
                     </div>
                 </div>
@@ -228,7 +231,7 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                         </div>
                         <div>
                             <h1 className="text-4xl font-bold tracking-tight text-gray-900">
-                                Structure de frais
+                                {t('parametres.fee_structures.show_heading')}
                             </h1>
                             <p className="text-lg text-gray-600 mt-1">
                                 {feeStructure.fee_category.name} - {feeStructure.classroom.name}
@@ -238,10 +241,10 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                     <div className="bg-linear-to-r from-blue-600 to-indigo-600 rounded-xl p-6 text-white">
                         <div className="flex items-center justify-between">
                             <div>
-                                <p className="text-blue-100 text-sm font-medium">Montant total</p>
+                                <p className="text-blue-100 text-sm font-medium">{t('parametres.fee_structures.show_amount_total')}</p>
                                 <p className="text-3xl font-bold">{formatMoney(feeStructure.amount)}</p>
                                 <p className="text-blue-100 text-sm mt-1">
-                                    {feeStructure.academic_year.year} • {feeStructure.installments?.length || 0} tranche(s)
+                                    {feeStructure.academic_year.year} • {t('parametres.fee_structures.installments_count', { count: feeStructure.installments?.length || 0 })}
                                 </p>
                             </div>
                             <div className="text-right">
@@ -262,20 +265,20 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                             <div className="p-2 bg-blue-100 rounded-lg">
                                 <BookOpen className="h-5 w-5 text-blue-600" />
                             </div>
-                            <h3 className="text-lg font-semibold text-blue-900">Informations générales</h3>
+                            <h3 className="text-lg font-semibold text-blue-900">{t('parametres.fee_structures.show_general')}</h3>
                         </div>
                         <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
                             <div className="bg-white/60 rounded-lg p-4">
                                 <div className="flex items-center gap-2 mb-2">
                                     <Calendar className="h-4 w-4 text-blue-600" />
-                                    <div className="text-sm font-medium text-blue-800">Année académique</div>
+                                    <div className="text-sm font-medium text-blue-800">{t('parametres.fee_structures.show_year')}</div>
                                 </div>
                                 <p className="text-lg font-semibold text-gray-900">{feeStructure.academic_year.year}</p>
                             </div>
                             <div className="bg-white/60 rounded-lg p-4">
                                 <div className="flex items-center gap-2 mb-2">
                                     <DollarSign className="h-4 w-4 text-blue-600" />
-                                    <div className="text-sm font-medium text-blue-800">Catégorie de frais</div>
+                                    <div className="text-sm font-medium text-blue-800">{t('parametres.fee_structures.show_category')}</div>
                                 </div>
                                 <span className={`inline-flex items-center gap-2 px-3 py-1.5 rounded-full text-sm font-medium ${getCategoryColor(feeStructure.fee_category.name)}`}>
                                     <DollarSign className="h-3.5 w-3.5" />
@@ -286,10 +289,10 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                         <div className="mt-4 bg-white/60 rounded-lg p-4">
                             <div className="flex items-center gap-2 mb-2">
                                 <Users className="h-4 w-4 text-blue-600" />
-                                <div className="text-sm font-medium text-blue-800">Classe concernée</div>
+                                <div className="text-sm font-medium text-blue-800">{t('parametres.fee_structures.show_class')}</div>
                             </div>
                             <p className="text-lg font-semibold text-gray-900">{feeStructure.classroom.name}</p>
-                            <p className="text-sm text-gray-600 mt-1">Code: <span className="font-medium">{feeStructure.classroom.code}</span></p>
+                            <p className="text-sm text-gray-600 mt-1">{t('parametres.fee_structures.show_code')}: <span className="font-medium">{feeStructure.classroom.code}</span></p>
                         </div>
                     </div>
 
@@ -299,18 +302,18 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                             <div className="p-2 bg-green-100 rounded-lg">
                                 <CreditCard className="h-5 w-5 text-green-600" />
                             </div>
-                            <h3 className="text-lg font-semibold text-green-900">Montant et tranches</h3>
+                            <h3 className="text-lg font-semibold text-green-900">{t('parametres.fee_structures.show_amount_section')}</h3>
                         </div>
                         <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
                             <div className="bg-white/60 rounded-lg p-4">
-                                <div className="text-sm font-medium text-green-800 mb-2">Montant total</div>
+                                <div className="text-sm font-medium text-green-800 mb-2">{t('parametres.fee_structures.show_amount_total')}</div>
                                 <p className="text-3xl font-bold text-green-600">{formatMoney(feeStructure.amount)}</p>
                             </div>
                             <div className="bg-white/60 rounded-lg p-4">
                                 <div className="flex items-center justify-between mb-3">
                                     <div className="flex items-center gap-2">
                                         <Layers className="h-4 w-4 text-green-600" />
-                                        <div className="text-sm font-medium text-green-800">Tranches</div>
+                                        <div className="text-sm font-medium text-green-800">{t('parametres.fee_structures.installments')}</div>
                                     </div>
                                     <Button
                                         variant="outline"
@@ -332,7 +335,7 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                                         className="border-green-300 text-green-600 hover:bg-green-50"
                                     >
                                         <Layers className="h-4 w-4 mr-2" />
-                                        Gérer
+                                        {t('parametres.fee_structures.manage')}
                                     </Button>
                                 </div>
                                 {feeStructure.installments && feeStructure.installments.length > 0 ? (
@@ -343,14 +346,14 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                                             <div key={installment.id} className="flex items-center justify-between p-3 bg-green-50 rounded-lg border border-green-200">
                                                 <div>
                                                     <p className="font-medium text-gray-900">{installment.name}</p>
-                                                    <p className="text-xs text-gray-600">Tranche {installment.installment_number}</p>
+                                                    <p className="text-xs text-gray-600">{t('parametres.fee_structures.installment_num', { num: installment.installment_number })}</p>
                                                 </div>
                                                 <p className="font-semibold text-green-700">{formatMoney(installment.amount)}</p>
                                             </div>
                                         ))}
                                     </div>
                                 ) : (
-                                    <p className="text-gray-500 text-sm">Aucune tranche définie</p>
+                                    <p className="text-gray-500 text-sm">{t('parametres.fee_structures.no_installments')}</p>
                                 )}
                             </div>
                         </div>
@@ -362,13 +365,13 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                             <div className="p-2 bg-gray-100 rounded-lg">
                                 <Clock className="h-5 w-5 text-gray-600" />
                             </div>
-                            <h3 className="text-lg font-semibold text-gray-900">Informations système</h3>
+                            <h3 className="text-lg font-semibold text-gray-900">{t('parametres.fee_structures.show_system')}</h3>
                         </div>
                         <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
                             <div className="bg-white/60 rounded-lg p-4">
-                                <div className="text-sm font-medium text-gray-700 mb-2">Créée le</div>
+                                <div className="text-sm font-medium text-gray-700 mb-2">{t('parametres.fee_structures.show_created_on')}</div>
                                 <p className="text-sm text-gray-900">
-                                    {new Date(feeStructure.created_at).toLocaleDateString('fr-FR', {
+                                    {new Date(feeStructure.created_at).toLocaleDateString(dateLocale, {
                                         year: 'numeric',
                                         month: 'long',
                                         day: 'numeric',
@@ -378,9 +381,9 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                                 </p>
                             </div>
                             <div className="bg-white/60 rounded-lg p-4">
-                                <div className="text-sm font-medium text-gray-700 mb-2">Dernière modification</div>
+                                <div className="text-sm font-medium text-gray-700 mb-2">{t('parametres.fee_structures.show_updated_on')}</div>
                                 <p className="text-sm text-gray-900">
-                                    {new Date(feeStructure.updated_at).toLocaleDateString('fr-FR', {
+                                    {new Date(feeStructure.updated_at).toLocaleDateString(dateLocale, {
                                         year: 'numeric',
                                         month: 'long',
                                         day: 'numeric',
@@ -391,7 +394,7 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                             </div>
                         </div>
                         <div className="mt-4 bg-white/60 rounded-lg p-4">
-                            <div className="text-sm font-medium text-gray-700 mb-2">Identifiant unique</div>
+                            <div className="text-sm font-medium text-gray-700 mb-2">{t('parametres.fee_structures.show_uid')}</div>
                             <p className="text-sm text-gray-600 font-mono bg-gray-100 px-3 py-1 rounded">{feeStructure.id}</p>
                         </div>
                     </div>
@@ -402,19 +405,19 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
             <AlertDialog open={deleteConfirm} onOpenChange={setDeleteConfirm}>
                 <AlertDialogContent>
                     <AlertDialogHeader>
-                        <AlertDialogTitle>Confirmer la suppression</AlertDialogTitle>
+                        <AlertDialogTitle>{t('parametres.fee_structures.delete_title')}</AlertDialogTitle>
                         <AlertDialogDescription>
-                            Êtes-vous sûr de vouloir supprimer cette structure de frais ? Cette action est irréversible.
+                            {t('parametres.fee_structures.delete_desc')}
                         </AlertDialogDescription>
                     </AlertDialogHeader>
                     <div className="flex justify-end gap-3">
-                        <AlertDialogCancel disabled={isDeleting}>Annuler</AlertDialogCancel>
+                        <AlertDialogCancel disabled={isDeleting}>{t('parametres.fee_structures.cancel')}</AlertDialogCancel>
                         <AlertDialogAction
                             onClick={handleDelete}
                             disabled={isDeleting}
                             className="bg-red-600 hover:bg-red-700"
                         >
-                            {isDeleting ? 'Suppression...' : 'Supprimer'}
+                            {isDeleting ? t('parametres.fee_structures.deleting') : t('parametres.fee_structures.delete')}
                         </AlertDialogAction>
                     </div>
                 </AlertDialogContent>
@@ -424,9 +427,9 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
             <Dialog open={installmentsModal} onOpenChange={setInstallmentsModal}>
                 <DialogContent className="max-w-2xl">
                     <DialogHeader>
-                        <DialogTitle>Gérer les tranches</DialogTitle>
+                        <DialogTitle>{t('parametres.fee_structures.modal_title')}</DialogTitle>
                         <DialogDescription>
-                            Ajoutez ou modifiez les tranches pour cette structure de frais.
+                            {t('parametres.fee_structures.modal_desc')}
                         </DialogDescription>
                     </DialogHeader>
 
@@ -434,15 +437,15 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                         <div className="bg-blue-50 rounded-lg p-4 ring-1 ring-blue-100">
                             <div className="flex items-center gap-2 mb-2">
                                 <CreditCard className="h-4 w-4 text-blue-600" />
-                                <span className="text-sm font-medium text-blue-800">Structure actuelle</span>
+                                <span className="text-sm font-medium text-blue-800">{t('parametres.fee_structures.current_structure')}</span>
                             </div>
                             <div className="grid grid-cols-2 gap-4 text-sm">
                                 <div>
-                                    <span className="text-gray-600">Montant total:</span>
+                                    <span className="text-gray-600">{t('parametres.fee_structures.current_total')}</span>
                                     <span className="font-semibold text-gray-900 ml-2">{formatMoney(feeStructure.amount)}</span>
                                 </div>
                                 <div>
-                                    <span className="text-gray-600">Tranches actuelles:</span>
+                                    <span className="text-gray-600">{t('parametres.fee_structures.current_installments')}</span>
                                     <span className="font-semibold text-gray-900 ml-2">{feeStructure.installments?.length || 0}</span>
                                 </div>
                             </div>
@@ -451,10 +454,10 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                         <div className="bg-green-50 rounded-lg p-4 ring-1 ring-green-100">
                             <div className="flex items-center gap-2 mb-2">
                                 <Layers className="h-4 w-4 text-green-600" />
-                                <span className="text-sm font-medium text-green-800">Total des tranches configurées</span>
+                                <span className="text-sm font-medium text-green-800">{t('parametres.fee_structures.configured_total')}</span>
                             </div>
                             <div className="flex items-center justify-between">
-                                <span className="text-sm text-gray-600">Montant total des tranches:</span>
+                                <span className="text-sm text-gray-600">{t('parametres.fee_structures.installments_total_label')}</span>
                                 <span className={`font-bold text-lg ${isTotalExceeded ? 'text-red-600' : 'text-green-600'}`}>
                                     {formatMoney(totalInstallments)}
                                 </span>
@@ -476,7 +479,7 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                                 <div key={installment.uid} className="flex gap-3 items-end">
                                     <div className="flex-1">
                                         <label htmlFor={nameId} className="block text-sm font-medium text-gray-700 mb-1">
-                                            Nom de la tranche
+                                            {t('parametres.fee_structures.installment_name')}
                                         </label>
                                         <input
                                             id={nameId}
@@ -484,12 +487,12 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                                             value={installment.name}
                                             onChange={(e) => updateInstallment(index, 'name', e.target.value)}
                                             className="w-full px-3 py-2 border border-slate-200 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-                                            placeholder="Ex: Première tranche"
+                                            placeholder={t('parametres.fee_structures.installment_name_ph')}
                                         />
                                     </div>
                                     <div className="w-24">
                                         <label htmlFor={numberId} className="block text-sm font-medium text-gray-700 mb-1">
-                                            N°
+                                            {t('parametres.fee_structures.installment_number_label')}
                                         </label>
                                         <input
                                             id={numberId}
@@ -503,7 +506,7 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                                     </div>
                                     <div className="flex-1">
                                         <label htmlFor={amountId} className="block text-sm font-medium text-gray-700 mb-1">
-                                            Montant
+                                            {t('parametres.fee_structures.installment_amount')}
                                         </label>
                                         <input
                                             id={amountId}
@@ -537,7 +540,7 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                             className="w-full border-blue-300 text-blue-600 hover:bg-blue-50"
                         >
                             <Layers className="h-4 w-4 mr-2" />
-                            Ajouter une tranche
+                            {t('parametres.fee_structures.add_installment')}
                         </Button>
                         <div className="flex justify-end gap-3 pt-4">
                             <Button
@@ -547,7 +550,7 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                                     setNewInstallments([{uid: uid(), name: '', installment_number: '1', amount: '0'}]);
                                 }}
                             >
-                                Annuler
+                                {t('parametres.fee_structures.cancel')}
                             </Button>
                             <Button
                                 onClick={() => {
@@ -558,11 +561,11 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                                         Number.parseFloat(inst.amount) > 0
                                     );
                                     if (validInstallments.length === 0) {
-                                        alert('Veuillez ajouter au moins une tranche valide.');
+                                        alert(t('parametres.fee_structures.err_valid_installment'));
                                         return;
                                     }
                                     if (isTotalExceeded) {
-                                        alert('Le total des tranches ne peut pas dépasser le montant de la structure de frais.');
+                                        alert(t('parametres.fee_structures.err_total_exceeds'));
                                         return;
                                     }
                                     router.post(route('fee-structures.installments.store-multiple', feeStructure.id), {
@@ -575,7 +578,7 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                                             setInstallmentsError('');
                                         },
                                         onError: (errs) => {
-                                            setInstallmentsError(errs.installments ?? 'Erreur lors de l\'enregistrement des tranches.');
+                                            setInstallmentsError(errs.installments ?? t('parametres.fee_structures.err_saving'));
                                         },
                                     });
                                 }}
@@ -583,7 +586,7 @@ export default function Show({ feeStructure }: Readonly<ShowProps>) {
                                 className={`bg-blue-600 hover:bg-blue-700 ${isTotalExceeded ? 'opacity-50 cursor-not-allowed' : ''}`}
                             >
                                 <Layers className="h-4 w-4 mr-2" />
-                                Enregistrer les tranches
+                                {t('parametres.fee_structures.save_installments')}
                             </Button>
                         </div>
                     </div>