feat: add reusable PasswordInput with show/hide toggle

Replaces all type="password" inputs site-wide with a PasswordInput
component that includes an eye icon toggle for visibility.

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

frontend/src/pages/ChangePasswordPage.tsx

@@ -3,6 +3,7 @@ import { useNavigate } from 'react-router-dom'
 import { useAuthStore } from '@/store/authStore'
 import { authApi } from '@/api/auth'
 import { toast } from '@/lib/toast'
+import { PasswordInput } from '@/components/common/PasswordInput'
 import { BrandLogo } from '@/components/common/BrandLogo'
 import { cn } from '@/lib/utils'
 
@@ -87,9 +88,8 @@ export function ChangePasswordPage() {
               <label htmlFor="current-password" className="mb-1 block text-sm font-medium text-white">
                 Current Password
               </label>
-              <input
+              <PasswordInput
                 id="current-password"
-                type="password"
                 autoComplete="current-password"
                 required
                 value={currentPassword}
@@ -107,9 +107,8 @@ export function ChangePasswordPage() {
               <label htmlFor="new-password" className="mb-1 block text-sm font-medium text-white">
                 New Password
               </label>
-              <input
+              <PasswordInput
                 id="new-password"
-                type="password"
                 autoComplete="new-password"
                 required
                 value={newPassword}
@@ -131,9 +130,8 @@ export function ChangePasswordPage() {
               <label htmlFor="confirm-password" className="mb-1 block text-sm font-medium text-white">
                 Confirm New Password
               </label>
-              <input
+              <PasswordInput
                 id="confirm-password"
-                type="password"
                 autoComplete="new-password"
                 required
                 value={confirmPassword}