/* Register layers in the correct order */
/* 
* Browsers define layer order based on when they encounter @layer declarations.
* This file should be imported by all component styles, and other CSS entry points,
* to ensure that layers are registered in the correct order.
*/
@layer base, tokens, utilities, components, overrides;
/* Add component styles to component layer while preserving Stencil Scoped CSS */
@layer components {
  :host .icon {
    font-family: var(--semantic-font-family-body);
    font-style: normal;
    display: contents;
  }
  :host .icon::before {
    font-family: "Allianz Icons";
    font-size: var(--semantic-size-content-m);
  }
  :host .icon.primary {
    color: var(--semantic-color-on-surface-primary-resting);
  }
  :host .icon.secondary {
    color: var(--semantic-color-on-surface-secondary-resting);
  }
  :host .icon.critical {
    color: var(--semantic-color-signal-attention-critical-resting);
  }
  :host .icon.info {
    color: var(--semantic-color-signal-attention-info-resting);
  }
  :host .icon.positive {
    color: var(--semantic-color-signal-attention-positive-resting);
  }
  :host .icon.warning {
    color: var(--semantic-color-signal-attention-warning-resting);
  }
  :host .icon.inverse.primary {
    color: var(--semantic-color-on-surface-primary-inverse-resting);
  }
  :host .icon.inverse.secondary {
    color: var(--semantic-color-on-surface-secondary-inverse-resting);
  }
  :host .icon.inverse.critical {
    color: var(--semantic-color-signal-attention-inverse-critical-resting);
  }
  :host .icon.inverse.info {
    color: var(--semantic-color-signal-attention-inverse-info-resting);
  }
  :host .icon.inverse.positive {
    color: var(--semantic-color-signal-attention-inverse-positive-resting);
  }
  :host .icon.inverse.warning {
    color: var(--semantic-color-signal-attention-inverse-warning-resting);
  }
  :host .icon.disabled {
    cursor: not-allowed;
  }
  :host .icon.disabled.primary, :host .icon.disabled.secondary {
    color: var(--semantic-color-on-surface-primary-disabled);
  }
  :host .icon.disabled.critical, :host .icon.disabled.info, :host .icon.disabled.positive, :host .icon.disabled.warning {
    color: var(--semantic-color-signal-attention-disabled);
  }
  :host .icon.disabled.inverse.primary, :host .icon.disabled.inverse.secondary {
    color: var(--semantic-color-on-surface-primary-inverse-disabled);
  }
  :host .icon.disabled.inverse.critical, :host .icon.disabled.inverse.info, :host .icon.disabled.inverse.positive, :host .icon.disabled.inverse.warning {
    color: var(--semantic-color-signal-attention-inverse-disabled);
  }
  :host .icon.functional.s::before, :host .icon.critical.s::before, :host .icon.info.s::before, :host .icon.positive.s::before, :host .icon.warning.s::before {
    font-size: var(--semantic-size-content-s);
  }
  :host .icon.functional.m::before, :host .icon.critical.m::before, :host .icon.info.m::before, :host .icon.positive.m::before, :host .icon.warning.m::before {
    font-size: var(--semantic-size-content-m);
  }
  :host .icon.file {
    display: block;
    position: relative;
  }
  :host .icon.file.inverse > .file-icon-box {
    background-color: var(--semantic-color-signal-attention-inverse-info-resting);
  }
  :host .icon.file.s {
    width: var(--semantic-size-content-s);
    height: var(--semantic-size-content-s);
  }
  :host .icon.file.s::before {
    font-size: var(--semantic-size-content-s);
  }
  :host .icon.file.s > .file-icon-box {
    background-color: #96dcfa; /* no semantic color found in the token set */
    color: #5a3982; /* no semantic color found in the token set */
    display: block;
    text-transform: uppercase;
    font-size: 5px; /* no definition present in the token set */
    padding: 1px 2px 2px 4px; /* no definition present in the token set */
    position: absolute;
    top: 8px; /* no definition present in the token set */
    left: 1px;
    border-radius: 2px 0 0 2px; /* no definition present in the token set */
  }
  :host .icon.file.m {
    width: var(--semantic-size-content-m);
    height: var(--semantic-size-content-m);
  }
  :host .icon.file.m::before {
    font-size: var(--semantic-size-content-m);
  }
  :host .icon.file.m > .file-icon-box {
    background-color: #96dcfa; /* no semantic color found in the token set */
    color: #5a3982; /* no semantic color found in the token set */
    display: block;
    text-transform: uppercase;
    font-size: 7px; /* no definition present in the token set */
    padding: 1px 2px 2px 4px;
    position: absolute;
    top: 9px; /* no definition present in the token set */
    left: 1px;
    border-radius: 2px 0 0 2px; /* no definition present in the token set */
  }
  :host .icon.illustrative {
    color: var(--semantic-color-on-surface-primary-resting);
  }
  :host .icon.illustrative.contained {
    border-radius: var(--semantic-border-radius-round);
    display: table-cell;
    vertical-align: middle;
    text-align: center;
  }
  :host .icon.illustrative.contained--default {
    background-color: var(--semantic-color-surface-default-resting);
  }
  :host .icon.illustrative.contained--default.inverse {
    background-color: var(--semantic-color-surface-default-inverse-resting);
  }
  :host .icon.illustrative.contained--default.disabled {
    background-color: var(--semantic-color-surface-default-disabled);
  }
  :host .icon.illustrative.contained--default.disabled.inverse {
    background-color: var(--semantic-color-surface-default-inverse-disabled);
  }
  :host .icon.illustrative.contained--emphasis {
    background-color: var(--semantic-color-surface-emphasis-resting);
  }
  :host .icon.illustrative.contained--emphasis.inverse {
    background-color: var(--semantic-color-surface-emphasis-inverse-resting);
  }
  :host .icon.illustrative.contained--emphasis.disabled {
    background-color: var(--semantic-color-surface-emphasis-disabled);
  }
  :host .icon.illustrative.contained--emphasis.disabled.inverse {
    background-color: var(--semantic-color-surface-emphasis-inverse-disabled);
  }
  :host .icon.illustrative.contained.l {
    width: var(--semantic-size-component-l);
    height: var(--semantic-size-component-l);
  }
  :host .icon.illustrative.contained.l::before {
    font-size: var(--icon-illustrative-contained-l-size);
    vertical-align: middle;
  }
  :host .icon.illustrative.contained.xl {
    width: var(--semantic-size-component-xl);
    height: var(--semantic-size-component-xl);
  }
  :host .icon.illustrative.contained.xl::before {
    font-size: var(--icon-illustrative-contained-xl-size);
    vertical-align: middle;
  }
  :host .icon.illustrative.inverse {
    color: var(--semantic-color-on-surface-primary-inverse-resting);
  }
  :host .icon.illustrative.disabled {
    color: var(--semantic-color-on-surface-primary-disabled);
  }
  :host .icon.l::before {
    font-size: var(--semantic-size-content-l);
  }
  :host .icon.xl::before {
    font-size: var(--semantic-size-content-xl);
  }
}