html {
  --color-gray-level-0: var(--white);
  --color-gray-level-10: var(--gray-tone1-10);
  --color-gray-level-50: var(--gray-tone1-50);
  --color-gray-level-100: var(--gray-tone1-100);
  --color-gray-level-200: var(--gray-tone1-200);
  --color-gray-level-300: var(--gray-tone1-300);
  --color-gray-level-400: var(--gray-tone1-400);
  --color-gray-level-500: var(--gray-tone1-500);
  --color-gray-level-600: var(--gray-tone1-600);
  --color-gray-level-700: var(--gray-tone1-700);
  --color-gray-level-800: var(--gray-tone1-800);
  --color-gray-level-900: var(--gray-tone1-900);
  --color-gray-level-1000: var(--black);
  /* General Tokens - Color - Text */

  --color-text-primary-minus-2: var(--gray-tone1-600);
  --color-text-primary-minus-1: var(--gray-tone1-700);
  --color-text-primary-main: var(--gray-tone1-800);
  --color-text-primary-plus-1: var(--gray-tone1-900);
  --color-text-primary-plus-2: var(--black);
  --color-text-primary-disabled: var(--gray-tone1-400);

  --color-text-secondary-minus-2: var(--gray-tone1-600);
  --color-text-secondary-minus-1: var(--gray-tone1-700);
  --color-text-secondary-main: var(--gray-tone1-800);
  --color-text-secondary-plus-1: var(--gray-tone1-900);
  --color-text-secondary-plus-2: var(--black);
  --color-text-secondary-disabled: var(--gray-tone1-300);

  --color-text-holiday-minus-3: var(--red-tone1-10);
  --color-text-holiday-minus-2: var(--red-tone1-200);
  --color-text-holiday-minus-1: var(--red-tone1-300);
  --color-text-holiday-main: var(--red-tone1-500);
  --color-text-holiday-plus-1: var(--red-tone1-600);
  --color-text-holiday-plus-2: var(--red-tone1-700);
  --color-text-holiday-disabled: var(--red-tone1-700);

  /* --------------------------------------------------------------------- */

  /* General Tokens - Color - Backgrounds */

  --color-background-default: var(--white);
  --color-background-page-1: var(--white);
  --color-background-page-2: var(--gray-tone1-50);

  --color-background-paper-level-1: var(--white);
  --color-background-paper-level-2: var(--gray-tone1-50);
  --color-background-paper-level-3: var(--gray-tone1-50);
  --color-background-paper-level-4: var(--gray-tone1-100);

  --color-background-paper-inner-level-1: var(--white);
  --color-background-paper-inner-level-2: var(--white);
  --color-background-paper-inner-level-3: var(--white);
  --color-background-paper-inner-level-4: var(--white);

  --color-background-page: var(--gray-tone1-10);
  --color-paper-background-level-1: var(--white);
  --color-paper-background-level-2: var(--gray-tone1-50);
  --color-paper-background-level-3: var(--white);
  --color-paper-background-level-4: var(--gray-tone1-50);
  --color-paper-background-level-5: var(--white);

  --color-divider1: var(--gray-tone1-200);
  --color-divider2: var(--gray-tone1-200);

  /* --------------------------------------------------------------------- */

  /* General Tokens - Colors (Primary - Secondary - Tertiary) */
  --color-primary-minus-4: var(--yellow-tone3-10);
  --color-primary-minus-3: var(--yellow-tone3-50);
  --color-primary-minus-2: var(--yellow-tone3-300);
  --color-primary-minus-1: var(--yellow-tone3-400);
  --color-primary-main: var(--yellow-tone3-600);
  --color-primary-plus-1: var(--yellow-tone3-500);
  --color-primary-plus-2: var(--yellow-tone3-700);
  --color-primary-contrast-text: var(--white);

  --color-secondary-minus-2: var(--yellow-tone3-10);
  --color-secondary-minus-1: var(--yellow-tone3-50);
  --color-secondary-minus-2: var(--yellow-tone3-300);
  --color-secondary-minus-1: var(--yellow-tone3-400);
  --color-secondary-main: var(--yellow-tone3-500);
  --color-secondary-plus-1: var(--yellow-tone3-600);
  --color-secondary-plus-2: var(--yellow-tone3-700);
  --color-secondary-contrast-text: var(--white);

  --color-tertiary-minus-2: var(--yellow-tone3-10);
  --color-tertiary-minus-1: var(--yellow-tone3-50);
  --color-tertiary-minus-2: var(--yellow-tone3-300);
  --color-tertiary-minus-1: var(--yellow-tone3-400);
  --color-tertiary-main: var(--yellow-tone3-500);
  --color-tertiary-plus-1: var(--yellow-tone3-600);
  --color-tertiary-plus-2: var(--yellow-tone3-700);
  --color-tertiary-contrast-text: var(--white);

  /* --------------------------------------------------------------------- */

  /* General Tokens - Color - System Feedback */

  --color-info-minus-2: var(--blue-tone3-200);
  --color-info-minus-1: var(--blue-tone3-400);
  --color-info-main: var(--blue-tone3-500);
  --color-info-plus-1: var(--blue-tone3-700);
  --color-info-plus-2: var(--blue-tone3-800);
  --color-info-contrast-text: var(--white);

  --color-success-minus-2: var(--green-tone1-200);
  --color-success-minus-1: var(--green-tone1-300);
  --color-success-main: var(--green-tone1-500);
  --color-success-plus-1: var(--green-tone1-700);
  --color-success-plus-2: var(--green-tone1-800);
  --color-success-contrast-text: var(--black);

  --color-error-minus-2: var(--red-tone1-200);
  --color-error-minus-1: var(--red-tone1-300);
  --color-error-main: var(--red-tone1-500);
  --color-error-plus-1: var(--red-tone1-700);
  --color-error-plus-2: var(--red-tone1-800);
  --color-error-contrast-text: var(--white);

  --color-warning-minus-2: var(--yellow-tone1-200);
  --color-warning-minus-1: var(--yellow-tone1-300);
  --color-warning-main: var(--yellow-tone1-500);
  --color-warning-plus-1: var(--yellow-tone1-600);
  --color-warning-plus-2: var(--yellow-tone1-800);
  --color-warning-contrast-text: var(--back);

  /* --------------------------------------------------------------------- */
  --color-button-primary-minus-4: var(--yellow-tone3-10);
  --color-button-primary-minus-3: var(--yellow-tone3-50);
  --color-button-primary-minus-2: var(--yellow-tone3-300);
  --color-button-primary-minus-1: var(--yellow-tone3-400);
  --color-button-primary-main: var(--yellow-tone3-500);
  --color-button-primary-plus-1: var(--yellow-tone3-600);
  --color-button-primary-plus-2: var(--yellow-tone3-700);
  --color-button-primary-contrast-text: var(--white);
  --color-button-primary-text-disabled: var(--white);
  --color-button-primary-hover: var(--yellow-tone3-600);

  /* General Tokens - Color - Action */
  --color-link-active: var(--yellow-tone3-600);
  --color-link-hover: var(--yellow-tone3-400);
  --color-link-focus: var(--yellow-tone3-800);

  --color-action-active: var(--yellow-tone1-500);
  --color-action-hover: var(--yellow-tone1-600);
  --color-action-focus: var(--yellow-tone1-700);
  --color-action-selected: var(--yellow-tone1-800);
  --color-action-disabled: var(--gray-tone1-300);
  --color-action-disabled-background: var(--gray-tone1-50);

  /* --------------------------------------------------------------------- */

  /* Other */

  --color-outline: var(--gray-tone1-600);
  --color-scrollbar-thumb: var(--gray-tone1-400);
  --color-scrollbar-thumb-hover: var(--gray-tone1-500);
  --color-scrollbar-track: var(--gray-tone1-300);
  --color-scrollbar-fake-track-opacity: 0.3;

  /* --------------------------------------------------------------------- */


  --font-family: var(--font-name-main);
  --font-family-alternate: var(--font-name-alternate);
  --font-family-clock: var(--font-name-clock);

  /* General Tokens - Font - Size */
  --font-size-h1: calc(var(--rem-size-8) * 1rem);
  --font-size-h2: calc(var(--rem-size-7-5) * 1rem);
  --font-size-h3: calc(var(--rem-size-7) * 1rem);
  --font-size-h4: calc(var(--rem-size-6) * 1rem);
  --font-size-h5: calc(var(--rem-size-5) * 1rem);
  --font-size-h6: calc(var(--rem-size-5) * 1rem);
  --font-size-body1: calc(var(--rem-size-4) * 1rem);
  --font-size-body2: calc(var(--rem-size-2) * 1rem);
  --font-size-subtitle1: calc(var(--rem-size-4) * 1rem);
  --font-size-subtitle2: calc(var(--rem-size-4) * 1rem);
  --font-size-button1: calc(var(--rem-size-4) * 1rem);
  --font-size-button2: calc(var(--rem-size-2) * 1rem);
  --font-size-caption: calc(var(--rem-size-2) * 1rem);
  --font-size-overline: calc(var(--rem-size-2) * 1rem);
  --font-size-tiny: calc(var(--rem-size-1) * 1rem);
  --font-size-x-small: calc(var(--rem-size-1) * 1rem);
  --font-size-small: calc(var(--rem-size-2) * 1rem);
  --font-size-normal: calc(var(--rem-size-4) * 1rem);
  --font-size-large: calc(var(--rem-size-5) * 1rem);
  --font-size-x-large: calc(var(--rem-size-6) * 1rem);
  --font-size-xx-large: calc(var(--rem-size-7) * 1rem);

  /* --------------------------------------------------------------------- */

  /* General Tokens - Font - Weight */
  --font-weight-black: var(--font-weight-900);
  --font-weight-extra-bold: var(--font-weight-800);
  --font-weight-bold: var(--font-weight-700);
  --font-weight-demibold: var(--font-weight-600);
  --font-weight-medium: var(--font-weight-500);
  --font-weight-regular: var(--font-weight-400);
  --font-weight-minus-1: var(--font-weight-300);
  --font-weight-minus-2: var(--font-weight-200);
  --font-weight-thin: var(--font-weight-100);

  --font-weight-h1: var(--font-weight-extra-bold);
  --font-weight-h2: var(--font-weight-bold);
  --font-weight-h3: var(--font-weight-bold);
  --font-weight-h4: var(--font-weight-bold);
  --font-weight-h5: var(--font-weight-bold);
  --font-weight-h6: var(--font-weight-medium);
  --font-weight-body1: var(--font-weight-regular);
  --font-weight-body2: var(--font-weight-regular);
  --font-weight-subtitle1: var(--font-weight-bold);
  --font-weight-subtitle2: var(--font-weight-medium);
  --font-weight-button1: var(--font-weight-demibold);
  --font-weight-button2: var(--font-weight-bold);
  --font-weight-caption: var(--font-weight-minus-1);
  --font-weight-overline: var(--font-weight-medium);
  --font-weight-tiny: var(--font-weight-demibold);

  /* --------------------------------------------------------------------- */

  /* General Tokens - Font - Line Height */
  --line-height-h1: calc(var(--rem-size-15) * 1rem);
  --line-height-h2: calc(var(--rem-size-14) * 1rem);
  --line-height-h3: calc(var(--rem-size-13) * 1rem);
  --line-height-h4: calc(var(--rem-size-12) * 1rem);
  --line-height-h5: calc(var(--rem-size-11) * 1rem);
  --line-height-h6: calc(var(--rem-size-11) * 1rem);
  --line-height-body1: calc(var(--rem-size-9) * 1rem);
  --line-height-body2: calc(var(--rem-size-8) * 1rem);
  --line-height-subtitle1: calc(var(--rem-size-9) * 1rem);
  --line-height-subtitle2: calc(var(--rem-size-9) * 1rem);
  --line-height-button1: calc(var(--rem-size-9) * 1rem);
  --line-height-button2: calc(var(--rem-size-8) * 1rem);
  --line-height-caption: calc(var(--rem-size-8) * 1rem);
  --line-height-overline: calc(var(--rem-size-8) * 1rem);
  --line-height-tiny: calc(var(--rem-size-6) * 1rem);
  --line-height-x-small: calc(var(--rem-size-5) * 1rem);
  --line-height-small: calc(var(--rem-size-7) * 1rem);
  --line-height-normal: calc(var(--rem-size-6) * 1rem);
  --line-height-large: calc(var(--rem-size-10) * 1rem);
  --line-height-x-large: calc(var(--rem-size-12) * 1rem);
  --line-height-xx-large: calc(var(--rem-size-13) * 1rem);

  /* --------------------------------------------------------------------- */

  /* General Tokens - Scree Size */
  --screen-xs-end: calc(var(--screen-sm) * 1px - 1px);
  --screen-sm-end: calc(var(--screen-md) * 1px - 1px);
  --screen-md-end: calc(var(--screen-lg) * 1px - 1px);
  --screen-lg-end: calc(var(--screen-xl) * 1px - 1px);

  /* --------------------------------------------------------------------- */

  /* General Tokens - Spacing */
  --spacing-none: calc(var(--point-0) * 1px);
  --spacing-xxx-small: calc(var(--point-1) * 1px);
  --spacing-xx-small: calc(var(--point-2) * 1px);
  --spacing-x-small: calc(var(--point-4) * 1px);
  --spacing-small: calc(var(--point-6) * 1px);
  --spacing-normal: calc(var(--point-8) * 1px);
  --spacing-large: calc(var(--point-12) * 1px);
  --spacing-x-large: calc(var(--point-16) * 1px);
  --spacing-xx-large: calc(var(--point-24) * 1px);
  --spacing-xxx-large: calc(var(--point-32) * 1px);

  /* --------------------------------------------------------------------- */

  /* General Tokens - Radius */
  --border-radius-xx-small: calc(var(--point-2) * 1px);
  --border-radius-x-small: calc(var(--point-4) * 1px);
  --border-radius-small: calc(var(--point-8) * 1px);
  --border-radius-normal: calc(var(--point-12) * 1px);
  --border-radius-large: calc(var(--point-16) * 1px);
  --border-radius-x-large: calc(var(--point-24) * 1px);
  --border-radius-xx-large: calc(var(--point-32) * 1px);

  /* --------------------------------------------------------------------- */

  --member-layout-width: 400px;
  --member-layout-width-mobile: 320px;
  --member-layout-width-wide: 600px;

  /* --------------------------------------------------------------------- */

  --header-image: url("../images/header/header-summer-light.webp");
  --header-image-mobile: url("../images/header/header-summer-light.webp");
  --color-box-border: var(--gray-tone1-200);
  --color-footer: var(--color-gray-level-800);
  --color-footer-text: var(--color-gray-level-200);

  --color-radcom-logo-1: var(--red-tone1-500);
  --color-radcom-logo-2: var(--color-gray-level-800);

  --color-dropdown-paper-level-1: var(--white);
  --color-dropdown-paper-level-2: var(--gray-tone1-50);
  --color-dropdown-paper-level-3: var(--gray-tone1-50);
  --color-dropdown-border: var(--color-gray-level-200);
  --color-dropdown-selected: var(--gray-tone1-100);
  --color-dropdown-hover: var(--gray-tone1-50);
  --color-dropdown-level-3: var(--gray-tone1-300);
  --color-dropdown-level-4: var(--gray-tone1-500);

  --color-logo: var(--yellow-tone3-600);
  --color-switch-background: var(--yellow-tone3-600);
  --color-switch-button: var(--white);


  /* General Tokens - Shadow */

  --shadow-card: var(--shadow-tone1-100);
  --shadow-header: var(--shadow-tone1-200);
  --shadow-alert: var(--shadow-tone1-300);
  --shadow-dropdown: var(--shadow-tone1-400);
  --shadow-top-fixed-action: var(--shadow-tone1-500);
  --shadow-bottom-fixed-action: var(--shadow-tone1-600);
  --shadow-drawer: var(--shadow-tone1-700);
  --shadow-dialog: var(--shadow-tone1-800);
  --shadow: var(--shadow-tone1);
  --shadow-light: var(--shadow-tone1-light);
  --shadow-top-light: var(--shadow-tone1-top-light);
  --shadow-bottom-light: var(--shadow-tone1-bottom-light);
  --shadow-inset: var(--shadow-inset-tone1);

  /* --------------------------------------------------------------------- */
}

