/**
 * @tokens 1. Colors
 * @presenter Color
 */
:root {
  --zds-color-primary: #0070c0;
  --zds-color-secondary: #3da0fe;
  --zds-color-accent-01: #f7b556;
  --zds-color-accent-02: #ff7f66;
  --zds-color-accent-03: #6ac1cc;
  --zds-color-accent-04: #76c0f7;
  --zds-color-grey: #757575;
  --zds-color-grey-25: #f2f2f2;
  --zds-color-grey-50: #eeeeee;
  --zds-color-grey-100: #e6e6e6;
  --zds-color-grey-200: #d5d5d5;
  --zds-color-grey-300: #bdbdbd;
  --zds-color-grey-400: #9e9e9e;
  --zds-color-grey-500: #757575;
  --zds-color-grey-600: #616161;
  --zds-color-grey-700: #424242;
  --zds-color-grey-800: #383838;
  --zds-color-grey-900: #212121;
  --zds-color-white: #ffffff;
  --zds-color-black: #000000;
  --zds-color-danger: #f3263f;
  --zds-color-info: #007aff;
  --zds-color-success: #9acd32;
  --zds-color-warning: #e77824;
  --zds-color-highlight: #ffcc00;
  --zds-color-neutral: #757575;
  --zds-color-support-01: #9e9e9e;
  --zds-color-support-02: #bdbdbd;
  --zds-color-support-03: #d5d5d5;
  --zds-color-support-04: #e6e6e6;
  --zds-color-support-05: #eeeeee;
  --zds-color-support-06: #f2f2f2;
  --zds-color-accent-01-light: #f8c57f;
  --zds-color-accent-01-dark: #efa53a;
  --zds-color-accent-02-light: #f8beb2;
  --zds-color-accent-02-dark: #f26246;
  --zds-color-accent-03-light: #b0dee3;
  --zds-color-accent-03-dark: #4aafbc;
  --zds-color-accent-04-light: #b8dffa;
  --zds-color-accent-04-dark: #4ca3e3;
  --zds-color-highlight-dark: #e79e00;
  --zds-color-primary-dark: #004e86;
  --zds-color-primary-light: #0096ff;
  --zds-color-primary-subtle: rgba(0, 112, 192, 0.2);
  --zds-color-secondary-dark: #0171db;
  --zds-color-secondary-light: #91ceff;
  --zds-color-secondary-subtle: rgba(61, 160, 254, 0.2);
  --zds-color-accent-01-subtle: rgba(247, 181, 86, 0.2);
  --zds-color-accent-02-subtle: rgba(255, 127, 102, 0.2);
  --zds-color-accent-03-subtle: rgba(106, 193, 204, 0.2);
  --zds-color-accent-04-subtle: rgba(118, 192, 247, 0.2);
  --zds-color-danger-dark: #ba0a20;
  --zds-color-danger-light: #ff697c;
  --zds-color-danger-subtle: rgba(243, 38, 63, 0.2);
  --zds-color-info-dark: #0055b3;
  --zds-color-info-light: #3ba1ff;
  --zds-color-info-subtle: rgba(0, 122, 255, 0.2);
  --zds-color-success-dark: #6c9023;
  --zds-color-success-light: #bce765;
  --zds-color-success-subtle: rgba(154, 205, 50, 0.2);
  --zds-color-warning-dark: #a85312;
  --zds-color-warning-light: #fca35f;
  --zds-color-warning-subtle: rgba(231, 120, 36, 0.2);
  --zds-color-highlight-light: #ffe63b;
  --zds-color-highlight-subtle: rgba(255, 204, 0, 0.2);
  --zds-color-neutral-dark: #525252;
  --zds-color-neutral-light: #989898;
  --zds-color-neutral-subtle: rgba(117, 117, 117, 0.2);
  --zds-color-primary-foreground: #ffffff;
  --zds-color-primary-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-primary-light-foreground: #ffffff;
  --zds-color-primary-light-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-primary-dark-foreground: #ffffff;
  --zds-color-primary-dark-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-secondary-foreground: #ffffff;
  --zds-color-secondary-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-secondary-light-foreground: #ffffff;
  --zds-color-secondary-light-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-secondary-dark-foreground: #ffffff;
  --zds-color-secondary-dark-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-accent-01-foreground: #212121;
  --zds-color-accent-01-foreground-hover: #000000;
  --zds-color-accent-01-light-foreground: #212121;
  --zds-color-accent-01-light-foreground-hover: #000000;
  --zds-color-accent-01-dark-foreground: #212121;
  --zds-color-accent-01-dark-foreground-hover: #000000;
  --zds-color-accent-02-foreground: #ffffff;
  --zds-color-accent-02-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-accent-02-light-foreground: #ffffff;
  --zds-color-accent-02-light-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-accent-02-dark-foreground: #ffffff;
  --zds-color-accent-02-dark-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-accent-03-foreground: #212121;
  --zds-color-accent-03-foreground-hover: #000000;
  --zds-color-accent-03-light-foreground: #212121;
  --zds-color-accent-03-light-foreground-hover: #000000;
  --zds-color-accent-03-dark-foreground: #212121;
  --zds-color-accent-03-dark-foreground-hover: #000000;
  --zds-color-accent-04-foreground: #212121;
  --zds-color-accent-04-foreground-hover: #000000;
  --zds-color-accent-04-light-foreground: #212121;
  --zds-color-accent-04-light-foreground-hover: #000000;
  --zds-color-accent-04-dark-foreground: #212121;
  --zds-color-accent-04-dark-foreground-hover: #000000;
  --zds-color-grey-foreground: #ffffff;
  --zds-color-grey-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-grey-25-foreground: #212121;
  --zds-color-grey-25-foreground-hover: #000000;
  --zds-color-grey-50-foreground: #212121;
  --zds-color-grey-50-foreground-hover: #000000;
  --zds-color-grey-100-foreground: #212121;
  --zds-color-grey-100-foreground-hover: #000000;
  --zds-color-grey-200-foreground: #212121;
  --zds-color-grey-200-foreground-hover: #000000;
  --zds-color-grey-300-foreground: #212121;
  --zds-color-grey-300-foreground-hover: #000000;
  --zds-color-grey-400-foreground: #ffffff;
  --zds-color-grey-400-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-grey-500-foreground: #ffffff;
  --zds-color-grey-500-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-grey-600-foreground: #ffffff;
  --zds-color-grey-600-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-grey-700-foreground: #ffffff;
  --zds-color-grey-700-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-grey-800-foreground: #ffffff;
  --zds-color-grey-800-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-grey-900-foreground: #ffffff;
  --zds-color-grey-900-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-white-foreground: #212121;
  --zds-color-white-foreground-hover: #000000;
  --zds-color-black-foreground: #ffffff;
  --zds-color-black-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-danger-foreground: #ffffff;
  --zds-color-danger-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-danger-light-foreground: #ffffff;
  --zds-color-danger-light-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-danger-dark-foreground: #ffffff;
  --zds-color-danger-dark-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-info-foreground: #ffffff;
  --zds-color-info-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-info-light-foreground: #ffffff;
  --zds-color-info-light-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-info-dark-foreground: #ffffff;
  --zds-color-info-dark-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-success-foreground: #212121;
  --zds-color-success-foreground-hover: #000000;
  --zds-color-success-light-foreground: #212121;
  --zds-color-success-light-foreground-hover: #000000;
  --zds-color-success-dark-foreground: #212121;
  --zds-color-success-dark-foreground-hover: #000000;
  --zds-color-warning-foreground: #ffffff;
  --zds-color-warning-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-warning-light-foreground: #ffffff;
  --zds-color-warning-light-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-warning-dark-foreground: #ffffff;
  --zds-color-warning-dark-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-highlight-foreground: #212121;
  --zds-color-highlight-foreground-hover: #000000;
  --zds-color-highlight-light-foreground: #212121;
  --zds-color-highlight-light-foreground-hover: #000000;
  --zds-color-highlight-dark-foreground: #212121;
  --zds-color-highlight-dark-foreground-hover: #000000;
  --zds-color-neutral-foreground: #ffffff;
  --zds-color-neutral-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-neutral-light-foreground: #ffffff;
  --zds-color-neutral-light-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-neutral-dark-foreground: #ffffff;
  --zds-color-neutral-dark-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-support-01-foreground: #ffffff;
  --zds-color-support-01-foreground-hover: rgba(255, 255, 255, 0.69);
  --zds-color-support-02-foreground: #212121;
  --zds-color-support-02-foreground-hover: #000000;
  --zds-color-support-03-foreground: #212121;
  --zds-color-support-03-foreground-hover: #000000;
  --zds-color-support-04-foreground: #212121;
  --zds-color-support-04-foreground-hover: #000000;
  --zds-color-support-05-foreground: #212121;
  --zds-color-support-05-foreground-hover: #000000;
  --zds-color-support-06-foreground: #212121;
  --zds-color-support-06-foreground-hover: #000000;
  --zds-color-primary-subtle-foreground: #212121;
  --zds-color-primary-subtle-foreground-hover: #000000;
  --zds-color-secondary-subtle-foreground: #212121;
  --zds-color-secondary-subtle-foreground-hover: #000000;
  --zds-color-accent-01-subtle-foreground: #212121;
  --zds-color-accent-01-subtle-foreground-hover: #000000;
  --zds-color-accent-02-subtle-foreground: #212121;
  --zds-color-accent-02-subtle-foreground-hover: #000000;
  --zds-color-accent-03-subtle-foreground: #212121;
  --zds-color-accent-03-subtle-foreground-hover: #000000;
  --zds-color-accent-04-subtle-foreground: #212121;
  --zds-color-accent-04-subtle-foreground-hover: #000000;
  --zds-color-danger-subtle-foreground: #212121;
  --zds-color-danger-subtle-foreground-hover: #000000;
  --zds-color-info-subtle-foreground: #212121;
  --zds-color-info-subtle-foreground-hover: #000000;
  --zds-color-success-subtle-foreground: #212121;
  --zds-color-success-subtle-foreground-hover: #000000;
  --zds-color-warning-subtle-foreground: #212121;
  --zds-color-warning-subtle-foreground-hover: #000000;
  --zds-color-highlight-subtle-foreground: #212121;
  --zds-color-highlight-subtle-foreground-hover: #000000;
  --zds-color-neutral-subtle-foreground: #212121;
  --zds-color-neutral-subtle-foreground-hover: #000000;
  --zds-accordion-header-color: #212121;
  --zds-accordion-icon-color: #212121;
  --zds-avatar-color: #ffffff;
  --zds-breadcrumb-color: #0070c0;
  --zds-button-preset-primary-contained-color: #ffffff;
  --zds-button-preset-primary-outlined-color: #0070c0;
  --zds-button-preset-primary-text-color: #0070c0;
  --zds-button-preset-secondary-contained-color: #ffffff;
  --zds-button-preset-secondary-outlined-color: #3da0fe;
  --zds-button-preset-secondary-text-color: #3da0fe;
  --zds-button-preset-accent-contained-color: #212121;
  --zds-button-preset-accent-outlined-color: color-mix(in srgb, #efa53a 80%, black);
  --zds-button-preset-accent-text-color: color-mix(in srgb, #efa53a 80%, black);
  --zds-button-preset-neutral-contained-color: #212121;
  --zds-button-preset-neutral-outlined-color: #212121;
  --zds-button-preset-neutral-text-color: #212121;
  --zds-card-border-color: #d5d5d5;
  --zds-card-color: #212121;
  --zds-card-status-color: #ffffff;
  --zds-card-icon-color: #0070c0;
  --zds-card-preheader-color: #212121;
  --zds-card-header-color: #212121;
  --zds-card-subheader-color: #212121;
  --zds-card-footer-border-color: #d5d5d5;
  --zds-datepicker-button-color: #ffffff;
  --zds-datepicker-header-color: #212121;
  --zds-divider-color: #212121;
  --zds-elevate-box-shadow-color: #00000029;
  --zds-input-color: #212121;
  --zds-input-placeholder-color: #9e9e9e;
  --zds-link-cta-color: #0070c0;
  --zds-link-color: #0070c0;
  --zds-map-marker-color: #ffffff;
  --zds-modal-header-color: #212121;
  --zds-modal-scroll-shadow-color: #00000029;
  --zds-navigation-color: #212121;
  --zds-navigation-link-color: #212121;
  --zds-navigation-body-link-color: #212121;
  --zds-navigation-title-color: #0070c0;
  --zds-navigation-panel-link-color: #212121;
  --zds-navigation-panel-link-level-2-color: #212121;
  --zds-super-navigation-link-color: #0070c0;
  --zds-pagination-color: #212121;
  --zds-popout-border-color: #d5d5d5;
  --zds-popout-box-shadow-color: #00000029;
  --zds-progress-arrow-color: #ffffff;
  --zds-progress-bar-color: #0070c0;
  --zds-spinner-color: #0070c0;
  --zds-stepper-indicator-active-color: #ffffff;
  --zds-stepper-indicator-complete-color: #9acd32;
  --zds-stepper-indicator-incomplete-color: #0070c0;
  --zds-stepper-indicator-unvisited-color: #929292;
  --zds-tab-color: #212121;
  --zds-outline-color: #0070c0;
  --zds-text-color-base: #212121;
  --zds-text-color-base-hover: #000000;
  --zds-text-color-muted: #929292;
  --zds-text-color-loud: #000000;
  --zds-text-color-contrast: #ffffff;
  --zds-text-color-contrast-hover: #ffffffb0;
  --zds-typography-headline-xs-color: var(--zds-color-primary);
  --zds-typography-headline-sm-color: var(--zds-color-primary);
  --zds-typography-headline-md-color: var(--zds-color-primary);
  --zds-typography-headline-lg-color: var(--zds-color-primary);
  --zds-typography-headline-xl-color: var(--zds-color-primary);
  --zds-typography-headline-xxl-color: var(--zds-color-primary);
  --zds-typography-headline-color-primary-subtle-foreground: #0070C0;
  --zds-typography-headline-color-primary-subtle-foreground-hover: #0070C0;
  --zds-typography-headline-color-secondary-subtle-foreground: #3DA0FE;
  --zds-typography-headline-color-secondary-subtle-foreground-hover: #3DA0FE;
  --zds-typography-headline-color-accent-01-subtle-foreground: #F7B556;
  --zds-typography-headline-color-accent-01-subtle-foreground-hover: #F7B556;
  --zds-typography-headline-color-accent-02-subtle-foreground: #FF7F66;
  --zds-typography-headline-color-accent-02-subtle-foreground-hover: #FF7F66;
  --zds-typography-headline-color-accent-03-subtle-foreground: #6AC1CC;
  --zds-typography-headline-color-accent-03-subtle-foreground-hover: #6AC1CC;
  --zds-typography-headline-color-accent-04-subtle-foreground: #76C0F7;
  --zds-typography-headline-color-accent-04-subtle-foreground-hover: #76C0F7;
  --zds-typography-headline-color-danger-subtle-foreground: #F3263F;
  --zds-typography-headline-color-danger-subtle-foreground-hover: #F3263F;
  --zds-typography-headline-color-info-subtle-foreground: #007aff;
  --zds-typography-headline-color-info-subtle-foreground-hover: #007aff;
  --zds-typography-headline-color-success-subtle-foreground: #9ACD32;
  --zds-typography-headline-color-success-subtle-foreground-hover: #9ACD32;
  --zds-typography-headline-color-warning-subtle-foreground: #e77824;
  --zds-typography-headline-color-warning-subtle-foreground-hover: #e77824;
  --zds-typography-headline-color-highlight-subtle-foreground: #FFCC00;
  --zds-typography-headline-color-highlight-subtle-foreground-hover: #FFCC00;
  --zds-typography-headline-color-neutral-subtle-foreground: #757575;
  --zds-typography-headline-color-neutral-subtle-foreground-hover: #757575;
}

/**
 * @tokens 3. Border Radius
 * @presenter BorderRadius
 */
:root {
  --zds-card-border-radius: 8px;
  --zds-dialog-border-radius: 4px;
  --zds-popout-border-radius: 8px;
  --zds-shape-radius-xs: 2px;
  --zds-shape-radius-sm: 4px;
  --zds-shape-radius-md: 8px;
  --zds-shape-radius-lg: 12px;
  --zds-shape-radius-xl: 24px;
  --zds-shape-radius-pill: 1000px;
  --zds-shape-radius-circle: 50%;
}

/**
 * @tokens 2. Spacing
 * @presenter Spacing
 */
:root {
  --zds-space-xxs: 4px;
  --zds-space-xs: 8px;
  --zds-space-sm: 12px;
  --zds-space-md: 16px;
  --zds-space-lg: 24px;
  --zds-space-xl: 32px;
  --zds-space-xxl: 48px;
  --zds-space-xxxl: 64px;
  --zds-space-base: 16px;
}

/**
 * @tokens General
 */
:root {
  --zds-gradient-01-from: #0070c0;
  --zds-gradient-01-to: #004e86;
  --zds-gradient-01-foreground: #ffffff;
  --zds-gradient-01-foreground-hover: #ffffffb0;
  --zds-gradient-02-from: rgba(0, 112, 192, 0.2);
  --zds-gradient-02-to: #ffffff;
  --zds-gradient-02-foreground: #212121;
  --zds-gradient-02-foreground-hover: #000000;
  --zds-accordion-body-inset: 8px 0px 16px;
  --zds-accordion-divider-background: #3a3e4133;
  --zds-accordion-divider-height: 1px;
  --zds-accordion-header-color-hover: #0070c0;
  --zds-accordion-header-color-active: #0070c0;
  --zds-accordion-header-font-family: Poppins, Arial, Helvetica, sans-serif;
  --zds-accordion-header-font-size: 1rem;
  --zds-accordion-header-font-weight: 700;
  --zds-accordion-header-inset: 16px 0px 16px;
  --zds-accordion-icon-color-hover: #0070c0;
  --zds-accordion-icon-color-active: #0070c0;
  --zds-accordion-icon-font-size: 1.838rem;
  --zds-avatar-background: #3da0fe;
  --zds-avatar-border-color: #3da0fe;
  --zds-avatar-border-radius: 50%;
  --zds-avatar-border-width: 2px;
  --zds-backdrop-background: #2121213F;
  --zds-backdrop-blur: 3px;
  --zds-badge-border-radius: 4px;
  --zds-badge-empty-size: 12px;
  --zds-badge-font-size: .75em;
  --zds-badge-font-weight: 400;
  --zds-badge-inset-x: .65em;
  --zds-badge-inset-y: .35em;
  --zds-breadcrumb-color-hover: #0070c0;
  --zds-breadcrumb-font-size: 1rem;
  --zds-breadcrumb-text-decoration: none;
  --zds-breadcrumb-text-decoration-hover: underline;
  --zds-button-border-radius: 0px;
  --zds-button-border-width: 1px;
  --zds-button-font-family: Poppins, Arial, Helvetica, sans-serif;
  --zds-button-font-style: normal;
  --zds-button-font-weight: 600;
  --zds-button-inset-x: 16px;
  --zds-button-inset-y: 6px;
  --zds-button-scale-hover: 1;
  --zds-button-text-transform: uppercase;
  --zds-button-preset-primary-contained-background: #0070c0;
  --zds-button-preset-primary-contained-background-hover: #004e86;
  --zds-button-preset-primary-contained-border-color: #0070c0;
  --zds-button-preset-primary-contained-border-color-hover: #004e86;
  --zds-button-preset-primary-contained-color-hover: #ffffff;
  --zds-button-preset-primary-outlined-background-hover: color-mix(in srgb, #0070c0 10%, transparent);
  --zds-button-preset-primary-outlined-border-color: #0070c0;
  --zds-button-preset-primary-outlined-border-color-hover: #004e86;
  --zds-button-preset-primary-outlined-color-hover: #004e86;
  --zds-button-preset-primary-text-background-hover: color-mix(in srgb, #0070c0 10%, transparent);
  --zds-button-preset-primary-text-color-hover: #004e86;
  --zds-button-preset-secondary-contained-background: #3da0fe;
  --zds-button-preset-secondary-contained-background-hover: #0171db;
  --zds-button-preset-secondary-contained-border-color: #3da0fe;
  --zds-button-preset-secondary-contained-border-color-hover: #0171db;
  --zds-button-preset-secondary-contained-color-hover: #ffffff;
  --zds-button-preset-secondary-outlined-background-hover: color-mix(in srgb, #3da0fe 10%, transparent);
  --zds-button-preset-secondary-outlined-border-color: #3da0fe;
  --zds-button-preset-secondary-outlined-border-color-hover: #0171db;
  --zds-button-preset-secondary-outlined-color-hover: #0171db;
  --zds-button-preset-secondary-text-background-hover: color-mix(in srgb, #3da0fe 10%, transparent);
  --zds-button-preset-secondary-text-color-hover: #0171db;
  --zds-button-preset-accent-contained-background: #f7b556;
  --zds-button-preset-accent-contained-background-hover: #efa53a;
  --zds-button-preset-accent-contained-border-color: #f7b556;
  --zds-button-preset-accent-contained-border-color-hover: #efa53a;
  --zds-button-preset-accent-contained-color-hover: #212121;
  --zds-button-preset-accent-outlined-background-hover: color-mix(in srgb, #f7b556 10%, transparent);
  --zds-button-preset-accent-outlined-border-color: #efa53a;
  --zds-button-preset-accent-outlined-border-color-hover: color-mix(in srgb, #efa53a 80%, black);
  --zds-button-preset-accent-outlined-color-hover: color-mix(in srgb, #efa53a 80%, black);
  --zds-button-preset-accent-text-background-hover: color-mix(in srgb, #f7b556 10%, transparent);
  --zds-button-preset-accent-text-color-hover: color-mix(in srgb, #efa53a 80%, black);
  --zds-button-preset-neutral-contained-background: #e6e6e6;
  --zds-button-preset-neutral-contained-background-hover: #d5d5d5;
  --zds-button-preset-neutral-contained-border-color: #e6e6e6;
  --zds-button-preset-neutral-contained-border-color-hover: #d5d5d5;
  --zds-button-preset-neutral-contained-color-hover: #000000;
  --zds-button-preset-neutral-outlined-background-hover: color-mix(in srgb, #e6e6e6 25%, transparent);
  --zds-button-preset-neutral-outlined-border-color: #e6e6e6;
  --zds-button-preset-neutral-outlined-border-color-hover: #d5d5d5;
  --zds-button-preset-neutral-outlined-color-hover: #000000;
  --zds-button-preset-neutral-text-background-hover: color-mix(in srgb, #e6e6e6 25%, transparent);
  --zds-button-preset-neutral-text-color-hover: #000000;
  --zds-card-background: #ffffff;
  --zds-card-border-color-hover: #bdbdbd;
  --zds-card-border-width: 1px;
  --zds-card-box-shadow: none;
  --zds-card-box-shadow-hover: none;
  --zds-card-transition: 300ms ease-out;
  --zds-card-status-background: #0070c0;
  --zds-card-body-inset: 12px;
  --zds-card-icon-color-hover: #004e86;
  --zds-card-icon-transform-hover: translateY(-5px);
  --zds-card-header-color-hover: #212121;
  --zds-card-header-font-size: var(--zds-font-size-xl);
  --zds-card-footer-border-width: 1px;
  --zds-carousel-pagination-color-active: #0070c0;
  --zds-checkbox-inset-x: 0px;
  --zds-checkbox-inset-y: 6px;
  --zds-chip-background: #eeeeee;
  --zds-chip-background-hover: #e6e6e6;
  --zds-chip-border-radius: 1000px;
  --zds-chip-font-size: 0.875rem;
  --zds-chip-inset-x: .75em;
  --zds-chip-inset-y: .35em;
  --zds-datepicker-button-background: #9e9e9e;
  --zds-datepicker-button-background-active: #0070c0;
  --zds-datepicker-button-background-hover: #004e86;
  --zds-datepicker-button-background-other: #eeeeee;
  --zds-datepicker-button-color-active: #ffffff;
  --zds-datepicker-button-color-hover: #ffffff;
  --zds-datepicker-button-color-other: #212121;
  --zds-divider-color-light: #ffffff;
  --zds-drawer-border-radius: 12px;
  --zds-drawer-inset-x: 24px;
  --zds-elevate-box-shadow-blur-radius: 10px;
  --zds-elevate-box-shadow-offset-x: 0px;
  --zds-elevate-box-shadow-offset-y: 2px;
  --zds-elevate-box-shadow-spread-radius: 0px;
  --zds-grid-gutter-x: 24px;
  --zds-grid-gutter-y: 24px;
  --zds-input-date-gap: 8px;
  --zds-input-background: #ffffff;
  --zds-input-background-disabled: #eeeeee;
  --zds-input-background-on: #0070c0;
  --zds-input-border-color: #e6e6e6;
  --zds-input-border-color-focus: #0070c0;
  --zds-input-border-color-invalid: #f3263f;
  --zds-input-border-radius: 4px;
  --zds-input-border-width: 1px;
  --zds-input-box-shadow-focus: 0 0 0 0.25rem rgba(0, 112, 192, 0.2);
  --zds-input-box-shadow-invalid: 0 0 0 0.25rem rgba(243, 38, 63, 0.2);
  --zds-input-error-color: #f3263f;
  --zds-input-placeholder-font-style: normal;
  --zds-item-background-color-hover: transparent;
  --zds-item-color-hover: #0070c0;
  --zds-item-inset-x: 0px;
  --zds-item-inset-y: 16px;
  --zds-item-label-color: #0070c0;
  --zds-link-cta-color-hover: #004e86;
  --zds-link-cta-color-visited: #0070c0;
  --zds-link-cta-text-decoration: none;
  --zds-link-cta-text-decoration-hover: underline;
  --zds-link-color-hover: #004e86;
  --zds-link-color-visited: #0070c0;
  --zds-link-text-decoration: none;
  --zds-link-text-decoration-hover: underline;
  --zds-map-marker-background: #0070c0;
  --zds-map-marker-background-hover: #004e86;
  --zds-map-marker-background-active: #004e86;
  --zds-map-marker-border-radius: 50%;
  --zds-map-marker-border-width: 2px;
  --zds-map-marker-box-shadow: 0px 3px 10px rgba(0, 0, 0, 50%);
  --zds-map-marker-box-shadow-hover: 0px 0px 0px 4px #0070c070;
  --zds-map-marker-box-shadow-active: 0px 0px 0px 4px #0070c070;
  --zds-map-marker-color-hover: #ffffff;
  --zds-map-marker-color-active: #ffffff;
  --zds-map-marker-font-weight: bold;
  --zds-map-marker-inset: 8px;
  --zds-map-marker-cluster-box-shadow: 0px 0px 0px 4px #0070c0A8;
  --zds-map-marker-cluster-box-shadow-hover: 0px 0px 0px 4px #0070c0A8;
  --zds-map-marker-cluster-box-shadow-active: 0px 0px 0px 4px #0070c0A8;
  --zds-map-marker-selected-border-color: #ffffff;
  --zds-map-marker-selected-border-style: solid;
  --zds-map-marker-selected-border-width: 2px;
  --zds-modal-border-radius: 12px;
  --zds-modal-header-font-family: Poppins, Arial, Helvetica, sans-serif;
  --zds-modal-header-font-size: 1.225rem;
  --zds-modal-header-font-weight: 700;
  --zds-modal-header-text-align: center;
  --zds-modal-inset: 32px;
  --zds-modal-max-height: 1000px;
  --zds-modal-scroll-shadow-blur-radius: 10px;
  --zds-modal-scroll-shadow-offset-y: 6px;
  --zds-modal-scroll-shadow-spread-radius: -6px;
  --zds-modal-width: 500px;
  --zds-navigation-background: #ffffff;
  --zds-navigation-link-color-active: #0070c0;
  --zds-navigation-link-color-hover: #0070c0;
  --zds-navigation-link-font-family: Poppins, Arial, Helvetica, sans-serif;
  --zds-navigation-link-font-weight: 700;
  --zds-navigation-link-size: 1rem;
  --zds-navigation-link-text-transform: none;
  --zds-navigation-logo-scale-hover: 1.02;
  --zds-navigation-body-link-color-active: #0070c0;
  --zds-navigation-body-link-color-hover: #0070c0;
  --zds-navigation-body-link-size: var(--zds-font-size-xl);
  --zds-navigation-body-link-icon-size: var(--zds-font-size-xl);
  --zds-navigation-title-size: var(--zds-font-size-xxxl);
  --zds-navigation-panel-link-color-hover: #212121;
  --zds-navigation-panel-link-size: var(--zds-font-size-xl);
  --zds-navigation-panel-link-icon-size: var(--zds-font-size-xl);
  --zds-navigation-panel-link-level-2-color-hover: #212121;
  --zds-super-navigation-background: #f2f2f2;
  --zds-super-navigation-font-size: 0.875rem;
  --zds-super-navigation-link-color-hover: #0070c0;
  --zds-pagination-background-active: #0070c0;
  --zds-pagination-border-radius: 4px;
  --zds-pagination-color-active: #ffffff;
  --zds-pagination-font-weight: bold;
  --zds-pagination-inset-x: .75rem;
  --zds-pagination-inset-y: .5rem;
  --zds-pagination-text-decoration: none;
  --zds-pagination-text-decoration-hover: underline;
  --zds-pane-background: #ffffff;
  --zds-pane-border-color: #eeeeee;
  --zds-pane-border-color-hover: #e6e6e6;
  --zds-pane-border-radius: 12px;
  --zds-pane-border-width: 1px;
  --zds-pane-box-shadow: 0 5px 16px color-mix(in srgb, var(--zds-color-grey-900) 5%, transparent);
  --zds-pane-box-shadow-hover: 0 5px 16px color-mix(in srgb, var(--zds-color-grey-900) 15%, transparent);
  --zds-pane-inset-x: 24px;
  --zds-pane-inset-y: 24px;
  --zds-popout-background: #ffffff;
  --zds-popout-border-width: 1px;
  --zds-popout-box-shadow-blur-radius: 10px;
  --zds-popout-box-shadow-offset-y: 2px;
  --zds-popout-inset: 24px;
  --zds-progress-arrow-arrow-width: 20px;
  --zds-progress-arrow-background: #007aff;
  --zds-progress-arrow-padding: 16px;
  --zds-progress-bar-background: rgba(0, 0, 0, 0.1);
  --zds-radio-inset-x: 0px;
  --zds-radio-inset-y: 6px;
  --zds-range-slider-selected-background: #0070c0;
  --zds-range-slider-input-width: 6rem;
  --zds-side-sheet-inset-x: 24px;
  --zds-side-sheet-inset-y: 24px;
  --zds-stepper-indicator-active-background: #0070c0;
  --zds-stepper-indicator-active-border-color: transparent;
  --zds-stepper-indicator-complete-background: rgba(154, 205, 50, 0.2);
  --zds-stepper-indicator-complete-border-color: transparent;
  --zds-stepper-indicator-incomplete-background: transparent;
  --zds-stepper-indicator-incomplete-border-color: #0070c0;
  --zds-stepper-indicator-unvisited-background: transparent;
  --zds-stepper-indicator-unvisited-border-color: #929292;
  --zds-switch-inset-x: 0px;
  --zds-switch-inset-y: 10px;
  --zds-switch-box-shadow-off: 0 0 0 0.25rem #d5d5d533;
  --zds-table-background-hover: #eeeeee;
  --zds-table-border-color: #e6e6e6;
  --zds-table-header-border-color: #212121;
  --zds-table-vertical-align: top;
  --zds-tab-background-hover: #f2f2f2;
  --zds-tab-color-active: #212121;
  --zds-tab-font-weight-active: bold;
  --zds-tab-outline-offset-focus: -1px;
  --zds-tab-indicator-background: #0070c0;
  --zds-textarea-border-radius: 4px;
  --zds-outline-shape: solid 3px;
  --zds-outline-offset: 3px;
  --zds-motion-image-hover-transform: scale(1.05);
  --zds-motion-image-hover-transition: 250ms ease-out;
  --zds-text-shadow-base: 0px 1px 5px #0000004d;
  --zds-text-transform-headline: none;
  --zds-text-transform-subheadline: none;
  --zds-text-transform-body: none;
  --zds-text-transform-label: uppercase;
  --zds-text-transform-caption: none;
  --zds-text-transform-overline: uppercase;
  --zds-font-family-headline: Poppins, Arial, Helvetica, sans-serif;
  --zds-font-family-subheadline: Poppins, Arial, Helvetica, sans-serif;
  --zds-font-family-body: Poppins, Arial, Helvetica, sans-serif;
  --zds-font-family-label: Poppins, Arial, Helvetica, sans-serif;
  --zds-font-size-xxs: 0.544rem;
  --zds-font-size-xs: 0.666rem;
  --zds-font-size-sm: 0.816rem;
  --zds-font-size-md: 1rem;
  --zds-font-size-lg: 1.225rem;
  --zds-font-size-xl: 1.501rem;
  --zds-font-size-xxl: 1.838rem;
  --zds-font-size-xxxl: 2.252rem;
  --zds-font-size-xxxxl: 2.759rem;
  --zds-font-size-base: 0.875rem;
  --zds-font-style-headline: normal;
  --zds-font-style-subheadline: normal;
  --zds-font-style-body: normal;
  --zds-font-style-label: normal;
  --zds-font-style-caption: normal;
  --zds-font-style-overline: normal;
  --zds-font-weight-headline: 700;
  --zds-font-weight-subheadline: 400;
  --zds-font-weight-body: 400;
  --zds-font-weight-label: 400;
  --zds-font-weight-caption: 400;
  --zds-font-weight-overline: 400;
  --zds-typography-headline-xs-font-family: var(--zds-font-family-headline);
  --zds-typography-headline-xs-font-size: var(--zds-font-size-md);
  --zds-typography-headline-xs-font-style: var(--zds-font-style-headline);
  --zds-typography-headline-xs-font-weight: var(--zds-font-weight-headline);
  --zds-typography-headline-xs-letter-spacing: var(--zds-letter-spacing-headline);
  --zds-typography-headline-xs-line-height: 1.2;
  --zds-typography-headline-xs-text-transform: var(--zds-text-transform-headline);
  --zds-typography-headline-sm-font-family: var(--zds-font-family-headline);
  --zds-typography-headline-sm-font-size: var(--zds-font-size-lg);
  --zds-typography-headline-sm-font-style: var(--zds-font-style-headline);
  --zds-typography-headline-sm-font-weight: var(--zds-font-weight-headline);
  --zds-typography-headline-sm-letter-spacing: var(--zds-letter-spacing-headline);
  --zds-typography-headline-sm-line-height: 1.2;
  --zds-typography-headline-sm-text-transform: var(--zds-text-transform-headline);
  --zds-typography-headline-md-font-family: var(--zds-font-family-headline);
  --zds-typography-headline-md-font-size: var(--zds-font-size-xl);
  --zds-typography-headline-md-font-style: var(--zds-font-style-headline);
  --zds-typography-headline-md-font-weight: var(--zds-font-weight-headline);
  --zds-typography-headline-md-letter-spacing: var(--zds-letter-spacing-headline);
  --zds-typography-headline-md-line-height: 1.2;
  --zds-typography-headline-md-text-transform: var(--zds-text-transform-headline);
  --zds-typography-headline-lg-font-family: var(--zds-font-family-headline);
  --zds-typography-headline-lg-font-size: var(--zds-font-size-xxl);
  --zds-typography-headline-lg-font-style: var(--zds-font-style-headline);
  --zds-typography-headline-lg-font-weight: var(--zds-font-weight-headline);
  --zds-typography-headline-lg-letter-spacing: var(--zds-letter-spacing-headline);
  --zds-typography-headline-lg-line-height: 1.2;
  --zds-typography-headline-lg-text-transform: var(--zds-text-transform-headline);
  --zds-typography-headline-xl-font-family: var(--zds-font-family-headline);
  --zds-typography-headline-xl-font-size: var(--zds-font-size-xxxl);
  --zds-typography-headline-xl-font-style: var(--zds-font-style-headline);
  --zds-typography-headline-xl-font-weight: var(--zds-font-weight-headline);
  --zds-typography-headline-xl-letter-spacing: var(--zds-letter-spacing-headline);
  --zds-typography-headline-xl-line-height: 1.2;
  --zds-typography-headline-xl-text-transform: var(--zds-text-transform-headline);
  --zds-typography-headline-xxl-font-family: var(--zds-font-family-headline);
  --zds-typography-headline-xxl-font-size: var(--zds-font-size-xxxxl);
  --zds-typography-headline-xxl-font-style: var(--zds-font-style-headline);
  --zds-typography-headline-xxl-font-weight: var(--zds-font-weight-headline);
  --zds-typography-headline-xxl-letter-spacing: var(--zds-letter-spacing-headline);
  --zds-typography-headline-xxl-line-height: 1.2;
  --zds-typography-headline-xxl-text-transform: var(--zds-text-transform-headline);
  --zds-letter-spacing-headline: 0px;
  --zds-letter-spacing-subheadline: 0px;
  --zds-letter-spacing-body: 0px;
  --zds-letter-spacing-label: 0px;
  --zds-letter-spacing-caption: 0px;
  --zds-letter-spacing-overline: 0px;
}

@media (min-width: 0) and (max-width: 599.98px) { :root {
  --zds-pane-inset-x: 16px;
  --zds-pane-inset-y: 16px;
  --zds-progress-arrow-padding: 12px 8px;
  --zds-font-size-xxs: 0.702rem;
  --zds-font-size-xs: 0.79rem;
  --zds-font-size-sm: 0.889rem;
  --zds-font-size-md: 1rem;
  --zds-font-size-lg: 1.125rem;
  --zds-font-size-xl: 1.226rem;
  --zds-font-size-xxl: 1.424rem;
  --zds-font-size-xxxl: 1.602rem;
  --zds-font-size-xxxxl: 1.802rem;
  --zds-font-size-base: 1rem;
} }

@media (min-width: 600px) and (max-width: 839.98px) { :root {
  --zds-pane-inset-x: 16px;
  --zds-pane-inset-y: 16px;
  --zds-progress-arrow-padding: 12px 8px;
} }

@media (min-width: 840px) and (max-width: 1279.98px) { :root {
  --zds-card-body-inset: 16px;
  --zds-grid-gutter-x: 32px;
  --zds-grid-gutter-y: 32px;
} }

@media (min-width: 1280px) and (max-width: 1499.98px) { :root {
  --zds-card-body-inset: 24px;
  --zds-grid-gutter-x: 32px;
  --zds-grid-gutter-y: 32px;
} }

@media (min-width: 1500px) { :root {
  --zds-card-body-inset: 32px;
  --zds-grid-gutter-x: 48px;
  --zds-grid-gutter-y: 48px;
} }

