@import "./variables.css";

body.light {
  --color-background: #ffffff;
  --color-background-secondary: #f4f5f7;
  --color-background-inverse: #182027;
  --color-background-gray: #cfd8dd;
  --color-background-disabled: #ecedee;
  --color-background-highlight: #fee3dc;
  --color-background-raised: #ffffff;
  --color-background-edit: #ffffff;
  --color-background-gray-emp: #a4b1b8;
  --color-background-hover: #52606914;
  --color-background-pressed: #5260691f;
  --color-background-selected: #e9f1fa;
  --color-selection-indicator: #0067df;
  --color-notification-badge: #000000;
  --color-notification-indicator: #da3b11;
  --color-hover: #e9f1fa;
  --color-curtain: #000000;
  --color-border: #a4b1b8;
  --color-border-disabled: #cfd8dd;
  --color-border-grid: #f4f5f7;
  --color-border-de-emp: #cfd8dd;
  --color-selection: #da3b11;
  --color-logo: #fa4616;
  --color-foreground: #273139;
  --color-foreground-light: #6b7882;
  --color-foreground-emp: #182027;
  --color-foreground-de-emp: #526069;
  --color-foreground-disable: #8a97a0;
  --color-foreground-inverse: #f8f9fa;
  --color-foreground-highlight: #da3b11;
  --color-foreground-highlight-selected: #da3b111a;
  --color-foreground-highlight-selected-hover: #da3b1126;
  --color-foreground-link: #0067df;
  --color-foreground-link-pressed: #00489d;
  --color-foreground-inv-de-emp: #cfd8dd;
  --color-primary: #0067df;
  --color-primary-lighter: #badaff;
  --color-primary-darker: #00489d;
  --color-primary-hover: #0056ba;
  --color-primary-focused: #0056ba;
  --color-primary-pressed: #0067df;
  --color-secondary-focused: #e9f1fa;
  --color-secondary-pressed: #b2d2f3;
  --color-chip-default-background: #cfd8dd;
  --color-chip-error-background: #fff0f1;
  --color-chip-warning-background: #fff3db;
  --color-chip-info-background: #e9f1fa;
  --color-chip-success-background: #eeffe5;
  --color-error-icon: #cc3d45;
  --color-error-icon-inverse: #ff8484;
  --color-error-text: #a6040a;
  --color-error-background: #fff0f1;
  --color-error-foreground-inverse: #ff8484;
  --color-info-foreground: #1665b3;
  --color-info-icon: #1976d2;
  --color-info-icon-inverse: #42a1ff;
  --color-info-text: #1665b3;
  --color-info-foreground-inverse: #42a1ff;
  --color-info-background: #e9f1fa;
  --color-success-icon: #038108;
  --color-success-icon-inverse: #74c94b;
  --color-success-text: #038108;
  --color-success-background: #eeffe5;
  --color-success-foreground-inverse: #74c94b;
  --color-warning-icon: #ffb40e;
  --color-warning-icon-inverse: #ffbb27;
  --color-warning-text: #9e6100;
  --color-warning-background: #fff3db;
  --color-warning-foreground-inverse: #ffbb27;
  --color-icon-default: #526069;
  --color-icon-inverted-default: #cfd8dd;
  --color-toggle-off-hover: #52606914;
  --color-toggle-off-focus: #52606914;
  --color-toggle-off-pressed: #5260691f;
  --color-toggle-on-hover: #0067df14;
  --color-toggle-on-focus: #0067df14;
  --color-toggle-on-pressed: #0067df1f;
  --color-callout-background: #00489d;
  --color-warn: #b6242b;
  --color-warn-darker: #a6040a;
  --color-warn-hover: #b6242b0a;
  --color-warn-focus: #b6242b1f;
  --color-warn-pressed: #b6242b14;
  --color-carousel-background: #f5f9fe;
  --color-icon-button-hover: #52606914;
  --color-icon-button-focus: #52606914;
  --color-icon-button-pressed: #5260691f;
  --color-code-function: #b748b6;
  --color-code-operator: #0067df;
  --color-code-numeric: #1e7f5a;
  --color-code-text: #d91153;
  --color-toggle-thumb-off: #526069;
  --color-toggle-track-off: #cfd8dd;
  --color-toggle-thumb-on: #0067df;
  --color-toggle-track-on: #badaff;
  --color-toggle-thumb-off-disabled: #cfd8dd;
  --color-toggle-track-off-disabled: #ecedee;
  --color-toggle-thumb-on-disabled: #0067df47;
  --color-toggle-track-on-disabled: #badaff61;
  --color-skeleton: #ecedee;
  --color-skeleton-glow: #fbfbfc;
  --color-data-grid-hover: #f1f2f3;
  --color-data-grid-pressed: #eaeced;
  --color-focus-indicator: #0067df;
  --color-focus-indicator-inverse: #66adff;
  --color-chart-purple: #933692;
  --color-chart-pink: #ed145b;
  --color-chart-blue-secondary: #42a1ff;
  --color-chart-light-blue: #38c6f4;
  --color-chart-green: #6eb84a;
  --color-chart-yellow: #ffb40e;
  --color-gradient-general-start: #fafafb;
  --color-gradient-general-end: #ecedef;
  --color-gradient-agent-start: #ffe0ff;
  --color-gradient-agent-end: #cfd9ff;
  --color-gradient-invoked-start: #ddfbf1;
  --color-gradient-invoked-end: #daf3ff;
  --color-gradient-human-start: #f6faff;
  --color-gradient-human-end: #d8eeff;

  --border: var(--border-light);
  color-scheme: light;
}

