.stack-item {
  margin-top: var(--stack-margin-top);
}
body {
  font-size: var(--type-ramp-base-font-size);
  line-height: var(--type-ramp-base-line-height);
}

h1 {
  font-size: var(--type-ramp-plus-3-font-size);
  line-height: var(--type-ramp-plus-3-line-height);
}
h2 {
  font-size: var(--type-ramp-plus-2-font-size);
  line-height: var(--type-ramp-plus-2-line-height);
}
h3 {
  font-size: var(--type-ramp-plus-1-font-size);
  line-height: var(--type-ramp-plus-1-line-height);
}

.large-text {
  font-size: var(--type-ramp-plus-3-font-size);
  line-height: var(--type-ramp-plus-3-line-height);
}

.muted-text {
  font-size: var(--type-ramp-minus-1-font-size);
  line-height: var(--type-ramp-minus-1-line-height);
}

h1, .ecos-stack > :not(h1, h2, h3) + h1,
h2:not(:first-child), .ecos-stack > :not(h1, h2, h3) + h2,
h3:not(:first-child), .ecos-stack > :not(h1, h2, h3) + h3 {
  margin-top: calc(2 * var(--spacing-unit-lg));
}

@media screen and (min-width: 732px) {
  h1 {
    font-size: var(--type-ramp-plus-4-font-size);
    line-height: var(--type-ramp-plus-4-line-height);
  }
  h2 {
    font-size: var(--type-ramp-plus-3-font-size);
    line-height: var(--type-ramp-plus-3-line-height);
  }
  h3 {
    font-size: var(--type-ramp-plus-2-font-size);
    line-height: var(--type-ramp-plus-2-line-height);
  }
}

a {
  color: inherit;
  text-decoration: underline;
}

a:hover {
  color: var(--accent-foreground-hover);
}

a:active {
  color: var(--accent-foreground-active);
}
* {
  box-sizing: border-box;
  --elevation0: 0 0 3px rgba(0,0,0,0.3), 0 1px 1px rgba(0,0,0,0.12);
  --elevation1: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
  --elevation2: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
  --elevation3: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
  --elevation4: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
  --elevation5: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);

  /* --base-spacing-unit: 8; /* will be overwritten by ecos-design-system-provider */
  --spacing-unit: calc(var(--base-spacing-unit) * 1px);
  --responsive-spacing-unit: calc(var(--base-spacing-unit) * 0.5px);
  --spacing-unit-sm: calc(var(--spacing-unit) * 0.5);
  --responsive-spacing-unit-sm: calc(var(--responsive-spacing-unit) * 0.5);
  --spacing-unit-lg: calc(var(--spacing-unit) * 2);
  --responsive-spacing-unit-lg: calc(var(--responsive-spacing-unit) * 2);
  --spacing-unit-xl: calc(var(--spacing-unit-lg) * 2);
  --responsive-spacing-unit-xl: calc(var(--responsive-spacing-unit-lg) * 2);
  --spacing-unit-xxl: calc(var(--spacing-unit-xl) * 2);
  --responsive-spacing-unit-xxl: calc(var(--responsive-spacing-unit-xl) * 2);

  --badge-fill-primary: var(--accent-fill-rest);
  --badge-fill-secondary: var(--neutral-fill-rest);
  --badge-fill-transparent: transparent;
  --badge-color-black: #000000;
  --badge-color-white: var(--accent-foreground-cut-rest);
}
.space-small {
  --spacing-unit: var(--spacing-unit-sm);
  --responsive-spacing-unit: var(--responsive-spacing-unit-sm);
}
.space-large {
  --spacing-unit: var(--spacing-unit-lg);
  --responsive-spacing-unit: var(--responsive-spacing-unit-lg);
}
.space-extra-large {
  --spacing-unit: var(--spacing-unit-xl);
  --responsive-spacing-unit: var(--responsive-spacing-unit-xl);
}
@media screen and (min-width: 732px) {
  * {
    --responsive-spacing-unit: calc(var(--base-spacing-unit) * 1px);
  }
}

.elevation,
.elevation1 {
  box-shadow: var(--elevation1);
}
.elevation0 {
  box-shadow: var(--elevation0);
}
.elevation2 {
  box-shadow: var(--elevation2);
}
.elevation3 {
  box-shadow: var(--elevation3);
}
.elevation4 {
  box-shadow: var(--elevation4);
}
.elevation5 {
  box-shadow: var(--elevation5);
}

.radius {
  border-radius: var(--control-corner-radius);
}

.radius-large {
  border-radius: calc(var(--control-corner-radius) * 1.5);
}
.radius-small {
  border-radius: calc(var(--control-corner-radius) * 0.5);
}

.wrapper {
  max-width: 55rem;
  margin-left: auto;
  margin-right: auto;
  padding: var(--spacing-unit-lg);
}
.wrapper-h {
  max-width: 55rem;
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--spacing-unit-lg);
  padding-right: var(--spacing-unit-lg);
}

.text-center {
  text-align: center;
}
.teinted-text {
  color: var(--accent-fill-rest-light-100);
}


/* The shift-[x/y]-[value] utilities allow for pixel perfect adjustements */
.shift-x-1 {
  transform: translateX(1px);
}
.shift-x--1 {
  transform: translateX(-1px);
}
.shift-x-2 {
  transform: translateX(2px);
}
.shift-x--2 {
  transform: translateX(-2px);
}
.shift-x-3 {
  transform: translateX(3px);
}
.shift-x--3 {
  transform: translateX(-3px);
}
.shift-x-1 {
  transform: translateY(1px);
}
.shift-y--1 {
  transform: translateY(-1px);
}
.shift-y-2 {
  transform: translateY(2px);
}
.shift-y--2 {
  transform: translateY(-2px);
}
.shift-y-3 {
  transform: translateY(3px);
}
.shift-y--3 {
  transform: translateY(-3px);
}
ecos-card-row > [ecos-card-row--right] {
  grid-column: 2;
}
ecos-navbar > .logo {
  margin-right: 16px;
}
ecos-navbar > * + * {
  margin-left: calc((20 + (var(--design-unit) + (var(--design-unit) * max(0, var(--density))))) * 1px);
}

ecos-navbar > .right {
  margin-left: auto;
}
ecos-navbar > ecos-anchor {
  --stroke-width: 0;
  color: currentColor;
}
ecos-navbar > ecos-anchor:hover {
  --stroke-width: 0;
  color: var(--accent-foreground-hover);
}

/* TODO: color here should be set from design system */
ecos-card[separators] > * + ecos-content,
ecos-card[separators] > * + ecos-card-row,
ecos-card > * + ecos-content[separator],
ecos-card > * + ecos-card-row[separator],
ecos-card-dialog[separators][has-header]::part(content),
ecos-card-dialog[separators]::part(footer) {
  border-top: solid #ccc 1px;
}

ecos-card > ecos-menu,
ecos-card > ecos-stack > ecos-menu {
  max-width: none;
}
ecos-dialog.auto-height {
  --dialog-height: min-content;
}


/*# sourceMappingURL=../vendors~b63701b0.84a0aeac61ef720cadbd.bundle.map*/