From e8c52dd6e8c30bd7c4a70385afb2a93d625338a2 Mon Sep 17 00:00:00 2001
From: Pratham Yadav <iiprathamyadav@gmail.com>
Date: Fri, 18 Sep 2026 00:54:18 +0530
Subject: [PATCH] fix: prevent badge hover background in high contrast

---
 frontend/src/Pages/Profile.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/Pages/Profile.tsx b/frontend/src/Pages/Profile.tsx
index 4599c31..2333889 100644
--- a/frontend/src/Pages/Profile.tsx
+++ b/frontend/src/Pages/Profile.tsx
@@ -877,7 +877,7 @@ const Profile: React.FC = () => {
                 return (
                   <div
                     key={index}
-                    className="flex flex-col items-center justify-center p-3 bg-muted rounded-lg border border-border hover:bg-accent transition-colors cursor-pointer group"
+                    className="flex flex-col items-center justify-center p-3 bg-muted rounded-lg border border-border hover:bg-accent [.contrast_&]:hover:bg-muted transition-colors cursor-pointer group"
                     title={badgeDescription}
                   >
                     <div className="mb-1 group-hover:scale-110 transition-transform">{badgeIcon}</div>