From f94d401d572fd24609013361a2fd8b0b49d85908 Mon Sep 17 00:00:00 2001
From: Sergio Nicolas Lavaise <snlavaise@gmail.com>
Date: Mon, 20 Apr 2026 03:21:43 -0300
Subject: [PATCH] Fix: darker dark mode colors for badges and sections

---
 src/sections/EditIngreso.tsx     |  2 +-
 src/sections/HistoriaClinica.tsx | 24 ++++++++++++------------
 2 files changed, 13 insertions(+), 13 deletions(-)

diff --git a/src/sections/EditIngreso.tsx b/src/sections/EditIngreso.tsx
index 4b99956..710577b 100644
--- a/src/sections/EditIngreso.tsx
+++ b/src/sections/EditIngreso.tsx
@@ -118,7 +118,7 @@ export function EditIngreso({
               {selectedPaciente ? (
                 <div className="space-y-2">
                   <div className="flex flex-wrap gap-2">
-                    <Badge variant="outline" className="bg-green-50 text-green-700 dark:bg-green-950 dark:text-green-300">
+                    <Badge variant="outline" className="bg-green-50 text-green-700 dark:bg-green-900 dark:text-green-300 dark:border-green-700">
                       {selectedPaciente?.apellido}, {selectedPaciente?.nombre}
                     </Badge>
                     <Badge variant="outline" className="bg-primary/10 text-primary border-primary/30">
diff --git a/src/sections/HistoriaClinica.tsx b/src/sections/HistoriaClinica.tsx
index be492e8..abf2589 100644
--- a/src/sections/HistoriaClinica.tsx
+++ b/src/sections/HistoriaClinica.tsx
@@ -280,11 +280,11 @@ export function HistoriaClinica({
 
           <div className="space-y-2">
             <div className="flex flex-wrap gap-2">
-              <Badge variant="outline" className="text-sm px-3 py-1 bg-green-50 text-green-700 dark:bg-green-950 dark:text-green-300">
+              <Badge variant="outline" className="text-sm px-3 py-1 bg-green-50 text-green-700 dark:bg-green-900 dark:text-green-300 dark:border-green-700">
                 {paciente.fechaNacimiento ? calcularEdad(paciente.fechaNacimiento) + ' años' : ''}
               </Badge>
 
-              <Badge variant="outline" className="text-sm px-3 py-1 bg-blue-50 text-blue-700 border-blue-200 dark:bg-blue-950 dark:text-blue-300">
+              <Badge variant="outline" className="text-sm px-3 py-1 bg-blue-50 text-blue-700 border-blue-200 dark:bg-blue-900 dark:text-blue-300 dark:border-blue-700">
                 DNI: {paciente.dni}
               </Badge>
 
@@ -946,7 +946,7 @@ function SeccionLaboratorios({ lab, patientId, add, update, del, addAcidoBase }:
               <div className="flex-1"><Label>Hora</Label><Input type="time" value={hora} onChange={e => setHora(e.target.value)} /></div>
             </div>
 
-            <div className="bg-purple-50 dark:bg-purple-900/30 p-3 rounded-lg border border-purple-200 dark:border-purple-700">
+            <div className="bg-purple-50 dark:bg-purple-900 p-3 rounded-lg border border-purple-200 dark:border-purple-700">
               <p className="text-sm font-bold text-purple-800 mb-3">Hemograma</p>
               <div className="grid grid-cols-4 gap-2">
                 <div><Label className="text-xs">Hto</Label><Input placeholder="%" value={hto} onChange={e => setHto(e.target.value)} /></div>
@@ -956,7 +956,7 @@ function SeccionLaboratorios({ lab, patientId, add, update, del, addAcidoBase }:
               </div>
             </div>
 
-            <div className="bg-green-50 dark:bg-green-900/30 p-3 rounded-lg border border-green-200 dark:border-green-700">
+            <div className="bg-green-50 dark:bg-green-900 p-3 rounded-lg border border-green-200 dark:border-green-700">
               <p className="text-sm font-bold text-green-800 mb-3">Química</p>
               <div className="grid grid-cols-3 gap-2">
                 <div><Label className="text-xs">Gluc</Label><Input placeholder="mg/dL" value={gluc} onChange={e => setGluc(e.target.value)} /></div>
@@ -965,7 +965,7 @@ function SeccionLaboratorios({ lab, patientId, add, update, del, addAcidoBase }:
               </div>
             </div>
 
-            <div className="bg-green-50 dark:bg-green-900/30 p-3 rounded-lg border border-green-200 dark:border-green-700">
+            <div className="bg-green-50 dark:bg-green-900 p-3 rounded-lg border border-green-200 dark:border-green-700">
               <p className="text-sm font-bold text-green-800 mb-3">Ionograma</p>
               <div className="grid grid-cols-3 gap-2">
                 <div><Label className="text-xs">Na+</Label><Input placeholder="mEq/L" value={na} onChange={e => setNa(e.target.value)} /></div>
@@ -974,7 +974,7 @@ function SeccionLaboratorios({ lab, patientId, add, update, del, addAcidoBase }:
               </div>
             </div>
 
-            <div className="bg-green-50 dark:bg-green-900/30 p-3 rounded-lg border border-green-200 dark:border-green-700">
+            <div className="bg-green-50 dark:bg-green-900 p-3 rounded-lg border border-green-200 dark:border-green-700">
               <p className="text-sm font-bold text-green-800 mb-3">Hepatograma</p>
               <div className="grid grid-cols-4 gap-2">
                 <div><Label className="text-xs">Bt</Label><Input placeholder="mg/dL" value={bt} onChange={e => setBt(e.target.value)} /></div>
@@ -984,7 +984,7 @@ function SeccionLaboratorios({ lab, patientId, add, update, del, addAcidoBase }:
               </div>
             </div>
 
-            <div className="bg-cyan-50 dark:bg-cyan-900/30 p-3 rounded-lg border border-cyan-200 dark:border-cyan-700">
+            <div className="bg-cyan-50 dark:bg-cyan-900 p-3 rounded-lg border border-cyan-200 dark:border-cyan-700">
               <p className="text-sm font-bold text-cyan-800 mb-3">Coagulograma</p>
               <div className="grid grid-cols-3 gap-2">
                 <div><Label className="text-xs">TP</Label><Input placeholder="seg" value={tp} onChange={e => setTp(e.target.value)} /></div>
@@ -1364,7 +1364,7 @@ function SeccionEvoluciones({ evos, internacionId, add, update, del }: {
               <div><Label>Fecha *</Label><Input type="date" value={fecha} onChange={e => setFecha(e.target.value)} /></div>
               <div><Label>Hora *</Label><Input type="time" value={hora} onChange={e => setHora(e.target.value)} /></div>
             </div>
-            <div className="bg-blue-50 dark:bg-blue-950/50 p-3 rounded-lg border border-blue-200 dark:border-blue-700">
+            <div className="bg-blue-50 dark:bg-blue-900 p-3 rounded-lg border border-blue-200 dark:border-blue-700">
               <p className="text-sm font-bold text-blue-800 mb-3 flex items-center gap-2"><Activity className="h-4 w-4" />Signos Vitales</p>
               <div className="grid grid-cols-2 sm:grid-cols-3 gap-4">
                 <div><Label className="flex items-center gap-1"><Heart className="h-4 w-4" />TAS</Label><Input type="number" value={presionSistolica} onChange={e => setPresionSistolica(e.target.value)} placeholder="120" /></div>
@@ -1375,7 +1375,7 @@ function SeccionEvoluciones({ evos, internacionId, add, update, del }: {
                 <div><Label className="flex items-center gap-1"><Droplets className="h-4 w-4" />SatO2</Label><Input type="number" value={saturacionO2} onChange={e => setSaturacionO2(e.target.value)} placeholder="98" /></div>
               </div>
             </div>
-            <div className="bg-green-50 dark:bg-green-900/30 p-3 rounded-lg border border-green-200 dark:border-green-700">
+            <div className="bg-green-50 dark:bg-green-900 p-3 rounded-lg border border-green-200 dark:border-green-700">
               <p className="text-sm font-bold text-green-800 mb-3 flex items-center gap-2"><FileText className="h-4 w-4" />Examen Físico</p>
               <div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
                 <div><Label>SNC</Label><textarea className="w-full p-2 border rounded-md text-sm min-h-[60px]" value={snc} onChange={e => setSnc(e.target.value)} placeholder="Estado neurológico" /></div>
@@ -1413,7 +1413,7 @@ function SeccionEvoluciones({ evos, internacionId, add, update, del }: {
                 </div>
                 {svText && <div className="bg-blue-50 p-2 rounded-lg"><p className="text-sm font-medium text-blue-800 flex items-center gap-2"><Activity className="h-4 w-4" />Signos Vitales: {svText}</p></div>}
                 {isExpanded && <>
-                  {e.examenFisico && <div className="bg-green-50 dark:bg-green-900/30 p-3 rounded-lg border border-green-200 dark:border-green-700"><p className="text-sm font-medium text-green-800 mb-2">Examen Físico:</p><div className="grid grid-cols-2 sm:grid-cols-4 gap-2 text-xs">
+                  {e.examenFisico && <div className="bg-green-50 dark:bg-green-900 p-3 rounded-lg border border-green-200 dark:border-green-700"><p className="text-sm font-medium text-green-800 mb-2">Examen Físico:</p><div className="grid grid-cols-2 sm:grid-cols-4 gap-2 text-xs">
                     {e.examenFisico.SNC && <div><span className="font-medium">SNC:</span> {e.examenFisico.SNC}</div>}
                     {e.examenFisico.Cardiovascular && <div><span className="font-medium">CV:</span> {e.examenFisico.Cardiovascular}</div>}
                     {e.examenFisico.Respiratorio && <div><span className="font-medium">Resp:</span> {e.examenFisico.Respiratorio}</div>}
@@ -1910,7 +1910,7 @@ function SeccionCultivos({ cults, patient, add, update, del }: {
                     </div>
                   )}
                   {c.estado === 'Negativo' && (
-                    <div className="bg-green-50 dark:bg-green-900/30 p-3 rounded-lg border border-green-200 dark:border-green-700">
+                    <div className="bg-green-50 dark:bg-green-900 p-3 rounded-lg border border-green-200 dark:border-green-700">
                       <p className="text-sm font-medium text-green-800 flex items-center gap-2"><CheckCircle2 className="h-4 w-4" />Sin crecimiento de microorganismos</p>
                       {c.fechaResultado && <p className="text-xs text-green-600 mt-1">Resultado: {c.fechaResultado}</p>}
                     </div>
@@ -2211,7 +2211,7 @@ function SeccionInterconsultas({ interconsultas, pacienteId, internacionId, add,
                     {ic.respuestaInterconsulta && (
                       <>
                         {ic.respuestaFecha && (
-                          <Badge variant="outline" className="mt-2 bg-green-50 text-green-700 border-green-200 dark:bg-green-950 dark:text-green-300 dark:border-green-800">
+                          <Badge variant="outline" className="mt-2 bg-green-50 text-green-700 border-green-200 dark:bg-green-900 dark:text-green-300 dark:border-green-700">
                             <CheckCircle2 className="h-3 w-3 mr-1" />
                             Respondido: {ic.respuestaFecha}
                           </Badge>