@import "./variables";

body.light {
  --color-background: #{$color-background-light};
  --color-background-secondary: #{$color-background-secondary-light};
  --color-background-inverse: #{$color-background-inverse-light};
  --color-background-gray: #{$color-background-gray-light};
  --color-background-disabled: #{$color-background-disabled-light};
  --color-background-highlight: #{$color-background-highlight-light};
  --color-background-raised: #{$color-background-raised-light};
  --color-background-edit: #{$color-background-edit-light};
  --color-background-gray-emp: #{$color-background-gray-emp-light};
  --color-background-hover: #{$color-background-hover-light};
  --color-background-pressed: #{$color-background-pressed-light};
  --color-background-selected: #{$color-background-selected-light};
  --color-selection-indicator: #{$color-selection-indicator-light};
  --color-notification-badge: #{$color-notification-badge-light};
  --color-notification-indicator: #{$color-notification-indicator-light};
  --color-hover: #{$color-hover-light};
  --color-curtain: #{$color-curtain-light};
  --color-border: #{$color-border-light};
  --color-border-disabled: #{$color-border-disabled-light};
  --color-border-grid: #{$color-border-grid-light};
  --color-border-de-emp: #{$color-border-de-emp-light};
  --color-selection: #{$color-selection-light};
  --color-logo: #{$color-logo-light};
  --color-foreground: #{$color-foreground-light};
  --color-foreground-light: #{$color-foreground-light-light};
  --color-foreground-emp: #{$color-foreground-emp-light};
  --color-foreground-de-emp: #{$color-foreground-de-emp-light};
  --color-foreground-disable: #{$color-foreground-disable-light};
  --color-foreground-inverse: #{$color-foreground-inverse-light};
  --color-foreground-highlight: #{$color-foreground-highlight-light};
  --color-foreground-highlight-selected: #{$color-foreground-highlight-selected-light};
  --color-foreground-highlight-selected-hover: #{$color-foreground-highlight-selected-hover-light};
  --color-foreground-link: #{$color-foreground-link-light};
  --color-foreground-link-pressed: #{$color-foreground-link-pressed-light};
  --color-foreground-inv-de-emp: #{$color-foreground-inv-de-emp-light};
  --color-primary: #{$color-primary-light};
  --color-primary-lighter: #{$color-primary-lighter-light};
  --color-primary-darker: #{$color-primary-darker-light};
  --color-primary-hover: #{$color-primary-hover-light};
  --color-primary-focused: #{$color-primary-focused-light};
  --color-primary-pressed: #{$color-primary-pressed-light};
  --color-secondary-focused: #{$color-secondary-focused-light};
  --color-secondary-pressed: #{$color-secondary-pressed-light};
  --color-chip-default-background: #{$color-chip-default-background-light};
  --color-chip-error-background: #{$color-chip-error-background-light};
  --color-chip-warning-background: #{$color-chip-warning-background-light};
  --color-chip-info-background: #{$color-chip-info-background-light};
  --color-chip-success-background: #{$color-chip-success-background-light};
  --color-error-icon: #{$color-error-icon-light};
  --color-error-icon-inverse: #{$color-error-icon-inverse-light};
  --color-error-text: #{$color-error-text-light};
  --color-error-background: #{$color-error-background-light};
  --color-error-foreground-inverse: #{$color-error-foreground-inverse-light};
  --color-info-foreground: #{$color-info-foreground-light};
  --color-info-icon: #{$color-info-icon-light};
  --color-info-icon-inverse: #{$color-info-icon-inverse-light};
  --color-info-text: #{$color-info-text-light};
  --color-info-foreground-inverse: #{$color-info-foreground-inverse-light};
  --color-info-background: #{$color-info-background-light};
  --color-success-icon: #{$color-success-icon-light};
  --color-success-icon-inverse: #{$color-success-icon-inverse-light};
  --color-success-text: #{$color-success-text-light};
  --color-success-background: #{$color-success-background-light};
  --color-success-foreground-inverse: #{$color-success-foreground-inverse-light};
  --color-warning-icon: #{$color-warning-icon-light};
  --color-warning-icon-inverse: #{$color-warning-icon-inverse-light};
  --color-warning-text: #{$color-warning-text-light};
  --color-warning-background: #{$color-warning-background-light};
  --color-warning-foreground-inverse: #{$color-warning-foreground-inverse-light};
  --color-icon-default: #{$color-icon-default-light};
  --color-icon-inverted-default: #{$color-icon-inverted-default-light};
  --color-toggle-off-hover: #{$color-toggle-off-hover-light};
  --color-toggle-off-focus: #{$color-toggle-off-focus-light};
  --color-toggle-off-pressed: #{$color-toggle-off-pressed-light};
  --color-toggle-on-hover: #{$color-toggle-on-hover-light};
  --color-toggle-on-focus: #{$color-toggle-on-focus-light};
  --color-toggle-on-pressed: #{$color-toggle-on-pressed-light};
  --color-callout-background: #{$color-callout-background-light};
  --color-warn: #{$color-warn-light};
  --color-warn-darker: #{$color-warn-darker-light};
  --color-warn-hover: #{$color-warn-hover-light};
  --color-warn-focus: #{$color-warn-focus-light};
  --color-warn-pressed: #{$color-warn-pressed-light};
  --color-carousel-background: #{$color-carousel-background-light};
  --color-icon-button-hover: #{$color-icon-button-hover-light};
  --color-icon-button-focus: #{$color-icon-button-focus-light};
  --color-icon-button-pressed: #{$color-icon-button-pressed-light};
  --color-code-function: #{$color-code-function-light};
  --color-code-operator: #{$color-code-operator-light};
  --color-code-numeric: #{$color-code-numeric-light};
  --color-code-text: #{$color-code-text-light};
  --color-toggle-thumb-off: #{$color-toggle-thumb-off-light};
  --color-toggle-track-off: #{$color-toggle-track-off-light};
  --color-toggle-thumb-on: #{$color-toggle-thumb-on-light};
  --color-toggle-track-on: #{$color-toggle-track-on-light};
  --color-toggle-thumb-off-disabled: #{$color-toggle-thumb-off-disabled-light};
  --color-toggle-track-off-disabled: #{$color-toggle-track-off-disabled-light};
  --color-toggle-thumb-on-disabled: #{$color-toggle-thumb-on-disabled-light};
  --color-toggle-track-on-disabled: #{$color-toggle-track-on-disabled-light};
  --color-skeleton: #{$color-skeleton-light};
  --color-skeleton-glow: #{$color-skeleton-glow-light};
  --color-data-grid-hover: #{$color-data-grid-hover-light};
  --color-data-grid-pressed: #{$color-data-grid-pressed-light};
  --color-focus-indicator: #{$color-focus-indicator-light};
  --color-focus-indicator-inverse: #{$color-focus-indicator-inverse-light};
  --color-chart-purple: #{$color-chart-purple-light};
  --color-chart-pink: #{$color-chart-pink-light};
  --color-chart-blue-secondary: #{$color-chart-blue-secondary-light};
  --color-chart-light-blue: #{$color-chart-light-blue-light};
  --color-chart-green: #{$color-chart-green-light};
  --color-chart-yellow: #{$color-chart-yellow-light};
  --color-gradient-general-start: #{$color-gradient-general-start-light};
  --color-gradient-general-end: #{$color-gradient-general-end-light};
  --color-gradient-agent-start: #{$color-gradient-agent-start-light};
  --color-gradient-agent-end: #{$color-gradient-agent-end-light};
  --color-gradient-invoked-start: #{$color-gradient-invoked-start-light};
  --color-gradient-invoked-end: #{$color-gradient-invoked-end-light};
  --color-gradient-human-start: #{$color-gradient-human-start-light};
  --color-gradient-human-end: #{$color-gradient-human-end-light};

  --border: #{$border-light};
  color-scheme: light;
}