body.light-hc {
  --color-background: #ffffff;
  --color-background-secondary: #f4f5f7;
  --color-background-inverse: #182027;
  --color-background-gray: #cfd8dd;
  --color-background-disabled: #ecedee;
  --color-background-highlight: #fee3dc;
  --color-background-raised: #ffffff;
  --color-background-edit: #ffffff;
  --color-background-gray-emp: #a4b1b8;
  --color-background-hover: #52606914;
  --color-background-pressed: #5260691f;
  --color-background-selected: #e9f1fa;
  --color-selection-indicator: #00489d;
  --color-notification-badge: #000000;
  --color-notification-indicator: #832107;
  --color-hover: #e9f1fa;
  --color-curtain: #000000;
  --color-border: #6b7882;
  --color-border-disabled: #cfd8dd;
  --color-border-grid: #f4f5f7;
  --color-border-de-emp: #a4b1b8;
  --color-selection: #832107;
  --color-logo: #fa4616;
  --color-foreground: #273139;
  --color-foreground-light: #374652;
  --color-foreground-emp: #182027;
  --color-foreground-de-emp: #374652;
  --color-foreground-disable: #8a97a0;
  --color-foreground-inverse: #f8f9fa;
  --color-foreground-highlight: #832107;
  --color-foreground-highlight-selected: #8321071a;
  --color-foreground-highlight-selected-hover: #83210726;
  --color-foreground-link: #00489d;
  --color-foreground-link-pressed: #00336f;
  --color-foreground-inv-de-emp: #cfd8dd;
  --color-primary: #00489d;
  --color-primary-lighter: #badaff;
  --color-primary-darker: #11508d;
  --color-primary-hover: #00336f;
  --color-primary-focused: #00336f;
  --color-primary-pressed: #00336f;
  --color-secondary-focused: #e9f1fa;
  --color-secondary-pressed: #b2d2f3;
  --color-chip-default-background: #cfd8dd;
  --color-chip-error-background: #fff0f1;
  --color-chip-warning-background: #fff3db;
  --color-chip-info-background: #e9f1fa;
  --color-chip-success-background: #eeffe5;
  --color-error-icon: #a6040a;
  --color-error-icon-inverse: #ff8484;
  --color-error-text: #a6040a;
  --color-error-background: #fff0f1;
  --color-error-foreground-inverse: #ff8484;
  --color-info-foreground: #11508d;
  --color-info-icon: #11508d;
  --color-info-icon-inverse: #42a1ff;
  --color-info-text: #11508d;
  --color-info-foreground-inverse: #42a1ff;
  --color-info-background: #e9f1fa;
  --color-success-icon: #005603;
  --color-success-icon-inverse: #74c94b;
  --color-success-text: #005603;
  --color-success-background: #eeffe5;
  --color-success-foreground-inverse: #74c94b;
  --color-warning-icon: #805a07;
  --color-warning-icon-inverse: #ffbb27;
  --color-warning-text: #273139;
  --color-warning-background: #fff3db;
  --color-warning-foreground-inverse: #ffbb27;
  --color-icon-default: #374652;
  --color-icon-inverted-default: #cfd8dd;
  --color-toggle-off-hover: #52606914;
  --color-toggle-off-focus: #52606914;
  --color-toggle-off-pressed: #5260691f;
  --color-toggle-on-hover: #0067df14;
  --color-toggle-on-focus: #0067df14;
  --color-toggle-on-pressed: #0067df1f;
  --color-callout-background: #00489d;
  --color-warn: #b6242b;
  --color-warn-darker: #a6040a;
  --color-warn-hover: #b6242b0a;
  --color-warn-focus: #b6242b1f;
  --color-warn-pressed: #b6242b14;
  --color-carousel-background: #f5f9fe;
  --color-icon-button-hover: #52606914;
  --color-icon-button-focus: #52606914;
  --color-icon-button-pressed: #5260691f;
  --color-code-function: #8c338b;
  --color-code-operator: #00489d;
  --color-code-numeric: #176245;
  --color-code-text: #a60e3f;
  --color-toggle-thumb-off: #374652;
  --color-toggle-track-off: #cfd8dd;
  --color-toggle-thumb-on: #00489d;
  --color-toggle-track-on: #badaff;
  --color-toggle-thumb-off-disabled: #cfd8dd;
  --color-toggle-track-off-disabled: #ecedee;
  --color-toggle-thumb-on-disabled: #0067df47;
  --color-toggle-track-on-disabled: #badaff61;
  --color-skeleton: #ecedee;
  --color-skeleton-glow: #fbfbfc;
  --color-data-grid-hover: #f1f2f3;
  --color-data-grid-pressed: #eaeced;
  --color-focus-indicator: #00489d;
  --color-focus-indicator-inverse: #badaff;
  --color-chart-purple: #8c338b;
  --color-chart-pink: #d91153;
  --color-chart-blue-secondary: #1976d2;
  --color-chart-light-blue: #278aab;
  --color-chart-green: #038108;
  --color-chart-yellow: #9e6100;
  --color-gradient-general-start: #fafafb;
  --color-gradient-general-end: #ecedef;
  --color-gradient-agent-start: #ffe0ff;
  --color-gradient-agent-end: #cfd9ff;
  --color-gradient-invoked-start: #ddfbf1;
  --color-gradient-invoked-end: #daf3ff;
  --color-gradient-human-start: #f6faff;
  --color-gradient-human-end: #d8eeff;

  --border: var(--border-light-hc);
  color-scheme: light;
}

