html.dark-mode {
    color-scheme: dark;
    --dm-bg: #0d1422;
    --dm-shell: #101827;
    --dm-surface: #172033;
    --dm-surface-2: #1d283b;
    --dm-surface-3: #243047;
    --dm-input: #111a2b;
    --dm-border: #334155;
    --dm-border-soft: #263449;
    --dm-text: #e7edf7;
    --dm-text-strong: #f4f7fb;
    --dm-text-muted: #aeb8c8;
    --dm-text-soft: #8794a8;
    --dm-primary: #8da2ff;
    --dm-primary-strong: #aebdff;
    --dm-primary-surface: rgba(141, 162, 255, 0.16);
    --dm-blue: #7cc7f4;
    --dm-green: #5fd6a6;
    --dm-yellow: #e7c56f;
    --dm-red: #f18b99;
    --dm-purple: #c5b5ff;
    --dm-orange: #e8b27a;
    --dm-shadow: 0 16px 36px rgba(0, 0, 0, 0.28);
}

html.dark-mode,
html.dark-mode body,
html.dark-mode .mud-layout,
html.dark-mode .modern-main-content,
html.dark-mode .mud-main-content {
    background: var(--dm-bg) !important;
    color: var(--dm-text) !important;
}

html.dark-mode body :is(.mud-typography, p, span, label, small, strong, h1, h2, h3, h4, h5, h6) {
    color: inherit;
}

html.dark-mode body :is(
    .modern-appbar,
    .modern-drawer,
    .mud-appbar,
    .mud-drawer,
    .mud-paper,
    .mud-card,
    .mud-dialog,
    .mud-popover,
    .mud-menu,
    .mud-list,
    .mud-table,
    .mud-table-container,
    .mud-data-grid,
    .mud-tabs,
    .mud-tabs-panels,
    .mud-tabs-toolbar
) {
    background: var(--dm-surface) !important;
    background-color: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}

html.dark-mode body :is(
    .page-header,
    .dashboard-card,
    .metric-card,
    .summary-card,
    .summary-tile,
    .summary-metric,
    .filters-section,
    .filters-card,
    .filter-card,
    .filter-bar,
    .content-section,
    .modern-table-container,
    .modern-table-wrapper,
    .modern-table,
    .table-view,
    .data-table,
    .requests-hero,
    .requests-tabs,
    .requests-tab-panel,
    .requests-hero-stat,
    .requests-container,
    .view-header,
    .view-tabs,
    .approval-header-card,
    .approval-card,
    .approval-request-card,
    .pending-approval-card,
    .report-panel,
    .report-card,
    .report-table,
    .report-kpi,
    .daily-list-header,
    .daily-filters,
    .daily-empty-state,
    .daily-summary-card,
    .daily-metric,
    .user-card,
    .missing-card,
    .dev-app-card,
    .ticket-list-container,
    .ticket-table-wrapper,
    .ticket-report-shell,
    .sr-list-container,
    .sr-table-wrapper,
    .mt-list-container,
    .mt-table-wrapper,
    .edu-container,
    .edu-container .tab-content,
    .edu-container .tab-toolbar,
    .edu-container .tracker-filters,
    .edu-container .summary-card,
    .edu-container .mud-table,
    .modern-users-container,
    .modern-users-container .users-command,
    .modern-users-container .users-kpi,
    .modern-users-container .tabs-container,
    .modern-users-container .modern-table-container,
    .modern-users-container .modern-table-wrapper,
    .modern-users-container .filters-section,
    .modern-users-container .action-buttons,
    .modern-users-container .pagination-container,
    .compliance-container,
    .compliance-command-center,
    .risk-tile,
    .compliance-tabs,
    .compliance-tabs .mud-tabs-toolbar,
    .compliance-tabs .mud-tabs-panels,
    .vehicles-tab-container,
    .vehicle-command,
    .vehicle-kpi,
    .vehicle-toolbar,
    .vehicle-board,
    .vehicle-board-header,
    .vehicle-row,
    .ag-motors-tab-container,
    .ag-motors-command,
    .ag-motors-kpi,
    .ag-motors-subtabs,
    .ag-motors-subtabs .mud-tabs-toolbar,
    .ag-motors-subtabs .mud-tabs-panels,
    .ag-grid,
    .calendar-section,
    .timeline-grid,
    .timeline-header,
    .empty-state,
    .empty-results-card,
    .loading-container,
    .access-denied-container,
    .no-tabs-container
) {
    background: var(--dm-surface) !important;
    background-color: var(--dm-surface) !important;
    background-image: none !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
    box-shadow: var(--dm-shadow) !important;
}

html.dark-mode body :is(
    .daily-reports-container,
    .daily-reports-container .page-header,
    .daily-reports-container .filters-card,
    .daily-reports-container .missing-daily-panel,
    .daily-reports-container .results-card,
    .daily-reports-container .status-card,
    .daily-reports-container .report-board,
    .daily-reports-container .report-board-row,
    .daily-reports-container .status-board,
    .daily-reports-container .status-board-row,
    .reports-shell,
    .reports-hero,
    .reports-shell .filter-card,
    .reports-shell .metric-card,
    .reports-shell .content-section,
    .reports-shell .attention-item,
    .reports-shell .hero-badge,
    .reports-shell .filter-pill,
    .requests-container .tracking-toolbar,
    .requests-container .tracking-board-shell,
    .requests-container .tracking-board-header,
    .requests-container .tracking-board-row,
    .requests-container .tracking-card,
    .requests-container .timeline-view,
    .requests-container .timeline-controls,
    .requests-container .gantt-container,
    .requests-container .gantt-header,
    .requests-container .gantt-body,
    .requests-container .gantt-row,
    .requests-container .gantt-label-col,
    .requests-container .gantt-timeline-col,
    .requests-container .kanban-view,
    .requests-container .kanban-column,
    .requests-container .column-body,
    .requests-container .kanban-card,
    .modern-approvals-container .user-chip,
    .modern-approvals-container .type-badge,
    .modern-approvals-container .priority-badge,
    .modern-approvals-container .status-badge,
    .approval-request-list,
    .approval-request-list .approval-card,
    .approval-request-list .request-card,
    .approval-request-list .request-header,
    .approval-request-list .request-content,
    .approval-request-list .user-chip,
    .approval-request-list .type-badge,
    .approval-request-list .priority-badge,
    .approval-request-list .status-badge
) {
    background: var(--dm-surface) !important;
    background-color: var(--dm-surface) !important;
    background-image: none !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
    box-shadow: var(--dm-shadow) !important;
}

html.dark-mode body :is(
    .daily-reports-container .report-board-header,
    .daily-reports-container .status-board-header,
    .reports-shell .mud-table-head,
    .requests-container .tracking-board-header,
    .requests-container .gantt-header,
    .requests-container .column-header
) {
    background: var(--dm-input) !important;
    background-color: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text-muted) !important;
}

html.dark-mode body :is(
    .requests-container .tracking-board-row:hover,
    .requests-container .tracking-board-row:focus-visible,
    .requests-container .tracking-card:hover,
    .daily-reports-container .report-board-row:hover,
    .daily-reports-container .status-board-row:hover,
    .reports-shell .attention-item:hover
) {
    background: var(--dm-surface-2) !important;
    background-color: var(--dm-surface-2) !important;
    box-shadow: inset 0 0 0 1px rgba(141, 162, 255, 0.12) !important;
}

html.dark-mode body :is(.page-header, .requests-hero, .users-command, .compliance-command-center, .vehicle-command, .reports-hero, .ops-header) {
    background:
        linear-gradient(90deg, #8da2ff 0 18%, #5fd6a6 18% 35%, #e7c56f 35% 52%, #7cc7f4 52% 70%, #c5b5ff 70% 86%, #f18b99 86% 100%) top / 100% 5px no-repeat,
        linear-gradient(135deg, #1b2538 0%, #152033 58%, #111a2b 100%) !important;
}

html.dark-mode body :is(
    .mud-table-head,
    .mud-table-head .mud-table-cell,
    .mud-data-grid-header,
    .mud-data-grid-header-cell,
    .mud-table-toolbar,
    .data-table th,
    .modern-table th,
    thead,
    th
) {
    background: var(--dm-input) !important;
    background-color: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text-muted) !important;
}

html.dark-mode body :is(.mud-table-row, .mud-table-cell, tbody, tr, td) {
    background-color: transparent !important;
    border-color: var(--dm-border-soft) !important;
    color: var(--dm-text) !important;
}

html.dark-mode body :is(.mud-table-row:hover, .data-table tbody tr:hover, .modern-table tr:hover, tr:hover) :is(.mud-table-cell, td),
html.dark-mode body :is(.mud-table-row:hover, .data-table tbody tr:hover, .modern-table tr:hover, tr:hover) {
    background-color: var(--dm-surface-2) !important;
}

html.dark-mode body :is(
    .page-title,
    .dashboard-title,
    .command-title,
    .requests-page-title,
    .requests-section-title,
    .requests-hero-stat-value,
    .report-title,
    .header-title,
    .panel-title,
    .user-name,
    .missing-name,
    .ticket-title,
    .project-title,
    .task-title,
    .vehicle-command-title,
    .vehicle-kpi strong,
    .vehicle-name,
    .ag-motors-command-title,
    .ag-motors-kpi strong,
    .modern-users-container .users-kpi strong,
    .edu-container .summary-card-value,
    .requests-container .stat-num,
    .requests-container .request-main h3,
    .requests-container .latest-cell strong,
    .requests-container .mini-progress strong,
    .reports-shell .metric-value,
    .reports-shell .hero-badge-value,
    .daily-reports-container .kpi-value,
    .daily-reports-container .results-title,
    .daily-reports-container .entry-count
) {
    color: var(--dm-text-strong) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .page-subtitle,
    .dashboard-description,
    .command-subtitle,
    .requests-page-subtitle,
    .requests-section-subtitle,
    .requests-hero-stat-label,
    .report-label,
    .header-sub,
    .panel-subtitle,
    .user-meta,
    .missing-meta,
    .ticket-meta,
    .project-meta,
    .task-meta,
    .vehicle-command-subtitle,
    .vehicle-kpi small,
    .vehicle-meta,
    .ag-motors-command-subtitle,
    .ag-motors-kpi span,
    .modern-users-container .users-kpi small,
    .modern-users-container .no-data,
    .mud-typography-body2,
    .mud-typography-caption,
    .requests-container .stat-label,
    .requests-container .request-main p,
    .requests-container .request-inline-meta span,
    .requests-container .mini-progress span:first-child,
    .requests-container .latest-cell span,
    .reports-shell .metric-label,
    .reports-shell .metric-note,
    .reports-shell .hero-badge-label,
    .daily-reports-container .kpi-label,
    .daily-reports-container .missing-subtitle,
    .daily-reports-container .project-list-text
) {
    color: var(--dm-text-muted) !important;
}

html.dark-mode body :is(
    .mud-button-filled,
    .mud-button-filled-primary,
    .requests-primary-btn,
    .create-btn,
    .export-button,
    .btn-primary
) {
    background: #6f82e8 !important;
    border-color: #7f92f0 !important;
    color: #f8fbff !important;
    box-shadow: 0 8px 18px rgba(93, 111, 210, 0.24) !important;
}

html.dark-mode body :is(.mud-button-filled:hover, .mud-button-filled-primary:hover, .requests-primary-btn:hover, .create-btn:hover, .export-button:hover, .btn-primary:hover) {
    background: #7e91f0 !important;
    color: #ffffff !important;
}

html.dark-mode body :is(
    .mud-button-outlined,
    .mud-button-text,
    .btn-outline,
    .nav-btn,
    .btn-today,
    .clear-btn,
    .view-btn,
    .view-tab,
    .vehicle-action-btn,
    .stl-action-btn
) {
    background: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-primary-strong) !important;
    box-shadow: none !important;
}

html.dark-mode body :is(.mud-button-outlined:hover, .mud-button-text:hover, .btn-outline:hover, .nav-btn:hover, .btn-today:hover, .clear-btn:hover, .view-btn:hover, .view-tab:hover, .vehicle-action-btn:hover, .stl-action-btn:hover) {
    background: var(--dm-surface-3) !important;
    color: #d8e0ff !important;
}

html.dark-mode body :is(.mud-icon-button, .menu-button, .drawer-close-button, .action-btn, .pagination-btn) {
    background: rgba(29, 40, 59, 0.82) !important;
    border: 1px solid var(--dm-border) !important;
    color: #b8c4d8 !important;
    box-shadow: none !important;
}

html.dark-mode body :is(.mud-icon-button:hover, .menu-button:hover, .drawer-close-button:hover, .action-btn:hover, .pagination-btn:hover) {
    background: var(--dm-surface-3) !important;
    color: var(--dm-primary-strong) !important;
}

html.dark-mode body :is(.mud-icon-root, .mud-svg-icon, .app-logo, .drawer-logo) {
    color: currentColor;
}

html.dark-mode body :is(
    .mud-chip,
    .status-badge,
    .status-chip,
    .priority-chip,
    .source-chip,
    .table-pill,
    .badge,
    .role-badge,
    .stat-pill,
    .metric-pill,
    .count-pill,
    .command-chip,
    .command-pills span,
    .vehicle-kpi-icon,
    .vehicle-avatar,
    .vehicle-person-pill,
    .vehicle-muted-pill,
    .users-command-icon,
    .users-kpi-icon,
    .requests-hero-icon,
    .summary-card-icon,
    .reports-shell .hero-badge,
    .reports-shell .filter-pill,
    .daily-reports-container .header-chip,
    .daily-reports-container .results-count,
    .daily-reports-container .missing-user-chip,
    .daily-reports-container .missing-more,
    .daily-reports-container .avatar,
    .requests-container .avatar,
    .requests-container .row-action-btn
) {
    background: var(--dm-primary-surface) !important;
    border-color: rgba(141, 162, 255, 0.26) !important;
    color: var(--dm-primary-strong) !important;
    box-shadow: none !important;
}

html.dark-mode body :is(.status-badge-active, .badge-status-approved, .status-completed, .count-pill-success, .summary-icon-success) {
    background: rgba(95, 214, 166, 0.16) !important;
    border-color: rgba(95, 214, 166, 0.28) !important;
    color: #9be8c7 !important;
}

html.dark-mode body :is(.status-badge-inactive, .badge-status-rejected, .status-overdue, .priority-high, .danger, .summary-icon-danger) {
    background: rgba(241, 139, 153, 0.16) !important;
    border-color: rgba(241, 139, 153, 0.28) !important;
    color: #ffc1c8 !important;
}

html.dark-mode body :is(.priority-medium, .status-inprogress, .badge-status-underreview, .count-pill-warning, .summary-icon-warning, .daily-metric.late, .report-kpi.late) {
    background: rgba(231, 197, 111, 0.16) !important;
    border-color: rgba(231, 197, 111, 0.28) !important;
    color: #f2d995 !important;
}

html.dark-mode body :is(
    .reports-shell .filter-pill-muted,
    .reports-shell .hero-badge,
    .daily-reports-container .missing-count,
    .daily-reports-container .status-pill,
    .daily-reports-container .late-badge,
    .daily-reports-container .on-time-pill,
    .requests-container .badge,
    .requests-container .badge-project,
    .requests-container .badge-converted-task,
    .requests-container .badge-converted-project,
    .requests-container .blocker-chip,
    .approval-request-list .user-chip,
    .modern-approvals-container .user-chip
) {
    background: var(--dm-surface-3) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}

html.dark-mode body :is(
    .mud-input,
    .mud-input-root,
    .mud-input-slot,
    .mud-input-control,
    .mud-select,
    .mud-picker,
    input,
    textarea,
    select
) {
    color: var(--dm-text) !important;
}

html.dark-mode body :is(.mud-input-filled, .mud-input-outlined, .mud-picker-input, .mud-select-input, .mud-input-control-input-container) {
    background: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
}

html.dark-mode body :is(.mud-input-outlined fieldset, .mud-input-outlined:hover fieldset) {
    border-color: var(--dm-border) !important;
}

html.dark-mode body :is(.mud-input-label, .mud-input-helper-text, .mud-input-adornment, ::placeholder) {
    color: var(--dm-text-soft) !important;
}

html.dark-mode body :is(.mud-tooltip-root, .mud-tooltip) {
    background: #0b1020 !important;
    color: var(--dm-text) !important;
}

