/* Semantics and focus apply in every theme. Contrast and motion are independent preferences. */
:root { --a11y-focus: #003d80; }
html[data-theme="dark"] { --a11y-focus: #ffff00; }
/* :focus-visible {
    outline: 3px solid var(--a11y-focus) !important;
    outline-offset: 3px;
} */
.sidebar-container :focus-visible, .mobile-topbar :focus-visible {
    outline-color: #ffff00 !important;
}
.skip-link {
    position: fixed;
    top: 8px;
    left: 8px;
    z-index: 2147483646;
    padding: 12px 20px;
    background: #ffffff;
    color: #000000;
    border: 3px solid #000000;
    font-weight: 700;
    transform: translateY(-200%);
}
.skip-link:focus { transform: none; }
#main-content { scroll-margin-top: 72px; }
html[data-contrast="high"] .theme-toggle { min-width: 36px; min-height: 36px; }
.sortable-header button { justify-content: flex-start; width: 100%; border: 0; background: transparent; color: inherit; font: inherit; padding: 0; text-align: inherit; cursor: pointer; }
.table-sort-button { border: 0; background: transparent; color: inherit; font: inherit; padding: 0; text-align: inherit; cursor: pointer; }
html[data-contrast="high"] .table-sort-button[aria-pressed="true"] { outline: 2px solid currentColor; text-decoration: underline; }
.chart-data-alternative { max-width: 100%; overflow: auto; }
.chart-data-alternative summary { cursor: pointer; }
html[data-contrast="high"] :is(.apexcharts-text, .apexcharts-legend-text) { fill: var(--cv-ink) !important; color: var(--cv-ink) !important; }
html[data-contrast="high"] .apexcharts-line { stroke: var(--cv-ink) !important; }
html[data-contrast="high"] .apexcharts-series:nth-of-type(2n) .apexcharts-line { stroke-dasharray: 8 4; }
html[data-contrast="high"] .apexcharts-series:nth-of-type(3n) .apexcharts-line { stroke-dasharray: 2 4; }
html[data-contrast="high"] :is(.pagination-nav, .pagination-number) { min-width: 36px; min-height: 36px; }

html[data-contrast="high"] {
    --cv-ink: #000000; --cv-muted: #000000; --cv-border: #000000;
    --cv-background: #ffffff; --cv-surface: #ffffff; --cv-hover: #eeeeee;
    --cv-green: #000000; --cv-green-hover: #000000; --cv-error: #850000;
    --cv-primary-contrast: #ffffff; --cv-secondary-contrast: #ffffff;
    --cv-info-contrast: #ffffff; --cv-error-contrast: #ffffff;
    --cv-theme-ink: #000000; --cv-theme-muted: #000000; --cv-theme-border: #000000;
    --cv-theme-surface: #ffffff; --cv-theme-raised: #ffffff;
    --cv-theme-info: #003d80; --cv-theme-success: #005a20; --cv-theme-error: #850000;
    --cv-theme-warning: #5a3a00; --cv-theme-purple: #4a0070;
    --cv-theme-info-bg: #ffffff; --cv-theme-success-bg: #ffffff; --cv-theme-error-bg: #ffffff;
    --cv-theme-warning-bg: #ffffff; --cv-theme-purple-bg: #ffffff;
    --reports-number-color-bold: #000000; --reports-number-color-normal: #000000;
    --secondary-text: #000000; --warning-text-color: #5a3a00;
    --bs-body-color: #000000; --bs-body-color-rgb: 0,0,0;
    --bs-body-bg: #ffffff; --bs-body-bg-rgb: 255,255,255;
    --bs-emphasis-color: #000000; --bs-emphasis-color-rgb: 0,0,0;
    --bs-secondary-color: #000000; --bs-secondary-bg: #ffffff; --bs-tertiary-bg: #ffffff;
    --bs-border-color: #000000;
    --bs-link-color: #003d80; --bs-link-hover-color: #003d80; --bs-link-color-rgb: 0,61,128;
    --bs-primary-rgb: 0,0,0; --bs-secondary-rgb: 0,0,0;
    --bs-success-rgb: 0,90,32; --bs-danger-rgb: 133,0,0; --bs-info-rgb: 0,61,128;
    --bs-light-rgb: 255,255,255;
    --primary: #000000; --secondary: #000000; --danger: #850000; --info: #003d80;
    --a11y-focus: #003d80;
}
html[data-theme="dark"][data-contrast="high"] {
    --cv-ink: #ffffff; --cv-muted: #ffffff; --cv-border: #ffffff;
    --cv-background: #000000; --cv-surface: #000000; --cv-hover: #222222;
    --cv-green: #ffff00; --cv-green-hover: #ffff00; --cv-error: #ffb4ab;
    --cv-primary-contrast: #000000; --cv-secondary-contrast: #000000;
    --cv-info-contrast: #000000; --cv-error-contrast: #000000;
    --cv-theme-ink: #ffffff; --cv-theme-muted: #ffffff; --cv-theme-border: #ffffff;
    --cv-theme-surface: #000000; --cv-theme-raised: #000000;
    --cv-theme-info: #9bcfff; --cv-theme-success: #8ff2c2; --cv-theme-error: #ffb4ab;
    --cv-theme-warning: #ffff00; --cv-theme-purple: #dfb5ff;
    --cv-theme-info-bg: #000000; --cv-theme-success-bg: #000000; --cv-theme-error-bg: #000000;
    --cv-theme-warning-bg: #000000; --cv-theme-purple-bg: #000000;
    --reports-number-color-bold: #ffffff; --reports-number-color-normal: #ffffff;
    --secondary-text: #ffffff; --warning-text-color: #ffff00;
    --bs-body-color: #ffffff; --bs-body-color-rgb: 255,255,255;
    --bs-body-bg: #000000; --bs-body-bg-rgb: 0,0,0;
    --bs-emphasis-color: #ffffff; --bs-emphasis-color-rgb: 255,255,255;
    --bs-secondary-color: #ffffff; --bs-secondary-bg: #000000; --bs-tertiary-bg: #000000;
    --bs-border-color: #ffffff;
    --bs-link-color: #ffff00; --bs-link-hover-color: #ffff00; --bs-link-color-rgb: 255,255,0;
    --bs-primary-rgb: 255,255,0; --bs-secondary-rgb: 255,255,255;
    --bs-success-rgb: 143,242,194; --bs-danger-rgb: 255,180,171; --bs-info-rgb: 155,207,255;
    --bs-light-rgb: 0,0,0;
    --primary: #ffff00; --secondary: #ffffff; --danger: #ffb4ab; --info: #9bcfff;
    --a11y-focus: #ffff00;
}
html[data-contrast="high"] .table {
    --bs-table-color: var(--cv-ink); --bs-table-bg: var(--cv-surface);
    --bs-table-striped-color: var(--cv-ink); --bs-table-striped-bg: var(--cv-surface);
    --bs-table-hover-color: var(--cv-ink); --bs-table-hover-bg: var(--cv-hover);
    --bs-table-border-color: var(--cv-border);
}
html[data-contrast="high"] :is(.mud-input-outlined-border, .mud-paper-outlined, .mud-table, .diagnostics-dialog, .form-select) {
    border: 2px solid var(--cv-border);
}
html[data-contrast="high"] :is(.btn, .mud-button-outlined, .pagination-nav, .pagination-number) {
    border: 2px solid currentColor;
}
/* Chip variants include text-only surfaces; retain a visible boundary in high contrast. */
html[data-contrast="high"] :is(.mud-chip, .pill, .billing-pill, .vi-pill, .customer-onboarding-status-pill) {
    border: 1px solid currentColor;
}
html[data-contrast="high"] :is(.mud-button-filled-primary, .btn-primary) {
    color: var(--cv-primary-contrast);
    background: var(--cv-green);
}
html[data-contrast="high"] .menu-node.is-current > .menu-node__row {
    outline: 2px solid #ffffff;
    outline-offset: -2px;
}
html[data-contrast="high"] a:not(.menu-node__control):not(.mud-button-root) { text-decoration: underline; }
html[data-motion="reduced"] *, html[data-motion="reduced"] *::before, html[data-motion="reduced"] *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
}
html[data-motion="reduced"] .diagnostics-matrix-rain span { transform: translateY(12vh); }

/* Let the user's Windows contrast palette win. Never use forced-color-adjust:none. */
@media (forced-colors: active) {
    :focus-visible { outline-color: Highlight !important; }
    :is(.mud-button-root, .btn, button, input, select, textarea) { border: 1px solid ButtonText; }
    :is(.diagnostics-dialog, .mud-paper, .table, .mud-table-cell) {
        background: Canvas !important;
        color: CanvasText !important;
        border-color: CanvasText !important;
    }
    :is(.diagnostics-exception, .diagnostics-error-message) {
        background: Canvas !important;
        color: CanvasText !important;
        border-color: CanvasText !important;
    }
    :is(.diagnostics-copy-button, .diagnostics-close-button, .diagnostics-motion-button) {
        background: ButtonFace !important;
        color: ButtonText !important;
        border-color: ButtonText !important;
    }
    /* Override author !important status fills while retaining the user's system palette. */
    html[data-theme] :is(.mud-chip, .chat-reasoning-effort-trigger, .chat-tool-button,
        .chat-attachment-chip, .chat-pending-attachment, .tool-info-pill, .tool-info-delegation,
        .pill, .billing-pill, .vi-pill, .customer-onboarding-status-pill, .rfb-pill) {
        background: ButtonFace !important;
        color: ButtonText !important;
        border: 1px solid ButtonText !important;
        box-shadow: none !important;
    }
    html[data-theme] :is(.chat-reasoning-effort-trigger, .chat-tool-button) .mud-typography {
        color: inherit !important;
    }
    html[data-theme] .chat-tool-button--active {
        outline: 2px solid Highlight;
        outline-offset: 1px;
    }
    html[data-theme] :is(.mud-chip.mud-disabled, .chat-reasoning-effort-trigger:disabled, .chat-tool-button:disabled) {
        color: GrayText !important;
        border-color: GrayText !important;
        opacity: 1;
    }
    .diagnostics-matrix-rain { display: none; }
}
@media print {
    .skip-link, .contrast-toggle { display: none !important; }
    html[data-contrast="high"] { --cv-surface: #ffffff; --cv-ink: #000000; --cv-border: #000000; }
}

html[data-contrast="high"] .pagination-number.active { background: var(--cv-green); color: var(--cv-primary-contrast); }
html[data-contrast="high"] .diagnostics-dialog { background: var(--cv-surface); color: var(--cv-ink); }
html[data-contrast="high"] :is(.diagnostics-dialog-header, .diagnostics-dialog-footer) { border-color: var(--cv-border); background: var(--cv-surface); }
html[data-contrast="high"] :is(.diagnostics-eyebrow, .diagnostics-dialog-close, .diagnostics-summary dt, .diagnostics-copy-detail, .diagnostics-close-button) { color: var(--cv-ink); }
html[data-contrast="high"] .diagnostics-error-message { background: var(--cv-surface); border-color: var(--cv-theme-error); }
html[data-contrast="high"] .diagnostics-copy-button { background: var(--cv-green); color: var(--cv-primary-contrast); }
html[data-contrast="high"] :is(.diagnostics-copy-button-secondary, .diagnostics-close-button) { background: var(--cv-surface); color: var(--cv-ink); border-color: var(--cv-border); }

/* Account menu is a hardcoded white card in app.css. Dark mode flips its text tokens
   to light colours, so the card has to follow or the labels disappear. */
html[data-theme="dark"] .user-popover-mud,
html[data-theme="dark"] .user-popover-collapsed {
    background-color: var(--cv-surface) !important;
    color: var(--cv-ink) !important;
    border: 1px solid var(--cv-border);
    box-shadow: 0 8px 28px rgb(0 0 0 / 45%) !important;
}
html[data-theme="dark"] .sidebar-user-menu-divider {
    background-color: var(--cv-border);
}
html[data-theme="dark"] .sidebar-user-menu-nav.mud-menu-item,
html[data-theme="dark"] .sidebar-user-menu-nav.mud-menu-item .mud-icon-root,
html[data-theme="dark"] .sidebar-user-menu-logout.mud-menu-item,
html[data-theme="dark"] .sidebar-user-menu-logout.mud-menu-item .mud-icon-root,
html[data-theme="dark"] .sidebar-user-menu-logout.mud-menu-item .mud-typography {
    color: var(--cv-ink) !important;
}
html[data-theme="dark"] .sidebar-user-menu-logout.mud-menu-item {
    background-color: color-mix(in srgb, var(--cv-ink) 6%, var(--cv-surface)) !important;
}
html[data-theme="dark"] .sidebar-user-menu-nav.mud-menu-item:hover:not(.sidebar-user-menu-nav-active),
html[data-theme="dark"] .sidebar-user-menu-logout.mud-menu-item:hover {
    background-color: var(--cv-hover) !important;
}
html[data-theme="dark"] .sidebar-user-menu-nav.mud-menu-item:hover:not(.sidebar-user-menu-nav-active) .mud-icon-root,
html[data-theme="dark"] .sidebar-user-menu-logout.mud-menu-item:hover .mud-icon-root {
    color: var(--cv-green) !important;
}
html[data-theme="dark"] .sidebar-user-menu-nav-active.mud-menu-item,
html[data-theme="dark"] .sidebar-user-menu-nav-active.mud-menu-item .mud-icon-root,
html[data-theme="dark"] .sidebar-user-menu-nav-active.mud-menu-item .mud-typography {
    background-color: color-mix(in srgb, var(--cv-green) 16%, var(--cv-surface)) !important;
    color: var(--cv-green) !important;
}