/* The existing skin is the default. Preference is restored before page rendering. */
.portal-shell #topNav .portal-skin-toggle {
  order: 4; flex: 0 0 auto; width: auto; height: 30px; padding: 3px; gap: 3px;
  margin: 0 0 0 8px; border: 0; border-radius: 18px;
  background: #30353a; color: #969da3; display: inline-flex;
  align-items: center; justify-content: center;
}
html[data-portal-skin="dark"] .portal-shell #topNav .portal-skin-toggle { background: #3d444b; }
.portal-shell #topNav .portal-skin-toggle svg { width: 15px; height: 15px; flex-shrink: 0; }
.portal-shell #topNav .portal-skin-toggle button { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 24px; width: 24px; height: 24px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: #969da3; cursor: pointer; }
.portal-shell #topNav .portal-skin-toggle button[aria-pressed="true"] { background: #fff; color: #4d4d4d; }
.portal-shell #topNav .portal-skin-toggle button:hover { color: #d6dce1; }
.portal-shell #topNav .portal-skin-toggle button[aria-pressed="true"]:hover { color: #333; }
.portal-shell #topNav .portal-skin-toggle button:focus-visible { outline: 2px solid #f07057; outline-offset: 2px; }

/* Compact pill switches share dimensions across image and background controls. */
.portal-shell :is(img, input[type="image"])[src*="/assets/img/Controls/toggle-" i],
.portal-shell [style*="/assets/img/Controls/toggle-" i] { width: 44.72px !important; height: 22.36px !important; background-size: 44.72px 22.36px !important; background-repeat: no-repeat; }
/* The User and SCIM rights lists retain the smaller toggle size. */
.portal-shell .portal-rights-panel :is(img, input[type="image"])[src*="/assets/img/Controls/toggle-" i],
.portal-shell .portal-rights-panel [style*="/assets/img/Controls/toggle-" i] { width: 39.56px !important; height: 19.78px !important; background-size: 39.56px 19.78px !important; }
.portal-shell :is(img, input[type="image"])[src*="/assets/img/Controls/toggle-on.svg" i] { content: url('/assets/img/Controls/toggle-on.svg?v=20261005-circle-toggles'); }
.portal-shell [style*="/assets/img/Controls/toggle-on.svg" i] { background-image: url('/assets/img/Controls/toggle-on.svg?v=20261005-circle-toggles') !important; }
.portal-shell :is(img, input[type="image"])[src*="/assets/img/Controls/toggle-off.svg" i] { content: url('/assets/img/Controls/toggle-off.svg?v=20261005-circle-toggles'); }
.portal-shell [style*="/assets/img/Controls/toggle-off.svg" i] { background-image: url('/assets/img/Controls/toggle-off.svg?v=20261005-circle-toggles') !important; }

