/* Dark-mode refinements layered after components/pages. Tokens carry the bulk
   of the switch (see tokens.css [data-bs-theme="dark"]); this file only holds
   the pieces variable remapping cannot express: the saturated suite-bar accent
   on filled controls, native-control polish, and login-page specifics. */

/* Accent fills (primary buttons, launcher tiles) use the saturated bar accent
   #0277d3 instead of the lighter interactive blue: white content on #479ef5 is
   only ~2.8:1, while on #0277d3 it is 4.6:1 (AA). Text, links, and focus rings
   keep the lighter blue for contrast against charcoal. */
[data-bs-theme="dark"] .btn-primary {
    --bs-btn-bg: var(--color-suite-bar);
    --bs-btn-border-color: var(--color-suite-bar);
    --bs-btn-hover-bg: #0269b8;
    --bs-btn-hover-border-color: #0269b8;
    --bs-btn-active-bg: #0269b8;
    --bs-btn-active-border-color: #0269b8;
    --bs-btn-disabled-bg: var(--color-surface-hover);
    --bs-btn-disabled-border-color: var(--color-border-subtle);
}

[data-bs-theme="dark"] .tile-blue {
    background: var(--color-suite-bar);
}

/* Native controls: dark calendar/clock pickers, scrollbars, autofill. */
[data-bs-theme="dark"] input[type="date"],
[data-bs-theme="dark"] input[type="datetime-local"],
[data-bs-theme="dark"] input[type="time"] {
    color-scheme: dark;
}

[data-bs-theme="dark"] ::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

[data-bs-theme="dark"] ::-webkit-scrollbar-thumb {
    background: #484644;
    border: 3px solid #11100f;
    border-radius: 8px;
}

[data-bs-theme="dark"] ::-webkit-scrollbar-track {
    background: transparent;
}

[data-bs-theme="dark"] input:-webkit-autofill,
[data-bs-theme="dark"] textarea:-webkit-autofill,
[data-bs-theme="dark"] select:-webkit-autofill {
    -webkit-text-fill-color: var(--color-text);
    caret-color: var(--color-text);
    transition: background-color 600000s 0s, color 600000s 0s;
}

/* Login page keeps its split card readable in dark mode. */
[data-bs-theme="dark"] .login-brand {
    color: var(--color-text);
}
