/* The toggle is the only addition to light mode. All palette overrides are scoped. */
.menu-header .theme-toggle-dm {
    position: absolute;
    top: 5px;
    right: .7rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 10px;
    border: 0;
    border-radius: var(--bs-border-radius);
    background: transparent;
    color: var(--bs-white);
}

.theme-toggle-dm[hidden],
.theme-toggle-dm .bi-sun,
[data-bs-theme="dark"] .theme-toggle-dm .bi-moon-stars {
    display: none;
}

[data-bs-theme="dark"] .theme-toggle-dm .bi-sun {
    display: block;
}

.theme-toggle-dm:hover {
    background-color: var(--bs-gray-700);
}

.theme-toggle-dm:focus-visible {
    outline: 2px solid var(--bs-white);
    outline-offset: -2px;
}

.theme-toggle-dm svg {
    width: 22px;
    height: 22px;
}

[data-bs-theme="dark"] {
    color-scheme: dark;
    --bs-body-bg: var(--bs-gray-900);
    --bs-body-color: var(--bs-gray-300);
    --bs-emphasis-color: var(--bs-white);
    --bs-secondary-color: var(--bs-gray-400);
    --bs-secondary-bg: var(--bs-gray-800);
    --bs-tertiary-color: var(--bs-gray-500);
    --bs-tertiary-bg: var(--bs-gray-800);
    --bs-heading-color: var(--bs-white);
    --bs-link-color: var(--bs-gray-300);
    --bs-link-hover-color: var(--bs-white);
    --bs-border-color: var(--bs-gray-600);
    --bs-border-color-translucent: var(--bs-gray-700);
    --bs-code-color: var(--bs-gray-200);
    --bs-highlight-bg: var(--bs-gray-700);
    --bs-primary-text-emphasis: var(--bs-gray-200);
    --bs-secondary-text-emphasis: var(--bs-gray-300);
    --bs-success-text-emphasis: var(--bs-gray-200);
    --bs-info-text-emphasis: var(--bs-gray-200);
    --bs-warning-text-emphasis: var(--bs-gray-200);
    --bs-danger-text-emphasis: var(--bs-gray-200);
    --bs-light-text-emphasis: var(--bs-gray-200);
    --bs-dark-text-emphasis: var(--bs-gray-300);
    --bs-primary-bg-subtle: var(--bs-gray-800);
    --bs-secondary-bg-subtle: var(--bs-gray-800);
    --bs-success-bg-subtle: var(--bs-gray-800);
    --bs-info-bg-subtle: var(--bs-gray-800);
    --bs-warning-bg-subtle: var(--bs-gray-800);
    --bs-danger-bg-subtle: var(--bs-gray-800);
    --bs-light-bg-subtle: var(--bs-gray-800);
    --bs-dark-bg-subtle: var(--bs-gray-900);
    --bs-primary-border-subtle: var(--bs-gray-600);
    --bs-secondary-border-subtle: var(--bs-gray-600);
    --bs-success-border-subtle: var(--bs-gray-600);
    --bs-info-border-subtle: var(--bs-gray-600);
    --bs-warning-border-subtle: var(--bs-gray-600);
    --bs-danger-border-subtle: var(--bs-gray-600);
    --bs-light-border-subtle: var(--bs-gray-600);
    --bs-dark-border-subtle: var(--bs-gray-600);
}

/* Bootstrap utilities use RGB variables; override their rendered colors here. */
[data-bs-theme="dark"] a {
    color: var(--bs-gray-300);
    text-decoration-color: currentColor;
}

[data-bs-theme="dark"] a:hover,
[data-bs-theme="dark"] a:focus-visible {
    color: var(--bs-white);
}

[data-bs-theme="dark"] .link-secondary,
[data-bs-theme="dark"] .text-primary,
[data-bs-theme="dark"] .text-secondary,
[data-bs-theme="dark"] .text-success,
[data-bs-theme="dark"] .text-info,
[data-bs-theme="dark"] .text-warning,
[data-bs-theme="dark"] .text-danger,
[data-bs-theme="dark"] .text-dark,
[data-bs-theme="dark"] .text-body,
[data-bs-theme="dark"] .text-muted {
    color: var(--bs-gray-300) !important;
}