/* Home feature-request review table: local component styles are light by default. */
html.dark-mode body .pending-requests-card,
body.dark-mode .pending-requests-card {
    background: rgba(23, 32, 51, 0.94) !important;
    background-image: none !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
    box-shadow: var(--dm-shadow) !important;
}

html.dark-mode body .pending-requests-card .title-icon-shell,
body.dark-mode .pending-requests-card .title-icon-shell {
    background: var(--dm-primary-surface) !important;
    border: 1px solid rgba(141, 162, 255, 0.28) !important;
}

html.dark-mode body .pending-requests-card .title-icon,
body.dark-mode .pending-requests-card .title-icon {
    color: var(--dm-primary-strong) !important;
}

html.dark-mode body .pending-requests-card :is(.table-title, .request-title, .project-name, .date-text),
body.dark-mode .pending-requests-card :is(.table-title, .request-title, .project-name, .date-text) {
    color: var(--dm-text-strong) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body .pending-requests-card :is(.table-subtitle, .request-description, .dashboard-name, .dashboard-request, .year-text),
body.dark-mode .pending-requests-card :is(.table-subtitle, .request-description, .dashboard-name, .dashboard-request, .year-text) {
    color: var(--dm-text-muted) !important;
}

html.dark-mode body .pending-requests-card :is(.modern-table-wrapper, .modern-table, .mud-table),
body.dark-mode .pending-requests-card :is(.modern-table-wrapper, .modern-table, .mud-table) {
    background: var(--dm-surface) !important;
    background-color: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
}

html.dark-mode body .pending-requests-card .table-header-cell,
body.dark-mode .pending-requests-card .table-header-cell {
    background: var(--dm-input) !important;
    background-color: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text-muted) !important;
}

html.dark-mode body .pending-requests-card .table-cell,
body.dark-mode .pending-requests-card .table-cell {
    border-color: var(--dm-border-soft) !important;
    color: var(--dm-text) !important;
}

html.dark-mode body .pending-requests-card .user-chip,
body.dark-mode .pending-requests-card .user-chip {
    background: var(--dm-surface-3) !important;
    border: 1px solid var(--dm-border) !important;
    color: var(--dm-text) !important;
}

html.dark-mode body .pending-requests-card .overview-pill,
body.dark-mode .pending-requests-card .overview-pill {
    background: rgba(124, 199, 244, 0.14) !important;
    border: 1px solid rgba(124, 199, 244, 0.28) !important;
    color: #b8e4fb !important;
}

html.dark-mode body .pending-requests-card .pending-chip,
body.dark-mode .pending-requests-card .pending-chip {
    background: rgba(232, 178, 122, 0.18) !important;
    border: 1px solid rgba(232, 178, 122, 0.34) !important;
    color: #f7d2aa !important;
}

html.dark-mode body .pending-requests-card .action-btn-blue,
body.dark-mode .pending-requests-card .action-btn-blue {
    color: #9bdcff !important;
}

html.dark-mode body .pending-requests-card .action-btn-orange,
body.dark-mode .pending-requests-card .action-btn-orange {
    color: #f7c890 !important;
}

html.dark-mode body .pending-requests-card .action-btn-purple,
body.dark-mode .pending-requests-card .action-btn-purple {
    color: #cfc5ff !important;
}

html.dark-mode body .pending-requests-card .action-btn-green,
body.dark-mode .pending-requests-card .action-btn-green {
    color: #9be8c7 !important;
}

html.dark-mode body .pending-requests-card .action-btn-red,
body.dark-mode .pending-requests-card .action-btn-red {
    color: #ffc1c8 !important;
}

html.dark-mode body .pending-requests-card :is(.action-btn-blue, .action-btn-orange, .action-btn-purple, .action-btn-green, .action-btn-red):hover,
body.dark-mode .pending-requests-card :is(.action-btn-blue, .action-btn-orange, .action-btn-purple, .action-btn-green, .action-btn-red):hover {
    background: var(--dm-surface-3) !important;
}

html.dark-mode body .pending-requests-card .request-status.status-submitted,
body.dark-mode .pending-requests-card .request-status.status-submitted {
    background: rgba(124, 199, 244, 0.15) !important;
    border-color: rgba(124, 199, 244, 0.32) !important;
    color: #b8e4fb !important;
}

html.dark-mode body .pending-requests-card .request-status.status-review,
body.dark-mode .pending-requests-card .request-status.status-review {
    background: rgba(231, 197, 111, 0.16) !important;
    border-color: rgba(231, 197, 111, 0.32) !important;
    color: #f2d995 !important;
}

html.dark-mode body .pending-requests-card .request-status.status-approved,
html.dark-mode body .pending-requests-card .request-status.status-completed,
body.dark-mode .pending-requests-card .request-status.status-approved,
body.dark-mode .pending-requests-card .request-status.status-completed {
    background: rgba(95, 214, 166, 0.16) !important;
    border-color: rgba(95, 214, 166, 0.32) !important;
    color: #9be8c7 !important;
}

html.dark-mode body .pending-requests-card .request-status.status-progress,
body.dark-mode .pending-requests-card .request-status.status-progress {
    background: rgba(197, 181, 255, 0.16) !important;
    border-color: rgba(197, 181, 255, 0.32) !important;
    color: #ddd5ff !important;
}

html.dark-mode body .pending-requests-card .request-status.status-rejected,
body.dark-mode .pending-requests-card .request-status.status-rejected {
    background: rgba(241, 139, 153, 0.16) !important;
    border-color: rgba(241, 139, 153, 0.32) !important;
    color: #ffc1c8 !important;
}

html.dark-mode body .pending-requests-card .empty-state-success,
body.dark-mode .pending-requests-card .empty-state-success {
    background: rgba(95, 214, 166, 0.12) !important;
    background-image: none !important;
    border-color: rgba(95, 214, 166, 0.3) !important;
    color: #9be8c7 !important;
}

html.dark-mode body .pending-requests-card .success-text,
body.dark-mode .pending-requests-card .success-text {
    color: #c5f4dc !important;
}

html.dark-mode body .load-error-panel,
body.dark-mode .load-error-panel {
    background: rgba(241, 139, 153, 0.14) !important;
    border-color: rgba(241, 139, 153, 0.34) !important;
    color: #ffc1c8 !important;
}

html.dark-mode body .load-error-panel :is(strong, span, .mud-icon-root),
body.dark-mode .load-error-panel :is(strong, span, .mud-icon-root) {
    color: #ffd4d9 !important;
}

/* Dark-mode sweep for the newer ops dashboard, projects hub, compliance grids,
   timeline, and no-header modern dialogs that ship isolated component styles. */
html.dark-mode body .ops-home,
html.dark-mode body .modern-projects-container,
html.dark-mode body .compliance-container {
    background: var(--dm-bg) !important;
    background-color: var(--dm-bg) !important;
    background-image: none !important;
    color: var(--dm-text) !important;
}

html.dark-mode body .modern-projects-container {
    --proj-bg: var(--dm-bg);
    --proj-surface: var(--dm-surface);
    --proj-ink: var(--dm-text-strong);
    --proj-muted: var(--dm-text-muted);
    --proj-line: var(--dm-border);
    --proj-primary: var(--dm-primary);
    --proj-primary-dark: var(--dm-primary-strong);
    --proj-primary-soft: rgba(141, 162, 255, 0.16);
    --proj-blue-soft: rgba(124, 199, 244, 0.14);
    --proj-green-soft: rgba(95, 214, 166, 0.14);
    --proj-yellow-soft: rgba(231, 197, 111, 0.16);
    --proj-red-soft: rgba(241, 139, 153, 0.16);
    --proj-purple-soft: rgba(197, 181, 255, 0.16);
    --proj-orange-soft: rgba(232, 178, 122, 0.16);
    --proj-shadow: var(--dm-shadow);
    --proj-shadow-soft: 0 10px 24px rgba(0, 0, 0, 0.24);
}

html.dark-mode body .compliance-container {
    --comp-bg: var(--dm-bg);
    --comp-surface: var(--dm-surface);
    --comp-surface-soft: var(--dm-input);
    --comp-ink: var(--dm-text-strong);
    --comp-muted: var(--dm-text-muted);
    --comp-line: var(--dm-border);
    --comp-line-soft: var(--dm-border-soft);
    --comp-primary: var(--dm-primary);
    --comp-primary-dark: var(--dm-primary-strong);
    --comp-primary-soft: rgba(141, 162, 255, 0.16);
    --comp-blue-soft: rgba(124, 199, 244, 0.14);
    --comp-green-soft: rgba(95, 214, 166, 0.14);
    --comp-yellow-soft: rgba(231, 197, 111, 0.16);
    --comp-red-soft: rgba(241, 139, 153, 0.16);
    --comp-purple-soft: rgba(197, 181, 255, 0.16);
    --comp-orange-soft: rgba(232, 178, 122, 0.16);
    --comp-shadow: var(--dm-shadow);
    --comp-shadow-soft: 0 10px 24px rgba(0, 0, 0, 0.24);
}

html.dark-mode body :is(
    .ops-header,
    .today-card,
    .attention-panel,
    .mini-panel,
    .dashboard-health-section,
    .metric-card,
    .signal-row,
    .role-action,
    .activity-item,
    .dashboard-health-card,
    .health-stats span,
    .quiet-state,
    .empty-attention,
    .empty-dashboards,
    .modern-projects-container .page-header,
    .modern-projects-container .dashboard-card,
    .modern-projects-container .calendar-section,
    .modern-projects-container .tickets-view-shell,
    .modern-projects-container .content-section,
    .modern-projects-container .projects-command-metric,
    .modern-projects-container .header-stat-card,
    .modern-projects-container .empty-state,
    .modern-projects-container .mud-toggle-group,
    .modern-projects-container .mud-togglegroup,
    .modern-timeline-calendar .loading-container,
    .modern-timeline-calendar .error-state,
    .modern-timeline-calendar .calendar-container,
    .modern-timeline-calendar .calendar-header,
    .modern-timeline-calendar .calendar-stat-card,
    .compliance-container .loading-container,
    .compliance-container .access-denied-container,
    .compliance-container .no-tabs-container,
    .compliance-command-center,
    .command-pills span,
    .risk-tile,
    .agent-license-command,
    .agent-license-insights,
    .agent-detail-summary,
    .agent-kpi,
    .agent-license-board,
    .license-board,
    .agent-board-row,
    .license-board-row,
    .dmv-command,
    .dmv-kpi,
    .dmv-toolbar,
    .dmv-board,
    .dmv-row,
    .vehicle-command,
    .vehicle-kpi,
    .vehicle-toolbar,
    .vehicle-board,
    .vehicle-row,
    .doi-command,
    .doi-kpi,
    .doi-toolbar,
    .doi-board,
    .doi-row
) {
    background: var(--dm-surface) !important;
    background-color: var(--dm-surface) !important;
    background-image: none !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
    box-shadow: var(--dm-shadow) !important;
}

html.dark-mode body :is(
    .modern-timeline-calendar .calendar-header,
    .agent-board-header,
    .license-board-header,
    .dmv-board-header,
    .vehicle-board-header,
    .doi-board-header
) {
    background: var(--dm-input) !important;
    background-color: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text-muted) !important;
}

html.dark-mode body :is(
    .signal-row:hover,
    .role-action:hover,
    .activity-item:hover,
    .dashboard-health-card:hover,
    .modern-projects-container .dashboard-card:hover,
    .agent-board-row:hover,
    .agent-board-row:focus-visible,
    .license-board-row:hover,
    .license-board-row:focus-visible,
    .dmv-row:hover,
    .vehicle-row:hover,
    .vehicle-row:focus-visible,
    .doi-row:hover,
    .doi-row:focus-visible
) {
    background: var(--dm-surface-2) !important;
    background-color: var(--dm-surface-2) !important;
}

html.dark-mode body :is(
    .ops-title,
    .today-card strong,
    .metric-copy strong,
    .signal-body strong,
    .role-action strong,
    .activity-item strong,
    .dashboard-name,
    .health-progress strong,
    .health-stats strong,
    .modern-projects-container .page-title,
    .modern-projects-container .dashboard-title,
    .modern-projects-container .metric-value,
    .modern-projects-container .header-stat-value,
    .modern-timeline-calendar .calendar-title,
    .modern-timeline-calendar .calendar-stat-value,
    .command-title,
    .risk-count,
    .risk-note,
    .agent-license-heading,
    .agent-kpi-value,
    .agent-name,
    .license-type-name,
    .agent-license-number,
    .license-date-stack strong,
    .dmv-command-title,
    .dmv-kpi strong,
    .vehicle-command-title,
    .vehicle-kpi strong,
    .vehicle-identity strong,
    .vehicle-title-cell strong,
    .vehicle-date-stack strong,
    .doi-command-title,
    .doi-kpi strong,
    .doi-case-copy strong,
    .doi-date-stack strong
) {
    color: var(--dm-text-strong) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .ops-subtitle,
    .today-card span,
    .metric-label,
    .metric-copy small,
    .panel-subtitle,
    .signal-topline,
    .signal-body p,
    .role-action small,
    .activity-item small,
    .dashboard-label,
    .dashboard-description,
    .health-progress > div:first-child,
    .health-stats span,
    .modern-projects-container .page-subtitle,
    .modern-projects-container .dashboard-description,
    .modern-projects-container .dashboard-stat,
    .modern-projects-container .metric-label,
    .modern-timeline-calendar .calendar-subtitle,
    .modern-timeline-calendar .calendar-stat-label,
    .command-subtitle,
    .risk-label,
    .agent-license-subtitle,
    .agent-kpi-label,
    .agent-subline,
    .license-type-note,
    .license-date-stack span,
    .dmv-command-subtitle,
    .dmv-kpi small,
    .vehicle-command-subtitle,
    .vehicle-kpi small,
    .vehicle-identity span,
    .vehicle-identity small,
    .vehicle-title-cell small,
    .vehicle-date-stack small,
    .doi-command-subtitle,
    .doi-kpi small,
    .doi-case-copy span,
    .doi-case-copy small,
    .doi-date-stack span,
    .doi-date-stack small
) {
    color: var(--dm-text-muted) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .role-kicker,
    .panel-count,
    .metric-icon,
    .signal-icon,
    .calendar-icon-shell,
    .command-chip,
    .command-pills span,
    .risk-icon,
    .vehicle-command-icon,
    .vehicle-kpi-icon,
    .vehicle-avatar,
    .doi-command-icon,
    .doi-kpi-icon,
    .doi-avatar,
    .agent-command-icon,
    .agent-avatar,
    .license-type-icon,
    .dmv-command-icon,
    .dmv-kpi span,
    .agent-count-pill,
    .agent-state-pill,
    .agent-pdf-pill,
    .agent-health-pill
) {
    background: var(--dm-primary-surface) !important;
    border-color: rgba(141, 162, 255, 0.28) !important;
    color: var(--dm-primary-strong) !important;
    box-shadow: none !important;
}

html.dark-mode body .modern-timeline-calendar :is(.timeline-grid, .gantt-timeline, .gantt-body, .week-calendar) {
    background: var(--dm-surface) !important;
    background-color: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
    box-shadow: var(--dm-shadow) !important;
}

html.dark-mode body .modern-timeline-calendar :is(.timeline-header, .gantt-header-row, .gantt-project-col, .gantt-date-cell, .week-header, .week-day-header, .timeline-legend) {
    background: var(--dm-input) !important;
    background-color: var(--dm-input) !important;
    background-image: none !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text-muted) !important;
}

html.dark-mode body .modern-timeline-calendar :is(.gantt-row, .gantt-cell, .week-day-cell) {
    background: var(--dm-surface) !important;
    background-color: var(--dm-surface) !important;
    border-color: rgba(148, 163, 184, 0.18) !important;
    color: var(--dm-text) !important;
}

html.dark-mode body .modern-timeline-calendar .gantt-row:nth-child(even),
html.dark-mode body .modern-timeline-calendar .gantt-row:nth-child(even) .gantt-project-col {
    background: var(--dm-surface-2) !important;
    background-color: var(--dm-surface-2) !important;
}

html.dark-mode body .modern-timeline-calendar :is(.gantt-date-cell.weekend, .gantt-cell.weekend) {
    background: rgba(255, 255, 255, 0.045) !important;
    background-color: rgba(255, 255, 255, 0.045) !important;
}

