diff --git a/.Jules/palette.md b/.Jules/palette.md
index 7cb7097..0e467d8 100644
--- a/.Jules/palette.md
+++ b/.Jules/palette.md
@@ -43,6 +43,11 @@
 ## 2025-06-17 - [Dynamic Theme Feedback and Functional Branding]
 **Learning:** Converting static branding elements into functional navigation links (e.g., logo to dashboard) fulfills standard user expectations. Furthermore, synchronizing the theme toggle's icon and ARIA labels with the active theme via React state, combined with subtle CSS transitions (scale and rotation), creates a more accessible and "delightful" interaction that feels responsive to the user's current environment.
 **Action:** Always ensure branding logos are functional links and use dynamic state for theme-related UI elements to provide clear, accessible feedback.
+
+## 2025-06-18 - [Standardized Auth Visual Context and Accessibility]
+**Learning:** Adding prefix icons to authentication inputs provides immediate visual context, improving scanability. Implementing a consistent password visibility toggle across all auth forms (Login/Signup) ensures a predictable user experience. Crucially, explicitly associating labels with inputs via `id` and `htmlFor` significantly improves accessibility for screen readers and touch target size.
+**Action:** Always include relevant prefix icons in high-visibility forms and ensure strict label-input association for accessibility.
+
 ## 2025-02-03 - [Unified Loading Feedback in Buttons and Components]
 **Learning:** Moving loading logic (spinners, text, disabled state) into base components like `CustomButton` reduces boilerplate and ensures consistent UX across the app. In Spanish interfaces, using semantic icons like `check_circle` within a `valign-wrapper` in toasts provides clear, professional feedback for critical actions like saving.
 **Action:** Abstract loading states into reusable UI components and always include visual markers (icons) for status updates.
diff --git a/src/v2/pages/V2ForgotPassword.jsx b/src/v2/pages/V2ForgotPassword.jsx
index 2f6b6fa..1857d58 100644
--- a/src/v2/pages/V2ForgotPassword.jsx
+++ b/src/v2/pages/V2ForgotPassword.jsx
@@ -1,6 +1,7 @@
 import { useState } from 'react';
 import { useHistory, Link } from 'react-router-dom';
 import { alertSuccess, alertError } from '../../services/AlertService';
