html[data-crm-skin="signal"] {
  --crm-canvas: #f1f2f3;
  --crm-surface: #ffffff;
  --crm-surface-soft: #f7f8f9;
  --crm-surface-strong: #eceef0;
  --crm-ink: #17191c;
  --crm-ink-soft: #555b64;
  --crm-line: #d9dde2;
  --crm-line-strong: #b9bec6;
  --crm-accent: #ffd400;
  --crm-accent-hover: #f3cb00;
  --crm-accent-soft: #fff7bf;
  --crm-accent-ink: #17191c;
  --crm-focus: color-mix(in srgb, #ffd400 42%, transparent);
  --crm-nav: #151719;
  --crm-nav-hover: #272b30;
  --crm-nav-text: #f5f6f7;
  --crm-nav-muted: #b8bdc5;
}

:root,
html[data-crm-skin="cobalt"] {
  --crm-canvas: #e9edf2;
  --crm-surface: #fbfcfd;
  --crm-surface-soft: #f1f5fa;
  --crm-surface-strong: #e2e8f0;
  --crm-ink: #172033;
  --crm-ink-soft: #667085;
  --crm-line: #d4dbe5;
  --crm-line-strong: #aeb8c7;
  --crm-accent: #2563eb;
  --crm-accent-hover: #1d4ed8;
  --crm-accent-soft: #dce8ff;
  --crm-accent-ink: #ffffff;
  --crm-focus: color-mix(in srgb, #2563eb 38%, transparent);
  --crm-nav: #e1e6ed;
  --crm-nav-hover: #d6dde6;
  --crm-nav-text: #172033;
  --crm-nav-muted: #596579;
}

html[data-crm-skin="forest"] {
  --crm-canvas: #e8e8e0;
  --crm-surface: #fdfdf8;
  --crm-surface-soft: #eef2e8;
  --crm-surface-strong: #e0e7da;
  --crm-ink: #222820;
  --crm-ink-soft: #667064;
  --crm-line: #d1d5ca;
  --crm-line-strong: #aeb6a7;
  --crm-accent: #9fd56d;
  --crm-accent-hover: #8bc457;
  --crm-accent-soft: #dff1cf;
  --crm-accent-ink: #1f291f;
  --crm-focus: color-mix(in srgb, #9fd56d 44%, transparent);
  --crm-nav: #263027;
  --crm-nav-hover: #364238;
  --crm-nav-text: #fbfdf8;
  --crm-nav-muted: #b8c2b5;
}

html[data-crm-skin="petrol"] {
  --crm-canvas: #dce9e8;
  --crm-surface: #f8fcfb;
  --crm-surface-soft: #eaf4f3;
  --crm-surface-strong: #d7e8e6;
  --crm-ink: #0b292c;
  --crm-ink-soft: #3f6264;
  --crm-line: #bdd3d1;
  --crm-line-strong: #86aaa7;
  --crm-accent: #5ce0c9;
  --crm-accent-hover: #39c7ae;
  --crm-accent-soft: #ccf5ed;
  --crm-accent-ink: #073234;
  --crm-focus: color-mix(in srgb, #5ce0c9 44%, transparent);
  --crm-nav: #06383c;
  --crm-nav-hover: #105056;
  --crm-nav-text: #f0fffc;
  --crm-nav-muted: #b7d9d4;
}

html[data-crm-skin="midnight"] {
  --crm-canvas: #dfe8f5;
  --crm-surface: #f8fbff;
  --crm-surface-soft: #e9f1fb;
  --crm-surface-strong: #d9e5f4;
  --crm-ink: #101928;
  --crm-ink-soft: #526177;
  --crm-line: #c2cfe0;
  --crm-line-strong: #91a3bb;
  --crm-accent: #1d4ed8;
  --crm-accent-hover: #1e40af;
  --crm-accent-soft: #dbeafe;
  --crm-accent-ink: #ffffff;
  --crm-focus: color-mix(in srgb, #1d4ed8 38%, transparent);
  --crm-nav: #101521;
  --crm-nav-hover: #202a3a;
  --crm-nav-text: #f4f8ff;
  --crm-nav-muted: #bac7d9;
}

:root {
  --crm-success: #247a48;
  --crm-success-soft: #f2fbf5;
  --crm-success-line: #add2bb;
  --crm-warning: #965d00;
  --crm-warning-soft: #fff9e9;
  --crm-warning-line: #e2c68d;
  --crm-danger: #b42318;
  --crm-danger-soft: #fff4f2;
  --crm-danger-line: #e7b4b0;
  --crm-radius-sm: 6px;
  --crm-radius-md: 10px;
  --crm-radius-lg: 14px;
  --crm-ease-out: cubic-bezier(.25, 1, .5, 1);
  --crm-ease-out-expo: cubic-bezier(.16, 1, .3, 1);
  --crm-z-sticky: 10;
  --crm-z-popover: 30;
  --crm-z-toast: 40;

}

html {
  color-scheme: light;
  background: var(--crm-canvas);
}