html.dark-mode body .modern-timeline-calendar :is(.gantt-date-cell.today, .gantt-cell.today, .week-day-header.today, .week-day-cell.today) {
    background: rgba(124, 199, 244, 0.14) !important;
    background-color: rgba(124, 199, 244, 0.14) !important;
}

html.dark-mode body .modern-timeline-calendar :is(.period-title, .project-name, .date-num, .day-date, .legend-item, .summary-card, .subtask-name) {
    color: var(--dm-text-strong) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body .modern-timeline-calendar :is(.period-kicker, .date-day, .project-meta, .task-count, .legend-title, .bar-dates, .subtask-assignee) {
    color: var(--dm-text-muted) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body .modern-timeline-calendar :is(.view-switcher, .nav-btn, .today-btn, .summary-card, .task-count) {
    background: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-primary-strong) !important;
    box-shadow: none !important;
}

html.dark-mode body .modern-timeline-calendar .timeline-filter-shell {
    background: linear-gradient(180deg, rgba(29, 40, 59, 0.96), rgba(17, 26, 43, 0.94)) !important;
    border-color: var(--dm-border) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), var(--dm-shadow) !important;
}

html.dark-mode body .modern-timeline-calendar :is(.timeline-filter-kicker, .timeline-filter-caption) {
    color: var(--dm-text-muted) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body .modern-timeline-calendar .timeline-filter-kicker {
    color: var(--dm-text-soft) !important;
}

html.dark-mode body .modern-timeline-calendar .timeline-filter-input :is(.mud-input-root, .mud-input-outlined, .mud-select-input, .mud-input-slot, .mud-input-control-input-container) {
    background: var(--dm-input) !important;
    background-color: var(--dm-input) !important;
    color: var(--dm-text) !important;
}

html.dark-mode body .modern-timeline-calendar .timeline-filter-input :is(.mud-input-outlined fieldset, .mud-input-outlined:hover fieldset) {
    border-color: var(--dm-border) !important;
}

html.dark-mode body .modern-timeline-calendar .timeline-filter-input :is(.mud-input-label, .mud-input-adornment, .mud-input-adornment .mud-icon-root, .mud-select .mud-icon-root) {
    color: var(--dm-text-soft) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body .modern-timeline-calendar .timeline-clear-btn {
    background: var(--dm-primary-surface) !important;
    border-color: rgba(141, 162, 255, 0.28) !important;
    color: var(--dm-primary-strong) !important;
    box-shadow: none !important;
}

html.dark-mode body .modern-timeline-calendar .timeline-clear-btn :is(.mud-button-label, .mud-icon-root, span) {
    color: var(--dm-primary-strong) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body .modern-timeline-calendar .subtask-bar.status-notstarted {
    background: rgba(148, 163, 184, 0.18) !important;
    border-color: rgba(203, 213, 225, 0.24) !important;
    color: #e2e8f0 !important;
}

html.dark-mode body .modern-timeline-calendar .subtask-bar.status-inprogress {
    background: rgba(124, 199, 244, 0.18) !important;
    border-color: rgba(124, 199, 244, 0.34) !important;
    color: #bfecff !important;
}

html.dark-mode body .modern-timeline-calendar .subtask-bar.status-completed {
    background: rgba(95, 214, 166, 0.18) !important;
    border-color: rgba(95, 214, 166, 0.34) !important;
    color: #bdf5dd !important;
}

html.dark-mode body .modern-timeline-calendar .subtask-bar.status-onhold {
    background: rgba(241, 139, 153, 0.18) !important;
    border-color: rgba(241, 139, 153, 0.34) !important;
    color: #ffd0d6 !important;
}

html.dark-mode body :is(
    .tone-red .metric-icon,
    .risk-tile-danger .risk-icon,
    .agent-kpi.danger,
    .dmv-row.inactive,
    .agent-count-pill.danger,
    .agent-health-pill.danger
) {
    background: rgba(241, 139, 153, 0.16) !important;
    border-color: rgba(241, 139, 153, 0.3) !important;
    color: #ffc1c8 !important;
}

html.dark-mode body :is(
    .tone-amber .metric-icon,
    .risk-tile-warning .risk-icon,
    .agent-kpi.warning,
    .dmv-row.pending-training,
    .agent-count-pill.warning,
    .agent-pdf-pill.missing,
    .agent-health-pill.warning
) {
    background: rgba(231, 197, 111, 0.16) !important;
    border-color: rgba(231, 197, 111, 0.3) !important;
    color: #f2d995 !important;
}

html.dark-mode body :is(
    .tone-blue .metric-icon,
    .dmv-row.draft,
    .agent-kpi.pdf,
    .agent-state-pill
) {
    background: rgba(124, 199, 244, 0.14) !important;
    border-color: rgba(124, 199, 244, 0.28) !important;
    color: #afe0fb !important;
}

html.dark-mode body :is(
    .agent-kpi.valid,
    .dmv-row.active-user,
    .agent-count-pill.valid,
    .agent-pdf-pill.attached,
    .agent-health-pill.valid
) {
    background: rgba(95, 214, 166, 0.14) !important;
    border-color: rgba(95, 214, 166, 0.28) !important;
    color: #9be8c7 !important;
}

html.dark-mode body :is(
    .modern-projects-container input,
    .modern-projects-container textarea,
    .modern-projects-container select,
    .compliance-container input,
    .compliance-container textarea,
    .compliance-container select,
    .compliance-container .mud-input,
    .compliance-container .mud-input-root,
    .compliance-container .mud-input-control-input-container,
    .compliance-container .mud-input-outlined,
    .compliance-container .mud-select-input,
    .compliance-container .mud-picker-input,
    .mud-dialog.modern-dialog input,
    .mud-dialog.modern-dialog textarea,
    .mud-dialog.modern-dialog select,
    .mud-dialog.modern-dialog .mud-input,
    .mud-dialog.modern-dialog .mud-input-root,
    .mud-dialog.modern-dialog .mud-input-control-input-container,
    .mud-dialog.modern-dialog .mud-input-outlined,
    .mud-dialog.modern-dialog .mud-select-input,
    .mud-dialog.modern-dialog .mud-picker-input
) {
    background: var(--dm-input) !important;
    background-color: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .mud-dialog,
    .mud-dialog.modern-dialog,
    .mud-dialog .modern-dialog,
    .mud-dialog .dialog-wrapper,
    .mud-dialog .dialog-body,
    .mud-dialog .dialog-content,
    .mud-dialog .form-section,
    .mud-dialog .dialog-section,
    .mud-dialog .dialog-overview,
    .mud-dialog .detail-card,
    .mud-dialog .images-grid,
    .mud-dialog .images-preview-grid
) {
    background: var(--dm-surface) !important;
    background-color: var(--dm-surface) !important;
    background-image: none !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}

html.dark-mode body :is(.mud-dialog .mud-dialog-actions, .mud-dialog .dialog-footer) {
    background: var(--dm-input) !important;
    background-color: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
}

html.dark-mode body :is(
    .mud-dialog .header-title,
    .mud-dialog .dialog-title,
    .mud-dialog .section-label,
    .mud-dialog .form-title,
    .mud-dialog .dialog-panel-title
) {
    color: var(--dm-text-strong) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .mud-dialog .header-subtitle,
    .mud-dialog .form-subtitle,
    .mud-dialog .dialog-subtitle,
    .mud-dialog .mud-input-helper-text,
    .mud-dialog .mud-input-label
) {
    color: var(--dm-text-muted) !important;
}

/* Compliance modal target: match the dark support-ticket dialog system. */
html.dark-mode body :is(.mud-dialog.modern-dialog, .mud-dialog.compliance-alert-detail-dialog) {
    --comp-bg: #172033;
    --comp-surface: #172033;
    --comp-surface-soft: #111a2b;
    --comp-ink: #e7edf7;
    --comp-muted: #aeb8c8;
    --comp-line: #334155;
    --comp-line-soft: #263449;
    --comp-primary: #8da2ff;
    --comp-primary-dark: #d8e0ff;
    --comp-primary-soft: rgba(124, 199, 244, 0.12);
    --comp-blue: #7cc7f4;
    --comp-blue-soft: rgba(124, 199, 244, 0.12);
    --comp-green: #5fd6a6;
    --comp-green-soft: rgba(95, 214, 166, 0.13);
    --comp-warning: #e7c56f;
    --comp-warning-soft: rgba(231, 197, 111, 0.14);
    --comp-danger: #f18b99;
    --comp-danger-soft: rgba(241, 139, 153, 0.14);
    --comp-orange: #e8b27a;
    --comp-orange-soft: rgba(232, 178, 122, 0.14);
    --comp-purple: #c5b5ff;
    --comp-purple-soft: rgba(197, 181, 255, 0.14);
    --comp-shadow: 0 28px 80px rgba(0, 0, 0, 0.45);

    width: min(960px, calc(100vw - 28px)) !important;
    max-height: calc(100vh - 28px) !important;
    border: 1px solid var(--comp-line) !important;
    border-radius: 8px !important;
    background: var(--comp-surface) !important;
    background-color: var(--comp-surface) !important;
    background-image: none !important;
    color: var(--comp-ink) !important;
    box-shadow: var(--comp-shadow) !important;
    overflow: hidden !important;
}

html.dark-mode body :is(.mud-dialog.vehicle-dialog, .mud-dialog.doi-dialog, .mud-dialog.vehicle-images-dialog) {
    width: min(1080px, calc(100vw - 28px)) !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog .mud-dialog-title,
    .mud-dialog.compliance-alert-detail-dialog .mud-dialog-title
) {
    padding: 20px 24px 12px !important;
    border-bottom: 0 !important;
    background: var(--comp-surface) !important;
    background-color: var(--comp-surface) !important;
    background-image: none !important;
    color: var(--comp-ink) !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog .mud-dialog-content,
    .mud-dialog.compliance-alert-detail-dialog .mud-dialog-content
) {
    max-height: calc(100vh - 174px) !important;
    padding: 6px 24px 12px !important;
    background: var(--comp-surface) !important;
    background-color: var(--comp-surface) !important;
    background-image: none !important;
    color: var(--comp-ink) !important;
    overflow: auto !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog .mud-dialog-actions,
    .mud-dialog.compliance-alert-detail-dialog .mud-dialog-actions
) {
    gap: 18px !important;
    padding: 10px 8px 8px !important;
    border-top: 1px solid var(--comp-line) !important;
    background: #111a2b !important;
    background-color: #111a2b !important;
    background-image: none !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog .dialog-header,
    .mud-dialog.compliance-alert-detail-dialog .dialog-header
) {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog .header-icon,
    .mud-dialog.compliance-alert-detail-dialog .header-icon
) {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    border-radius: 8px !important;
    background: rgba(124, 199, 244, 0.12) !important;
    color: #b8efff !important;
    box-shadow: none !important;
}

html.dark-mode body :is(.mud-dialog.modern-dialog .header-icon.warning) {
    background: var(--comp-warning-soft) !important;
    color: #f2d995 !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog .header-title,
    .mud-dialog.compliance-alert-detail-dialog .header-title,
    .mud-dialog.modern-dialog .form-title,
    .mud-dialog.modern-dialog .dialog-panel-title
) {
    color: var(--comp-ink) !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 1.08rem !important;
    line-height: 1.2 !important;
    font-weight: 850 !important;
    letter-spacing: 0 !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog .mud-typography-caption,
    .mud-dialog.compliance-alert-detail-dialog .mud-typography-caption,
    .mud-dialog.modern-dialog .section-hint,
    .mud-dialog.modern-dialog .form-subtitle,
    .mud-dialog.modern-dialog .dialog-subtitle
) {
    color: var(--comp-muted) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog .form-section,
    .mud-dialog.modern-dialog .dialog-body,
    .mud-dialog.modern-dialog .dialog-overview,
    .mud-dialog.modern-dialog .pdf-upload-section,
    .mud-dialog.modern-dialog .upload-section,
    .mud-dialog.modern-dialog .images-upload-area,
    .mud-dialog.modern-dialog .pdf-attached,
    .mud-dialog.modern-dialog .pdf-missing,
    .mud-dialog.modern-dialog .pdf-empty,
    .mud-dialog.modern-dialog .pdf-upload-container,
    .mud-dialog.compliance-alert-detail-dialog .alert-items-list
) {
    margin: 0 0 14px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    color: var(--comp-ink) !important;
    box-shadow: none !important;
}

html.dark-mode body :is(.mud-dialog.modern-dialog .form-section:not(:last-child)) {
    padding-bottom: 14px !important;
    border-bottom: 1px solid var(--comp-line) !important;
}

html.dark-mode body :is(.mud-dialog.modern-dialog .dialog-overview) {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin-bottom: 16px !important;
    padding: 0 !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog .section-label,
    .mud-dialog.modern-dialog .stc-section-title
) {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 0 0 8px !important;
    padding: 0 !important;
    border: 0 !important;
    color: var(--comp-ink) !important;
    font-size: 0.86rem !important;
    font-weight: 850 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog .form-grid,
    .mud-dialog.modern-dialog .form-grid-2,
    .mud-dialog.modern-dialog .form-grid-3,
    .mud-dialog.modern-dialog .form-grid-4
) {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    align-items: start !important;
}

html.dark-mode body :is(.mud-dialog.modern-dialog .form-grid-3, .mud-dialog.modern-dialog .form-grid-4) {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

html.dark-mode body .mud-dialog.modern-dialog .form-field.full-width {
    grid-column: 1 / -1 !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog .mud-input-root,
    .mud-dialog.modern-dialog .mud-input-filled,
    .mud-dialog.modern-dialog .mud-input-outlined,
    .mud-dialog.compliance-alert-detail-dialog .mud-input-root
) {
    min-height: 40px !important;
    border: 1px solid var(--comp-line) !important;
    border-radius: 8px !important;
    background: var(--comp-surface-soft) !important;
    background-color: var(--comp-surface-soft) !important;
    color: var(--comp-ink) !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: none !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog .mud-input-root::before,
    .mud-dialog.modern-dialog .mud-input-root::after,
    .mud-dialog.modern-dialog .mud-input-filled::before,
    .mud-dialog.modern-dialog .mud-input-filled::after,
    .mud-dialog.modern-dialog .mud-input-outlined fieldset
) {
    display: none !important;
    border: 0 !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog .mud-input-root:hover,
    .mud-dialog.modern-dialog .mud-input-root.mud-input-focused,
    .mud-dialog.modern-dialog .mud-input-filled.mud-input-focused,
    .mud-dialog.modern-dialog .mud-input-filled.mud-input-filled-focused
) {
    border-color: #45617f !important;
    box-shadow: 0 0 0 2px rgba(124, 199, 244, 0.08) !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog .mud-input-label,
    .mud-dialog.compliance-alert-detail-dialog .mud-input-label
) {
    color: var(--comp-muted) !important;
    font-size: 0.82rem !important;
    font-weight: 650 !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog input,
    .mud-dialog.modern-dialog textarea,
    .mud-dialog.modern-dialog .mud-input-slot,
    .mud-dialog.modern-dialog .mud-select-input,
    .mud-dialog.modern-dialog .mud-picker-input,
    .mud-dialog.modern-dialog .mud-input-adornment,
    .mud-dialog.modern-dialog .mud-input-adornment .mud-icon-root
) {
    color: var(--comp-ink) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog input::placeholder,
    .mud-dialog.modern-dialog textarea::placeholder
) {
    color: #8794a8 !important;
    -webkit-text-fill-color: #8794a8 !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog .overview-pill,
    .mud-dialog.modern-dialog .danger-note,
    .mud-dialog.modern-dialog .item-highlight,
    .mud-dialog.compliance-alert-detail-dialog .category-chip,
    .mud-dialog.compliance-alert-detail-dialog .alert-item-date,
    .mud-dialog.modern-dialog .total-summary
) {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    min-height: 30px !important;
    padding: 5px 10px !important;
    border: 1px solid var(--comp-line-soft) !important;
    border-radius: 999px !important;
    background: rgba(141, 162, 255, 0.08) !important;
    background-color: rgba(141, 162, 255, 0.08) !important;
    color: var(--comp-muted) !important;
    font-size: 0.78rem !important;
    font-weight: 750 !important;
    box-shadow: none !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog .danger-note,
    .mud-dialog.modern-dialog .delete-btn
) {
    border-color: rgba(241, 139, 153, 0.28) !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog .images-preview-grid,
    .mud-dialog.modern-dialog .images-grid
) {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important;
    gap: 12px !important;
    margin-top: 12px !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog .image-preview-card,
    .mud-dialog.modern-dialog .image-card,
    .mud-dialog.modern-dialog .images-empty-state,
    .mud-dialog.modern-dialog .empty-state
) {
    border: 1px solid var(--comp-line) !important;
    border-radius: 8px !important;
    background: var(--comp-surface-soft) !important;
    color: var(--comp-muted) !important;
    box-shadow: none !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog button.mud-button-root,
    .mud-dialog.compliance-alert-detail-dialog button.mud-button-root
) {
    min-width: 108px !important;
    min-height: 40px !important;
    padding: 0 16px !important;
    border-radius: 999px !important;
    border: 1px solid var(--comp-line) !important;
    background: #111a2b !important;
    color: #d8e0ff !important;
    box-shadow: none !important;
    opacity: 1 !important;
    font-size: 0.82rem !important;
    font-weight: 850 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog button.save-btn,
    .mud-dialog.modern-dialog button.done-btn,
    .mud-dialog.modern-dialog button.upload-pdf-btn,
    .mud-dialog.modern-dialog button.upload-btn,
    .mud-dialog.modern-dialog button.mud-button-filled-primary,
    .mud-dialog.compliance-alert-detail-dialog button.mud-button-filled-primary
) {
    border-color: #ded7ff !important;
    background: #ded7ff !important;
    color: #3520b7 !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog button.delete-btn,
    .mud-dialog.modern-dialog button.mud-button-filled-error
) {
    border-color: #f18b99 !important;
    background: #f18b99 !important;
    color: #351016 !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog button.cancel-btn,
    .mud-dialog.modern-dialog button.close-btn,
    .mud-dialog.modern-dialog button.mud-button-text,
    .mud-dialog.modern-dialog button.mud-button-outlined,
    .mud-dialog.compliance-alert-detail-dialog button.mud-button-text,
    .mud-dialog.compliance-alert-detail-dialog button.mud-button-outlined
) {
    border: 1px solid var(--comp-line) !important;
    background: #111a2b !important;
    color: #d8e0ff !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog button.mud-button-root *,
    .mud-dialog.compliance-alert-detail-dialog button.mud-button-root *
) {
    color: inherit !important;
    -webkit-text-fill-color: currentColor !important;
    opacity: 1 !important;
    visibility: visible !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog button.mud-icon-button-root,
    .mud-dialog.compliance-alert-detail-dialog button.mud-icon-button-root
) {
    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 !important;
    border: 1px solid var(--comp-line) !important;
    border-radius: 50% !important;
    background: #1d283b !important;
    color: var(--comp-muted) !important;
    box-shadow: none !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog button.mud-icon-button-root:hover,
    .mud-dialog.compliance-alert-detail-dialog button.mud-icon-button-root:hover
) {
    background: #243047 !important;
    color: var(--comp-ink) !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog button.mud-button-root:disabled,
    .mud-dialog.modern-dialog button.mud-button-root.mud-disabled,
    .mud-dialog.compliance-alert-detail-dialog button.mud-button-root:disabled,
    .mud-dialog.compliance-alert-detail-dialog button.mud-button-root.mud-disabled
) {
    border-color: var(--comp-line) !important;
    background: #e7edf7 !important;
    color: #8794a8 !important;
    opacity: 1 !important;
    box-shadow: none !important;
}

html.dark-mode body :is(
    .mud-dialog.modern-dialog .mud-list,
    .mud-dialog.modern-dialog .mud-list-item,
    .mud-dialog.compliance-alert-detail-dialog .mud-list,
    .mud-dialog.compliance-alert-detail-dialog .mud-list-item,
    .mud-popover,
    .mud-list,
    .mud-picker-calendar,
    .mud-picker-content,
    .mud-menu,
    .mud-menu-list
) {
    background: #172033 !important;
    color: var(--dm-text) !important;
    border-color: var(--dm-border) !important;
}

@media (max-width: 760px) {
    html.dark-mode body :is(
        .mud-dialog.modern-dialog .form-grid,
        .mud-dialog.modern-dialog .form-grid-2,
        .mud-dialog.modern-dialog .form-grid-3,
        .mud-dialog.modern-dialog .form-grid-4
    ) {
        grid-template-columns: 1fr !important;
    }
}

/* Keep select values readable on dark Projects and Compliance surfaces. */
html.dark-mode body :is(
    .modern-projects-container .mud-select,
    .modern-projects-container .mud-select *,
    .modern-projects-container .mud-select-input,
    .modern-projects-container .mud-select-input *,
    .modern-projects-container .mud-input-slot,
    .modern-projects-container .mud-input-slot *,
    .modern-projects-container .mud-input-control-input-container,
    .modern-projects-container .mud-input-control-input-container *,
    .compliance-container .mud-select,
    .compliance-container .mud-select *,
    .compliance-container .mud-select-input,
    .compliance-container .mud-select-input *,
    .compliance-container .mud-input-slot,
    .compliance-container .mud-input-slot *,
    .compliance-container .mud-input-control-input-container,
    .compliance-container .mud-input-control-input-container *
) {
    color: var(--dm-text) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .modern-projects-container .mud-select .mud-icon-root,
    .modern-projects-container .mud-input-adornment .mud-icon-root,
    .compliance-container .mud-select .mud-icon-root,
    .compliance-container .mud-input-adornment .mud-icon-root
) {
    color: var(--dm-text-muted) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .mud-popover .mud-list-item,
    .mud-popover .mud-select-item,
    .mud-popover .mud-list-item *,
    .mud-popover .mud-select-item *,
    .mud-popover .mud-typography,
    .mud-menu .mud-list-item,
    .mud-menu .mud-list-item *,
    .mud-menu .mud-typography
) {
    color: var(--dm-text) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .mud-popover .mud-list-item:hover,
    .mud-popover .mud-list-item:focus,
    .mud-popover .mud-select-item:hover,
    .mud-popover .mud-select-item:focus,
    .mud-popover .mud-list-item.mud-selected-item,
    .mud-popover .mud-select-item.mud-selected-item
) {
    background: var(--dm-surface-2) !important;
    color: var(--dm-text-strong) !important;
}

/* Submit Request modal: legacy inline styles need a dark shell override. */
html.dark-mode body :is(.request-create-dialog, .mud-dialog .request-create-dialog) {
    background: #172033 !important;
    background-color: #172033 !important;
    background-image: none !important;
    border: 1px solid var(--dm-border) !important;
    border-radius: 8px !important;
    color: var(--dm-text) !important;
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.45) !important;
}

html.dark-mode body :is(.request-create-dialog .dialog-header) {
    padding: 22px 26px !important;
    background: #172033 !important;
    background-color: #172033 !important;
    background-image: none !important;
    border-bottom: 1px solid var(--dm-border) !important;
    color: var(--dm-text) !important;
}

html.dark-mode body :is(.request-create-dialog .header-icon) {
    background: rgba(124, 199, 244, 0.12) !important;
    color: #b8efff !important;
    box-shadow: none !important;
}

html.dark-mode body :is(.request-create-dialog .header-icon .mud-icon-root) {
    color: #b8efff !important;
}

html.dark-mode body :is(
    .request-create-dialog .header-text h2,
    .request-create-dialog .timeline-header,
    .request-create-dialog .form-label
) {
    color: var(--dm-text-strong) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .request-create-dialog .header-text p,
    .request-create-dialog .field-note,
    .request-create-dialog .date-label
) {
    color: var(--dm-text-muted) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .request-create-dialog .dialog-body,
    .request-create-dialog .timeline-card
) {
    background: #172033 !important;
    background-color: #172033 !important;
    background-image: none !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}

html.dark-mode body :is(.request-create-dialog .timeline-card) {
    border: 1px solid var(--dm-border) !important;
    border-radius: 8px !important;
}

html.dark-mode body :is(.request-create-dialog .dialog-footer) {
    background: #111a2b !important;
    background-color: #111a2b !important;
    background-image: none !important;
    border-top: 1px solid var(--dm-border) !important;
}

html.dark-mode body :is(
    .request-create-dialog .mud-input-root,
    .request-create-dialog .mud-input-outlined,
    .request-create-dialog .mud-picker-input,
    .request-create-dialog .mud-select-input,
    .request-create-dialog .mud-input-control-input-container
) {
    background: var(--dm-input) !important;
    background-color: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .request-create-dialog input,
    .request-create-dialog textarea,
    .request-create-dialog .mud-input-slot,
    .request-create-dialog .mud-input-slot *,
    .request-create-dialog .mud-select,
    .request-create-dialog .mud-select *,
    .request-create-dialog .select-option,
    .request-create-dialog .select-option *
) {
    color: var(--dm-text) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .request-create-dialog input::placeholder,
    .request-create-dialog textarea::placeholder
) {
    color: var(--dm-text-soft) !important;
    -webkit-text-fill-color: var(--dm-text-soft) !important;
}

html.dark-mode body :is(
    .request-create-dialog .overview-pill,
    .request-create-dialog .mud-chip
) {
    background: rgba(141, 162, 255, 0.12) !important;
    border-color: rgba(141, 162, 255, 0.26) !important;
    color: var(--dm-primary-strong) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(.request-create-dialog .close-btn) {
    border: 1px solid var(--dm-border) !important;
    border-radius: 50% !important;
    background: #1d283b !important;
    color: var(--dm-text-muted) !important;
}

html.dark-mode body :is(.request-create-dialog .date-separator, .request-create-dialog .mud-icon-root) {
    color: var(--dm-text-muted) !important;
}

html.dark-mode body :is(.request-create-dialog .dialog-footer .mud-button-outlined) {
    background: #111a2b !important;
    border-color: var(--dm-border) !important;
    color: #d8e0ff !important;
}

html.dark-mode body :is(.request-create-dialog .dialog-footer .mud-button-filled-success) {
    background: #ded7ff !important;
    border-color: #ded7ff !important;
    color: #3520b7 !important;
}

html.dark-mode body :is(.request-create-dialog .dialog-footer .mud-button-root *) {
    color: inherit !important;
    -webkit-text-fill-color: currentColor !important;
}

/* Projects, Tasks, Daily, and Tickets: component-local white surfaces. */
html.dark-mode body :is(
    .project-list-container,
    .project-toolbar,
    .project-drop-container,
    .virtualized-list,
    .project-list,
    .project-list-item,
    .projects-board-header,
    .dashboard-card,
    .calendar-section,
    .tickets-view-shell,
    .content-section,
    .my-tasks-view,
    .task-filters,
    .task-grid,
    .task-card,
    .task-row,
    .dev-app-management,
    .dev-app-grid,
    .dev-app-card,
    .dev-empty-state,
    .goals-panel,
    .goal-card,
    .goal-content,
    .goal-item,
    .assigned-to,
    .daily-container,
    .daily-header,
    .daily-command-bar,
    .daily-container .filter-bar,
    .daily-board,
    .daily-board-row,
    .daily-metric,
    .user-card,
    .missing-card,
    .missing-daily-panel,
    .empty-state,
    .date-display,
    .stl-filter-shell,
    .stl-metric,
    .stl-status-tab,
    .stl-empty,
    .stl-board,
    .stl-board-row,
    .stl-mobile-card,
    .ticket-report-shell,
    .ticket-report-card,
    .ticket-report-header,
    .report-summary-card,
    .report-panel,
    .report-breakdown-row,
    .report-empty,
    .report-table,
    .tickets-grid
),
body.dark-mode :is(
    .project-list-container,
    .project-toolbar,
    .project-drop-container,
    .virtualized-list,
    .project-list,
    .project-list-item,
    .projects-board-header,
    .dashboard-card,
    .calendar-section,
    .tickets-view-shell,
    .content-section,
    .my-tasks-view,
    .task-filters,
    .task-grid,
    .task-card,
    .task-row,
    .dev-app-management,
    .dev-app-grid,
    .dev-app-card,
    .dev-empty-state,
    .goals-panel,
    .goal-card,
    .goal-content,
    .goal-item,
    .assigned-to,
    .daily-container,
    .daily-header,
    .daily-command-bar,
    .daily-container .filter-bar,
    .daily-board,
    .daily-board-row,
    .daily-metric,
    .user-card,
    .missing-card,
    .missing-daily-panel,
    .empty-state,
    .date-display,
    .stl-filter-shell,
    .stl-metric,
    .stl-status-tab,
    .stl-empty,
    .stl-board,
    .stl-board-row,
    .stl-mobile-card,
    .ticket-report-shell,
    .ticket-report-card,
    .ticket-report-header,
    .report-summary-card,
    .report-panel,
    .report-breakdown-row,
    .report-empty,
    .report-table,
    .tickets-grid
) {
    background: var(--dm-surface) !important;
    background-color: var(--dm-surface) !important;
    background-image: none !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
    box-shadow: var(--dm-shadow) !important;
}

html.dark-mode body :is(
    .projects-board-header,
    .daily-board-header,
    .stl-board-header,
    .report-table th,
    .tickets-grid .mud-table-head,
    .tickets-grid .mud-table-head .mud-table-cell
),
body.dark-mode :is(
    .projects-board-header,
    .daily-board-header,
    .stl-board-header,
    .report-table th,
    .tickets-grid .mud-table-head,
    .tickets-grid .mud-table-head .mud-table-cell
) {
    background: var(--dm-input) !important;
    background-color: var(--dm-input) !important;
    background-image: none !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text-muted) !important;
}

html.dark-mode body :is(
    .project-list-item:hover,
    .daily-board-row:hover,
    .daily-board-row:focus-visible,
    .stl-board-row:hover,
    .stl-board-row:focus-visible,
    .report-ticket-row:hover,
    .user-card:hover
),
body.dark-mode :is(
    .project-list-item:hover,
    .daily-board-row:hover,
    .daily-board-row:focus-visible,
    .stl-board-row:hover,
    .stl-board-row:focus-visible,
    .report-ticket-row:hover,
    .user-card:hover
) {
    background: var(--dm-surface-2) !important;
    background-color: var(--dm-surface-2) !important;
    box-shadow: inset 0 0 0 1px rgba(141, 162, 255, 0.12) !important;
}

html.dark-mode body :is(
    .project-title,
    .dashboard-title,
    .task-title,
    .dev-app-title,
    .dev-app-name,
    .dev-empty-title,
    .goal-title,
    .item-text,
    .daily-container .header-title,
    .daily-container .user-name,
    .daily-container .missing-name,
    .stl-title,
    .stl-ticket-main h3,
    .stl-person-cell,
    .stl-activity-cell strong,
    .report-title,
    .report-panel-title,
    .report-value,
    .report-score,
    .report-breakdown-row strong,
    .report-table td
),
body.dark-mode :is(
    .project-title,
    .dashboard-title,
    .task-title,
    .dev-app-title,
    .dev-app-name,
    .dev-empty-title,
    .goal-title,
    .item-text,
    .daily-container .header-title,
    .daily-container .user-name,
    .daily-container .missing-name,
    .stl-title,
    .stl-ticket-main h3,
    .stl-person-cell,
    .stl-activity-cell strong,
    .report-title,
    .report-panel-title,
    .report-value,
    .report-score,
    .report-breakdown-row strong,
    .report-table td
) {
    color: var(--dm-text-strong) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .project-meta,
    .dashboard-description,
    .task-meta,
    .dev-app-subtitle,
    .dev-app-description,
    .dev-empty-copy,
    .goal-description,
    .goal-meta,
    .daily-container .header-sub,
    .daily-container .user-meta,
    .daily-time-row,
    .daily-container .missing-meta,
    .submitted-cell,
    .no-blockers,
    .stl-subtitle,
    .stl-ticket-main p,
    .stl-location,
    .stl-activity-cell span,
    .report-subtitle,
    .report-label,
    .report-breakdown-row,
    .report-empty
),
body.dark-mode :is(
    .project-meta,
    .dashboard-description,
    .task-meta,
    .dev-app-subtitle,
    .dev-app-description,
    .dev-empty-copy,
    .goal-description,
    .goal-meta,
    .daily-container .header-sub,
    .daily-container .user-meta,
    .daily-time-row,
    .daily-container .missing-meta,
    .submitted-cell,
    .no-blockers,
    .stl-subtitle,
    .stl-ticket-main p,
    .stl-location,
    .stl-activity-cell span,
    .report-subtitle,
    .report-label,
    .report-breakdown-row,
    .report-empty
) {
    color: var(--dm-text-muted) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .project-count-chip,
    .metric-pill,
    .project-chip,
    .developer-chip,
    .goal-count-chip,
    .term-chip,
    .daily-metric.posted,
    .daily-metric.missing,
    .daily-metric.late,
    .daily-metric.progress,
    .missing-chip,
    .missing-badge,
    .late-badge,
    .status-pill,
    .project-chip.more,
    .stl-count-pill,
    .stl-status-tab strong,
    .stl-ticket-number,
    .stl-category,
    .stl-pill,
    .stl-avatar,
    .stl-unassigned,
    .report-face,
    .report-face-happy,
    .report-face-neutral,
    .report-face-angry
),
body.dark-mode :is(
    .project-count-chip,
    .metric-pill,
    .project-chip,
    .developer-chip,
    .goal-count-chip,
    .term-chip,
    .daily-metric.posted,
    .daily-metric.missing,
    .daily-metric.late,
    .daily-metric.progress,
    .missing-chip,
    .missing-badge,
    .late-badge,
    .status-pill,
    .project-chip.more,
    .stl-count-pill,
    .stl-status-tab strong,
    .stl-ticket-number,
    .stl-category,
    .stl-pill,
    .stl-avatar,
    .stl-unassigned,
    .report-face,
    .report-face-happy,
    .report-face-neutral,
    .report-face-angry
) {
    background: var(--dm-primary-surface) !important;
    background-color: var(--dm-primary-surface) !important;
    background-image: none !important;
    border-color: rgba(141, 162, 255, 0.28) !important;
    color: var(--dm-primary-strong) !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: none !important;
}

html.dark-mode body :is(
    .goal-item.completed,
    .daily-metric.posted,
    .status-posted,
    .status-resolved,
    .stl-metric.resolved,
    .source-publicform,
    .stl-avatar.assigned
),
body.dark-mode :is(
    .goal-item.completed,
    .daily-metric.posted,
    .status-posted,
    .status-resolved,
    .stl-metric.resolved,
    .source-publicform,
    .stl-avatar.assigned
) {
    background: rgba(95, 214, 166, 0.16) !important;
    border-color: rgba(95, 214, 166, 0.28) !important;
    color: #9be8c7 !important;
}

html.dark-mode body :is(
    .goal-item.in-progress,
    .goal-item.on-hold,
    .daily-metric.late,
    .daily-board-row-late,
    .status-late,
    .stl-metric.progress,
    .priority-medium,
    .status-inprogress,
    .source-maintenance,
    .report-face-neutral
),
body.dark-mode :is(
    .goal-item.in-progress,
    .goal-item.on-hold,
    .daily-metric.late,
    .daily-board-row-late,
    .status-late,
    .stl-metric.progress,
    .priority-medium,
    .status-inprogress,
    .source-maintenance,
    .report-face-neutral
) {
    background: rgba(231, 197, 111, 0.16) !important;
    border-color: rgba(231, 197, 111, 0.30) !important;
    color: #f2d995 !important;
}

html.dark-mode body :is(
    .goal-item.cancelled,
    .daily-metric.missing,
    .missing-card,
    .missing-daily-panel,
    .missing-chip,
    .missing-badge,
    .blocker-pill,
    .stl-metric.critical,
    .priority-high,
    .priority-critical,
    .report-face-angry
),
body.dark-mode :is(
    .goal-item.cancelled,
    .daily-metric.missing,
    .missing-card,
    .missing-daily-panel,
    .missing-chip,
    .missing-badge,
    .blocker-pill,
    .stl-metric.critical,
    .priority-high,
    .priority-critical,
    .report-face-angry
) {
    background: rgba(241, 139, 153, 0.16) !important;
    border-color: rgba(241, 139, 153, 0.30) !important;
    color: #ffc1c8 !important;
}

html.dark-mode body :is(
    .project-filter-field .mud-input-root,
    .project-filter-select .mud-input-root,
    .status-select .mud-input-root,
    .stl-search .mud-input-root,
    .stl-filter-select .mud-input-root,
    .stl-person-filter .mud-input-root,
    .stl-date-filter .mud-input-root,
    .daily-container .filter-item .mud-input-root,
    .daily-container .filter-item-sm .mud-input-root,
    .report-search .mud-input-root,
    .report-filter .mud-input-root,
    .report-filter-md .mud-input-root,
    .report-date .mud-input-root
),
body.dark-mode :is(
    .project-filter-field .mud-input-root,
    .project-filter-select .mud-input-root,
    .status-select .mud-input-root,
    .stl-search .mud-input-root,
    .stl-filter-select .mud-input-root,
    .stl-person-filter .mud-input-root,
    .stl-date-filter .mud-input-root,
    .daily-container .filter-item .mud-input-root,
    .daily-container .filter-item-sm .mud-input-root,
    .report-search .mud-input-root,
    .report-filter .mud-input-root,
    .report-filter-md .mud-input-root,
    .report-date .mud-input-root
) {
    background: var(--dm-input) !important;
    background-color: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .nav-btn,
    .btn-today,
    .btn-outline,
    .btn-secondary,
    .board-action-button,
    .stl-row-action,
    .project-clear-filters,
    .icon-actions,
    .dev-app-actions .mud-icon-button,
    .goal-actions .mud-icon-button
),
body.dark-mode :is(
    .nav-btn,
    .btn-today,
    .btn-outline,
    .btn-secondary,
    .board-action-button,
    .stl-row-action,
    .project-clear-filters,
    .icon-actions,
    .dev-app-actions .mud-icon-button,
    .goal-actions .mud-icon-button
) {
    background: var(--dm-input) !important;
    background-color: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-primary-strong) !important;
    box-shadow: none !important;
}

html.dark-mode body :is(
    .mud-dialog .modern-dialog,
    .mud-dialog .modern-dialog .dialog-body,
    .mud-dialog .modern-dialog .obstacles-section,
    .mud-dialog .modern-dialog .entry-card,
    .mud-dialog .modern-dialog .date-section
),
body.dark-mode :is(
    .mud-dialog .modern-dialog,
    .mud-dialog .modern-dialog .dialog-body,
    .mud-dialog .modern-dialog .obstacles-section,
    .mud-dialog .modern-dialog .entry-card,
    .mud-dialog .modern-dialog .date-section
) {
    background: var(--dm-surface) !important;
    background-color: var(--dm-surface) !important;
    background-image: none !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}

html.dark-mode body :is(.mud-dialog .modern-dialog .dialog-header),
body.dark-mode :is(.mud-dialog .modern-dialog .dialog-header) {
    background: var(--dm-surface) !important;
    background-color: var(--dm-surface) !important;
    background-image: none !important;
    border-bottom-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}

html.dark-mode body :is(.mud-dialog .modern-dialog .dialog-footer),
body.dark-mode :is(.mud-dialog .modern-dialog .dialog-footer) {
    background: var(--dm-input) !important;
    background-color: var(--dm-input) !important;
    background-image: none !important;
    border-top-color: var(--dm-border) !important;
}

html.dark-mode body :is(
    .mud-dialog .modern-dialog .header-content h2,
    .mud-dialog .modern-dialog .form-label,
    .mud-dialog .modern-dialog .progress-value
),
body.dark-mode :is(
    .mud-dialog .modern-dialog .header-content h2,
    .mud-dialog .modern-dialog .form-label,
    .mud-dialog .modern-dialog .progress-value
) {
    color: var(--dm-text-strong) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .mud-dialog .modern-dialog .header-content p,
    .mud-dialog .modern-dialog .field-hint
),
body.dark-mode :is(
    .mud-dialog .modern-dialog .header-content p,
    .mud-dialog .modern-dialog .field-hint
) {
    color: var(--dm-text-muted) !important;
    -webkit-text-fill-color: currentColor !important;
}

/* Subtask drawer, Service Reports, and Ticket Reports final hardening. */
html.dark-mode body :is(
    .subtasks-drawer,
    .subtasks-drawer .mud-drawer-content,
    .subtasks-drawer .drawer-header,
    .subtasks-drawer .drawer-content,
    .subtasks-drawer .drawer-actions,
    .subtasks-drawer .subtasks-list,
    .subtasks-drawer .subtask-card,
    .subtasks-drawer .subtask-card-content,
    .subtasks-drawer .subtask-footer,
    .subtasks-drawer .no-subtasks,
    .virtualized-subtasks-list,
    .sr-list-container,
    .sr-summary-card,
    .sr-table-wrapper,
    .sr-list-container .modern-table,
    .sr-empty-state,
    .srd-summary,
    .srd-task-item,
    .str-shell,
    .str-summary-card,
    .str-panel,
    .str-breakdown-row,
    .str-table,
    .str-empty,
    .ticket-report-shell,
    .ticket-report-shell .report-summary-card,
    .ticket-report-shell .report-panel,
    .ticket-report-shell .report-breakdown-row,
    .ticket-report-shell .report-empty,
    .ticket-report-shell .report-table
),
body.dark-mode :is(
    .subtasks-drawer,
    .subtasks-drawer .mud-drawer-content,
    .subtasks-drawer .drawer-header,
    .subtasks-drawer .drawer-content,
    .subtasks-drawer .drawer-actions,
    .subtasks-drawer .subtasks-list,
    .subtasks-drawer .subtask-card,
    .subtasks-drawer .subtask-card-content,
    .subtasks-drawer .subtask-footer,
    .subtasks-drawer .no-subtasks,
    .virtualized-subtasks-list,
    .sr-list-container,
    .sr-summary-card,
    .sr-table-wrapper,
    .sr-list-container .modern-table,
    .sr-empty-state,
    .srd-summary,
    .srd-task-item,
    .str-shell,
    .str-summary-card,
    .str-panel,
    .str-breakdown-row,
    .str-table,
    .str-empty,
    .ticket-report-shell,
    .ticket-report-shell .report-summary-card,
    .ticket-report-shell .report-panel,
    .ticket-report-shell .report-breakdown-row,
    .ticket-report-shell .report-empty,
    .ticket-report-shell .report-table
) {
    background: var(--dm-surface) !important;
    background-color: var(--dm-surface) !important;
    background-image: none !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
    box-shadow: var(--dm-shadow) !important;
}

html.dark-mode body :is(
    .subtasks-drawer .subtask-card:hover,
    .str-ticket-row:hover,
    .ticket-report-shell .report-ticket-row:hover,
    .sr-row:hover
),
body.dark-mode :is(
    .subtasks-drawer .subtask-card:hover,
    .str-ticket-row:hover,
    .ticket-report-shell .report-ticket-row:hover,
    .sr-row:hover
) {
    background: var(--dm-surface-2) !important;
    background-color: var(--dm-surface-2) !important;
    box-shadow: inset 0 0 0 1px rgba(141, 162, 255, 0.12) !important;
}

html.dark-mode body :is(
    .sr-list-container .modern-table th,
    .str-table th,
    .ticket-report-shell .report-table th
),
body.dark-mode :is(
    .sr-list-container .modern-table th,
    .str-table th,
    .ticket-report-shell .report-table th
) {
    background: var(--dm-input) !important;
    background-color: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text-muted) !important;
}

html.dark-mode body :is(
    .sr-list-container .modern-table td,
    .str-table td,
    .ticket-report-shell .report-table td
),
body.dark-mode :is(
    .sr-list-container .modern-table td,
    .str-table td,
    .ticket-report-shell .report-table td
) {
    border-color: var(--dm-border-soft) !important;
    color: var(--dm-text) !important;
}

html.dark-mode body :is(
    .subtasks-drawer .drawer-title,
    .subtasks-drawer .subtask-name,
    .sr-title,
    .sr-summary-value,
    .sr-row-title,
    .sr-muted-strong,
    .sr-empty-title,
    .srd-title,
    .srd-value,
    .srd-section-title,
    .srd-task-title,
    .str-title,
    .str-summary-card strong,
    .str-panel-title,
    .str-breakdown-row strong,
    .str-score,
    .ticket-report-shell .report-title,
    .ticket-report-shell .report-value,
    .ticket-report-shell .report-panel-title,
    .ticket-report-shell .report-breakdown-row strong,
    .ticket-report-shell .report-score
),
body.dark-mode :is(
    .subtasks-drawer .drawer-title,
    .subtasks-drawer .subtask-name,
    .sr-title,
    .sr-summary-value,
    .sr-row-title,
    .sr-muted-strong,
    .sr-empty-title,
    .srd-title,
    .srd-value,
    .srd-section-title,
    .srd-task-title,
    .str-title,
    .str-summary-card strong,
    .str-panel-title,
    .str-breakdown-row strong,
    .str-score,
    .ticket-report-shell .report-title,
    .ticket-report-shell .report-value,
    .ticket-report-shell .report-panel-title,
    .ticket-report-shell .report-breakdown-row strong,
    .ticket-report-shell .report-score
) {
    color: var(--dm-text-strong) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .subtasks-drawer .subtask-meta,
    .sr-subtitle,
    .sr-row-sub,
    .sr-empty-copy,
    .sr-summary-label,
    .srd-subtitle,
    .srd-label,
    .str-subtitle,
    .str-label,
    .str-breakdown-row,
    .str-empty,
    .ticket-report-shell .report-subtitle,
    .ticket-report-shell .report-label,
    .ticket-report-shell .report-breakdown-row,
    .ticket-report-shell .report-empty
),
body.dark-mode :is(
    .subtasks-drawer .subtask-meta,
    .sr-subtitle,
    .sr-row-sub,
    .sr-empty-copy,
    .sr-summary-label,
    .srd-subtitle,
    .srd-label,
    .str-subtitle,
    .str-label,
    .str-breakdown-row,
    .str-empty,
    .ticket-report-shell .report-subtitle,
    .ticket-report-shell .report-label,
    .ticket-report-shell .report-breakdown-row,
    .ticket-report-shell .report-empty
) {
    color: var(--dm-text-muted) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .subtasks-drawer .drawer-chip,
    .subtasks-drawer .subtask-index-badge,
    .subtasks-drawer .assignee-chip,
    .sr-count-pill,
    .sr-table-pill,
    .srd-chip,
    .str-score,
    .ticket-report-shell .report-score
),
body.dark-mode :is(
    .subtasks-drawer .drawer-chip,
    .subtasks-drawer .subtask-index-badge,
    .subtasks-drawer .assignee-chip,
    .sr-count-pill,
    .sr-table-pill,
    .srd-chip,
    .str-score,
    .ticket-report-shell .report-score
) {
    background: var(--dm-primary-surface) !important;
    background-color: var(--dm-primary-surface) !important;
    border-color: rgba(141, 162, 255, 0.28) !important;
    color: var(--dm-primary-strong) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .subtasks-drawer .drawer-close-button,
    .srd-secondary-action,
    .sr-clear-action,
    .str-action,
    .ticket-report-shell .report-refresh,
    .ticket-report-shell .report-clear
),
body.dark-mode :is(
    .subtasks-drawer .drawer-close-button,
    .srd-secondary-action,
    .sr-clear-action,
    .str-action,
    .ticket-report-shell .report-refresh,
    .ticket-report-shell .report-clear
) {
    background: var(--dm-input) !important;
    background-color: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-primary-strong) !important;
    box-shadow: none !important;
}

