/**
 * Globale FontAwesome-/Icon-Farben.
 *
 * Diese Datei ist die zentrale Quelle für Duotone-Ebenen, SVG-Icons und
 * semantische Sonderfälle wie Wetterwarnungen. Sie wird nach dem Color-Scheme
 * geladen, damit harte Hero-Regeln mit -webkit-text-fill-color nicht beide
 * Duotone-Ebenen gleich einfärben.
 */

:root {
  --st-fa-primary: #111;
  --st-fa-secondary: rgb(0 0 0 / 34%);
  --st-fa-muted-primary: rgb(0 0 0 / 65%);
  --st-fa-muted-secondary: rgb(0 0 0 / 28%);
  --st-fa-success: #00ff00;
  --st-fa-alert-level-1: #e6c200;
  --st-fa-alert-level-2: #e67e22;
  --st-fa-alert-level-3: #e74c3c;
  --st-fa-alert-level-4: #9b59b6;
  --st-fa-warning-bg: #e53935;
  --st-fa-warning-mark: #111;
}

html[data-color-scheme='dark'],
body.darkmode--activated {
  --st-fa-primary: #fff;
  --st-fa-secondary: rgb(255 255 255 / 34%);
  --st-fa-muted-primary: rgb(255 255 255 / 72%);
  --st-fa-muted-secondary: rgb(255 255 255 / 30%);
}

:where(.fa-duotone, .fa-sharp-duotone, .fasds, .st-fa-duotone) {
  --fa-primary-color: var(--st-fa-primary);
  --fa-secondary-color: var(--st-fa-secondary);
  --fa-secondary-opacity: 1;
}

:where(.fa-duotone, .fa-sharp-duotone, .fasds, .st-fa-duotone)::before {
  color: var(--fa-primary-color) !important;
  -webkit-text-fill-color: var(--fa-primary-color) !important;
}

:where(.fa-duotone, .fa-sharp-duotone, .fasds, .st-fa-duotone)::after {
  color: var(--fa-secondary-color) !important;
  -webkit-text-fill-color: var(--fa-secondary-color) !important;
  opacity: var(--fa-secondary-opacity, 1);
}

:where(.fa-sharp-duotone, .fasds)::after {
  font-feature-settings: 'ss01';
}

:where(
  .st-bookmark-icon,
  .st-bookmark-icon--interactive,
  .st-startseite-side-card__meta,
  .st-landing-widget__menu,
  .category-regional-infos__icon,
  .st-saved-editor-icon
) :is(.fa-duotone, .fa-sharp-duotone, .fasds) {
  --fa-primary-color: currentColor;
  --fa-secondary-color: color-mix(in srgb, currentColor 38%, transparent);
  --fa-secondary-opacity: 1;
}

.st-landing-widget__menu :is(.fa-duotone, .fa-sharp-duotone, .fasds) {
  --fa-primary-color: var(--st-landing-widget-fg, currentColor);
  --fa-secondary-color: var(--st-landing-widget-label, color-mix(in srgb, currentColor 38%, transparent));
  --fa-secondary-opacity: 1;
}

.page-wrapper.st-page--landing {
  --st-landing-surface-icon-primary: #111827;
  --st-landing-surface-icon-secondary: #64748b;
}

html[data-color-scheme='dark'] .page-wrapper.st-page--landing,
body.darkmode--activated .page-wrapper.st-page--landing {
  --st-landing-surface-icon-primary: #f1f5f9;
  --st-landing-surface-icon-secondary: #64748b;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-color-scheme='light']) .page-wrapper.st-page--landing {
    --st-landing-surface-icon-primary: #f1f5f9;
    --st-landing-surface-icon-secondary: #64748b;
  }
}

#st_body .page-wrapper.st-page--landing .st-landing-widget--weather :is(
  .fa-duotone,
  .fa-sharp-duotone,
  .fasds
) {
  --fa-primary-color: var(--st-landing-surface-icon-primary);
  --fa-secondary-color: var(--st-landing-surface-icon-secondary);
  --fa-secondary-opacity: 1;
}

