feat: enhance Calendar component legend styling

- Updated the legend in the Calendar component for improved visual clarity.
- Adjusted spacing, added borders, and modified item sizes for better alignment and readability.
- Ensured consistent text styling for legend items.

src/components/ui/Calendar.tsx

@@ -204,14 +204,18 @@ export function Calendar({
 
       {/* Légende */}
       {showLegend && (
-        <div className="mt-4 text-xs text-[var(--muted-foreground)] space-y-1">
-          <div className="flex items-center gap-2">
-            <div className="w-2 h-2 rounded-full bg-[var(--primary)]"></div>
-            <span>Jour avec des éléments</span>
+        <div className="mt-4 pt-3 border-t border-[var(--border)]/30 text-xs text-[var(--muted-foreground)] space-y-1.5">
+          <div className="flex items-center gap-3">
+            <div className="w-8 flex justify-center">
+              <div className="w-2 h-2 rounded-full bg-[var(--primary)]"></div>
+            </div>
+            <span className="text-xs text-left flex-1">Jour avec des éléments</span>
           </div>
-          <div className="flex items-center gap-2">
-            <div className="w-4 h-4 rounded border border-[var(--primary)] bg-[var(--primary)]/20"></div>
-            <span>Aujourd&apos;hui</span>
+          <div className="flex items-center gap-3">
+            <div className="w-8 flex justify-center">
+              <div className="w-3 h-3 rounded border border-[var(--primary)] bg-[var(--primary)]/20"></div>
+            </div>
+            <span className="text-xs text-left flex-1">Aujourd&apos;hui</span>
           </div>
         </div>
       )}