style: Auswahlfarbe im DatePicker auf littwin-blue angepasst für konsistentes UI

pages/meldungen.tsx

@@ -1,6 +1,7 @@
 "use client";
 // /pages/meldungen.tsx
 import React, { useState } from "react";
+import DateRangePickerMeldungen from "../components/main/meldungen/DateRangePickerMeldungen";
 
 type Meldung = {
   t: string;
@@ -47,15 +48,11 @@ export default function Messages() {
     try {
       const res = await fetch(url);
       const raw = await res.json();
-      console.log("URL:", url);
-      console.log("Daten vom Server:", raw);
-
       const data = Array.isArray(raw) ? raw : raw.data;
       if (!Array.isArray(data)) {
         console.error("Die empfangenen Daten sind kein Array:", data);
         return;
       }
-
       setMessages(data);
       setCurrentPage(1);
     } catch (err) {
@@ -73,28 +70,16 @@ export default function Messages() {
     <div className="p-4">
       <h1 className="text-xl font-bold mb-4">Berichte</h1>
 
-      <div className="flex flex-wrap gap-4 mb-4 items-end">
-        <div>
-          <label className="block text-sm font-medium mb-1">Von Datum</label>
-          <input
-            type="date"
-            value={fromDate}
-            onChange={(e) => setFromDate(e.target.value)}
-            className="border px-2 py-1 rounded"
-          />
-        </div>
-        <div>
-          <label className="block text-sm font-medium mb-1">Bis Datum</label>
-          <input
-            type="date"
-            value={toDate}
-            onChange={(e) => setToDate(e.target.value)}
-            className="border px-2 py-1 rounded"
-          />
-        </div>
+      <div className="flex flex-wrap gap-6 mb-6 items-end">
+        <DateRangePickerMeldungen
+          fromDate={fromDate}
+          toDate={toDate}
+          setFromDate={setFromDate}
+          setToDate={setToDate}
+        />
         <button
           onClick={fetchMessages}
-          className="bg-littwin-blue text-white px-4 py-2 rounded "
+          className="bg-littwin-blue text-white px-4 py-2 rounded h-fit"
         >
           Anzeigen
         </button>
@@ -139,7 +124,7 @@ export default function Messages() {
         <button
           onClick={() => setCurrentPage((prev) => Math.max(prev - 1, 1))}
           disabled={currentPage === 1}
-          className="bg-littwin-blue text-white px-4 py-2 rounded "
+          className="bg-littwin-blue text-white px-4 py-2 rounded"
         >
           Zurück
         </button>
@@ -151,7 +136,7 @@ export default function Messages() {
             setCurrentPage((prev) => Math.min(prev + 1, totalPages))
           }
           disabled={currentPage === totalPages}
-          className="bg-littwin-blue text-white px-4 py-2 rounded "
+          className="bg-littwin-blue text-white px-4 py-2 rounded"
         >
           Weiter
         </button>