feat(auth): sync UI styles across reset pages and resolve merge conflicts

Author: Rohanrathod7

LocalMind-Frontend/src/app/routes/AppRoutes.tsx

@@ -2,10 +2,7 @@ import React from 'react'
 import { Route, Routes } from 'react-router-dom'
 import HomePage from '../../features/Dashboard/V1/Component/Pages/HomePage'
 import SignUp from '../../features/Auth/SignUp'
-<<<<<<< HEAD
 import LoginPage from '../../shared/component/v1/LoginPage'
-=======
->>>>>>> 04466fa (feat: implement password reset system with mock email for development)
 import ForgotPassword from '../../features/Auth/ForgotPassword'
 import ResetPassword from '../../features/Auth/ResetPassword'
 
@@ -17,10 +14,7 @@ const AppRoutes: React.FC = () => {
 
       {/* Auth Pages */}
       <Route path="/signup" element={<SignUp />} />
-<<<<<<< HEAD
       <Route path="/login" element={<LoginPage />} />
-=======
->>>>>>> 04466fa (feat: implement password reset system with mock email for development)
       <Route path="/forgot-password" element={<ForgotPassword />} />
       <Route path="/reset-password/:token" element={<ResetPassword />} />
 

LocalMind-Frontend/src/features/Auth/ForgotPassword.tsx

@@ -46,7 +46,7 @@ export default function ForgotPassword() {
   `
 
   return (
-    <div className="min-h-screen bg-[#292828] flex flex-col items-center justify-center p-3 sm:p-4 md:p-6">
+    <div className="min-h-screen bg-[#292828] flex flex-col items-center justify-center p-3 sm:p-4 md:p-6 pt-14 sm:pt-16 md:pt-20">
       <style>{glowStyles}</style>
 
       {/* Card Container */}
@@ -73,7 +73,7 @@ export default function ForgotPassword() {
           )}
 
           <form onSubmit={handleSubmit} className="space-y-4">
-            <div className="flex flex-col gap-1.5">
+            <div className="flex flex-col gap-1.5 relative mb-6">
               <label className="text-gray-200 text-xs sm:text-sm font-semibold">
                 Email Address
               </label>
@@ -90,7 +90,7 @@ export default function ForgotPassword() {
             <button
               type="submit"
               disabled={loading}
-              className="w-full bg-gray-400 hover:bg-gray-500 text-black font-bold py-2.5 text-sm sm:text-base rounded-lg transition-colors duration-200 mt-6 sm:mt-7 md:mt-8 flex items-center justify-center gap-2"
+              className="w-full bg-white hover:bg-gray-200 text-black font-bold py-2.5 text-sm sm:text-base rounded-lg transition-colors duration-200 mt-2 flex items-center justify-center gap-2"
             >
               {loading && (
                 <svg className="animate-spin h-5 w-5" fill="none" viewBox="0 0 24 24">

LocalMind-Frontend/src/features/Auth/ResetPassword.tsx

@@ -130,7 +130,7 @@ export default function ResetPassword() {
   }
 
   return (
-    <div className="min-h-screen bg-[#292828] flex flex-col items-center justify-center p-3 sm:p-4 md:p-6">
+    <div className="min-h-screen bg-[#292828] flex flex-col items-center justify-center p-3 sm:p-4 md:p-6 pt-14 sm:pt-16 md:pt-20">
       <style>{glowStyles}</style>
 
       {/* Card Container */}
@@ -151,8 +151,8 @@ export default function ResetPassword() {
             </div>
           )}
 
-          <form onSubmit={handleSubmit} className="space-y-4">
-            <div className="flex flex-col gap-1.5">
+          <form onSubmit={handleSubmit} className="space-y-6">
+            <div className="flex flex-col gap-1.5 relative">
               <label className="text-gray-200 text-xs sm:text-sm font-semibold">New Password</label>
               <div className="relative">
                 <input
@@ -209,10 +209,14 @@ export default function ResetPassword() {
                   )}
                 </button>
               </div>
-              {errors.password && <span className="text-xs text-red-400">{errors.password}</span>}
+              {errors.password && (
+                <span className="text-xs text-red-400 absolute -bottom-5 left-0">
+                  {errors.password}
+                </span>
+              )}
             </div>
 
-            <div className="flex flex-col gap-1.5">
+            <div className="flex flex-col gap-1.5 relative">
               <label className="text-gray-200 text-xs sm:text-sm font-semibold">
                 Confirm Password
               </label>
@@ -272,14 +276,16 @@ export default function ResetPassword() {
                 </button>
               </div>
               {errors.confirmPassword && (
-                <span className="text-xs text-red-400">{errors.confirmPassword}</span>
+                <span className="text-xs text-red-400 absolute -bottom-5 left-0">
+                  {errors.confirmPassword}
+                </span>
               )}
             </div>
 
             <button
               type="submit"
               disabled={loading}
-              className="w-full bg-gray-400 hover:bg-gray-500 text-black font-bold py-2.5 text-sm sm:text-base rounded-lg transition-colors duration-200 mt-6 sm:mt-7 md:mt-8 flex items-center justify-center gap-2"
+              className="w-full bg-white hover:bg-gray-200 text-black font-bold py-2.5 text-sm sm:text-base rounded-lg transition-colors duration-200 mt-6 sm:mt-7 md:mt-8 flex items-center justify-center gap-2"
             >
               {loading && (
                 <svg className="animate-spin h-5 w-5" fill="none" viewBox="0 0 24 24">