Make weekend days in the calendar display with a light gray background

Adds weekend highlighting to the calendar component by applying a light gray background to Saturdays and Sundays.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: cc2d271b-82f0-4d6a-9302-a0b067ffb429
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/1957c339-2757-4d1f-8e92-e9f71a1ce58e/cc2d271b-82f0-4d6a-9302-a0b067ffb429/AvJXlQr

client/src/components/ui/calendar.tsx

@@ -13,10 +13,24 @@ function Calendar({
   showOutsideDays = true,
   ...props
 }: CalendarProps) {
+  // Définir le modificateur pour les weekends (samedi = 6, dimanche = 0)
+  const isWeekend = (date: Date) => {
+    const day = date.getDay();
+    return day === 0 || day === 6; // Dimanche ou Samedi
+  };
+
   return (
     <DayPicker
       showOutsideDays={showOutsideDays}
       className={cn("p-3", className)}
+      modifiers={{
+        weekend: isWeekend,
+        ...props.modifiers,
+      }}
+      modifiersClassNames={{
+        weekend: "bg-gray-100 dark:bg-gray-800",
+        ...props.modifiersClassNames,
+      }}
       classNames={{
         months: "flex flex-col sm:flex-row space-y-4 sm:space-x-4 sm:space-y-0",
         month: "space-y-4",