html.dark-mode body :is(
    .sr-filter-search .mud-input-root,
    .sr-filter-sm .mud-input-root,
    .sr-filter-md .mud-input-root,
    .sr-filter-date .mud-input-root,
    .str-search .mud-input-root,
    .str-filter .mud-input-root,
    .str-filter-wide .mud-input-root,
    .str-date .mud-input-root
),
body.dark-mode :is(
    .sr-filter-search .mud-input-root,
    .sr-filter-sm .mud-input-root,
    .sr-filter-md .mud-input-root,
    .sr-filter-date .mud-input-root,
    .str-search .mud-input-root,
    .str-filter .mud-input-root,
    .str-filter-wide .mud-input-root,
    .str-date .mud-input-root
) {
    background: var(--dm-input) !important;
    background-color: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
    -webkit-text-fill-color: currentColor !important;
}

/* Projects dashboard: calmer native dark board treatment. */
html.dark-mode body .project-list-container,
body.dark-mode .project-list-container {
    background: #101827 !important;
    background-color: #101827 !important;
    border-color: #263449 !important;
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.22) !important;
    color: #e8eefb !important;
}

html.dark-mode body .project-list-container .project-toolbar,
body.dark-mode .project-list-container .project-toolbar {
    background: #101827 !important;
    background-color: #101827 !important;
    border-bottom-color: #263449 !important;
    box-shadow: none !important;
}

