[data-bs-theme="dark"] {
    /* theme.css already raises the brand's lightness for this theme. */
    --app-primary: var(--bs-primary);
    --app-primary-hover: color-mix(in srgb, var(--bs-primary) 70%, #fff);
    --app-primary-subtle: color-mix(in srgb, var(--bs-primary) 20%, transparent);
}

/* Redefining --bs-dark-rgb overrides .bg-dark without fighting its !important. */
[data-bs-theme="dark"] .navbar.bg-dark {
    --bs-dark-rgb: 30, 32, 28;
}

[data-bs-theme="dark"] a.btn {
    color: var(--bs-btn-color);
}

[data-bs-theme="dark"] a.btn:hover {
    color: var(--bs-btn-hover-color);
}

[data-bs-theme="dark"] .sidebar {
    --bs-offcanvas-bg: #1e201c; /* mobile drawer area below .sidebar-inner */
    box-shadow: inset -1px 0 0 rgba(255, 255, 255, .1);
}

/* !important and higher specificity to beat the blanket .bg-light remap below. */
[data-bs-theme="dark"] .sidebar .bg-light {
    background-color: #1e201c !important;
}

[data-bs-theme="dark"] .sidebar .nav-link {
    color: var(--bs-body-color);
}

/* Through the variable and above the .active rule, so .active keeps winning border-left-color. */
[data-bs-theme="dark"] .sidebar {
    --sidebar-rail: rgba(255, 255, 255, .18);
}

[data-bs-theme="dark"] .sidebar .nav-link.section-open {
    color: #fff;
}

[data-bs-theme="dark"] .sidebar .nav-link.sidebar-sub {
    color: var(--bs-secondary-color);
}

/* Color only: bg/border/weight come from erp_style.css via --app-primary-subtle. */
[data-bs-theme="dark"] .sidebar .nav-link.active {
    color: var(--app-primary);
}

[data-bs-theme="dark"] .sidebar .nav-link:hover {
    background-color: rgba(255, 255, 255, .05);
}

[data-bs-theme="dark"] .sidebar-collapse-toggle {
    border-top-color: rgba(255, 255, 255, .1);
    color: var(--bs-secondary-color);
}

[data-bs-theme="dark"] .sidebar-collapse-toggle:hover {
    background-color: rgba(255, 255, 255, .05);
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .small_text {
    color: var(--bs-secondary-color);
}

[data-bs-theme="dark"] .error-text {
    color: #ea868f;
}

[data-bs-theme="dark"] .draft {
    color: var(--bs-secondary-color);
}

[data-bs-theme="dark"] .draft a {
    color: var(--bs-secondary-color);
}

[data-bs-theme="dark"] .loader {
    border-color: var(--bs-secondary-bg);
    border-top-color: var(--bs-link-color);
}

[data-bs-theme="dark"] .custom-file-border {
    color: var(--bs-body-color);
    background-color: var(--bs-tertiary-bg);
    border-color: var(--bs-border-color);
}

[data-bs-theme="dark"] .custom-file-ext-border {
    color: var(--bs-body-color);
    background-color: var(--bs-secondary-bg);
    border-color: var(--bs-border-color);
}

/* .murupolku sets a fixed text colour; the background follows --bs-tertiary-bg. */
[data-bs-theme="dark"] .murupolku {
    color: var(--bs-link-color);
}

[data-bs-theme="dark"] .drop-target {
    border-color: var(--bs-border-color);
    background: var(--bs-primary);
    color: #ffffff;
}

[data-bs-theme="dark"] .kommentti1 {
    border-color: var(--bs-border-color);
    background-color: var(--bs-tertiary-bg);
}

[data-bs-theme="dark"] .kommentti2 {
    border-color: var(--bs-border-color);
    background-color: var(--bs-body-bg);
}

[data-bs-theme="dark"] .ryhman_kommentit {
    border-color: var(--bs-border-color);
}

[data-bs-theme="dark"] .recent_comment .details3 {
    color: var(--bs-secondary-color);
}

[data-bs-theme="dark"] .recent_details {
    color: var(--bs-secondary-color);
}

[data-bs-theme="dark"] .list-group-item.active {
    background-color: var(--bs-tertiary-bg);
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .list-group-item.active a[data-bs-target="#collapseMetadata"] {
    color: var(--bs-body-color) !important;
}

[data-bs-theme="dark"] .punainen {
    color: #ea868f;
}

[data-bs-theme="dark"] .has-error {
    color: #ea868f;
}

[data-bs-theme="dark"] #cal-slide-content a.event-item {
    color: var(--bs-body-color);
}

/* The default icon is a pale glyph on solid white; a substring match so the hashed name still hits. */
[data-bs-theme="dark"] img[src*="group_font_awesome"] {
    content: url("../images/group_font_awesome_dark.png");
}

[data-bs-theme="dark"] .details3 {
    color: var(--bs-secondary-color);
}

/* Event state classes get no dark variants: as the calendar's legend they must match the feed's colours. */

/* Choices.js through variables: selector overrides lose a specificity tie to the library's later-loaded rule. */
[data-bs-theme="dark"] .choices {
    --choices-bg-color: var(--bs-tertiary-bg);
    --choices-bg-color-dropdown: var(--bs-tertiary-bg);
    --choices-bg-color-disabled: var(--bs-secondary-bg);
    --choices-text-color: var(--bs-body-color);
    --choices-keyline-color: var(--bs-border-color);
    --choices-highlighted-color: var(--bs-secondary-bg);
    --choices-disabled-color: #6c757d;
    /* The remove cross image suits the blue pill; the library has no --choices-icon-cross, so it stays. */
    --choices-primary-color: var(--bs-primary);
    --choices-item-color: #ffffff;
}

/* The library's .choices__inner and .choices__list do not take the colour from the variable everywhere. */
[data-bs-theme="dark"] .choices__inner,
[data-bs-theme="dark"] .choices__list--dropdown .choices__item,
[data-bs-theme="dark"] .choices__input {
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .tempus-dominus-widget {
    background-color: var(--bs-tertiary-bg);
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .tempus-dominus-widget .date-container-days .day:hover,
[data-bs-theme="dark"] .tempus-dominus-widget .date-container-months .month:hover,
[data-bs-theme="dark"] .tempus-dominus-widget .date-container-years .year:hover,
[data-bs-theme="dark"] .tempus-dominus-widget .date-container-decades .decade:hover,
[data-bs-theme="dark"] .tempus-dominus-widget .time-container .time-container-clock div:hover,
[data-bs-theme="dark"] .tempus-dominus-widget .time-container .time-container-counter div:hover {
    background-color: var(--bs-secondary-bg);
}

[data-bs-theme="dark"] .file-preview {
    background-color: var(--bs-tertiary-bg);
    border-color: var(--bs-border-color);
}

[data-bs-theme="dark"] .file-drop-zone {
    background-color: var(--bs-body-bg);
    border-color: var(--bs-border-color);
    color: var(--bs-secondary-color);
}

[data-bs-theme="dark"] .ck-editor__editable {
    background-color: var(--bs-tertiary-bg) !important;
    color: var(--bs-body-color) !important;
}

[data-bs-theme="dark"] .ck.ck-toolbar {
    background-color: var(--bs-secondary-bg) !important;
    border-color: var(--bs-border-color) !important;
}

[data-bs-theme="dark"] .ck.ck-editor__main > .ck-editor__editable {
    border-color: var(--bs-border-color) !important;
}

[data-bs-theme="dark"] .ck.ck-button:not(.ck-disabled):hover,
[data-bs-theme="dark"] .ck.ck-button.ck-on {
    background-color: var(--bs-border-color) !important;
}

[data-bs-theme="dark"] .ck.ck-toolbar .ck.ck-toolbar__separator {
    background-color: var(--bs-border-color) !important;
}

[data-bs-theme="dark"] .ck.ck-list__item .ck-button:hover:not(.ck-disabled) {
    background-color: var(--bs-secondary-bg) !important;
}

[data-bs-theme="dark"] .ck.ck-dropdown__panel {
    background-color: var(--bs-tertiary-bg) !important;
    border-color: var(--bs-border-color) !important;
}

[data-bs-theme="dark"] .ck.ck-icon,
[data-bs-theme="dark"] .ck.ck-button {
    color: var(--bs-body-color) !important;
}

[data-bs-theme="dark"] .bg-light {
    background-color: var(--bs-body-bg) !important;
}

[data-bs-theme="dark"] .btn-light {
    --bs-btn-color: var(--bs-body-color);
    --bs-btn-bg: var(--bs-secondary-bg);
    --bs-btn-border-color: var(--bs-border-color);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #3d444b;
    --bs-btn-hover-border-color: #565e67;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-border-color);
    --bs-btn-active-border-color: #565e67;
}

[data-bs-theme="dark"] table.dataTable tbody tr {
    background-color: var(--bs-body-bg);
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] table.dataTable tbody tr:hover {
    background-color: var(--bs-tertiary-bg);
}

[data-bs-theme="dark"] table.dataTable.table-striped > tbody > tr:nth-of-type(odd) > * {
    box-shadow: inset 0 0 0 9999px rgba(255, 255, 255, .03);
    color: var(--bs-body-color);
}

/* Bootstrap keeps these variants pale in any theme. Hover, striped and active shades derive from the row's
   own background, as Bootstrap's would flash the pale one back. */
[data-bs-theme="dark"] .table-success,
[data-bs-theme="dark"] .table-warning,
[data-bs-theme="dark"] .table-info,
[data-bs-theme="dark"] .table-danger,
[data-bs-theme="dark"] .table-light,
[data-bs-theme="dark"] .table-secondary {
    --bs-table-color: var(--bs-body-color);
    --bs-table-striped-color: var(--bs-body-color);
    --bs-table-striped-bg: color-mix(in srgb, var(--bs-table-bg) 94%, #fff);
    --bs-table-active-color: var(--bs-body-color);
    --bs-table-active-bg: color-mix(in srgb, var(--bs-table-bg) 86%, #fff);
    --bs-table-hover-color: var(--bs-body-color);
    --bs-table-hover-bg: color-mix(in srgb, var(--bs-table-bg) 90%, #fff);
}

[data-bs-theme="dark"] .table-success {
    --bs-table-bg: #10402c;
    --bs-table-border-color: #1c5c41;
}

[data-bs-theme="dark"] .table-warning {
    --bs-table-bg: #453607;
    --bs-table-border-color: #6b5408;
}

[data-bs-theme="dark"] .table-info {
    --bs-table-bg: #0b3d4a;
    --bs-table-border-color: #145a6b;
}

[data-bs-theme="dark"] .table-danger {
    --bs-table-bg: #4a1519;
    --bs-table-border-color: #6e2026;
}

[data-bs-theme="dark"] .table-light {
    --bs-table-bg: var(--bs-tertiary-bg);
    --bs-table-border-color: var(--bs-border-color);
}

[data-bs-theme="dark"] .table-secondary {
    --bs-table-bg: var(--bs-secondary-bg);
    --bs-table-border-color: var(--bs-border-color);
}

/* The work turn time highlight (erp_style.css) is a dark red for the pale rows. */
[data-bs-theme="dark"] .time-differs {
    color: #ea868f;
}