Kurzmeldungen als Overlay, Liniendiagramm fuellt die Karte, Zeitraum ab 1 Tag

Meldungen:
"Gespeichert", "Anordnung gespeichert" und die uebrigen Erfolgsmeldungen standen
als Leiste mitten in der Seite - beim Speichern sprang dadurch das ganze Layout
ein Stueck nach unten. Sie erscheinen jetzt als Overlay am unteren Rand und
verschwinden nach fuenf Sekunden von selbst; ein Kreuz blendet sie sofort aus.
Umgestellt in Uebersicht, Einstellungen, Gefahrenbereich, Benutzer,
Produktformular sowie Ein- und Auslagern.

Bewusst NICHT umgestellt: Fehlermeldungen. Ein Fehler, der nach fuenf Sekunden
verschwindet, ist genau dann weg, wenn man ihn noch braucht - der bleibt an
seiner Stelle stehen.

Rollbalken beim Liniendiagramm:
Den hatte ich mir mit der Zeitraum-Auswahl selbst eingebaut. Das Diagramm hatte
eine feste Hoehe von 200 px; zusammen mit der Auswahl darueber passte das nicht
mehr in die Karte. Jetzt wird auch die Hoehe gemessen, das Diagramm fuellt den
verbleibenden Platz.

Zeitraum "1 Tag":
Ein einzelner Tag ergibt genau einen Messpunkt - eine Linie aus einem Punkt
waere unsinnig. Das Diagramm zeigt in dem Fall die blanke Zahl. Die
Backend-Begrenzung laesst jetzt einen Tag zu.

Geprueft: "npm run build" laeuft durch; kein Verweis mehr auf die entfernten
Meldungszustaende.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

web/src/pages/CheckOut.jsx

@@ -1,11 +1,13 @@
 import { useEffect, useState } from "react";
 import { api } from "../api";
 import Icon from "../components/Icon";
+import { useToast } from "../toast";
 import { useSettings } from "../settings";
 import { buildUnitOptions, fmt, isExpired, unitShort } from "../units";
 
 export default function CheckOut() {
   const { formatBestBefore } = useSettings();
+  const toast = useToast();
   const [barcode, setBarcode] = useState("");
   const [search, setSearch] = useState("");
   const [results, setResults] = useState([]);
@@ -18,7 +20,6 @@ export default function CheckOut() {
   const [lotId, setLotId] = useState(""); // "" = automatisch (FEFO)
 
   const [error, setError] = useState(null);
-  const [info, setInfo] = useState(null);
   const [busy, setBusy] = useState(false);
 
   useEffect(() => {
@@ -39,7 +40,7 @@ export default function CheckOut() {
   }
 
   async function doLookup() {
-    setError(null); setInfo(null);
+    setError(null);
     if (!barcode) return;
     try {
       const res = await api.lookup(barcode.trim());
@@ -64,7 +65,7 @@ export default function CheckOut() {
 
   async function submit(e) {
     e.preventDefault();
-    setError(null); setInfo(null); setBusy(true);
+    setError(null); setBusy(true);
     try {
       const res = await api.checkOut({
         product_id: product.id,
@@ -72,7 +73,7 @@ export default function CheckOut() {
         unit,
         lot_id: lotId === "" ? null : Number(lotId),
       });
-      setInfo(
+      toast(
         `Ausgelagert (${res.affected_lots.length} Charge(n)). Neuer Bestand: ` +
           `${fmt(res.product_stock / (product.unit_factor || 1))} ${product.unit_name}`
       );
@@ -104,7 +105,6 @@ export default function CheckOut() {
     <div>
       <div className="page-head"><h1>Auslagern</h1></div>
       {error && <div className="alert error"><Icon name="alert" size={16} />{error}</div>}
-      {info && <div className="alert ok"><Icon name="check" size={16} />{info}</div>}
 
       {!product && (
         <div className="grid-2">