/* ============================================================
 * SIW-Theme: festes dunkles Theme, Palette aus dem Dark Mode
 * von dev.spring-ins-web.de. Basis-Layer: Bootswatch DARKLY
 * (fixiert in _layout.html, data-bs-theme="dark").
 * Wird NACH darkly/custom.css geladen und gewinnt daher.
 *
 * Kontraste (WCAG AA, gegen --siw-surface #111827):
 *   --siw-text       #f5f7fa  ~15.9:1  (AAA)
 *   --siw-text-muted #9aa4b2   ~7.0:1  (AAA)
 *   --siw-link       #1aa179   ~5.4:1  (AA)
 *   weiß auf --siw-primary #008060 ~4.9:1 (AA)
 * ============================================================ */

:root,
[data-bs-theme="dark"] {
    /* --- SIW-Palette (Quelle: dev.spring-ins-web.de Dark Mode) --- */
    --siw-bg: #0a0e16;
    --siw-surface: #111827;
    --siw-surface-2: #161f2e;
    --siw-border: #1e2630;
    --siw-text: #f5f7fa;
    --siw-text-muted: #9aa4b2;
    --siw-primary: #008060;
    --siw-primary-hover: #00a070;
    --siw-link: #1aa179;
    --siw-danger: #dc3545;

    /* --- Mapping auf Bootstrap-5.3-Theme-Variablen --- */
    --bs-body-bg: var(--siw-bg);
    --bs-body-color: var(--siw-text);
    --bs-emphasis-color: var(--siw-text);
    --bs-secondary-color: var(--siw-text-muted);
    --bs-secondary-bg: var(--siw-surface);
    --bs-tertiary-color: var(--siw-text-muted);
    --bs-tertiary-bg: var(--siw-surface-2);
    --bs-border-color: var(--siw-border);
    --bs-border-color-translucent: var(--siw-border);
    --bs-primary: var(--siw-primary);
    --bs-primary-rgb: 0, 128, 96;
    --bs-danger: var(--siw-danger);
    --bs-danger-rgb: 220, 53, 69;
    --bs-link-color: var(--siw-link);
    --bs-link-color-rgb: 26, 161, 121;
    --bs-link-hover-color: var(--siw-primary-hover);
    --bs-link-hover-color-rgb: 0, 160, 112;
}

/* --- Flächen: Cards/Panels, Modals, Listen, Dropdowns --- */
.card {
    --bs-card-bg: var(--siw-surface);
    --bs-card-border-color: var(--siw-border);
    --bs-card-cap-bg: var(--siw-surface-2);
}

.modal {
    --bs-modal-bg: var(--siw-surface);
    --bs-modal-border-color: var(--siw-border);
    --bs-modal-header-border-color: var(--siw-border);
    --bs-modal-footer-border-color: var(--siw-border);
}

.list-group {
    --bs-list-group-bg: var(--siw-surface);
    --bs-list-group-color: var(--siw-text);
    --bs-list-group-border-color: var(--siw-border);
    --bs-list-group-action-hover-bg: var(--siw-surface-2);
    --bs-list-group-action-hover-color: var(--siw-text);
}

.dropdown-menu {
    --bs-dropdown-bg: var(--siw-surface-2);
    --bs-dropdown-color: var(--siw-text);
    --bs-dropdown-link-color: var(--siw-text);
    --bs-dropdown-link-hover-bg: var(--siw-surface);
    --bs-dropdown-link-hover-color: var(--siw-text);
    --bs-dropdown-link-active-bg: var(--siw-primary);
    --bs-dropdown-border-color: var(--siw-border);
}

.accordion {
    --bs-accordion-bg: var(--siw-surface);
    --bs-accordion-border-color: var(--siw-border);
    --bs-accordion-color: var(--siw-text);
}

/* --- Navbar (nutzt bg-primary in _navigation.html) --- */
.bg-primary {
    background-color: var(--siw-primary) !important;
}

.text-primary {
    color: var(--siw-link) !important;
}

.border-primary {
    border-color: var(--siw-primary) !important;
}

