/* ============================================================ DARK MODE — CSS Variable Definitions ============================================================ Applied when #customcss has .dark-mode-enabled on . This block overrides all Gainsight CC config tokens for dark theme. Consumed by darkmode-overrides.css and any component CSS that uses var(--config-*) tokens. ============================================================ */ html:has(#customcss.dark-mode-enabled) { --config--main-border-base-color: #9aa0a6; --config--main-button-base-font-color: #e3e3e3; --config--main-color-alert: #ed5937ff; --config--main-color-brand: #4285F4; --config--main-color-brand-secondary: #1e1e4fff; --config--main-color-contrast: #2aaae1; --config--main-color-day: #f0f2f6; --config--main-color-day-dark: #ededed; --config--main-color-day-light: #fff; --config--main-color-disabled: #f6f8faff; --config--main-color-dusk: #9aa0a6; --config--main-color-dusk-dark: #616a73; --config--main-color-dusk-light: #d5d7db; --config--main-color-highlighted: #B0DFF3; --config--main-color-info: #f79321ff; --config--main-color-night: #121212; --config--main-color-night-inverted: #f5f5f5; --config--main-color-night-light: #2b2b2b; --config--main-color-success: #3cb54aff; --config-anchor-base-color: #3ea6ff; --config-anchor-base-hover-color: #3ea6ff; --config-avatar-notification-background-color: #3ea6ff; --config-body-background-color: #121212; --config-button-cancel-active-background-color: #DA5C5C; --config-button-cancel-active-border-color: #DA5C5C; --config-button-cancel-active-color: #fff; --config-button-cancel-background-color: #F76767; --config-button-cancel-border-color: #F76767; --config-button-cancel-color: #fff; --config-button-cancel-hover-background-color: #DA5C5C; --config-button-cancel-hover-border-color: #DA5C5C; --config-button-cancel-hover-color: #fff; --config-button-cta-active-background-color: #f1f1f1; --config-button-cta-active-border-color: #f1f1f1; --config-button-cta-active-color: #000; --config-button-cta-background-color: #f1f1f1; --config-button-cta-border-color: #f1f1f1; --config-button-cta-color: #000; --config-button-cta-focus-background-color: #f1f1f1; --config-button-cta-focus-border-color: #3ea6ff; --config-button-cta-focus-color: #000; --config-button-cta-hover-background-color: #f1f1f1; --config-button-cta-hover-border-color: #f1f1f1; --config-button-cta-hover-color: #000; --config-button-cta-spinner-color: #fff; --config-button-cta-spinner-hover-color: #fff; --config-button-secondary-active-background-color: #232323; --config-button-secondary-active-border-color: #232323; --config-button-secondary-active-color: #fafafa; --config-button-secondary-background-color: #232323; --config-button-secondary-border-color: #232323; --config-button-secondary-color: #fafafa; --config-button-secondary-focus-background-color: #232323; --config-button-secondary-focus-border-color: #3ea6ff; --config-button-secondary-focus-color: #fafafa; --config-button-secondary-hover-background-color: #232323; --config-button-secondary-hover-border-color: #232323; --config-button-secondary-hover-color: #fafafa; --config-button-secondary-spinner-color: #fff; --config-button-secondary-spinner-hover-color: #fff; --config-button-toggle-active-background-color: #000; --config-button-toggle-active-border-color: #000; --config-button-toggle-active-color: #fff; --config-button-toggle-background-color: rgba(0, 0, 0, 0); --config-button-toggle-border-color: #000; --config-button-toggle-color: #000; --config-button-toggle-filled-background-color: #4285F4; --config-button-toggle-filled-color: #fff; --config-button-toggle-filled-pseudo-color: #fff; --config-button-toggle-filled-spinner-color: #fff; --config-button-toggle-focus-border-color: #469c51ff; --config-button-toggle-hover-background-color: #d6d6d6; --config-button-toggle-hover-border-color: #000; --config-button-toggle-hover-color: #000; --config-button-toggle-on-active-background-color: #fff; --config-button-toggle-on-active-border-color: #322c74; --config-button-toggle-on-active-color: #322c74; --config-button-toggle-on-background-color: #5050D6; --config-button-toggle-on-border-color: #5050D6; --config-button-toggle-on-color: #ffffff; --config-button-toggle-on-hover-background-color: #fff; --config-button-toggle-on-hover-border-color: #5050D6; --config-button-toggle-on-hover-color: #322c74; --config-button-toggle-outline-background-color: #4285F4; --config-button-toggle-outline-color: #4285F4; --config-button-toggle-outline-pseudo-color: #4285F4; --config-button-toggle-outline-spinner-color: #4285F4; --config-content-type-article-color: #fff; --config-cookie-modal-background-color: rgba(60, 60, 60, .9); --config-cookie-modal-color: #fff; --config-create-topic-type-icon-color: #e3e3e3; --config-cta-close-button-color: #9aa0a6; --config-cta-icon-background-color: #3ea6ff; --config-cta-icon-check: #fff; --config-editor-comment-toolbar-background-color: #1e1e1e; --config-editor-comment-toolbar-button-color: #e3e3e3; --config-editor-comment-toolbar-button-hover-color: #3ea6ff; --config-footer-background-color: #121212; --config-footer-color: #e3e3e3; --config-header-color: #e3e3e3; --config-header-color-inverted: #f5f5f5; --config-hero-color: #e3e3e3; --config-hero-stats-background-color: #fff; --config-input-focus-color: #4285F4; --config-link-base-color: #3ea6ff; --config-link-base-hover-color: #3ea6ff; --config-main-navigation-background-color: #121212; --config-main-navigation-dropdown-background-color: #1e1e1e; --config-main-navigation-dropdown-color: #e3e3e3; --config-main-navigation-nav-color: #e3e3e3; --config-main-navigation-nav-link-color: #e3e3e3; --config-main-navigation-search-placeholder-color: #9aa0a6; --config-mention-selector-hover-selected-color: #e3e3e3; --config-meta-link-hover-color: #4285F4; --config-meta-text-color: #9aa0a6; --config-notification-widget-background-color: #f79321ff; --config-notification-widget-color: #ffffffff; --config-pagination-active-page-color: #3ea6ff; --config-paging-item-hover-color: #3ea6ff; --config-pill-color: #e3e3e3; --config-profile-user-statistics-background-color: #1e1e1e; --config-sidebar-widget-color: #e3e3e3; --config-subcategory-hero-color: #e3e3e3; --config-tag-modify-link-color: #3ea6ff; --config-tag-pill-background-color: #f8f8f8; --config-tag-pill-hover-background-color: #ceffffff; --config-tag-pill-hover-border-color: #4285F4; --config-tag-pill-hover-color: #3ea6ff; --config-thread-list-best-answer-background-color: #3cb54a0d; --config-thread-list-best-answer-border-color: #3cb54aff; --config-thread-list-mod-break-background: #4285f40d; --config-thread-list-mod-break-border-color: #3ea6ff; --config-thread-list-sticky-topic-background: #4285f4f2; --config-thread-list-sticky-topic-border-color: #3ea6ff; --config-thread-list-sticky-topic-flag-color: #3ea6ff; --config-thread-pill-answer-background-color: #3cb54aff; --config-thread-pill-author-background-color: #3ea6ff; --config-thread-pill-author-color: #fff; --config-thread-pill-question-background-color: #f79321ff; --config-thread-pill-question-color: #fff; --config-thread-pill-sticky-background-color: #3ea6ff; --config-thread-pill-sticky-color: #fff; --config-topic-page-answered-field-icon-color: #3cb54aff; --config-topic-page-answered-field-link-color: #3ea6ff; --config-topic-page-post-actions-active: #4285F4; --config-topic-page-post-actions-icon-color: #9aa0a6; --config-topic-page-quote-border-color: #2b2b2b; --config-topic-question-color: #f79321ff; --config-widget-cta-background-color: #f1f1f1; --config-widget-cta-color: #000; --config-widget-tabs-forum-list-header-color: #e3e3e3; --config-widget-tabs-forum-list-header-hover-color: #3ea6ff; --config-card-background-color: #1e1e1e; --config-card-title-color: #e3e3e3; --config-card-text-color: #e3e3e3; --config-card-border-color: #2b2b2b; --config-card-hover-background-color: #2b2b2b; --config-card-hover-title-color: #e3e3e3; --config-card-hover-text-color: #e3e3e3; --config-card-hover-border-color: #2b2b2b; --config-card-active-background-color: #1e1e1e; --config-card-active-title-color: #e3e3e3; --config-card-active-text-color: #e3e3e3; --config-card-active-border-color: #d6d6d6; --config-sidebar-background-color: transparent; --config-sidebar-border-color: transparent; --config-list-views-card-default-background-color: #1e1e1e; --config-list-views-card-default-title-color: #e3e3e3; --config-list-views-card-default-text-color: #e3e3e3; --config-list-views-card-default-border-color: #1e1e1e; --config-list-views-card-hover-background-color: #2b2b2b; --config-list-views-card-hover-title-color: #e3e3e3; --config-list-views-card-hover-text-color: #e3e3e3; --config-list-views-card-hover-border-color: #2b2b2b; --config-list-views-card-click-background-color: #2b2b2b; --config-list-views-card-click-title-color: #e3e3e3; --config-list-views-card-click-text-color: #e3e3e3; --config-list-views-card-click-border-color: #2b2b2b; --config-sidebar-widget-username-color: #e3e3e3; --config-username-hover-color: #3ea6ff; --config-content-type-survey-background-color: #1e1e1e; --config-content-type-survey-color: #e3e3e3; --config-checkbox-checked-color: #3ea6ff; --config-content-type-article-background-color: #322c75; --config-main-navigation-dropdown-hover-color: #3ea6ff; --config-meta-icon-color: #9aa0a6; --config-tag-pill-border-color: #e3e4ec; --config-tag-pill-color: #e3e3e3; --config-username-color: #e3e3e3; --config-widget-tabs-active-border-color: #3ea6ff; --config-widgets-action-link-color: #3ea6ff; }