body.light-hc {
  --color-background: #{$color-background-light-hc};
  --color-background-secondary: #{$color-background-secondary-light-hc};
  --color-background-inverse: #{$color-background-inverse-light-hc};
  --color-background-gray: #{$color-background-gray-light-hc};
  --color-background-disabled: #{$color-background-disabled-light-hc};
  --color-background-highlight: #{$color-background-highlight-light-hc};
  --color-background-raised: #{$color-background-raised-light-hc};
  --color-background-edit: #{$color-background-edit-light-hc};
  --color-background-gray-emp: #{$color-background-gray-emp-light-hc};
  --color-background-hover: #{$color-background-hover-light-hc};
  --color-background-pressed: #{$color-background-pressed-light-hc};
  --color-background-selected: #{$color-background-selected-light-hc};
  --color-selection-indicator: #{$color-selection-indicator-light-hc};
  --color-notification-badge: #{$color-notification-badge-light-hc};
  --color-notification-indicator: #{$color-notification-indicator-light-hc};
  --color-hover: #{$color-hover-light-hc};
  --color-curtain: #{$color-curtain-light-hc};
  --color-border: #{$color-border-light-hc};
  --color-border-disabled: #{$color-border-disabled-light-hc};
  --color-border-grid: #{$color-border-grid-light-hc};
  --color-border-de-emp: #{$color-border-de-emp-light-hc};
  --color-selection: #{$color-selection-light-hc};
  --color-logo: #{$color-logo-light-hc};
  --color-foreground: #{$color-foreground-light-hc};
  --color-foreground-light: #{$color-foreground-light-light-hc};
  --color-foreground-emp: #{$color-foreground-emp-light-hc};
  --color-foreground-de-emp: #{$color-foreground-de-emp-light-hc};
  --color-foreground-disable: #{$color-foreground-disable-light-hc};
  --color-foreground-inverse: #{$color-foreground-inverse-light-hc};
  --color-foreground-highlight: #{$color-foreground-highlight-light-hc};
  --color-foreground-highlight-selected: #{$color-foreground-highlight-selected-light-hc};
  --color-foreground-highlight-selected-hover: #{$color-foreground-highlight-selected-hover-light-hc};
  --color-foreground-link: #{$color-foreground-link-light-hc};
  --color-foreground-link-pressed: #{$color-foreground-link-pressed-light-hc};
  --color-foreground-inv-de-emp: #{$color-foreground-inv-de-emp-light-hc};
  --color-primary: #{$color-primary-light-hc};
  --color-primary-lighter: #{$color-primary-lighter-light-hc};
  --color-primary-darker: #{$color-primary-darker-light-hc};
  --color-primary-hover: #{$color-primary-hover-light-hc};
  --color-primary-focused: #{$color-primary-focused-light-hc};
  --color-primary-pressed: #{$color-primary-pressed-light-hc};
  --color-secondary-focused: #{$color-secondary-focused-light-hc};
  --color-secondary-pressed: #{$color-secondary-pressed-light-hc};
  --color-chip-default-background: #{$color-chip-default-background-light-hc};
  --color-chip-error-background: #{$color-chip-error-background-light-hc};
  --color-chip-warning-background: #{$color-chip-warning-background-light-hc};
  --color-chip-info-background: #{$color-chip-info-background-light-hc};
  --color-chip-success-background: #{$color-chip-success-background-light-hc};
  --color-error-icon: #{$color-error-icon-light-hc};
  --color-error-icon-inverse: #{$color-error-icon-inverse-light-hc};
  --color-error-text: #{$color-error-text-light-hc};
  --color-error-background: #{$color-error-background-light-hc};
  --color-error-foreground-inverse: #{$color-error-foreground-inverse-light-hc};
  --color-info-foreground: #{$color-info-foreground-light-hc};
  --color-info-icon: #{$color-info-icon-light-hc};
  --color-info-icon-inverse: #{$color-info-icon-inverse-light-hc};
  --color-info-text: #{$color-info-text-light-hc};
  --color-info-foreground-inverse: #{$color-info-foreground-inverse-light-hc};
  --color-info-background: #{$color-info-background-light-hc};
  --color-success-icon: #{$color-success-icon-light-hc};
  --color-success-icon-inverse: #{$color-success-icon-inverse-light-hc};
  --color-success-text: #{$color-success-text-light-hc};
  --color-success-background: #{$color-success-background-light-hc};
  --color-success-foreground-inverse: #{$color-success-foreground-inverse-light-hc};
  --color-warning-icon: #{$color-warning-icon-light-hc};
  --color-warning-icon-inverse: #{$color-warning-icon-inverse-light-hc};
  --color-warning-text: #{$color-warning-text-light-hc};
  --color-warning-background: #{$color-warning-background-light-hc};
  --color-warning-foreground-inverse: #{$color-warning-foreground-inverse-light-hc};
  --color-icon-default: #{$color-icon-default-light-hc};
  --color-icon-inverted-default: #{$color-icon-inverted-default-light-hc};
  --color-toggle-off-hover: #{$color-toggle-off-hover-light-hc};
  --color-toggle-off-focus: #{$color-toggle-off-focus-light-hc};
  --color-toggle-off-pressed: #{$color-toggle-off-pressed-light-hc};
  --color-toggle-on-hover: #{$color-toggle-on-hover-light-hc};
  --color-toggle-on-focus: #{$color-toggle-on-focus-light-hc};
  --color-toggle-on-pressed: #{$color-toggle-on-pressed-light-hc};
  --color-callout-background: #{$color-callout-background-light-hc};
  --color-warn: #{$color-warn-light-hc};
  --color-warn-darker: #{$color-warn-darker-light-hc};
  --color-warn-hover: #{$color-warn-hover-light-hc};
  --color-warn-focus: #{$color-warn-focus-light-hc};
  --color-warn-pressed: #{$color-warn-pressed-light-hc};
  --color-carousel-background: #{$color-carousel-background-light-hc};
  --color-icon-button-hover: #{$color-icon-button-hover-light-hc};
  --color-icon-button-focus: #{$color-icon-button-focus-light-hc};
  --color-icon-button-pressed: #{$color-icon-button-pressed-light-hc};
  --color-code-function: #{$color-code-function-light-hc};
  --color-code-operator: #{$color-code-operator-light-hc};
  --color-code-numeric: #{$color-code-numeric-light-hc};
  --color-code-text: #{$color-code-text-light-hc};
  --color-toggle-thumb-off: #{$color-toggle-thumb-off-light-hc};
  --color-toggle-track-off: #{$color-toggle-track-off-light-hc};
  --color-toggle-thumb-on: #{$color-toggle-thumb-on-light-hc};
  --color-toggle-track-on: #{$color-toggle-track-on-light-hc};
  --color-toggle-thumb-off-disabled: #{$color-toggle-thumb-off-disabled-light-hc};
  --color-toggle-track-off-disabled: #{$color-toggle-track-off-disabled-light-hc};
  --color-toggle-thumb-on-disabled: #{$color-toggle-thumb-on-disabled-light-hc};
  --color-toggle-track-on-disabled: #{$color-toggle-track-on-disabled-light-hc};
  --color-skeleton: #{$color-skeleton-light-hc};
  --color-skeleton-glow: #{$color-skeleton-glow-light-hc};
  --color-data-grid-hover: #{$color-data-grid-hover-light-hc};
  --color-data-grid-pressed: #{$color-data-grid-pressed-light-hc};
  --color-focus-indicator: #{$color-focus-indicator-light-hc};
  --color-focus-indicator-inverse: #{$color-focus-indicator-inverse-light-hc};
  --color-chart-purple: #{$color-chart-purple-light-hc};
  --color-chart-pink: #{$color-chart-pink-light-hc};
  --color-chart-blue-secondary: #{$color-chart-blue-secondary-light-hc};
  --color-chart-light-blue: #{$color-chart-light-blue-light-hc};
  --color-chart-green: #{$color-chart-green-light-hc};
  --color-chart-yellow: #{$color-chart-yellow-light-hc};
  --color-gradient-general-start: #{$color-gradient-general-start-light-hc};
  --color-gradient-general-end: #{$color-gradient-general-end-light-hc};
  --color-gradient-agent-start: #{$color-gradient-agent-start-light-hc};
  --color-gradient-agent-end: #{$color-gradient-agent-end-light-hc};
  --color-gradient-invoked-start: #{$color-gradient-invoked-start-light-hc};
  --color-gradient-invoked-end: #{$color-gradient-invoked-end-light-hc};
  --color-gradient-human-start: #{$color-gradient-human-start-light-hc};
  --color-gradient-human-end: #{$color-gradient-human-end-light-hc};

  --border: #{$border-light-hc};
  color-scheme: light;
}

