/* node_modules/@shui/core/styles/fonts.css */
@font-face {
  font-family: "sh-icons";
  font-style: normal;
  font-weight: 500;
  src: url("./media/sh-icons.woff") format("woff");
}
@font-face {
  font-family: "sh-icons-redesigned";
  font-style: normal;
  font-weight: 500;
  src: url("./media/sh-icons-redesigned.woff") format("woff");
}
@font-face {
  font-family: "siemens sans";
  font-style: normal;
  font-weight: 500;
  src: url("./media/sisan03.woff") format("woff"), url("./media/sisan03.woff2") format("woff2");
}
@font-face {
  font-family: "siemens sans";
  font-style: normal;
  font-weight: 900;
  src: url("./media/sisan08.woff") format("woff"), url("./media/sisan08.woff2") format("woff2");
}
@font-face {
  font-family: "bree-headline";
  font-style: normal;
  font-weight: 500;
  src: url("./media/Bree-SH-Headline-Regular.woff") format("woff"), url("./media/Bree-SH-Headline-Regular.woff2") format("woff2");
}

/* node_modules/@shui/core/styles/typography.css */
[class^=display-],
[class^=title-],
[class^=body-],
.caption {
  margin: 0;
  padding: 0;
}
h1[class^=display-],
h2[class^=display-],
h3[class^=display-],
h4[class^=display-],
h5[class^=display-],
h6[class^=display-],
h1[class^=title-],
h2[class^=title-],
h3[class^=title-],
h4[class^=title-],
h5[class^=title-],
h6[class^=title-],
p[class^=body-],
span[class^=body-],
span.caption {
  margin: 0;
  padding: 0;
}
a {
  font-style: inherit;
  font-weight: inherit;
  color: inherit;
  text-decoration: underline;
}
a:focus-visible {
  outline-color: var(--focus-color);
}
a:hover,
a.hover {
  color: var(--text-highlight) !important;
}
.display-500,
.display-400,
.display-300,
.display-200,
.display-100 {
  font-family: var(--font-family-display);
  font-weight: var(--text-font-weight-normal);
  font-style: var(--text-font-style-normal);
  color: var(--color-text-strong);
}
.title-300,
.title-200,
.title-100 {
  font-family: var(--font-family-text);
  font-weight: var(--text-font-weight-bold);
  font-style: var(--text-font-style-normal);
  color: var(--color-text-strong);
}
.body-300,
.body-200,
.body-100 {
  font-family: var(--font-family-text);
  font-weight: var(--text-font-weight-normal);
  font-style: var(--text-font-style-normal);
  color: var(--color-text-moderate);
}
.caption {
  font-family: var(--font-family-text);
  font-weight: var(--text-font-weight-bold);
  font-style: var(--text-font-style-normal);
  color: var(--color-text-strong);
}
.display-500 {
  font-size: var(--text-font-size-display-500);
  line-height: var(--text-line-height-display-500);
}
.display-400 {
  font-size: var(--text-font-size-display-400);
  line-height: var(--text-line-height-display-400);
}
.display-300 {
  font-size: var(--text-font-size-display-300);
  line-height: var(--text-line-height-display-300);
}
.display-200 {
  font-size: var(--text-font-size-display-200);
  line-height: var(--text-line-height-display-200);
}
.display-100 {
  font-size: var(--text-font-size-display-100);
  line-height: var(--text-line-height-display-100);
}
.title-300 {
  font-size: var(--text-font-size-title-300);
  line-height: var(--text-line-height-title-300);
}
.title-200 {
  font-size: var(--text-font-size-title-200);
  line-height: var(--text-line-height-title-200);
}
.title-100 {
  font-size: var(--text-font-size-title-100);
  line-height: var(--text-line-height-title-100);
}
.body-300 {
  font-size: var(--text-font-size-body-300);
  line-height: var(--text-line-height-body-300);
}
.body-200 {
  font-size: var(--text-font-size-body-200);
  line-height: var(--text-line-height-body-200);
}
.body-100 {
  font-size: var(--text-font-size-body-100);
  line-height: var(--text-line-height-body-100);
}
.caption {
  font-size: var(--text-font-size-caption);
  line-height: var(--text-line-height-caption);
}
.color-disabled {
  color: var(--color-text-disabled);
}
.color-subtle {
  color: var(--color-text-subtle);
}
.color-moderate {
  color: var(--color-text-moderate);
}
.color-strong {
  color: var(--color-text-strong);
}
.color-error {
  color: var(--color-text-error);
}
[class^=display-].color-subtle,
[class^=display-].color-moderate {
  color: var(--color-text-strong);
}
[class^=title-].color-subtle {
  color: var(--color-text-moderate);
}
[class^=display-] i,
[class^=display-] em,
[class^=display-] b,
[class^=display-] strong {
  font-style: normal;
  font-weight: inherit;
}
.caption i,
.caption em {
  font-style: normal;
}
[class^=title-] i,
[class^=title-] em,
[class^=body-] i,
[class^=body-] em {
  font-style: italic;
}
.distance-display {
  font-family: var(--font-family-display);
  font-weight: var(--text-font-weight-normal);
  font-size: calc(var(--text-font-size-distance-display) * var(--sh-public-distance-text-scaling));
  line-height: calc(var(--text-line-height-distance-display) * var(--sh-public-distance-text-scaling));
}
.distance-title-200 {
  font-family: var(--font-family-text);
  font-weight: var(--text-font-weight-bold);
  font-size: calc(var(--text-font-size-distance-title-200) * var(--sh-public-distance-text-scaling));
  line-height: calc(var(--text-line-height-distance-title-200) * var(--sh-public-distance-text-scaling));
}
.distance-title-100 {
  font-family: var(--font-family-text);
  font-weight: var(--text-font-weight-bold);
  font-size: calc(var(--text-font-size-distance-title-100) * var(--sh-public-distance-text-scaling));
  line-height: calc(var(--text-line-height-distance-title-100) * var(--sh-public-distance-text-scaling));
}
.distance-body {
  font-family: var(--font-family-text);
  font-weight: var(--text-font-weight-normal);
  font-size: calc(var(--text-font-size-distance-body) * var(--sh-public-distance-text-scaling));
  line-height: calc(var(--text-line-height-distance-body) * var(--sh-public-distance-text-scaling));
}
[class^=parameter-] {
  font-family: var(--font-family-paramteter);
  font-weight: var(--text-font-weight-normal);
  font-style: var(--text-font-style-normal);
  line-height: var(--text-line-height-parameter);
  color: var(--color-text-strong);
}
.parameter-700 {
  font-size: var(--text-font-size-parameter-700);
}
.parameter-600 {
  font-size: var(--text-font-size-parameter-600);
}
.parameter-500 {
  font-size: var(--text-font-size-parameter-500);
}
.parameter-400 {
  font-size: var(--text-font-size-parameter-400);
}
.parameter-300 {
  font-size: var(--text-font-size-parameter-300);
}
.parameter-200 {
  font-size: var(--text-font-size-parameter-200);
}
.parameter-100 {
  font-size: var(--text-font-size-parameter-100);
}
:root {
  --icon-align-gap: 0.5rem;
  --icon-align-gap-narrow: 0.25rem;
}
.icon-align {
  display: flex;
  align-items: flex-start;
  gap: var(--icon-align-gap);
}
.icon-align.icon-align--narrow {
  gap: var(--icon-align-gap-narrow);
}
.icon-align.icon-align--top {
  align-items: flex-start;
}
.icon-align.icon-align--center {
  align-items: center;
}
.icon-align.icon-align--bottom {
  align-items: flex-end;
}
.icon-align > *:not(sh-icon) {
  color: inherit;
  padding: 0;
  margin: 0;
}
.icon-align sh-icon {
  padding: 0;
  margin: 0;
  vertical-align: -0.125em;
}
.icon-align > a {
  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: auto;
  text-decoration-thickness: auto;
  text-underline-offset: 20%;
  text-underline-position: from-font;
}
.icon-align > sh-icon {
  display: inline-flex;
  align-items: center;
  min-height: var(--inherited-line-height, auto);
  max-height: var(--inherited-line-height, auto);
}
.icon-align.body-100 {
  --inherited-line-height: var(--text-line-height-body-100);
}
.icon-align.body-200 {
  --inherited-line-height: var(--text-line-height-body-200);
}
.icon-align.body-300 {
  --inherited-line-height: var(--text-line-height-body-300);
}
.icon-align.title-100 {
  --inherited-line-height: var(--text-line-height-title-100);
}
.icon-align.title-200 {
  --inherited-line-height: var(--text-line-height-title-200);
}
.icon-align.title-300 {
  --inherited-line-height: var(--text-line-height-title-300);
}
.icon-align.display-100 {
  --inherited-line-height: var(--text-line-height-display-100);
}
.icon-align.display-200 {
  --inherited-line-height: var(--text-line-height-display-200);
}
.icon-align.display-300 {
  --inherited-line-height: var(--text-line-height-display-300);
}
.icon-align.display-400 {
  --inherited-line-height: var(--text-line-height-display-400);
}
.icon-align.display-500 {
  --inherited-line-height: var(--text-line-height-display-500);
}
.icon-align.caption {
  --inherited-line-height: var(--text-line-height-caption);
}
.icon-align[class*=display-] > *:not(sh-icon) {
  margin-top: 0.1em;
}
[sh-scale=l] .icon-align:not(.body-100):not(.title-100):not(.caption),
[sh-scale=xl] .icon-align:not(.body-100):not(.title-100):not(.caption) {
  --icon-align-gap: 0.75rem;
  --icon-align-gap-narrow: 0.375rem;
}
.icon-align:has(sh-icon[icon=arrow-right-s]),
.icon-align:has(sh-icon[icon=arrow-left-s]),
.icon-align:has(sh-icon[icon=arrow-down-s]),
.icon-align:has(sh-icon[icon=arrow-up-s]) {
  gap: var(--icon-align-gap-narrow);
}
.icon-align[class*=display-] > sh-icon {
  margin-bottom: 0.15em;
}

/* src/styles.scss */

/* angular:styles/global:styles */
/*# sourceMappingURL=styles.css.map */