/* Readable text in both themes (2026-10-22). Loaded after coreui.css and the page's own stylesheet by every layout
 * (the signed-in sidebar and the sign-in pages), so it wins on equal specificity.
 *
 * Found by measuring the contrast of every visible text on every page in light, dark-by-system and dark-by-pick
 * (WCAG: 4.5:1, 3:1 for large text). The causes:
 *  - CoreUI's dark palette keeps the light theme's emphasis and subtle colours: text-*-emphasis was near-black on the
 *    dark page, bg-*-subtle badges stayed pale under white text, primary turned CoreUI's own purple, and secondary
 *    outline buttons stayed #6b7785 (3.3:1 on the dark cards);
 *  - the dark sidebar's section titles at 38 % white;
 *  - status colours made for bars (bright green, amber) also used as text on white;
 *  - text-warning (#f9b115) as text on white.
 * The theme itself now lives on both attributes, data-coreui-theme and data-bs-theme (main.js, color-modes.js).
 */

/* ---- dark: CoreUI tokens ----------------------------------------------------------------------------------- */
[data-coreui-theme=dark] {
    --cui-primary: #72aaff;
    --cui-primary-rgb: 114, 170, 255;
    --cui-link-color: #8fb8ff;
    --cui-link-color-rgb: 143, 184, 255;
    --cui-link-hover-color: #b6d0ff;
    --cui-link-hover-color-rgb: 182, 208, 255;
    --cui-success: #43c06b;
    --cui-success-rgb: 67, 192, 107;
    --cui-danger: #f07373;
    --cui-danger-rgb: 240, 115, 115;
    --cui-tertiary-color: rgba(255, 255, 255, 0.5);

    /* Text on the dark page: light tints. */
    --cui-primary-text-emphasis: #b6d0ff;
    --cui-secondary-text-emphasis: #c3c9d1;
    --cui-success-text-emphasis: #7fdca0;
    --cui-info-text-emphasis: #7fd9f0;
    --cui-warning-text-emphasis: #ffd56b;
    --cui-danger-text-emphasis: #f5a3a3;
    --cui-light-text-emphasis: #f3f4f7;
    --cui-dark-text-emphasis: #dbdfe6;

    /* Subtle surfaces on the dark page: dark tints, so the emphasis text above reads on them. */
    --cui-primary-bg-subtle: #1e2a4b;
    --cui-secondary-bg-subtle: #2a303c;
    --cui-success-bg-subtle: #10301d;
    --cui-info-bg-subtle: #0b2f3a;
    --cui-warning-bg-subtle: #3a2c06;
    --cui-danger-bg-subtle: #3d1519;
    --cui-light-bg-subtle: #2a303d;
    --cui-dark-bg-subtle: #1a1d22;
    --cui-primary-border-subtle: #34477a;
    --cui-secondary-border-subtle: #4a5363;
    --cui-success-border-subtle: #1d6b3a;
    --cui-info-border-subtle: #0e6a80;
    --cui-warning-border-subtle: #8a6a10;
    --cui-danger-border-subtle: #8a2a33;
}

/* Solid primary surfaces (step dots, bg-primary chips) stay a deep blue that carries white text; pagination below. */
[data-coreui-theme=dark] .bg-primary {
    background-color: #3f63d8 !important;
}

/* ---- dark: outline buttons ---------------------------------------------------------------------------------- */
[data-coreui-theme=dark] .btn-outline-primary {
    --cui-btn-color: #8fb8ff;
    --cui-btn-border-color: #5f86d9;
    --cui-btn-hover-color: #fff;
    --cui-btn-hover-bg: #3f63d8;
    --cui-btn-hover-border-color: #3f63d8;
    --cui-btn-active-color: #fff;
    --cui-btn-active-bg: #3f63d8;
    --cui-btn-active-border-color: #3f63d8;
    --cui-btn-disabled-color: #8fb8ff;
    --cui-btn-disabled-border-color: #5f86d9;
}
[data-coreui-theme=dark] .btn-outline-secondary {
    --cui-btn-color: #b4bdc8;
    --cui-btn-border-color: #5d6878;
    --cui-btn-hover-color: #fff;
    --cui-btn-hover-bg: #4d5767;
    --cui-btn-hover-border-color: #5d6878;
    --cui-btn-active-color: #fff;
    --cui-btn-active-bg: #4d5767;
    --cui-btn-active-border-color: #5d6878;
    --cui-btn-disabled-color: #8a94a1;
    --cui-btn-disabled-border-color: #4d5767;
}
[data-coreui-theme=dark] .btn-outline-success {
    --cui-btn-color: #43c06b;
    --cui-btn-border-color: #43c06b;
    --cui-btn-active-bg: #1f7a3d;
    --cui-btn-active-border-color: #1f7a3d;
    --cui-btn-active-color: #fff;
}
[data-coreui-theme=dark] .btn-outline-danger {
    --cui-btn-color: #f07373;
    --cui-btn-border-color: #f07373;
    --cui-btn-active-bg: #b83a3a;
    --cui-btn-active-border-color: #b83a3a;
    --cui-btn-active-color: #fff;
}
[data-coreui-theme=dark] .dropdown-menu {
    --cui-dropdown-header-color: #aab3c5;
}