[data-bs-theme="dark"] .link-secondary:hover,
[data-bs-theme="dark"] .link-secondary:focus-visible {
    color: var(--bs-white) !important;
}

[data-bs-theme="dark"] .menu-header {
    background-color: var(--bs-gray-900) !important;
    border-color: var(--bs-gray-600);
}

[data-bs-theme="dark"] .menu-header .nav-link {
    color: var(--bs-gray-300);
}

[data-bs-theme="dark"] .menu-header .nav-link:is(:hover, :focus-visible, .active) {
    color: var(--bs-white);
}

[data-bs-theme="dark"] .blog-header,
[data-bs-theme="dark"] .bg-primary {
    background-color: var(--bs-gray-800) !important;
}

[data-bs-theme="dark"] .border-primary,
[data-bs-theme="dark"] .card-header:first-child {
    border-color: var(--bs-gray-600) !important;
}

[data-bs-theme="dark"] .card {
    --bs-card-bg: var(--bs-gray-800);
    --bs-card-color: var(--bs-gray-300);
    --bs-card-border-color: var(--bs-gray-600);
    --bs-card-cap-bg: var(--bs-gray-900);
}

[data-bs-theme="dark"] .card-meta,
[data-bs-theme="dark"] .card-footer {
    background-color: var(--bs-gray-900);
}

[data-bs-theme="dark"] .card-header.bg-primary {
    background-color: var(--bs-gray-700) !important;
}

[data-bs-theme="dark"] .recommended-series h2,
[data-bs-theme="dark"] .latest-posts-title,
[data-bs-theme="dark"] .recommended-series-group h3 {
    color: var(--bs-white);
    border-color: var(--bs-gray-600);
}

[data-bs-theme="dark"] .blog-h3 {
    border-color: var(--bs-gray-500);
}

[data-bs-theme="dark"] .category-parent {
    background-color: var(--bs-gray-700);
    color: var(--bs-white);
}

[data-bs-theme="dark"] .category-child {
    background-color: var(--bs-gray-600);
    color: var(--bs-white);
}

[data-bs-theme="dark"] .category-grandchild {
    background-color: var(--bs-gray-400);
    color: var(--bs-gray-900);
}

[data-bs-theme="dark"] .btn-outline-primary,
[data-bs-theme="dark"] .btn-outline-light {
    --bs-btn-color: var(--bs-gray-200);
    --bs-btn-border-color: var(--bs-gray-500);
    --bs-btn-hover-color: var(--bs-white);
    --bs-btn-hover-bg: var(--bs-gray-700);
    --bs-btn-hover-border-color: var(--bs-gray-400);
    --bs-btn-active-color: var(--bs-gray-900);
    --bs-btn-active-bg: var(--bs-gray-300);
    --bs-btn-active-border-color: var(--bs-gray-300);
    --bs-btn-disabled-color: var(--bs-gray-500);
    --bs-btn-disabled-border-color: var(--bs-gray-600);
    color: var(--bs-btn-color);
    border-color: var(--bs-btn-border-color);
}

[data-bs-theme="dark"] .btn-list-link {
    background-color: var(--bs-gray-800);
}

[data-bs-theme="dark"] .btn-outline-primary:hover,
[data-bs-theme="dark"] .btn-outline-light:hover {
    color: var(--bs-white) !important;
    background-color: var(--bs-gray-700);
    border-color: var(--bs-gray-400);
}

[data-bs-theme="dark"] .btn-outline-primary:active,
[data-bs-theme="dark"] .btn-outline-light:active {
    color: var(--bs-gray-900) !important;
    background-color: var(--bs-gray-300) !important;
    border-color: var(--bs-gray-300) !important;
}

[data-bs-theme="dark"] .btn-list-link:hover .badge,
[data-bs-theme="dark"] .btn-list-link:active .badge {
    color: var(--bs-gray-900);
    background-color: var(--bs-gray-200);
}

[data-bs-theme="dark"] .page-link {
    color: var(--bs-gray-200);
    background-color: var(--bs-gray-800);
    border-color: var(--bs-gray-600);
}

