/* ---------- Chart-Farben als CSS-Variablen (Light-/Dark-Mode-fähig) ---------- */
/* Werden in zerfall_rechner.js per getComputedStyle ausgelesen, wenn der Chart
   aufgebaut wird. Für Text/Gitter binden wir uns direkt an die bereits
   vorhandene --text-Variable aus styles.css, statt eine eigene, parallele
   Variable zu pflegen, die mit dem .dark-mode-Toggle aus dem Tritt geraten
   kann. Nur die Kurvenfarben bekommen eigene, theme-abhängige Varianten. */

:root {
    --zerfall-chart-color-1: #dc3545;
    --zerfall-chart-color-2: #0d6efd;
    --zerfall-chart-color-3: #198754;
    --zerfall-chart-color-4: #fd7e14;
    --zerfall-chart-color-5: #6f42c1;
    --zerfall-chart-color-6: #20c997;
    --zerfall-chart-color-7: #d63384;
    --zerfall-chart-color-8: #6c757d;
}

.dark-mode {
    /* etwas hellere/kräftigere Varianten, damit sie auf dunklem Grund
       (--bg: #121212 bzw. --pse-card-body-bg: #252528) gut lesbar bleiben */
    --zerfall-chart-color-1: #ff6b81;
    --zerfall-chart-color-2: #6ea8fe;
    --zerfall-chart-color-3: #75d8a0;
    --zerfall-chart-color-4: #ffb066;
    --zerfall-chart-color-5: #b794f6;
    --zerfall-chart-color-6: #5eead4;
    --zerfall-chart-color-7: #f783ac;
    --zerfall-chart-color-8: #adb5bd;
}


/* ---------- Fix: "betrachteter Zeitraum"-Dropdown bleibt bei schmalem
   Viewport auf einer Linie mit den anderen Feldern ----------

   Problem: wenn das Label auf 2 Zeilen umbricht, wird nur diese Spalte
   höher, wodurch sich Select und Label relativ zu den Nachbarspalten
   nach unten verschieben. Fix: alle Labels in dieser Zeile bekommen eine
   fixe Mindesthöhe (= Höhe eines zweizeiligen Labels) und werden am
   unteren Rand ausgerichtet, damit die Eingabefelder darunter immer auf
   gleicher Höhe bleiben, egal ob ein Label ein- oder zweizeilig ist. */

.zeitraum-row .form-label {
    display: flex;
    align-items: flex-end;
    min-height: 3rem; /* = 2 Zeilen bei Bootstraps Standard-Zeilenhöhe (1.5 * 1rem) */
    /* margin-bottom bewusst NICHT überschrieben, sonst weicht die Gesamthöhe
       vom Bootstrap-Standard (.form-label { margin-bottom: 0.5rem }) ab, den
       die anderen Formularzeilen unverändert nutzen. */
}