Agregar icons X a botones cancelar, dark mode en todos los componentes

src/sections/Internaciones.tsx

@@ -136,12 +136,12 @@ export function Internaciones({
   // Ver Historia Clínica (navegar a página)
 
   return (
-    <div className="space-y-6">
+    <div className="space-y-6 dark:text-white">
       {/* Header */}
       <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">Internaciones</h1>
-          <p className="text-gray-500">Gestión de internaciones en sala</p>
+          <h1 className="text-2xl font-bold text-gray-900 dark:text-white">Internaciones</h1>
+          <p className="text-gray-500 dark:text-gray-400">Gestión de internaciones en sala</p>
         </div>
         <Dialog open={dialogoNuevaAbierto} onOpenChange={setDialogoNuevaAbierto}>
           <DialogTrigger asChild>
@@ -307,7 +307,7 @@ export function Internaciones({
           
           return (
             <Card key={internacion.id} className="hover:shadow-md transition-shadow">
-              <CardContent className="p-4">
+<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 ${