From 3bd6a03121e4518edd7489290a304ff1f58f7df7 Mon Sep 17 00:00:00 2001
From: totregex <totoregex@gmail.com>
Date: Fri, 10 Jan 2025 23:09:38 +0530
Subject: [PATCH] set hover classes

---
 .../Patient/PatientDetailsTab/Appointments.tsx    | 15 +++++++++++----
 1 file changed, 11 insertions(+), 4 deletions(-)

diff --git a/src/components/Patient/PatientDetailsTab/Appointments.tsx b/src/components/Patient/PatientDetailsTab/Appointments.tsx
index cf1da394da3..24bd7b9017e 100644
--- a/src/components/Patient/PatientDetailsTab/Appointments.tsx
+++ b/src/components/Patient/PatientDetailsTab/Appointments.tsx
@@ -38,13 +38,20 @@ export const Appointments = (props: PatientProps) => {
 
   const getStatusBadge = (status: string) => {
     const statusColors: Record<string, string> = {
-      booked: "bg-yellow-100 text-yellow-800",
-      checked_in: "bg-green-100 text-green-800",
-      cancelled: "bg-red-100 text-red-800",
+      booked:
+        "bg-yellow-100 text-yellow-800 hover:bg-yellow-200 hover:text-yellow-900",
+      checked_in:
+        "bg-green-100 text-green-800 hover:bg-green-200 hover:text-green-900",
+      cancelled: "bg-red-100 text-red-800 hover:bg-red-200 hover:text-red-900",
     };
 
     return (
-      <Badge className={statusColors[status] || "bg-gray-100 text-gray-800"}>
+      <Badge
+        className={
+          statusColors[status] ||
+          "bg-gray-100 text-gray-800 hover:bg-gray-200 hover:text-gray-900"
+        }
+      >
         {status.replace("_", " ").toUpperCase()}
       </Badge>
     );