/* ================================================
   Dark mode: header outline buttons only
   Menu + page buttons use template vars + custom-service-colors.css
   ================================================ */

/* Outline buttons in header (dark page background) */
[color-scheme="dark"] .mxd-header__controls .btn-outline,
[color-scheme="dark"] .mxd-header__controls .btn-outline .btn-caption,
[color-scheme="dark"] .mxd-header__controls .btn-outline i {
    color: var(--base-opp) !important;
    border-color: var(--base-opp) !important;
}

[color-scheme="dark"] .mxd-header__controls .btn-outline:hover {
    background-color: var(--base-opp) !important;
    border-color: var(--base-opp) !important;
}

[color-scheme="dark"] .mxd-header__controls .btn-outline:hover .btn-caption,
[color-scheme="dark"] .mxd-header__controls .btn-outline:hover i {
    color: var(--base) !important;
}