/**
 * @synergy-design-system/tokens version 2.20.0
 * SICK Global UX Foundation
 */
$SynFontSizeXSmall: var(--syn-font-size-x-small) !default;
$SynFontSizeSmall: var(--syn-font-size-small) !default;
$SynFontSizeMedium: var(--syn-font-size-medium) !default;
$SynFontSizeLarge: var(--syn-font-size-large) !default;
$SynFontSizeXLarge: var(--syn-font-size-x-large) !default;
$SynFontSize2xLarge: var(--syn-font-size-2x-large) !default;
$SynFontSize3xLarge: var(--syn-font-size-3x-large) !default;
$SynDurationExtraFast: var(--syn-duration-extra-fast) !default;
$SynDurationFast: var(--syn-duration-fast) !default;
$SynDurationNormal: var(--syn-duration-normal) !default;
$SynDurationSlow: var(--syn-duration-slow) !default;
$SynDurationExtraSlow: var(--syn-duration-extra-slow) !default;
$SynLineHeightDenser: var(--syn-line-height-denser) !default;
$SynLineHeightDense: var(--syn-line-height-dense) !default;
$SynLineHeightNormal: var(--syn-line-height-normal) !default;
$SynLineHeightLoose: var(--syn-line-height-loose) !default;
$SynLineHeightLooser: var(--syn-line-height-looser) !default;
$SynFontWeightNormal: var(--syn-font-weight-normal) !default;
$SynFontWeightSemibold: var(--syn-font-weight-semibold) !default;
$SynFontWeightBold: var(--syn-font-weight-bold) !default;
$SynShadowMedium: var(--syn-shadow-medium) !default;
$SynShadowLarge: var(--syn-shadow-large) !default;
$SynShadowXLarge: var(--syn-shadow-x-large) !default;
$SynShadowOverflowDown: var(--syn-shadow-overflow-down) !default;
$SynShadowOverflowUp: var(--syn-shadow-overflow-up) !default;
$SynShadowOverflowLeft: var(--syn-shadow-overflow-left) !default;
$SynShadowOverflowRight: var(--syn-shadow-overflow-right) !default;
$SynFontSans: var(--syn-font-sans) !default;
$SynFontMono: var(--syn-font-mono) !default;
$SynSpacing4xSmall: var(--syn-spacing-4x-small) !default;
$SynSpacing3xSmall: var(--syn-spacing-3x-small) !default;
$SynSpacing2xSmall: var(--syn-spacing-2x-small) !default;
$SynSpacingXSmall: var(--syn-spacing-x-small) !default;
$SynSpacingSmall: var(--syn-spacing-small) !default;
$SynSpacingMedium: var(--syn-spacing-medium) !default;
$SynSpacingMediumLarge: var(--syn-spacing-medium-large) !default;
$SynSpacingLarge: var(--syn-spacing-large) !default;
$SynSpacingXLarge: var(--syn-spacing-x-large) !default;
$SynSpacing2xLarge: var(--syn-spacing-2x-large) !default;
$SynSpacing3xLarge: var(--syn-spacing-3x-large) !default;
$SynSpacing4xLarge: var(--syn-spacing-4x-large) !default;
$SynSpacing5xLarge: var(--syn-spacing-5x-large) !default;
$SynBorderRadiusNone: var(--syn-border-radius-none) !default;
$SynBorderRadiusPill: var(--syn-border-radius-pill) !default;
$SynBorderRadiusCircle: var(--syn-border-radius-circle) !default;
$SynBorderRadiusSmall: var(--syn-border-radius-small) !default;
$SynBorderRadiusMedium: var(--syn-border-radius-medium) !default;
$SynDimensionBase: var(--syn-dimension-base) !default;
$SynBorderWidthNone: var(--syn-border-width-none) !default;
$SynBorderWidthSmall: var(--syn-border-width-small) !default;
$SynBorderWidthMedium: var(--syn-border-width-medium) !default;
$SynBorderWidthLarge: var(--syn-border-width-large) !default;
$SynBorderWidthXLarge: var(--syn-border-width-x-large) !default;
$SynFontSansFallback: var(--syn-font-sans-fallback) !default;
$SynOpacity50: var(--syn-opacity-50) !default;
$SynTextDecorationDefault: var(--syn-text-decoration-default) !default;
$SynTextDecorationUnderline: var(--syn-text-decoration-underline) !default;
$SynButtonFontSizeSmall: var(--syn-button-font-size-small) !default;
$SynButtonFontSizeMedium: var(--syn-button-font-size-medium) !default;
$SynButtonFontSizeLarge: var(--syn-button-font-size-large) !default;
$SynFocusRingColor: var(--syn-focus-ring-color) !default;
$SynFocusRingWidth: var(--syn-focus-ring-width) !default;
$SynFocusRingOffset: var(--syn-focus-ring-offset) !default;
$SynInputColor: var(--syn-input-color) !default;
$SynInputColorHover: var(--syn-input-color-hover) !default;
$SynInputColorFocus: var(--syn-input-color-focus) !default;
$SynInputColorDisabled: var(--syn-input-color-disabled) !default;
$SynInputBackgroundColor: var(--syn-input-background-color) !default;
$SynInputBackgroundColorHover: var(--syn-input-background-color-hover) !default;
$SynInputBackgroundColorFocus: var(--syn-input-background-color-focus) !default;
$SynInputBackgroundColorDisabled: var(--syn-input-background-color-disabled) !default;
$SynInputBorderColor: var(--syn-input-border-color) !default;
$SynInputBorderColorHover: var(--syn-input-border-color-hover) !default;
$SynInputBorderColorFocus: var(--syn-input-border-color-focus) !default;
$SynInputBorderColorDisables: var(--syn-input-border-color-disables) !default;
$SynInputBorderRadiusSmall: var(--syn-input-border-radius-small) !default;
$SynInputBorderRadiusMedium: var(--syn-input-border-radius-medium) !default;
$SynInputBorderRadiusLarge: var(--syn-input-border-radius-large) !default;
$SynInputBorderColorFocusError: var(--syn-input-border-color-focus-error) !default;
$SynInputWidth: var(--syn-input-width) !default;
$SynInputIconColor: var(--syn-input-icon-color) !default;
$SynInputIconColorHover: var(--syn-input-icon-color-hover) !default;
$SynInputIconColorFocus: var(--syn-input-icon-color-focus) !default;
$SynInputIconIconClearableColor: var(--syn-input-icon-icon-clearable-color) !default;
$SynInputIconIconClearableColorHover: var(--syn-input-icon-icon-clearable-color-hover) !default;
$SynInputIconIconClearableColorFocus: var(--syn-input-icon-icon-clearable-color-focus) !default;
$SynInputPlaceholderColor: var(--syn-input-placeholder-color) !default;
$SynInputPlaceholderColorDisabled: var(--syn-input-placeholder-color-disabled) !default;
$SynInputRequiredContent: var(--syn-input-required-content) !default;
$SynInputRequiredContentColor: var(--syn-input-required-content-color) !default;
$SynInputRequiredContentOffset: var(--syn-input-required-content-offset) !default;
$SynInputLabelColor: var(--syn-input-label-color) !default;
$SynInputLabelFontSizeSmall: var(--syn-input-label-font-size-small) !default;
$SynInputLabelFontSizeMedium: var(--syn-input-label-font-size-medium) !default;
$SynInputLabelFontSizeLarge: var(--syn-input-label-font-size-large) !default;
$SynInputSpacingSmall: var(--syn-input-spacing-small) !default;
$SynInputSpacingMedium: var(--syn-input-spacing-medium) !default;
$SynInputSpacingLarge: var(--syn-input-spacing-large) !default;
$SynInputFocusRingColor: var(--syn-input-focus-ring-color) !default;
$SynInputFocusRingOffset: var(--syn-input-focus-ring-offset) !default;
$SynInputFocusRingError: var(--syn-input-focus-ring-error) !default;
$SynInputDisabledOpacity: var(--syn-input-disabled-opacity) !default;
$SynInputReadonlyBackgroundColor: var(--syn-input-readonly-background-color) !default;
$SynInputReadonlyBackgroundColorHover: var(--syn-input-readonly-background-color-hover) !default;
$SynInputReadonlyBackgroundColorFocus: var(--syn-input-readonly-background-color-focus) !default;
$SynInputReadonlyBackgroundColorDisabled: var(--syn-input-readonly-background-color-disabled) !default;
$SynInputHelpTextColor: var(--syn-input-help-text-color) !default;
$SynInputHelpTextColorError: var(--syn-input-help-text-color-error) !default;
$SynInputHelpTextFontSizeSmall: var(--syn-input-help-text-font-size-small) !default;
$SynInputHelpTextFontSizeMedium: var(--syn-input-help-text-font-size-medium) !default;
$SynInputHelpTextFontSizeLarge: var(--syn-input-help-text-font-size-large) !default;
$SynInputHeightSmall: var(--syn-input-height-small) !default;
$SynInputHeightMedium: var(--syn-input-height-medium) !default;
$SynInputHeightLarge: var(--syn-input-height-large) !default;
$SynInputReadonlyColor: var(--syn-input-readonly-color) !default;
$SynInputReadonlyColorDisabled: var(--syn-input-readonly-color-disabled) !default;
$SynInputReadonlyColorHover: var(--syn-input-readonly-color-hover) !default;
$SynInputReadonlyColorFocus: var(--syn-input-readonly-color-focus) !default;
$SynInputFontSizeSmall: var(--syn-input-font-size-small) !default;
$SynInputFontSizeMedium: var(--syn-input-font-size-medium) !default;
$SynInputFontSizeLarge: var(--syn-input-font-size-large) !default;
$SynLinkColor: var(--syn-link-color) !default;
$SynLinkColorHover: var(--syn-link-color-hover) !default;
$SynLinkColorActive: var(--syn-link-color-active) !default;
$SynLinkQuietColor: var(--syn-link-quiet-color) !default;
$SynLinkQuietColorHover: var(--syn-link-quiet-color-hover) !default;
$SynLinkQuietColorActive: var(--syn-link-quiet-color-active) !default;
$SynOverlayBackgroundColor: var(--syn-overlay-background-color) !default;
$SynPanelBackgroundColor: var(--syn-panel-background-color) !default;
$SynPanelBorderColor: var(--syn-panel-border-color) !default;
$SynPanelBorderWidth: var(--syn-panel-border-width) !default;
$SynToggleSizeSmall: var(--syn-toggle-size-small) !default;
$SynToggleSizeMedium: var(--syn-toggle-size-medium) !default;
$SynToggleSizeLarge: var(--syn-toggle-size-large) !default;
$SynTooltipBorderRadius: var(--syn-tooltip-border-radius) !default;
$SynTooltipBackgroundColor: var(--syn-tooltip-background-color) !default;
$SynTooltipColor: var(--syn-tooltip-color) !default;
$SynTooltipFontFamily: var(--syn-tooltip-font-family) !default;
$SynTooltipFontWeight: var(--syn-tooltip-font-weight) !default;
$SynTooltipFontSize: var(--syn-tooltip-font-size) !default;
$SynTooltipLineHeight: var(--syn-tooltip-line-height) !default;
$SynTooltipPadding: var(--syn-tooltip-padding) !default;
$SynTooltipArrowSize: var(--syn-tooltip-arrow-size) !default;
$SynBodyXSmallRegular: var(--syn-body-x-small-regular) !default;
$SynBodyXSmallSemibold: var(--syn-body-x-small-semibold) !default;
$SynBodyXSmallBold: var(--syn-body-x-small-bold) !default;
$SynBodySmallRegular: var(--syn-body-small-regular) !default;
$SynBodySmallSemibold: var(--syn-body-small-semibold) !default;
$SynBodySmallBold: var(--syn-body-small-bold) !default;
$SynBodyMediumRegular: var(--syn-body-medium-regular) !default;
$SynBodyMediumSemibold: var(--syn-body-medium-semibold) !default;
$SynBodyMediumBold: var(--syn-body-medium-bold) !default;
$SynBodyLargeRegular: var(--syn-body-large-regular) !default;
$SynBodyLargeSemibold: var(--syn-body-large-semibold) !default;
$SynBodyLargeBold: var(--syn-body-large-bold) !default;
$SynHeadingLarge: var(--syn-heading-large) !default;
$SynHeadingXLarge: var(--syn-heading-x-large) !default;
$SynHeading2xLarge: var(--syn-heading-2x-large) !default;
$SynHeading3xLarge: var(--syn-heading-3x-large) !default;
$SynTypographyColorText: var(--syn-typography-color-text) !default;
$SynTypographyColorTextInverted: var(--syn-typography-color-text-inverted) !default;
$SynColorPrimary50: var(--syn-color-primary-50) !default;
$SynColorPrimary100: var(--syn-color-primary-100) !default;
$SynColorPrimary200: var(--syn-color-primary-200) !default;
$SynColorPrimary300: var(--syn-color-primary-300) !default;
$SynColorPrimary400: var(--syn-color-primary-400) !default;
$SynColorPrimary500: var(--syn-color-primary-500) !default;
$SynColorPrimary600: var(--syn-color-primary-600) !default;
$SynColorPrimary700: var(--syn-color-primary-700) !default;
$SynColorPrimary800: var(--syn-color-primary-800) !default;
$SynColorPrimary900: var(--syn-color-primary-900) !default;
$SynColorPrimary950: var(--syn-color-primary-950) !default;
$SynColorSuccess50: var(--syn-color-success-50) !default;
$SynColorSuccess100: var(--syn-color-success-100) !default;
$SynColorSuccess200: var(--syn-color-success-200) !default;
$SynColorSuccess300: var(--syn-color-success-300) !default;
$SynColorSuccess400: var(--syn-color-success-400) !default;
$SynColorSuccess500: var(--syn-color-success-500) !default;
$SynColorSuccess600: var(--syn-color-success-600) !default;
$SynColorSuccess700: var(--syn-color-success-700) !default;
$SynColorSuccess800: var(--syn-color-success-800) !default;
$SynColorSuccess900: var(--syn-color-success-900) !default;
$SynColorSuccess950: var(--syn-color-success-950) !default;
$SynColorWarning50: var(--syn-color-warning-50) !default;
$SynColorWarning100: var(--syn-color-warning-100) !default;
$SynColorWarning200: var(--syn-color-warning-200) !default;
$SynColorWarning300: var(--syn-color-warning-300) !default;
$SynColorWarning400: var(--syn-color-warning-400) !default;
$SynColorWarning500: var(--syn-color-warning-500) !default;
$SynColorWarning600: var(--syn-color-warning-600) !default;
$SynColorWarning700: var(--syn-color-warning-700) !default;
$SynColorWarning800: var(--syn-color-warning-800) !default;
$SynColorWarning900: var(--syn-color-warning-900) !default;
$SynColorWarning950: var(--syn-color-warning-950) !default;
$SynColorError50: var(--syn-color-error-50) !default;
$SynColorError100: var(--syn-color-error-100) !default;
$SynColorError200: var(--syn-color-error-200) !default;
$SynColorError300: var(--syn-color-error-300) !default;
$SynColorError400: var(--syn-color-error-400) !default;
$SynColorError500: var(--syn-color-error-500) !default;
$SynColorError600: var(--syn-color-error-600) !default;
$SynColorError700: var(--syn-color-error-700) !default;
$SynColorError800: var(--syn-color-error-800) !default;
$SynColorError900: var(--syn-color-error-900) !default;
$SynColorError950: var(--syn-color-error-950) !default;
$SynColorAccent50: var(--syn-color-accent-50) !default;
$SynColorAccent100: var(--syn-color-accent-100) !default;
$SynColorAccent200: var(--syn-color-accent-200) !default;
$SynColorAccent300: var(--syn-color-accent-300) !default;
$SynColorAccent400: var(--syn-color-accent-400) !default;
$SynColorAccent500: var(--syn-color-accent-500) !default;
$SynColorAccent600: var(--syn-color-accent-600) !default;
$SynColorAccent700: var(--syn-color-accent-700) !default;
$SynColorAccent800: var(--syn-color-accent-800) !default;
$SynColorAccent900: var(--syn-color-accent-900) !default;
$SynColorAccent950: var(--syn-color-accent-950) !default;
$SynColorNeutral0: var(--syn-color-neutral-0) !default;
$SynColorNeutral50: var(--syn-color-neutral-50) !default;
$SynColorNeutral100: var(--syn-color-neutral-100) !default;
$SynColorNeutral200: var(--syn-color-neutral-200) !default;
$SynColorNeutral300: var(--syn-color-neutral-300) !default;
$SynColorNeutral400: var(--syn-color-neutral-400) !default;
$SynColorNeutral500: var(--syn-color-neutral-500) !default;
$SynColorNeutral600: var(--syn-color-neutral-600) !default;
$SynColorNeutral700: var(--syn-color-neutral-700) !default;
$SynColorNeutral800: var(--syn-color-neutral-800) !default;
$SynColorNeutral900: var(--syn-color-neutral-900) !default;
$SynColorNeutral950: var(--syn-color-neutral-950) !default;
$SynColorNeutral1000: var(--syn-color-neutral-1000) !default;
$SynBorderRadiusLarge: var(--syn-border-radius-large) !default;
$SynBorderRadiusXLarge: var(--syn-border-radius-x-large) !default;
$SynShadowXSmall: var(--syn-shadow-x-small) !default;
$SynShadowSmall: var(--syn-shadow-small) !default;
$SynTransitionXSlow: var(--syn-transition-x-slow) !default;
$SynTransitionSlow: var(--syn-transition-slow) !default;
$SynTransitionMedium: var(--syn-transition-medium) !default;
$SynTransitionFast: var(--syn-transition-fast) !default;
$SynTransitionXFast: var(--syn-transition-x-fast) !default;
$SynFontSerif: var(--syn-font-serif) !default;
$SynFontSize2xSmall: var(--syn-font-size-2x-small) !default;
$SynFontSize4xLarge: var(--syn-font-size-4x-large) !default;
$SynFontWeightLight: var(--syn-font-weight-light) !default;
$SynLetterSpacingDenser: var(--syn-letter-spacing-denser) !default;
$SynLetterSpacingDense: var(--syn-letter-spacing-dense) !default;
$SynLetterSpacingNormal: var(--syn-letter-spacing-normal) !default;
$SynLetterSpacingLoose: var(--syn-letter-spacing-loose) !default;
$SynLetterSpacingLooser: var(--syn-letter-spacing-looser) !default;
$SynFocusRingStyle: var(--syn-focus-ring-style) !default;
$SynFocusRing: var(--syn-focus-ring) !default;
$SynInputBorderColorDisabled: var(--syn-input-border-color-disabled) !default;
$SynInputBorderWidth: var(--syn-input-border-width) !default;
$SynInputFontFamily: var(--syn-input-font-family) !default;
$SynInputFontWeight: var(--syn-input-font-weight) !default;
$SynInputLetterSpacing: var(--syn-input-letter-spacing) !default;
$SynZIndexDrawer: var(--syn-z-index-drawer) !default;
$SynZIndexDialog: var(--syn-z-index-dialog) !default;
$SynZIndexDropdown: var(--syn-z-index-dropdown) !default;
$SynZIndexToast: var(--syn-z-index-toast) !default;
$SynZIndexTooltip: var(--syn-z-index-tooltip) !default;