@media screen {
  html[data-portal-skin="dark"] .portal-workspace .portal-request-card { background: #222222; border-color: #353535; --request-status: #efc575; --request-status-bg: #352d20; }
  html[data-portal-skin="dark"] .portal-workspace .portal-request-card[data-request-status="approved"] { --request-status: #8ed3aa; --request-status-bg: #20372c; }
  html[data-portal-skin="dark"] .portal-workspace .portal-request-card[data-request-status="denied"] { --request-status: #f2aaaa; --request-status-bg: #3a2529; }
  html[data-portal-skin="dark"] .portal-workspace .portal-request-card[data-request-status="quarantined"] { --request-status: #c8b2ed; --request-status-bg: #30273e; }
  html[data-portal-skin="dark"] .portal-workspace .portal-request-risk { color: #f2aaaa; }
  html[data-portal-skin="dark"] .portal-workspace .portal-request-actions .btn-success { background: #28714e !important; border-color: #438968 !important; color: #fff !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-request-actions .btn-success:hover { background: #32865e !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-request-actions .btn-danger { background: #302328 !important; border-color: #815257 !important; color: #f2aaaa !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-request-actions .btn-danger:hover { background: #422b31 !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-request-actions .btn-info { background: #414141 !important; border-color: #707070 !important; color: #ffffff !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-request-actions .btn-info:hover,
  html[data-portal-skin="dark"] .portal-workspace .portal-request-actions .btn-info:focus-visible { background: #505050 !important; border-color: #949494 !important; }
  /* Navigation pop-outs follow the selected sidebar palette. */
  html:is([data-portal-skin="dark"], [data-portal-skin="mixed"]) .portal-shell .portal-nav-flyout { background: #1c2228; border-color: #343b43; color: #d7dee6; scrollbar-color: #59616a transparent; }
  html:is([data-portal-skin="dark"], [data-portal-skin="mixed"]) .portal-shell .portal-nav-flyout .dropdown-menu { background: transparent !important; }
  html:is([data-portal-skin="dark"], [data-portal-skin="mixed"]) .portal-shell .portal-nav-flyout .portal-nav-flyout-heading h2,
  html:is([data-portal-skin="dark"], [data-portal-skin="mixed"]) .portal-shell .portal-nav-flyout .portal-nav-flyout-group { color: #f07057 !important; border-color: #343b43; }
  html:is([data-portal-skin="dark"], [data-portal-skin="mixed"]) .portal-shell .portal-nav-flyout li a { color: #d7dee6 !important; }
  html:is([data-portal-skin="dark"], [data-portal-skin="mixed"]) .portal-shell .portal-nav-flyout li a:is(:hover, :focus, :active) { background: #252c33 !important; color: #fff !important; }
  html:is([data-portal-skin="dark"], [data-portal-skin="mixed"]) .portal-shell .portal-nav-flyout li a:is(.active, [aria-expanded=true]) { background: #2e363f !important; color: #fff !important; box-shadow: inset 3px 0 #f07057; }
  html:is([data-portal-skin="dark"], [data-portal-skin="mixed"]) .portal-shell .portal-nav-flyout li.divider { height: 1px; padding: 0; margin: 6px 12px; border: 0 !important; background: #2d3339 !important; box-shadow: none; }
  html .portal-shell .portal-nav-flyout ul.dropdown-menu li > a { display: flex !important; align-items: center; justify-content: flex-start; gap: 0; }
  html .portal-shell .portal-nav-flyout ul.dropdown-menu li > a > :is(i,svg) { display: inline-block; position: static; float: none; flex: 0 0 20px; width: 20px; margin: 0 10px 0 0 !important; padding: 0; text-align: center; color: inherit; font-size: 16px; }
  html .portal-shell .portal-nav-flyout li a[aria-haspopup=true]::after { margin-left: auto; }
  html[data-portal-skin="dark"] .portal-workspace .summary-brand .summary-logo-light { display: none; }
  html[data-portal-skin="dark"] .portal-workspace .summary-brand .summary-logo-dark { display: block; }
  html[data-portal-skin="dark"] .portal-workspace .summary-brand > span { color: #f2f2f2; }
  html[data-portal-skin="dark"] .portal-workspace a.summary-product { background: #222222; border-color: #353535; color: #f2f2f2; }
  html[data-portal-skin="dark"] .portal-workspace a.summary-product:is(:hover,.is-selected) { background: #2a2728; border-color: #f07057; }
  html[data-portal-skin="dark"] .portal-workspace .summary-product :is(.summary-product-description,.summary-product-details,.summary-product-license) { color: #a8a8a8; border-color: #353535; }
  html[data-portal-skin="dark"] .portal-workspace .summary-product-details dd { color: #f2f2f2; }
  html[data-portal-skin="dark"] .portal-workspace .summary-product-usage-track { background: #353535; }
  html[data-portal-skin="dark"] .portal-workspace .portal-card .simpleicon {
    filter: brightness(0) invert(1); opacity: .55;
  }
  html[data-portal-skin="dark"] .portal-workspace [id*="divInheritNotice"] img[src$="/icon/cogs.svg" i] {
    filter: brightness(0) invert(1);
    opacity: .34 !important;
  }
  html[data-portal-skin="dark"] .portal-workspace [id*="divInheritNotice"] > div {
    border-top-color: #353535 !important;
  }
  /* Replace only the artwork; DevExpress retains state, events and accessibility. */
  html[data-portal-skin="dark"] .portal-shell :is(img, input[type="image"])[src*="/assets/img/Controls/toggle-on.svg" i] { content: url('/assets/img/Controls/toggle-on-dark.svg?v=20261005-circle-toggles'); }
  html[data-portal-skin="dark"] .portal-shell :is(img, input[type="image"])[src*="/assets/img/Controls/toggle-off.svg" i] { content: url('/assets/img/Controls/toggle-off-dark.svg?v=20261005-off-knob'); }
  html[data-portal-skin="dark"] .portal-shell [style*="/assets/img/Controls/toggle-on.svg" i] { background-image: url('/assets/img/Controls/toggle-on-dark.svg?v=20261005-circle-toggles') !important; }
  html[data-portal-skin="dark"] .portal-shell [style*="/assets/img/Controls/toggle-off.svg" i] { background-image: url('/assets/img/Controls/toggle-off-dark.svg?v=20261005-off-knob') !important; }
  /* Black and mixed modes share dark navigation. */
  html:is([data-portal-skin="dark"], [data-portal-skin="mixed"]) .portal-workspace .portal-sidebar { background: #1c2228 !important; color: #e6e9ed; }
  html:is([data-portal-skin="dark"], [data-portal-skin="mixed"]) .portal-workspace .portal-sidebar.portal-secondary-sidebar { background: #1c2228 !important; border-color: #343b43; }
  html:is([data-portal-skin="dark"], [data-portal-skin="mixed"]) .portal-workspace .portal-dual-navigation > .portal-global-sidebar { background: #292f36 !important; }
  html:is([data-portal-skin="dark"], [data-portal-skin="mixed"]) .portal-workspace .portal-sidebar .portal-navigation-back::before { background: #343b43; }
  html:is([data-portal-skin="dark"], [data-portal-skin="mixed"]) .portal-workspace .portal-sidebar .settings-side-menu { scrollbar-color: #59616a transparent; }
  html:is([data-portal-skin="dark"], [data-portal-skin="mixed"]) .portal-workspace .portal-sidebar .settings-side-menu :is(.list-group-item,.dropdown-menu) {
    background: transparent !important; border-color: #343b43 !important; color: #e6e9ed !important;
  }
  html:is([data-portal-skin="dark"], [data-portal-skin="mixed"]) .portal-workspace .portal-sidebar :is(a,.portal-navigation-back,.portal-nav-icon,i) { color: #d7dee6 !important; }
  html:is([data-portal-skin="dark"], [data-portal-skin="mixed"]) .portal-workspace .portal-sidebar .settings-side-menu a:hover,
  html:is([data-portal-skin="dark"], [data-portal-skin="mixed"]) .portal-workspace .portal-sidebar .portal-navigation-back:hover { background: #252c33 !important; color: #fff !important; }
  html:is([data-portal-skin="dark"], [data-portal-skin="mixed"]) .portal-workspace .portal-sidebar .settings-side-menu :is(a.active,a[aria-current="page"]) { background: #2e363f !important; color: #fff !important; }
  html:is([data-portal-skin="dark"], [data-portal-skin="mixed"]) .portal-workspace .portal-sidebar .settings-side-menu :is(a.active,a[aria-current="page"]) :is(.portal-nav-icon,i) { color: #f07057 !important; }
  html:is([data-portal-skin="dark"], [data-portal-skin="mixed"]) .portal-workspace .portal-sidebar :focus-visible { outline: 2px solid #f07057; outline-offset: -3px; }
  html[data-portal-skin="dark"] {
    color-scheme: dark; background: #181818;
    --portal-box-background: #222222; --portal-box-border: #353535;
    --portal-legacy-surface: #222222;
  }
  html[data-portal-skin="dark"] .portal-shell {
    --portal-text: #f2f2f2; --portal-muted: #a8a8a8; --portal-border: #353535;
    --portal-surface: #222222; --portal-subtle: #262626; --portal-accent: #f07057;
    --portal-action: #f07057; --portal-action-hover: #f07057;
    --portal-accent-soft: #402c29; --portal-accent-border: #985344;
    background: #181818; color: #f2f2f2;
  }
  html[data-portal-skin="dark"] .portal-ui {
    --portal-text: #f2f2f2; --portal-muted: #a8a8a8; --portal-border: #353535;
    --portal-surface: #222222; --portal-subtle: #262626; --portal-accent: #f07057;
    --portal-accent-soft: #402c29; --portal-accent-border: #985344;
    color: #f2f2f2;
  }
  html[data-portal-skin="dark"] .portal-shell #wrapper.portal-workspace,
  html[data-portal-skin="dark"] .portal-workspace .portal-main { background: #181818 !important; }
  html[data-portal-skin="dark"] .portal-workspace :is(.portal-page-panel, .white-row, .portal-inventory-section) {
    background: #222222 !important; border-color: #353535 !important; box-shadow: none;
  }
  html[data-portal-skin="dark"] .portal-workspace .portal-signin-shell {
    --portal-box-background: #222222; --portal-box-border: #353535;
    background: #222222; border-color: #353535;
  }
  html[data-portal-skin="dark"] .portal-workspace .portal-rights-panel,
  html[data-portal-skin="dark"] .portal-workspace .portal-product-access {
    --portal-box-background: #262626; --portal-box-border: #353535;
  }
  html[data-portal-skin="dark"] .portal-workspace .portal-signin-forms .white-row { background: transparent !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-signin-forms [id$="divSSO"] { border-color: #353535; }
  html[data-portal-skin="dark"] .portal-workspace [data-portal-control="TenantSettings/Data/APIAccess"] .portal-card-view { background-color: transparent !important; }
  /* CardView paints its layout tables separately from the outer control. */
  html[data-portal-skin="dark"] .portal-workspace [data-portal-control="TenantSettings/Data/APIAccess"] .portal-card-view :is(table, tbody, tr, td, [class*="dxcv"]):not(.portal-card):not(.portal-card *) {
    background-color: transparent !important;
  }
  html[data-portal-skin="dark"] .portal-workspace .portal-api-key-title { color: #f2f2f2 !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-api-key-icon { filter: brightness(0) invert(1); opacity: .55 !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-gateway-icon { filter: brightness(0) invert(1); opacity: .55 !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-platform-scope-icon { filter: brightness(0) invert(1); opacity: .7 !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-scope-hint { color: #ded7d3; background: #2b2522; border-color: #514039; }
  html[data-portal-skin="dark"] .portal-workspace .portal-scope-hint .fa { color: #f07057; }
  html[data-portal-skin="dark"] .portal-workspace .portal-ui .alert-warning { background: #312421; border-color: #8b564b; color: #f2c2b4; }
  html[data-portal-skin="dark"] .portal-workspace .portal-gti-score-blocked { color: #f2aaaa; }
  /* Shared error palette for login, integrations and all portal error alerts. */
  html[data-portal-skin="dark"] .portal-workspace .alert-danger {
    background: #3a2529; border-color: #815257; color: #f2aaaa;
  }
  html[data-portal-skin="dark"] .portal-workspace .alert-danger.portal-list-error-status {
    background: transparent; border-color: transparent; color: #f2aaaa;
  }
  html[data-portal-skin="dark"] .portal-workspace .alert-success[id$="divOK"] {
    background: #20372b; border-color: #426d51; color: #b8e5c5;
  }
  html[data-portal-skin="dark"] .portal-workspace .portal-support-ticket {
    --portal-box-background: #222222; --portal-box-border: #353535;
  }
  html[data-portal-skin="dark"] .portal-workspace .portal-main .portal-support-ticket .featured-box {
    background: #222222 !important; border-color: #353535 !important;
  }
  html[data-portal-skin="dark"] .portal-workspace .portal-support-error { color: #f2aaaa; }
  html[data-portal-skin="dark"] .portal-workspace .portal-signin-forms :is([id$="btnLogin"], [id$="btnLogin2"]) {
    background: #b9432d !important; border-color: #d7634d !important; color: #fff !important;
  }
  html[data-portal-skin="dark"] .portal-workspace .portal-signin-forms :is([id$="btnLogin"], [id$="btnLogin2"]):is(:hover, :focus) { background: #a63926 !important; }
  /* Layout sections stay flat; bounded panels below own their surfaces.
     Keep the audit selector separate so it cannot raise every section's specificity. */
  html[data-portal-skin="dark"] .portal-workspace :is(.portal-section, .portal-page-heading),
  html[data-portal-skin="dark"] .portal-workspace .portal-audit-detail .portal-audit-band { background: transparent !important; }
  html[data-portal-skin="dark"] .portal-workspace :is(.portal-info-panel, .portal-search-filter-panel, .portal-report-results, .portal-inventory-section, .portal-outer-panel),
  html[data-portal-skin="dark"] .portal-workspace .featured-box.portal-section:where(:not(.portal-config-section, .portal-list-section):not(:has(.portal-grid, .portal-card, .simplepanel))),
  html[data-portal-skin="dark"] .portal-workspace :is(.portal-downloads, .portal-scim-setup, .portal-sso-setup, .portal-admin-profile, .summarypage) .portal-section:not(.portal-list-layout),
  html[data-portal-skin="dark"] .portal-workspace .portal-support-ticket > .portal-support-layout > .col-lg-6 > .portal-section,
  html[data-portal-skin="dark"] .portal-workspace .reportingpage .featured-box:not(:has(.portal-grid, .featured-box)) {
    background: #222222 !important; border-color: #353535 !important;
  }
  html[data-portal-skin="dark"] .portal-workspace :is(.portal-card, .portal-owner-card, .simplepanel, .productbox, .productboxactive) {
    background: #222222 !important; border-color: #353535 !important; border-width: 1px !important; color: #f2f2f2;
  }
  /* Hardware cards own their surfaces; gutters expose the page beneath. */
  html[data-portal-skin="dark"] .portal-workspace [data-portal-control="ClientDetails/InventoryClientDetailsHardware"] .featured-box.portal-hardware-section {
    background:transparent !important; border:0 !important; box-shadow:none !important;
  }
  /* List wrappers share the page surface; real settings/help cards remain boxed. */
  html[data-portal-skin="dark"] .portal-workspace .portal-card.portal-list-card:not(.simplepanelhelper) {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }
  /* Icon/title blocks belong to their outer panel, not another card. */
  html[data-portal-skin="dark"] .portal-workspace .simplepanel.portal-card:is(.portal-pin-heading,.portal-decorative-heading) {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
  }
  /* Headers inside panels should show the panel's own surface. */
  html[data-portal-skin="dark"] .portal-workspace :is(.portal-card,.portal-section,.portal-info-panel) :is(.featured-box-header,.portal-section-heading,.panel-heading,.card-header,h2,h3) {
    background: transparent !important;
    background-image: none !important;
  }
  html[data-portal-skin="dark"] .portal-workspace .portal-main.portal-page-panel:has(.portal-config-section),
  html[data-portal-skin="dark"] .portal-workspace .portal-main.portal-page-panel:has([data-portal-control^="ClientDetails/"]),
  html[data-portal-skin="dark"] .portal-workspace .portal-main.portal-catalog-settings,
  html[data-portal-skin="dark"] .portal-workspace .portal-main > .portal-page-heading,
  html[data-portal-skin="dark"] .portal-workspace .portal-config-section:not(.portal-info-panel, .portal-search-filter-panel, .portal-inventory-section) {
    background: transparent !important;
  }
  html[data-portal-skin="dark"] .portal-workspace :is(#page-title, .headerbox, .headertext, .featured-box-header) { background: transparent !important; }
  html[data-portal-skin="dark"] .portal-workspace :is(h1,h2,h3,h4,h5,h6,.featured-box-header,.portal-section-heading,.settingstable,.portal-settings-table) { color: #f2f2f2 !important; }
  /* Legacy page titles use 80% opacity, which unnecessarily dims dark-mode headings. */
  html[data-portal-skin="dark"] .portal-workspace :is(h1,h2,h3,h4,h5,h6,.featured-box-header,.portal-section-heading) { color: #f2f2f2 !important; opacity: 1; }
  html[data-portal-skin="dark"] .portal-workspace #page-title h2 { opacity: 1; }
  html[data-portal-skin="dark"] .portal-workspace [data-portal-control="EPMSettings/EndPoint/Authentication"] .portal-uac-option-title,
  html[data-portal-skin="dark"] .portal-workspace [data-portal-control="EPMSettings/EndPoint/Authentication"] .portal-uac-option-title :is(td, label, span) { color: var(--portal-accent, #f07057) !important; }
  html[data-portal-skin="dark"] .portal-workspace :is(.simplepanelhelper,.portal-intro-help,.portal-intro-help-toggle,.portal-platform-context,.portal-scope-name,.portal-settings-area,small) { color: #a8a8a8 !important; }
  html[data-portal-skin="dark"] .portal-workspace :is(.portal-section, .portal-card) :is(p, .subtext, .overrulednote) { color: #a8a8a8 !important; }
  html[data-portal-skin="dark"] .portal-workspace .summary-product.is-selected .summary-product-action { color: #f07057; }
  /* Gauge values are HTML overlays; override the plugin's inline text colors. */
  html[data-portal-skin="dark"] .portal-workspace .GaugeMeter > span { color: #f2f2f2 !important; }
  html[data-portal-skin="dark"] .portal-workspace .GaugeMeter > span :is(s,u) { color: inherit; opacity: 1; }
  html[data-portal-skin="dark"] .portal-workspace .GaugeMeter > b { color: #a8a8a8 !important; opacity: 1; }
  html[data-portal-skin="dark"] .portal-workspace a { color: #f07057; }
  html[data-portal-skin="dark"] .portal-workspace a:hover { color: #f07057; }
  html[data-portal-skin="dark"] .portal-workspace .portal-grid :is(.portal-grid-edit, .dxgvCommandColumn_Office365 a):is(:hover, :focus-visible) { background: #353535 !important; border-color: #494949 !important; color: #f07057 !important; }
  html[data-portal-skin="dark"] .portal-workspace :is(hr,.portal-tabs,.dxtc-strip,.dxtc-content) { border-color: #353535 !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-tabs :is(.dxtc-strip,.dxtc-stripContainer,.dxtc-content) { background: transparent !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-tabs .dxtc-strip :is(.dxtc-link,.dx-vam) { color: #a8a8a8 !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-tabs .dxtc-strip .dxtc-activeTab :is(.dxtc-link,.dx-vam) { color: #f07057 !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-grid .portal-grid-edit { color: #f07057 !important; }
  html[data-portal-skin="dark"] .portal-workspace :is(.dxtc-tab,.dxtc-activeTab,.dxtc-link) { background: transparent !important; color: #a8a8a8 !important; }
  html[data-portal-skin="dark"] .portal-workspace .dxtc-activeTab .dxtc-link { color: #f07057 !important; }
  html[data-portal-skin="dark"] .portal-shell :is(input:not([type="image"]):not([type="submit"]):not([type="button"]):not([type="checkbox"]):not([type="radio"]),textarea,select,[class*="dxeTextBox"],[class*="dxeButtonEdit"],[class*="dxeMemo"],[class*="dxeListBox"]:where(:not([class*="dxeListBoxItem"])),[class*="dxeCalendar"],.portal-input) {
    background-color: #1c1c1c !important; color: #f2f2f2 !important; border-color: #555555 !important;
  }
  html[data-portal-skin="dark"] .portal-shell :is(input,textarea)::placeholder { color: #a8a8a8 !important; opacity: 1; }
  /* Browser autofill otherwise paints saved login credentials blue-gray. */
  html[data-portal-skin="dark"] .portal-shell .portal-login-page input.form-control:is(:autofill, :-webkit-autofill) {
    -webkit-box-shadow: 0 0 0 1000px #1c1c1c inset !important;
    box-shadow: 0 0 0 1000px #1c1c1c inset !important;
    -webkit-text-fill-color: #f2f2f2 !important;
    caret-color: #f2f2f2;
  }
  html[data-portal-skin="dark"] .portal-shell :is(input:disabled,textarea:disabled) { background-color: #303030 !important; color: #a8a8a8 !important; }
  html[data-portal-skin="dark"] .portal-shell :is(.btn,[class*="dxbButton"],.ext-button-primary) {
    background-color: #292929 !important; color: #f2f2f2 !important; border-color: #494949 !important;
  }
  html[data-portal-skin="dark"] .portal-workspace :is(.btn-primary,.ext-button-primary) {
    background: #343434 !important; color: #f2f2f2 !important; border-color: #5a5a5a !important;
  }
  html[data-portal-skin="dark"] .portal-workspace :is(.btn-primary,.ext-button-primary):is(:hover,:focus) {
    background: #404040 !important; color: #f2f2f2 !important; border-color: #707070 !important;
  }
  html[data-portal-skin="dark"] .portal-workspace [class*="dxucBrowseButton"] { background: #292929 !important; color: #f2f2f2 !important; border: 1px solid #494949 !important; border-radius: 7px; padding: 8px 15px; font: 600 14px/1.5 "Source Sans 3", "Segoe UI", Arial, sans-serif; }
  html[data-portal-skin="dark"] .portal-workspace [class*="dxucBrowseButton"] :is(a, span) { color: #f2f2f2 !important; font: inherit; text-decoration: none !important; }
  html[data-portal-skin="dark"] .portal-workspace [class*="dxucBrowseButton"]:is(:hover, :focus-within) { background: #343434 !important; border-color: #a8a8a8 !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-export-menu-toggle { background: #292929 !important; color: #f2f2f2 !important; border-color: #494949 !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-export-menu-toggle:is(:hover,:focus-visible) { background: #292929 !important; border-color: #a8a8a8 !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-export-menu-options { background: #222222 !important; border-color: #494949 !important; box-shadow: 0 8px 20px #0006; }
  html[data-portal-skin="dark"] .portal-workspace .portal-export-menu-options button { color: #f2f2f2 !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-export-menu-options button:is(:hover,:focus-visible) { background: #353535 !important; }
  html[data-portal-skin="dark"] .portal-shell :is(.dropdown-menu,[class*="dxpc-content"],[class*="dxpc-header"],[class*="dxpc-mainDiv"],[class*="dxpcModalBackLite"],[class*="dxgvFilterPopup"],.modal-content) {
    background-color: #2a2a2a !important; color: #f2f2f2 !important; border-color: #555555 !important;
  }
  /* Native filter/calendar popups render beneath body, outside the workspace. */
  html[data-portal-skin="dark"] .portal-shell :is([class*="dxpc-footer"],[class*="dxpc-ft"],[class*="dxgvHFSD"],[class*="dxgvHFDR"],[class*="dxgvHFC"],[class*="dxeCalendarFooter"],[class*="dxeCalendarHeader"]) {
    background-color: #2a2a2a !important; color: #f2f2f2 !important; border-color: #555555 !important;
  }
  html[data-portal-skin="dark"] .portal-shell :is([class*="dxgvFilterPopup"],[class*="dxgvHFSD"],[class*="dxgvHFDR"],[class*="dxeCalendar"]) :is(label,[class*="dxeBase"],a) {
    color: #f2f2f2 !important;
  }
  html[data-portal-skin="dark"] .portal-shell [class*="dxeCalendar"] [class*="OtherMonth"] { color: #a8a8a8 !important; }
  html[data-portal-skin="dark"] .portal-shell [class*="dxeCalendar"] :is([class*="Selected"],[class*="DayInRange"]) {
    background-color: #49312c !important; color: #fff !important;
  }
  html[data-portal-skin="dark"] .portal-shell .dropdown-menu :is(a,h5) { color: #f2f2f2 !important; }
  html[data-portal-skin="dark"] .portal-shell .dropdown-menu a:hover { background: #402c29 !important; color: #f07057 !important; }
  html[data-portal-skin="dark"] .portal-shell :is(.portal-grid,[class*="dxgvControl"],[class*="dxgvTable"],[class*="dxgvDataRow"],[class*="dxgvDataRow"]>td,[class*="dxgvDetailRow"]>td) {
    background-color: transparent !important; color: #f2f2f2 !important; border-color: #353535 !important;
  }
  html[data-portal-skin="dark"] .portal-shell :is([class*="dxgvHeader"],[class*="dxgvSearchPanel"],[class*="dxgvGroupPanel"],[class*="dxgvPager"],[class*="dxgvFooter"],[class*="dxgvFilterRow"],[class*="dxgvGroupRow"],[class*="dxpLite"]) {
    background-color: #222222 !important; color: #c3bbb7 !important; border-color: #353535 !important;
  }
  /* Grouping instructions sit on the page, outside the visible grid rows. */
  html[data-portal-skin="dark"] .portal-shell :is(.portal-grid,[class*="dxgvControl"],[class*="dxgvGroupPanel"],[class*="dxgvSearchPanel"],[class*="dxgvPager"],[class*="dxpLite"],[class*="dxgvEmptyDataRow"],[class*="dxgvEmptyDataRow"]>td) {
    background-color: transparent !important;
  }
  /* A grid inherits its enclosing surface; containing a grid must not erase a panel. */
  html[data-portal-skin="dark"] .portal-workspace .portal-all-settings .portal-card.portal-webhook-list { background: #222222 !important; border-color: #353535 !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-grid > tbody > tr > td:has([class*="dxgvTable"]) {
    background: transparent !important; box-shadow: none;
  }
  html[data-portal-skin="dark"] .portal-shell :is([class*="dxgvEmptyDataRow"],[class*="dxgvEmptyDataRow"]>td) { color: #a8a8a8 !important; }
  /* Ordinary rows show the page or panel beneath them; state colors remain below. */
  html[data-portal-skin="dark"] .portal-shell :is([class*="dxgvDataRow"],[class*="dxgvDataRow"]>td) { background-color: transparent !important; }
  /* Bounded report results use the same surface as the filter and chart panels. */
  html[data-portal-skin="dark"] .portal-workspace .reportingpage .portal-report-results { background: #222222 !important; border-color: #353535 !important; }
  html[data-portal-skin="dark"] .portal-workspace .reportingpage .portal-report-results.portal-list-layout { background: transparent !important; }
  html[data-portal-skin="dark"] .portal-workspace .reportingpage .portal-report-results .portal-grid :is([class*="dxgvTable"], [class*="dxgvDataRow"]:not([class*="Selected"]):not([class*="Focused"]), [class*="dxgvDataRow"]:not([class*="Selected"]):not([class*="Focused"]) > td) { background-color: transparent !important; }
  html[data-portal-skin="dark"] .portal-workspace .reportingpage .portal-report-results .portal-grid [class*="dxgvDataRow"]:not([class*="Selected"]):not([class*="Focused"]):hover > td { background-color: #2b2b2b !important; }
  html[data-portal-skin="dark"] .portal-shell [class*="dxgvDataRow"]:not([class*="Selected"]):not([class*="Focused"]):hover>td { background-color: #2b2b2b !important; }
  html[data-portal-skin="dark"] .portal-shell :is(.btn,[class*="dxbButton"]):not(:disabled):hover { border-color: #a8a8a8 !important; }
  html[data-portal-skin="dark"] .portal-shell :is([class*="dxgvFocusedRow"]>td,[class*="dxgvSelectedRow"]>td) { background-color: #49312c !important; color: #fff !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-audit-facts > tbody > tr > td { color: #f2f2f2 !important; }
  html[data-portal-skin="dark"] .portal-shell :focus-visible { outline-color: #f07057; }
  /* Grid headings contain nested tables with their own legacy text colors. */
  html[data-portal-skin="dark"] .portal-workspace .portal-grid [class*="dxgvHeader"] :is(td,span,a) { color: #c3bbb7 !important; }
  /* Column headings inside list panels share the list surface. */
  html[data-portal-skin="dark"] .portal-workspace .portal-grid :is([class*="dxgvHeader"],[class*="dxgvHeader"] table,[class*="dxgvHeader"] :is(td,th)) {
    background: transparent !important;
  }
  /* DevExpress adds a light fill to filter cells when column search opens. */
  html[data-portal-skin="dark"] .portal-workspace .portal-grid :is([class*="dxgvFilterRow"],[class*="dxgvFilterRow"] > :is(td,th)) {
    background: transparent !important;
    background-color: transparent !important;
  }
  /* Match checked grid indicators to the link accent, preserving state classes. */
  html[data-portal-skin="dark"] .portal-workspace .portal-grid .dxWeb_edtCheckBoxChecked_Office365 {
    background-image: url('/assets/img/Controls/checkbox-checked-dark.svg') !important;
    background-position: center !important;
    background-size: 14px 14px !important;
    background-repeat: no-repeat !important;
  }
  /* Outline empty checkboxes. */
  html[data-portal-skin="dark"] .portal-workspace .portal-grid [class*="edtCheckBoxUnchecked"] {
    background-color: #303030 !important; box-shadow: inset 0 0 0 1px #a8a8a8; border-radius: 2px;
  }
  html[data-portal-skin="dark"] .portal-workspace .portal-grid input[type="checkbox"] { accent-color: #f07057; }
  html[data-portal-skin="dark"] .portal-workspace .portal-grid :is(img[src*="/Images/Up.png" i],img[src*="/Images/Down.png" i],[class*="dxgvDetailCollapsedButton"],[class*="dxgvDetailExpandedButton"]) {
    filter: brightness(0) invert(1); opacity: .8;
  }
  /* Inline accordion links are quieter than the floating header dropdowns. */
  html:is([data-portal-skin="dark"], [data-portal-skin="mixed"]) .portal-workspace .portal-sidebar .portal-global-navigation .dropdown-menu { background: transparent !important; }
  html:is([data-portal-skin="dark"], [data-portal-skin="mixed"]) .portal-workspace .portal-sidebar .portal-global-navigation .dropdown-menu a:hover { background: #252c33 !important; }
  html:is([data-portal-skin="dark"], [data-portal-skin="mixed"]) .portal-workspace .portal-sidebar .portal-global-navigation .dropdown-menu a.active { background: #322c2b !important; color: #ff9984 !important; }
}

/* Neutral charcoal navigation; mixed mode retains its existing palette. */
@media screen {
/* Navigation pop-outs follow the selected sidebar palette. */
  html[data-portal-skin="dark"] .portal-shell .portal-nav-flyout { background: #1e1e1e; border-color: #353535; color: #c3bbb7; scrollbar-color: #606060 transparent; }
html[data-portal-skin="dark"] .portal-shell .portal-nav-flyout .dropdown-menu { background: transparent !important; }
html[data-portal-skin="dark"] .portal-shell .portal-nav-flyout .portal-nav-flyout-heading h2,
  html[data-portal-skin="dark"] .portal-shell .portal-nav-flyout .portal-nav-flyout-group { color: #f07057 !important; border-color: #353535; }
html[data-portal-skin="dark"] .portal-shell .portal-nav-flyout li a { color: #c3bbb7 !important; }
html[data-portal-skin="dark"] .portal-shell .portal-nav-flyout li a:is(:hover, :focus, :active) { background: #2a2a2a !important; color: #fff !important; }
html[data-portal-skin="dark"] .portal-shell .portal-nav-flyout li a:is(.active, [aria-expanded=true]) { background: #0f0f0f !important; color: #fff !important; box-shadow: inset 3px 0 #f07057; }
html[data-portal-skin="dark"] .portal-shell .portal-nav-flyout li.divider { height: 1px; padding: 0; margin: 6px 12px; border: 0 !important; background: #2c2c2c !important; box-shadow: none; }
/* Black and mixed modes share dark navigation. */
  html[data-portal-skin="dark"] .portal-workspace .portal-sidebar { background: #1e1e1e !important; color: #f2f2f2; }
html[data-portal-skin="dark"] .portal-workspace .portal-sidebar.portal-secondary-sidebar { background: #1e1e1e !important; border-color: #353535; }
html[data-portal-skin="dark"] .portal-workspace .portal-dual-navigation > .portal-global-sidebar { background: #262626 !important; }
html[data-portal-skin="dark"] .portal-workspace .portal-sidebar .portal-navigation-back::before { background: #353535; }
html[data-portal-skin="dark"] .portal-workspace .portal-sidebar .settings-side-menu { scrollbar-color: #606060 transparent; }
html[data-portal-skin="dark"] .portal-workspace .portal-sidebar .settings-side-menu :is(.list-group-item,.dropdown-menu) {
    background: transparent !important; border-color: #353535 !important; color: #f2f2f2 !important;
  }
html[data-portal-skin="dark"] .portal-workspace .portal-sidebar :is(a,.portal-navigation-back,.portal-nav-icon,i) { color: #c3bbb7 !important; }
html[data-portal-skin="dark"] .portal-workspace .portal-sidebar .settings-side-menu a:hover,
  html[data-portal-skin="dark"] .portal-workspace .portal-sidebar .portal-navigation-back:hover { background: #2a2a2a !important; color: #fff !important; }
html[data-portal-skin="dark"] .portal-workspace .portal-sidebar .settings-side-menu :is(a.active,a[aria-current="page"]) { background: #0f0f0f !important; color: #fff !important; }
html[data-portal-skin="dark"] .portal-workspace .portal-sidebar .settings-side-menu :is(a.active,a[aria-current="page"]) :is(.portal-nav-icon,i) { color: #f07057 !important; }
html[data-portal-skin="dark"] .portal-workspace .portal-sidebar :focus-visible { outline: 2px solid #f07057; outline-offset: -3px; }
/* Inline accordion links are quieter than the floating header dropdowns. */
  html[data-portal-skin="dark"] .portal-workspace .portal-sidebar .portal-global-navigation .dropdown-menu { background: transparent !important; }
html[data-portal-skin="dark"] .portal-workspace .portal-sidebar .portal-global-navigation .dropdown-menu a:hover { background: #2a2a2a !important; }
html[data-portal-skin="dark"] .portal-shell .portal-sidebar-account .dropdown-menu li > a:is(:hover, :focus-visible) { background: #2a2a2a !important; color: #fff !important; }
html[data-portal-skin="dark"] .portal-workspace .portal-sidebar .portal-global-navigation .dropdown-menu a.active { background: #322c2b !important; color: #f07057 !important; }
  html[data-portal-skin="dark"] .portal-shell #topNav { background: #101010 !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-card .paneltext { color: #a8a8a8; font-weight: 400; }
  html[data-portal-skin="dark"] .portal-workspace .portal-card .panelvalue { color: #f2f2f2; }
  html[data-portal-skin="dark"] .portal-workspace .portal-hardware-section .portal-card > table:not(.portal-grid) > tbody > tr > td:first-child { color: #a8a8a8; }
  html[data-portal-skin="dark"] .portal-workspace .portal-hardware-section .portal-card > table:not(.portal-grid) > tbody > tr > td:first-child b { color: inherit; font-weight: 400; }
}

@media screen {
  /* Keep provider artwork while matching the dark sign-in surface. */
  html[data-portal-skin="dark"] .portal-shell .portal-login-page .portal-sso-button { background-color: #262626 !important; border-color: #555555 !important; }
  html[data-portal-skin="dark"] .portal-shell .portal-login-page .portal-sso-button:is(:hover,:focus-within) { background-color: #353535 !important; border-color: #f07057 !important; }
}

@media screen {
  /* Date-range popups may be portalled outside the workspace by DevExpress. */
  html[data-portal-skin="dark"] .portal-shell .audit-date-popup { background: #222222 !important; color: #f2f2f2; }
  html[data-portal-skin="dark"] .portal-shell :is(.audit-date-heading,.audit-date-label) { color: #a8a8a8; }
  html[data-portal-skin="dark"] .portal-shell .audit-date-custom { border-left-color: #353535 !important; }
  html[data-portal-skin="dark"] .portal-shell .audit-date-option { color: #f2f2f2 !important; }
  html[data-portal-skin="dark"] .portal-shell .audit-date-option::before { color: #c3bbb7; }
  html[data-portal-skin="dark"] .portal-shell .audit-date-option:is(:hover,:focus,.active) { background: #303030 !important; color: #f2f2f2 !important; }
  html[data-portal-skin="dark"] .portal-shell .audit-date-option:focus-visible { outline: 2px solid #f07057 !important; outline-offset: -2px; }
  html[data-portal-skin="dark"] .portal-shell .audit-date-custom :is(.dxeButtonEdit_Office365,.dxeTextBox_Office365,table,input,.dxeButtonEditButton_Office365) { background: #1c1c1c !important; color: #f2f2f2 !important; border-color: #555555 !important; }
  html[data-portal-skin="dark"] .portal-shell .audit-date-apply { background: #f07057 !important; color: #181818 !important; }
  html[data-portal-skin="dark"] .portal-shell .audit-date-apply :is(.dxb,.dxbButton_Office365) { background: transparent !important; color: inherit !important; border-radius: 0 !important; }
}

@media screen {
  html[data-portal-skin="dark"] .portal-shell :is(.audit-type-popup,.audit-type-window) { background-color: #222222 !important; border-color: #353535 !important; }
  html[data-portal-skin="dark"] .portal-shell .audit-type-option { color: #f2f2f2 !important; }
  html[data-portal-skin="dark"] .portal-shell .audit-type-option:is(:hover,:focus,.active) { background: #303030 !important; color: #f2f2f2 !important; }
  html[data-portal-skin="dark"] .portal-shell .audit-type-option :is(.audit-type-icon,.audit-type-icon i,.fa) { color: #c3bbb7 !important; }
  html[data-portal-skin="dark"] .portal-shell .audit-type-option:is(:hover,:focus,.active) :is(.audit-type-icon,.audit-type-icon i,.fa) { color: #f07057 !important; }
  html[data-portal-skin="dark"] .portal-shell .audit-type-option:focus-visible { outline: 2px solid #f07057 !important; outline-offset: -2px; }
  html[data-portal-skin="dark"] .portal-shell :is(.audit-dropdown-type,.audit-date-range) input::selection { color: #f2f2f2 !important; background: transparent !important; }
}

@media screen {
  /* DevExpress callback loading panels are separate from the grid surface. */
  html[data-portal-skin="dark"] .portal-shell [class*="LoadingPanel"] {
    background-color: #222222 !important;
    color: #f2f2f2 !important;
    border-color: #494949 !important;
    box-shadow: 0 4px 16px rgba(0,0,0,.25);
  }
  html[data-portal-skin="dark"] .portal-shell [class*="LoadingPanel"] :is(td,span) {
    background-color: transparent !important;
    color: #f2f2f2 !important;
  }
}

@media screen {
  /* Paint the detail row itself as well as its cells: transparent cells expose
     the vendor's white row background after an expand callback. */
  html[data-portal-skin="dark"] .portal-workspace .portal-grid [class*="dxgvDetailRow"],
  html[data-portal-skin="dark"] .portal-workspace .portal-grid [class*="dxgvDetailRow"] > td {
    background: #181818 !important;
    color: #f2f2f2 !important;
    border-color: #353535 !important;
  }
  html[data-portal-skin="dark"] .portal-workspace .portal-audit-detail { background: #181818 !important; }
  /* Software installation details continue the enclosing list surface. */
  html[data-portal-skin="dark"] .portal-workspace .portal-software-inventory-grid [class*="dxgvDetailRow"],
  html[data-portal-skin="dark"] .portal-workspace .portal-software-inventory-grid [class*="dxgvDetailRow"] > td {
    background: transparent !important;
  }
  html[data-portal-skin="dark"] .portal-workspace .portal-audit-detail .portal-audit-facts a {
    color: #f07057 !important; border-bottom-color: currentColor;
  }
  html[data-portal-skin="dark"] .portal-workspace .portal-audit-detail .portal-audit-facts a:hover { color: #ff9a83 !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-popularity-score,
  html[data-portal-skin="dark"] .portal-workspace .portal-popularity-score * { color: #f07057 !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-popularity-score,
  html[data-portal-skin="dark"] .portal-workspace .portal-popularity-score :is(table, tbody, tr, td) { background: transparent !important; border-color: #555555 !important; }
  /* iOS progress indicators occupy the number's full height; only their bottom
     border is the progress line. Filling the indicator obscures the score. */
  html[data-portal-skin="dark"] .portal-workspace .portal-popularity-score [class*="dxeProgressBarIndicator"] { background: transparent !important; border-bottom-color: #f07057 !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-audit-detail img[src$="/q.png" i] { filter: brightness(0) invert(1); opacity: .55 !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-audit-detail .portal-card.portal-audit-extra {
    --portal-box-background: #222222; background: #222222 !important; border-color: #353535 !important;
  }
  html[data-portal-skin="dark"] .portal-workspace .portal-audit-extra .portal-grid :is([class*="dxgvTable"], [class*="dxgvDataRow"]:not([class*="Selected"]):not([class*="Focused"]), [class*="dxgvDataRow"]:not([class*="Selected"]):not([class*="Focused"]) > td) { background-color: transparent !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-audit-tree :is(table, tbody, tr, td) {
    background: transparent !important; color: #f2f2f2 !important; border-color: #353535 !important;
  }
  html[data-portal-skin="dark"] .portal-workspace .portal-audit-tree :is(.portal-tree-header, [class*="dxtlHeader"]) { color: #c3bbb7 !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-audit-tree a { color: #f07057 !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-audit-tree :is([class*="dxtlFocusedNode"], [class*="dxtlSelectedNode"]) > td { background: #49312c !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-audit-tree :is([class*="dxtlNode"], [class*="dxtlAltNode"]):hover > td { background: #2b2b2b !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-audit-tree :is([class*="dxtl__Expand"], [class*="dxtl__Collapse"]) { filter: brightness(0) invert(1); opacity: .7; }
}

@media screen {
  html .portal-workspace .portal-admin-user,
  html .portal-workspace .portal-admin-user a { color: #c62828 !important; font-weight: 700 !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-admin-user,
  html[data-portal-skin="dark"] .portal-workspace .portal-admin-user a { color: #ff5252 !important; }
  html .portal-workspace .portal-standard-user { color: #f07057 !important; font-weight: 400 !important; }
  .portal-workspace .portal-admin-legend { color: var(--portal-muted); font-size: 13px; font-weight: 400; letter-spacing: normal; text-transform: none; }
}
@media screen {
  /* The pager uses its own combo box and a separate menu for page sizes. */
  html[data-portal-skin="dark"] .portal-shell .dxpLite_Office365 :is(.dxp-comboBox,.dxp-dropDownButton) {
    background-color: #1c1c1c !important;
    color: #f2f2f2 !important;
    border-color: #555555 !important;
  }
  html[data-portal-skin="dark"] .portal-shell .dxpLite_Office365 :is(.dxp-hoverDropDownButton,.dxp-pressedDropDownButton) { background-color: #303030 !important; }
  html[data-portal-skin="dark"] .portal-shell .dxp-comboBox input::selection { background: transparent !important; color: #f2f2f2 !important; }
  html[data-portal-skin="dark"] .portal-shell :is([id$="_PSP"],[id*="_PSP_"]) :is(.dxm-popup,.dxm-gutter) {
    background-color: #222222 !important;
    border-color: #494949 !important;
  }
  html[data-portal-skin="dark"] .portal-shell :is([id$="_PSP"],[id*="_PSP_"]) .dxm-item { color: #f2f2f2 !important; }
  html[data-portal-skin="dark"] .portal-shell :is([id$="_PSP"],[id*="_PSP_"]) :is(.dxm-content,a.dx) { color: inherit !important; }
  html[data-portal-skin="dark"] .portal-shell :is([id$="_PSP"],[id*="_PSP_"]) .dxm-hovered { background-color: #303030 !important; }
  html[data-portal-skin="dark"] .portal-shell :is([id$="_PSP"],[id*="_PSP_"]) .dxm-selected { background-color: #f07057 !important; color: #181818 !important; }
}

/* Read-only permission indicators retain the grid's state and accessible labels. */
@media screen {
  html[data-portal-skin="dark"] .portal-workspace :is(.portal-scim-roles, .portal-sso-setup) .portal-grid :is([class*="dxgvTable"], [class*="dxgvDataRow"], [class*="dxgvDataRow"] > td) { background-color: transparent !important; }
  html[data-portal-skin="dark"] .portal-workspace :is(.portal-scim-roles, .portal-sso-setup) .portal-grid [class*="dxgvDataRow"]:not([class*="Selected"]):not([class*="Focused"]):hover > td { background-color: #2b2b2b !important; }
  :is(.portal-users-list, .portal-scim-roles, .portal-subsettings-list) { --portal-permission-ink: #39845a; --portal-active-dot: #39845a; }
  html[data-portal-skin="dark"] :is(.portal-users-list, .portal-scim-roles, .portal-subsettings-list) { --portal-permission-ink: #78ba95; --portal-active-dot: #78ba95; }
  html .portal-workspace :is(.portal-users-list, .portal-scim-roles, .portal-subsettings-list) .portal-grid :is([class*="edtCheckBoxChecked"], [class*="edtCheckBoxUnchecked"]) {
    position: relative;
    background: none !important;
    box-shadow: none !important;
    border: 0 !important;
    border-radius: 0;
    width: 18px;
    height: 18px;
  }
  html[data-portal-skin="dark"] .portal-workspace .portal-sso-setup {
    --portal-box-background: #222222; --portal-box-border: #353535;
  }
  html .portal-workspace :is(.portal-users-list, .portal-scim-roles, .portal-subsettings-list) .portal-grid :is([class*="edtCheckBoxChecked"], [class*="edtCheckBoxUnchecked"])::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    pointer-events: none;
  }
  html .portal-workspace :is(.portal-users-list, .portal-scim-roles, .portal-subsettings-list) .portal-grid [class*="edtCheckBoxChecked"]::after {
    width: 8px;
    height: 13px;
    border: solid var(--portal-permission-ink);
    border-width: 0 2px 2px 0;
    transform: translate(-50%, -65%) rotate(45deg);
  }
  html .portal-workspace :is(.portal-users-list, .portal-scim-roles, .portal-subsettings-list) .portal-grid [class*="edtCheckBoxUnchecked"]::after {
    content: none;
  }
  html .portal-workspace :is(.portal-users-list, .portal-scim-roles, .portal-subsettings-list) .portal-grid .portal-user-active :is([class*="edtCheckBoxChecked"], [class*="edtCheckBoxUnchecked"])::after {
    content: "";
    width: 7px;
    height: 7px;
    border: 0;
    border-radius: 50%;
    background: var(--portal-active-dot);
    transform: translate(-50%, -50%);
  }
  html .portal-workspace :is(.portal-users-list, .portal-scim-roles, .portal-subsettings-list) .portal-grid .portal-user-active [class*="edtCheckBoxUnchecked"]::after {
    background: #e47d83;
  }
}

/* All CardViews share neutral layout surfaces, including gateway and product tiles.
   Do not reach into template cards: their editors and semantic states own their fills. */
@media screen {
  html[data-portal-skin="dark"] .portal-workspace .portal-card-view,
  html[data-portal-skin="dark"] .portal-workspace .portal-card-view :is(table, tbody, tr, td, [class*="dxcv"]):not(.portal-card, .portal-local-admin-card):not(.portal-card *, .portal-local-admin-card *) {
    background-color: transparent !important;
  }
  html[data-portal-skin="dark"] .portal-workspace :is(.panel, .panel-body) {
    background-color: #222222; border-color: #353535;
  }
}

/* Local administrator cards include vendor layout tables between the tiles. */
@media screen {
  html[data-portal-skin="dark"] .portal-workspace [data-portal-control="ClientDetails/InventoryClientDetailsLocalAdmins"] .featured-box.portal-section {
    --portal-box-background: #222222;
    background: #222222 !important;
    border-color: #353535 !important;
  }
  html[data-portal-skin="dark"] .portal-workspace .portal-card-view .portal-local-admin-card {
    background-color: #222222 !important;
    border-color: #353535 !important;
    color: #f2f2f2;
  }
  html[data-portal-skin="dark"] .portal-workspace .portal-card-view .portal-local-admin-card.portal-local-admin-pending {
    background-color: #3a2529 !important;
    border-color: #815257 !important;
  }
  html[data-portal-skin="dark"] .portal-workspace .portal-local-admin-name { color: #f2f2f2 !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-local-admin-meta { color: #bdbdbd !important; }
  html[data-portal-skin="dark"] .portal-workspace .portal-local-admin-icon { filter: brightness(0) invert(1); opacity: .55 !important; }
  html[data-portal-skin="dark"] .portal-workspace [data-portal-control="ClientDetails/InventoryClientDetailsLocalAdmins"] .portal-grid :is([class*="dxgvTable"], [class*="dxgvDataRow"]:not([class*="Selected"]):not([class*="Focused"]), [class*="dxgvDataRow"]:not([class*="Selected"]):not([class*="Focused"]) > td) {
    background-color: transparent !important;
  }
}

/* Microsoft sign-in labels need light artwork on dark button surfaces. */
@media screen {
  html[data-portal-skin="dark"] .portal-workspace .portal-sso-mark-okta { color: #69baff; }
  html[data-portal-skin="dark"] .portal-workspace .portal-sso-mark-neutral { filter: brightness(0) invert(1); opacity: .8; }
}

/* Keep full-width supplementary bands flat in the Admin audit action-rail trial. */
html[data-portal-skin="dark"] .portal-workspace .portal-audit-action-rail .portal-card.portal-audit-extra { background: transparent !important; }
html[data-portal-skin="dark"] .portal-workspace .portal-audit-action-rail .portal-audit-flow .portal-card.portal-audit-extra { border-top: 1px solid var(--audit-line) !important; }

/* Email editor chrome follows the portal skin; document content keeps its own colors. */
html[data-portal-skin="dark"] .portal-workspace :is(.dxheControl_Office365, .dxheControl_MaterialCompact) {
  background: #222222;
  border-color: #555555 !important;
}
html[data-portal-skin="dark"] .portal-workspace :is(.dxheControl_Office365, .dxheControl_MaterialCompact) :is(:is(.dxtbControl_Office365, .dxtbControl_MaterialCompact), :is(.dxtbControl_Office365, .dxtbControl_MaterialCompact) .dxm-main, :is(.dxheStatusBar_Office365, .dxheStatusBar_MaterialCompact)) {
  background: #282828 !important;
  color: #dedede !important;
  border-color: #454545 !important;
}
html[data-portal-skin="dark"] .portal-workspace :is(.dxheControl_Office365, .dxheControl_MaterialCompact) :is(.dxtbControl_Office365, .dxtbControl_MaterialCompact) :is(.dxm-item, .dxm-content) {
  color: #dedede !important;
}
html[data-portal-skin="dark"] .portal-workspace :is(.dxheControl_Office365, .dxheControl_MaterialCompact) :is(.dxtbControl_Office365, .dxtbControl_MaterialCompact) :is(.dxm-hovered, .dxm-selected) {
  background: #454545 !important;
}
html[data-portal-skin="dark"] .portal-workspace :is(.dxheControl_Office365, .dxheControl_MaterialCompact) :is(.dxtbControl_Office365, .dxtbControl_MaterialCompact) .dxm-separator b {
  background: #454545 !important;
}
html[data-portal-skin="dark"] .portal-workspace :is(.dxheControl_Office365, .dxheControl_MaterialCompact) :is(.dxtbControl_Office365, .dxtbControl_MaterialCompact) :is(.dxm-image, .dxm-popOut img) {
  filter: brightness(0) invert(.8);
}
html[data-portal-skin="dark"] .portal-workspace :is(.dxheControl_Office365, .dxheControl_MaterialCompact) :is(.dxtbControl_Office365, .dxtbControl_MaterialCompact) .dxm-disabled {
  opacity: .4;
}
html[data-portal-skin="dark"] .portal-workspace :is(.dxheControl_Office365, .dxheControl_MaterialCompact) :is(:is(.dxheViewArea_Office365, .dxheViewArea_MaterialCompact), :is(.dxheStatusBar_Office365, .dxheStatusBar_MaterialCompact) .dxtc-stripContainer > li) {
  border-color: #454545 !important;
}

@media screen {
  html[data-portal-skin="mixed"] .portal-workspace .portal-sidebar .portal-settings-search {
    color-scheme: dark;
    --portal-surface: #1c2228;
    --portal-text: #e6e9ed;
    --portal-muted: #aeb8c3;
    --portal-border: #46515d;
    --portal-hover: #2e363f;
  }
  html[data-portal-skin="mixed"] .portal-workspace .portal-sidebar .portal-settings-search input::placeholder { color: #aeb8c3; opacity: 1; }
}
/* Combo popups can live outside the report container. Keep item states on the shell. */
.portal-shell [class*="dxeListBoxItem"]:not([class*="Disabled"]):is(:hover, :focus-visible, [class*="Hover"]) {
  background-color: #ededed !important; color: #242424 !important;
}
.portal-shell [class*="dxeListBoxItemSelected"],
.portal-shell [class*="dxeListBoxItemSelected"]:not([class*="Disabled"]):is(:hover, :focus-visible, [class*="Hover"]) { background-color: #d2d2d2 !important; color: #242424 !important; }
html[data-portal-skin="dark"] .portal-shell [class*="dxeListBoxItem"] { background-color: #1e1e1e !important; color: #f2f2f2 !important; }
html[data-portal-skin="dark"] .portal-shell [class*="dxeListBoxItem"]:not([class*="Disabled"]):is(:hover, :focus-visible, [class*="Hover"]) {
  background-color: #393939 !important; color: #fff !important;
}
html[data-portal-skin="dark"] .portal-shell [class*="dxeListBoxItemSelected"],
html[data-portal-skin="dark"] .portal-shell [class*="dxeListBoxItemSelected"]:not([class*="Disabled"]):is(:hover, :focus-visible, [class*="Hover"]) { background-color: #555 !important; color: #fff !important; }
html body.portal-shell :is(.portal-workspace,#topNav,#topHead) .portal-input:focus-within { border-color:#888 !important; box-shadow:0 0 0 3px rgba(128,128,128,.18); }
.portal-ui .portal-action-dropdown input { user-select: none !important; -webkit-user-select: none !important; caret-color: transparent !important; }
.portal-ui .portal-action-dropdown input::selection { background: transparent !important; color: var(--portal-text) !important; }

/* Previous changelog values are quieter than the new values in every skin. */
.portal-workspace .portal-settings-changelog .portal-grid td.portal-changelog-from { color: #777 !important; }
html[data-portal-skin="dark"] .portal-workspace .portal-settings-changelog .portal-grid td.portal-changelog-from,
html[data-portal-skin="mixed"] .portal-workspace .portal-settings-changelog .portal-grid td.portal-changelog-from { color: var(--portal-muted, #a8a8a8) !important; }

/* Keep the inline editor's Save distinct from New, Edit, and Cancel in every skin. */
html body.portal-shell .portal-workspace .portal-grid .portal-grid-save {
  display: inline-block;
  padding: 6px 16px !important;
  border: 1px solid #d64f36 !important;
  border-radius: 6px;
  background: #e66048 !important;
  color: #fff !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}
html body.portal-shell .portal-workspace .portal-grid .portal-grid-save :is(span, .dxb) {
  background: transparent !important;
  color: inherit !important;
}
html body.portal-shell .portal-workspace .portal-grid .portal-grid-save:is(:hover, :focus-visible) {
  border-color: #bf412b !important;
  background: #ce4c34 !important;
  color: #fff !important;
}
html body.portal-shell .portal-workspace .portal-grid .portal-grid-save:focus-visible {
  outline: 2px solid #f49b80;
  outline-offset: 2px;
}