[data-bs-theme="dark"] .page-link:hover,
[data-bs-theme="dark"] .page-link:focus,
[data-bs-theme="dark"] .page-item.active .page-link {
    color: var(--bs-white);
    background-color: var(--bs-gray-700) !important;
    border-color: var(--bs-gray-400) !important;
}

[data-bs-theme="dark"] .page-item.disabled .page-link {
    color: var(--bs-gray-500);
    background-color: var(--bs-gray-900);
}

[data-bs-theme="dark"] .list-group-item {
    color: var(--bs-gray-300);
    background-color: var(--bs-gray-800);
    border-color: var(--bs-gray-600);
}

[data-bs-theme="dark"] .list-group-item-action:hover,
[data-bs-theme="dark"] .list-group-item-action:focus,
[data-bs-theme="dark"] .list-group-item.active {
    color: var(--bs-white);
    background-color: var(--bs-gray-700);
    border-color: var(--bs-gray-600);
}

[data-bs-theme="dark"] .table {
    --bs-table-color: var(--bs-gray-300);
    --bs-table-bg: transparent;
    --bs-table-border-color: var(--bs-gray-600);
    --bs-table-striped-color: var(--bs-gray-300);
    --bs-table-striped-bg: var(--bs-gray-900);
    --bs-table-hover-color: var(--bs-white);
    --bs-table-hover-bg: var(--bs-gray-700);
    --bs-table-active-color: var(--bs-white);
    --bs-table-active-bg: var(--bs-gray-700);
}

[data-bs-theme="dark"] .post-body :is(th, td) {
    border-color: var(--bs-gray-600);
}

[data-bs-theme="dark"] .post-body pre,
[data-bs-theme="dark"] .post-body pre code,
[data-bs-theme="dark"] .hljs {
    color: var(--bs-gray-200);
    background-color: var(--bs-gray-900);
}

[data-bs-theme="dark"] .hljs [class*="hljs-"],
[data-bs-theme="dark"] .post-body pre [class*="hljs-"] {
    color: var(--bs-gray-300);
    background-color: transparent;
}

[data-bs-theme="dark"] .hljs :is(.hljs-keyword, .hljs-title, .hljs-built_in),
[data-bs-theme="dark"] .post-body pre :is(.hljs-keyword, .hljs-title, .hljs-built_in) {
    color: var(--bs-white);
    font-weight: 700;
}

[data-bs-theme="dark"] .hljs :is(.hljs-comment, .hljs-quote),
[data-bs-theme="dark"] .post-body pre :is(.hljs-comment, .hljs-quote) {
    color: var(--bs-gray-500);
    font-style: italic;
}

[data-bs-theme="dark"] mjx-container {
    color: var(--bs-gray-200);
}

[data-bs-theme="dark"] .form-control {
    color: var(--bs-gray-200);
    background-color: var(--bs-gray-800);
    border-color: var(--bs-gray-500);
    caret-color: var(--bs-white);
}

[data-bs-theme="dark"] .form-control::placeholder {
    color: var(--bs-gray-400);
}

[data-bs-theme="dark"] .form-control:focus {
    border-color: var(--bs-gray-300);
    box-shadow: none;
}

[data-bs-theme="dark"] :is(a, button, input, select, textarea):focus-visible {
    outline: 2px solid var(--bs-gray-200);
    outline-offset: 2px;
    box-shadow: none;
}

/* Preserve the content of raster screenshots/plots, including transparent ones. */
[data-bs-theme="dark"] .post-body img:not([data-theme-svg]),
[data-bs-theme="dark"] img.theme-svg-fallback-dm {
    background-color: var(--bs-white);
}

[data-bs-theme="dark"] img.theme-svg-pending-dm {
    visibility: hidden;
}

/* Legacy graph labels: retain the distinction without red/blue. */
[data-bs-theme="dark"] .post-body [style*="color:red"] {
    color: var(--bs-white) !important;
    text-decoration: underline;
}

[data-bs-theme="dark"] .post-body [style*="color:blue"] {
    color: var(--bs-gray-400) !important;
    text-decoration: underline double;
}
