feat: appointment card colors by status, MassHealth badge, date nav controls

- Default card color: light (bg-slate-100 / dark text)
- Blue card when procedures selected, gray when claim has a number
- Status badge: green/red from appointment or patient-level MassHealth status
- Solid dot badge (removed ring), overflow-visible to prevent corner clipping
- Date nav: << < [today circle] > >> for week/day jumps

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

apps/Backend/src/storage/appointment-procedures-storage.ts

@@ -37,6 +37,7 @@ export interface IAppointmentProceduresStorage {
   ): Promise<AppointmentProcedure>;
   deleteProcedure(id: number): Promise<void>;
   clearByAppointmentId(appointmentId: number): Promise<void>;
+  getAppointmentIdsWithProcedures(ids: number[]): Promise<Set<number>>;
 }
 
 export const appointmentProceduresStorage: IAppointmentProceduresStorage = {
@@ -130,4 +131,14 @@ export const appointmentProceduresStorage: IAppointmentProceduresStorage = {
       where: { appointmentId },
     });
   },
+
+  async getAppointmentIdsWithProcedures(ids: number[]): Promise<Set<number>> {
+    if (!ids.length) return new Set();
+    const rows = await db.appointmentProcedure.findMany({
+      where: { appointmentId: { in: ids } },
+      select: { appointmentId: true },
+      distinct: ["appointmentId"],
+    });
+    return new Set(rows.map((r) => r.appointmentId));
+  },
 };

apps/Backend/src/storage/claims-storage.ts

@@ -23,6 +23,7 @@ export interface IStorage {
   updateClaim(id: number, updates: UpdateClaim): Promise<Claim>;
   updateClaimStatus(id: number, status: ClaimStatus): Promise<Claim>;
   deleteClaim(id: number): Promise<void>;
+  getAppointmentIdsWithClaimNumbers(ids: number[]): Promise<Set<number>>;
 }
 
 export const claimsStorage: IStorage = {
@@ -120,4 +121,14 @@ export const claimsStorage: IStorage = {
       throw new Error(`Claim with ID ${id} not found`);
     }
   },
+
+  async getAppointmentIdsWithClaimNumbers(ids: number[]): Promise<Set<number>> {
+    if (!ids.length) return new Set();
+    const rows = await db.claim.findMany({
+      where: { appointmentId: { in: ids }, claimNumber: { not: null } },
+      select: { appointmentId: true },
+      distinct: ["appointmentId"],
+    });
+    return new Set(rows.map((r) => r.appointmentId));
+  },
 };