/* ---- light ------------------------------------------------------------------------------------------------- */
.btn-outline-secondary {
    --cui-btn-color: #56606d;
    --cui-btn-active-bg: #565f6b;
    --cui-btn-active-border-color: #565f6b;
}
:root:not([data-coreui-theme=dark]) .btn-outline-success {
    --cui-btn-color: #177a35;
    --cui-btn-border-color: #177a35;
    --cui-btn-active-bg: #177a35;
    --cui-btn-active-border-color: #177a35;
}
:root:not([data-coreui-theme=dark]) {
    --cui-secondary-bg-subtle: #e2e5e9;
}
.dropdown-menu {
    --cui-dropdown-header-color: #56627a;
}
:root:not([data-coreui-theme=dark]) .text-warning {
    color: #9a5b06 !important;
}
:root:not([data-coreui-theme=dark]) .text-success {
    color: #177a35 !important;
}
:root:not([data-coreui-theme=dark]) .text-danger {
    color: #c43c3c !important;
}

/* ---- both ------------------------------------------------------------------------------------------------- */
/* The sidebar is dark in both themes: its section titles at 60 % white instead of 38 %. */
.sidebar-dark .sidebar-nav .nav-title {
    color: rgba(255, 255, 255, 0.6);
}

/* Solid status surfaces under white text: shades deep enough for it in both themes (CoreUI's #1b9e3e and #6b7785
 * carried white at 3.5:1 and 3.4:1, and the lighter dark-theme success above would drop it to 2.3:1). */
.bg-success {
    background-color: #1d7a3a !important;
}
.bg-danger {
    background-color: #b83a3a !important;
}
.bg-secondary {
    background-color: #565f6b !important;
}
.pagination {
    --cui-pagination-active-bg: #3f63d8;
    --cui-pagination-active-border-color: #3f63d8;
    --cui-pagination-active-color: #fff;
}
:root:not([data-coreui-theme=dark]) .btn-outline-danger {
    --cui-btn-color: #c43c3c;
    --cui-btn-border-color: #c43c3c;
}

/* A muted line inside a selected toggle button follows the button's text, not the page's muted colour. */
.btn-check:checked + .btn .text-body-secondary {
    color: inherit !important;
    opacity: 0.85;
}

/* A status colour made for a bar (#22C55E, #F59E0B, …) shown as text: the same hue, darkened on a light page and
 * lightened on a dark one. Templates set --fit-status instead of color. */
.fit-status-text {
    color: color-mix(in srgb, var(--fit-status, currentColor) 62%, #000);
}
[data-coreui-theme=dark] .fit-status-text {
    color: color-mix(in srgb, var(--fit-status, currentColor) 70%, #fff);
}

/* A category glyph on its own colour's pale tint (yellow on pale yellow was 1.8:1): a deeper shade of the same hue on
 * a light page, a slightly lighter one on a dark page, so the icon keeps its category colour and reaches 3:1. */
.fit-glyph {
    color: color-mix(in srgb, var(--fit-glyph, currentColor) 70%, #000);
}
[data-coreui-theme=dark] .fit-glyph {
    color: color-mix(in srgb, var(--fit-glyph, currentColor) 82%, #fff);
}
/* The picked icon in the category form: a light frame instead of the solid grey that hid a coloured glyph. */
#category-icon-picker .btn-check:checked + .btn {
    background-color: var(--cui-tertiary-bg);
    border: 2px solid var(--cui-primary);
}

/* An ended budget, a dormant savings goal, a closed account or a paused recurring transaction: drained of colour rather than faded, so its text stays readable. */
[data-fit-dormant=true] {
    filter: saturate(0.25);
}