diff --git a/components/calendar/calendar-client.tsx b/components/calendar/calendar-client.tsx
index 9fc0f620..0d190e45 100644
--- a/components/calendar/calendar-client.tsx
+++ b/components/calendar/calendar-client.tsx
@@ -1179,17 +1179,18 @@ export function CalendarClient({ initialCalendars, userId, userProfile }: Calend
         <div className="space-y-4 py-4">
           <div className="grid gap-4 py-4">
             <div className="grid gap-2">
-              <Label htmlFor="title" className="text-base font-semibold">Titre</Label>
+              <Label htmlFor="title" className="text-base font-semibold text-gray-800">Titre</Label>
               <Input
                 id="title"
                 placeholder="Titre de l'événement"
                 value={eventForm.title}
                 onChange={(e) => setEventForm({ ...eventForm, title: e.target.value })}
+                className="bg-white text-gray-900"
               />
             </div>
 
             <div className="space-y-2">
-              <Label className="text-base font-semibold">Calendrier</Label>
+              <Label className="text-base font-semibold text-gray-800">Calendrier</Label>
               <div className="grid grid-cols-2 gap-2">
                 {calendars.map((cal) => (
                   <button
@@ -1225,7 +1226,7 @@ export function CalendarClient({ initialCalendars, userId, userProfile }: Calend
 
             <div className="grid grid-cols-2 gap-4">
               <div className="space-y-2">
-                <Label>Début</Label>
+                <Label className="text-gray-800">Début</Label>
                 <div className="flex gap-2">
                   <div className="flex-1">
                     <DatePicker
@@ -1233,9 +1234,9 @@ export function CalendarClient({ initialCalendars, userId, userProfile }: Calend
                       onChange={handleStartDateChange}
                       dateFormat="dd/MM/yyyy"
                       locale="fr"
-                      className="w-full rounded-md border border-gray-300 px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary"
+                      className="w-full rounded-md border border-gray-300 px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary bg-white text-gray-900"
                       placeholderText="Date"
-                      customInput={<Input />}
+                      customInput={<Input className="bg-white text-gray-900" />}
                     />
                   </div>
                   <DatePicker
@@ -1246,14 +1247,14 @@ export function CalendarClient({ initialCalendars, userId, userProfile }: Calend
                     timeIntervals={15}
                     timeCaption="Heure"
                     dateFormat="HH:mm"
-                    className="w-32"
-                    customInput={<Input />}
+                    className="w-32 bg-white text-gray-900"
+                    customInput={<Input className="bg-white text-gray-900" />}
                   />
                 </div>
               </div>
 
               <div className="space-y-2">
-                <Label>Fin</Label>
+                <Label className="text-gray-800">Fin</Label>
                 <div className="flex gap-2">
                   <div className="flex-1">
                     <DatePicker
@@ -1261,9 +1262,9 @@ export function CalendarClient({ initialCalendars, userId, userProfile }: Calend
                       onChange={handleEndDateChange}
                       dateFormat="dd/MM/yyyy"
                       locale="fr"
-                      className="w-full rounded-md border border-gray-300 px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary"
+                      className="w-full rounded-md border border-gray-300 px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary bg-white text-gray-900"
                       placeholderText="Date"
-                      customInput={<Input />}
+                      customInput={<Input className="bg-white text-gray-900" />}
                       minDate={getDateFromString(eventForm.start)}
                     />
                   </div>
@@ -1275,8 +1276,8 @@ export function CalendarClient({ initialCalendars, userId, userProfile }: Calend
                     timeIntervals={15}
                     timeCaption="Heure"
                     dateFormat="HH:mm"
-                    className="w-32"
-                    customInput={<Input />}
+                    className="w-32 bg-white text-gray-900"
+                    customInput={<Input className="bg-white text-gray-900" />}
                   />
                 </div>
               </div>
@@ -1291,28 +1292,30 @@ export function CalendarClient({ initialCalendars, userId, userProfile }: Calend
                 setEventForm({ ...eventForm, allDay: checked as boolean })
               }
             />
-            <Label htmlFor="allDay">Toute la journée</Label>
+            <Label htmlFor="allDay" className="text-gray-800">Toute la journée</Label>
           </div>
 
           <div className="space-y-2">
-            <Label>Lieu</Label>
+            <Label className="text-gray-800">Lieu</Label>
             <Input
               value={eventForm.location || ""}
               onChange={(e) =>
                 setEventForm({ ...eventForm, location: e.target.value })
               }
               placeholder="Ajouter un lieu"
+              className="bg-white text-gray-900"
             />
           </div>
 
           <div className="space-y-2">
-            <Label>Description</Label>
+            <Label className="text-gray-800">Description</Label>
             <Textarea
               value={eventForm.description || ""}
               onChange={(e) =>
                 setEventForm({ ...eventForm, description: e.target.value })
               }
               placeholder="Ajouter une description"
+              className="bg-white text-gray-900"
             />
           </div>
         </div>