body.dark {
  --color-background: #182027;
  --color-background-secondary: #273139;
  --color-background-inverse: #f8f9fa;
  --color-background-gray: #526069;
  --color-background-disabled: #273139;
  --color-background-highlight: #3c383c;
  --color-background-raised: #273139;
  --color-background-edit: #00000099;
  --color-background-gray-emp: #8a97a0;
  --color-background-hover: #cfd8dd14;
  --color-background-pressed: #cfd8dd1f;
  --color-background-selected: #374652;
  --color-selection-indicator: #66adff;
  --color-notification-badge: #ffffff;
  --color-notification-indicator: #ff8f70;
  --color-hover: #374652;
  --color-curtain: #000000;
  --color-border: #8a97a0;
  --color-border-disabled: #526069;
  --color-border-grid: #273139;
  --color-border-de-emp: #526069;
  --color-selection: #ff8f70;
  --color-logo: #ffffff;
  --color-foreground: #f4f5f7;
  --color-foreground-light: #a4b1b8;
  --color-foreground-emp: #f8f9fa;
  --color-foreground-de-emp: #cfd8dd;
  --color-foreground-disable: #a4b1b8;
  --color-foreground-inverse: #182027;
  --color-foreground-highlight: #ff8f70;
  --color-foreground-highlight-selected: #ff8f701a;
  --color-foreground-highlight-selected-hover: #ff8f7026;
  --color-foreground-link: #66adff;
  --color-foreground-link-pressed: #badaff;
  --color-foreground-inv-de-emp: #526069;
  --color-primary: #66adff;
  --color-primary-lighter: #00489d;
  --color-primary-darker: #badaff;
  --color-primary-hover: #87bfff;
  --color-primary-focused: #87bfff;
  --color-primary-pressed: #66adff;
  --color-secondary-focused: #374652;
  --color-secondary-pressed: #11508d;
  --color-chip-default-background: #526069;
  --color-chip-error-background: #000000;
  --color-chip-warning-background: #000000;
  --color-chip-info-background: #000000;
  --color-chip-success-background: #000000;
  --color-error-icon: #ff8484;
  --color-error-icon-inverse: #cc3d45;
  --color-error-text: #ff8484;
  --color-error-background: #000000;
  --color-error-foreground-inverse: #cc3d45;
  --color-info-foreground: #42a1ff;
  --color-info-icon: #42a1ff;
  --color-info-icon-inverse: #1976d2;
  --color-info-text: #42a1ff;
  --color-info-foreground-inverse: #1976d2;
  --color-info-background: #000000;
  --color-success-icon: #74c94b;
  --color-success-icon-inverse: #038108;
  --color-success-text: #74c94b;
  --color-success-background: #000000;
  --color-success-foreground-inverse: #6eb84a;
  --color-warning-icon: #ffbb27;
  --color-warning-icon-inverse: #ffb40e;
  --color-warning-text: #ffe19e;
  --color-warning-background: #000000;
  --color-warning-foreground-inverse: #ffb40e;
  --color-icon-default: #cfd8dd;
  --color-icon-inverted-default: #526069;
  --color-toggle-off-hover: #cfd8dd14;
  --color-toggle-off-focus: #cfd8dd14;
  --color-toggle-off-pressed: #cfd8dd1f;
  --color-toggle-on-hover: #66adff14;
  --color-toggle-on-focus: #66adff14;
  --color-toggle-on-pressed: #66adff1f;
  --color-callout-background: #00489d;
  --color-warn: #ff8484;
  --color-warn-darker: #ffadad;
  --color-warn-hover: #ff84840a;
  --color-warn-focus: #ff84841f;
  --color-warn-pressed: #ff848414;
  --color-carousel-background: #1b2630;
  --color-icon-button-hover: #cfd8dd14;
  --color-icon-button-focus: #cfd8dd14;
  --color-icon-button-pressed: #cfd8dd1f;
  --color-code-function: #dc80db;
  --color-code-operator: #66adff;
  --color-code-numeric: #6ecdb6;
  --color-code-text: #f25a8c;
  --color-toggle-thumb-off: #cfd8dd;
  --color-toggle-track-off: #526069;
  --color-toggle-thumb-on: #66adff;
  --color-toggle-track-on: #00489d;
  --color-toggle-thumb-off-disabled: #526069;
  --color-toggle-track-off-disabled: #374652;
  --color-toggle-thumb-on-disabled: #66adff47;
  --color-toggle-track-on-disabled: #00489d61;
  --color-skeleton: #273139;
  --color-skeleton-glow: #525a61;
  --color-data-grid-hover: #272f36;
  --color-data-grid-pressed: #2e363d;
  --color-focus-indicator: #66adff;
  --color-focus-indicator-inverse: #0067df;
  --color-chart-purple: #b748b6;
  --color-chart-pink: #f25a8c;
  --color-chart-blue-secondary: #42a1ff;
  --color-chart-light-blue: #44cffc;
  --color-chart-green: #74c94b;
  --color-chart-yellow: #ffbb27;
  --color-gradient-general-start: #526069;
  --color-gradient-general-end: #323c42;
  --color-gradient-agent-start: #a280bc;
  --color-gradient-agent-end: #577bae;
  --color-gradient-invoked-start: #51868e;
  --color-gradient-invoked-end: #35667d;
  --color-gradient-human-start: #6885ab;
  --color-gradient-human-end: #2b5372;

  --border: var(--border-dark);
  color-scheme: dark;
}

