Checkpoint: Trois améliorations majeures pour la gestion des séquences :

✅ **1. Indicateur visuel de remplissage**
- Composant CapacityProgressBar avec barre de progression colorée
- Affichage "X / Y" avec pourcentage
- Couleurs automatiques : vert (<70%), orange (70-90%), rouge (>90%)
- Intégré dans la colonne capacité du tableau des séquences

✅ **2. Vue calendrier mensuel**
- Nouvelle page AdminCalendrier accessible depuis le menu
- Calendrier mensuel avec navigation (mois précédent/suivant, aujourd'hui)
- Affichage des séquences sur leurs dates respectives
- Dialog de détails au clic sur une séquence
- Vue complète avec toutes les informations (lieu, formateur, capacité, dates)

✅ **3. Système de rappels automatiques personnalisables**
- Tables rappels et rappelsEnvoyes créées
- Procédures tRPC complètes (list, create, update, delete)
- Page AdminRappels avec interface de gestion
- Configuration de rappels multiples (J-15, J-7, J-1, etc.)
- Templates d'emails personnalisables avec variables dynamiques
- Activation/désactivation des rappels
- Infrastructure prête pour l'envoi automatique (nécessite service de planification externe)

Ces améliorations facilitent grandement la planification et le suivi des formations.

client/src/components/CapacityProgressBar.tsx

@@ -0,0 +1,43 @@
+import { Progress } from "@/components/ui/progress";
+import { cn } from "@/lib/utils";
+
+interface CapacityProgressBarProps {
+  current: number;
+  max: number;
+  className?: string;
+}
+
+export function CapacityProgressBar({ current, max, className }: CapacityProgressBarProps) {
+  const percentage = max > 0 ? (current / max) * 100 : 0;
+  
+  // Définir la couleur en fonction du taux de remplissage
+  const getColorClass = () => {
+    if (percentage >= 90) return "bg-red-500";
+    if (percentage >= 70) return "bg-orange-500";
+    return "bg-green-500";
+  };
+  
+  const getTextColorClass = () => {
+    if (percentage >= 90) return "text-red-700";
+    if (percentage >= 70) return "text-orange-700";
+    return "text-green-700";
+  };
+
+  return (
+    <div className={cn("space-y-1", className)}>
+      <div className="flex items-center justify-between text-sm">
+        <span className={cn("font-medium", getTextColorClass())}>
+          {current} / {max}
+        </span>
+        <span className={cn("text-xs", getTextColorClass())}>
+          {Math.round(percentage)}%
+        </span>
+      </div>
+      <Progress 
+        value={percentage} 
+        className="h-2"
+        indicatorClassName={getColorClass()}
+      />
+    </div>
+  );
+}