diff --git a/src/components/ui/accordion.tsx b/src/components/ui/accordion.tsx
index d21b65f..e1797c9 100644
--- a/src/components/ui/accordion.tsx
+++ b/src/components/ui/accordion.tsx
@@ -1,64 +1,55 @@
 import * as React from "react"
 import * as AccordionPrimitive from "@radix-ui/react-accordion"
-import { ChevronDownIcon } from "lucide-react"
+import { ChevronDown } from "lucide-react"
 
 import { cn } from "@/lib/utils"
 
-function Accordion({
-  ...props
-}: React.ComponentProps<typeof AccordionPrimitive.Root>) {
-  return <AccordionPrimitive.Root data-slot="accordion" {...props} />
-}
+const Accordion = AccordionPrimitive.Root
 
-function AccordionItem({
-  className,
-  ...props
-}: React.ComponentProps<typeof AccordionPrimitive.Item>) {
-  return (
-    <AccordionPrimitive.Item
-      data-slot="accordion-item"
-      className={cn("border-b last:border-b-0", className)}
-      {...props}
-    />
-  )
-}
+const AccordionItem = React.forwardRef<
+  React.ElementRef<typeof AccordionPrimitive.Item>,
+  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>
+>(({ className, ...props }, ref) => (
+  <AccordionPrimitive.Item
+    ref={ref}
+    className={cn("border-b", className)}
+    {...props}
+  />
+))
+AccordionItem.displayName = "AccordionItem"
 
-function AccordionTrigger({
-  className,
-  children,
-  ...props
-}: React.ComponentProps<typeof AccordionPrimitive.Trigger>) {
-  return (
-    <AccordionPrimitive.Header className="flex">
-      <AccordionPrimitive.Trigger
-        data-slot="accordion-trigger"
-        className={cn(
-          "focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180",
-          className
-        )}
-        {...props}
-      >
-        {children}
-        <ChevronDownIcon className="text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200" />
-      </AccordionPrimitive.Trigger>
-    </AccordionPrimitive.Header>
-  )
-}
-
-function AccordionContent({
-  className,
-  children,
-  ...props
-}: React.ComponentProps<typeof AccordionPrimitive.Content>) {
-  return (
-    <AccordionPrimitive.Content
-      data-slot="accordion-content"
-      className="data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm"
+const AccordionTrigger = React.forwardRef<
+  React.ElementRef<typeof AccordionPrimitive.Trigger>,
+  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger>
+>(({ className, children, ...props }, ref) => (
+  <AccordionPrimitive.Header className="flex">
+    <AccordionPrimitive.Trigger
+      ref={ref}
+      className={cn(
+        "flex flex-1 items-center justify-between py-4 text-sm font-medium transition-all hover:underline text-left [&[data-state=open]>svg]:rotate-180",
+        className
+      )}
       {...props}
     >
-      <div className={cn("pt-0 pb-4", className)}>{children}</div>
-    </AccordionPrimitive.Content>
-  )
-}
+      {children}
+      <ChevronDown className="h-4 w-4 shrink-0 text-muted-foreground transition-transform duration-200" />
+    </AccordionPrimitive.Trigger>
+  </AccordionPrimitive.Header>
+))
+AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName
+
+const AccordionContent = React.forwardRef<
+  React.ElementRef<typeof AccordionPrimitive.Content>,
+  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>
+>(({ className, children, ...props }, ref) => (
+  <AccordionPrimitive.Content
+    ref={ref}
+    className="overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down"
+    {...props}
+  >
+    <div className={cn("pb-4 pt-0", className)}>{children}</div>
+  </AccordionPrimitive.Content>
+))
+AccordionContent.displayName = AccordionPrimitive.Content.displayName
 
 export { Accordion, AccordionItem, AccordionTrigger, AccordionContent }