html.dark-mode body .project-list-container .projects-board-header,
body.dark-mode .project-list-container .projects-board-header {
    background: #0d1523 !important;
    background-color: #0d1523 !important;
    border-bottom-color: #263449 !important;
    color: #94a3b8 !important;
    box-shadow: none !important;
}

html.dark-mode body .project-list-container :is(.project-drop-container, .virtualized-list, .project-list, .project-drop-zone),
body.dark-mode .project-list-container :is(.project-drop-container, .virtualized-list, .project-list, .project-drop-zone) {
    background: #101827 !important;
    background-color: #101827 !important;
    box-shadow: none !important;
}

html.dark-mode body .project-list-container .project-list-item,
body.dark-mode .project-list-container .project-list-item {
    background: #141e2f !important;
    background-color: #141e2f !important;
    border-bottom-color: #202c40 !important;
    box-shadow: none !important;
}

html.dark-mode body .project-list-container .project-list-item:nth-child(even),
body.dark-mode .project-list-container .project-list-item:nth-child(even) {
    background: #152033 !important;
    background-color: #152033 !important;
}

html.dark-mode body .project-list-container .project-list-item:hover,
body.dark-mode .project-list-container .project-list-item:hover {
    background: #18243a !important;
    background-color: #18243a !important;
    box-shadow: none !important;
}