/* von FredBet vereinzelt genutzt (z. B. Sprach-Dropdown im Login) */
.bg-light {
    background-color: var(--siw-surface-2) !important;
}

/* --- Buttons --- */
.btn-primary {
    --bs-btn-bg: var(--siw-primary);
    --bs-btn-border-color: var(--siw-primary);
    --bs-btn-color: #fff;
    --bs-btn-hover-bg: var(--siw-primary-hover);
    --bs-btn-hover-border-color: var(--siw-primary-hover);
    --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: var(--siw-primary-hover);
    --bs-btn-active-border-color: var(--siw-primary-hover);
    --bs-btn-disabled-bg: var(--siw-primary);
    --bs-btn-disabled-border-color: var(--siw-primary);
}

.btn-outline-primary {
    --bs-btn-color: var(--siw-link);
    --bs-btn-border-color: var(--siw-primary);
    --bs-btn-hover-bg: var(--siw-primary);
    --bs-btn-hover-border-color: var(--siw-primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: var(--siw-primary-hover);
    --bs-btn-active-border-color: var(--siw-primary-hover);
}

.btn-danger {
    --bs-btn-bg: var(--siw-danger);
    --bs-btn-border-color: var(--siw-danger);
    --bs-btn-color: #fff;
    --bs-btn-hover-bg: #bb2d3b;
    --bs-btn-hover-border-color: #bb2d3b;
}

/* "helle" Buttons (z. B. Default/Abbrechen) dunkel einfärben */
.btn-light {
    --bs-btn-bg: var(--siw-surface-2);
    --bs-btn-border-color: var(--siw-border);
    --bs-btn-color: var(--siw-text);
    --bs-btn-hover-bg: var(--siw-surface);
    --bs-btn-hover-border-color: var(--siw-border);
    --bs-btn-hover-color: var(--siw-text);
}

.btn-secondary {
    --bs-btn-bg: var(--siw-surface-2);
    --bs-btn-border-color: var(--siw-border);
    --bs-btn-color: var(--siw-text);
    --bs-btn-hover-bg: var(--siw-surface);
    --bs-btn-hover-border-color: var(--siw-border);
    --bs-btn-hover-color: var(--siw-text);
}

/* --- Formularfelder: dunkler Grund, heller Text, sichtbare Border --- */
.form-control,
.form-select {
    background-color: var(--siw-surface-2);
    border-color: var(--siw-border);
    color: var(--siw-text);
}

.form-control:focus,
.form-select:focus {
    background-color: var(--siw-surface-2);
    border-color: var(--siw-primary);
    color: var(--siw-text);
    box-shadow: 0 0 0 0.25rem rgba(0, 128, 96, 0.25);
}

.form-control::placeholder {
    color: var(--siw-text-muted);
}

.form-control:disabled,
.form-select:disabled {
    background-color: var(--siw-surface);
    color: var(--siw-text-muted);
}

.form-check-input {
    background-color: var(--siw-surface-2);
    border-color: var(--siw-border);
}

.form-check-input:checked {
    background-color: var(--siw-primary);
    border-color: var(--siw-primary);
}

.form-check-input:focus {
    border-color: var(--siw-primary);
    box-shadow: 0 0 0 0.25rem rgba(0, 128, 96, 0.25);
}

/* Floating Labels (Login) auf dunklem Feld lesbar */
.form-floating > label {
    color: var(--siw-text-muted);
}

/* --- Tabellen (Spiele-Liste, Platzierung) --- */
.table {
    --bs-table-bg: var(--siw-surface);
    --bs-table-color: var(--siw-text);
    --bs-table-border-color: var(--siw-border);
    --bs-table-striped-bg: var(--siw-surface-2);
    --bs-table-striped-color: var(--siw-text);
    --bs-table-hover-bg: var(--siw-surface-2);
    --bs-table-hover-color: var(--siw-text);
    --bs-table-active-bg: var(--siw-surface-2);
}

/* bootstrap-table-Plugin (Sortier-Header etc.) */
.bootstrap-table .fixed-table-container {
    background-color: var(--siw-surface);
}

/* --- Pagination --- */
.pagination {
    --bs-pagination-bg: var(--siw-surface);
    --bs-pagination-color: var(--siw-link);
    --bs-pagination-border-color: var(--siw-border);
    --bs-pagination-hover-bg: var(--siw-surface-2);
    --bs-pagination-hover-color: var(--siw-primary-hover);
    --bs-pagination-hover-border-color: var(--siw-border);
    --bs-pagination-focus-bg: var(--siw-surface-2);
    --bs-pagination-focus-color: var(--siw-primary-hover);
    --bs-pagination-active-bg: var(--siw-primary);
    --bs-pagination-active-border-color: var(--siw-primary);
    --bs-pagination-disabled-bg: var(--siw-surface);
    --bs-pagination-disabled-color: var(--siw-text-muted);
    --bs-pagination-disabled-border-color: var(--siw-border);
}

/* --- Badges --- */
.badge.bg-primary {
    background-color: var(--siw-primary) !important;
    color: #fff;
}

.badge.bg-danger {
    background-color: var(--siw-danger) !important;
}

/* --- Nav-Pills / Tabs --- */
.nav-pills {
    --bs-nav-pills-link-active-bg: var(--siw-primary);
}

.nav-tabs {
    --bs-nav-tabs-border-color: var(--siw-border);
    --bs-nav-tabs-link-active-bg: var(--siw-surface);
    --bs-nav-tabs-link-active-color: var(--siw-text);
    --bs-nav-tabs-link-active-border-color: var(--siw-border);
}

/* --- Sonstiges --- */
.progress {
    background-color: var(--siw-surface-2);
}

.progress-bar {
    background-color: var(--siw-primary);
}

.text-muted {
    color: var(--siw-text-muted) !important;
}

hr {
    border-color: var(--siw-border);
}

/* --- Gelb-Akzente aufs SIW-Grün umgefärbt ---
   FredBet nutzt Bootstrap-"warning" (gelb) für Punkte-Badges
   (Platzierung, Spiele-Liste, Tipps, Extrawetten, Punkteverteilung)
   und #ffe8b3 für Punktgleichheit in der Platzierung – auf dunklem
   Grund schlecht lesbar und nicht in der Palette. */
.badge.bg-warning {
    background-color: var(--siw-primary) !important;
    color: #fff;
}

/* Flächen-Variante (Card-Header/Zellen bei Extrawetten):
   dezenter Grün-Schimmer statt Hellgelb, Text bleibt hell */
.bg-warning-subtle {
    background-color: rgba(0, 128, 96, 0.18) !important;
    color: var(--siw-text) !important;
}

/* Punktgleichheit in der Platzierung: Original setzt #ffe8b3 in
   ranking.css, die NACH dieser Datei lädt – daher .card-body davor
   für höhere Spezifität (0-2-0 schlägt 0-1-0 trotz Ladereihenfolge). */
.card-body.ranking-same-position {
    background-color: rgba(0, 128, 96, 0.18);
}

/* --- Summernote-WYSIWYG (Infos -> Regeln/Preise editieren) ---
   summernote-lite bringt eine helle Toolbar mit, setzt aber für die
   Schreibfläche (.note-editable) weder Hintergrund noch Textfarbe –
   die erbt sonst den dunklen Seitenhintergrund. Hier explizit:
   dunkles Feld + heller Text (analog zu den Formularfeldern). */
.note-editor.note-frame,
.note-editor.note-airframe {
    border-color: var(--siw-border);
}

.note-editor .note-editing-area .note-editable {
    background-color: var(--siw-surface-2);
    color: var(--siw-text);
}

.note-editor .note-placeholder {
    color: var(--siw-text-muted);
}

/* Statusbar (Resize-Griff) unten passend einfärben */
.note-editor.note-frame .note-statusbar {
    background-color: var(--siw-surface);
    border-top-color: var(--siw-border);
}

/* FredBet-eigene Logo-Akzentklasse (Login-Fallback) */
.logo-color {
    color: var(--siw-primary);
}