/* Mörkt läge. Aktiveras med <html data-bs-theme="dark"> (Bootstrap sköter kort, formulär,
   menyer och modaler). Här skrivs appens egna ljusa ytor, kanter och grå texter över.
   Pastellknapparna (inline-färger med svart text) behåller färgen – kontrasten är god –
   men dämpas lite så att de inte bländar. */

[data-bs-theme="dark"] {
    --g-bg: #15181e;
    --g-surface: #1f242c;
    --g-surface-2: #2a3039;
    --g-surface-3: #343b46;
    --g-border: #3a424e;
    --g-text: #e9edf2;
    --g-muted: #a9b3c0;
    --bs-body-bg: var(--g-bg);
    --bs-body-color: var(--g-text);
    --bs-secondary-color: var(--g-muted);
    --bs-tertiary-bg: var(--g-surface-2);
    --bs-card-bg: var(--g-surface);
    --bs-border-color: var(--g-border);
    color-scheme: dark;
}

[data-bs-theme="dark"] body { background: var(--g-bg); color: var(--g-text); }
[data-bs-theme="dark"] .card { background: var(--g-surface); border-color: var(--g-border); }
[data-bs-theme="dark"] .text-muted,
[data-bs-theme="dark"] .form-text { color: var(--g-muted) !important; }
[data-bs-theme="dark"] .text-dark { color: var(--g-text) !important; }
[data-bs-theme="dark"] .shadow-sm { box-shadow: 0 0.125rem 0.35rem rgba(0, 0, 0, 0.45) !important; }

