/* Dunkles Farbschema (UX10): Anpassungen, die sich nicht über Tokens lösen lassen.
   Wird als letzte CSS-Datei geladen. Alles hier greift nur unter [data-theme="dark"];
   das helle Schema bleibt unberührt.

   Hauptsächlich Bootstrap-Hilfsklassen, die in Bootstraps eigenem Dunkelmodus
   absichtlich fest bleiben (bg-light bleibt hell, text-dark bleibt dunkel), sowie
   eingebundene Bibliotheken mit eigenen Farbvariablen. */

/* Bootstrap: helle Flächen-Hilfsklassen auf dunkle Flächen */
[data-theme="dark"] .bg-light,
[data-theme="dark"] .table-light,
[data-theme="dark"] .table-light > th,
[data-theme="dark"] .table-light > td {
    background-color: var(--color-surface-subtle) !important;
    color: var(--color-text);
}
[data-theme="dark"] .table-light {
    --bs-table-bg: var(--color-surface-subtle);
    --bs-table-color: var(--color-text);
    --bs-table-border-color: var(--color-border-medium);
}
[data-theme="dark"] .bg-white {
    background-color: var(--color-surface) !important;
}
[data-theme="dark"] .btn-light {
    --bs-btn-bg: var(--color-surface-strong);
    --bs-btn-border-color: var(--color-border-medium);
    --bs-btn-color: var(--color-text);
    --bs-btn-hover-bg: var(--color-surface-pressed);
    --bs-btn-hover-color: var(--color-text-strong);
}

/* text-dark/text-black bleiben auf gelben/türkisen Flächen und Badges dunkel (dort korrekt),
   auch für Elemente darin (z. B. Schließen-Knopf im türkisen Modal-Kopf) */
[data-theme="dark"] .text-dark:not(.bg-warning):not(.bg-info):not(.bg-warning *):not(.bg-info *),
[data-theme="dark"] .text-black:not(.bg-warning):not(.bg-info):not(.bg-warning *):not(.bg-info *) {
    color: var(--color-text) !important;
}

/* Schließen-Kreuz der Bootstrap-Modals sichtbar machen */
[data-theme="dark"] .btn-close:not(.btn-close-white) {
    filter: invert(1) grayscale(100%) brightness(200%);
}

/* FullCalendar bringt eigene Variablen mit */
[data-theme="dark"] .fc {
    --fc-page-bg-color: var(--color-surface);
    --fc-neutral-bg-color: var(--color-surface-subtle);
    --fc-neutral-text-color: var(--color-text-muted);
    --fc-border-color: var(--color-border-medium);
    --fc-today-bg-color: rgba(77, 148, 255, 0.12);
    --fc-list-event-hover-bg-color: var(--color-surface-hover);
    --fc-highlight-color: rgba(77, 148, 255, 0.15);
    --fc-non-business-color: rgba(0, 0, 0, 0.2);
}

/* Flatpickr (Datumsauswahl) */
[data-theme="dark"] .flatpickr-calendar {
    background: var(--color-surface);
    box-shadow: var(--shadow-md);
}
[data-theme="dark"] .flatpickr-calendar.arrowTop::after,
[data-theme="dark"] .flatpickr-calendar.arrowTop::before {
    border-bottom-color: var(--color-surface);
}
[data-theme="dark"] .flatpickr-months .flatpickr-month,
[data-theme="dark"] .flatpickr-current-month .flatpickr-monthDropdown-months,
[data-theme="dark"] .flatpickr-weekday,
[data-theme="dark"] span.flatpickr-weekday,
[data-theme="dark"] .flatpickr-day,
[data-theme="dark"] .flatpickr-current-month input.cur-year {
    color: var(--color-text);
    fill: var(--color-text);
    background: transparent;
}
[data-theme="dark"] .flatpickr-months .flatpickr-prev-month svg,
[data-theme="dark"] .flatpickr-months .flatpickr-next-month svg {
    fill: var(--color-text);
}
[data-theme="dark"] .flatpickr-day:hover,
[data-theme="dark"] .flatpickr-day:focus {
    background: var(--color-surface-strong);
    border-color: var(--color-surface-strong);
}
[data-theme="dark"] .flatpickr-day.prevMonthDay,
[data-theme="dark"] .flatpickr-day.nextMonthDay,
[data-theme="dark"] .flatpickr-day.flatpickr-disabled {
    color: var(--color-text-subtle);
}
[data-theme="dark"] .flatpickr-day.selected,
[data-theme="dark"] .flatpickr-day.selected:hover {
    background: var(--color-primary-fill);
    border-color: var(--color-primary-fill);
    color: var(--color-on-accent);
}

/* Native Datums-/Zeitfelder: Kalender-Symbol sonst schwarz auf dunkel */
[data-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator,
[data-theme="dark"] input[type="time"]::-webkit-calendar-picker-indicator {
    filter: invert(1);
}

/* Glas-Navigation: halbtransparentes Weiß wäre auf dunkel ein grauer Schleier */
@supports (backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px)) {
    @media (min-width: 768px) {
        [data-theme="dark"] nav:not(.bottom-nav) {
            background-color: rgba(28, 31, 36, 0.8);
        }
    }
}

/* Wortmarke: helle Fassung (braun/blau auf hellblauer Fläche) ist auf dunklem Grund zu kontrastarm */
[data-theme="dark"] .wortmarke-hell { display: none; }
[data-theme="dark"] .wortmarke-dunkel { display: inline; }