html.dark-mode body .project-list-container .project-row,
body.dark-mode .project-list-container .project-row {
    background: transparent !important;
    border-left-color: transparent !important;
    box-shadow: none !important;
}

html.dark-mode body .project-list-container .project-row:hover,
body.dark-mode .project-list-container .project-row:hover {
    background: transparent !important;
    border-left-color: #7cc7f4 !important;
    box-shadow: none !important;
}

html.dark-mode body .project-list-container .order-number,
body.dark-mode .project-list-container .order-number {
    background: transparent !important;
    background-color: transparent !important;
    border-color: transparent !important;
    color: #d6e1f2 !important;
    box-shadow: none !important;
}

html.dark-mode body .project-list-container .order-number-button,
body.dark-mode .project-list-container .order-number-button {
    background: transparent !important;
    background-color: transparent !important;
    border: 1px solid #35445c !important;
    color: #dbe6f6 !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: none !important;
}

html.dark-mode body .project-list-container .order-number .mud-typography,
body.dark-mode .project-list-container .order-number .mud-typography {
    background: transparent !important;
    color: #dbe6f6 !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: none !important;
}

html.dark-mode body .project-list-container .order-number-button:hover,
body.dark-mode .project-list-container .order-number-button:hover {
    background: #1b283d !important;
    background-color: #1b283d !important;
    border-color: #53647f !important;
}

html.dark-mode body .project-list-container .drag-handle,
body.dark-mode .project-list-container .drag-handle {
    background: #1a2639 !important;
    background-color: #1a2639 !important;
    border-color: #2b3a52 !important;
    color: #a8b4c7 !important;
    box-shadow: none !important;
}

html.dark-mode body .project-list-container .drag-handle .mud-icon-root,
body.dark-mode .project-list-container .drag-handle .mud-icon-root {
    color: #a8b4c7 !important;
}

html.dark-mode body .project-list-container .project-icon,
body.dark-mode .project-list-container .project-icon {
    background: rgba(124, 199, 244, 0.12) !important;
    background-color: rgba(124, 199, 244, 0.12) !important;
    border: 1px solid rgba(124, 199, 244, 0.20) !important;
    color: #7cc7f4 !important;
    box-shadow: none !important;
}

html.dark-mode body .project-list-container .project-icon .mud-icon-root,
body.dark-mode .project-list-container .project-icon .mud-icon-root {
    color: #7cc7f4 !important;
}