/* Pastellknappar och länkar med inline-färg: dämpa, behåll mörk text */
[data-bs-theme="dark"] .action-btn,
[data-bs-theme="dark"] .admin-btn,
[data-bs-theme="dark"] .back-btn,
[data-bs-theme="dark"] .flash-btn,
[data-bs-theme="dark"] .adm-link,
[data-bs-theme="dark"] .adm-tile,
[data-bs-theme="dark"] .support-link {
    filter: brightness(0.86) saturate(0.95);
    color: #111 !important;
}
[data-bs-theme="dark"] .action-btn:hover,
[data-bs-theme="dark"] .admin-btn:hover,
[data-bs-theme="dark"] .adm-link:hover { border-color: #fff; }
[data-bs-theme="dark"] .adm-link-sub,
[data-bs-theme="dark"] .adm-tile-sub { color: #333; }
[data-bs-theme="dark"] .adm-link-go { color: #333; }

/* Toppmeny */
[data-bs-theme="dark"] .topbar { background: #2b3a8c; }
[data-bs-theme="dark"] .nav-btn.btn-light,
[data-bs-theme="dark"] .btn-light {
    background: var(--g-surface-2);
    border-color: transparent;
    color: var(--g-text);
}
[data-bs-theme="dark"] .nav-btn.btn-light:hover { border-color: #fff; }
[data-bs-theme="dark"] .notif-unread { background: #23314f; }
[data-bs-theme="dark"] .notif-item { border-color: var(--g-border); }
[data-bs-theme="dark"] a.notif-item:hover { background: var(--g-surface-2); }
[data-bs-theme="dark"] .notif-desc, [data-bs-theme="dark"] .notif-empty { color: var(--g-muted); }
[data-bs-theme="dark"] .notif-xp { color: #63e6be; }
[data-bs-theme="dark"] .notif-footer:hover { background: var(--g-surface-2); }
[data-bs-theme="dark"] .profile-menu-name span { color: var(--g-muted); }
[data-bs-theme="dark"] .profile-menu .logout-item { color: #ff8787; }
[data-bs-theme="dark"] .avatar { background: var(--g-surface-2); }

/* Banners och rutor */
[data-bs-theme="dark"] .announcement-banner { background: #1c2c4a; border-color: #2f4f86; color: #cfe0ff; }
[data-bs-theme="dark"] .announcement-banner.level-warning { background: #3a2f12; border-color: #7a5d12; color: #ffe8a3; }
[data-bs-theme="dark"] .info-box { background: var(--g-surface-2) !important; color: var(--g-text); }
[data-bs-theme="dark"] .success-box { background: #1c3324 !important; color: var(--g-text); }
[data-bs-theme="dark"] .family-code-box { background: var(--g-surface-2); }

/* Adminsidor */
[data-bs-theme="dark"] .adm-list,
[data-bs-theme="dark"] .getting-started { background: var(--g-surface); }
[data-bs-theme="dark"] .adm-row + .adm-row { border-color: var(--g-border); }
[data-bs-theme="dark"] .adm-row.is-link:hover { background: var(--g-surface-2); }
[data-bs-theme="dark"] .adm-sub,
[data-bs-theme="dark"] .adm-meta,
[data-bs-theme="dark"] .adm-result,
[data-bs-theme="dark"] .adm-empty,
[data-bs-theme="dark"] .adm-head .adm-count,
[data-bs-theme="dark"] .adm-section,
[data-bs-theme="dark"] .gs-next,
[data-bs-theme="dark"] .res-stat-label { color: var(--g-muted); }
[data-bs-theme="dark"] .adm-help > summary { color: var(--g-text); }
[data-bs-theme="dark"] .adm-help .info-box,
[data-bs-theme="dark"] .res-stat { background: var(--g-surface-2); }
[data-bs-theme="dark"] .res-bar { background: var(--g-surface-3); }
[data-bs-theme="dark"] .adm-menu-btn { background: var(--g-surface-3); color: var(--g-text); }
[data-bs-theme="dark"] .adm-menu-btn:hover,
[data-bs-theme="dark"] .adm-menu-btn[aria-expanded="true"] { background: #48505d; }
[data-bs-theme="dark"] .adm-menu .dropdown-item.danger { color: #ff8787; }
[data-bs-theme="dark"] .adm-chip { background: #1f3555; color: #cfe0ff; }
[data-bs-theme="dark"] .adm-chip.role-family_admin { background: #4a3c12; color: #ffe08a; }
[data-bs-theme="dark"] .adm-chip.role-viewer { background: #352a52; color: #d9c8ff; }
[data-bs-theme="dark"] .adm-chip.role-student { background: #173b2a; color: #9ee6bf; }
[data-bs-theme="dark"] .adm-chip.warn { background: #4a3a10; color: #ffd866; }
[data-bs-theme="dark"] .adm-chip.muted { background: var(--g-surface-3); color: var(--g-text); }
[data-bs-theme="dark"] .gs-dots { color: #8fb0ff; }
[data-bs-theme="dark"] .gs-hide { color: var(--g-muted); }

/* Filterrader */
[data-bs-theme="dark"] .chipbar-prev,
[data-bs-theme="dark"] .chipbar-next { background: var(--g-surface-3); color: var(--g-text); }
[data-bs-theme="dark"] .chipbar-track::before { background: var(--g-surface-3); }
[data-bs-theme="dark"] .chipbar-thumb { background: #7d8796; }
[data-bs-theme="dark"] .sup-filter a,
[data-bs-theme="dark"] .xp-filter a,
[data-bs-theme="dark"] .msg-tabs a { background: var(--g-surface); color: var(--g-text); }
[data-bs-theme="dark"] .sup-filter a.active,
[data-bs-theme="dark"] .xp-filter a.active,
[data-bs-theme="dark"] .msg-tabs a.active { color: #fff; }

/* Support, chatt, meddelanden */
[data-bs-theme="dark"] .sup-card,
[data-bs-theme="dark"] .chat-person { background: var(--g-surface); border-color: var(--g-border); }
[data-bs-theme="dark"] .sup-card-time,
[data-bs-theme="dark"] .sup-card-last,
[data-bs-theme="dark"] .sup-card-meta,
[data-bs-theme="dark"] .sup-ticket-meta,
[data-bs-theme="dark"] .sup-bubble-time,
[data-bs-theme="dark"] .chat-person .role { color: var(--g-muted); }
[data-bs-theme="dark"] .sup-empty { background: var(--g-surface); color: var(--g-muted); }
[data-bs-theme="dark"] .sup-chips label { background: var(--g-surface); color: var(--g-text); }
[data-bs-theme="dark"] .sup-chips input:checked + label { color: #fff; }
[data-bs-theme="dark"] .sup-notice-info { background: #1c2c4a; color: #cfe0ff; }
[data-bs-theme="dark"] .sup-notice-warn { background: #3a2f12; color: #ffe8a3; }
[data-bs-theme="dark"] .sup-notice-locked { background: var(--g-surface-2); color: var(--g-text); }
[data-bs-theme="dark"] .sup-bubble { background: var(--g-surface-2); color: var(--g-text); }
[data-bs-theme="dark"] .sup-msg.mine .sup-bubble { background: #26407a; color: #fff; }
[data-bs-theme="dark"] .sup-bubble-name { color: #cbd3de; }
[data-bs-theme="dark"] .sup-msg.mine .sup-bubble-time { color: #c7d5f5; }
[data-bs-theme="dark"] .sup-system { background: var(--g-surface); border-color: var(--g-border); color: var(--g-muted); }
[data-bs-theme="dark"] .sup-composer { background: rgba(21, 24, 30, 0.97); border-color: var(--g-border); }
[data-bs-theme="dark"] .emoji-btn { background: var(--g-surface-2); }
[data-bs-theme="dark"] .emoji-panel { background: var(--g-surface); box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.6); }
[data-bs-theme="dark"] .emoji-tabs { border-color: var(--g-border); }
[data-bs-theme="dark"] .emoji-tabs button.on,
[data-bs-theme="dark"] .emoji-grid button:hover { background: var(--g-surface-3); }
[data-bs-theme="dark"] .chat-report { color: #7d8796; }
[data-bs-theme="dark"] .msg-audience label { border-color: var(--g-border); }
[data-bs-theme="dark"] .msg-audience label:has(input:checked) { background: #2c2350; }
[data-bs-theme="dark"] .msg-users { border-color: var(--g-border) !important; }
[data-bs-theme="dark"] .msg-reader { background: var(--g-surface-2); }
[data-bs-theme="dark"] .msg-reader.is-read { background: #173b2a; }
[data-bs-theme="dark"] .sup-temp-password { background: var(--g-surface-2); color: var(--g-text); }

/* Elevens dashboard */
[data-bs-theme="dark"] .sh-hero { background: linear-gradient(135deg, #3046b8 0%, #5a3fc4 55%, #8b3fb8 100%); box-shadow: 0 0.6rem 1.5rem rgba(0, 0, 0, 0.5); }
[data-bs-theme="dark"] .sh-mission,
[data-bs-theme="dark"] .sh-stat,
[data-bs-theme="dark"] .sh-card,
[data-bs-theme="dark"] .sh-list { background: var(--g-surface); box-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.45); }
[data-bs-theme="dark"] .sh-mission-text,
[data-bs-theme="dark"] .sh-stat-label,
[data-bs-theme="dark"] .sh-card-title span,
[data-bs-theme="dark"] .sh-day-label,
[data-bs-theme="dark"] .sh-list-progress { color: var(--g-muted); }
[data-bs-theme="dark"] .sh-list-progress strong { color: var(--g-text); }
[data-bs-theme="dark"] .sh-stat.fire .sh-stat-value { color: #ff922b; }
[data-bs-theme="dark"] .sh-day-dot { background: var(--g-surface-3); color: #8a93a0; }
[data-bs-theme="dark"] .sh-day.today .sh-day-label { color: #8fb0ff; }
[data-bs-theme="dark"] .sh-day.today .sh-day-dot { outline-color: #8fb0ff; }
[data-bs-theme="dark"] .sh-goal-bar,
[data-bs-theme="dark"] .sh-weekmaster span { background: var(--g-surface-3); }
[data-bs-theme="dark"] .sh-weekmaster span.on { background: linear-gradient(90deg, #ff922b, #f76707); }
[data-bs-theme="dark"] .sh-ring { background: conic-gradient(#20c997 calc(var(--p) * 1%), var(--g-surface-3) 0); }
[data-bs-theme="dark"] .sh-ring > span { background: var(--g-surface); color: var(--g-text); }
[data-bs-theme="dark"] .sh-chip { background: var(--g-surface-3); color: var(--g-text); }
[data-bs-theme="dark"] .sh-chip.ok { background: #173b2a; color: #8ce99a; }
[data-bs-theme="dark"] .sh-chip.warning { background: #4a2c10; color: #ffc078; }
[data-bs-theme="dark"] .sh-chip.danger { background: #4a1818; color: #ffa8a8; }
[data-bs-theme="dark"] .sh-chip.gold { background: #4a3c12; color: #ffe066; }
[data-bs-theme="dark"] .sh-secondary { background: var(--g-surface-3); color: var(--g-text); }
[data-bs-theme="dark"] .sh-secondary:hover { border-color: #fff; color: var(--g-text); }
[data-bs-theme="dark"] .sh-recent-row + .sh-recent-row,
[data-bs-theme="dark"] .sh-prev-row + .sh-prev-row { border-color: var(--g-border); }
[data-bs-theme="dark"] .sh-recent-xp { color: #63e6be; }
[data-bs-theme="dark"] .sh-prev-row:hover { background: var(--g-surface-2); }
[data-bs-theme="dark"] .sh-preview-banner { background: #3a2f12; color: #ffe8a3; }

/* Träning och resultat */
[data-bs-theme="dark"] .tr-card,
[data-bs-theme="dark"] .tc-card,
[data-bs-theme="dark"] .rv-card { background: var(--g-surface); box-shadow: 0 0.4rem 1.2rem rgba(0, 0, 0, 0.5); }
[data-bs-theme="dark"] .tr-close { background: var(--g-surface-3); color: var(--g-text); }
[data-bs-theme="dark"] .tr-bar { background: var(--g-surface-3); }
[data-bs-theme="dark"] .tr-prompt,
[data-bs-theme="dark"] .tc-score { color: var(--g-muted); }
[data-bs-theme="dark"] .tr-input { background: var(--g-surface-2) !important; color: var(--g-text) !important; border-color: var(--g-border) !important; }
[data-bs-theme="dark"] .tr-feedback.correct { background: #173b2a; color: #8ce99a; }
[data-bs-theme="dark"] .tr-feedback.wrong { background: #4a1818; color: #ffa8a8; }
[data-bs-theme="dark"] .tr-answer { color: var(--g-text); }
[data-bs-theme="dark"] .tr-btn.soft { background: var(--g-surface-3); color: var(--g-text) !important; }
[data-bs-theme="dark"] .tc-msg.great { background: #173b2a; color: #8ce99a; }
[data-bs-theme="dark"] .tc-msg.good { background: #4a3c12; color: #ffe066; }
[data-bs-theme="dark"] .tc-msg.keep { background: #4a2c10; color: #ffc078; }
[data-bs-theme="dark"] .rv-en { background: var(--g-surface-2); color: var(--g-text); }
[data-bs-theme="dark"] .rv-en:hover { background: var(--g-surface-3); }
[data-bs-theme="dark"] .rv-sv { color: #cbd3de; }

/* XP-historik och import */
[data-bs-theme="dark"] .xp-stat { background: var(--g-surface-2); }
[data-bs-theme="dark"] .xp-stat-label,
[data-bs-theme="dark"] .xp-row-desc { color: var(--g-muted); }
[data-bs-theme="dark"] .xp-month { border-color: var(--g-border); }
[data-bs-theme="dark"] .xp-row + .xp-row { border-color: var(--g-border); }
[data-bs-theme="dark"] .xp-stat-value,
[data-bs-theme="dark"] .xp-row-xp,
[data-bs-theme="dark"] .xp-month-sum { color: #63e6be; }
[data-bs-theme="dark"] .imp-steps span { background: var(--g-surface-3); color: var(--g-muted); }
[data-bs-theme="dark"] .imp-steps span.on { background: #198754; color: #fff; }
[data-bs-theme="dark"] .imp-table-wrap { border-color: var(--g-border); }
[data-bs-theme="dark"] .imp-table th { background: var(--g-surface-2); }
[data-bs-theme="dark"] .imp-table td { border-color: var(--g-border); }
[data-bs-theme="dark"] .imp-table tr.has-error { background: #3a1c1c; }
[data-bs-theme="dark"] .imp-msg .err { color: #ffa8a8; }
[data-bs-theme="dark"] .imp-msg .warn { color: #ffd866; }
[data-bs-theme="dark"] .imp-actions { background: rgba(21, 24, 30, 0.97); border-color: var(--g-border); }
[data-bs-theme="dark"] .imp-print th,
[data-bs-theme="dark"] .imp-print td { border-color: var(--g-border); }

/* Profil */
[data-bs-theme="dark"] .avatar-choice { background: var(--g-surface-2); }
[data-bs-theme="dark"] .avatar-choice:hover { border-color: #fff; }
[data-bs-theme="dark"] .avatar-choice.selected { border-color: #8fb0ff; }
[data-bs-theme="dark"] .tier-divider { color: var(--g-text); }
[data-bs-theme="dark"] .tier-divider::before,
[data-bs-theme="dark"] .tier-divider::after { background: var(--g-border); }
[data-bs-theme="dark"] .profile-meta { color: var(--g-muted); }

/* Utskrift är alltid ljus */
@media print {
    [data-bs-theme="dark"] body, [data-bs-theme="dark"] .card { background: #fff !important; color: #000 !important; }
}
[data-bs-theme="dark"] .avatar-choice.selected { background: #2b3a6b; }
[data-bs-theme="dark"] .res-good { color: #63e6be; }
[data-bs-theme="dark"] .res-bad { color: #ff8787; }
[data-bs-theme="dark"] .res-percent { color: var(--g-text); }
[data-bs-theme="dark"] .profile-menu-name { border-color: var(--g-border); }
[data-bs-theme="dark"] .dropdown-divider { border-color: var(--g-border); }
[data-bs-theme="dark"] .msg-link { background: var(--g-surface); color: #a9c1ff; border-color: #3b4f86; }
[data-bs-theme="dark"] .msg-link:hover { border-color: #a9c1ff; color: #a9c1ff; }