body.dark-hc {
  --color-background: #182027;
  --color-background-secondary: #273139;
  --color-background-inverse: #f8f9fa;
  --color-background-gray: #374652;
  --color-background-disabled: #273139;
  --color-background-highlight: #3c383c;
  --color-background-raised: #273139;
  --color-background-edit: #00000099;
  --color-background-gray-emp: #a4b1b8;
  --color-background-hover: #a4b1b814;
  --color-background-pressed: #cfd8dd1f;
  --color-background-selected: #374652;
  --color-selection-indicator: #dae8fa;
  --color-notification-badge: #ffffff;
  --color-notification-indicator: #ff8f70;
  --color-hover: #273139;
  --color-curtain: #000000;
  --color-border: #bbc7cd;
  --color-border-disabled: #8a97a0;
  --color-border-grid: #273139;
  --color-border-de-emp: #a4b1b8;
  --color-selection: #fda891;
  --color-logo: #ffffff;
  --color-foreground: #f4f5f7;
  --color-foreground-light: #bbc7cd;
  --color-foreground-emp: #f8f9fa;
  --color-foreground-de-emp: #cfd8dd;
  --color-foreground-disable: #a4b1b8;
  --color-foreground-inverse: #182027;
  --color-foreground-highlight: #ff8f70;
  --color-foreground-highlight-selected: #ff8f701a;
  --color-foreground-highlight-selected-hover: #ff8f7026;
  --color-foreground-link: #87bfff;
  --color-foreground-link-pressed: #badaff;
  --color-foreground-inv-de-emp: #374652;
  --color-primary: #badaff;
  --color-primary-lighter: #00336f;
  --color-primary-darker: #badaff;
  --color-primary-hover: #87bfff;
  --color-primary-focused: #87bfff;
  --color-primary-pressed: #66adff;
  --color-secondary-focused: #273139;
  --color-secondary-pressed: #11508d;
  --color-chip-default-background: #526069;
  --color-chip-error-background: #000000;
  --color-chip-warning-background: #000000;
  --color-chip-info-background: #000000;
  --color-chip-success-background: #000000;
  --color-error-icon: #ffadad;
  --color-error-icon-inverse: #b6242b;
  --color-error-text: #ffadad;
  --color-error-background: #000000;
  --color-error-foreground-inverse: #b6242b;
  --color-info-foreground: #42a1ff;
  --color-info-icon: #8cc2f8;
  --color-info-icon-inverse: #0056ba;
  --color-info-text: #42a1ff;
  --color-info-foreground-inverse: #1976d2;
  --color-info-background: #000000;
  --color-success-icon: #74c94b;
  --color-success-icon-inverse: #6eb84a;
  --color-success-text: #74c94b;
  --color-success-background: #000000;
  --color-success-foreground-inverse: #6eb84a;
  --color-warning-icon: #ffbb27;
  --color-warning-icon-inverse: #ffb40e;
  --color-warning-text: #ffe19e;
  --color-warning-background: #000000;
  --color-warning-foreground-inverse: #ffb40e;
  --color-icon-default: #cfd8dd;
  --color-icon-inverted-default: #374652;
  --color-toggle-off-hover: #cfd8dd14;
  --color-toggle-off-focus: #cfd8dd14;
  --color-toggle-off-pressed: #cfd8dd1f;
  --color-toggle-on-hover: #66adff14;
  --color-toggle-on-focus: #66adff14;
  --color-toggle-on-pressed: #66adff1f;
  --color-callout-background: #00489d;
  --color-warn: #ffadad;
  --color-warn-darker: #ffadad;
  --color-warn-hover: #ff84840a;
  --color-warn-focus: #ff84841f;
  --color-warn-pressed: #ff848414;
  --color-carousel-background: #1b2630;
  --color-icon-button-hover: #cfd8dd14;
  --color-icon-button-focus: #cfd8dd14;
  --color-icon-button-pressed: #cfd8dd1f;
  --color-code-function: #dc80db;
  --color-code-operator: #66adff;
  --color-code-numeric: #6ecdb6;
  --color-code-text: #fd7da7;
  --color-toggle-thumb-off: #cfd8dd;
  --color-toggle-track-off: #526069;
  --color-toggle-thumb-on: #66adff;
  --color-toggle-track-on: #00489d;
  --color-toggle-thumb-off-disabled: #526069;
  --color-toggle-track-off-disabled: #374652;
  --color-toggle-thumb-on-disabled: #66adff47;
  --color-toggle-track-on-disabled: #00489d61;
  --color-skeleton: #273139;
  --color-skeleton-glow: #525a61;
  --color-data-grid-hover: #272f36;
  --color-data-grid-pressed: #2e363d;
  --color-focus-indicator: #b2d2f3;
  --color-focus-indicator-inverse: #0067df;
  --color-chart-purple: #dc80db;
  --color-chart-pink: #fd7da7;
  --color-chart-blue-secondary: #8cc2f8;
  --color-chart-light-blue: #44cffc;
  --color-chart-green: #74c94b;
  --color-chart-yellow: #ffbb27;
  --color-gradient-general-start: #526069;
  --color-gradient-general-end: #323c42;
  --color-gradient-agent-start: #a280bc;
  --color-gradient-agent-end: #577bae;
  --color-gradient-invoked-start: #51868e;
  --color-gradient-invoked-end: #35667d;
  --color-gradient-human-start: #6885ab;
  --color-gradient-human-end: #2b5372;

  --border: var(--border-dark-hc);
  color-scheme: dark;
}
