diff --git a/src/app/cliente/historial/page.tsx b/src/app/cliente/historial/page.tsx
index 7b20d60..a3f5263 100644
--- a/src/app/cliente/historial/page.tsx
+++ b/src/app/cliente/historial/page.tsx
@@ -56,34 +56,30 @@ function HistorialContent() {
             const dia = fecha.toLocaleDateString("es-AR", { day: "2-digit", month: "long", year: "numeric" });
             const diaSemana = fecha.toLocaleDateString("es-AR", { weekday: "long" });
             return (
-              <div key={reg.id} className="bg-white border border-gray-200 rounded-2xl overflow-hidden shadow-sm hover:shadow-md transition">
-                {/* Header de la tarjeta */}
-                <div className="bg-blue-600 px-4 py-3 flex items-center justify-between gap-2">
+              <div key={reg.id} className="bg-white border border-gray-200 rounded-2xl px-4 py-3 flex flex-col gap-2 shadow-sm hover:shadow-md transition">
+                <div className="flex items-start justify-between gap-2">
                   <div className="flex items-center gap-2">
-                    <span className="text-white text-lg">🔧</span>
-                    <span className="text-white font-semibold text-sm sm:text-base">
+                    <span className="text-lg">🔧</span>
+                    <span className="font-semibold text-gray-800 text-sm sm:text-base">
                       {reg.tipoServicio?.nombre ?? reg.descripcion}
                     </span>
                   </div>
                   <div className="text-right shrink-0">
-                    <p className="text-blue-100 text-xs capitalize">{diaSemana}</p>
-                    <p className="text-white text-xs font-medium">{dia}</p>
+                    <p className="text-gray-400 text-xs capitalize">{diaSemana}</p>
+                    <p className="text-gray-600 text-xs font-medium">{dia}</p>
                   </div>
                 </div>
 
-                {/* Cuerpo */}
-                <div className="px-4 py-3 flex flex-col gap-2">
-                  {reg.tipoServicio && reg.descripcion !== reg.tipoServicio.nombre && (
-                    <p className="text-sm text-gray-700">{reg.descripcion}</p>
-                  )}
-                  {reg.observaciones && (
-                    <div className="bg-amber-50 border border-amber-100 rounded-lg px-3 py-2">
-                      <p className="text-xs text-amber-700 font-medium mb-0.5">Observaciones</p>
-                      <p className="text-sm text-amber-900">{reg.observaciones}</p>
-                    </div>
-                  )}
-                  <p className="text-xs text-gray-400 text-right">Realizado por: {reg.admin.nombre}</p>
-                </div>
+                {reg.tipoServicio && reg.descripcion !== reg.tipoServicio.nombre && (
+                  <p className="text-sm text-gray-700">{reg.descripcion}</p>
+                )}
+                {reg.observaciones && (
+                  <div className="bg-amber-50 border border-amber-100 rounded-lg px-3 py-2">
+                    <p className="text-xs text-amber-700 font-medium mb-0.5">Observaciones</p>
+                    <p className="text-sm text-amber-900">{reg.observaciones}</p>
+                  </div>
+                )}
+                <p className="text-xs text-gray-400 text-right">Realizado por: {reg.admin.nombre}</p>
               </div>
             );
           })}