.st-bookmark-icon--interactive.is-bookmarked :is(.fa-duotone, .fa-sharp-duotone, .fasds) {
  --fa-primary-color: currentColor;
  --fa-secondary-color: var(--st-fa-success);
  --fa-secondary-opacity: 1;
}

.wdsb-weather-panel,
.wdsb-weather-panel__geolocate-target {
  --st-fa-primary: var(--wdsb-weather-panel-text, #111);
  --st-fa-secondary: color-mix(in srgb, var(--wdsb-weather-panel-text, #111) 34%, transparent);
  --st-fa-muted-primary: var(--wdsb-weather-panel-muted, rgb(0 0 0 / 65%));
  --st-fa-muted-secondary: color-mix(in srgb, var(--wdsb-weather-panel-muted, rgb(0 0 0 / 65%)) 42%, transparent);
}

.category-regional-infos {
  --st-fa-primary: var(--category-regional-infos-text, #111);
  --st-fa-secondary: color-mix(in srgb, var(--category-regional-infos-text, #111) 34%, transparent);
  --st-fa-muted-primary: var(--category-regional-infos-muted, rgb(0 0 0 / 65%));
  --st-fa-muted-secondary: color-mix(in srgb, var(--category-regional-infos-muted, rgb(0 0 0 / 65%)) 42%, transparent);
}

:where(.st-saved-editor-icon.is-saved, .st-saved-editor-icon--interactive.is-saved) :is(
  .fa-duotone,
  .fa-sharp-duotone,
  .fasds
) {
  --fa-primary-color: var(--st-fa-success);
  --fa-secondary-color: var(--st-fa-success);
  --fa-secondary-opacity: 1;
}

:where(
  .st-fa-duotone--muted,
  .wdsb-weather-panel__metric-icon,
  .wdsb-weather-panel__forecast-day-temp-icon
) {
  --fa-primary-color: var(--st-fa-muted-primary);
  --fa-secondary-color: var(--st-fa-muted-secondary);
}

:where(
  .wdsb-weather-panel__icon-fa,
  .wdsb-weather-panel__forecast-day-icon
) {
  --fa-primary-color: var(--st-fa-primary);
  --fa-secondary-color: var(--st-fa-secondary);
  --fa-secondary-opacity: 1;
}

:where(
  .wdsb-weather-panel__metric-icon,
  .wdsb-weather-panel__forecast-day-temp-icon,
  .wdsb-weather-panel__icon-fa,
  .wdsb-weather-panel__forecast-day-icon
)::before {
  color: var(--fa-primary-color) !important;
  -webkit-text-fill-color: var(--fa-primary-color) !important;
}

:where(
  .wdsb-weather-panel__metric-icon,
  .wdsb-weather-panel__forecast-day-temp-icon,
  .wdsb-weather-panel__icon-fa,
  .wdsb-weather-panel__forecast-day-icon
)::after {
  color: var(--fa-secondary-color) !important;
  -webkit-text-fill-color: var(--fa-secondary-color) !important;
  opacity: var(--fa-secondary-opacity, 1);
}

:where(svg.svg-inline--fa, svg[data-icon]) :is(.fa-primary, [data-fa-pseudo-element='primary']) {
  fill: var(--fa-primary-color, currentColor);
}

:where(svg.svg-inline--fa, svg[data-icon]) :is(.fa-secondary, [data-fa-pseudo-element='secondary']) {
  fill: var(--fa-secondary-color, color-mix(in srgb, currentColor 38%, transparent));
  opacity: var(--fa-secondary-opacity, 1);
}

:where(.st-fa-svg-current, .st-fa-svg-current *) {
  fill: currentColor;
  stroke: currentColor;
}

:where(.st-weather-day-alert--level-1, .st-alert-level-1) :is(
  .wdsb-weather-day-alert__icon,
  .wdsb-weather-alert__icon
),
:where(.st-weather-day-alert--level-1, .st-alert-level-1).wdsb-weather-day-alert__btn,
:where(.st-weather-day-alert--level-1, .st-alert-level-1).wdsb-weather-alert__btn {
  color: var(--st-fa-alert-level-1);
  -webkit-text-fill-color: var(--st-fa-alert-level-1);
}

:where(.st-weather-day-alert--level-2, .st-alert-level-2) :is(
  .wdsb-weather-day-alert__icon,
  .wdsb-weather-alert__icon
),
:where(.st-weather-day-alert--level-2, .st-alert-level-2).wdsb-weather-day-alert__btn,
:where(.st-weather-day-alert--level-2, .st-alert-level-2).wdsb-weather-alert__btn {
  color: var(--st-fa-alert-level-2);
  -webkit-text-fill-color: var(--st-fa-alert-level-2);
}

:where(.st-weather-day-alert--level-3, .st-alert-level-3) :is(
  .wdsb-weather-day-alert__icon,
  .wdsb-weather-alert__icon
),
:where(.st-weather-day-alert--level-3, .st-alert-level-3).wdsb-weather-day-alert__btn,
:where(.st-weather-day-alert--level-3, .st-alert-level-3).wdsb-weather-alert__btn {
  color: var(--st-fa-alert-level-3);
  -webkit-text-fill-color: var(--st-fa-alert-level-3);
}

:where(.st-weather-day-alert--level-4, .st-alert-level-4) :is(
  .wdsb-weather-day-alert__icon,
  .wdsb-weather-alert__icon
),
:where(.st-weather-day-alert--level-4, .st-alert-level-4).wdsb-weather-day-alert__btn,
:where(.st-weather-day-alert--level-4, .st-alert-level-4).wdsb-weather-alert__btn {
  color: var(--st-fa-alert-level-4);
  -webkit-text-fill-color: var(--st-fa-alert-level-4);
}

.st-weather-day-alert--advance .wdsb-weather-day-alert__icon,
.st-weather-day-alert--advance.wdsb-weather-day-alert__btn {
  color: var(--st-fa-muted-primary);
  -webkit-text-fill-color: var(--st-fa-muted-primary);
}

.st-weather-day-alert--advance .wdsb-weather-day-alert__icon {
  -webkit-text-stroke: 1px currentColor;
  paint-order: stroke fill;
}

.st-fa-warning-sign,
.wdsb-weather-alert__icon--two-tone {
  position: relative;
  display: inline-block;
  width: 1em;
  height: 1em;
  line-height: 1;
  color: var(--st-fa-warning-bg) !important;
  -webkit-text-fill-color: var(--st-fa-warning-bg) !important;
}

.st-fa-warning-sign::before,
.st-fa-warning-sign::after,
.wdsb-weather-alert__icon--two-tone::before,
.wdsb-weather-alert__icon--two-tone::after {
  position: absolute;
  display: block;
  font-style: normal;
  text-align: center;
  font-variant: normal;
  box-shadow: none !important;
  opacity: 1 !important;
}

.st-fa-warning-sign::before,
.wdsb-weather-alert__icon--two-tone::before {
  content: "";
  inset: 0.04em 0.02em 0.02em;
  background: var(--st-fa-warning-bg) !important;
  clip-path: polygon(50% 3%, 98% 92%, 2% 92%);
}

.st-fa-warning-sign::after,
.wdsb-weather-alert__icon--two-tone::after {
  content: "\21";
  inset: 0;
  color: var(--st-fa-warning-mark) !important;
  -webkit-text-fill-color: var(--st-fa-warning-mark) !important;
  font-family: var(--fa-family-classic, 'Font Awesome 7 Pro');
  font-size: 0.58em;
  font-weight: 900;
  line-height: 1.1;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  transform: translateY(0.17em);
}