@dls-color-brand: #0052cc;
@dls-color-brand-0: #fff;
@dls-color-brand-1: #f2f7ff;
@dls-color-brand-2: #e1edff;
@dls-color-brand-3: #c0d9ff;
@dls-color-brand-4: #8fbcff;
@dls-color-brand-5: #4f96ff;
@dls-color-brand-6: #0066ff;
@dls-color-brand-7: #0052cc;
@dls-color-brand-8: #0046ad;
@dls-color-brand-9: #003585;
@dls-color-brand-10: #002152;
@dls-color-brand-11: #000;
@dls-color-info: #0052cc;
@dls-color-info-0: #fff;
@dls-color-info-1: #f2f7ff;
@dls-color-info-2: #e1edff;
@dls-color-info-3: #c0d9ff;
@dls-color-info-4: #8fbcff;
@dls-color-info-5: #4f96ff;
@dls-color-info-6: #0066ff;
@dls-color-info-7: #0052cc;
@dls-color-info-8: #0046ad;
@dls-color-info-9: #003585;
@dls-color-info-10: #002152;
@dls-color-info-11: #000;
@dls-color-success: #00bf5c;
@dls-color-success-0: #fff;
@dls-color-success-1: #f2fff8;
@dls-color-success-2: #e1ffef;
@dls-color-success-3: #c0ffde;
@dls-color-success-4: #8fffc5;
@dls-color-success-5: #4fffa4;
@dls-color-success-6: #00f275;
@dls-color-success-7: #00bf5c;
@dls-color-success-8: #00a24e;
@dls-color-success-9: #007c3c;
@dls-color-success-10: #004c25;
@dls-color-success-11: #000;
@dls-color-warning: #ff9100;
@dls-color-warning-0: #fff;
@dls-color-warning-1: #fffaf2;
@dls-color-warning-2: #fff4e4;
@dls-color-warning-3: #ffe8ca;
@dls-color-warning-4: #ffd8a4;
@dls-color-warning-5: #ffc272;
@dls-color-warning-6: #ffa733;
@dls-color-warning-7: #ff9100;
@dls-color-warning-8: #d97b00;
@dls-color-warning-9: #a65e00;
@dls-color-warning-10: #663a00;
@dls-color-warning-11: #000;
@dls-color-error: #cc1800;
@dls-color-error-0: #fff;
@dls-color-error-1: #fff4f2;
@dls-color-error-2: #ffe4e1;
@dls-color-error-3: #ffc7c0;
@dls-color-error-4: #ff9d8f;
@dls-color-error-5: #ff644f;
@dls-color-error-6: #ff1e00;
@dls-color-error-7: #cc1800;
@dls-color-error-8: #ad1400;
@dls-color-error-9: #851000;
@dls-color-error-10: #520a00;
@dls-color-error-11: #000;
@dls-color-gray-0: #fff;
@dls-color-gray-1: #f6f7fa;
@dls-color-gray-2: #ebedf5;
@dls-color-gray-3: #e2e6f0;
@dls-color-gray-4: #d3d9e6;
@dls-color-gray-5: #c5ccdb;
@dls-color-gray-6: #a8b0bf;
@dls-color-gray-7: #848b99;
@dls-color-gray-8: #545b66;
@dls-color-gray-9: #282c33;
@dls-color-gray-10: #0a0b0d;
@dls-color-gray-11: #000;
@dls-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
@dls-font-size-0: 12px;
@dls-font-size-1: 14px;
@dls-font-size-2: 16px;
@dls-font-size-3: 18px;
@dls-font-size-4: 20px;
@dls-font-size-5: 24px;
@dls-font-size-6: 32px;
@dls-font-weight-1: 400;
@dls-font-weight-2: 500;
@dls-font-weight-3: 600;
@dls-line-height-1: 1.4;
@dls-line-height-2: 1.6;
@dls-line-height-3: 1.8;
@dls-spacing-unit: 4px;
@dls-padding-unit: 4px;
@dls-height-unit: 4px;
@dls-height-xs: 24px;
@dls-height-s: 28px;
@dls-height-m: 32px;
@dls-height-l: 36px;
@dls-height-xl: 40px;
@dls-foreground-color-reverse: #fff;
@dls-foreground-color-primary-reverse: #fff;
@dls-foreground-color-primary: #0052cc;
@dls-foreground-color-primary-hover: #0066ff;
@dls-foreground-color-primary-active: #0046ad;
@dls-foreground-color-primary-disabled: #8fbcff;
@dls-foreground-color-neutral: #282c33;
@dls-foreground-color-neutral-hover: #545b66;
@dls-foreground-color-neutral-active: #000;
@dls-foreground-color-neutral-disabled: #a8b0bf;
@dls-foreground-color-neutral-strong: #000;
@dls-foreground-color-neutral-strong-hover: #0a0b0d;
@dls-foreground-color-neutral-strong-active: #000;
@dls-foreground-color-neutral-strong-disabled: #a8b0bf;
@dls-foreground-color-neutral-light: #545b66;
@dls-foreground-color-neutral-light-hover: #848b99;
@dls-foreground-color-neutral-light-active: #282c33;
@dls-foreground-color-neutral-light-disabled: #a8b0bf;
@dls-foreground-color-neutral-weak: #848b99;
@dls-foreground-color-neutral-weak-hover: #545b66;
@dls-foreground-color-neutral-weak-active: #282c33;
@dls-foreground-color-neutral-weak-disabled: #c5ccdb;
@dls-foreground-color-neutral-dim: #a8b0bf;
@dls-foreground-color-neutral-dim-hover: #848b99;
@dls-foreground-color-neutral-dim-active: #545b66;
@dls-foreground-color-neutral-dim-disabled: #e2e6f0;
@dls-foreground-color-neutral-highlightable: #282c33;
@dls-foreground-color-neutral-highlightable-hover: #0066ff;
@dls-foreground-color-neutral-highlightable-active: #0046ad;
@dls-foreground-color-neutral-highlightable-disabled: #a8b0bf;
@dls-foreground-color-info-primary: #0052cc;
@dls-foreground-color-info-primary-disabled: #8fbcff;
@dls-foreground-color-success-primary: #00bf5c;
@dls-foreground-color-success-primary-disabled: #8fffc5;
@dls-foreground-color-warning-primary: #ffa733;
@dls-foreground-color-warning-primary-disabled: #ffd8a4;
@dls-foreground-color-error-primary: #cc1800;
@dls-foreground-color-error-primary-disabled: #ff9d8f;
@dls-foreground-color-highlighted: #ff9100;
@dls-background-color-base-1: #fff;
@dls-background-color-base-1-hover: #f6f7fa;
@dls-background-color-base-1-active: #e2e6f0;
@dls-background-color-base-1-disabled: #fff;
@dls-background-color-base-2: #f6f7fa;
@dls-background-color-base-2-hover: #ebedf5;
@dls-background-color-base-2-active: #e2e6f0;
@dls-background-color-base-2-disabled: #f6f7fa;
@dls-background-color-base-3: #ebedf5;
@dls-background-color-base-3-hover: #e2e6f0;
@dls-background-color-base-3-active: #d3d9e6;
@dls-background-color-base-3-disabled: #f6f7fa;
@dls-background-color-primary: #0052cc;
@dls-background-color-primary-hover: #0066ff;
@dls-background-color-primary-active: #0046ad;
@dls-background-color-primary-disabled: #e1edff;
@dls-border-color-primary: transparent;
@dls-border-color-primary-disabled: transparent;
@dls-background-color-info-primary: #0052cc;
@dls-background-color-info-primary-hover: #0066ff;
@dls-background-color-info-primary-active: #0046ad;
@dls-background-color-info-primary-disabled: #e1edff;
@dls-border-color-info-primary: transparent;
@dls-border-color-info-primary-disabled: transparent;
@dls-background-color-success-primary: #00bf5c;
@dls-background-color-success-primary-hover: #00f275;
@dls-background-color-success-primary-active: #00a24e;
@dls-background-color-success-primary-disabled: #e1ffef;
@dls-border-color-success-primary: transparent;
@dls-border-color-success-primary-disabled: transparent;
@dls-background-color-warning-primary: #ffa733;
@dls-background-color-warning-primary-hover: #ffc272;
@dls-background-color-warning-primary-active: #ff9100;
@dls-background-color-warning-primary-disabled: #fff4e4;
@dls-border-color-warning-primary: transparent;
@dls-border-color-warning-primary-disabled: transparent;
@dls-background-color-error-primary: #cc1800;
@dls-background-color-error-primary-hover: #ff1e00;
@dls-background-color-error-primary-active: #ad1400;
@dls-background-color-error-primary-disabled: #ffe4e1;
@dls-border-color-error-primary: transparent;
@dls-border-color-error-primary-disabled: transparent;
@dls-background-color-neutral-primary: #a8b0bf;
@dls-background-color-neutral-primary-hover: #848b99;
@dls-background-color-neutral-primary-active: #545b66;
@dls-background-color-neutral-primary-disabled: #e2e6f0;
@dls-border-color-neutral-primary: transparent;
@dls-border-color-neutral-primary-disabled: transparent;
@dls-background-color-info: #f2f7ff;
@dls-background-color-info-hover: #e1edff;
@dls-background-color-info-active: #c0d9ff;
@dls-background-color-info-disabled: #f2f7ff;
@dls-border-color-info: #8fbcff;
@dls-border-color-info-disabled: #c0d9ff;
@dls-background-color-success: #f2fff8;
@dls-background-color-success-hover: #e1ffef;
@dls-background-color-success-active: #c0ffde;
@dls-background-color-success-disabled: #f2fff8;
@dls-border-color-success: #8fffc5;
@dls-border-color-success-disabled: #c0ffde;
@dls-background-color-warning: #fffaf2;
@dls-background-color-warning-hover: #fff4e4;
@dls-background-color-warning-active: #ffe8ca;
@dls-background-color-warning-disabled: #fffaf2;
@dls-border-color-warning: #ffd8a4;
@dls-border-color-warning-disabled: #ffe8ca;
@dls-background-color-error: #fff4f2;
@dls-background-color-error-hover: #ffe4e1;
@dls-background-color-error-active: #ffc7c0;
@dls-background-color-error-disabled: #fff4f2;
@dls-border-color-error: #ff9d8f;
@dls-border-color-error-disabled: #ffc7c0;
@dls-background-color-neutral: #ebedf5;
@dls-background-color-neutral-hover: #e2e6f0;
@dls-background-color-neutral-active: #d3d9e6;
@dls-background-color-neutral-disabled: #f6f7fa;
@dls-border-color-neutral: #c5ccdb;
@dls-border-color-neutral-disabled: #e2e6f0;
@dls-background-color-current: #f2f7ff;
@dls-background-color-current-hover: #e1edff;
@dls-background-color-current-active: #c0d9ff;
@dls-background-color-current-disabled: #f2f7ff;
@dls-border-color-current: #0052cc;
@dls-border-color-current-disabled: #c0d9ff;
@dls-background-color-strong: #fff;
@dls-background-color-strong-hover: #f2f7ff;
@dls-background-color-strong-active: #e1edff;
@dls-background-color-strong-disabled: #f2f7ff;
@dls-border-color-strong: #0052cc;
@dls-border-color-strong-disabled: #c0d9ff;
@dls-background-color-error-strong: #fff;
@dls-background-color-error-strong-hover: #fff4f2;
@dls-background-color-error-strong-active: #ffe4e1;
@dls-background-color-error-strong-disabled: #fff4f2;
@dls-border-color-error-strong: #cc1800;
@dls-border-color-error-strong-disabled: #ffc7c0;
@dls-background-color-fillable: #fff;
@dls-background-color-fillable-hover: #ebedf5;
@dls-background-color-fillable-active: #d3d9e6;
@dls-background-color-fillable-disabled: #f6f7fa;
@dls-border-color-fillable: #d3d9e6;
@dls-border-color-fillable-hover: #a8b0bf;
@dls-border-color-fillable-active: #a8b0bf;
@dls-border-color-fillable-disabled: #e2e6f0;
@dls-background-color-pressable: #fff;
@dls-background-color-pressable-hover: #f6f7fa;
@dls-background-color-pressable-active: #e2e6f0;
@dls-background-color-pressable-disabled: #f6f7fa;
@dls-border-color-pressable: #e2e6f0;
@dls-border-color-pressable-hover: #d3d9e6;
@dls-border-color-pressable-active: #d3d9e6;
@dls-border-color-pressable-disabled: #e2e6f0;
@dls-background-color-translucent: rgba(0, 0, 0, 0.6);
@dls-background-color-translucent-hover: rgba(0, 0, 0, 0.5);
@dls-background-color-translucent-active: rgba(0, 0, 0, 0.7);
@dls-background-color-translucent-disabled: rgba(0, 0, 0, 0.2);
@dls-border-color-translucent: transparent;
@dls-border-color-translucent-disabled: transparent;
@dls-background-color-modal: rgba(0, 0, 0, 0.6);
@dls-line-color-0: #ebedf5;
@dls-line-color-1: #e2e6f0;
@dls-line-color-2: #d3d9e6;
@dls-border-radius-0: 2px;
@dls-border-radius-1: 4px;
@dls-border-radius-2: 6px;
@dls-border-radius-3: 10px;
@dls-shadow-color: #000;
@dls-shadow-1: 0 4px 6px rgba(0, 0, 0, 0.06), 0 1px 10px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.01);
@dls-shadow-2: 0 8px 10px 1px rgba(0, 0, 0, 0.06), 0 3px 14px 2px rgba(0, 0, 0, 0.05), 0 5px 5px -3px rgba(0, 0, 0, 0.01);
@dls-shadow-3: 0 16px 24px 2px rgba(0, 0, 0, 0.06), 0 6px 30px 5px rgba(0, 0, 0, 0.05), 0 8px 10px -5px rgba(0, 0, 0, 0.01);
@dls-shadow-color-light: #000;
@dls-shadow-light-1: 0 4px 10px rgba(0, 0, 0, 0.03), 0 3px 9px rgba(0, 0, 0, 0.02), 0 2px 8px rgba(0, 0, 0, 0.01);
@dls-shadow-light-2: 0 6px 28px 2px rgba(0, 0, 0, 0.04), 0 4px 26px 2px rgba(0, 0, 0, 0.03), 0 2px 24px 1px rgba(0, 0, 0, 0.02);
@dls-shadow-light-3: 0 6px 32px 2px rgba(0, 0, 0, 0.06), 0 5px 30px 1px rgba(0, 0, 0, 0.05), 0 4px 28px 1px rgba(0, 0, 0, 0.04);
@dls-shadow-opacity-focus: 0.2;
@dls-shadow-spread-focus: 2px;
@dls-shadow-color-focus: #0066ff;
@dls-shadow-color-error-focus: #ff1e00;
@dls-shadow-focus: 0 0 0 2px rgba(0, 102, 255, 0.2);
@dls-shadow-error-focus: 0 0 0 2px rgba(255, 30, 0, 0.2);
@dls-background-color-focus: #e1edff;
@dls-border-color-focus: #0052cc;
@dls-border-color-error-focus: #cc1800;
@dls-icon-size-normal: calc(1em + 2px);
@dls-icon-size-minor: calc(1em + 2px);
@dls-icon-size-aux: calc(1em + 2px);
@dls-icon-color-aux: #848b99;
@dls-icon-color-aux-disabled: #a8b0bf;
@dls-transition-duration-instant: 100ms;
@dls-transition-duration-fast: 200ms;
@dls-transition-duration-normal: 300ms;
@dls-transition-duration-slow: 400ms;
@dls-transition-timing-function-ease: ease;
@dls-transition-timing-function-ease-in: ease-in;
@dls-transition-timing-function-ease-out: ease-out;
@dls-transition-timing-function-linear: linear;
@dls-button-font-size-xs: 12px;
@dls-button-font-size-s: 12px;
@dls-button-font-size-m: 14px;
@dls-button-font-size-l: 16px;
@dls-button-font-size-xl: 16px;
@dls-button-height-xs: 24px;
@dls-button-height-s: 28px;
@dls-button-height-m: 32px;
@dls-button-height-l: 36px;
@dls-button-height-xl: 40px;
@dls-button-padding-xs: 8px;
@dls-button-padding-s: 12px;
@dls-button-padding-m: 16px;
@dls-button-padding-l: 20px;
@dls-button-padding-xl: 20px;
@dls-button-border-radius-xs: 2px;
@dls-button-border-radius-s: 2px;
@dls-button-border-radius-m: 4px;
@dls-button-border-radius-l: 6px;
@dls-button-border-radius-xl: 6px;
@dls-button-content-spacing: 4px;
@dls-button-font-color-normal: #282c33;
@dls-button-font-color-normal-disabled: #a8b0bf;
@dls-button-border-color-normal: transparent;
@dls-button-border-color-normal-hover: transparent;
@dls-button-border-color-normal-active: transparent;
@dls-button-border-color-normal-disabled: transparent;
@dls-button-background-color-normal: #ebedf5;
@dls-button-background-color-normal-hover: #e2e6f0;
@dls-button-background-color-normal-focus: #e2e6f0;
@dls-button-background-color-normal-active: #d3d9e6;
@dls-button-background-color-normal-disabled: #f6f7fa;
@dls-button-font-color-basic: #282c33;
@dls-button-font-color-basic-disabled: #a8b0bf;
@dls-button-border-color-basic: #e2e6f0;
@dls-button-border-color-basic-hover: #d3d9e6;
@dls-button-border-color-basic-active: #d3d9e6;
@dls-button-border-color-basic-disabled: #e2e6f0;
@dls-button-background-color-basic: #fff;
@dls-button-background-color-basic-hover: #f6f7fa;
@dls-button-background-color-basic-focus: #f6f7fa;
@dls-button-background-color-basic-active: #e2e6f0;
@dls-button-background-color-basic-disabled: #f6f7fa;
@dls-button-font-color-strong: #0052cc;
@dls-button-font-color-strong-disabled: #8fbcff;
@dls-button-border-color-strong: #0052cc;
@dls-button-border-color-strong-hover: #0052cc;
@dls-button-border-color-strong-active: #0052cc;
@dls-button-border-color-strong-disabled: #c0d9ff;
@dls-button-background-color-strong: #fff;
@dls-button-background-color-strong-hover: #f2f7ff;
@dls-button-background-color-strong-focus: #f2f7ff;
@dls-button-background-color-strong-active: #e1edff;
@dls-button-background-color-strong-disabled: #f2f7ff;
@dls-button-font-color-primary: #fff;
@dls-button-font-color-primary-disabled: #fff;
@dls-button-border-color-primary: transparent;
@dls-button-border-color-primary-hover: transparent;
@dls-button-border-color-primary-active: transparent;
@dls-button-border-color-primary-disabled: transparent;
@dls-button-background-color-primary: #0052cc;
@dls-button-background-color-primary-hover: #0066ff;
@dls-button-background-color-primary-focus: #0066ff;
@dls-button-background-color-primary-active: #0046ad;
@dls-button-background-color-primary-disabled: #e1edff;
@dls-button-font-color-translucent: #fff;
@dls-button-font-color-translucent-disabled: rgba(255, 255, 255, 0.6);
@dls-button-border-color-translucent: transparent;
@dls-button-border-color-translucent-hover: transparent;
@dls-button-border-color-translucent-active: transparent;
@dls-button-border-color-translucent-disabled: transparent;
@dls-button-background-color-translucent: rgba(0, 0, 0, 0.6);
@dls-button-background-color-translucent-hover: rgba(0, 0, 0, 0.5);
@dls-button-background-color-translucent-focus: rgba(0, 0, 0, 0.5);
@dls-button-background-color-translucent-active: rgba(0, 0, 0, 0.7);
@dls-button-background-color-translucent-disabled: rgba(0, 0, 0, 0.2);
@dls-button-font-color-text: #282c33;
@dls-button-font-color-text-hover: #545b66;
@dls-button-font-color-text-focus: #282c33;
@dls-button-font-color-text-active: #000;
@dls-button-font-color-text-disabled: #a8b0bf;
@dls-button-font-color-text-strong: #0052cc;
@dls-button-font-color-text-strong-hover: #0066ff;
@dls-button-font-color-text-strong-focus: #0052cc;
@dls-button-font-color-text-strong-active: #0046ad;
@dls-button-font-color-text-strong-disabled: #8fbcff;
@dls-button-font-color-text-aux: #848b99;
@dls-button-font-color-text-aux-hover: #545b66;
@dls-button-font-color-text-aux-focus: #848b99;
@dls-button-font-color-text-aux-active: #282c33;
@dls-button-font-color-text-aux-disabled: #c5ccdb;
@dls-button-background-color-text: transparent;
@dls-button-background-color-text-hover: transparent;
@dls-button-background-color-text-focus: transparent;
@dls-button-background-color-text-active: transparent;
@dls-button-background-color-text-disabled: transparent;
@dls-button-padding-text: 2px;
@dls-button-background-color-checked: #f2f7ff;
@dls-button-background-color-checked-hover: #e1edff;
@dls-button-background-color-checked-focus: #e1edff;
@dls-button-background-color-checked-active: #c0d9ff;
@dls-button-background-color-checked-disabled: #f2f7ff;
@dls-button-border-color-checked: #0052cc;
@dls-button-border-color-checked-disabled: #c0d9ff;
@dls-button-foreground-color-checked: #0052cc;
@dls-button-border-color-focus: #0052cc;
@dls-button-shadow-focus: 0 0 0 2px rgba(0, 102, 255, 0.2);
@dls-button-group-separator-opacity: 0.15;
@dls-button-font-color-selected: #0052cc;
@dls-button-font-color-selected-disabled: #8fbcff;
@dls-button-border-color-selected: #0052cc;
@dls-button-border-color-selected-disabled: #c0d9ff;
@dls-button-background-color-selected: #f2f7ff;
@dls-button-background-color-selected-hover: #e1edff;
@dls-button-background-color-selected-focus: #e1edff;
@dls-button-background-color-selected-active: #c0d9ff;
@dls-button-background-color-selected-disabled: #f2f7ff;
@dls-button-min-width-stable-s: calc(24px + 4em);
@dls-button-min-width-stable-m: calc(32px + 4em);
@dls-link-font-size-s: 12px;
@dls-link-font-size-m: 14px;
@dls-link-text-decoration: none;
@dls-link-text-decoration-hover: none;
@dls-link-text-decoration-focus: underline;
@dls-link-text-decoration-active: none;
@dls-link-font-color-normal: #282c33;
@dls-link-font-color-normal-hover: #545b66;
@dls-link-font-color-normal-focus: #545b66;
@dls-link-font-color-normal-active: #000;
@dls-link-font-color-normal-disabled: #a8b0bf;
@dls-link-font-color-strong: #0052cc;
@dls-link-font-color-strong-hover: #0066ff;
@dls-link-font-color-strong-focus: #0066ff;
@dls-link-font-color-strong-active: #0046ad;
@dls-link-font-color-strong-disabled: #8fbcff;
@dls-radio-font-size-s: 12px;
@dls-radio-font-size-m: 14px;
@dls-radio-font-color: #282c33;
@dls-radio-font-color-disabled: #a8b0bf;
@dls-radio-size-s: 14px;
@dls-radio-size-m: 16px;
@dls-radio-dot-size-s: 6px;
@dls-radio-dot-size-m: 6px;
@dls-radio-spacing: 8px;
@dls-radio-border-color: #d3d9e6;
@dls-radio-border-color-hover: #a8b0bf;
@dls-radio-border-color-focus: #0052cc;
@dls-radio-border-color-active: #a8b0bf;
@dls-radio-border-color-disabled: #e2e6f0;
@dls-radio-border-color-checked: transparent;
@dls-radio-border-color-checked-hover: transparent;
@dls-radio-border-color-checked-focus: #0052cc;
@dls-radio-border-color-checked-active: transparent;
@dls-radio-border-color-checked-disabled: transparent;
@dls-radio-background-color: #fff;
@dls-radio-background-color-hover: #ebedf5;
@dls-radio-background-color-focus: #ebedf5;
@dls-radio-background-color-active: #d3d9e6;
@dls-radio-background-color-disabled: #f6f7fa;
@dls-radio-background-color-checked: #0052cc;
@dls-radio-background-color-checked-hover: #0066ff;
@dls-radio-background-color-checked-focus: #0066ff;
@dls-radio-background-color-checked-active: #0046ad;
@dls-radio-background-color-checked-disabled: #e1edff;
@dls-radio-dot-color: #fff;
@dls-radio-dot-color-hover: #fff;
@dls-radio-dot-color-focus: #fff;
@dls-radio-dot-color-active: #fff;
@dls-radio-dot-color-disabled: #fff;
@dls-radio-shadow-focus: 0 0 0 2px rgba(0, 102, 255, 0.2);
@dls-radio-group-spacing: 24px;
@dls-radio-group-spacing-simple: 8px;
@dls-radio-group-line-spacing: 8px;
@dls-checkbox-font-size-s: 12px;
@dls-checkbox-font-size-m: 14px;
@dls-checkbox-font-color: #282c33;
@dls-checkbox-font-color-disabled: #a8b0bf;
@dls-checkbox-size-s: 14px;
@dls-checkbox-size-m: 16px;
@dls-checkbox-icon-min-size: 8px;
@dls-checkbox-icon-size: 1em;
@dls-checkbox-border-radius: 2px;
@dls-checkbox-spacing: 8px;
@dls-checkbox-border-color: #d3d9e6;
@dls-checkbox-border-color-hover: #a8b0bf;
@dls-checkbox-border-color-focus: #0052cc;
@dls-checkbox-border-color-active: #a8b0bf;
@dls-checkbox-border-color-disabled: #e2e6f0;
@dls-checkbox-border-color-checked: transparent;
@dls-checkbox-border-color-checked-hover: transparent;
@dls-checkbox-border-color-checked-focus: #0052cc;
@dls-checkbox-border-color-checked-active: transparent;
@dls-checkbox-border-color-checked-disabled: transparent;
@dls-checkbox-background-color: #fff;
@dls-checkbox-background-color-hover: #ebedf5;
@dls-checkbox-background-color-focus: #ebedf5;
@dls-checkbox-background-color-active: #d3d9e6;
@dls-checkbox-background-color-disabled: #f6f7fa;
@dls-checkbox-background-color-checked: #0052cc;
@dls-checkbox-background-color-checked-hover: #0066ff;
@dls-checkbox-background-color-checked-focus: #0066ff;
@dls-checkbox-background-color-checked-active: #0046ad;
@dls-checkbox-background-color-checked-disabled: #e1edff;
@dls-checkbox-foreground-color: #fff;
@dls-checkbox-foreground-color-hover: #fff;
@dls-checkbox-foreground-color-focus: #fff;
@dls-checkbox-foreground-color-active: #fff;
@dls-checkbox-foreground-color-disabled: #fff;
@dls-checkbox-shadow-focus: 0 0 0 2px rgba(0, 102, 255, 0.2);
@dls-checkbox-group-spacing: 24px;
@dls-checkbox-group-spacing-simple: 8px;
@dls-checkbox-group-line-spacing: 8px;
@dls-checkbox-icon-size-strong: 6px;
@dls-checkbox-icon-spacing-strong: 3px;
@dls-checkbox-icon-color-strong: #d3d9e6;
@dls-checkbox-icon-color-strong-disabled: #e2e6f0;
@dls-checkbox-icon-color-strong-checked: #0052cc;
@dls-checkbox-icon-color-strong-checked-disabled: #c0d9ff;
@dls-switch-width-xs: 20px;
@dls-switch-width-s: 26px;
@dls-switch-width-m: 32px;
@dls-switch-height-xs: 12px;
@dls-switch-height-s: 16px;
@dls-switch-height-m: 20px;
@dls-switch-thumb-size-xs: 8px;
@dls-switch-thumb-size-s: 12px;
@dls-switch-thumb-size-m: 14px;
@dls-switch-padding-xs: 2px;
@dls-switch-padding-s: 2px;
@dls-switch-padding-m: 3px;
@dls-switch-track-color-on: #0052cc;
@dls-switch-track-color-on-hover: #0066ff;
@dls-switch-track-color-on-focus: #0066ff;
@dls-switch-track-color-on-active: #0046ad;
@dls-switch-track-color-on-disabled: #e1edff;
@dls-switch-track-color-off: #a8b0bf;
@dls-switch-track-color-off-hover: #848b99;
@dls-switch-track-color-off-focus: #848b99;
@dls-switch-track-color-off-active: #545b66;
@dls-switch-track-color-off-disabled: #e2e6f0;
@dls-switch-thumb-color-on: #fff;
@dls-switch-thumb-color-on-hover: #fff;
@dls-switch-thumb-color-on-focus: #fff;
@dls-switch-thumb-color-on-active: #fff;
@dls-switch-thumb-color-on-disabled: #fff;
@dls-switch-thumb-color-off: #fff;
@dls-switch-thumb-color-off-hover: #fff;
@dls-switch-thumb-color-off-focus: #fff;
@dls-switch-thumb-color-off-active: #fff;
@dls-switch-thumb-color-off-disabled: #fff;
@dls-switch-shadow-on-focus: 0 0 0 2px rgba(0, 102, 255, 0.2);
@dls-switch-shadow-off-focus: 0 0 0 2px rgba(0, 102, 255, 0.2);
@dls-input-font-size-xs: 12px;
@dls-input-font-size-s: 12px;
@dls-input-font-size-m: 14px;
@dls-input-font-size-l: 16px;
@dls-input-height-xs: 24px;
@dls-input-height-s: 28px;
@dls-input-height-m: 32px;
@dls-input-height-l: 36px;
@dls-input-width: 300px;
@dls-input-border-radius-xs: 2px;
@dls-input-border-radius-s: 2px;
@dls-input-border-radius-m: 4px;
@dls-input-border-radius-l: 6px;
@dls-input-padding: 12px;
@dls-input-content-spacing: 8px;
@dls-input-border-color: #d3d9e6;
@dls-input-border-color-hover: #a8b0bf;
@dls-input-border-color-focus: #0052cc;
@dls-input-border-color-error: #cc1800;
@dls-input-border-color-error-hover: #cc1800;
@dls-input-border-color-error-focus: #cc1800;
@dls-input-border-color-read-only: #d3d9e6;
@dls-input-border-color-read-only-hover: #a8b0bf;
@dls-input-border-color-read-only-focus: #0052cc;
@dls-input-border-color-disabled: #e2e6f0;
@dls-input-background-color: #fff;
@dls-input-background-color-read-only: #f6f7fa;
@dls-input-background-color-disabled: #f6f7fa;
@dls-input-font-color: #282c33;
@dls-input-font-color-error: #282c33;
@dls-input-font-color-read-only: #848b99;
@dls-input-font-color-disabled: #a8b0bf;
@dls-input-placeholder-color: #848b99;
@dls-input-count-color: #848b99;
@dls-input-count-color-error: #cc1800;
@dls-input-shadow-focus: 0 0 0 2px rgba(0, 102, 255, 0.2);
@dls-input-shadow-inline-focus: 0 1px 0 0 #0066ff;
@dls-input-shadow-error-focus: 0 0 0 2px rgba(255, 30, 0, 0.2);
@dls-input-shadow-inline-error-focus: 0 1px 0 0 #ff1e00;
@dls-input-icon-size: calc(1em + 2px);
@dls-input-icon-color: #848b99;
@dls-input-icon-color-disabled: #a8b0bf;
@dls-textarea-font-size-s: 12px;
@dls-textarea-font-size-m: 14px;
@dls-textarea-line-height: 1.4;
@dls-textarea-padding-x: 12px;
@dls-textarea-padding-y: 8px;
@dls-textarea-width: 300px;
@dls-textarea-rows: 3;
@dls-textarea-height-s: 68.4px;
@dls-textarea-height-m: 76.8px;
@dls-textarea-count-height: 16px;
@dls-textarea-count-padding: 4px;
@dls-textarea-count-font-size: 12px;
@dls-textarea-count-font-color: #fff;
@dls-textarea-count-font-color-error: #fff;
@dls-textarea-count-background-color: rgba(0, 0, 0, 0.6);
@dls-textarea-count-background-color-error: rgba(204, 24, 0, 0.6);
@dls-textarea-count-border-radius: 2px;
@dls-number-input-height-xs: 24px;
@dls-number-input-height-s: 28px;
@dls-number-input-height-m: 32px;
@dls-number-input-spin-icon-size-normal: 0.85em;
@dls-number-input-spin-button-min-width-normal: 18px;
@dls-number-input-spin-button-width-normal-xs: 18px;
@dls-number-input-spin-button-width-normal-s: 18px;
@dls-number-input-spin-button-width-normal-m: 18px;
@dls-number-input-digits-normal: 6;
@dls-number-input-width-normal-xs: calc(6ch + 43px);
@dls-number-input-width-normal-s: calc(6ch + 43px);
@dls-number-input-width-normal-m: calc(6ch + 43px);
@dls-number-input-spin-icon-size-strong: 1em;
@dls-number-input-digits-strong: 6;
@dls-number-input-width-strong-xs: calc(6ch + 72px);
@dls-number-input-width-strong-s: calc(6ch + 80px);
@dls-number-input-width-strong-m: calc(6ch + 88px);
@dls-number-input-spin-icon-color: #848b99;
@dls-number-input-spin-icon-color-disabled: #c5ccdb;
@dls-option-font-size-xs: 12px;
@dls-option-font-size-s: 12px;
@dls-option-font-size-m: 14px;
@dls-option-font-size-l: 16px;
@dls-option-height-xs: 24px;
@dls-option-height-s: 28px;
@dls-option-height-m: 32px;
@dls-option-height-l: 36px;
@dls-option-padding-xs: 16px;
@dls-option-padding-s: 16px;
@dls-option-padding-m: 16px;
@dls-option-padding-l: 16px;
@dls-option-max-width-xs: calc(40em + 32px);
@dls-option-max-width-s: calc(40em + 32px);
@dls-option-max-width-m: calc(40em + 32px);
@dls-option-max-width-l: calc(40em + 32px);
@dls-option-icon-size-aux: calc(1em + 2px);
@dls-option-label-spacing-before: 8px;
@dls-option-label-spacing-after: 12px;
@dls-option-font-color: #282c33;
@dls-option-font-color-hover: #282c33;
@dls-option-font-color-focus: #282c33;
@dls-option-font-color-active: #282c33;
@dls-option-font-color-disabled: #a8b0bf;
@dls-option-font-color-highlighted: #ff9100;
@dls-option-icon-color-aux: #848b99;
@dls-option-icon-color-aux-disabled: #a8b0bf;
@dls-option-font-color-selected: #0052cc;
@dls-option-font-color-selected-hover: #0066ff;
@dls-option-font-color-selected-focus: #0066ff;
@dls-option-font-color-selected-active: #0046ad;
@dls-option-background-color: #fff;
@dls-option-background-color-hover: #f6f7fa;
@dls-option-background-color-focus: #e1edff;
@dls-option-background-color-active: #e2e6f0;
@dls-option-background-color-selected-parent: #f6f7fa;
@dls-option-font-weight-selected-parent: 400;
@dls-option-font-weight-selected: 400;
@dls-option-group-label-line-height: 1.4;
@dls-option-group-label-font-color: #848b99;
@dls-option-group-label-padding-y: 4px;
@dls-option-group-padding-y: 4px;
@dls-option-group-separator-color: #e2e6f0;
@dls-time-picker-width: 150px;
@dls-time-picker-dropdown-min-width: 150px;
@dls-time-picker-option-content-min-width: 2ch;
@dls-time-picker-icon-color: #848b99;
@dls-time-picker-icon-color-disabled: #a8b0bf;
@dls-pagination-font-size-xs: 12px;
@dls-pagination-font-size-s: 12px;
@dls-pagination-font-size-m: 14px;
@dls-pagination-page-item-min-width-xs: 24px;
@dls-pagination-page-item-min-width-s: 28px;
@dls-pagination-page-item-min-width-m: 32px;
@dls-pagination-page-item-padding-x: 4px;
@dls-pagination-page-item-spacing: 4px;
@dls-pagination-part-spacing: 24px;
@dls-pagination-content-spacing: 8px;
@dls-pagination-goto-input-padding-x: 8px;
@dls-pagination-goto-input-digits: 3;
@dls-pagination-goto-input-width: calc(3ch + 18px);
@dls-pagination-page-item-font-color: #282c33;
@dls-pagination-page-item-font-color-disabled: #a8b0bf;
@dls-pagination-page-item-background-color: #fff;
@dls-pagination-page-item-background-color-hover: #f6f7fa;
@dls-pagination-page-item-background-color-focus: #f6f7fa;
@dls-pagination-page-item-background-color-active: #e2e6f0;
@dls-pagination-page-item-background-color-disabled: #fff;
@dls-badge-font-size: 12px;
@dls-badge-dot-size: 8px;
@dls-badge-label-height: 16px;
@dls-badge-label-min-width: 16px;
@dls-badge-label-padding-x: 4px;
@dls-badge-label-spacing-status: 8px;
@dls-badge-background-color-info: #0052cc;
@dls-badge-background-color-success: #00bf5c;
@dls-badge-background-color-warning: #ffa733;
@dls-badge-background-color-error: #cc1800;
@dls-badge-background-color-aux: #a8b0bf;
@dls-badge-font-color: #fff;
@dls-breadcrumb-font-size-s: 12px;
@dls-breadcrumb-font-size-m: 14px;
@dls-breadcrumb-separator-icon-size: calc(1em + 2px);
@dls-breadcrumb-separator-color: #848b99;
@dls-breadcrumb-separator-spacing: 8px;
@dls-breadcrumb-item-current-font-color: #282c33;
@dls-breadcrumb-item-current-font-weight: 500;
@dls-steps-title-font-size-s: 12px;
@dls-steps-title-font-size-m: 14px;
@dls-steps-desc-font-size-s: 12px;
@dls-steps-desc-font-size-m: 12px;
@dls-steps-marker-font-size-s: 14px;
@dls-steps-marker-font-size-m: 16px;
@dls-steps-title-font-weight: 500;
@dls-steps-title-font-color: #282c33;
@dls-steps-title-font-color-hover: #282c33;
@dls-steps-title-font-color-focus: #282c33;
@dls-steps-title-font-color-active: #282c33;
@dls-steps-desc-font-color: #848b99;
@dls-steps-title-font-color-incomplete: #848b99;
@dls-steps-desc-font-color-incomplete: #848b99;
@dls-steps-marker-size-s: 28px;
@dls-steps-marker-size-m: 28px;
@dls-steps-marker-size-dot-s: 10px;
@dls-steps-marker-size-dot-m: 10px;
@dls-steps-marker-ring-width-dot-s: 2px;
@dls-steps-marker-ring-width-dot-m: 2px;
@dls-steps-marker-icon-size: calc(1em + 2px);
@dls-steps-title-max-width: 10em;
@dls-steps-desc-max-width: 12em;
@dls-steps-marker-spacing: 8px;
@dls-steps-title-spacing: 4px;
@dls-steps-connector-spacing-horizontal: 8px;
@dls-steps-connector-spacing-vertical: 8px;
@dls-steps-connector-min-length: 40px;
@dls-steps-marker-background-color-incomplete: #ebedf5;
@dls-steps-marker-background-color-incomplete-hover: #e2e6f0;
@dls-steps-marker-background-color-incomplete-focus: #e2e6f0;
@dls-steps-marker-background-color-incomplete-active: #d3d9e6;
@dls-steps-marker-border-color-incomplete: transparent;
@dls-steps-marker-background-color-dot-incomplete: #a8b0bf;
@dls-steps-marker-background-color-dot-incomplete-hover: #848b99;
@dls-steps-marker-background-color-dot-incomplete-focus: #848b99;
@dls-steps-marker-background-color-dot-incomplete-active: #545b66;
@dls-steps-marker-border-color-dot-incomplete: transparent;
@dls-steps-marker-foreground-color-incomplete: #848b99;
@dls-steps-connector-color-incomplete: #d3d9e6;
@dls-steps-marker-background-color-completed: #f2f7ff;
@dls-steps-marker-background-color-completed-hover: #e1edff;
@dls-steps-marker-background-color-completed-focus: #e1edff;
@dls-steps-marker-background-color-completed-active: #c0d9ff;
@dls-steps-marker-border-color-completed: transparent;
@dls-steps-marker-background-color-dot-completed: #0052cc;
@dls-steps-marker-background-color-dot-completed-hover: #0066ff;
@dls-steps-marker-background-color-dot-completed-focus: #0066ff;
@dls-steps-marker-background-color-dot-completed-active: #0046ad;
@dls-steps-marker-border-color-dot-completed: transparent;
@dls-steps-marker-foreground-color-completed: #0052cc;
@dls-steps-connector-color-completed: #0052cc;
@dls-steps-marker-background-color-error: #fff4f2;
@dls-steps-marker-background-color-error-hover: #ffe4e1;
@dls-steps-marker-background-color-error-focus: #ffe4e1;
@dls-steps-marker-background-color-error-active: #ffc7c0;
@dls-steps-marker-border-color-error: transparent;
@dls-steps-marker-background-color-dot-error: #cc1800;
@dls-steps-marker-background-color-dot-error-hover: #ff1e00;
@dls-steps-marker-background-color-dot-error-focus: #ff1e00;
@dls-steps-marker-background-color-dot-error-active: #ad1400;
@dls-steps-marker-border-color-dot-error: transparent;
@dls-steps-marker-foreground-color-error: #cc1800;
@dls-steps-connector-color-error: #cc1800;
@dls-steps-marker-background-color-current: #0052cc;
@dls-steps-marker-background-color-current-hover: #0066ff;
@dls-steps-marker-background-color-current-focus: #0066ff;
@dls-steps-marker-background-color-current-active: #0046ad;
@dls-steps-marker-border-color-current: transparent;
@dls-steps-marker-background-color-dot-current: #0052cc;
@dls-steps-marker-background-color-dot-current-hover: #0066ff;
@dls-steps-marker-background-color-dot-current-focus: #0066ff;
@dls-steps-marker-background-color-dot-current-active: #0046ad;
@dls-steps-marker-border-color-dot-current: transparent;
@dls-steps-marker-foreground-color-current: #fff;
@dls-steps-connector-color-current: #0052cc;
@dls-steps-marker-background-color-error-current: #cc1800;
@dls-steps-marker-background-color-error-current-hover: #ff1e00;
@dls-steps-marker-background-color-error-current-focus: #ff1e00;
@dls-steps-marker-background-color-error-current-active: #ad1400;
@dls-steps-marker-border-color-error-current: transparent;
@dls-steps-marker-background-color-dot-error-current: #cc1800;
@dls-steps-marker-background-color-dot-error-current-hover: #ff1e00;
@dls-steps-marker-background-color-dot-error-current-focus: #ff1e00;
@dls-steps-marker-background-color-dot-error-current-active: #ad1400;
@dls-steps-marker-border-color-dot-error-current: transparent;
@dls-steps-marker-foreground-color-error-current: #fff;
@dls-steps-connector-color-error-current: #cc1800;
@dls-steps-marker-border-color-focus: #0052cc;
@dls-steps-marker-border-color-error-focus: #cc1800;
@dls-steps-marker-shadow-focus: 0 0 0 2px rgba(0, 102, 255, 0.2);
@dls-steps-marker-shadow-error-focus: 0 0 0 2px rgba(255, 30, 0, 0.2);
@dls-tag-height-s: 24px;
@dls-tag-height-m: 28px;
@dls-tag-border-radius-s: 2px;
@dls-tag-border-radius-m: 4px;
@dls-tag-padding: 8px;
@dls-tag-content-spacing: 8px;
@dls-tag-list-spacing: 4px;
@dls-tag-font-size-s: 12px;
@dls-tag-font-size-m: 14px;
@dls-tag-icon-size-aux: calc(1em + 2px);
@dls-tag-color: #545b66;
@dls-tag-color-selected: #0052cc;
@dls-tag-color-info: #0052cc;
@dls-tag-color-success: #00bf5c;
@dls-tag-color-warning: #ffa733;
@dls-tag-color-error: #cc1800;
@dls-tag-font-color-selected: #fff;
@dls-tag-font-color-reverse: #fff;
@dls-tag-font-opacity-disabled: 0.3;
@dls-tag-font-opacity-selected-disabled: 1;
@dls-tag-font-opacity-reverse-disabled: 1;
@dls-tag-background-opacity: 0.1;
@dls-tag-background-opacity-hover: 0.2;
@dls-tag-background-opacity-active: 0.3;
@dls-tag-background-opacity-disabled: 0.1;
@dls-tag-background-opacity-selected: 1;
@dls-tag-background-opacity-selected-hover: 0.6;
@dls-tag-background-opacity-selected-active: 0.8;
@dls-tag-background-opacity-selected-disabled: 0.1;
@dls-tag-background-opacity-reverse: 1;
@dls-tag-background-opacity-reverse-hover: 0.6;
@dls-tag-background-opacity-reverse-active: 0.8;
@dls-tag-background-opacity-reverse-disabled: 0.1;
@dls-tag-border-opacity: 0.2;
@dls-tag-border-opacity-disabled: 0.1;
@dls-anchor-padding-x: 16px;
@dls-anchor-item-spacing: 12px;
@dls-anchor-level-indent: 16px;
@dls-anchor-track-color: #e2e6f0;
@dls-anchor-track-width: 1px;
@dls-anchor-indicator-width: 2px;
@dls-anchor-indicator-color: #0052cc;
@dls-anchor-indicator-color-hover: #0066ff;
@dls-anchor-indicator-color-focus: #0066ff;
@dls-anchor-indicator-color-active: #0046ad;
@dls-loading-font-size-s: 12px;
@dls-loading-font-size-m: 14px;
@dls-loading-font-size-l: 16px;
@dls-loading-line-height: 1.4;
@dls-loading-size-s: calc(1em + 2px);
@dls-loading-size-m: calc(1em + 2px);
@dls-loading-size-l: 24px;
@dls-loading-content-spacing-s: 4px;
@dls-loading-content-spacing-m: 4px;
@dls-loading-content-spacing-l: 8px;
@dls-loading-font-color-normal: #282c33;
@dls-loading-font-color-strong: #282c33;
@dls-loading-font-color-reverse: #fff;
@dls-loading-color-normal: #848b99;
@dls-loading-color-strong: #0052cc;
@dls-loading-color-reverse: #fff;
@dls-loading-background-color: rgba(255, 255, 255, 0.8);
@dls-loading-background-color-reverse: rgba(0, 0, 0, 0.6);
@dls-progress-width-bar-xs: 160px;
@dls-progress-width-bar-s: 200px;
@dls-progress-width-bar-m: 300px;
@dls-progress-size-circular-xs: 60px;
@dls-progress-size-circular-s: 80px;
@dls-progress-size-circular-m: 100px;
@dls-progress-font-size-xs: 12px;
@dls-progress-font-size-s: 12px;
@dls-progress-font-size-m: 14px;
@dls-progress-font-size-circular-xs: 12px;
@dls-progress-font-size-circular-s: 14px;
@dls-progress-font-size-circular-m: 16px;
@dls-progress-font-color: #545b66;
@dls-progress-icon-size-bar: calc(1em + 2px);
@dls-progress-icon-size-circular-xs: 16px;
@dls-progress-icon-size-circular-s: 24px;
@dls-progress-icon-size-circular-m: 32px;
@dls-progress-track-width-xs: 2px;
@dls-progress-track-width-s: 4px;
@dls-progress-track-width-m: 6px;
@dls-progress-border-radius-xs: 1px;
@dls-progress-border-radius-s: 2px;
@dls-progress-border-radius-m: 3px;
@dls-progress-track-spacing-bar: 8px;
@dls-progress-icon-spacing-bar: 8px;
@dls-progress-track-color: #d3d9e6;
@dls-progress-indicator-color: #0052cc;
@dls-progress-indicator-color-success: #00bf5c;
@dls-progress-indicator-color-error: #cc1800;
@dls-progress-icon-color-success: #00bf5c;
@dls-progress-icon-color-error: #cc1800;
@dls-tree-node-height-s: 28px;
@dls-tree-node-height-m: 32px;
@dls-tree-font-size-s: 12px;
@dls-tree-font-size-m: 14px;
@dls-tree-icon-size: calc(1em + 2px);
@dls-tree-icon-size-aux: calc(1em + 2px);
@dls-tree-padding-x: 16px;
@dls-tree-node-content-spacing: 8px;
@dls-tree-icon-color-aux: #848b99;
@dls-tree-icon-color-aux-disabled: #a8b0bf;
@dls-tree-node-font-color: #282c33;
@dls-tree-node-font-color-disabled: #a8b0bf;
@dls-tree-node-font-color-selected: #0052cc;
@dls-tree-node-font-color-selected-hover: #0066ff;
@dls-tree-node-font-color-selected-focus: #0066ff;
@dls-tree-node-font-color-selected-active: #0046ad;
@dls-tree-node-font-color-highlighted: #ff9100;
@dls-tree-node-background-color: #fff;
@dls-tree-node-background-color-hover: #f6f7fa;
@dls-tree-node-background-color-focus: #f6f7fa;
@dls-tree-node-background-color-active: #e2e6f0;
@dls-tree-node-background-color-selected: #f2f7ff;
@dls-tree-node-background-color-selected-hover: #e1edff;
@dls-tree-node-background-color-selected-focus: #e1edff;
@dls-tree-node-background-color-selected-active: #c0d9ff;
@dls-tree-node-font-weight-selected: 400;
@dls-transfer-font-size-s: 12px;
@dls-transfer-font-size-m: 14px;
@dls-transfer-border-radius-s: 2px;
@dls-transfer-border-radius-m: 4px;
@dls-transfer-padding-x: 12px;
@dls-transfer-header-content-spacing-1: 4px;
@dls-transfer-header-content-spacing-2: 8px;
@dls-transfer-content-padding-y: 4px;
@dls-transfer-item-height-s: 28px;
@dls-transfer-item-height-m: 32px;
@dls-transfer-item-content-spacing: 8px;
@dls-transfer-content-min-height-s: 288px;
@dls-transfer-content-min-height-m: 328px;
@dls-transfer-panel-width-s: 228px;
@dls-transfer-panel-width-m: 260px;
@dls-transfer-panel-spacing: 12px;
@dls-transfer-header-height-s: 32px;
@dls-transfer-header-height-m: 36px;
@dls-transfer-header-background-color: #f6f7fa;
@dls-transfer-header-font-color: #282c33;
@dls-transfer-header-font-weight: 400;
@dls-transfer-header-button-font-weight: 500;
@dls-transfer-border-color: #d3d9e6;
@dls-transfer-item-background-color: #fff;
@dls-transfer-item-background-color-hover: #f6f7fa;
@dls-transfer-item-background-color-focus: #f6f7fa;
@dls-transfer-item-background-color-active: #e2e6f0;
@dls-transfer-item-background-color-disabled: transparent;
@dls-transfer-item-font-color: #282c33;
@dls-transfer-item-font-color-hover: #282c33;
@dls-transfer-item-font-color-focus: #282c33;
@dls-transfer-item-font-color-active: #282c33;
@dls-transfer-item-font-color-disabled: #a8b0bf;
@dls-tab-height-s: 40px;
@dls-tab-height-m: 44px;
@dls-tab-height-l: 48px;
@dls-tab-max-width-normal-s: calc(10em + 12px);
@dls-tab-max-width-normal-m: calc(10em + 12px);
@dls-tab-max-width-normal-l: calc(10em + 12px);
@dls-tab-max-width-simple-s: calc(10em + 12px);
@dls-tab-max-width-simple-m: calc(10em + 12px);
@dls-tab-max-width-simple-l: calc(10em + 12px);
@dls-tab-max-width-strong-m: calc(10em + 60px);
@dls-tab-min-width-normal-s: 2em;
@dls-tab-min-width-normal-m: 2em;
@dls-tab-min-width-normal-l: 2em;
@dls-tab-min-width-simple-s: 2em;
@dls-tab-min-width-simple-m: 2em;
@dls-tab-min-width-simple-l: 2em;
@dls-tab-padding-normal-s: 0;
@dls-tab-padding-normal-m: 0;
@dls-tab-padding-normal-l: 0;
@dls-tab-padding-simple-s: 0;
@dls-tab-padding-simple-m: 0;
@dls-tab-padding-simple-l: 0;
@dls-tab-padding-strong-m: 24px;
@dls-tab-spacing-normal-s: 24px;
@dls-tab-spacing-normal-m: 32px;
@dls-tab-spacing-normal-l: 48px;
@dls-tab-spacing-simple-s: 32px;
@dls-tab-spacing-simple-m: 40px;
@dls-tab-spacing-simple-l: 48px;
@dls-tab-spacing-strong-m: 0;
@dls-tab-menu-padding-normal: var(--dls-tab-menu-spacing-around);
@dls-tab-content-spacing: 4px;
@dls-tab-remove-spacing: 2px;
@dls-tab-nav-spacing-normal-s: 12px;
@dls-tab-nav-spacing-normal-m: 16px;
@dls-tab-nav-spacing-normal-l: 24px;
@dls-tab-nav-spacing-simple-s: 16px;
@dls-tab-nav-spacing-simple-m: 20px;
@dls-tab-nav-spacing-simple-l: 24px;
@dls-tab-nav-spacing-strong-m: 12px;
@dls-tab-font-size-s: 12px;
@dls-tab-font-size-m: 14px;
@dls-tab-font-size-l: 16px;
@dls-tab-font-color: #282c33;
@dls-tab-font-color-hover: #545b66;
@dls-tab-font-color-focus: #545b66;
@dls-tab-font-color-active: #000;
@dls-tab-font-color-disabled: #a8b0bf;
@dls-tab-font-color-current: #0052cc;
@dls-tab-font-color-current-hover: #0066ff;
@dls-tab-font-color-current-focus: #0066ff;
@dls-tab-font-color-current-active: #0046ad;
@dls-tab-background-color-focus: #e1edff;
@dls-tab-font-weight-current: 400;
@dls-tab-container-separator-color: #d3d9e6;
@dls-tab-container-border-width: 1px;
@dls-tab-panel-padding-top: 16px;
@dls-tab-overflow-shadow-right: 0 4px 6px rgba(0, 0, 0, 0.06), 0 1px 10px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.01);
@dls-tab-overflow-shadow-left: 0 4px 6px rgba(0, 0, 0, 0.06), 0 1px 10px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.01);
@dls-tab-indicator-color: #0052cc;
@dls-tab-indicator-width: 2px;
@dls-tab-icon-size: calc(1em + 2px);
@dls-tab-icon-size-aux: calc(1em - 2px);
@dls-tab-separator-height-simple: 1em;
@dls-tab-separator-color: #d3d9e6;
@dls-tab-menu-height-strong-m: 48px;
@dls-tab-nav-spacing-extra-strong-m: 24px;
@dls-tab-menu-padding-strong-m: 16px;
@dls-tab-border-radius-strong-m: 10px;
@dls-tab-container-border-radius-strong-m: 6px;
@dls-tab-container-border-color-strong: #ebedf5;
@dls-tab-menu-background-color-strong: #ebedf5;
@dls-tab-background-color-strong: transparent;
@dls-tab-background-color-strong-hover: #f6f7fa;
@dls-tab-background-color-strong-focus: #e1edff;
@dls-tab-background-color-strong-active: #e2e6f0;
@dls-tab-background-color-strong-disabled: transparent;
@dls-tab-background-color-strong-current: #fff;
@dls-tab-background-color-strong-current-hover: #fff;
@dls-tab-background-color-strong-current-focus: #fff;
@dls-tab-background-color-strong-current-active: #fff;
@dls-tab-font-color-strong: #282c33;
@dls-tab-font-color-strong-hover: #545b66;
@dls-tab-font-color-strong-focus: #545b66;
@dls-tab-font-color-strong-active: #000;
@dls-tab-font-color-strong-disabled: #a8b0bf;
@dls-tab-font-color-strong-current: #0052cc;
@dls-tab-font-color-strong-current-hover: #0066ff;
@dls-tab-font-color-strong-current-focus: #0066ff;
@dls-tab-font-color-strong-current-active: #0046ad;
@dls-menu-item-font-weight-current: 400;
@dls-menu-item-icon-color: #848b99;
@dls-menu-item-icon-color-disabled: #a8b0bf;
@dls-menu-item-icon-color-current: currentColor;
@dls-menu-item-icon-color-current-disabled: currentColor;
@dls-menu-indicator-width: 2px;
@dls-menu-indicator-color: #0052cc;
@dls-menu-indicator-color-hover: #0052cc;
@dls-menu-indicator-color-focus: #0052cc;
@dls-menu-indicator-color-active: #0052cc;
@dls-menu-width: 200px;
@dls-menu-width-collapsed: 60px;
@dls-menu-font-size-s: 12px;
@dls-menu-font-size-m: 14px;
@dls-menu-font-size-l: 16px;
@dls-menu-item-height-s: 28px;
@dls-menu-item-height-m: 32px;
@dls-menu-item-height-l: 36px;
@dls-menu-padding-x: 20px;
@dls-menu-padding-y: 8px;
@dls-menu-item-spacing: 8px;
@dls-menu-item-content-spacing: 12px;
@dls-menu-level-indent: 16px;
@dls-menu-footer-height-s: 28px;
@dls-menu-footer-height-m: 28px;
@dls-menu-footer-height-l: 28px;
@dls-menu-item-icon-size: calc(1em + 2px);
@dls-menu-item-icon-size-aux: calc(1em + 2px);
@dls-menu-border-color: #e2e6f0;
@dls-menu-separator-color: #e2e6f0;
@dls-menu-item-font-color: #282c33;
@dls-menu-item-font-color-hover: #282c33;
@dls-menu-item-font-color-focus: #282c33;
@dls-menu-item-font-color-active: #282c33;
@dls-menu-item-font-color-disabled: #a8b0bf;
@dls-menu-item-background-color: #fff;
@dls-menu-item-background-color-hover: #f6f7fa;
@dls-menu-item-background-color-focus: #e1edff;
@dls-menu-item-background-color-active: #e2e6f0;
@dls-menu-item-background-color-disabled: #fff;
@dls-menu-item-font-color-current: #0052cc;
@dls-menu-item-font-color-current-hover: #0066ff;
@dls-menu-item-font-color-current-focus: #0066ff;
@dls-menu-item-font-color-current-active: #0046ad;
@dls-menu-item-background-color-current: #f2f7ff;
@dls-menu-item-background-color-current-hover: #e1edff;
@dls-menu-item-background-color-current-focus: #e1edff;
@dls-menu-item-background-color-current-active: #c0d9ff;
@dls-menu-item-group-label-font-color: #282c33;
@dls-menu-item-group-label-font-weight: 500;
@dls-menu-font-size-horizontal-m: 14px;
@dls-menu-item-height-horizontal-m: 64px;
@dls-menu-item-padding-x-horizontal: 16px;
@dls-menu-border-color-horizontal: #d3d9e6;
@dls-menu-item-font-color-horizontal: #282c33;
@dls-menu-item-font-color-horizontal-hover: #545b66;
@dls-menu-item-font-color-horizontal-focus: #545b66;
@dls-menu-item-font-color-horizontal-active: #000;
@dls-menu-item-font-color-horizontal-disabled: #a8b0bf;
@dls-menu-item-background-color-horizontal: #fff;
@dls-menu-item-background-color-horizontal-hover: #fff;
@dls-menu-item-background-color-horizontal-focus: #e1edff;
@dls-menu-item-background-color-horizontal-active: #fff;
@dls-menu-item-background-color-horizontal-disabled: #fff;
@dls-menu-item-font-color-horizontal-current: #0052cc;
@dls-menu-item-font-color-horizontal-current-hover: #0066ff;
@dls-menu-item-font-color-horizontal-current-focus: #0066ff;
@dls-menu-item-font-color-horizontal-current-active: #0046ad;
@dls-menu-item-background-color-horizontal-current: #fff;
@dls-menu-item-background-color-horizontal-current-hover: #fff;
@dls-menu-item-background-color-horizontal-current-focus: #e1edff;
@dls-menu-item-background-color-horizontal-current-active: #fff;
@dls-menu-item-shadow-horizontal-current: 0 1px 2px rgba(0, 82, 204, 0.4);
@dls-menu-card-background-color: #fff;
@dls-menu-card-border-radius-m: 4px;
@dls-menu-card-padding-x: 24px;
@dls-menu-card-padding-y: 24px;
@dls-menu-card-column-spacing: 48px;
@dls-menu-card-target-spacing: 4px;
@dls-menu-card-title-font-color: #282c33;
@dls-menu-card-title-font-size-m: 14px;
@dls-menu-card-title-font-weight: 500;
@dls-menu-card-item-spacing: 16px;
@dls-menu-card-item-font-size-m: 14px;
@dls-menu-card-item-icon-size: calc(1em + 2px);
@dls-nav-item-font-size: 14px;
@dls-nav-item-height: 64px;
@dls-nav-item-padding: 0;
@dls-nav-item-padding-more: 8px;
@dls-nav-item-spacing: 32px;
@dls-nav-item-content-spacing: 4px;
@dls-nav-item-icon-size-aux: calc(1em + 2px);
@dls-nav-item-font-color: #282c33;
@dls-nav-item-font-color-hover: #0066ff;
@dls-nav-item-font-color-focus: #0066ff;
@dls-nav-item-font-color-active: #0046ad;
@dls-nav-item-font-color-disabled: #a8b0bf;
@dls-nav-item-font-color-current: #0052cc;
@dls-nav-item-font-color-current-hover: #0066ff;
@dls-nav-item-font-color-current-focus: #0066ff;
@dls-nav-item-font-color-current-active: #0046ad;
@dls-nav-item-background-color-focus: #e1edff;
@dls-nav-item-icon-color-aux: currentColor;
@dls-nav-item-icon-color-aux-disabled: currentColor;
@dls-nav-item-icon-color-aux-current: currentColor;
@dls-nav-indicator-stroke-width: 3px;
@dls-nav-indicator-border-radius: 14px;
@dls-nav-indicator-width: 28px;
@dls-nav-indicator-width-hover: 12px;
@dls-nav-indicator-width-focus: 12px;
@dls-nav-indicator-width-active: 36px;
@dls-nav-indicator-color: #0052cc;
@dls-nav-indicator-color-hover: #0052cc;
@dls-nav-indicator-color-focus: #0052cc;
@dls-nav-indicator-color-active: #0052cc;
@dls-nav-card-background-color: #fff;
@dls-nav-card-border-radius: 4px;
@dls-nav-card-padding: 24px;
@dls-nav-card-column-spacing: 48px;
@dls-nav-card-target-spacing: 4px;
@dls-nav-card-title-font-color: #282c33;
@dls-nav-card-title-font-size: 14px;
@dls-nav-card-title-font-weight: 500;
@dls-nav-card-item-spacing: 16px;
@dls-nav-card-item-font-size: 14px;
@dls-nav-card-item-icon-size: calc(1em + 2px);
@dls-sidenav-item-height: 32px;
@dls-sidenav-padding-x: 8px;
@dls-sidenav-padding-y: 8px;
@dls-sidenav-item-padding-start: 24px;
@dls-sidenav-item-padding-end: 16px;
@dls-sidenav-item-level-indent: 16px;
@dls-sidenav-item-spacing: 8px;
@dls-sidenav-item-content-spacing: 8px;
@dls-sidenav-item-icon-size: calc(1em + 2px);
@dls-sidenav-item-icon-size-aux: calc(1em + 2px);
@dls-sidenav-item-font-size: 14px;
@dls-sidenav-item-group-font-weight: 500;
@dls-sidenav-item-font-color: #282c33;
@dls-sidenav-item-font-color-hover: #545b66;
@dls-sidenav-item-font-color-focus: #545b66;
@dls-sidenav-item-font-color-active: #000;
@dls-sidenav-item-font-color-disabled: #a8b0bf;
@dls-sidenav-item-font-color-current: #0052cc;
@dls-sidenav-item-font-color-current-hover: #0066ff;
@dls-sidenav-item-font-color-current-focus: #0066ff;
@dls-sidenav-item-font-color-current-active: #0046ad;
@dls-sidenav-item-icon-color: currentColor;
@dls-sidenav-item-icon-color-disabled: currentColor;
@dls-sidenav-item-icon-color-current: currentColor;
@dls-sidenav-item-icon-color-aux: currentColor;
@dls-sidenav-item-icon-color-aux-disabled: currentColor;
@dls-sidenav-item-icon-color-aux-current: currentColor;
@dls-sidenav-item-background-color: #fff;
@dls-sidenav-item-background-color-hover: #f6f7fa;
@dls-sidenav-item-background-color-focus: #e1edff;
@dls-sidenav-item-background-color-active: #e2e6f0;
@dls-sidenav-item-background-color-disabled: #fff;
@dls-sidenav-item-background-color-current: #f2f7ff;
@dls-sidenav-item-background-color-current-hover: #e1edff;
@dls-sidenav-item-background-color-current-focus: #e1edff;
@dls-sidenav-item-background-color-current-active: #c0d9ff;
@dls-sidenav-item-border-radius: 6px;
@dls-sidenav-width: 200px;
@dls-sidenav-width-collapsed: 60px;
@dls-select-width: 300px;
@dls-select-tag-height-xs: 16px;
@dls-select-tag-height-s: 20px;
@dls-select-tag-height-m: 24px;
@dls-select-tag-height-l: 28px;
@dls-select-padding-x: 12px;
@dls-select-padding-y: 4px;
@dls-select-content-spacing: 8px;
@dls-select-tag-spacing: 4px;
@dls-select-icon-size-aux: calc(1em + 2px);
@dls-select-icon-color-aux: #848b99;
@dls-select-icon-color-aux-disabled: #a8b0bf;
@dls-dropdown-icon-size-aux: calc(1em + 2px);
@dls-dropdown-icon-spacing-aux: 8px;
@dls-dropdown-split-button-padding-x: 12px;
@dls-dropdown-icon-color-aux-normal: #848b99;
@dls-dropdown-icon-color-aux-normal-disabled: #a8b0bf;
@dls-dropdown-icon-color-aux-primary: currentColor;
@dls-dropdown-icon-color-aux-primary-disabled: currentColor;
@dls-dropdown-max-display-items: 8;
@dls-dropdown-menu-max-height-xs: calc(24px * var(--dls-dropdown-max-display-items, 8) + 8px);
@dls-dropdown-menu-max-height-s: calc(28px * var(--dls-dropdown-max-display-items, 8) + 8px);
@dls-dropdown-menu-max-height-m: calc(32px * var(--dls-dropdown-max-display-items, 8) + 8px);
@dls-dropdown-menu-max-height-l: calc(36px * var(--dls-dropdown-max-display-items, 8) + 8px);
@dls-dropdown-menu-border-radius-xs: 2px;
@dls-dropdown-menu-border-radius-s: 2px;
@dls-dropdown-menu-border-radius-m: 4px;
@dls-dropdown-menu-border-radius-l: 6px;
@dls-dropdown-menu-target-spacing: 4px;
@dls-dropdown-menu-shadow: 0 4px 6px rgba(0, 0, 0, 0.06), 0 1px 10px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.01);
@dls-dropdown-menu-placeholder-padding-y: 8px;
@dls-dropdown-menu-placeholder-font-color: #848b99;
@dls-slider-thumb-size-s: 8px;
@dls-slider-thumb-size-m: 12px;
@dls-slider-track-min-width: 2px;
@dls-slider-track-width-s: 2px;
@dls-slider-track-width-m: 4px;
@dls-slider-track-border-radius-s: 1px;
@dls-slider-track-border-radius-m: 2px;
@dls-slider-thumb-dot-min-size: 2px;
@dls-slider-thumb-dot-size-s: 2px;
@dls-slider-thumb-dot-size-m: 4px;
@dls-slider-mark-min-size: 4px;
@dls-slider-mark-size-s: 4px;
@dls-slider-mark-size-m: 8px;
@dls-slider-font-size-s: 12px;
@dls-slider-font-size-m: 14px;
@dls-slider-font-color: #282c33;
@dls-slider-font-color-disabled: #a8b0bf;
@dls-slider-thumb-background-color: #0052cc;
@dls-slider-thumb-background-color-hover: #0066ff;
@dls-slider-thumb-background-color-focus: #0066ff;
@dls-slider-thumb-background-color-active: #0046ad;
@dls-slider-thumb-background-color-read-only: #a8b0bf;
@dls-slider-thumb-background-color-read-only-hover: #848b99;
@dls-slider-thumb-background-color-read-only-focus: #848b99;
@dls-slider-thumb-background-color-disabled: #e1edff;
@dls-slider-thumb-border-color-focus: #0052cc;
@dls-slider-thumb-border-color-read-only-focus: #0052cc;
@dls-slider-thumb-shadow-focus: 0 0 0 2px rgba(0, 102, 255, 0.2);
@dls-slider-thumb-shadow-read-only-focus: 0 0 0 2px rgba(0, 102, 255, 0.2);
@dls-slider-thumb-dot-color: #fff;
@dls-slider-track-color: #e2e6f0;
@dls-slider-track-color-hover: #d3d9e6;
@dls-slider-track-color-read-only: #e2e6f0;
@dls-slider-track-color-disabled: #e2e6f0;
@dls-slider-track-progress-color: #0052cc;
@dls-slider-track-progress-color-hover: #0066ff;
@dls-slider-track-progress-color-read-only: #a8b0bf;
@dls-slider-track-progress-color-disabled: #e1edff;
@dls-collapse-header-padding-x: 16px;
@dls-collapse-header-padding-y: 16px;
@dls-collapse-header-content-spacing: 8px;
@dls-collapse-header-font-size-s: 12px;
@dls-collapse-header-font-size-m: 14px;
@dls-collapse-header-line-height: 1.4;
@dls-collapse-body-padding-x: 16px;
@dls-collapse-body-padding-y: 16px;
@dls-collapse-body-font-size-s: 12px;
@dls-collapse-body-font-size-m: 14px;
@dls-collapse-body-line-height: 1.6;
@dls-collapse-border-radius-s: 2px;
@dls-collapse-border-radius-m: 4px;
@dls-collapse-icon-size-aux: calc(1em + 2px);
@dls-collapse-border-color: #e2e6f0;
@dls-collapse-header-font-color: #282c33;
@dls-collapse-header-font-color-disabled: #a8b0bf;
@dls-collapse-header-background-color: #f6f7fa;
@dls-collapse-header-background-color-hover: #ebedf5;
@dls-collapse-header-background-color-active: #e2e6f0;
@dls-collapse-header-background-color-disabled: #f6f7fa;
@dls-collapse-body-font-color: #545b66;
@dls-collapse-body-background-color: #fff;
@dls-collapse-icon-color-aux: #848b99;
@dls-collapse-icon-color-aux-disabled: #a8b0bf;
@dls-collapse-header-background-color-simple: transparent;
@dls-collapse-header-background-color-simple-hover: transparent;
@dls-collapse-header-background-color-simple-active: transparent;
@dls-collapse-header-background-color-simple-disabled: transparent;
@dls-collapse-body-background-color-simple: transparent;
@dls-collapse-header-background-color-basic: #fff;
@dls-collapse-header-background-color-basic-hover: #f6f7fa;
@dls-collapse-header-background-color-basic-active: #e2e6f0;
@dls-collapse-header-background-color-basic-disabled: #fff;
@dls-collapse-body-background-color-basic: #fff;
@dls-collapse-header-background-color-strong: #f6f7fa;
@dls-collapse-header-background-color-strong-hover: #ebedf5;
@dls-collapse-header-background-color-strong-active: #e2e6f0;
@dls-collapse-header-background-color-strong-disabled: #f6f7fa;
@dls-collapse-body-background-color-strong: #f6f7fa;
@dls-collapse-header-border-color-focus: #0052cc;
@dls-collapse-header-shadow-focus: 0 0 0 2px rgba(0, 102, 255, 0.2);
@dls-tooltip-max-width: calc(16em + 16px);
@dls-tooltip-font-size: 12px;
@dls-tooltip-line-height: 1.6;
@dls-tooltip-padding-x: 8px;
@dls-tooltip-padding-y: 4px;
@dls-tooltip-target-spacing: 4px;
@dls-tooltip-arrow-width: 8px;
@dls-tooltip-arrow-spacing: 8px;
@dls-tooltip-border-radius: 2px;
@dls-tooltip-font-color-normal: #282c33;
@dls-tooltip-background-color-normal: #fff;
@dls-tooltip-shadow-normal: 0 4px 6px rgba(0, 0, 0, 0.06), 0 1px 10px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.01);
@dls-tooltip-font-color-reverse: #fff;
@dls-tooltip-background-color-reverse: rgba(0, 0, 0, 0.6);
@dls-tooltip-shadow-reverse: none;
@dls-popover-max-width: 400px;
@dls-popover-line-height: 1.6;
@dls-popover-padding-x: 16px;
@dls-popover-padding-y: 16px;
@dls-popover-arrow-spacing: 12px;
@dls-popover-border-radius-s: 2px;
@dls-popover-border-radius-m: 4px;
@dls-popover-font-size-s: 12px;
@dls-popover-font-size-m: 14px;
@dls-popover-title-font-weight: 500;
@dls-popover-title-spacing-s: 4px;
@dls-popover-action-spacing-s: 8px;
@dls-popover-title-spacing-m: 8px;
@dls-popover-action-spacing-m: 12px;
@dls-popover-title-font-size-s: 14px;
@dls-popover-title-font-size-m: 16px;
@dls-dialog-width-wide: 800px;
@dls-dialog-width-medium: 600px;
@dls-dialog-width-narrow: 400px;
@dls-dialog-width-contextual: 400px;
@dls-dialog-border-radius: 6px;
@dls-dialog-spacing-y: 20px;
@dls-dialog-max-height: calc(100vh - 40px);
@dls-dialog-padding-x: 24px;
@dls-dialog-padding-y: 24px;
@dls-dialog-title-content-spacing: 16px;
@dls-dialog-title-spacing-after: 12px;
@dls-dialog-action-spacing-before: 20px;
@dls-dialog-action-content-spacing: 12px;
@dls-dialog-title-spacing-after-contextual: 4px;
@dls-dialog-icon-spacing-contextual: 12px;
@dls-dialog-icon-size-contextual: calc(1em + 2px);
@dls-dialog-title-line-height: 1.4;
@dls-dialog-body-line-height: 1.8;
@dls-dialog-title-font-size-s: 16px;
@dls-dialog-title-font-size-m: 18px;
@dls-dialog-body-font-size-s: 12px;
@dls-dialog-body-font-size-m: 14px;
@dls-dialog-title-font-weight: 500;
@dls-dialog-title-font-color: #282c33;
@dls-dialog-body-font-color: #282c33;
@dls-dialog-close-icon-size: calc(1em + 2px);
@dls-dialog-close-icon-size-fullscreen: calc(1em + 2px);
@dls-dialog-close-icon-min-size: 10px;
@dls-dialog-icon-color-info: #0052cc;
@dls-dialog-icon-color-success: #00bf5c;
@dls-dialog-icon-color-warning: #ffa733;
@dls-dialog-icon-color-error: #cc1800;
@dls-dialog-background-color: #fff;
@dls-dialog-backdrop-color: rgba(0, 0, 0, 0.6);
@dls-dialog-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.06), 0 3px 14px 2px rgba(0, 0, 0, 0.05), 0 5px 5px -3px rgba(0, 0, 0, 0.01);
@dls-drawer-width: 800px;
@dls-drawer-level-indent: 60px;
@dls-drawer-shadow-top: 0 8px 10px 1px rgba(0, 0, 0, 0.06), 0 3px 14px 2px rgba(0, 0, 0, 0.05), 0 5px 5px -3px rgba(0, 0, 0, 0.01);
@dls-drawer-shadow-right: 0 8px 10px 1px rgba(0, 0, 0, 0.06), 0 3px 14px 2px rgba(0, 0, 0, 0.05), 0 5px 5px -3px rgba(0, 0, 0, 0.01);
@dls-drawer-shadow-bottom: 0 8px 10px 1px rgba(0, 0, 0, 0.06), 0 3px 14px 2px rgba(0, 0, 0, 0.05), 0 5px 5px -3px rgba(0, 0, 0, 0.01);
@dls-drawer-shadow-left: 0 8px 10px 1px rgba(0, 0, 0, 0.06), 0 3px 14px 2px rgba(0, 0, 0, 0.05), 0 5px 5px -3px rgba(0, 0, 0, 0.01);
@dls-drawer-title-font-size-s: 16px;
@dls-drawer-title-font-size-m: 18px;
@dls-drawer-close-icon-size: calc(1em + 2px);
@dls-embedded-title-font-size-s: 16px;
@dls-embedded-title-font-size-m: 18px;
@dls-embedded-close-icon-size: calc(1em + 2px);
@dls-embedded-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.06), 0 3px 14px 2px rgba(0, 0, 0, 0.05), 0 5px 5px -3px rgba(0, 0, 0, 0.01);
@dls-embedded-border-color: #e2e6f0;
@dls-toast-font-size-s: 12px;
@dls-toast-font-size-m: 14px;
@dls-toast-border-radius-s: 2px;
@dls-toast-border-radius-m: 4px;
@dls-toast-line-height: 1.8;
@dls-toast-icon-size: calc(1em + 2px);
@dls-toast-icon-size-titled: calc(1em + 2px);
@dls-toast-icon-size-aux: calc(1em + 2px);
@dls-toast-padding-x: 16px;
@dls-toast-padding-y: 8px;
@dls-toast-padding-y-titled: 16px;
@dls-toast-content-spacing-before: 8px;
@dls-toast-content-spacing-after: 16px;
@dls-toast-spacing: 8px;
@dls-toast-max-width: 400px;
@dls-toast-list-spacing-before: 8px;
@dls-toast-title-font-size-s: 14px;
@dls-toast-title-font-size-m: 16px;
@dls-toast-title-font-weight: 500;
@dls-toast-title-line-height: 1.4;
@dls-toast-title-spacing-after: 4px;
@dls-toast-background-color: #fff;
@dls-toast-font-color: #282c33;
@dls-toast-title-font-color: #282c33;
@dls-toast-shadow: 0 4px 6px rgba(0, 0, 0, 0.06), 0 1px 10px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.01);
@dls-toast-icon-color-info: #0052cc;
@dls-toast-icon-color-success: #00bf5c;
@dls-toast-icon-color-warning: #ffa733;
@dls-toast-icon-color-error: #cc1800;
@dls-alert-font-size-s: 12px;
@dls-alert-font-size-m: 14px;
@dls-alert-border-radius-s: 2px;
@dls-alert-border-radius-m: 4px;
@dls-alert-line-height: 1.6;
@dls-alert-icon-size: calc(1em + 2px);
@dls-alert-icon-size-titled: calc(1em + 2px);
@dls-alert-icon-size-aux: calc(1em + 2px);
@dls-alert-padding-x: 16px;
@dls-alert-padding-y: 4px;
@dls-alert-padding-y-multiline: 8px;
@dls-alert-padding-y-titled: 16px;
@dls-alert-content-spacing-before: 8px;
@dls-alert-content-spacing-after: 16px;
@dls-alert-title-font-size-s: 12px;
@dls-alert-title-font-size-m: 14px;
@dls-alert-title-font-weight: 500;
@dls-alert-title-line-height: 1.4;
@dls-alert-title-spacing-after: 4px;
@dls-alert-font-color: #282c33;
@dls-alert-title-font-color: #282c33;
@dls-alert-background-color-info: #f2f7ff;
@dls-alert-background-color-success: #f2fff8;
@dls-alert-background-color-warning: #fffaf2;
@dls-alert-background-color-error: #fff4f2;
@dls-alert-border-color-info: transparent;
@dls-alert-border-color-success: transparent;
@dls-alert-border-color-warning: transparent;
@dls-alert-border-color-error: transparent;
@dls-alert-icon-color-info: #0052cc;
@dls-alert-icon-color-success: #00bf5c;
@dls-alert-icon-color-warning: #ffa733;
@dls-alert-icon-color-error: #cc1800;
@dls-alert-pages-spacing: 4px;
@dls-alert-pages-font-color: #848b99;
@dls-carousel-indicator-width: 12px;
@dls-carousel-indicator-width-current: 36px;
@dls-carousel-indicator-height: 3px;
@dls-carousel-indicator-dot-size: 6px;
@dls-carousel-indicator-border-radius: 1.5px;
@dls-carousel-indicator-spacing-outer: 12px;
@dls-carousel-indicator-spacing-inner: 4px;
@dls-carousel-indicator-background-color: rgba(255, 255, 255, 0.3);
@dls-carousel-indicator-background-color-hover: rgba(255, 255, 255, 0.4);
@dls-carousel-indicator-background-color-active: #fff;
@dls-carousel-indicator-background-color-current: #fff;
@dls-carousel-indicator-background-color-outside: #ebedf5;
@dls-carousel-indicator-background-color-outside-hover: #e2e6f0;
@dls-carousel-indicator-background-color-outside-active: #d3d9e6;
@dls-carousel-indicator-background-color-outside-current: #0052cc;
@dls-carousel-control-size: 32px;
@dls-carousel-control-border-radius: 50%;
@dls-carousel-control-shadow: 0 4px 6px rgba(0, 0, 0, 0.06), 0 1px 10px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.01);
@dls-carousel-control-icon-size: 16px;
@dls-carousel-control-spacing-inside: 24px;
@dls-carousel-control-spacing-outside: 16px;
@dls-carousel-pages-height: 20px;
@dls-carousel-pages-font-size: 12px;
@dls-carousel-pages-font-color: #fff;
@dls-carousel-pages-background-color: rgba(0, 0, 0, 0.6);
@dls-carousel-pages-padding-x: 4px;
@dls-carousel-pages-border-radius: 2px;
@dls-carousel-slide-gutter: 12px;
@dls-date-picker-width: 160px;
@dls-date-picker-width-range: 248px;
@dls-date-picker-font-size-s: 12px;
@dls-date-picker-font-size-m: 14px;
@dls-date-picker-dropdown-background-color: #fff;
@dls-date-picker-dropdown-border-radius-s: 2px;
@dls-date-picker-dropdown-border-radius-m: 4px;
@dls-date-picker-dropdown-shadow: 0 4px 6px rgba(0, 0, 0, 0.06), 0 1px 10px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.01);
@dls-date-picker-icon-color: #848b99;
@dls-date-picker-icon-color-disabled: #a8b0bf;
@dls-date-picker-range-connector-padding-x: 12px;
@dls-date-picker-range-panel-spacing: 8px;
@dls-date-picker-panel-separator-color: #e2e6f0;
@dls-date-picker-panel-padding-x: 16px;
@dls-date-picker-header-pagination-icon-size: calc(1em + 2px);
@dls-date-picker-header-icon-size-aux: calc(1em + 2px);
@dls-date-picker-header-padding-y: 8px;
@dls-date-picker-header-pagination-spacing: 12px;
@dls-date-picker-header-icon-aux-spacing: 8px;
@dls-date-picker-day-body-padding-top: 4px;
@dls-date-picker-day-body-padding-bottom: 12px;
@dls-date-picker-weekdays-spacing-after: 12px;
@dls-date-picker-month-body-padding-top: 24px;
@dls-date-picker-year-body-padding-top: 24px;
@dls-date-picker-cell-height-s: 28px;
@dls-date-picker-cell-height-m: 32px;
@dls-date-picker-cell-width-s: 28px;
@dls-date-picker-cell-width-m: 32px;
@dls-date-picker-cell-border-radius-s: 2px;
@dls-date-picker-cell-border-radius-m: 4px;
@dls-date-picker-cell-shadow-focus: 0 0 0 2px rgba(0, 102, 255, 0.2);
@dls-date-picker-cell-font-color: #282c33;
@dls-date-picker-cell-font-color-current: #0052cc;
@dls-date-picker-cell-font-color-aux: #848b99;
@dls-date-picker-cell-font-color-disabled: #a8b0bf;
@dls-date-picker-cell-font-color-selected: #fff;
@dls-date-picker-cell-font-weight: 400;
@dls-date-picker-cell-font-weight-selected: 500;
@dls-date-picker-day-cell-spacing-y: 4px;
@dls-date-picker-day-cell-spacing-x: 8px;
@dls-date-picker-month-cell-spacing-y: 20px;
@dls-date-picker-month-cell-padding-x: 8px;
@dls-date-picker-year-cell-spacing-y: 20px;
@dls-date-picker-year-cell-padding-x: 8px;
@dls-date-picker-cell-background-color: transparent;
@dls-date-picker-cell-background-color-hover: #f6f7fa;
@dls-date-picker-cell-background-color-focus: #f6f7fa;
@dls-date-picker-cell-background-color-active: #e2e6f0;
@dls-date-picker-cell-background-color-disabled: #f6f7fa;
@dls-date-picker-cell-background-color-selected: #0052cc;
@dls-date-picker-cell-background-color-selected-hover: #0066ff;
@dls-date-picker-cell-background-color-selected-focus: #0066ff;
@dls-date-picker-cell-background-color-selected-active: #0046ad;
@dls-date-picker-cell-background-color-aux: transparent;
@dls-date-picker-cell-background-color-aux-hover: #f6f7fa;
@dls-date-picker-cell-background-color-aux-focus: #f6f7fa;
@dls-date-picker-cell-background-color-aux-active: #e2e6f0;
@dls-date-picker-cell-background-color-range-end-hover: #e1edff;
@dls-date-picker-cell-background-color-range-end-active: #c0d9ff;
@dls-date-picker-cell-background-color-range-end-focus: #e1edff;
@dls-date-picker-cell-border-color: transparent;
@dls-date-picker-cell-border-color-focus: #0052cc;
@dls-date-picker-cell-border-color-range-end-hover: transparent;
@dls-date-picker-cell-border-color-range-end-active: transparent;
@dls-date-picker-list-item-height-m: 32px;
@dls-date-picker-list-item-height-s: 28px;
@dls-date-picker-list-padding-y: 8px;
@dls-date-picker-list-item-spacing: 4px;
@dls-date-picker-list-item-padding-x: 16px;
@dls-date-picker-list-background-color: transparent;
@dls-date-picker-list-background-color-hover: #f6f7fa;
@dls-date-picker-list-background-color-focus: #f6f7fa;
@dls-date-picker-list-background-color-active: #e2e6f0;
@dls-date-picker-list-background-color-selected: #f2f7ff;
@dls-date-picker-list-background-color-selected-hover: #e1edff;
@dls-date-picker-list-background-color-selected-focus: #e1edff;
@dls-date-picker-list-background-color-selected-active: #c0d9ff;
@dls-date-picker-list-font-color: #282c33;
@dls-date-picker-list-font-color-hover: #282c33;
@dls-date-picker-list-font-color-focus: #282c33;
@dls-date-picker-list-font-color-active: #282c33;
@dls-date-picker-list-font-color-selected: #0052cc;
@dls-date-picker-list-font-color-selected-hover: #0052cc;
@dls-date-picker-list-font-color-selected-focus: #0052cc;
@dls-date-picker-list-font-color-selected-active: #0052cc;
@dls-date-picker-list-font-weight: 400;
@dls-date-picker-list-font-weight-selected: 500;
@dls-date-picker-year-scroller-width: 80px;
@dls-uploader-font-size-s: 12px;
@dls-uploader-font-size-m: 14px;
@dls-uploader-helper-text-spacing-x: 8px;
@dls-uploader-helper-text-spacing-y: 4px;
@dls-uploader-helper-text-font-color: #848b99;
@dls-uploader-helper-text-max-width-media-s: 160px;
@dls-uploader-helper-text-max-width-media-m: 320px;
@dls-uploader-error-spacing: 4px;
@dls-uploader-file-item-spacing-y: 8px;
@dls-uploader-file-item-padding-x: 4px;
@dls-uploader-file-item-padding-y: 4px;
@dls-uploader-file-item-label-spacing: 4px;
@dls-uploader-file-item-action-spacing: 8px;
@dls-uploader-file-item-width: 264px;
@dls-uploader-file-item-background-color: transparent;
@dls-uploader-file-item-background-color-hover: #f6f7fa;
@dls-uploader-file-item-background-color-error: #fff4f2;
@dls-uploader-file-item-background-color-error-hover: #fff4f2;
@dls-uploader-file-item-font-color: #282c33;
@dls-uploader-file-item-icon-color: #282c33;
@dls-uploader-foreground-color-error: #cc1800;
@dls-uploader-foreground-color-success: #00bf5c;
@dls-uploader-media-border-color-error: #cc1800;
@dls-uploader-media-height-m: 160px;
@dls-uploader-media-height-s: 80px;
@dls-uploader-media-width-m: 160px;
@dls-uploader-media-width-s: 80px;
@dls-uploader-media-icon-size-m: 40px;
@dls-uploader-media-icon-size-s: 24px;
@dls-uploader-media-label-color: #848b99;
@dls-uploader-media-icon-color: #848b99;
@dls-uploader-media-padding-x-m: 12px;
@dls-uploader-media-padding-x-s: 8px;
@dls-uploader-media-content-spacing-m: 4px;
@dls-uploader-media-content-spacing-s: 4px;
@dls-uploader-mask-icon-color: #fff;
@dls-uploader-mask-icon-spacing: 12px;
@dls-uploader-mask-padding-y: 4px;
@dls-uploader-mask-padding-x: 12px;
@dls-uploader-mask-background-color: rgba(0, 0, 0, 0.6);
@dls-uploader-media-entry-spacing: 24px;
@dls-uploader-media-entry-content-spacing: 8px;
@dls-uploader-media-entry-icon-size: calc(1em + 2px);
@dls-uploader-media-spacing-x-m: 16px;
@dls-uploader-media-spacing-x-s: 12px;
@dls-uploader-media-spacing-y-m: 16px;
@dls-uploader-media-spacing-y-s: 12px;
@dls-uploader-media-preview-min-width: 240px;
@dls-uploader-media-preview-max-width: 480px;
@dls-table-column-min-width: calc(3em + 16px);
@dls-table-cell-border-color: #ebedf5;
@dls-table-header-border-color: #d3d9e6;
@dls-table-border-color-dragging: #d3d9e6;
@dls-table-padding-x: 16px;
@dls-table-cell-padding-x: 8px;
@dls-table-cell-padding-y: 12px;
@dls-table-cell-padding-y-compact: 8px;
@dls-table-cell-padding-y-loose: 16px;
@dls-table-cell-content-spacing: 4px;
@dls-table-cell-background-color: #fff;
@dls-table-cell-background-color-hover: #f6f7fa;
@dls-table-cell-font-color: #282c33;
@dls-table-header-padding-x: 8px;
@dls-table-header-padding-y: 12px;
@dls-table-header-padding-y-compact: 8px;
@dls-table-header-padding-y-loose: 16px;
@dls-table-header-background-color: #ebedf5;
@dls-table-header-background-color-hover: #e2e6f0;
@dls-table-header-font-weight: 500;
@dls-table-header-font-color: #282c33;
@dls-table-sub-row-background-color: #f6f7fa;
@dls-table-sub-row-background-color-hover: #ebedf5;
@dls-table-font-size-s: 12px;
@dls-table-font-size-m: 14px;
@dls-table-border-radius-s: 2px;
@dls-table-border-radius-m: 4px;
@dls-table-icon-size: calc(1em + 2px);
@dls-table-icon-size-aux: calc(1em + 2px);
@dls-table-header-icon-color: #a8b0bf;
@dls-table-header-icon-color-hover: #848b99;
@dls-table-header-icon-color-active: #545b66;
@dls-table-header-icon-color-disabled: #e2e6f0;
@dls-table-overflow-shadow-top: none;
@dls-table-overflow-shadow-right: 0 8px 10px 1px rgba(0, 0, 0, 0.06), 0 3px 14px 2px rgba(0, 0, 0, 0.05), 0 5px 5px -3px rgba(0, 0, 0, 0.01);
@dls-table-overflow-shadow-bottom: none;
@dls-table-overflow-shadow-left: 0 8px 10px 1px rgba(0, 0, 0, 0.06), 0 3px 14px 2px rgba(0, 0, 0, 0.05), 0 5px 5px -3px rgba(0, 0, 0, 0.01);
@dls-table-body-height-no-data: 108px;
@dls-table-action-spacing: 16px;
@dls-table-filter-action-padding-y: 16px;
@dls-table-filter-action-spacing: 16px;
@dls-form-label-spacing-after-horizontal: 24px;
@dls-form-label-spacing-after-vertical: 8px;
@dls-form-label-content-spacing: 4px;
@dls-form-label-width: 7em;
@dls-form-label-font-color: #282c33;
@dls-form-label-icon-color: #848b99;
@dls-form-label-required-color: #cc1800;
@dls-form-field-spacing-vertical: 24px;
@dls-form-field-error-font-color: #cc1800;
@dls-form-field-error-spacing-before-vertical: 4px;
@dls-form-actions-spacing-before: 40px;
@dls-form-actions-content-spacing: 20px;
@dls-form-field-help-spacing: 8px;
@dls-lightbox-padding-x: 24px;
@dls-lightbox-padding-y: 40px;
@dls-lightbox-content-spacing-y: 24px;
@dls-lightbox-content-spacing-x: 24px;
@dls-lightbox-backdrop-color: rgba(0, 0, 0, 0.6);
@dls-lightbox-font-color: #fff;
@dls-lightbox-font-size: 14px;
@dls-lightbox-close-icon-size: 24px;
@dls-lightbox-control-size: 48px;
@dls-lightbox-control-border-radius: 50%;
@dls-lightbox-control-icon-size: 24px;
@dls-cascader-column-min-width: 120px;
@dls-cascader-option-padding-xs: 12px;
@dls-cascader-option-padding-s: 12px;
@dls-cascader-option-padding-m: 12px;
@dls-cascader-option-padding-l: 12px;
@dls-cascader-header-padding-y: 8px;
@dls-cascader-footer-padding-y: 8px;
@dls-accordion-default-gutter: 16px;
@dls-layout-min-width: 1248px;
@dls-layout-background-color: #f6f7fa;
@dls-layout-header-height: 64px;
@dls-layout-header-background-color: #fff;
@dls-layout-header-shadow: 0 4px 10px rgba(0, 0, 0, 0.03), 0 3px 9px rgba(0, 0, 0, 0.02), 0 2px 8px rgba(0, 0, 0, 0.01);
@dls-layout-sidebar-background-color: #fff;
@dls-layout-sidebar-width: 200px;
@dls-layout-sidebar-width-slim: 60px;
@dls-layout-sidebar-shadow: 0 4px 10px rgba(0, 0, 0, 0.03), 0 3px 9px rgba(0, 0, 0, 0.02), 0 2px 8px rgba(0, 0, 0, 0.01);
@dls-layout-sidebar-separator-color: #e2e6f0;
@dls-layout-sidebar-toggle-height: 40px;
@dls-layout-sidebar-toggle-padding-x: 8px;
@dls-layout-sidebar-float-toggle-width: 18px;
@dls-layout-sidebar-float-toggle-radius: 4px;
@dls-layout-sidebar-float-button-font-color: #fff;
@dls-layout-sidebar-float-toggle-backgroud-color: #a8b0bf;
@dls-layout-sidebar-float-toggle-backgroud-color-hover: #848b99;
@dls-layout-sidebar-float-toggle-backgroud-color-active: #545b66;
@dls-layout-footer-height: 64px;
@dls-message-font-size-s: 12px;
@dls-message-font-size-m: 14px;
@dls-message-icon-size: calc(1em + 2px);
@dls-message-line-height: 1.4;
@dls-message-content-spacing: 4px;
@dls-message-font-color-standalone: #282c33;
@dls-message-font-color-info: #282c33;
@dls-message-font-color-success: #00bf5c;
@dls-message-font-color-warning: #ffa733;
@dls-message-font-color-error: #cc1800;
@dls-message-font-color-aux: #848b99;
@dls-message-icon-color-info: #0052cc;
@dls-message-icon-color-success: #00bf5c;
@dls-message-icon-color-warning: #ffa733;
@dls-message-icon-color-error: #cc1800;
@dls-message-icon-color-aux: #848b99;
@dls-empty-max-width-s: 240px;
@dls-empty-max-width-m: 320px;
@dls-empty-image-max-height-s: 48px;
@dls-empty-image-max-height-m: none;
@dls-empty-title-font-size-s: 12px;
@dls-empty-title-font-size-m: 14px;
@dls-empty-title-line-height: 1.4;
@dls-empty-title-font-color: #282c33;
@dls-empty-title-font-weight: 500;
@dls-empty-desc-font-size-s: 12px;
@dls-empty-desc-font-size-m: 14px;
@dls-empty-desc-line-height: 1.4;
@dls-empty-desc-font-color: #545b66;
@dls-empty-desc-font-weight: 400;
@dls-empty-content-spacing: 8px;
@dls-empty-actions-spacing-before: 16px;
@dls-empty-actions-content-spacing: 8px;
