/**********************************
Dark Theme Overlay
Activates only when is set.
No changes to individual page files required.
***********************************/
:root[data-theme="dark"] {
--primary-color: #6699cc;
--bg-primary: #1e1e2e;
--bg-secondary: #2a2a3c;
--bg-tertiary: #363649;
--card-bg: #2f2f42;
--bg-overlay: #000000;
--text-primary: #e0e0e0;
--text-secondary: #b0b0b0;
--text-inverse: #1e1e2e;
--link-color: #6eb5ff;
--link-color-nav: #6eb5ff;
--border-color: #4a4a5e;
--highlight-color: #2d5480;
--warning-color: #FDD017;
--grid-header-bg: #444460;
--grid-header-text: #8ab4f8;
--menu-bg: #2a2a3c;
--menu-text: #e0e0e0;
--menu-hover-bg: #4a4a5e;
--menu-hover-text: #ffffff;
--disabled-bg: #383850;
--disabled-text: #707080;
--shadow-color: #000;
--banner-bg: #2a2a3c;
--error-color: #ff6b6b;
--combo-border: #4a4a5e;
--input-focus: #6eb5ff;
--input-border-color: #555570;
--input-focus-glow: rgba(110, 181, 255, 0.25);
--grid-hover-bg: #4a4a5e;
--grid-border: #5a5a6e;
--control-chrome-bg: #3a3a4e;
--control-chrome-border: #5a5a6e;
--accent-color: #4a9fd8;
color-scheme: dark;
}
/* Base element overrides for dark mode */
:root[data-theme="dark"] {
background-color: var(--bg-primary);
}
:root[data-theme="dark"] body {
background-color: var(--bg-primary);
color: var(--text-primary);
}
:root[data-theme="dark"] form {
background-color: var(--bg-primary);
color: var(--text-primary);
}
/* Hidden download iframe — prevent white dot from inner document default bg */
:root[data-theme="dark"] iframe#hiddenDocGetter {
opacity: 0 !important;
}
/* Layout table cells — match page background so gaps between
card bottom and cell bottom are invisible on tall layouts */
:root[data-theme="dark"] td#ContentPane,
:root[data-theme="dark"] td#LeftPane {
background-color: var(--bg-primary) !important;
}
/* ContentPane inside a card is an error iframe container, not a layout cell */
:root[data-theme="dark"] .UcsCard td#ContentPane,
:root[data-theme="dark"] .ReyCard td#ContentPane {
background-color: inherit !important;
}
/* Card backgrounds — slightly lighter than inputs so enabled inputs
appear recessed/inset and disabled inputs are more distinct.
Redefine --bg-secondary inside card scope so all light-theme rules
that use var(--bg-secondary) on TDs automatically match the card bg. */
:root[data-theme="dark"] .UcsCard,
:root[data-theme="dark"] .ReyCard {
--bg-secondary: var(--card-bg);
background-color: var(--card-bg) !important;
}
/* Inputs inside cards — restore the darker bg so they appear inset.
Exclude Selectize inner inputs and disabled controls. */
:root[data-theme="dark"] .UcsCard input:not(.copy-button):not(.ruButton):not([type="radio"]):not([type="checkbox"]):not([type="image"]):not([type="hidden"]):not([type="file"]):not([id$="-selectized"]):not([disabled]):not([style*="background-color:Transparent"]):not([style*="background-color: transparent"]),
:root[data-theme="dark"] .UcsCard select:not([disabled]),
:root[data-theme="dark"] .UcsCard textarea:not([disabled]),
:root[data-theme="dark"] .ReyCard input:not(.copy-button):not(.ruButton):not([type="radio"]):not([type="checkbox"]):not([type="image"]):not([type="hidden"]):not([type="file"]):not([id$="-selectized"]):not([disabled]):not([style*="background-color:Transparent"]):not([style*="background-color: transparent"]),
:root[data-theme="dark"] .ReyCard select:not([disabled]),
:root[data-theme="dark"] .ReyCard textarea:not([disabled]) {
background-color: #2a2a3c !important;
}
/* Title bar links — white text to match light mode and work on all
primary color backgrounds (darkred, green, blue) */
:root[data-theme="dark"] .UcsCard .Title a,
:root[data-theme="dark"] .UcsCard .Title a:visited,
:root[data-theme="dark"] .ReyCard .Title a,
:root[data-theme="dark"] .ReyCard .Title a:visited {
color: #ffffff !important;
}
/* AEX panel body — hardcoded #f9f9f9 in LMS */
:root[data-theme="dark"] .aex-body {
background-color: var(--bg-secondary) !important;
}
/* UcsGrid table border — override inline border-color:Black */
:root[data-theme="dark"] .UcsGrid {
border-color: var(--border-color) !important;
}
/* Grid header bottom border — structural divider for accessibility */
:root[data-theme="dark"] .UcsGrid .Header TD,
:root[data-theme="dark"] .UcsGrid TD.Header {
border-color: #6a6a80 !important;
border-bottom: 2px solid #6a6a80 !important;
}
/*
inside UcsGrid header cells (User Setup > Home, Portal Settings, etc.)
— default browser hr is bright white in dark mode. */
:root[data-theme="dark"] .UcsGrid hr {
border: 0 !important;
border-top: 1px solid #6a6a80 !important;
background-color: transparent !important;
color: #6a6a80 !important;
}
/* PMG Project Inbox inner Task/Test sub-rows — InboxProject.ascx hardcodes
inline `background-color: #DCDCDC` on every TD in both AlternatingItemTemplates,
plus an embedded `