html.dark-mode body .project-list-container .project-name,
body.dark-mode .project-list-container .project-name {
    color: #f3f7ff !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body .project-list-container .project-desc,
body.dark-mode .project-list-container .project-desc {
    color: #9ba8ba !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body .project-list-container :is(.project-priority-cell, .project-status-cell) :is(.mud-chip, .priority-badge, .status-badge),
body.dark-mode .project-list-container :is(.project-priority-cell, .project-status-cell) :is(.mud-chip, .priority-badge, .status-badge) {
    background: #24314d !important;
    background-color: #24314d !important;
    border-color: #344466 !important;
    color: #ced8f3 !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: none !important;
}

html.dark-mode body .project-list-container :is(.priority-high, .priority-critical),
body.dark-mode .project-list-container :is(.priority-high, .priority-critical) {
    background: rgba(241, 139, 153, 0.14) !important;
    border-color: rgba(241, 139, 153, 0.26) !important;
    color: #ffc1c8 !important;
}

html.dark-mode body .project-list-container .priority-medium,
body.dark-mode .project-list-container .priority-medium {
    background: rgba(231, 197, 111, 0.13) !important;
    border-color: rgba(231, 197, 111, 0.24) !important;
    color: #f2d995 !important;
}

html.dark-mode body .project-list-container :is(.status-completed, .status-inprogress),
body.dark-mode .project-list-container :is(.status-completed, .status-inprogress) {
    background: rgba(95, 214, 166, 0.13) !important;
    border-color: rgba(95, 214, 166, 0.24) !important;
    color: #9be8c7 !important;
}

html.dark-mode body .project-list-container :is(.progress-cell, .project-timeline-pill, .actions-cell),
body.dark-mode .project-list-container :is(.progress-cell, .project-timeline-pill, .actions-cell) {
    background: transparent !important;
    background-color: transparent !important;
    border-color: transparent !important;
    color: #aeb9cb !important;
    box-shadow: none !important;
}

html.dark-mode body .project-list-container .progress-text,
html.dark-mode body .project-list-container .project-timeline-pill .mud-typography,
body.dark-mode .project-list-container .progress-text,
body.dark-mode .project-list-container .project-timeline-pill .mud-typography {
    color: #b7c2d4 !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body .project-list-container .progress-bar,
body.dark-mode .project-list-container .progress-bar {
    background-color: #273348 !important;
}

html.dark-mode body .project-list-container .timeline-icon,
body.dark-mode .project-list-container .timeline-icon {
    color: #aab6c8 !important;
}

html.dark-mode body .project-list-container .actions-cell .mud-icon-button,
body.dark-mode .project-list-container .actions-cell .mud-icon-button {
    background: transparent !important;
    background-color: transparent !important;
    border: 1px solid transparent !important;
    color: #9ba8ba !important;
    box-shadow: none !important;
}

html.dark-mode body .project-list-container .actions-cell .mud-icon-button:hover,
body.dark-mode .project-list-container .actions-cell .mud-icon-button:hover {
    background: #1b283d !important;
    background-color: #1b283d !important;
    border-color: #2d3d58 !important;
    color: #e0e8ff !important;
}

html.dark-mode body .project-list-container .project-count-chip,
body.dark-mode .project-list-container .project-count-chip {
    background: #202d46 !important;
    background-color: #202d46 !important;
    border-color: #33425e !important;
    color: #cbd7f4 !important;
    box-shadow: none !important;
}

html.dark-mode body .project-list-container :is(.project-filter-field, .project-filter-select) .mud-input-root,
body.dark-mode .project-list-container :is(.project-filter-field, .project-filter-select) .mud-input-root {
    background: #0d1523 !important;
    background-color: #0d1523 !important;
    border-color: #263449 !important;
    color: #edf3ff !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: none !important;
}

html.dark-mode body .project-list-container .pagination-container,
body.dark-mode .project-list-container .pagination-container {
    background: #101827 !important;
    background-color: #101827 !important;
    border-top-color: #263449 !important;
    box-shadow: none !important;
}

/* User Management dialogs: create/edit user and scoped department modals. */
html.dark-mode body :is(.mud-dialog.user-permission-dialog, .mud-dialog.user-admin-dialog),
body.dark-mode :is(.mud-dialog.user-permission-dialog, .mud-dialog.user-admin-dialog) {
    background: #101827 !important;
    background-color: #101827 !important;
    border: 1px solid #2a3850 !important;
    color: var(--dm-text) !important;
    box-shadow: 0 22px 54px rgba(0, 0, 0, 0.42) !important;
}

html.dark-mode body :is(
    .mud-dialog.user-permission-dialog .mud-dialog-title,
    .mud-dialog.user-permission-dialog .mud-dialog-content,
    .mud-dialog.user-permission-dialog .mud-dialog-actions,
    .mud-dialog.user-admin-dialog .mud-dialog-title,
    .mud-dialog.user-admin-dialog .mud-dialog-content,
    .mud-dialog.user-admin-dialog .mud-dialog-actions
),
body.dark-mode :is(
    .mud-dialog.user-permission-dialog .mud-dialog-title,
    .mud-dialog.user-permission-dialog .mud-dialog-content,
    .mud-dialog.user-permission-dialog .mud-dialog-actions,
    .mud-dialog.user-admin-dialog .mud-dialog-title,
    .mud-dialog.user-admin-dialog .mud-dialog-content,
    .mud-dialog.user-admin-dialog .mud-dialog-actions
) {
    background: #101827 !important;
    background-color: #101827 !important;
    color: var(--dm-text) !important;
    border-color: #263449 !important;
}

html.dark-mode body :is(
    .mud-dialog.user-permission-dialog .mud-dialog-actions,
    .mud-dialog.user-admin-dialog .mud-dialog-actions
),
body.dark-mode :is(
    .mud-dialog.user-permission-dialog .mud-dialog-actions,
    .mud-dialog.user-admin-dialog .mud-dialog-actions
) {
    background: #0d1523 !important;
    background-color: #0d1523 !important;
    border-top: 1px solid #263449 !important;
}

html.dark-mode body .mud-dialog.user-permission-dialog .user-dialog-hero,
body.dark-mode .mud-dialog.user-permission-dialog .user-dialog-hero {
    border-color: #2f3f59 !important;
    background:
        linear-gradient(90deg, #8da2ff 0 22%, #5fd6a6 22% 40%, #7cc7f4 40% 60%, #c5b5ff 60% 78%, #f18b99 78% 100%) top / 100% 5px no-repeat,
        linear-gradient(135deg, #131d30 0%, #101827 62%, #172033 100%) !important;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.28) !important;
}

html.dark-mode body .mud-dialog.user-permission-dialog .user-dialog-hero-icon,
body.dark-mode .mud-dialog.user-permission-dialog .user-dialog-hero-icon {
    background: rgba(141, 162, 255, 0.16) !important;
    color: var(--dm-primary-strong) !important;
}

html.dark-mode body :is(
    .mud-dialog.user-permission-dialog .dialog-panel,
    .mud-dialog.user-permission-dialog .perm-group,
    .mud-dialog.user-permission-dialog .dashboard-perm-card,
    .mud-dialog.user-permission-dialog .account-state-card,
    .mud-dialog.user-permission-dialog .mud-expansion-panels,
    .mud-dialog.user-permission-dialog .mud-expand-panel,
    .mud-dialog.user-admin-dialog .mud-paper,
    .mud-dialog.user-admin-dialog .mud-card
),
body.dark-mode :is(
    .mud-dialog.user-permission-dialog .dialog-panel,
    .mud-dialog.user-permission-dialog .perm-group,
    .mud-dialog.user-permission-dialog .dashboard-perm-card,
    .mud-dialog.user-permission-dialog .account-state-card,
    .mud-dialog.user-permission-dialog .mud-expansion-panels,
    .mud-dialog.user-permission-dialog .mud-expand-panel,
    .mud-dialog.user-admin-dialog .mud-paper,
    .mud-dialog.user-admin-dialog .mud-card
) {
    background: #172033 !important;
    background-color: #172033 !important;
    background-image: none !important;
    border-color: #334155 !important;
    color: var(--dm-text) !important;
    box-shadow: 0 10px 26px rgba(0, 0, 0, 0.24) !important;
}

html.dark-mode body .mud-dialog.user-permission-dialog .perm-grid .mud-checkbox,
body.dark-mode .mud-dialog.user-permission-dialog .perm-grid .mud-checkbox {
    background: #111a2b !important;
    background-color: #111a2b !important;
    border-color: #2d3d58 !important;
    color: var(--dm-text) !important;
}

html.dark-mode body :is(
    .mud-dialog.user-permission-dialog .user-dialog-title,
    .mud-dialog.user-permission-dialog .dialog-panel-heading .mud-typography-subtitle1,
    .mud-dialog.user-permission-dialog .permissions-header .mud-typography-subtitle1,
    .mud-dialog.user-permission-dialog .perm-group-header .mud-typography-subtitle2,
    .mud-dialog.user-permission-dialog .dashboard-perm-card .mud-typography-body1,
    .mud-dialog.user-admin-dialog .mud-dialog-title,
    .mud-dialog.user-admin-dialog .mud-typography-subtitle1,
    .mud-dialog.user-admin-dialog .mud-typography-subtitle2,
    .mud-dialog.user-admin-dialog .mud-typography-body1,
    .mud-dialog.user-admin-dialog .mud-typography-body2
),
body.dark-mode :is(
    .mud-dialog.user-permission-dialog .user-dialog-title,
    .mud-dialog.user-permission-dialog .dialog-panel-heading .mud-typography-subtitle1,
    .mud-dialog.user-permission-dialog .permissions-header .mud-typography-subtitle1,
    .mud-dialog.user-permission-dialog .perm-group-header .mud-typography-subtitle2,
    .mud-dialog.user-permission-dialog .dashboard-perm-card .mud-typography-body1,
    .mud-dialog.user-admin-dialog .mud-dialog-title,
    .mud-dialog.user-admin-dialog .mud-typography-subtitle1,
    .mud-dialog.user-admin-dialog .mud-typography-subtitle2,
    .mud-dialog.user-admin-dialog .mud-typography-body1,
    .mud-dialog.user-admin-dialog .mud-typography-body2
) {
    color: var(--dm-text-strong) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .mud-dialog.user-permission-dialog .user-dialog-subtitle,
    .mud-dialog.user-permission-dialog .dialog-panel-heading .mud-typography-caption,
    .mud-dialog.user-permission-dialog .mud-typography-caption,
    .mud-dialog.user-permission-dialog .mud-input-helper-text,
    .mud-dialog.user-admin-dialog .mud-typography-caption,
    .mud-dialog.user-admin-dialog .mud-input-helper-text
),
body.dark-mode :is(
    .mud-dialog.user-permission-dialog .user-dialog-subtitle,
    .mud-dialog.user-permission-dialog .dialog-panel-heading .mud-typography-caption,
    .mud-dialog.user-permission-dialog .mud-typography-caption,
    .mud-dialog.user-permission-dialog .mud-input-helper-text,
    .mud-dialog.user-admin-dialog .mud-typography-caption,
    .mud-dialog.user-admin-dialog .mud-input-helper-text
) {
    color: var(--dm-text-muted) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .mud-dialog.user-permission-dialog .mud-input-root,
    .mud-dialog.user-permission-dialog .mud-input-outlined,
    .mud-dialog.user-permission-dialog .mud-input-filled,
    .mud-dialog.user-admin-dialog .mud-input-root,
    .mud-dialog.user-admin-dialog .mud-input-outlined,
    .mud-dialog.user-admin-dialog .mud-input-filled
),
body.dark-mode :is(
    .mud-dialog.user-permission-dialog .mud-input-root,
    .mud-dialog.user-permission-dialog .mud-input-outlined,
    .mud-dialog.user-permission-dialog .mud-input-filled,
    .mud-dialog.user-admin-dialog .mud-input-root,
    .mud-dialog.user-admin-dialog .mud-input-outlined,
    .mud-dialog.user-admin-dialog .mud-input-filled
) {
    background: #0d1523 !important;
    background-color: #0d1523 !important;
    border-color: #334155 !important;
    color: var(--dm-text) !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: none !important;
}

html.dark-mode body :is(
    .mud-dialog.user-permission-dialog .mud-input-outlined fieldset,
    .mud-dialog.user-admin-dialog .mud-input-outlined fieldset
),
body.dark-mode :is(
    .mud-dialog.user-permission-dialog .mud-input-outlined fieldset,
    .mud-dialog.user-admin-dialog .mud-input-outlined fieldset
) {
    border-color: #334155 !important;
}

html.dark-mode body :is(
    .mud-dialog.user-permission-dialog .mud-input-label,
    .mud-dialog.user-permission-dialog input,
    .mud-dialog.user-permission-dialog textarea,
    .mud-dialog.user-permission-dialog .mud-input-slot,
    .mud-dialog.user-permission-dialog .mud-select-input,
    .mud-dialog.user-permission-dialog .mud-input-adornment,
    .mud-dialog.user-permission-dialog .mud-checkbox .mud-typography,
    .mud-dialog.user-permission-dialog .mud-switch .mud-typography,
    .mud-dialog.user-admin-dialog .mud-input-label,
    .mud-dialog.user-admin-dialog input,
    .mud-dialog.user-admin-dialog textarea,
    .mud-dialog.user-admin-dialog .mud-input-slot,
    .mud-dialog.user-admin-dialog .mud-select-input,
    .mud-dialog.user-admin-dialog .mud-input-adornment
),
body.dark-mode :is(
    .mud-dialog.user-permission-dialog .mud-input-label,
    .mud-dialog.user-permission-dialog input,
    .mud-dialog.user-permission-dialog textarea,
    .mud-dialog.user-permission-dialog .mud-input-slot,
    .mud-dialog.user-permission-dialog .mud-select-input,
    .mud-dialog.user-permission-dialog .mud-input-adornment,
    .mud-dialog.user-permission-dialog .mud-checkbox .mud-typography,
    .mud-dialog.user-permission-dialog .mud-switch .mud-typography,
    .mud-dialog.user-admin-dialog .mud-input-label,
    .mud-dialog.user-admin-dialog input,
    .mud-dialog.user-admin-dialog textarea,
    .mud-dialog.user-admin-dialog .mud-input-slot,
    .mud-dialog.user-admin-dialog .mud-select-input,
    .mud-dialog.user-admin-dialog .mud-input-adornment
) {
    color: var(--dm-text) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .mud-dialog.user-permission-dialog .state-copy.active,
    .mud-dialog.user-admin-dialog .state-copy.active
),
body.dark-mode :is(
    .mud-dialog.user-permission-dialog .state-copy.active,
    .mud-dialog.user-admin-dialog .state-copy.active
) {
    color: #8ee6c4 !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .mud-dialog.user-permission-dialog .state-copy.inactive,
    .mud-dialog.user-admin-dialog .state-copy.inactive
),
body.dark-mode :is(
    .mud-dialog.user-permission-dialog .state-copy.inactive,
    .mud-dialog.user-admin-dialog .state-copy.inactive
) {
    color: #ff9baa !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .mud-dialog.user-permission-dialog .dialog-primary-action,
    .mud-dialog.user-permission-dialog .mud-button-filled-primary,
    .mud-dialog.user-admin-dialog .mud-button-filled-primary
),
body.dark-mode :is(
    .mud-dialog.user-permission-dialog .dialog-primary-action,
    .mud-dialog.user-permission-dialog .mud-button-filled-primary,
    .mud-dialog.user-admin-dialog .mud-button-filled-primary
) {
    background: #ded7ff !important;
    background-color: #ded7ff !important;
    border-color: #ded7ff !important;
    color: #3520b7 !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: none !important;
}

html.dark-mode body :is(
    .mud-dialog.user-permission-dialog .dialog-secondary-action,
    .mud-dialog.user-permission-dialog .mud-button-text,
    .mud-dialog.user-permission-dialog .mud-button-outlined,
    .mud-dialog.user-admin-dialog .mud-button-text,
    .mud-dialog.user-admin-dialog .mud-button-outlined
),
body.dark-mode :is(
    .mud-dialog.user-permission-dialog .dialog-secondary-action,
    .mud-dialog.user-permission-dialog .mud-button-text,
    .mud-dialog.user-permission-dialog .mud-button-outlined,
    .mud-dialog.user-admin-dialog .mud-button-text,
    .mud-dialog.user-admin-dialog .mud-button-outlined
) {
    background: #111a2b !important;
    background-color: #111a2b !important;
    border: 1px solid #334155 !important;
    color: #d8e0ff !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: none !important;
}

html.dark-mode body :is(
    .mud-dialog.user-permission-dialog button.mud-button-root *,
    .mud-dialog.user-admin-dialog button.mud-button-root *
),
body.dark-mode :is(
    .mud-dialog.user-permission-dialog button.mud-button-root *,
    .mud-dialog.user-admin-dialog button.mud-button-root *
) {
    color: inherit !important;
    -webkit-text-fill-color: currentColor !important;
}

/* Feature Request manage dialog and request timeline final contrast pass. */
html.dark-mode body :is(.modern-dialog.manage-dialog, .mud-dialog .modern-dialog.manage-dialog),
body.dark-mode :is(.modern-dialog.manage-dialog, .mud-dialog .modern-dialog.manage-dialog) {
    background: #101827 !important;
    background-color: #101827 !important;
    background-image: none !important;
    border: 1px solid #2a3850 !important;
    color: var(--dm-text) !important;
    box-shadow: 0 22px 54px rgba(0, 0, 0, 0.42) !important;
}

html.dark-mode body :is(.manage-dialog .dialog-header),
body.dark-mode :is(.manage-dialog .dialog-header) {
    background:
        linear-gradient(90deg, #8da2ff 0 22%, #5fd6a6 22% 40%, #7cc7f4 40% 60%, #c5b5ff 60% 78%, #f18b99 78% 100%) top / 100% 5px no-repeat,
        linear-gradient(135deg, #131d30 0%, #101827 62%, #172033 100%) !important;
    border-bottom: 1px solid #263449 !important;
    color: var(--dm-text) !important;
}

html.dark-mode body :is(
    .manage-dialog .dialog-body,
    .manage-dialog .dialog-footer,
    .manage-dialog .info-card,
    .manage-dialog .card-header,
    .manage-dialog .card-body,
    .manage-dialog .management-section,
    .manage-dialog .convert-section,
    .manage-dialog .convert-btn,
    .manage-dialog .user-chip
),
body.dark-mode :is(
    .manage-dialog .dialog-body,
    .manage-dialog .dialog-footer,
    .manage-dialog .info-card,
    .manage-dialog .card-header,
    .manage-dialog .card-body,
    .manage-dialog .management-section,
    .manage-dialog .convert-section,
    .manage-dialog .convert-btn,
    .manage-dialog .user-chip
) {
    background: #172033 !important;
    background-color: #172033 !important;
    background-image: none !important;
    border-color: #334155 !important;
    color: var(--dm-text) !important;
    box-shadow: none !important;
}

html.dark-mode body :is(.manage-dialog .dialog-footer),
body.dark-mode :is(.manage-dialog .dialog-footer) {
    background: #0d1523 !important;
    background-color: #0d1523 !important;
    border-top: 1px solid #263449 !important;
}

html.dark-mode body :is(
    .manage-dialog .overview-pill,
    .manage-dialog .overview-pill.optional,
    .manage-dialog .conversion-banner,
    .manage-dialog .warning-banner
),
body.dark-mode :is(
    .manage-dialog .overview-pill,
    .manage-dialog .overview-pill.optional,
    .manage-dialog .conversion-banner,
    .manage-dialog .warning-banner
) {
    background: rgba(141, 162, 255, 0.14) !important;
    background-color: rgba(141, 162, 255, 0.14) !important;
    background-image: none !important;
    border: 1px solid rgba(141, 162, 255, 0.28) !important;
    color: var(--dm-primary-strong) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .manage-dialog .header-content h2,
    .manage-dialog .detail-value.title,
    .manage-dialog .detail-value,
    .manage-dialog .date-value,
    .manage-dialog .management-section h3,
    .manage-dialog .convert-section h3,
    .manage-dialog .convert-btn-title,
    .manage-dialog .user-option,
    .manage-dialog .user-chip,
    .requests-container .timeline-month,
    .requests-container .request-title,
    .requests-container .gantt-label-col,
    .requests-container .gantt-day-header .day-num,
    .requests-container .timeline-legend,
    .requests-container .timeline-legend span,
    .requests-container .timeline-legend .legend-text
),
body.dark-mode :is(
    .manage-dialog .header-content h2,
    .manage-dialog .detail-value.title,
    .manage-dialog .detail-value,
    .manage-dialog .date-value,
    .manage-dialog .management-section h3,
    .manage-dialog .convert-section h3,
    .manage-dialog .convert-btn-title,
    .manage-dialog .user-option,
    .manage-dialog .user-chip,
    .requests-container .timeline-month,
    .requests-container .request-title,
    .requests-container .gantt-label-col,
    .requests-container .gantt-day-header .day-num,
    .requests-container .timeline-legend,
    .requests-container .timeline-legend span,
    .requests-container .timeline-legend .legend-text
) {
    color: var(--dm-text-strong) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .manage-dialog .header-content p,
    .manage-dialog .detail-label,
    .manage-dialog .form-label,
    .manage-dialog .convert-desc,
    .manage-dialog .convert-btn-desc,
    .manage-dialog .unassigned-option,
    .requests-container .gantt-day-header .day-name,
    .requests-container .timeline-legend .legend-label
),
body.dark-mode :is(
    .manage-dialog .header-content p,
    .manage-dialog .detail-label,
    .manage-dialog .form-label,
    .manage-dialog .convert-desc,
    .manage-dialog .convert-btn-desc,
    .manage-dialog .unassigned-option,
    .requests-container .gantt-day-header .day-name,
    .requests-container .timeline-legend .legend-label
) {
    color: var(--dm-text-muted) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .manage-dialog .mud-input-root,
    .manage-dialog .mud-input-outlined,
    .manage-dialog .mud-select-input,
    .manage-dialog .mud-input-slot
),
body.dark-mode :is(
    .manage-dialog .mud-input-root,
    .manage-dialog .mud-input-outlined,
    .manage-dialog .mud-select-input,
    .manage-dialog .mud-input-slot
) {
    background: #0d1523 !important;
    background-color: #0d1523 !important;
    border-color: #334155 !important;
    color: var(--dm-text) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(.manage-dialog .mud-input-outlined fieldset),
body.dark-mode :is(.manage-dialog .mud-input-outlined fieldset) {
    border-color: #334155 !important;
}

html.dark-mode body :is(.manage-dialog .btn-secondary),
body.dark-mode :is(.manage-dialog .btn-secondary) {
    background: #111a2b !important;
    background-color: #111a2b !important;
    border-color: #334155 !important;
    color: #d8e0ff !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(.manage-dialog .btn-primary),
body.dark-mode :is(.manage-dialog .btn-primary) {
    background: #ded7ff !important;
    background-color: #ded7ff !important;
    border-color: #ded7ff !important;
    color: #3520b7 !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: none !important;
}

html.dark-mode body :is(.manage-dialog .btn-danger),
body.dark-mode :is(.manage-dialog .btn-danger) {
    background: rgba(241, 139, 153, 0.16) !important;
    background-color: rgba(241, 139, 153, 0.16) !important;
    border-color: rgba(241, 139, 153, 0.38) !important;
    color: #ffb5bf !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(.requests-container .timeline-view),
body.dark-mode :is(.requests-container .timeline-view) {
    background: #101827 !important;
    background-color: #101827 !important;
    color: var(--dm-text) !important;
}

html.dark-mode body :is(
    .requests-container .timeline-controls,
    .requests-container .gantt-container,
    .requests-container .gantt-header,
    .requests-container .gantt-row,
    .requests-container .gantt-label-col,
    .requests-container .gantt-timeline-col,
    .requests-container .gantt-day-header,
    .requests-container .gantt-cell,
    .requests-container .timeline-legend
),
body.dark-mode :is(
    .requests-container .timeline-controls,
    .requests-container .gantt-container,
    .requests-container .gantt-header,
    .requests-container .gantt-row,
    .requests-container .gantt-label-col,
    .requests-container .gantt-timeline-col,
    .requests-container .gantt-day-header,
    .requests-container .gantt-cell,
    .requests-container .timeline-legend
) {
    background: #172033 !important;
    background-color: #172033 !important;
    border-color: #334155 !important;
    color: var(--dm-text) !important;
}

html.dark-mode body :is(
    .requests-container .gantt-day-header.weekend,
    .requests-container .gantt-cell.weekend
),
body.dark-mode :is(
    .requests-container .gantt-day-header.weekend,
    .requests-container .gantt-cell.weekend
) {
    background: #111a2b !important;
    background-color: #111a2b !important;
}

html.dark-mode body :is(
    .requests-container .gantt-day-header.today,
    .requests-container .gantt-cell.today
),
body.dark-mode :is(
    .requests-container .gantt-day-header.today,
    .requests-container .gantt-cell.today
) {
    background: #1b2b46 !important;
    background-color: #1b2b46 !important;
}

html.dark-mode body :is(.requests-container .gantt-day-header.today .day-num),
body.dark-mode :is(.requests-container .gantt-day-header.today .day-num) {
    color: #9fc5ff !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(.requests-container .gantt-row:hover, .requests-container .gantt-row .gantt-label-col:hover),
body.dark-mode :is(.requests-container .gantt-row:hover, .requests-container .gantt-row .gantt-label-col:hover) {
    background: #1d283b !important;
    background-color: #1d283b !important;
}

html.dark-mode body :is(.requests-container .nav-btn, .requests-container .today-btn),
body.dark-mode :is(.requests-container .nav-btn, .requests-container .today-btn) {
    background: #111a2b !important;
    background-color: #111a2b !important;
    border-color: #334155 !important;
    color: #d8e0ff !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(.requests-container .bar-label),
body.dark-mode :is(.requests-container .bar-label) {
    color: #ffffff !important;
    -webkit-text-fill-color: currentColor !important;
}

/* Daily update dialogs: create, edit, detail, and reports. */
html.dark-mode body :is(.daily-dialog, .mud-dialog .daily-dialog),
body.dark-mode :is(.daily-dialog, .mud-dialog .daily-dialog) {
    background: #101827 !important;
    background-color: #101827 !important;
    background-image: none !important;
    border: 1px solid #2a3850 !important;
    color: var(--dm-text) !important;
    box-shadow: 0 22px 54px rgba(0, 0, 0, 0.42) !important;
}

html.dark-mode body :is(.daily-dialog .dialog-header),
body.dark-mode :is(.daily-dialog .dialog-header) {
    background:
        linear-gradient(90deg, #8da2ff 0 22%, #5fd6a6 22% 40%, #7cc7f4 40% 60%, #c5b5ff 60% 78%, #f18b99 78% 100%) top / 100% 5px no-repeat,
        linear-gradient(135deg, #131d30 0%, #101827 62%, #172033 100%) !important;
    border-bottom: 1px solid #263449 !important;
    color: var(--dm-text) !important;
}

html.dark-mode body :is(.daily-dialog .header-icon),
body.dark-mode :is(.daily-dialog .header-icon) {
    background: rgba(141, 162, 255, 0.16) !important;
    background-color: rgba(141, 162, 255, 0.16) !important;
    color: var(--dm-primary-strong) !important;
}

html.dark-mode body :is(
    .daily-dialog .dialog-body,
    .daily-dialog .dialog-footer,
    .daily-dialog .form-section,
    .daily-dialog .date-section,
    .daily-dialog .obstacles-section,
    .daily-dialog .entry-card,
    .daily-dialog .report-toolbar,
    .daily-dialog .status-panel,
    .daily-dialog .report-board,
    .daily-dialog .report-kpi,
    .daily-dialog .project-entry,
    .daily-dialog .summary-chip,
    .daily-dialog .empty-results
),
body.dark-mode :is(
    .daily-dialog .dialog-body,
    .daily-dialog .dialog-footer,
    .daily-dialog .form-section,
    .daily-dialog .date-section,
    .daily-dialog .obstacles-section,
    .daily-dialog .entry-card,
    .daily-dialog .report-toolbar,
    .daily-dialog .status-panel,
    .daily-dialog .report-board,
    .daily-dialog .report-kpi,
    .daily-dialog .project-entry,
    .daily-dialog .summary-chip,
    .daily-dialog .empty-results
) {
    background: #172033 !important;
    background-color: #172033 !important;
    background-image: none !important;
    border-color: #334155 !important;
    color: var(--dm-text) !important;
    box-shadow: none !important;
}

html.dark-mode body :is(.daily-dialog .dialog-footer),
body.dark-mode :is(.daily-dialog .dialog-footer) {
    background: #0d1523 !important;
    background-color: #0d1523 !important;
    border-top: 1px solid #263449 !important;
}

html.dark-mode body :is(
    .daily-dialog .report-board-header,
    .daily-dialog .report-board-row
),
body.dark-mode :is(
    .daily-dialog .report-board-header,
    .daily-dialog .report-board-row
) {
    background: #111a2b !important;
    background-color: #111a2b !important;
    border-color: #263449 !important;
    color: var(--dm-text) !important;
}

html.dark-mode body :is(.daily-dialog .report-board-row:hover),
body.dark-mode :is(.daily-dialog .report-board-row:hover) {
    background: #1d283b !important;
    background-color: #1d283b !important;
}

html.dark-mode body :is(
    .daily-dialog .report-kpi.posted,
    .daily-dialog .report-kpi.missing,
    .daily-dialog .report-kpi.late,
    .daily-dialog .report-kpi.progress,
    .daily-dialog .summary-chip,
    .daily-dialog .request-work-row,
    .daily-dialog .section-count
),
body.dark-mode :is(
    .daily-dialog .report-kpi.posted,
    .daily-dialog .report-kpi.missing,
    .daily-dialog .report-kpi.late,
    .daily-dialog .report-kpi.progress,
    .daily-dialog .summary-chip,
    .daily-dialog .request-work-row,
    .daily-dialog .section-count
) {
    background: rgba(141, 162, 255, 0.13) !important;
    background-color: rgba(141, 162, 255, 0.13) !important;
    border-color: rgba(141, 162, 255, 0.28) !important;
    color: var(--dm-primary-strong) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .daily-dialog .missing-user-chip,
    .daily-dialog .late-badge,
    .daily-dialog .obstacles-box,
    .daily-dialog .blocker-note,
    .daily-dialog .project-entry-late
),
body.dark-mode :is(
    .daily-dialog .missing-user-chip,
    .daily-dialog .late-badge,
    .daily-dialog .obstacles-box,
    .daily-dialog .blocker-note,
    .daily-dialog .project-entry-late
) {
    background: rgba(241, 139, 153, 0.14) !important;
    background-color: rgba(241, 139, 153, 0.14) !important;
    border-color: rgba(241, 139, 153, 0.36) !important;
    color: #ffb5bf !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .daily-dialog .header-content h2,
    .daily-dialog .form-label,
    .daily-dialog .progress-value,
    .daily-dialog .kpi-value,
    .daily-dialog .section-title,
    .daily-dialog .date-cell strong,
    .daily-dialog .work-cell strong,
    .daily-dialog .person-cell,
    .daily-dialog .summary-cell,
    .daily-dialog .project-name,
    .daily-dialog .entry-description,
    .daily-dialog .obstacles-box p,
    .daily-dialog .empty-results p
),
body.dark-mode :is(
    .daily-dialog .header-content h2,
    .daily-dialog .form-label,
    .daily-dialog .progress-value,
    .daily-dialog .kpi-value,
    .daily-dialog .section-title,
    .daily-dialog .date-cell strong,
    .daily-dialog .work-cell strong,
    .daily-dialog .person-cell,
    .daily-dialog .summary-cell,
    .daily-dialog .project-name,
    .daily-dialog .entry-description,
    .daily-dialog .obstacles-box p,
    .daily-dialog .empty-results p
) {
    color: var(--dm-text-strong) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .daily-dialog .header-content p,
    .daily-dialog .field-hint,
    .daily-dialog .kpi-label,
    .daily-dialog .section-subtitle,
    .daily-dialog .date-cell span,
    .daily-dialog .work-cell span,
    .daily-dialog .status-cell span,
    .daily-dialog .missing-more,
    .daily-dialog .progress-caption,
    .daily-dialog .entry-time
),
body.dark-mode :is(
    .daily-dialog .header-content p,
    .daily-dialog .field-hint,
    .daily-dialog .kpi-label,
    .daily-dialog .section-subtitle,
    .daily-dialog .date-cell span,
    .daily-dialog .work-cell span,
    .daily-dialog .status-cell span,
    .daily-dialog .missing-more,
    .daily-dialog .progress-caption,
    .daily-dialog .entry-time
) {
    color: var(--dm-text-muted) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(
    .daily-dialog .mud-input-root,
    .daily-dialog .mud-input-outlined,
    .daily-dialog .mud-select-input,
    .daily-dialog .mud-picker-input,
    .daily-dialog .mud-input-slot,
    .daily-dialog input,
    .daily-dialog textarea
),
body.dark-mode :is(
    .daily-dialog .mud-input-root,
    .daily-dialog .mud-input-outlined,
    .daily-dialog .mud-select-input,
    .daily-dialog .mud-picker-input,
    .daily-dialog .mud-input-slot,
    .daily-dialog input,
    .daily-dialog textarea
) {
    background: #0d1523 !important;
    background-color: #0d1523 !important;
    border-color: #334155 !important;
    color: var(--dm-text) !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: none !important;
}

html.dark-mode body :is(.daily-dialog .mud-input-outlined fieldset),
body.dark-mode :is(.daily-dialog .mud-input-outlined fieldset) {
    border-color: #334155 !important;
}

html.dark-mode body :is(.daily-dialog .entry-divider),
body.dark-mode :is(.daily-dialog .entry-divider) {
    background: linear-gradient(90deg, transparent, #334155 20%, #334155 80%, transparent) !important;
}

html.dark-mode body :is(.daily-dialog .progress-track),
body.dark-mode :is(.daily-dialog .progress-track) {
    background: #111a2b !important;
    background-color: #111a2b !important;
    border-radius: 999px !important;
}

html.dark-mode body :is(.daily-dialog .close-btn, .daily-dialog .btn-secondary, .daily-dialog .btn-outline, .daily-dialog .btn-ghost, .daily-dialog .add-entry-btn),
body.dark-mode :is(.daily-dialog .close-btn, .daily-dialog .btn-secondary, .daily-dialog .btn-outline, .daily-dialog .btn-ghost, .daily-dialog .add-entry-btn) {
    background: #111a2b !important;
    background-color: #111a2b !important;
    border-color: #334155 !important;
    color: #d8e0ff !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: none !important;
}

html.dark-mode body :is(.daily-dialog .btn-primary),
body.dark-mode :is(.daily-dialog .btn-primary) {
    background: #ded7ff !important;
    background-color: #ded7ff !important;
    border-color: #ded7ff !important;
    color: #3520b7 !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: none !important;
}

html.dark-mode body :is(.daily-dialog .btn-primary *, .daily-dialog .btn-secondary *, .daily-dialog .btn-outline *, .daily-dialog .btn-ghost *),
body.dark-mode :is(.daily-dialog .btn-primary *, .daily-dialog .btn-secondary *, .daily-dialog .btn-outline *, .daily-dialog .btn-ghost *) {
    color: inherit !important;
    -webkit-text-fill-color: currentColor !important;
}

/* Compliance / Office License table */
html.dark-mode body .office-license-tab-container {
    --comp-bg: var(--dm-bg);
    --comp-surface: var(--dm-surface);
    --comp-surface-soft: var(--dm-surface-2);
    --comp-ink: var(--dm-text-strong);
    --comp-muted: var(--dm-text-muted);
    --comp-line: var(--dm-border);
    --comp-line-soft: rgba(148, 163, 184, 0.18);
    --comp-primary-soft: rgba(141, 162, 255, 0.16);
    --comp-blue-soft: rgba(124, 199, 244, 0.14);
    --comp-green-soft: rgba(95, 214, 166, 0.14);
    --comp-yellow-soft: rgba(231, 197, 111, 0.14);
    --comp-red-soft: rgba(241, 139, 153, 0.14);
    --comp-purple-soft: rgba(197, 181, 255, 0.14);
    --comp-orange-soft: rgba(232, 178, 122, 0.14);
    color: var(--dm-text) !important;
}

html.dark-mode body .office-license-tab-container :is(
    .location-selector-container,
    .office-summary-bar,
    .office-license-board,
    .office-summary-pill,
    .office-license-table-wrap
) {
    background: var(--dm-surface) !important;
    background-color: var(--dm-surface) !important;
    background-image: none !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
    box-shadow: var(--dm-shadow) !important;
}

html.dark-mode body .office-license-tab-container :is(
    .office-board-header,
    .office-license-table,
    .office-license-table thead,
    .office-license-table tbody,
    .office-license-table tr
) {
    background: var(--dm-surface) !important;
    background-color: var(--dm-surface) !important;
    background-image: none !important;
    color: var(--dm-text) !important;
}

html.dark-mode body .office-license-tab-container .office-license-table th {
    background: var(--dm-input) !important;
    background-color: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text-muted) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body .office-license-tab-container .office-license-table td {
    background: var(--dm-surface) !important;
    background-color: var(--dm-surface) !important;
    border-color: rgba(148, 163, 184, 0.18) !important;
    color: var(--dm-text) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body .office-license-tab-container .office-license-table tbody tr:nth-child(even) td {
    background: var(--dm-surface-2) !important;
    background-color: var(--dm-surface-2) !important;
}

html.dark-mode body .office-license-tab-container .office-record-row:hover td {
    background: #1E293B !important;
    background-color: #1E293B !important;
}

html.dark-mode body .office-license-tab-container :is(
    .office-title,
    .office-board-title,
    .summary-value,
    .office-record-name,
    .office-table-value
) {
    color: var(--dm-text-strong) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body .office-license-tab-container :is(
    .office-subtitle,
    .office-board-subtitle,
    .summary-label,
    .office-record-type,
    .office-table-value.muted
) {
    color: var(--dm-text-muted) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body .office-license-tab-container :is(.office-record-icon, .office-title-icon) {
    background: var(--dm-primary-surface) !important;
    background-color: var(--dm-primary-surface) !important;
    color: var(--dm-primary-strong) !important;
    box-shadow: none !important;
}

html.dark-mode body .office-license-tab-container .office-pdf-pill.attached {
    background: rgba(95, 214, 166, 0.16) !important;
    color: #9be8c7 !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body .office-license-tab-container .office-pdf-pill.missing {
    background: rgba(231, 197, 111, 0.16) !important;
    color: #f2d995 !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body .office-license-tab-container .office-pdf-pill.not-applicable {
    background: var(--dm-input) !important;
    color: var(--dm-text-muted) !important;
    -webkit-text-fill-color: currentColor !important;
}

/* Compliance / AG Motors vehicles grid */
html.dark-mode body .ag-motors-tab-container .ag-motors-subtabs .ag-grid-vehicles,
html.dark-mode body .ag-motors-tab-container .ag-motors-subtabs .ag-grid-vehicles :is(
    .mud-table,
    .mud-data-grid,
    .mud-data-grid-table,
    .mud-table-container,
    tbody,
    tr
) {
    background: var(--dm-surface) !important;
    background-color: var(--dm-surface) !important;
    background-image: none !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}

html.dark-mode body .ag-motors-tab-container .ag-motors-subtabs .ag-grid-vehicles :is(
    .mud-table-head,
    .mud-table-head .mud-table-cell,
    .mud-data-grid-header,
    .mud-data-grid-header-cell,
    thead,
    th
) {
    background: var(--dm-input) !important;
    background-color: var(--dm-input) !important;
    background-image: none !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text-muted) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body .ag-motors-tab-container .ag-motors-subtabs .ag-grid-vehicles :is(.mud-table-cell, td) {
    background: transparent !important;
    background-color: transparent !important;
    border-color: var(--dm-border-soft) !important;
    color: var(--dm-text) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body .ag-motors-tab-container .ag-motors-subtabs .ag-grid-vehicles :is(.mud-table-row:hover .mud-table-cell, tr:hover td) {
    background: var(--dm-surface-2) !important;
    background-color: var(--dm-surface-2) !important;
}

html.dark-mode body .ag-motors-tab-container .ag-motors-subtabs .ag-grid-vehicles :is(
    .cell-icon,
    .cell-icon-sm,
    .action-buttons
) {
    background: var(--dm-input) !important;
    background-color: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-primary-strong) !important;
    box-shadow: none !important;
}

/* Public support-ticket portal */
html.dark-mode body .stf-shell {
    background: radial-gradient(circle at top left, rgba(141, 162, 255, 0.12), transparent 30%),
        var(--dm-bg) !important;
    background-color: var(--dm-bg) !important;
    color: var(--dm-text) !important;
}

html.dark-mode body :is(.stf-panel, .stf-history-panel) {
    background: var(--dm-surface) !important;
    background-color: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.36) !important;
}

html.dark-mode body :is(.stf-request-type, .stf-history-empty, .stf-history-loading, .stf-thread-empty, .stf-closed-note, .stf-ticket-detail, .stf-detail-description, .stf-thread-note, .stf-rating-panel, .stf-rating-done) {
    background: var(--dm-surface-2) !important;
    background-color: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}

html.dark-mode body :is(.stf-header h1, .stf-state h1, .stf-history-header h2, .stf-mode-option strong, .stf-card-title, .stf-detail-heading h3, .stf-detail-list dd, .stf-thread-note strong, .stf-thread h4, .stf-reply-form label, .stf-rating-panel h4, .stf-rating-done, .stf-field label) {
    color: var(--dm-text-strong) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(.stf-header p, .stf-state p, .stf-mode-option span, .stf-card-meta, .stf-detail-list dt, .stf-thread-note span, .stf-thread-note p, .stf-history-empty, .stf-history-loading, .stf-thread-empty, .stf-closed-note) {
    color: var(--dm-text-muted) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(.stf-kicker, .stf-request-type-heading strong, .stf-card-topline strong, .stf-detail-number, .stf-link-button) {
    color: var(--dm-blue) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body .stf-request-type-heading span {
    color: var(--dm-text-strong) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(.stf-mode-option, .stf-page-button) {
    background: var(--dm-input) !important;
    background-color: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}

html.dark-mode body .stf-mode-option-active {
    background: rgba(248, 113, 113, 0.13) !important;
    background-color: rgba(248, 113, 113, 0.13) !important;
    border-color: #f18b99 !important;
    box-shadow: 0 0 0 2px rgba(241, 139, 153, 0.2) !important;
}

html.dark-mode body .stf-mode-option-active strong {
    color: #ffd2d8 !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body :is(.stf-input, .stf-select, .stf-textarea) {
    background: var(--dm-input) !important;
    background-color: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text-strong) !important;
    -webkit-text-fill-color: currentColor !important;
    caret-color: var(--dm-text-strong) !important;
    box-shadow: none !important;
}

html.dark-mode body .stf-select {
    background-image: linear-gradient(45deg, transparent 50%, var(--dm-text-muted) 50%),
        linear-gradient(135deg, var(--dm-text-muted) 50%, transparent 50%) !important;
}

html.dark-mode body :is(.stf-input, .stf-select, .stf-textarea):focus {
    border-color: var(--dm-primary) !important;
    box-shadow: 0 0 0 3px rgba(141, 162, 255, 0.2) !important;
}

html.dark-mode body :is(.stf-input::placeholder, .stf-textarea::placeholder) {
    color: var(--dm-text-soft) !important;
    -webkit-text-fill-color: var(--dm-text-soft) !important;
    opacity: 1 !important;
}

html.dark-mode body .stf-select option {
    background: var(--dm-input) !important;
    color: var(--dm-text-strong) !important;
}

html.dark-mode body .stf-input-error {
    border-color: #f18b99 !important;
    box-shadow: 0 0 0 2px rgba(241, 139, 153, 0.18) !important;
}

html.dark-mode body .stf-error-text {
    color: #f8a8b3 !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body .stf-history-header,
html.dark-mode body .stf-ticket-detail {
    border-color: var(--dm-border) !important;
}

html.dark-mode body .stf-ticket-card {
    background: var(--dm-input) !important;
    background-color: var(--dm-input) !important;
    border-color: var(--dm-border) !important;
}

html.dark-mode body :is(.stf-ticket-card:hover, .stf-ticket-card-active) {
    border-color: var(--dm-primary) !important;
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.28) !important;
}

html.dark-mode body .stf-button-primary {
    background: #cf2f3a !important;
    background-color: #cf2f3a !important;
    color: #ffffff !important;
    -webkit-text-fill-color: currentColor !important;
}

html.dark-mode body .stf-button-secondary {
    background: var(--dm-primary-surface) !important;
    background-color: var(--dm-primary-surface) !important;
    border: 1px solid rgba(141, 162, 255, 0.28) !important;
    color: #d8e0ff !important;
    -webkit-text-fill-color: currentColor !important;
}

html.login-page:not(.auth-login-page),
html.login-page:not(.auth-login-page) body {
    color-scheme: light !important;
}

html.auth-login-page,
html.auth-login-page body {
    background: #070b14 !important;
    color: #f8fafc !important;
    color-scheme: dark !important;
}