body.dark {
  --color-background: #{$color-background-dark};
  --color-background-secondary: #{$color-background-secondary-dark};
  --color-background-inverse: #{$color-background-inverse-dark};
  --color-background-gray: #{$color-background-gray-dark};
  --color-background-disabled: #{$color-background-disabled-dark};
  --color-background-highlight: #{$color-background-highlight-dark};
  --color-background-raised: #{$color-background-raised-dark};
  --color-background-edit: #{$color-background-edit-dark};
  --color-background-gray-emp: #{$color-background-gray-emp-dark};
  --color-background-hover: #{$color-background-hover-dark};
  --color-background-pressed: #{$color-background-pressed-dark};
  --color-background-selected: #{$color-background-selected-dark};
  --color-selection-indicator: #{$color-selection-indicator-dark};
  --color-notification-badge: #{$color-notification-badge-dark};
  --color-notification-indicator: #{$color-notification-indicator-dark};
  --color-hover: #{$color-hover-dark};
  --color-curtain: #{$color-curtain-dark};
  --color-border: #{$color-border-dark};
  --color-border-disabled: #{$color-border-disabled-dark};
  --color-border-grid: #{$color-border-grid-dark};
  --color-border-de-emp: #{$color-border-de-emp-dark};
  --color-selection: #{$color-selection-dark};
  --color-logo: #{$color-logo-dark};
  --color-foreground: #{$color-foreground-dark};
  --color-foreground-light: #{$color-foreground-light-dark};
  --color-foreground-emp: #{$color-foreground-emp-dark};
  --color-foreground-de-emp: #{$color-foreground-de-emp-dark};
  --color-foreground-disable: #{$color-foreground-disable-dark};
  --color-foreground-inverse: #{$color-foreground-inverse-dark};
  --color-foreground-highlight: #{$color-foreground-highlight-dark};
  --color-foreground-highlight-selected: #{$color-foreground-highlight-selected-dark};
  --color-foreground-highlight-selected-hover: #{$color-foreground-highlight-selected-hover-dark};
  --color-foreground-link: #{$color-foreground-link-dark};
  --color-foreground-link-pressed: #{$color-foreground-link-pressed-dark};
  --color-foreground-inv-de-emp: #{$color-foreground-inv-de-emp-dark};
  --color-primary: #{$color-primary-dark};
  --color-primary-lighter: #{$color-primary-lighter-dark};
  --color-primary-darker: #{$color-primary-darker-dark};
  --color-primary-hover: #{$color-primary-hover-dark};
  --color-primary-focused: #{$color-primary-focused-dark};
  --color-primary-pressed: #{$color-primary-pressed-dark};
  --color-secondary-focused: #{$color-secondary-focused-dark};
  --color-secondary-pressed: #{$color-secondary-pressed-dark};
  --color-chip-default-background: #{$color-chip-default-background-dark};
  --color-chip-error-background: #{$color-chip-error-background-dark};
  --color-chip-warning-background: #{$color-chip-warning-background-dark};
  --color-chip-info-background: #{$color-chip-info-background-dark};
  --color-chip-success-background: #{$color-chip-success-background-dark};
  --color-error-icon: #{$color-error-icon-dark};
  --color-error-icon-inverse: #{$color-error-icon-inverse-dark};
  --color-error-text: #{$color-error-text-dark};
  --color-error-background: #{$color-error-background-dark};
  --color-error-foreground-inverse: #{$color-error-foreground-inverse-dark};
  --color-info-foreground: #{$color-info-foreground-dark};
  --color-info-icon: #{$color-info-icon-dark};
  --color-info-icon-inverse: #{$color-info-icon-inverse-dark};
  --color-info-text: #{$color-info-text-dark};
  --color-info-foreground-inverse: #{$color-info-foreground-inverse-dark};
  --color-info-background: #{$color-info-background-dark};
  --color-success-icon: #{$color-success-icon-dark};
  --color-success-icon-inverse: #{$color-success-icon-inverse-dark};
  --color-success-text: #{$color-success-text-dark};
  --color-success-background: #{$color-success-background-dark};
  --color-success-foreground-inverse: #{$color-success-foreground-inverse-dark};
  --color-warning-icon: #{$color-warning-icon-dark};
  --color-warning-icon-inverse: #{$color-warning-icon-inverse-dark};
  --color-warning-text: #{$color-warning-text-dark};
  --color-warning-background: #{$color-warning-background-dark};
  --color-warning-foreground-inverse: #{$color-warning-foreground-inverse-dark};
  --color-icon-default: #{$color-icon-default-dark};
  --color-icon-inverted-default: #{$color-icon-inverted-default-dark};
  --color-toggle-off-hover: #{$color-toggle-off-hover-dark};
  --color-toggle-off-focus: #{$color-toggle-off-focus-dark};
  --color-toggle-off-pressed: #{$color-toggle-off-pressed-dark};
  --color-toggle-on-hover: #{$color-toggle-on-hover-dark};
  --color-toggle-on-focus: #{$color-toggle-on-focus-dark};
  --color-toggle-on-pressed: #{$color-toggle-on-pressed-dark};
  --color-callout-background: #{$color-callout-background-dark};
  --color-warn: #{$color-warn-dark};
  --color-warn-darker: #{$color-warn-darker-dark};
  --color-warn-hover: #{$color-warn-hover-dark};
  --color-warn-focus: #{$color-warn-focus-dark};
  --color-warn-pressed: #{$color-warn-pressed-dark};
  --color-carousel-background: #{$color-carousel-background-dark};
  --color-icon-button-hover: #{$color-icon-button-hover-dark};
  --color-icon-button-focus: #{$color-icon-button-focus-dark};
  --color-icon-button-pressed: #{$color-icon-button-pressed-dark};
  --color-code-function: #{$color-code-function-dark};
  --color-code-operator: #{$color-code-operator-dark};
  --color-code-numeric: #{$color-code-numeric-dark};
  --color-code-text: #{$color-code-text-dark};
  --color-toggle-thumb-off: #{$color-toggle-thumb-off-dark};
  --color-toggle-track-off: #{$color-toggle-track-off-dark};
  --color-toggle-thumb-on: #{$color-toggle-thumb-on-dark};
  --color-toggle-track-on: #{$color-toggle-track-on-dark};
  --color-toggle-thumb-off-disabled: #{$color-toggle-thumb-off-disabled-dark};
  --color-toggle-track-off-disabled: #{$color-toggle-track-off-disabled-dark};
  --color-toggle-thumb-on-disabled: #{$color-toggle-thumb-on-disabled-dark};
  --color-toggle-track-on-disabled: #{$color-toggle-track-on-disabled-dark};
  --color-skeleton: #{$color-skeleton-dark};
  --color-skeleton-glow: #{$color-skeleton-glow-dark};
  --color-data-grid-hover: #{$color-data-grid-hover-dark};
  --color-data-grid-pressed: #{$color-data-grid-pressed-dark};
  --color-focus-indicator: #{$color-focus-indicator-dark};
  --color-focus-indicator-inverse: #{$color-focus-indicator-inverse-dark};
  --color-chart-purple: #{$color-chart-purple-dark};
  --color-chart-pink: #{$color-chart-pink-dark};
  --color-chart-blue-secondary: #{$color-chart-blue-secondary-dark};
  --color-chart-light-blue: #{$color-chart-light-blue-dark};
  --color-chart-green: #{$color-chart-green-dark};
  --color-chart-yellow: #{$color-chart-yellow-dark};
  --color-gradient-general-start: #{$color-gradient-general-start-dark};
  --color-gradient-general-end: #{$color-gradient-general-end-dark};
  --color-gradient-agent-start: #{$color-gradient-agent-start-dark};
  --color-gradient-agent-end: #{$color-gradient-agent-end-dark};
  --color-gradient-invoked-start: #{$color-gradient-invoked-start-dark};
  --color-gradient-invoked-end: #{$color-gradient-invoked-end-dark};
  --color-gradient-human-start: #{$color-gradient-human-start-dark};
  --color-gradient-human-end: #{$color-gradient-human-end-dark};

  --border: #{$border-dark};
  color-scheme: dark;
}

