:host,
.maui-theme-lhg {
  color-scheme: light;

  /* Theme */
  --maui-theme: maui-lhg;

  /* Typography */
  --maui-font-family-headline: 'LHG Head', Arial, Helvetica, sans-serif;
  --maui-font-family-copy: 'Lufthansa Text', Arial, Helvetica, sans-serif;

  --maui-font-size-1: 12px;
  --maui-font-size-2: 14px;
  --maui-font-size-3: 16px;
  --maui-font-size-4: 18px;
  --maui-font-size-5: 20px;
  --maui-font-size-6: 22px;
  --maui-font-size-7: 24px;
  --maui-font-size-8: 28px;
  --maui-font-size-9: 36px;
  --maui-font-size-10: 48px;
  --maui-font-size-11: 56px;
  --maui-font-size-12: 64px;
  --maui-font-size-13: 88px;

  --maui-line-height-1: 14px;
  --maui-line-height-2: 18px;
  --maui-line-height-3: 24px;
  --maui-line-height-4: 28px;
  --maui-line-height-5: 32px;
  --maui-line-height-6: 36px;
  --maui-line-height-7: 48px;

  --maui-font-weight-light: 300;
  --maui-font-weight-regular: 400;
  --maui-font-weight-bold: 700;

  /* Z-Index */
  /* These are the same as in parts-catalog and should be the same for all tenants */
  --maui-z-index-modal: 1050;
  --maui-z-index-tooltip: 1070;

  /* Spacing */

  --maui-spacing-base: 10px;

  --maui-spacing-1: 2px;
  --maui-spacing-2: 4px;
  --maui-spacing-3: 12px;
  --maui-spacing-4: 24px;
  --maui-spacing-5: 32px;
  --maui-spacing-6: 40px;
  --maui-spacing-7: 48px;
  --maui-spacing-8: 60px;
  --maui-spacing-9: 80px;
  --maui-spacing-10: 100px;

  --maui-form-column-width: 335px;

  /* Layout, Grid, and Section  */

  --maui-grid-gutter-mobile: 16px;
  --maui-grid-gutter-phablet: 24px;
  --maui-grid-gutter-mini-tablet: 24px;
  --maui-grid-gutter-desktop: 24px;
  --maui-grid-gutter-desktop-large: 24px;

  --maui-grid-row-gap-mobile: 24px;
  --maui-grid-row-gap-phablet: 24px;
  --maui-grid-row-gap-mini-tablet: 24px;
  --maui-grid-row-gap-desktop: 24px;
  --maui-grid-row-gap-desktop-large: 24px;

  --maui-layout-margin-mobile: 16px;
  --maui-layout-margin-phablet: 24px;
  --maui-layout-margin-mini-tablet: 48px;
  --maui-layout-margin-desktop: 72px;
  --maui-layout-margin-desktop-large: 84px;

  --maui-section-gap-mobile: 48px;
  --maui-section-gap-phablet: 48px;
  --maui-section-gap-mini-tablet: 48px;
  --maui-section-gap-desktop: 48px;
  --maui-section-gap-desktop-large: 84px;

  --maui-section-padding-mobile: 24px;
  --maui-section-padding-phablet: 24px;
  --maui-section-padding-mini-tablet: 36px;
  --maui-section-padding-desktop: 36px;
  --maui-section-padding-desktop-large: 48px;

  /*
   * Functional colors
   *
   * These should match between the tenants, only reassigning of existing variables.
   */

  /* Focus */
  --maui-color-interaction-focus: #0968f6ff; /* generated from design token script, do not edit */
  --maui-color-interaction-focus-inverted: #ffffffff; /* generated from design token script, do not edit */

  /* Storybook background color for inverted components */
  --maui-color-storybook-inverted-background: #020d34ff; /* generated from design token script, do not edit */
}

/*****************************************************************************
 * Utilities
 *****************************************************************************/

.maui-scroll-lock {
  overflow: hidden !important;
}

/*****************************************************************************
 * Font face definitions
 *****************************************************************************/

@font-face {
  font-family: 'LHG Head';
  src: url('../fonts/lufthansa-group/LHGHead-Thin.otf')
    format('opentype');
  font-style: normal;
  font-weight: 100;
}

@font-face {
  font-family: 'LHG Head';
  src: url('../fonts/lufthansa-group/LHGHead-Light.otf')
    format('opentype');
  font-style: normal;
  font-weight: 300;
}

@font-face {
  font-family: 'LHG Head';
  src: url('../fonts/lufthansa-group/LHGHead-Medium.otf')
    format('opentype');
  font-style: normal;
  font-weight: 500;
}

@font-face {
  font-family: 'LHG Head';
  src: url('../fonts/lufthansa-group/LHGHead-Bold.otf')
    format('opentype');
  font-style: normal;
  font-weight: 700;
}

@font-face {
  font-family: 'LHG Serif';
  src: url('../fonts/lufthansa-group/LHGSerif-Light.otf')
    format('opentype');
  font-style: normal;
  font-weight: 300;
}

@font-face {
  font-family: 'LHG Serif';
  src: url('../fonts/lufthansa-group/LHGSerif-Regular.otf')
    format('opentype');
  font-style: normal;
  font-weight: 400;
}

@font-face {
  font-family: 'IconFontLH';
  src: url('../fonts/lufthansa/Icons-v2.woff') format('woff');
  font-style: normal;
  font-weight: 500;
}

@font-face {
  font-family: 'Lufthansa Text';
  src: url('../fonts/lufthansa/LufthansaTextWeb-Light.woff')
    format('woff');
  font-style: normal;
  font-weight: 300;
}

@font-face {
  font-family: 'Lufthansa Text';
  src: url('../fonts/lufthansa/LufthansaTextWeb-Regular.woff')
    format('woff');
  font-style: normal;
  font-weight: 400;
}

@font-face {
  font-family: 'Lufthansa Text';
  src: url('../fonts/lufthansa/LufthansaTextWeb-Bold.woff')
    format('woff');
  font-style: normal;
  font-weight: 700;
}