From 7bbc0b3c5ea9e6fcbca3ed4790c7fd4d58694e7b Mon Sep 17 00:00:00 2001
From: Pratham Yadav <iiprathamyadav@gmail.com>
Date: Wed, 9 Sep 2026 16:30:40 +0530
Subject: [PATCH 1/3] fix: add visible borders in high contrast sign-in

---
 frontend/src/Pages/Authentication.tsx       | 2 +-
 frontend/src/Pages/Authentication/forms.tsx | 6 +++---
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/frontend/src/Pages/Authentication.tsx b/frontend/src/Pages/Authentication.tsx
index eb117cfa..ab924e39 100644
--- a/frontend/src/Pages/Authentication.tsx
+++ b/frontend/src/Pages/Authentication.tsx
@@ -63,7 +63,7 @@ const RightSection: React.FC<RightSectionProps> = ({
       </div>
       {authMode !== 'otpVerification' && authMode !== 'resetPassword' && (
         <Button
-          className="border-black dark:border-white"
+          className="border-foreground dark:border-white"
           onClick={toggleAuthMode}
           variant="outline"
         >
diff --git a/frontend/src/Pages/Authentication/forms.tsx b/frontend/src/Pages/Authentication/forms.tsx
index 221257f9..68bc57d0 100644
--- a/frontend/src/Pages/Authentication/forms.tsx
+++ b/frontend/src/Pages/Authentication/forms.tsx
@@ -80,14 +80,14 @@ const handleGoogleLogin = useCallback(
         placeholder="name@example.com"
         value={email}
         onChange={(e) => setEmail(e.target.value)}
-        className="mb-2 dark:border-white"
+        className="mb-2 border-border dark:border-white"
       />
       <Input
         type={passwordVisible ? "text" : "password"}
         placeholder="password"
         value={password}
         onChange={(e) => setPassword(e.target.value)}
-        className="mb-1 dark:border-white"
+        className="mb-1 border-border dark:border-white"
       />
       {localError && (
         <p className="text-red-500 text-sm mt-2">
@@ -112,7 +112,7 @@ const handleGoogleLogin = useCallback(
           Reset Password
         </span>
       </p>
-      <Button type="submit" className="w-full mb-2 border dark:border-white" disabled={loading}>
+      <Button type="submit" className="w-full mb-2 border border-border dark:border-white" disabled={loading}>
         {loading ? 'Signing In...' : 'Sign In With Email'}
       </Button>
       <div id="googleSignInButton" className="w-full"></div>

From 74828fb952ca572e5629e50b0e1e99a3cb7790d1 Mon Sep 17 00:00:00 2001
From: Pratham Yadav <iiprathamyadav@gmail.com>
Date: Thu, 10 Sep 2026 22:44:45 +0530
Subject: [PATCH 2/3] fix: address maintainer feedback for sign-in and sign-up
 in high contrast theme

---
 frontend/src/Pages/Authentication/forms.tsx | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/frontend/src/Pages/Authentication/forms.tsx b/frontend/src/Pages/Authentication/forms.tsx
index 68bc57d0..1f1a63fe 100644
--- a/frontend/src/Pages/Authentication/forms.tsx
+++ b/frontend/src/Pages/Authentication/forms.tsx
@@ -106,7 +106,7 @@ const handleGoogleLogin = useCallback(
         <div className='pl-2'>show password</div>
       </div>
       {error && <p className="text-sm text-red-500 mb-2">{error}</p>}
-      <p className="text-sm text-muted-foreground dark:text-white mb-4">
+      <p className="text-sm text-muted-foreground dark:text-white [.contrast_&]:text-white mb-4">
         Forgot your password?{' '}
         <span className="underline cursor-pointer" onClick={startForgotPassword}>
           Reset Password
@@ -191,21 +191,21 @@ export const SignUpForm: React.FC<SignUpFormProps> = ({ startOtpVerification })
         placeholder="name@example.com"
         value={email}
         onChange={(e) => setEmail(e.target.value)}
-        className="mb-2 dark:border-white"
+        className="mb-2 border-border dark:border-white"
       />
       <Input
         type={passwordVisible ? "text" : "password"}
         placeholder="password"
         value={password}
         onChange={(e) => setPassword(e.target.value)}
-        className="mb-2 dark:border-white"
+        className="mb-2 border-border dark:border-white"
       />
       <Input
         type={passwordVisible ? "text" : "password"}
         placeholder="confirm password"
         value={confirmPassword}
         onChange={(e) => setConfirmPassword(e.target.value)}
-        className="mb-4 dark:border-white"
+        className="mb-4 border-border dark:border-white"
       />
       <div className='w-full flex justify-start items-center pl-1'>
         <div className='w-4'>
@@ -313,7 +313,7 @@ export const ForgotPasswordForm: React.FC<ForgotPasswordFormProps> = ({
           value={email}
           onChange={(e) => setEmail(e.target.value)}
           placeholder="name@example.com"
-          className="w-full mb-4 dark:border-white"
+          className="w-full mb-4 border-border dark:border-white"
         />
         {error && <p className="text-sm text-red-500 mb-2">{error}</p>}
         <Button type="submit" className="w-full border dark:border-white">

From b7072ec9e906d2766405802a7e39c0bb03838daf Mon Sep 17 00:00:00 2001
From: Pratham Yadav <iiprathamyadav@gmail.com>
Date: Fri, 11 Sep 2026 00:36:02 +0530
Subject: [PATCH 3/3] fix: resolve team builder visibility issues in high
 contrast mode and Dark mode

---
 frontend/src/Pages/TeamBuilder.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/frontend/src/Pages/TeamBuilder.tsx b/frontend/src/Pages/TeamBuilder.tsx
index 3627715d..0aa400a2 100644
--- a/frontend/src/Pages/TeamBuilder.tsx
+++ b/frontend/src/Pages/TeamBuilder.tsx
@@ -375,7 +375,7 @@ const TeamBuilder: React.FC = () => {
                 value={searchCode}
                 onChange={(e) => setSearchCode(e.target.value.toUpperCase())}
                 maxLength={6}
-                className="flex-1"
+                className="flex-1 [.contrast_&]:border-border"
                 onKeyPress={(e) => e.key === "Enter" && handleJoinByCode()}
               />
               <Button
@@ -415,7 +415,7 @@ const TeamBuilder: React.FC = () => {
                   placeholder="Enter a catchy team name..."
                   value={teamName}
                   onChange={(e) => setTeamName(e.target.value)}
-                  className="flex-1"
+                  className="flex-1 [.contrast_&]:border-border"
                   onKeyPress={(e) => e.key === "Enter" && handleCreateTeam()}
                 />
                 <Button
@@ -427,7 +427,7 @@ const TeamBuilder: React.FC = () => {
                 </Button>
               </div>
               <div className="flex items-center gap-4">
-                <label className="text-sm font-medium text-gray-700">
+                <label className="text-sm font-medium text-gray-700 dark:text-white [.contrast_&]:text-white">
                   <FaUsers className="inline mr-2" />
                   Team Size
                 </label>