Light und Darkmodus in global.css eingestellt, in andere components text-black in root div

app/globals.css

@@ -26,3 +26,19 @@ body {
     text-wrap: balance;
   }
 }
+
+@media (prefers-color-scheme: light) {
+  input {
+    background-color: #333 !important; /* Dunkler Hintergrund im Darkmode */
+    color: #fff !important; /* Weißer Text im Darkmode */
+    border: 1px solid #555; /* Optional: etwas hellerer Rahmen */
+  }
+}
+
+@media (prefers-color-scheme: dark) {
+  input {
+    background-color: white !important; /* Heller Hintergrund im Lightmode */
+    color: black !important; /* Schwarzer Text im Lightmode */
+    border: 1px solid #ccc; /* Optional: heller Rahmen */
+  }
+}

app/kabelueberwachung/page.jsx

@@ -84,7 +84,7 @@ function Kabelueberwachung() {
   }, []);
 
   return (
-    <div className="bg-gray-100 flex-1 p-6">
+    <div className="bg-gray-100 flex-1 p-6 text-black">
       <h1 className="text-2xl mb-4">Kabelüberwachung</h1>
 
       <div className="mb-4">