/* --------------------------------------------------------------------------------------------------------------------------------------- */

html[data-theme="dark"] {
  --color-gray-level-0: var(--black);
  --color-gray-level-10: var(--gray-tone2-900);
  --color-gray-level-50: var(--gray-tone2-800);
  --color-gray-level-100: var(--gray-tone2-700);
  --color-gray-level-200: var(--gray-tone2-600);
  --color-gray-level-300: var(--gray-tone2-500);
  --color-gray-level-400: var(--gray-tone2-400);
  --color-gray-level-500: var(--gray-tone2-300);
  --color-gray-level-600: var(--gray-tone2-200);
  --color-gray-level-700: var(--gray-tone2-100);
  --color-gray-level-800: var(--gray-tone2-50);
  --color-gray-level-900: var(--gray-tone2-10);
  --color-gray-level-1000: var(--white);
  /* General Tokens - Color - Text */

  --color-text-primary-minus-2: var(--gray-tone1-400);
  --color-text-primary-minus-1: var(--gray-tone1-300);
  --color-text-primary-main: var(--gray-tone1-200);
  --color-text-primary-plus-1: var(--gray-tone1-100);
  --color-text-primary-plus-2: var(--gray-tone1-50);
  --color-text-primary-disabled: var(--gray-tone1-700);

  --color-text-secondary-minus-2: var(--gray-tone1-400);
  --color-text-secondary-minus-1: var(--gray-tone1-300);
  --color-text-secondary-main: var(--gray-tone1-200);
  --color-text-secondary-plus-1: var(--gray-tone1-100);
  --color-text-secondary-plus-2: var(--gray-tone1-50);
  --color-text-secondary-disabled: var(--gray-tone1-700);

  --color-text-holiday-minus-3: transparent;
  --color-text-holiday-minus-2: var(--red-tone2-900);
  --color-text-holiday-minus-1: var(--red-tone2-800);
  --color-text-holiday-main: var(--red-tone2-500);
  --color-text-holiday-plus-1: var(--red-tone2-400);
  --color-text-holiday-plus-2: var(--red-tone2-300);
  --color-text-holiday-disabled: var(--red-tone2-300);

  /* --------------------------------------------------------------------- */

  /* General Tokens - Color - Backgrounds */

  --color-background-default: var(--black);
  --color-background-page-1: var(--gray-tone2-900);
  --color-background-page-2: var(--gray-tone2-900);

  --color-background-paper-level-1: var(--gray-tone2-800);
  --color-background-paper-level-2: var(--gray-tone2-800);
  --color-background-paper-level-3: var(--gray-tone2-700);
  --color-background-paper-level-4: var(--gray-tone2-600);

  --color-background-paper-inner-level-1: var(--gray-tone2-800);
  --color-background-paper-inner-level-2: var(--gray-tone2-900);
  --color-background-paper-inner-level-3: var(--gray-tone2-800);
  --color-background-paper-inner-level-4: var(--gray-tone2-700);

  --color-background-page: var(--gray-tone2-900);
  --color-paper-background-level-1: var(--gray-tone2-900);
  --color-paper-background-level-2: var(--gray-tone2-700);
  --color-paper-background-level-3: var(--gray-tone2-700);
  --color-paper-background-level-4: var(--gray-tone2-800);
  --color-paper-background-level-5: var(--gray-tone2-800);

  --color-divider1: var(--gray-tone2-400);
  --color-divider2: var(--gray-tone2-500);

  /* --------------------------------------------------------------------- */

  /* General Tokens - Colors (Primary - Secondary - Tertiary) */

  --color-primary-minus-4: var(--yellow-tone4-900);
  --color-primary-minus-3: var(--yellow-tone4-900);
  --color-primary-minus-2: var(--yellow-tone4-700);
  --color-primary-minus-1: var(--yellow-tone4-600);
  --color-primary-main: var(--yellow-tone4-500);
  --color-primary-plus-1: var(--yellow-tone4-400);
  --color-primary-plus-2: var(--yellow-tone4-300);
  --color-primary-contrast-text: var(--black);

  --color-secondary-minus-4: var(--yellow-tone4-900);
  --color-secondary-minus-3: var(--yellow-tone4-900);
  --color-secondary-minus-2: var(--yellow-tone4-700);
  --color-secondary-minus-1: var(--yellow-tone4-600);
  --color-secondary-main: var(--yellow-tone4-500);
  --color-secondary-plus-1: var(--yellow-tone4-400);
  --color-secondary-plus-2: var(--yellow-tone4-300);
  --color-secondary-contrast-text: var(--black);

  --color-tertiary-minus-4: var(--yellow-tone4-900);
  --color-tertiary-minus-3: var(--yellow-tone4-900);
  --color-tertiary-minus-2: var(--yellow-tone4-700);
  --color-tertiary-minus-1: var(--yellow-tone4-600);
  --color-tertiary-main: var(--yellow-tone4-500);
  --color-tertiary-plus-1: var(--yellow-tone4-400);
  --color-tertiary-plus-2: var(--yellow-tone4-300);
  --color-tertiary-contrast-text: var(--black);

  /* --------------------------------------------------------------------- */

  /* General Tokens - Color - System Feedback */

  --color-info-minus-2: var(--blue-tone4-800);
  --color-info-minus-1: var(--blue-tone4-700);
  --color-info-main: var(--blue-tone4-500);
  --color-info-plus-1: var(--blue-tone4-400);
  --color-info-plus-2: var(--blue-tone4-200);
  --color-info-contrast-text: var(--back);

  --color-success-minus-2: var(--green-tone2-800);
  --color-success-minus-1: var(--green-tone2-700);
  --color-success-main: var(--green-tone2-500);
  --color-success-plus-1: var(--green-tone2-300);
  --color-success-plus-2: var(--green-tone2-200);
  --color-success-contrast-text: var(--black);

  --color-error-minus-2: var(--red-tone2-700);
  --color-error-minus-1: var(--red-tone2-600);
  --color-error-main: var(--red-tone2-500);
  --color-error-plus-1: var(--red-tone2-300);
  --color-error-plus-2: var(--red-tone2-200);
  --color-error-contrast-text: var(--black);

  --color-warning-minus-2: var(--yellow-tone2-800);
  --color-warning-minus-1: var(--yellow-tone2-700);
  --color-warning-main: var(--yellow-tone2-500);
  --color-warning-plus-1: var(--yellow-tone2-300);
  --color-warning-plus-2: var(--yellow-tone2-200);
  --color-warning-contrast-text: var(--back);

  /* --------------------------------------------------------------------- */

  --color-button-primary-minus-4: var(--yellow-tone4-900);
  --color-button-primary-minus-3: var(--yellow-tone4-900);
  --color-button-primary-minus-2: var(--yellow-tone4-700);
  --color-button-primary-minus-1: var(--yellow-tone4-600);
  --color-button-primary-main: var(--yellow-tone4-500);
  --color-button-primary-plus-1: var(--yellow-tone4-400);
  --color-button-primary-plus-2: var(--yellow-tone4-300);
  --color-button-primary-contrast-text: var(--black);
  --color-button-primary-text-disabled: var(--yellow-tone4-400);
  --color-button-primary-hover: var(--yellow-tone4-400);

  /* General Tokens - Color - Action */
  --color-link-active: var(--yellow-tone3-600);
  --color-link-hover: var(--yellow-tone3-800);
  --color-link-focus: var(--yellow-tone3-400);

  --color-action-active: var(--yellow-tone2-500);
  --color-action-hover: var(--yellow-tone2-400);
  --color-action-focus: var(--yellow-tone2-300);
  --color-action-selected: var(--yellow-tone1-300);
  --color-action-disabled: var(--gray-tone2-500);
  --color-action-disabled-background: var(--gray-tone2-700);

  /* --------------------------------------------------------------------- */

  --color-outline: var(--gray-tone2-300);
  --color-scrollbar-thumb: var(--gray-tone2-700);
  --color-scrollbar-thumb-hover: var(--gray-tone2-800);
  --color-scrollbar-track: var(--gray-tone2-100);
  --color-scrollbar-fake-track-opacity: 0.05;

  --color-date-detail: var(--gray-tone2-300);
  --header-image: url("../images/header/header-summer-dark.webp");
  --header-image-mobile: url("../images/header/header-summer-dark.webp");
  --header-image-filter: var(--filter-brightness-2) saturate(70%) contrast(90%);

  --color-box-border: var(--gray-tone2-900);
  --color-footer: var(--color-gray-level-200);
  --color-footer-text: var(--color-gray-level-800);

  --color-radcom-logo-1: var(--color-gray-level-500);
  --color-radcom-logo-2: var(--color-gray-level-800);

  /* General Tokens - Color - Dropdown */

  --color-dropdown-paper-level-1: var(--gray-tone2-700);
  --color-dropdown-paper-level-2: var(--gray-tone2-700);
  --color-dropdown-paper-level-3: var(--gray-tone2-600);
  --color-dropdown-border: var(--gray-tone2-900);
  --color-dropdown-selected: var(--gray-tone2-500);
  --color-dropdown-hover: var(--gray-tone2-600);
  --color-dropdown-level-3: var(--gray-tone2-300);
  --color-dropdown-level-4: var(--gray-tone2-500);


  --color-logo: var(--yellow-tone3-600);
  --color-switch-background: var(--yellow-tone3-600);
  --color-switch-button: var(--gray-tone2-800);

  /* General Tokens - Shadow */

  --shadow-card: var(--shadow-tone2-100);
  --shadow-header: var(--shadow-tone2-200);
  --shadow-alert: var(--shadow-tone2-300);
  --shadow-dropdown: var(--shadow-tone2-400);
  --shadow-top-fixed-action: var(--shadow-tone2-500);
  --shadow-bottom-fixed-action: var(--shadow-tone2-600);
  --shadow-drawer: var(--shadow-tone2-700);
  --shadow-dialog: var(--shadow-tone2-800);
  --shadow: var(--shadow-tone2);
  --shadow-light: var(--shadow-tone2-light);
  --shadow-top-light: var(--shadow-tone2-top-light);
  --shadow-bottom-light: var(--shadow-tone2-bottom-light);
  --shadow-inset: var(--shadow-inset-tone2);


  /* --------------------------------------------------------------------- */

}

@media screen and (min-width:1600px) {
  :root {
    --container-padding: var(--spacing-xx-large);
  }
}

@media screen and (min-width:1920px) {
  :root {
    --max-width: 1400px;
  }
}

@media screen and (max-width:1599px) {
  :root {
    --container-padding: var(--spacing-xx-large);
  }
}

@media screen and (max-width:899px) {
  :root {
    --container-padding: var(--spacing-x-large);
  }
}

@media screen and (max-width:599px) {
  :root {
    --container-padding: var(--spacing-large);
  }
}