body.dark-hc {
  --color-background: #{$color-background-dark-hc};
  --color-background-secondary: #{$color-background-secondary-dark-hc};
  --color-background-inverse: #{$color-background-inverse-dark-hc};
  --color-background-gray: #{$color-background-gray-dark-hc};
  --color-background-disabled: #{$color-background-disabled-dark-hc};
  --color-background-highlight: #{$color-background-highlight-dark-hc};
  --color-background-raised: #{$color-background-raised-dark-hc};
  --color-background-edit: #{$color-background-edit-dark-hc};
  --color-background-gray-emp: #{$color-background-gray-emp-dark-hc};
  --color-background-hover: #{$color-background-hover-dark-hc};
  --color-background-pressed: #{$color-background-pressed-dark-hc};
  --color-background-selected: #{$color-background-selected-dark-hc};
  --color-selection-indicator: #{$color-selection-indicator-dark-hc};
  --color-notification-badge: #{$color-notification-badge-dark-hc};
  --color-notification-indicator: #{$color-notification-indicator-dark-hc};
  --color-hover: #{$color-hover-dark-hc};
  --color-curtain: #{$color-curtain-dark-hc};
  --color-border: #{$color-border-dark-hc};
  --color-border-disabled: #{$color-border-disabled-dark-hc};
  --color-border-grid: #{$color-border-grid-dark-hc};
  --color-border-de-emp: #{$color-border-de-emp-dark-hc};
  --color-selection: #{$color-selection-dark-hc};
  --color-logo: #{$color-logo-dark-hc};
  --color-foreground: #{$color-foreground-dark-hc};
  --color-foreground-light: #{$color-foreground-light-dark-hc};
  --color-foreground-emp: #{$color-foreground-emp-dark-hc};
  --color-foreground-de-emp: #{$color-foreground-de-emp-dark-hc};
  --color-foreground-disable: #{$color-foreground-disable-dark-hc};
  --color-foreground-inverse: #{$color-foreground-inverse-dark-hc};
  --color-foreground-highlight: #{$color-foreground-highlight-dark-hc};
  --color-foreground-highlight-selected: #{$color-foreground-highlight-selected-dark-hc};
  --color-foreground-highlight-selected-hover: #{$color-foreground-highlight-selected-hover-dark-hc};
  --color-foreground-link: #{$color-foreground-link-dark-hc};
  --color-foreground-link-pressed: #{$color-foreground-link-pressed-dark-hc};
  --color-foreground-inv-de-emp: #{$color-foreground-inv-de-emp-dark-hc};
  --color-primary: #{$color-primary-dark-hc};
  --color-primary-lighter: #{$color-primary-lighter-dark-hc};
  --color-primary-darker: #{$color-primary-darker-dark-hc};
  --color-primary-hover: #{$color-primary-hover-dark-hc};
  --color-primary-focused: #{$color-primary-focused-dark-hc};
  --color-primary-pressed: #{$color-primary-pressed-dark-hc};
  --color-secondary-focused: #{$color-secondary-focused-dark-hc};
  --color-secondary-pressed: #{$color-secondary-pressed-dark-hc};
  --color-chip-default-background: #{$color-chip-default-background-dark-hc};
  --color-chip-error-background: #{$color-chip-error-background-dark-hc};
  --color-chip-warning-background: #{$color-chip-warning-background-dark-hc};
  --color-chip-info-background: #{$color-chip-info-background-dark-hc};
  --color-chip-success-background: #{$color-chip-success-background-dark-hc};
  --color-error-icon: #{$color-error-icon-dark-hc};
  --color-error-icon-inverse: #{$color-error-icon-inverse-dark-hc};
  --color-error-text: #{$color-error-text-dark-hc};
  --color-error-background: #{$color-error-background-dark-hc};
  --color-error-foreground-inverse: #{$color-error-foreground-inverse-dark-hc};
  --color-info-foreground: #{$color-info-foreground-dark-hc};
  --color-info-icon: #{$color-info-icon-dark-hc};
  --color-info-icon-inverse: #{$color-info-icon-inverse-dark-hc};
  --color-info-text: #{$color-info-text-dark-hc};
  --color-info-foreground-inverse: #{$color-info-foreground-inverse-dark-hc};
  --color-info-background: #{$color-info-background-dark-hc};
  --color-success-icon: #{$color-success-icon-dark-hc};
  --color-success-icon-inverse: #{$color-success-icon-inverse-dark-hc};
  --color-success-text: #{$color-success-text-dark-hc};
  --color-success-background: #{$color-success-background-dark-hc};
  --color-success-foreground-inverse: #{$color-success-foreground-inverse-dark-hc};
  --color-warning-icon: #{$color-warning-icon-dark-hc};
  --color-warning-icon-inverse: #{$color-warning-icon-inverse-dark-hc};
  --color-warning-text: #{$color-warning-text-dark-hc};
  --color-warning-background: #{$color-warning-background-dark-hc};
  --color-warning-foreground-inverse: #{$color-warning-foreground-inverse-dark-hc};
  --color-icon-default: #{$color-icon-default-dark-hc};
  --color-icon-inverted-default: #{$color-icon-inverted-default-dark-hc};
  --color-toggle-off-hover: #{$color-toggle-off-hover-dark-hc};
  --color-toggle-off-focus: #{$color-toggle-off-focus-dark-hc};
  --color-toggle-off-pressed: #{$color-toggle-off-pressed-dark-hc};
  --color-toggle-on-hover: #{$color-toggle-on-hover-dark-hc};
  --color-toggle-on-focus: #{$color-toggle-on-focus-dark-hc};
  --color-toggle-on-pressed: #{$color-toggle-on-pressed-dark-hc};
  --color-callout-background: #{$color-callout-background-dark-hc};
  --color-warn: #{$color-warn-dark-hc};
  --color-warn-darker: #{$color-warn-darker-dark-hc};
  --color-warn-hover: #{$color-warn-hover-dark-hc};
  --color-warn-focus: #{$color-warn-focus-dark-hc};
  --color-warn-pressed: #{$color-warn-pressed-dark-hc};
  --color-carousel-background: #{$color-carousel-background-dark-hc};
  --color-icon-button-hover: #{$color-icon-button-hover-dark-hc};
  --color-icon-button-focus: #{$color-icon-button-focus-dark-hc};
  --color-icon-button-pressed: #{$color-icon-button-pressed-dark-hc};
  --color-code-function: #{$color-code-function-dark-hc};
  --color-code-operator: #{$color-code-operator-dark-hc};
  --color-code-numeric: #{$color-code-numeric-dark-hc};
  --color-code-text: #{$color-code-text-dark-hc};
  --color-toggle-thumb-off: #{$color-toggle-thumb-off-dark-hc};
  --color-toggle-track-off: #{$color-toggle-track-off-dark-hc};
  --color-toggle-thumb-on: #{$color-toggle-thumb-on-dark-hc};
  --color-toggle-track-on: #{$color-toggle-track-on-dark-hc};
  --color-toggle-thumb-off-disabled: #{$color-toggle-thumb-off-disabled-dark-hc};
  --color-toggle-track-off-disabled: #{$color-toggle-track-off-disabled-dark-hc};
  --color-toggle-thumb-on-disabled: #{$color-toggle-thumb-on-disabled-dark-hc};
  --color-toggle-track-on-disabled: #{$color-toggle-track-on-disabled-dark-hc};
  --color-skeleton: #{$color-skeleton-dark-hc};
  --color-skeleton-glow: #{$color-skeleton-glow-dark-hc};
  --color-data-grid-hover: #{$color-data-grid-hover-dark-hc};
  --color-data-grid-pressed: #{$color-data-grid-pressed-dark-hc};
  --color-focus-indicator: #{$color-focus-indicator-dark-hc};
  --color-focus-indicator-inverse: #{$color-focus-indicator-inverse-dark-hc};
  --color-chart-purple: #{$color-chart-purple-dark-hc};
  --color-chart-pink: #{$color-chart-pink-dark-hc};
  --color-chart-blue-secondary: #{$color-chart-blue-secondary-dark-hc};
  --color-chart-light-blue: #{$color-chart-light-blue-dark-hc};
  --color-chart-green: #{$color-chart-green-dark-hc};
  --color-chart-yellow: #{$color-chart-yellow-dark-hc};
  --color-gradient-general-start: #{$color-gradient-general-start-dark-hc};
  --color-gradient-general-end: #{$color-gradient-general-end-dark-hc};
  --color-gradient-agent-start: #{$color-gradient-agent-start-dark-hc};
  --color-gradient-agent-end: #{$color-gradient-agent-end-dark-hc};
  --color-gradient-invoked-start: #{$color-gradient-invoked-start-dark-hc};
  --color-gradient-invoked-end: #{$color-gradient-invoked-end-dark-hc};
  --color-gradient-human-start: #{$color-gradient-human-start-dark-hc};
  --color-gradient-human-end: #{$color-gradient-human-end-dark-hc};

  --border: #{$border-dark-hc};
  color-scheme: dark;
}