+import CustomPreloader from '../../components/custom/CustomPreloader';
 import '../styles/v2-theme.css';
 
 const V2ForgotPassword = () => {
@@ -48,19 +49,34 @@ const V2ForgotPassword = () => {
         {!submitted ? (
           <form onSubmit={handleResetRequest} style={{ display: 'flex', flexDirection: 'column', gap: '20px', textAlign: 'left' }}>
             <div className="v2-input-outlined">
-              <label>Correo Electrónico</label>
+              <label htmlFor="email">Correo Electrónico</label>
+              <i className="material-icons" aria-hidden="true" style={{
+                position: 'absolute', left: '12px', top: '50%', transform: 'translateY(-50%)',
+                color: 'var(--md-sys-color-outline)', marginTop: '8px'
+              }}>mail</i>
               <input
+                id="email"
                 type="email"
                 placeholder="doctor@medical.com"
                 value={email}
                 onChange={(e) => setEmail(e.target.value)}
                 required
+                style={{ paddingLeft: '48px' }}
               />
             </div>
 
             <button type="submit" className="v2-btn-filled" style={{ justifyContent: 'center', height: '56px' }} disabled={loading}>
-              {loading ? 'Procesando...' : 'Enviar Instrucciones'}
-              {!loading && <i className="material-icons">send</i>}
+              {loading ? (
+                <span className="valign-wrapper" style={{ gap: '12px' }}>
+                  <CustomPreloader size="small" />
+                  Procesando...
+                </span>
+              ) : (
+                <>
+                  Enviar Instrucciones
+                  <i className="material-icons">send</i>
+                </>
+              )}
             </button>
           </form>
         ) : (
diff --git a/src/v2/pages/V2Login.jsx b/src/v2/pages/V2Login.jsx
index 026235f..1b4a08c 100644
--- a/src/v2/pages/V2Login.jsx
+++ b/src/v2/pages/V2Login.jsx
@@ -3,6 +3,7 @@ import { useHistory, Link } from 'react-router-dom';
 import UserService from '../../services/UserService';
 import Auth from '../../modules/Auth';
 import { alertError } from '../../services/AlertService';
+import CustomPreloader from '../../components/custom/CustomPreloader';
 import '../styles/v2-theme.css';
 
 const V2Login = () => {
@@ -55,6 +56,10 @@ const V2Login = () => {
         <form onSubmit={handleLogin} style={{ display: 'flex', flexDirection: 'column', gap: '20px', textAlign: 'left' }}>
           <div className="v2-input-outlined">
             <label htmlFor="email">Correo Electrónico</label>
+            <i className="material-icons" aria-hidden="true" style={{
+              position: 'absolute', left: '12px', top: '50%', transform: 'translateY(-50%)',
+              color: 'var(--md-sys-color-outline)', marginTop: '8px'
+            }}>mail</i>
             <input
               id="email"
               type="email"
@@ -62,11 +67,16 @@ const V2Login = () => {
               value={email}
               onChange={(e) => setEmail(e.target.value)}
               required
+              style={{ paddingLeft: '48px' }}
             />
           </div>
 
           <div className="v2-input-outlined" style={{ position: 'relative' }}>
             <label htmlFor="password">Contraseña</label>
+            <i className="material-icons" aria-hidden="true" style={{
+              position: 'absolute', left: '12px', top: '50%', transform: 'translateY(-50%)',
+              color: 'var(--md-sys-color-outline)', marginTop: '8px'
+            }}>lock</i>
             <input
               id="password"
               type={showPassword ? "text" : "password"}
@@ -74,7 +84,7 @@ const V2Login = () => {
               value={password}
               onChange={(e) => setPassword(e.target.value)}
               required
-              style={{ paddingRight: '48px' }}
+              style={{ paddingLeft: '48px', paddingRight: '48px' }}
             />
             <button
               type="button"
@@ -107,8 +117,17 @@ const V2Login = () => {
           </div>
 
           <button type="submit" className="v2-btn-filled" style={{ justifyContent: 'center', height: '56px' }} disabled={loading}>
-            {loading ? 'Iniciando sesión...' : 'Entrar'}
-            {!loading && <i className="material-icons" aria-hidden="true">arrow_forward</i>}
+            {loading ? (
+              <span className="valign-wrapper" style={{ gap: '12px' }}>
+                <CustomPreloader size="small" />
+                Iniciando sesión...
+              </span>
+            ) : (
+              <>
+                Entrar
+                <i className="material-icons" aria-hidden="true">arrow_forward</i>
+              </>
+            )}
           </button>
         </form>
 
diff --git a/src/v2/pages/V2Signup.jsx b/src/v2/pages/V2Signup.jsx
index 5305544..4856f6d 100644
--- a/src/v2/pages/V2Signup.jsx
+++ b/src/v2/pages/V2Signup.jsx
@@ -3,6 +3,7 @@ import { useHistory, Link } from 'react-router-dom';
 import UserService from '../../services/UserService';
 import Auth from '../../modules/Auth';
 import { alertError } from '../../services/AlertService';
+import CustomPreloader from '../../components/custom/CustomPreloader';
 import '../styles/v2-theme.css';
 
 const V2Signup = () => {
@@ -12,6 +13,7 @@ const V2Signup = () => {
     username: '',
     password: ''
   });
+  const [showPassword, setShowPassword] = useState(false);
   const [loading, setLoading] = useState(false);
   const history = useHistory();
 
@@ -61,56 +63,111 @@ const V2Signup = () => {
 
         <form onSubmit={handleSignup} style={{ display: 'flex', flexDirection: 'column', gap: '16px', textAlign: 'left' }}>
           <div className="v2-input-outlined">
-            <label>Nombre Completo</label>
+            <label htmlFor="name">Nombre Completo</label>
+            <i className="material-icons" aria-hidden="true" style={{
+              position: 'absolute', left: '12px', top: '50%', transform: 'translateY(-50%)',
+              color: 'var(--md-sys-color-outline)', marginTop: '8px'
+            }}>person</i>
             <input
+              id="name"
               type="text"
               name="name"
               placeholder="Dr. García"
               value={formData.name}
               onChange={handleChange}
               required
+              style={{ paddingLeft: '48px' }}
             />
           </div>
 
           <div className="v2-input-outlined">
-            <label>Correo Electrónico</label>
+            <label htmlFor="email">Correo Electrónico</label>
+            <i className="material-icons" aria-hidden="true" style={{
+              position: 'absolute', left: '12px', top: '50%', transform: 'translateY(-50%)',
+              color: 'var(--md-sys-color-outline)', marginTop: '8px'
+            }}>mail</i>
             <input
+              id="email"
               type="email"
               name="email"
               placeholder="doctor@medical.com"
               value={formData.email}
               onChange={handleChange}
               required
+              style={{ paddingLeft: '48px' }}
             />
           </div>
 
           <div className="v2-input-outlined">
-            <label>Nombre de Usuario</label>
+            <label htmlFor="username">Nombre de Usuario</label>
+            <i className="material-icons" aria-hidden="true" style={{
+              position: 'absolute', left: '12px', top: '50%', transform: 'translateY(-50%)',
+              color: 'var(--md-sys-color-outline)', marginTop: '8px'
+            }}>badge</i>
             <input
+              id="username"
               type="text"
               name="username"
               placeholder="drgarcia"
               value={formData.username}
               onChange={handleChange}
               required
+              style={{ paddingLeft: '48px' }}
             />
           </div>
 
-          <div className="v2-input-outlined">
-            <label>Contraseña</label>
+          <div className="v2-input-outlined" style={{ position: 'relative' }}>
+            <label htmlFor="password">Contraseña</label>
+            <i className="material-icons" aria-hidden="true" style={{
+              position: 'absolute', left: '12px', top: '50%', transform: 'translateY(-50%)',
+              color: 'var(--md-sys-color-outline)', marginTop: '8px'
+            }}>lock</i>
             <input
-              type="password"
+              id="password"
+              type={showPassword ? "text" : "password"}
               name="password"
               placeholder="••••••••"
               value={formData.password}
               onChange={handleChange}
               required
+              style={{ paddingLeft: '48px', paddingRight: '48px' }}
             />
+            <button
+              type="button"
+              onClick={() => setShowPassword(!showPassword)}
+              aria-label={showPassword ? "Ocultar contraseña" : "Mostrar contraseña"}
+              title={showPassword ? "Ocultar contraseña" : "Mostrar contraseña"}
+              style={{
+                position: 'absolute',
+                right: '12px',
+                top: '50%',
+                transform: 'translateY(-50%)',
+                background: 'none',
+                border: 'none',
+                cursor: 'pointer',
+                color: 'var(--md-sys-color-outline)',
+                display: 'flex',
+                alignItems: 'center',
+                padding: '8px',
+                marginTop: '12px'
+              }}
+            >
+              <i className="material-icons">{showPassword ? 'visibility_off' : 'visibility'}</i>
+            </button>
           </div>
 
           <button type="submit" className="v2-btn-filled" style={{ justifyContent: 'center', height: '56px', marginTop: '8px' }} disabled={loading}>
-            {loading ? 'Creando cuenta...' : 'Registrarse'}
-            {!loading && <i className="material-icons">person_add</i>}
+            {loading ? (
+              <span className="valign-wrapper" style={{ gap: '12px' }}>
+                <CustomPreloader size="small" />
+                Creando cuenta...
+              </span>
+            ) : (
+              <>
+                Registrarse
+                <i className="material-icons">person_add</i>
+              </>
+            )}
           </button>
         </form>