diff --git a/src/sections/EditIngreso.tsx b/src/sections/EditIngreso.tsx
index 546340f..4b99956 100644
--- a/src/sections/EditIngreso.tsx
+++ b/src/sections/EditIngreso.tsx
@@ -84,9 +84,7 @@ export function EditIngreso({
     <div className="space-y-6 dark:text-white">
       <div className="flex flex-col sm:flex-row items-start sm:items-center justify-between gap-4">
         <div className="flex items-center gap-4">
-          <Button variant="ghost" size="icon" onClick={onVolver}>
-            <ArrowLeft className="h-5 w-5" />
-          </Button>
+
           <div>
             <h1 className="text-2xl font-bold text-gray-900 dark:text-white flex items-center gap-2">
               <User className="h-6 w-6 text-blue-600" />
diff --git a/src/sections/HistoriaClinica.tsx b/src/sections/HistoriaClinica.tsx
index c1c71d1..ff20283 100644
--- a/src/sections/HistoriaClinica.tsx
+++ b/src/sections/HistoriaClinica.tsx
@@ -1,5 +1,13 @@
 import { useState } from 'react';
 import { PDFDocument } from 'pdf-lib';
+import { User } from 'lucide-react';
+import {
+  Accordion,
+  AccordionContent,
+  AccordionItem,
+  AccordionTrigger,
+} from "@/components/ui/accordion";
+
 import {
   FlaskConical,
   Microscope,
@@ -117,10 +125,10 @@ const RANGOS_LABORATORIO: Record<string, { min: number; max: number }> = {
 function calcularEstadoLaboratorio(parametro: string, valor: string): 'Normal' | 'Alto' | 'Bajo' {
   const rango = RANGOS_LABORATORIO[parametro];
   if (!rango) return 'Normal';
-  
+
   const num = parseFloat(valor);
   if (isNaN(num)) return 'Normal';
-  
+
   if (num < rango.min) return 'Bajo';
   if (num > rango.max) return 'Alto';
   return 'Normal';
@@ -130,7 +138,7 @@ function wrapText(text: string, font: any, fontSize: number, maxWidth: number):
   const words = text.split(' ');
   const lines: string[] = [];
   let currentLine = '';
-  
+
   for (const word of words) {
     const testLine = currentLine ? `${currentLine} ${word}` : word;
     const testWidth = font.widthOfTextAtSize(testLine, fontSize);
@@ -145,6 +153,8 @@ function wrapText(text: string, font: any, fontSize: number, maxWidth: number):
   return lines;
 }
 
+
+
 export function HistoriaClinica({
   internacion,
   paciente,
@@ -203,40 +213,23 @@ export function HistoriaClinica({
     return Math.floor(diff / (1000 * 60 * 60 * 24));
   };
 
-  const handleGuardarEdicion = () => {
-    if (editCamaId && editCamaId !== internacion.camaId && cama) {
-      onActualizarCama(cama.id, { estado: 'Disponible', pacienteId: undefined, internacionId: undefined });
-    }
-    if (editCamaId) {
-      onActualizarCama(editCamaId, { estado: 'Ocupada', pacienteId: paciente.id, internacionId: internacion.id });
-    }
-    onActualizarInternacion(internacion.id, {
-      fechaIngresoClinica: editFechaIngreso,
-      motivoConsulta: editMotivoConsulta,
-      diagnosticoIngreso: editDiagnostico,
-      enfermedadActual: editEnfermedadActual,
-      antecedentesEnfermedadActual: editAntecedentes,
-      medicoIngresante: editMedico,
-      camaId: editCamaId || undefined,
-    });
-    setEditIngresoDialog(false);
-  };
+
 
   return (
     <div className="space-y-6 dark:text-white">
-      <div>
-        <div className="flex items-center gap-4 mb-4">
 
-          <div>
-            <h1 className="text-2xl font-bold text-gray-900 dark:text-white flex items-center gap-2"><ClipboardList className="h-6 w-6" />Historia Clínica</h1>
-            <p className="text-gray-500">
-              Cama: {cama?.numero || 'N/A'} | {paciente.apellido}, {paciente.nombre} | {paciente.fechaNacimiento ? calcularEdad(paciente.fechaNacimiento) + ' años' : ''} | DNI: {paciente.dni}
-            </p>
-          </div>
+      <div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4">
 
+        <div>
+          <h1 className="text-2xl font-bold text-gray-900 dark:text-white flex items-center gap-2">
+            <ClipboardList className="h-6 w-6 text-blue-600" />
+            {cama?.numero || 'N/A'} - Historia Clínica
+          </h1>
+          <p className="text-gray-500 dark:text-gray-400">Módulo de Historia Clínica de Internación</p>
         </div>
 
-        <div className="flex items-center gap-2 flex-wrap">
+        <div className="flex items-center gap-2">
+
           <Button variant="outline" onClick={onVolver}>
             <ArrowLeft className="h-4 w-4 mr-2" />
             Volver
@@ -246,253 +239,224 @@ export function HistoriaClinica({
             Editar Ingreso
           </Button>
         </div>
-
       </div>
 
 
-
-
-
-      <Dialog open={editIngresoDialog} onOpenChange={setEditIngresoDialog}>
-        <DialogContent className="sm:max-w-2xl max-h-[90vh] overflow-y-auto">
-          <DialogHeader>
-            <DialogTitle>Editar Ingreso</DialogTitle>
-          </DialogHeader>
-          <Card className="bg-muted/50">
-            <CardContent className="p-4">
-              <div className="flex flex-wrap gap-2 mb-2">
-                <Badge variant="outline" className="bg-primary/10 text-primary border-primary/30">
-                  {paciente.apellido}, {paciente.nombre}
-                </Badge>
-                <Badge variant="outline" className="bg-primary/10 text-primary border-primary/30">
-                  {paciente.fechaNacimiento ? calcularEdad(paciente.fechaNacimiento) + ' años' : ''}
-                </Badge>
-                <Badge variant="outline" className="bg-primary/10 text-primary border-primary/30">
-                  DNI: {paciente.dni}
-                </Badge>
-              </div>
-              <div className="flex flex-wrap gap-2">
-                <Badge variant="secondary">
-                  HC: {paciente.historiaClinica || 'N/A'}
-                </Badge>
-                <Badge variant="secondary">
-                  {paciente.obraSocial || 'Sin obra social'}
-                </Badge>
-                <Badge variant="secondary">
-                  {paciente.nacionalidad || 'N/A'}
-                </Badge>
-              </div>
-            </CardContent>
-          </Card>
-          <div className="space-y-4">
-            <div className="grid grid-cols-3 gap-4">
-              <div>
-                <Label>Fecha de Ingreso *</Label>
-                <Input type="date" value={editFechaIngreso} onChange={e => setEditFechaIngreso(e.target.value)} />
-              </div>
-              <div>
-                <Label>Médico Ingresante *</Label>
-                <Input value={editMedico} onChange={e => setEditMedico(e.target.value)} placeholder="Nombre del médico" />
-              </div>
-              <div>
-                <Label>Cama</Label>
-                <Select value={editCamaId} onValueChange={setEditCamaId}>
-                  <SelectTrigger><SelectValue placeholder="Seleccionar cama" /></SelectTrigger>
-                  <SelectContent>
-                    {(allCamas || []).filter((c: Cama) => c.estado === 'Disponible' || c.id === cama?.id).map((c: Cama) => (
-                      <SelectItem key={c.id} value={c.id}>{c.numero}</SelectItem>
-                    ))}
-                  </SelectContent>
-                </Select>
-              </div>
-            </div>
-            <div>
-              <Label>Motivo de Consulta</Label>
-              <textarea className="w-full p-2 border rounded-md text-sm min-h-[60px]" value={editMotivoConsulta} onChange={e => setEditMotivoConsulta(e.target.value)} />
-            </div>
-            <div>
-              <Label>Diagnóstico de Ingreso *</Label>
-              <textarea className="w-full p-2 border rounded-md text-sm min-h-[60px]" value={editDiagnostico} onChange={e => setEditDiagnostico(e.target.value)} />
-            </div>
-            <div>
-              <Label>Enfermedad Actual</Label>
-              <textarea className="w-full p-2 border rounded-md text-sm min-h-[80px]" value={editEnfermedadActual} onChange={e => setEditEnfermedadActual(e.target.value)} />
-            </div>
-            <div>
-              <Label>Antecedentes de la Enfermedad Actual</Label>
-              <textarea className="w-full p-2 border rounded-md text-sm min-h-[80px]" value={editAntecedentes} onChange={e => setEditAntecedentes(e.target.value)} />
-            </div>
-          </div>
-          <div className="flex justify-end gap-2 mt-4">
-            <Button variant="outline" onClick={() => setEditIngresoDialog(false)}><X className="h-4 w-4 mr-2" />Cancelar</Button>
-            <Button onClick={handleGuardarEdicion} disabled={!editFechaIngreso || !editDiagnostico || !editMedico}><Save className="h-4 w-4 mr-2" />Guardar</Button>
-          </div>
-        </DialogContent>
-      </Dialog>
-
       <Card>
-        <CardContent className="p-0">
-          <button type="button" className="w-full p-4 flex items-center justify-between hover:bg-gray-50" onClick={() => setDetalleExpandido(!detalleExpandido)}>
-            <div className="grid grid-cols-2 sm:grid-cols-4 gap-4 text-sm w-full">
-              
+        <CardContent className="p-4">
+          <div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4">
+            <div><h2 className="font-bold text-lg text-gray-900 flex items-center gap-2">
+              <User className="h-4 w-4" />
+              {paciente.apellido}, {paciente.nombre}
+            </h2>
+            </div>
+            <div className="flex items-center gap-2">
+              <Badge className={internacion.fechaIngresoClinica && calcularDiasInternado(internacion.fechaIngresoClinica) > 7 ? 'bg-red-100 text-red-800' : 'bg-blue-100 text-blue-800'}>
+                {internacion.fechaIngresoClinica ? calcularDiasInternado(internacion.fechaIngresoClinica) : 0} días internado
+              </Badge>
+            </div>
+          </div>
+
+          <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">
+                {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">
+                DNI: {paciente.dni}
+              </Badge>
+
+            </div>
+
+            <div className="flex flex-wrap gap-2">
+              <Badge variant="secondary" className="text-sm px-3 py-1">
+                HC: {paciente.historiaClinica || 'No posee'}
+              </Badge>
+              <Badge variant="secondary" className="text-sm px-3 py-1">
+                OS: {paciente.obraSocial || 'No posee'}
+              </Badge>
+              <Badge variant="secondary" className="text-sm px-3 py-1">
+                Nacionalidad: {paciente.nacionalidad || 'N/A'}
+              </Badge>
+            </div>
+
+            <div className="border-t p-4 space-y-4">
+
+
               <div>
-                <p className="text-gray-500">Antecedentes</p>
-                <p className="font-medium truncate">{paciente.antecedentes || 'No constan'}</p>
+                <p className="text-gray-500 text-sm">Antecedentes</p>
+                <p className="font-medium">{paciente.antecedentes || 'No refiere'}</p>
               </div>
-              
+
+
+              <div>
+                <p className="text-gray-500 text-sm">MH</p>
+                <p className="font-medium">{paciente.medicacionHabitual || 'No refiere'}</p>
+              </div>
+
               <div>
                 <p className="text-gray-500">Fecha de Ingreso</p>
                 <p className="font-medium">{internacion.fechaIngresoClinica ? formatDateDDMMYYYY(internacion.fechaIngresoClinica) : 'N/A'}</p>
               </div>
+
               <div>
                 <p className="text-gray-500">Diagnóstico de Ingreso</p>
-                <p className="font-medium truncate">{internacion.diagnosticoIngreso}</p>
+                <p className="font-medium">{internacion.diagnosticoIngreso}</p>
               </div>
-              <div>
-                <p className="text-gray-500">Días de Internación</p>
-                <Badge className={internacion.fechaIngresoClinica && calcularDiasInternado(internacion.fechaIngresoClinica) > 7 ? 'bg-red-100 text-red-800' : 'bg-blue-100 text-blue-800'}>
-                  {internacion.fechaIngresoClinica ? calcularDiasInternado(internacion.fechaIngresoClinica) : 0} días
-                </Badge>
-              </div>
-              
+
+              <Accordion type="single" collapsible defaultValue="item-1">
+                <AccordionItem value="item-1">
+                  <AccordionTrigger>Detalle Episodio Actual</AccordionTrigger>
+                  <AccordionContent className="p4">
+                    <div className="border-t p-4 space-y-4">
+
+
+                      <div>
+                        <p className="text-gray-500 text-sm">Motivo de Consulta</p>
+                        <p className="font-medium">{internacion.motivoConsulta || 'Sin motivo registrado'}</p>
+                      </div>
+                      <div>
+                        <p className="text-gray-500 text-sm">Enfermedad Actual</p>
+                        <p className="font-medium">{internacion.enfermedadActual || 'Sin información'}</p>
+                      </div>
+                      <div>
+                        <p className="text-gray-500 text-sm">Antecedentes de Enfermedad Actual</p>
+                        <p className="font-medium">{internacion.antecedentesEnfermedadActual || 'Sin antecedentes registrados'}</p>
+                      </div>
+                      <Button variant="outline" className="bg-blue-50 border-blue-300 text-blue-700 hover:bg-blue-100" onClick={async (e) => {
+                        e.stopPropagation();
+                        try {
+                          const { PDFDocument, StandardFonts, rgb } = await import('pdf-lib');
+                          const pdfDoc = await PDFDocument.create();
+                          const page = pdfDoc.addPage([595, 842]);
+                          const { width, height } = page.getSize();
+
+                          const font = await pdfDoc.embedFont(StandardFonts.Helvetica);
+                          const fontBold = await pdfDoc.embedFont(StandardFonts.HelveticaBold);
+
+                          const colorPrimary = rgb(0.18, 0.34, 0.55);
+                          const colorText = rgb(0.13, 0.13, 0.13);
+                          const colorGray = rgb(0.45, 0.45, 0.45);
+                          const colorLightGray = rgb(0.92, 0.92, 0.92);
+
+                          const edad = paciente.fechaNacimiento ? calcularEdad(paciente.fechaNacimiento) : '';
+                          const fechaFormateada = internacion.fechaIngresoClinica ? formatDateDDMMYYYY(internacion.fechaIngresoClinica) : 'N/A';
+                          const fechaHospital = internacion.fechaIngresoHospital ? formatDateDDMMYYYY(internacion.fechaIngresoHospital) : '';
+
+                          // Header
+                          page.drawRectangle({ x: 0, y: height - 100, width, height: 100, color: colorPrimary });
+                          page.drawText('HOSPITAL DONACIÓN F. SANTOJANNI – DIVISIÓN CLÍNICA MÉDICA', { x: 60, y: height - 35, size: 14, font: fontBold, color: rgb(1, 1, 1) });
+                          page.drawText('HISTORIA CLÍNICA DE INGRESO', { x: 170, y: height - 55, size: 12, font: fontBold, color: rgb(1, 1, 1) });
+
+                          let y = height - 140;
+
+                          // Datos Filiatorios
+                          page.drawRectangle({ x: 45, y: y - 8, width: 505, height: 24, color: colorLightGray });
+                          page.drawText('DATOS FILIATORIOS', { x: 50, y: y, size: 12, font: fontBold, color: colorPrimary });
+                          y -= 35;
+
+                          // Primera línea: Fechas y cama
+                          const fechaIngresoHospText = fechaHospital ? `Fecha ingreso al hospital: ${fechaHospital}` : '';
+                          const fechaIngresoClinText = fechaFormateada ? `Fecha ingreso a clínica: ${fechaFormateada}` : '';
+                          const camaText = `Cama: ${cama?.numero || 'N/A'}`;
+
+                          page.drawText(fechaIngresoHospText, { x: 50, y, size: 10, font: fontBold, color: colorGray });
+                          page.drawText(fechaIngresoClinText, { x: 260, y, size: 10, font: fontBold, color: colorGray });
+                          y -= 18;
+                          page.drawText(camaText, { x: 50, y, size: 10, font: fontBold, color: colorGray });
+                          y -= 25;
+
+                          // Segunda línea: Apellido, Nombre y DNI
+                          page.drawText(`Apellido y Nombre: ${paciente.apellido || ''}, ${paciente.nombre || ''}`, { x: 50, y, size: 10, font: fontBold, color: colorGray });
+                          y -= 18;
+                          page.drawText(`DNI: ${paciente.dni || ''}`, { x: 50, y, size: 10, font: fontBold, color: colorGray });
+                          page.drawText(`Edad: ${edad ? `${edad} años` : ''}`, { x: 280, y, size: 10, font: fontBold, color: colorGray });
+                          y -= 40;
+
+                          // Datos Clínicos
+                          page.drawRectangle({ x: 45, y: y - 8, width: 505, height: 24, color: colorLightGray });
+                          page.drawText('DATOS CLÍNICOS', { x: 50, y: y, size: 12, font: fontBold, color: colorPrimary });
+                          y -= 35;
+
+                          page.drawText('Motivo de Consulta:', { x: 50, y, size: 10, font: fontBold, color: colorGray });
+                          y -= 18;
+                          const motivoLines = wrapText(internacion.motivoConsulta || 'Sin información', font, 10, 480);
+                          for (const line of motivoLines.slice(0, 4)) {
+                            page.drawText(line, { x: 50, y, size: 10, font, color: colorText });
+                            y -= 14;
+                          }
+                          y -= 10;
+                          if (motivoLines.length > 4) y -= (motivoLines.length - 4) * 14;
+
+                          page.drawText('Enfermedad Actual:', { x: 50, y, size: 10, font: fontBold, color: colorGray });
+                          y -= 18;
+                          const enfermedadLines = wrapText(internacion.enfermedadActual || 'Sin información', font, 10, 480);
+                          for (const line of enfermedadLines.slice(0, 4)) {
+                            page.drawText(line, { x: 50, y, size: 10, font, color: colorText });
+                            y -= 14;
+                          }
+                          y -= 10;
+                          if (enfermedadLines.length > 4) y -= (enfermedadLines.length - 4) * 14;
+
+                          page.drawText('Antecedentes de la Enfermedad Actual:', { x: 50, y, size: 10, font: fontBold, color: colorGray });
+                          y -= 18;
+                          const antecedentesLines = wrapText(internacion.antecedentesEnfermedadActual || 'Sin antecedentes registrados', font, 10, 480);
+                          for (const line of antecedentesLines.slice(0, 4)) {
+                            page.drawText(line, { x: 50, y, size: 10, font, color: colorText });
+                            y -= 14;
+                          }
+                          y -= 10;
+                          if (antecedentesLines.length > 4) y -= (antecedentesLines.length - 4) * 14;
+
+                          page.drawText('Diagnóstico de Ingreso:', { x: 50, y, size: 10, font: fontBold, color: colorGray });
+                          y -= 18;
+                          const diagnosticoLines = wrapText(internacion.diagnosticoIngreso || 'Sin diagnóstico', font, 10, 480);
+                          for (const line of diagnosticoLines.slice(0, 3)) {
+                            page.drawText(line, { x: 50, y, size: 10, font, color: colorText });
+                            y -= 14;
+                          }
+
+                          // Footer
+                          y -= 20;
+                          page.drawLine({ start: { x: 50, y }, end: { x: 250, y }, thickness: 0.5, color: colorGray });
+                          page.drawText('Firma del Médico', { x: 50, y: y - 15, size: 9, font, color: colorGray });
+                          page.drawLine({ start: { x: 320, y }, end: { x: 520, y }, thickness: 0.5, color: colorGray });
+                          page.drawText('Aclaración / Sello', { x: 320, y: y - 15, size: 9, font, color: colorGray });
+                          page.drawText('v2.0', { x: width - 60, y: 30, size: 8, font, color: colorGray });
+
+                          const pdfBytes = await pdfDoc.save();
+                          const blob = new Blob([new Uint8Array(pdfBytes)], { type: 'application/pdf' });
+                          const url = URL.createObjectURL(blob);
+                          const link = document.createElement('a');
+                          link.href = url;
+                          link.download = `FormularioIngreso_${paciente.apellido}_${paciente.dni}.pdf`;
+                          link.click();
+                          URL.revokeObjectURL(url);
+                        } catch (err) {
+                          console.error('Error generating PDF:', err);
+                        }
+                      }}>
+                        <FileDown className="h-4 w-4 mr-2" />
+                        Descargar Formulario de Ingreso
+                      </Button>
+                    </div>
+                  </AccordionContent>
+                </AccordionItem>
+              </Accordion>
+
             </div>
-            {detalleExpandido ? <ChevronUp className="h-5 w-5 text-gray-400" /> : <ChevronDown className="h-5 w-5 text-gray-400" />}
-          </button>
-          {detalleExpandido && (
-            <div className="border-t p-4 space-y-4">
-              <div>
-                <p className="text-gray-500 text-sm">Motivo de Consulta</p>
-                <p className="font-medium">{internacion.motivoConsulta || 'Sin motivo registrado'}</p>
-              </div>
-              <div>
-                <p className="text-gray-500 text-sm">Enfermedad Actual</p>
-                <p className="font-medium">{internacion.enfermedadActual || 'Sin información'}</p>
-              </div>
-              <div>
-                <p className="text-gray-500 text-sm">Antecedentes de Enfermedad Actual</p>
-                <p className="font-medium">{internacion.antecedentesEnfermedadActual || 'Sin antecedentes registrados'}</p>
-              </div>
-              <Button variant="outline" className="bg-blue-50 border-blue-300 text-blue-700 hover:bg-blue-100" onClick={async (e) => {
-                e.stopPropagation();
-                try {
-                  const { PDFDocument, StandardFonts, rgb } = await import('pdf-lib');
-                  const pdfDoc = await PDFDocument.create();
-                  const page = pdfDoc.addPage([595, 842]);
-                  const { width, height } = page.getSize();
-                  
-                  const font = await pdfDoc.embedFont(StandardFonts.Helvetica);
-                  const fontBold = await pdfDoc.embedFont(StandardFonts.HelveticaBold);
-                  
-                  const colorPrimary = rgb(0.18, 0.34, 0.55);
-                  const colorText = rgb(0.13, 0.13, 0.13);
-                  const colorGray = rgb(0.45, 0.45, 0.45);
-                  const colorLightGray = rgb(0.92, 0.92, 0.92);
 
-                  const edad = paciente.fechaNacimiento ? calcularEdad(paciente.fechaNacimiento) : '';
-                  const fechaFormateada = internacion.fechaIngresoClinica ? formatDateDDMMYYYY(internacion.fechaIngresoClinica) : 'N/A';
-                  const fechaHospital = internacion.fechaIngresoHospital ? formatDateDDMMYYYY(internacion.fechaIngresoHospital) : '';
+          </div>
 
-                  // Header
-                  page.drawRectangle({ x: 0, y: height - 100, width, height: 100, color: colorPrimary });
-                  page.drawText('HOSPITAL DONACIÓN F. SANTOJANNI – DIVISIÓN CLÍNICA MÉDICA', { x: 60, y: height - 35, size: 14, font: fontBold, color: rgb(1, 1, 1) });
-                  page.drawText('HISTORIA CLÍNICA DE INGRESO', { x: 170, y: height - 55, size: 12, font: fontBold, color: rgb(1, 1, 1) });
-
-                  let y = height - 140;
-
-                  // Datos Filiatorios
-                  page.drawRectangle({ x: 45, y: y - 8, width: 505, height: 24, color: colorLightGray });
-                  page.drawText('DATOS FILIATORIOS', { x: 50, y: y, size: 12, font: fontBold, color: colorPrimary });
-                  y -= 35;
-
-                  // Primera línea: Fechas y cama
-                  const fechaIngresoHospText = fechaHospital ? `Fecha ingreso al hospital: ${fechaHospital}` : '';
-                  const fechaIngresoClinText = fechaFormateada ? `Fecha ingreso a clínica: ${fechaFormateada}` : '';
-                  const camaText = `Cama: ${cama?.numero || 'N/A'}`;
-                  
-                  page.drawText(fechaIngresoHospText, { x: 50, y, size: 10, font: fontBold, color: colorGray });
-                  page.drawText(fechaIngresoClinText, { x: 260, y, size: 10, font: fontBold, color: colorGray });
-                  y -= 18;
-                  page.drawText(camaText, { x: 50, y, size: 10, font: fontBold, color: colorGray });
-                  y -= 25;
-
-                  // Segunda línea: Apellido, Nombre y DNI
-                  page.drawText(`Apellido y Nombre: ${paciente.apellido || ''}, ${paciente.nombre || ''}`, { x: 50, y, size: 10, font: fontBold, color: colorGray });
-                  y -= 18;
-                  page.drawText(`DNI: ${paciente.dni || ''}`, { x: 50, y, size: 10, font: fontBold, color: colorGray });
-                  page.drawText(`Edad: ${edad ? `${edad} años` : ''}`, { x: 280, y, size: 10, font: fontBold, color: colorGray });
-                  y -= 40;
-
-                  // Datos Clínicos
-                  page.drawRectangle({ x: 45, y: y - 8, width: 505, height: 24, color: colorLightGray });
-                  page.drawText('DATOS CLÍNICOS', { x: 50, y: y, size: 12, font: fontBold, color: colorPrimary });
-                  y -= 35;
-
-                  page.drawText('Motivo de Consulta:', { x: 50, y, size: 10, font: fontBold, color: colorGray });
-                  y -= 18;
-                  const motivoLines = wrapText(internacion.motivoConsulta || 'Sin información', font, 10, 480);
-                  for (const line of motivoLines.slice(0, 4)) {
-                    page.drawText(line, { x: 50, y, size: 10, font, color: colorText });
-                    y -= 14;
-                  }
-                  y -= 10;
-                  if (motivoLines.length > 4) y -= (motivoLines.length - 4) * 14;
-
-                  page.drawText('Enfermedad Actual:', { x: 50, y, size: 10, font: fontBold, color: colorGray });
-                  y -= 18;
-                  const enfermedadLines = wrapText(internacion.enfermedadActual || 'Sin información', font, 10, 480);
-                  for (const line of enfermedadLines.slice(0, 4)) {
-                    page.drawText(line, { x: 50, y, size: 10, font, color: colorText });
-                    y -= 14;
-                  }
-                  y -= 10;
-                  if (enfermedadLines.length > 4) y -= (enfermedadLines.length - 4) * 14;
-
-                  page.drawText('Antecedentes de la Enfermedad Actual:', { x: 50, y, size: 10, font: fontBold, color: colorGray });
-                  y -= 18;
-                  const antecedentesLines = wrapText(internacion.antecedentesEnfermedadActual || 'Sin antecedentes registrados', font, 10, 480);
-                  for (const line of antecedentesLines.slice(0, 4)) {
-                    page.drawText(line, { x: 50, y, size: 10, font, color: colorText });
-                    y -= 14;
-                  }
-                  y -= 10;
-                  if (antecedentesLines.length > 4) y -= (antecedentesLines.length - 4) * 14;
-
-                  page.drawText('Diagnóstico de Ingreso:', { x: 50, y, size: 10, font: fontBold, color: colorGray });
-                  y -= 18;
-                  const diagnosticoLines = wrapText(internacion.diagnosticoIngreso || 'Sin diagnóstico', font, 10, 480);
-                  for (const line of diagnosticoLines.slice(0, 3)) {
-                    page.drawText(line, { x: 50, y, size: 10, font, color: colorText });
-                    y -= 14;
-                  }
-
-                  // Footer
-                  y -= 20;
-                  page.drawLine({ start: { x: 50, y }, end: { x: 250, y }, thickness: 0.5, color: colorGray });
-                  page.drawText('Firma del Médico', { x: 50, y: y - 15, size: 9, font, color: colorGray });
-                  page.drawLine({ start: { x: 320, y }, end: { x: 520, y }, thickness: 0.5, color: colorGray });
-                  page.drawText('Aclaración / Sello', { x: 320, y: y - 15, size: 9, font, color: colorGray });
-                  page.drawText('v2.0', { x: width - 60, y: 30, size: 8, font, color: colorGray });
-
-                  const pdfBytes = await pdfDoc.save();
-                  const blob = new Blob([new Uint8Array(pdfBytes)], { type: 'application/pdf' });
-                  const url = URL.createObjectURL(blob);
-                  const link = document.createElement('a');
-                  link.href = url;
-                  link.download = `FormularioIngreso_${paciente.apellido}_${paciente.dni}.pdf`;
-                  link.click();
-                  URL.revokeObjectURL(url);
-                } catch (err) {
-                  console.error('Error generating PDF:', err);
-                }
-              }}>
-                <FileDown className="h-4 w-4 mr-2" />
-                Descargar Formulario de Ingreso
-              </Button>
-            </div>
-          )}
         </CardContent>
       </Card>
 
+
+
+
+
+
       <Tabs value={tabActivo} onValueChange={setTabActivo}>
         <TabsList className="flex w-full overflow-x-auto gap-1 pb-2">
           <TabsTrigger value="evoluciones" className="flex-shrink-0 flex items-center gap-1 text-xs sm:text-sm">
@@ -544,12 +508,12 @@ export function HistoriaClinica({
         </TabsContent>
 
         <TabsContent value="estudios" className="mt-4">
-          <SeccionEstudiosComplementarios 
-            estudios={estudiosComplementarios} 
-            internacionId={internacion.id} 
+          <SeccionEstudiosComplementarios
+            estudios={estudiosComplementarios}
+            internacionId={internacion.id}
             pacienteId={paciente.id}
-            add={onAgregarEstudioComplementario} 
-            del={onEliminarEstudioComplementario} 
+            add={onAgregarEstudioComplementario}
+            del={onEliminarEstudioComplementario}
           />
         </TabsContent>
       </Tabs>
@@ -665,7 +629,7 @@ function SeccionLaboratorios({ lab, patientId, add, update, del, addAcidoBase }:
     if (tp) res.push({ parametro: 'Tiempo de Protrombina', valor: tp, unidad: 'seg', estado: calcularEstadoLaboratorio('Tiempo de Protrombina', tp) });
     if (kptt) res.push({ parametro: 'KPTT', valor: kptt, unidad: 'seg', estado: calcularEstadoLaboratorio('KPTT', kptt) });
     if (rin) res.push({ parametro: 'INR', valor: rin, unidad: '', estado: calcularEstadoLaboratorio('INR', rin) });
-return res;
+    return res;
   };
 
   const reset = () => {
@@ -683,7 +647,7 @@ return res;
   const parseLaboratorioTexto = (texto: string): { resultados: ResultadoLaboratorio[]; observaciones: string } => {
     const resultados: ResultadoLaboratorio[] = [];
     const observacionesExtra: string[] = [];
-    
+
     const mapeoParametros: Record<string, { nombre: string; unidad: string; esPrincipal: boolean }> = {
       'hematíes': { nombre: 'Hematíes', unidad: '10⁶/µl', esPrincipal: false },
       'hematocrito': { nombre: 'Hematocrito', unidad: '%', esPrincipal: true },
@@ -725,10 +689,10 @@ return res;
     };
 
     const lineas = texto.split('\n');
-    
-for (const linea of lineas) {
+
+    for (const linea of lineas) {
       const lineaLower = linea.toLowerCase().trim();
-      
+
       for (const [clave, info] of Object.entries(mapeoParametros)) {
         if (lineaLower.includes(clave)) {
           // buscar primer valor numérico después de cualquier texto (letra o palabra)
@@ -741,7 +705,7 @@ for (const linea of lineas) {
               if (nombreNormalizado === 'Leucocitos' || nombreNormalizado === 'Plaquetas') {
                 valorFinal = valor * 1000;
               }
-              
+
               if (info.esPrincipal) {
                 resultados.push({
                   parametro: nombreNormalizado,
@@ -757,13 +721,13 @@ for (const linea of lineas) {
         }
       }
     }
-    
+
     return { resultados, observaciones: observacionesExtra.join('\n') };
   };
 
   const parseAcidoBaseTexto = (texto: string): Omit<AcidoBase, 'id'> | null => {
     const lineas = texto.split('\n');
-    
+
     let ph: number | undefined;
     let pco2: number | undefined;
     let po2: number | undefined;
@@ -773,10 +737,10 @@ for (const linea of lineas) {
     let lactato: number | undefined;
     let fio2: number | undefined;
     let fecha = importFecha;
-    
+
     for (const linea of lineas) {
       const cleanLinea = linea.replace(/show_chart|list_alt|\t+/g, ' ').replace(/,/g, '.').replace(/\s+/g, ' ').trim().toLowerCase();
-      
+
       const getValue = (param: string): number | undefined => {
         const idx = cleanLinea.indexOf(param);
         if (idx === -1) return undefined;
@@ -788,7 +752,7 @@ for (const linea of lineas) {
         }
         return undefined;
       };
-      
+
       if (cleanLinea.includes('estado') && cleanLinea.includes('ácido') || cleanLinea.includes('base')) {
         ph = getValue('ph') || (cleanLinea.match(/ph\s+(\d+\.?\d*)/)?.[1] ? parseFloat(cleanLinea.match(/ph\s+(\d+\.?\d*)/)![1]) : undefined);
         pco2 = getValue('pco2') || getValue('pco₂');
@@ -801,7 +765,7 @@ for (const linea of lineas) {
         break;
       }
     }
-    
+
     if (!ph) {
       for (const linea of lineas) {
         const cleanLinea = linea.replace(/show_chart|list_alt|\t+/g, ' ').replace(/,/g, '.').replace(/\s+/g, ' ').trim().toLowerCase();
@@ -816,7 +780,7 @@ for (const linea of lineas) {
           }
           return undefined;
         };
-        
+
         if (cleanLinea.includes('ph') && !cleanLinea.includes('pco2') && !cleanLinea.includes('pco')) { ph = getValue('ph'); }
         else if (cleanLinea.includes('pco2') || cleanLinea.includes('pco₂')) { pco2 = getValue('pco2'); }
         else if (cleanLinea.includes('po2') || cleanLinea.includes('po₂')) { po2 = getValue('po2'); }
@@ -827,7 +791,7 @@ for (const linea of lineas) {
         else if (cleanLinea.includes('fio2')) { fio2 = getValue('fio2'); }
       }
     }
-    
+
     if (ph) {
       return { pacienteId: patientId, fecha, hora: '', ph, pco2: pco2 || 40, po2: po2 || 85, hco3: hco3 || 24, be: be || 0, sato2: sato2 || 97, lactato, fio2, interpretacion: '' };
     }
@@ -837,7 +801,7 @@ for (const linea of lineas) {
   const handleProcesarTexto = () => {
     const { resultados, observaciones } = parseLaboratorioTexto(importTexto);
     const acidoBase = parseAcidoBaseTexto(importTexto);
-    
+
     setImportResultados(resultados);
     setImportObservaciones(observaciones);
     setImportAcidoBase(acidoBase);
@@ -846,11 +810,11 @@ for (const linea of lineas) {
   const handleImportarLaboratorio = () => {
     if (!addAcidoBase) return;
     if (importResultados.length === 0 && !importObservaciones && !importAcidoBase) return;
-    
+
     if (importAcidoBase) {
       addAcidoBase({ ...importAcidoBase, fecha: importFecha, hora: importHora });
     }
-    
+
     add({
       pacienteId: patientId,
       fecha: importFecha,
@@ -858,7 +822,7 @@ for (const linea of lineas) {
       resultados: importResultados,
       observaciones: importObservaciones
     });
-    
+
     setImportDialog(false);
     setImportTexto('');
     setImportResultados([]);
@@ -1023,17 +987,17 @@ for (const linea of lineas) {
                     <CartesianGrid strokeDasharray="3 3" className="opacity-30" />
                     <XAxis dataKey="fecha" tick={{ fontSize: 12 }} />
                     <YAxis tick={{ fontSize: 12 }} domain={['auto', 'auto']} />
-                    <Tooltip 
-                      contentStyle={{ 
-                        backgroundColor: 'hsl(var(--card))', 
+                    <Tooltip
+                      contentStyle={{
+                        backgroundColor: 'hsl(var(--card))',
                         border: '1px solid hsl(var(--border))',
                         borderRadius: '8px'
                       }}
                     />
-                    <Line 
-                      type="monotone" 
-                      dataKey="valor" 
-                      stroke="hsl(var(--primary))" 
+                    <Line
+                      type="monotone"
+                      dataKey="valor"
+                      stroke="hsl(var(--primary))"
                       strokeWidth={2}
                       dot={{ fill: 'hsl(var(--primary))', r: 4 }}
                     />
@@ -1075,7 +1039,7 @@ for (const linea of lineas) {
             </div>
             <div>
               <Label>Pegar texto del resultado de laboratorio</Label>
-              <textarea 
+              <textarea
                 className="w-full p-2 border rounded-md text-sm min-h-[200px] font-mono"
                 placeholder="Pegue aquí el texto del resultado de laboratorio..."
                 value={importTexto}
@@ -1086,7 +1050,7 @@ for (const linea of lineas) {
               <FileText className="h-4 w-4 mr-2" />
               Procesar Texto
             </Button>
-            
+
             {importResultados.length > 0 && (
               <div className="border rounded-md max-h-48 overflow-y-auto">
                 <Table>
@@ -1109,7 +1073,7 @@ for (const linea of lineas) {
                 </Table>
               </div>
             )}
-            
+
             {importAcidoBase && (
               <div className="border rounded-md p-3 bg-green-50">
                 <p className="text-sm font-medium mb-2 flex items-center gap-2">
@@ -1128,14 +1092,14 @@ for (const linea of lineas) {
                 </div>
               </div>
             )}
-            
+
             {importObservaciones && (
               <div className="border rounded-md p-3 bg-muted/50">
                 <p className="text-sm font-medium mb-1">Valores adicionales en observaciones:</p>
                 <p className="text-sm whitespace-pre-wrap">{importObservaciones}</p>
               </div>
             )}
-            
+
             {importResultados.length === 0 && !importObservaciones && !importAcidoBase && importTexto && (
               <div className="text-center py-4 text-gray-500">
                 <p>No se detectaron parámetros. Verifique que el texto contenga los nombres correctos.</p>
@@ -1146,7 +1110,7 @@ for (const linea of lineas) {
             <Button variant="outline" onClick={() => setImportDialog(false)}>Cancelar</Button>
             <Button onClick={handleImportarLaboratorio} disabled={importResultados.length === 0 && !importObservaciones && !importAcidoBase}>
               <Save className="h-4 w-4 mr-2" />
-              {(importAcidoBase ? 'Guardar Gasometría' : 'Guardar Laboratorio')}
+              {(importAcidoBase ? 'Guardar' : 'Guardar Laboratorio')}
             </Button>
           </div>
         </DialogContent>
@@ -1156,9 +1120,9 @@ for (const linea of lineas) {
         <div className="text-center py-8 text-gray-400"><FlaskConical className="h-12 w-12 mx-auto mb-2 opacity-50" /><p>No hay laboratorios</p></div>
       ) : (
         <div className="relative w-full overflow-auto grid grid-cols-1">
-          
-            <Table>
-              <TableHeader>
+
+          <Table>
+            <TableHeader>
               <TableRow>
                 <TableHead className="cursor-pointer hover:bg-muted" onClick={() => setLabSortAsc(!labSortAsc)}>
                   Fecha {labSortAsc ? '↑' : '↓'}
@@ -1231,8 +1195,8 @@ for (const linea of lineas) {
               ))}
             </TableBody>
           </Table>
-          </div>
-        
+        </div>
+
       )}
     </div>
   );
@@ -1567,8 +1531,8 @@ function SeccionAcidosBase({ ab, patientId, add, update, del }: {
                 <div className="flex items-start justify-between">
                   <div><p className="font-medium">{a.fecha} {a.hora}</p></div>
                   <div className="flex items-center gap-2">
-                    
-                    <Badge variant="outline" className="text-xs">{a.fio2 && a.po2 &&<span className="mr-1">PaFiO2: {Math.round(a.po2 / a.fio2 * 100) / 100}</span>}</Badge>
+
+                    <Badge variant="outline" className="text-xs">{a.fio2 && a.po2 && <span className="mr-1">PaFiO2: {Math.round(a.po2 / a.fio2 * 100) / 100}</span>}</Badge>
                     <Badge variant="outline" className="text-xs">{a.fio2 && <span className="mr-1">FiO₂:{a.fio2}</span>}</Badge>
                     <Badge className={getColorPh(a.ph)}>pH: {a.ph}</Badge>
                     <Button size="sm" variant="ghost" className="text-blue-600" onClick={() => loadEdit(a)}><Edit /></Button>
@@ -1583,7 +1547,7 @@ function SeccionAcidosBase({ ab, patientId, add, update, del }: {
                   <div className="bg-gray-50 p-2 rounded text-center"><p className="text-xs text-gray-500">BE</p><p className="font-bold">{a.be}</p></div>
                   <div className="bg-gray-50 p-2 rounded text-center"><p className="text-xs text-gray-500">SatO2</p><p className="font-bold">{a.sato2}%</p></div>
                   {a.lactato && <div className="bg-gray-50 p-2 rounded text-center"><p className="text-xs text-gray-500">Lactato</p><p className="font-bold">{a.lactato}</p></div>}
-                  
+
                   {a.fio2 && <div className="bg-gray-50 p-2 rounded text-center"><p className="text-xs text-gray-500">FiO2</p><p className="font-bold">{a.fio2}</p></div>}
                 </div>
                 {a.interpretacion && <div className="bg-teal-50 p-3 rounded-lg border border-teal-200"><p className="text-sm font-medium text-teal-800">Interpretación: {a.interpretacion}</p></div>}
@@ -1626,7 +1590,7 @@ function SeccionCultivos({ cults, patient, add, update, del }: {
     setSelected(null);
   };
 
-const resetRes = () => {
+  const resetRes = () => {
     setFechaResultado(new Date().toISOString().split('T')[0]);
     setEstadoResultado('Positivo');
     setGermen('');
@@ -1798,73 +1762,73 @@ const resetRes = () => {
       <div>
         <div className="grid grid-cols-1 gap-4">
           {cs.length === 0 ? <div className="text-center py-8 text-gray-400"><Microscope className="h-12 w-12 mx-auto mb-2 opacity-50" /><p>No hay cultivos</p></div> :
-        cs.map(c => (
-          <Card key={c.id} className="hover:shadow-md transition-shadow"><CardContent className="p-4">
-            <div className="flex flex-col gap-3">
-              <div className="flex flex-col sm:flex-row sm:items-start sm:justify-between gap-4">
-                <div className="flex items-center gap-3">
-                  <div className={`h-10 w-10 rounded-full flex items-center justify-center flex-shrink-0 ${c.estado === 'NAF/Pendiente' ? 'bg-amber-100' : c.estado === 'Parcial' ? 'bg-orange-100' : c.estado === 'Positivo' ? 'bg-red-100' : 'bg-green-100'}`}>
-                    <Microscope className={`h-5 w-5 ${c.estado === 'NAF/Pendiente' ? 'text-amber-600' : c.estado === 'Parcial' ? 'text-orange-600' : c.estado === 'Positivo' ? 'text-red-600' : 'text-green-600'}`} />
-                  </div>
-                  <div>
-                    <p className="font-medium">{c.fechaToma}</p>
-                    <div className="flex items-center gap-2 text-sm text-gray-500">
-                      <Badge variant="outline">{c.tipoMuestra}</Badge>
-                      <Badge className={getEstadoColor(c.estado)}>{getEstadoLabel(c.estado)}</Badge>
+            cs.map(c => (
+              <Card key={c.id} className="hover:shadow-md transition-shadow"><CardContent className="p-4">
+                <div className="flex flex-col gap-3">
+                  <div className="flex flex-col sm:flex-row sm:items-start sm:justify-between gap-4">
+                    <div className="flex items-center gap-3">
+                      <div className={`h-10 w-10 rounded-full flex items-center justify-center flex-shrink-0 ${c.estado === 'NAF/Pendiente' ? 'bg-amber-100' : c.estado === 'Parcial' ? 'bg-orange-100' : c.estado === 'Positivo' ? 'bg-red-100' : 'bg-green-100'}`}>
+                        <Microscope className={`h-5 w-5 ${c.estado === 'NAF/Pendiente' ? 'text-amber-600' : c.estado === 'Parcial' ? 'text-orange-600' : c.estado === 'Positivo' ? 'text-red-600' : 'text-green-600'}`} />
+                      </div>
+                      <div>
+                        <p className="font-medium">{c.fechaToma}</p>
+                        <div className="flex items-center gap-2 text-sm text-gray-500">
+                          <Badge variant="outline">{c.tipoMuestra}</Badge>
+                          <Badge className={getEstadoColor(c.estado)}>{getEstadoLabel(c.estado)}</Badge>
+                        </div>
+                      </div>
+                    </div>
+                    <div className="flex flex-wrap items-center gap-2">
+                      {c.estado === 'NAF/Pendiente' && (
+                        <>
+                          <Button size="sm" variant="outline" onClick={() => openParcial(c)}><AlertCircle className="h-4 w-4 mr-1" />Parcial</Button>
+                          <Button size="sm" variant="outline" onClick={() => { openDefinitivo(c); setIsParcialMode(false); }}><CheckCircle2 className="h-4 w-4 mr-1" />Definitivo</Button>
+                        </>
+                      )}
+                      {c.estado === 'Parcial' && (
+                        <>
+                          <Button size="sm" variant="outline" onClick={() => openParcial(c)}><Pencil className="h-4 w-4 mr-1" />Editar Parcial</Button>
+                          <Button size="sm" variant="outline" onClick={() => openDefinitivo(c)}><CheckCircle2 className="h-4 w-4 mr-1" />Definitivo</Button>
+                        </>
+                      )}
+                      {(c.estado === 'Positivo' || c.estado === 'Negativo') && <Button size="sm" variant="outline" onClick={() => openDefinitivo(c)}><Pencil className="h-4 w-4" /></Button>}
+                      <Button size="sm" variant="outline" className="text-red-600" onClick={() => del(c.id)}><Trash2 /></Button>
                     </div>
                   </div>
-                </div>
-                <div className="flex flex-wrap items-center gap-2">
-                  {c.estado === 'NAF/Pendiente' && (
-                    <>
-                      <Button size="sm" variant="outline" onClick={() => openParcial(c)}><AlertCircle className="h-4 w-4 mr-1" />Parcial</Button>
-                      <Button size="sm" variant="outline" onClick={() => { openDefinitivo(c); setIsParcialMode(false); }}><CheckCircle2 className="h-4 w-4 mr-1" />Definitivo</Button>
-                    </>
+                  {c.protocolo && <p className="text-xs text-gray-500">Protocolo: {c.protocolo}</p>}
+                  {c.observaciones && <p className="text-sm text-gray-600 bg-gray-50 p-2 rounded">{c.observaciones}</p>}
+                  {c.estado === 'Parcial' && c.germen && (
+                    <div className="bg-orange-50 p-3 rounded-lg border border-orange-200">
+                      <p className="text-sm font-medium text-orange-800 flex items-center gap-2"><AlertCircle className="h-4 w-4" />PARCIAL - Germen: {c.germen}</p>
+                      {(c.sensible || c.resistente) && (
+                        <div className="mt-2 space-y-1">
+                          {c.sensible && <p className="text-xs text-orange-700">Sensible: {c.sensible}</p>}
+                          {c.resistente && <p className="text-xs text-orange-700">Resistente: {c.resistente}</p>}
+                        </div>
+                      )}
+                    </div>
                   )}
-                  {c.estado === 'Parcial' && (
-                    <>
-                      <Button size="sm" variant="outline" onClick={() => openParcial(c)}><Pencil className="h-4 w-4 mr-1" />Editar Parcial</Button>
-                      <Button size="sm" variant="outline" onClick={() => openDefinitivo(c)}><CheckCircle2 className="h-4 w-4 mr-1" />Definitivo</Button>
-                    </>
+                  {c.estado === 'Positivo' && c.germen && (
+                    <div className="bg-red-50 p-3 rounded-lg border border-red-200">
+                      <p className="text-sm font-medium text-red-800 flex items-center gap-2"><AlertCircle className="h-4 w-4" />Germen: {c.germen}</p>
+                      {c.fechaResultado && <p className="text-xs text-red-600 mt-1">Resultado: {c.fechaResultado}</p>}
+                      {(c.sensible || c.resistente) && (
+                        <div className="mt-2 space-y-2">
+                          {c.sensible && <div><p className="text-xs font-medium text-green-700 mb-1">Sensible a:</p><p className="text-sm text-green-800">{c.sensible}</p></div>}
+                          {c.resistente && <div><p className="text-xs font-medium text-red-700 mb-1">Resistente a:</p><p className="text-sm text-red-800">{c.resistente}</p></div>}
+                        </div>
+                      )}
+                    </div>
                   )}
-                  {(c.estado === 'Positivo' || c.estado === 'Negativo') && <Button size="sm" variant="outline" onClick={() => openDefinitivo(c)}><Pencil className="h-4 w-4" /></Button>}
-                  <Button size="sm" variant="outline" className="text-red-600" onClick={() => del(c.id)}><Trash2 /></Button>
-                </div>
-              </div>
-              {c.protocolo && <p className="text-xs text-gray-500">Protocolo: {c.protocolo}</p>}
-              {c.observaciones && <p className="text-sm text-gray-600 bg-gray-50 p-2 rounded">{c.observaciones}</p>}
-              {c.estado === 'Parcial' && c.germen && (
-                <div className="bg-orange-50 p-3 rounded-lg border border-orange-200">
-                  <p className="text-sm font-medium text-orange-800 flex items-center gap-2"><AlertCircle className="h-4 w-4" />PARCIAL - Germen: {c.germen}</p>
-                  {(c.sensible || c.resistente) && (
-                    <div className="mt-2 space-y-1">
-                      {c.sensible && <p className="text-xs text-orange-700">Sensible: {c.sensible}</p>}
-                      {c.resistente && <p className="text-xs text-orange-700">Resistente: {c.resistente}</p>}
+                  {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">
+                      <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>
                   )}
                 </div>
-              )}
-              {c.estado === 'Positivo' && c.germen && (
-                <div className="bg-red-50 p-3 rounded-lg border border-red-200">
-                  <p className="text-sm font-medium text-red-800 flex items-center gap-2"><AlertCircle className="h-4 w-4" />Germen: {c.germen}</p>
-                  {c.fechaResultado && <p className="text-xs text-red-600 mt-1">Resultado: {c.fechaResultado}</p>}
-                  {(c.sensible || c.resistente) && (
-                    <div className="mt-2 space-y-2">
-                      {c.sensible && <div><p className="text-xs font-medium text-green-700 mb-1">Sensible a:</p><p className="text-sm text-green-800">{c.sensible}</p></div>}
-                      {c.resistente && <div><p className="text-xs font-medium text-red-700 mb-1">Resistente a:</p><p className="text-sm text-red-800">{c.resistente}</p></div>}
-                    </div>
-                  )}
-                </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">
-                  <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>
-              )}
-            </div>
-          </CardContent></Card>
-          ))}
+              </CardContent></Card>
+            ))}
         </div>
       </div>
     </div>
@@ -1884,7 +1848,7 @@ function SeccionEstudiosComplementarios({ estudios, internacionId, pacienteId, a
   const [tipo, setTipo] = useState('');
   const [resultado, setResultado] = useState('');
 
-  const estudiosFiltrados = filtro === 'internacion' 
+  const estudiosFiltrados = filtro === 'internacion'
     ? estudios.filter(e => e.internacionId === internacionId)
     : estudios;
 
@@ -1939,15 +1903,15 @@ function SeccionEstudiosComplementarios({ estudios, internacionId, pacienteId, a
             </div>
             <div>
               <Label>Tipo de Estudio</Label>
-              <Input 
-                value={tipo} 
-                onChange={e => setTipo(e.target.value)} 
+              <Input
+                value={tipo}
+                onChange={e => setTipo(e.target.value)}
                 placeholder="Ej: Radiografía de tórax, ECG, Tomografía, etc."
               />
             </div>
             <div>
               <Label>Resultado</Label>
-              <textarea 
+              <textarea
                 className="w-full p-2 border rounded-md text-sm min-h-[100px]"
                 value={resultado}
                 onChange={e => setResultado(e.target.value)}
diff --git a/src/sections/Internaciones.tsx b/src/sections/Internaciones.tsx
index d8f4983..d0cacab 100644
--- a/src/sections/Internaciones.tsx
+++ b/src/sections/Internaciones.tsx
@@ -19,10 +19,10 @@ interface InternacionesProps {
   cultivos?: Cultivo[];
   areas: Area[];
   onIniciarInternacion: (internacion: Omit<Internacion, 'id' | 'activa'>) => void;
-  onFinalizarInternacion: (internacionId: string, datos: { 
-    fechaEgreso: string; 
-    diagnosticoEgreso: string; 
-    motivoEgreso: Internacion['motivoEgreso'] 
+  onFinalizarInternacion: (internacionId: string, datos: {
+    fechaEgreso: string;
+    diagnosticoEgreso: string;
+    motivoEgreso: Internacion['motivoEgreso']
   }) => void;
   getPacienteById: (id: string) => Paciente | undefined;
   getCamaById: (id: string) => Cama | undefined;
@@ -30,11 +30,11 @@ interface InternacionesProps {
   onNuevoIngreso?: () => void;
 }
 
-export function Internaciones({ 
-  internaciones, 
-  pacientes, 
+export function Internaciones({
+  internaciones,
+  pacientes,
   camas,
-  onIniciarInternacion, 
+  onIniciarInternacion,
   onFinalizarInternacion,
   getPacienteById,
   getCamaById,
@@ -54,7 +54,7 @@ export function Internaciones({
   const [motivoConsulta, setMotivoConsulta] = useState('');
   const [antecedentesEnfermedadActual, setAntecedentesEnfermedadActual] = useState('');
   const [medicoIngresante, setMedicoIngresante] = useState('');
-  
+
   // Formulario nueva internación
   const [fechaEgreso, setFechaEgreso] = useState('');
   const [diagnosticoEgreso, setDiagnosticoEgreso] = useState('');
@@ -106,17 +106,17 @@ export function Internaciones({
 
   const internacionesFiltradas = internaciones.filter(i => {
     const paciente = getPacienteById(i.pacienteId);
-    const cumpleBusqueda = !busqueda || 
+    const cumpleBusqueda = !busqueda ||
       (paciente && (
         paciente.nombre.toLowerCase().includes(busqueda.toLowerCase()) ||
         paciente.apellido.toLowerCase().includes(busqueda.toLowerCase()) ||
         paciente.dni.includes(busqueda)
       ));
-    
-    const cumpleEstado = filtroEstado === 'todas' || 
+
+    const cumpleEstado = filtroEstado === 'todas' ||
       (filtroEstado === 'activas' && i.activa) ||
       (filtroEstado === 'finalizadas' && !i.activa);
-    
+
     return cumpleBusqueda && cumpleEstado;
   }).sort((a, b) => new Date(b.fechaIngresoClinica || '').getTime() - new Date(a.fechaIngresoClinica || '').getTime());
 
@@ -251,18 +251,18 @@ export function Internaciones({
               </div>
               <div>
                 <Label>Médico Ingresante *</Label>
-                <Input 
+                <Input
                   value={medicoIngresante}
                   onChange={(e) => setMedicoIngresante(e.target.value)}
                   placeholder="Nombre del médico ingresante"
                 />
               </div>
-<Button variant="outline"
-                 className="w-full"
-                 onClick={handleIniciarInternacion}
-                 disabled={!pacienteSeleccionado || !camaSeleccionada || !motivoConsulta || !enfermedadActual || !medicoIngresante}
-               >
-                 <Plus className="h-4 w-4 mr-2" />
+              <Button variant="outline"
+                className="w-full"
+                onClick={handleIniciarInternacion}
+                disabled={!pacienteSeleccionado || !camaSeleccionada || !motivoConsulta || !enfermedadActual || !medicoIngresante}
+              >
+                <Plus className="h-4 w-4 mr-2" />
                 Iniciar Internación
               </Button>
             </div>
@@ -304,15 +304,14 @@ export function Internaciones({
         {internacionesFiltradas.map((internacion) => {
           const paciente = getPacienteById(internacion.pacienteId);
           const cama = getCamaById(internacion.camaId);
-          
+
           return (
             <Card key={internacion.id} className="hover:shadow-md transition-shadow">
-<CardContent className="p-4 dark:bg-gray-800">
+              <CardContent className="p-4 dark:bg-gray-800">
                 <div className="flex flex-col lg:flex-row lg:items-start lg:justify-between gap-4">
                   <div className="flex items-start gap-4">
-                    <div className={`h-12 w-12 rounded-full flex items-center justify-center flex-shrink-0 ${
-                      internacion.activa ? 'bg-purple-100' : 'bg-gray-100'
-                    }`}>
+                    <div className={`h-12 w-12 rounded-full flex items-center justify-center flex-shrink-0 ${internacion.activa ? 'bg-purple-100' : 'bg-gray-100'
+                      }`}>
                       {internacion.activa ? (
                         <ClipboardList className="h-6 w-6 text-purple-600" />
                       ) : (
@@ -371,8 +370,8 @@ export function Internaciones({
                     {internacion.activa && (
                       <Dialog open={dialogoEgresoAbierto && internacionSeleccionada?.id === internacion.id} onOpenChange={setDialogoEgresoAbierto}>
                         <DialogTrigger asChild>
-                          <Button 
-                            variant="outline" 
+                          <Button
+                            variant="outline"
                             className="whitespace-nowrap"
                             onClick={() => abrirDialogoEgreso(internacion)}
                           >
@@ -387,14 +386,14 @@ export function Internaciones({
                           <div className="space-y-4">
                             <div>
                               <Label>Paciente</Label>
-                              <Input 
+                              <Input
                                 value={paciente ? `${paciente.apellido}, ${paciente.nombre}` : ''}
                                 disabled
                               />
                             </div>
                             <div>
                               <Label>Fecha de Egreso *</Label>
-                              <Input 
+                              <Input
                                 type="date"
                                 value={fechaEgreso}
                                 onChange={(e) => setFechaEgreso(e.target.value)}
@@ -425,13 +424,13 @@ export function Internaciones({
                               />
                             </div>
                             <Button variant="outline"
-                             className="w-full"
-                             onClick={handleFinalizarInternacion}
-                             disabled={!fechaEgreso || !diagnosticoEgreso || !motivoEgreso}
-                           >
-                             <CheckCircle2 className="h-4 w-4 mr-2" />
-                             Confirmar Egreso
-                           </Button>
+                              className="w-full"
+                              onClick={handleFinalizarInternacion}
+                              disabled={!fechaEgreso || !diagnosticoEgreso || !motivoEgreso}
+                            >
+                              <CheckCircle2 className="h-4 w-4 mr-2" />
+                              Confirmar Egreso
+                            </Button>
                           </div>
                         </DialogContent>
                       </Dialog>
@@ -450,8 +449,8 @@ export function Internaciones({
         <div className="text-center py-12 text-gray-400">
           <ClipboardList className="h-16 w-16 mx-auto mb-4 opacity-50" />
           <p className="text-lg">
-            {busqueda || filtroEstado !== 'todas' 
-              ? 'No se encontraron internaciones con esos filtros' 
+            {busqueda || filtroEstado !== 'todas'
+              ? 'No se encontraron internaciones con esos filtros'
               : 'No hay internaciones registradas'}
           </p>
         </div>
diff --git a/src/sections/MapaCamas.tsx b/src/sections/MapaCamas.tsx
index 07809bc..f7939f5 100644
--- a/src/sections/MapaCamas.tsx
+++ b/src/sections/MapaCamas.tsx
@@ -26,12 +26,12 @@ interface MapaCamasProps {
   getInternacionById: (id: string) => Internacion | undefined;
 }
 
-export function MapaCamas({ 
+export function MapaCamas({
   camas,
   areas,
-  pacientes, 
+  pacientes,
   internaciones,
-  onActualizarCama, 
+  onActualizarCama,
   onAgregarCama,
   onEliminarCama,
   onIniciarInternacion,
@@ -117,7 +117,7 @@ export function MapaCamas({
     const getOrden = (sala: number) => {
       const grupo = Math.floor(sala / 100);
       const esPar = sala % 2 === 0;
-      
+
       if (grupo === 2) {
         if (esPar) return { grupo: 2, suborden: 0, sala }; // 2XX pares, menor a mayor
         return { grupo: 1, suborden: 1, sala }; // 2XX impares, mayor a menor
@@ -173,7 +173,7 @@ export function MapaCamas({
     return !internacionActiva;
   });
 
-return (
+  return (
     <div className="space-y-6 dark:text-white">
       <div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4">
         <div>
@@ -187,25 +187,25 @@ return (
           <Badge variant="outline" className="bg-red-50 text-red-700">
             {camas.filter(c => c.estado === 'Ocupada').length} Ocupadas
           </Badge>
-        <div className="ml-4 flex items-center gap-2 flex-wrap sm:flex-nowrap">
-          <Button variant="outline" onClick={() => {
-            setEditingAreaId(null);
-            setAreaNombre('');
-            setAreaDialogOpen(true);
-          }} className="text-xs px-2 py-1 sm:text-sm sm:px-4 sm:py-2">
-            Administrar Áreas
-          </Button>
-          <Button variant="outline" onClick={() => {
-            setEditingBed(null);
-            setBedNumero('');
-            setBedTipo('General');
-            setBedAreaId(areas?.[0]?.id);
-            setBedDialogOpen(true);
-          }} className="text-xs px-2 py-1 sm:text-sm sm:px-4 sm:py-2">
-            <Plus className="h-3 w-3 sm:h-4 sm:w-4 sm:mr-1" />
-            <span className="hidden sm:inline">Agregar Cama</span>
-          </Button>
-        </div>
+          <div className="ml-4 flex items-center gap-2 flex-wrap sm:flex-nowrap">
+            <Button variant="outline" onClick={() => {
+              setEditingAreaId(null);
+              setAreaNombre('');
+              setAreaDialogOpen(true);
+            }} className="text-xs px-2 py-1 sm:text-sm sm:px-4 sm:py-2">
+              Administrar Áreas
+            </Button>
+            <Button variant="outline" onClick={() => {
+              setEditingBed(null);
+              setBedNumero('');
+              setBedTipo('General');
+              setBedAreaId(areas?.[0]?.id);
+              setBedDialogOpen(true);
+            }} className="text-xs px-2 py-1 sm:text-sm sm:px-4 sm:py-2">
+              <Plus className="h-3 w-3 sm:h-4 sm:w-4 sm:mr-1" />
+              <span className="hidden sm:inline">Agregar Cama</span>
+            </Button>
+          </div>
         </div>
       </div>
 
@@ -265,11 +265,11 @@ return (
         {sortedCamas.map((cama) => {
           const paciente = cama.pacienteId ? getPacienteById(cama.pacienteId) : null;
           const internacion = cama.internacionId ? getInternacionById(cama.internacionId) : null;
-          
+
           return (
             <Dialog key={cama.id}>
               <DialogTrigger asChild>
-                <Card 
+                <Card
                   className={`cursor-pointer hover:shadow-md transition-shadow border-2 w-full ${getEstadoColor(cama)}`}
                   onClick={() => setCamaSeleccionada(cama)}
                 >
@@ -291,12 +291,12 @@ return (
                       </div>
                     )}
 
-                   
+
                   </CardContent>
                 </Card>
               </DialogTrigger>
               <DialogContent className="sm:max-w-md">
-                  <DialogHeader>
+                <DialogHeader>
                   <DialogTitle className="flex items-center gap-2">
                     <Bed className="h-5 w-5" />
                     Cama {cama.numero} - {cama.areaId ? areaById[cama.areaId] ?? 'Área desconocida' : 'Sin área'}
@@ -309,7 +309,7 @@ return (
                     </Badge>
                     <Badge variant="outline">{cama.tipo}</Badge>
                   </div>
-                  
+
                   {cama.estado === 'Ocupada' && paciente && internacion && (
                     <div className="bg-gray-50 p-4 rounded-lg space-y-2">
                       <p className="font-medium">Paciente:</p>
@@ -328,7 +328,7 @@ return (
                         <Dialog open={dialogoAbierto} onOpenChange={setDialogoAbierto}>
                           <DialogTrigger asChild>
                             <Button variant="outline"
-                              className="w-full" 
+                              className="w-full"
                               onClick={() => {
                                 setCamaSeleccionada(cama);
                                 setDialogoAbierto(true);
@@ -398,22 +398,22 @@ return (
                                   placeholder="Nombre del médico..."
                                 />
                               </div>
-<Button variant="outline"
-                                 className="w-full" 
-                                 onClick={handleOcuparCama}
-                                 disabled={!pacienteSeleccionado || !diagnostico || !enfermedadActual || !medico}
-                               >
-                                 <Plus className="h-4 w-4 mr-1" />
-                                 Iniciar Internación
-                               </Button>
+                              <Button variant="outline"
+                                className="w-full"
+                                onClick={handleOcuparCama}
+                                disabled={!pacienteSeleccionado || !diagnostico || !enfermedadActual || !medico}
+                              >
+                                <Plus className="h-4 w-4 mr-1" />
+                                Iniciar Internación
+                              </Button>
                             </div>
                           </DialogContent>
                         </Dialog>
                       )}
-                      
+
                       {cama.estado !== 'Disponible' && (
-                        <Button 
-                          variant="outline" 
+                        <Button
+                          variant="outline"
                           className="w-full"
                           onClick={() => handleCambiarEstado(cama, 'Disponible')}
                         >
@@ -421,10 +421,10 @@ return (
                           Disponible
                         </Button>
                       )}
-                      
+
                       {cama.estado !== 'Reparacion' && (
-                        <Button 
-                          variant="outline" 
+                        <Button
+                          variant="outline"
                           className="w-full"
                           onClick={() => handleCambiarEstado(cama, 'Reparacion')}
                         >
@@ -432,10 +432,10 @@ return (
                           Reparacion
                         </Button>
                       )}
-               
+
                       {cama.estado !== 'Reservada' && (
-                        <Button 
-                          variant="outline" 
+                        <Button
+                          variant="outline"
                           className="w-full"
                           onClick={() => handleCambiarEstado(cama, 'Reservada')}
                         >
@@ -444,7 +444,7 @@ return (
                         </Button>
                       )}
 
-                       
+
                       <Button variant="outline" onClick={() => {
                         setEditingBed(cama);
                         setBedNumero(cama.numero);
@@ -462,9 +462,9 @@ return (
                         <Trash className="h-4 w-4 mr-1" />Eliminar
                       </Button>
                     </div>
-                    </div>
                   </div>
-                
+                </div>
+
               </DialogContent>
             </Dialog>
           );
diff --git a/src/sections/Pacientes.tsx b/src/sections/Pacientes.tsx
index 8dd338a..fb646b1 100644
--- a/src/sections/Pacientes.tsx
+++ b/src/sections/Pacientes.tsx
@@ -18,17 +18,17 @@ interface PacientesProps {
   onEliminar: (id: string) => void;
 }
 
-export function Pacientes({ 
-  pacientes, 
+export function Pacientes({
+  pacientes,
   internaciones,
-  onAgregar, 
-  onActualizar, 
-  onEliminar 
+  onAgregar,
+  onActualizar,
+  onEliminar
 }: PacientesProps) {
   const [busqueda, setBusqueda] = useState('');
   const [dialogoAbierto, setDialogoAbierto] = useState(false);
   const [pacienteEditando, setPacienteEditando] = useState<Paciente | null>(null);
-  
+
   // Formulario
   const [nombre, setNombre] = useState('');
   const [apellido, setApellido] = useState('');
@@ -116,7 +116,7 @@ export function Pacientes({
     setDialogoAbierto(false);
   };
 
-  const pacientesFiltrados = pacientes.filter(p => 
+  const pacientesFiltrados = pacientes.filter(p =>
     p.nombre.toLowerCase().includes(busqueda.toLowerCase()) ||
     p.apellido.toLowerCase().includes(busqueda.toLowerCase()) ||
     p.dni.includes(busqueda)
@@ -162,33 +162,33 @@ export function Pacientes({
             <div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
               <div>
                 <Label>Nombre *</Label>
-                <Input 
-                  value={nombre} 
+                <Input
+                  value={nombre}
                   onChange={(e) => setNombre(e.target.value)}
                   placeholder="Nombre del paciente"
                 />
               </div>
               <div>
                 <Label>Apellido *</Label>
-                <Input 
-                  value={apellido} 
+                <Input
+                  value={apellido}
                   onChange={(e) => setApellido(e.target.value)}
                   placeholder="Apellido del paciente"
                 />
               </div>
               <div>
                 <Label>DNI *</Label>
-                <Input 
-                  value={dni} 
+                <Input
+                  value={dni}
                   onChange={(e) => setDni(e.target.value)}
                   placeholder="Número de DNI"
                 />
               </div>
               <div>
                 <Label>Fecha de Nacimiento *</Label>
-                <Input 
+                <Input
                   type="date"
-                  value={fechaNacimiento} 
+                  value={fechaNacimiento}
                   onChange={(e) => setFechaNacimiento(e.target.value)}
                 />
               </div>
@@ -215,24 +215,24 @@ export function Pacientes({
               </div>
               <div>
                 <Label>Obra Social</Label>
-                <Input 
-                  value={obraSocial} 
+                <Input
+                  value={obraSocial}
                   onChange={(e) => setObraSocial(e.target.value)}
                   placeholder="Obra social del paciente"
                 />
               </div>
               <div>
                 <Label>Nacionalidad</Label>
-                <Input 
-                  value={nacionalidad} 
+                <Input
+                  value={nacionalidad}
                   onChange={(e) => setNacionalidad(e.target.value)}
                   placeholder="Nacionalidad del paciente"
                 />
               </div>
               <div>
                 <Label>Dirección</Label>
-                <Input 
-                  value={direccion} 
+                <Input
+                  value={direccion}
                   onChange={(e) => setDireccion(e.target.value)}
                   placeholder="Dirección del paciente"
                 />
@@ -257,8 +257,8 @@ export function Pacientes({
               </div>
               <div className="sm:col-span-2">
                 <Label>Teléfono Contacto</Label>
-                <Input 
-                  value={telefono} 
+                <Input
+                  value={telefono}
                   onChange={(e) => setTelefono(e.target.value)}
                   placeholder="Teléfono de contacto"
                 />
@@ -300,12 +300,12 @@ export function Pacientes({
                 Cancelar
               </Button>
               <Button variant="outline"
-                 onClick={handleGuardar}
-                 disabled={!nombre || !apellido || !dni || !fechaNacimiento}
-               >
-                 <Save className="h-4 w-4 mr-2" />
-                 {pacienteEditando ? 'Guardar Cambios' : 'Crear Paciente'}
-               </Button>
+                onClick={handleGuardar}
+                disabled={!nombre || !apellido || !dni || !fechaNacimiento}
+              >
+                <Save className="h-4 w-4 mr-2" />
+                {pacienteEditando ? 'Guardar Cambios' : 'Crear Paciente'}
+              </Button>
             </div>
           </DialogContent>
         </Dialog>
@@ -330,7 +330,7 @@ export function Pacientes({
       <div className="grid grid-cols-1 gap-4">
         {pacientesFiltrados.map((paciente) => (
           <Card key={paciente.id} className="hover:shadow-md transition-shadow">
-<CardContent className="p-4 dark:bg-gray-800">
+            <CardContent className="p-4 dark:bg-gray-800">
               <div className="flex flex-col sm:flex-row sm:items-start sm:justify-between gap-4">
                 <div className="flex items-start gap-4">
                   <div className="h-12 w-12 bg-blue-100 rounded-full flex items-center justify-center flex-shrink-0">
@@ -395,8 +395,8 @@ export function Pacientes({
                   </div>
                 </div>
                 <div className="flex items-center gap-2">
-                  <Button 
-                    variant="outline" 
+                  <Button
+                    variant="outline"
                     size="sm"
                     onClick={() => handleEditar(paciente)}
                   >
@@ -418,7 +418,7 @@ export function Pacientes({
                       </AlertDialogHeader>
                       <AlertDialogFooter>
                         <AlertDialogCancel>Cancelar</AlertDialogCancel>
-                        <AlertDialogAction 
+                        <AlertDialogAction
                           onClick={() => onEliminar(paciente.id)}
                           className="bg-red-600 hover:bg-red-700"
                         >