diff --git a/ui/src/style.css b/ui/src/style.css
index fb4740a..befcd01 100644
--- a/ui/src/style.css
+++ b/ui/src/style.css
@@ -29,6 +29,15 @@
   --accent-color-planillas:   #FF9800;
   --accent-color-tareas:      #9C27B0;
 
+  /* Table background colors */
+  --table-bg-color-asistencias: #fdebee;
+  --table-bg-color-empleados:   #e3f2fd;
+  --table-bg-color-planillas:   #fff8e1;
+  --table-bg-color-tareas:      #e6f4ea;
+
+  /* Input background color */
+  --input-field-bg-color: #FFFFFF;
+
   /* Fondos de tabla (light) */
   --table-container-bg-color-asistencias: #fdebee;
   --table-container-bg-color-empleados:   #e3f2fd;
@@ -44,6 +53,13 @@ html.theme-dark {
   --background-color: #303030; /* Dark theme background */
   --text-color: #FFFFFF; /* Text color for dark theme */
 
+  /* Table background colors (dark theme) */
+  --table-bg-color-asistencias: #4a1f28;
+  --table-bg-color-empleados: #193a50;
+  --table-bg-color-planillas: #503f1b;
+  --table-bg-color-tareas: #1e4028;
+  --input-field-bg-color: #000000;
+
   /* NEW: Module-specific table container background colors (Dark Theme) */
   --table-container-bg-color-asistencias: #4a1f28;
   --table-container-bg-color-empleados: #193a50;
diff --git a/ui/src/views/empleados/EmpleadoForm.vue b/ui/src/views/empleados/EmpleadoForm.vue
index 72b86c9..e2fa142 100644
--- a/ui/src/views/empleados/EmpleadoForm.vue
+++ b/ui/src/views/empleados/EmpleadoForm.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="p-6 min-h-screen empleado-form-page-container">
+  <div class="p-6 min-h-screen">
     <h1 class="text-3xl font-bold mb-8 text-center text-gray-700">
       {{ isEditMode ? 'Editar Empleado' : 'Crear Empleado' }}
     </h1>
@@ -240,19 +240,8 @@ input:required:invalid {
 }
 
 /* Removing generic input:focus, button:focus as they are too broad */
-
-/* --- Look & feel extra (opcional, podés ajustar) --- */
-.empleado-form-page-container {
-  background-color: var(--background-color, #f3f4f6); /* Fallback to a light gray */
-}
-
 .empleado-actual-form {
-  background-color: #ffffff; /* Default white for light theme */
-}
-
-/* Example for dark theme (assuming a parent class .dark or data attribute) */
-.dark .empleado-actual-form {
-  background-color: #2d3748; /* A dark gray for dark theme */
+  background-color: var(--table-bg-color-empleados);
 }
 
 .form-container { background-color: var(--background-color); } /* Use theme background */
@@ -263,9 +252,9 @@ input:required:invalid {
 .form-label   { color: var(--text-color); font-weight: 600; } /* Use theme text color */
 
 .form-input   {
-  border-color: var(--secondary-color); /* Use secondary for border */
-  background-color: var(--background-color); /* Ensure inputs match theme background */
-  color: var(--text-color); /* Ensure input text matches theme text */
+  border-color: var(--accent-color-empleados);
+  background-color: var(--input-field-bg-color);
+  color: var(--text-color);
   transition: border-color .2s, box-shadow .2s;
 }
 .form-input:focus {