:host,
.ld-notice {
  --ld-notice-error-icon-col: var(--ld-thm-error);
  --ld-notice-info-icon-col: var(--ld-thm-primary);
  --ld-notice-warning-icon-col: var(--ld-thm-warning);
  --ld-notice-success-icon-col: var(--ld-thm-success);

  background: var(--ld-col-wht);
  border-radius: var(--ld-br-l);
  box-shadow: var(--ld-shadow-stacked);
  color: var(--ld-col-neutral-800);
  display: block;
  font: var(--ld-typo-body-m);
  padding: var(--ld-sp-24);
  padding-left: calc(var(--ld-sp-24) + var(--ld-sp-40));
  position: relative;

  ::slotted(a),
  a {
    color: var(--ld-thm-primary);
    text-decoration: underline;
  }

  ::slotted(code),
  code {
    background-color: var(--ld-col-neutral-010);
    border-radius: var(--ld-br-s);
    box-shadow: inset 0 0 0 var(--ld-sp-1) var(--ld-col-neutral-100);
    padding: 0 var(--ld-sp-4);
  }
}

:host(.ld-notice--error),
.ld-notice--error {
  ::slotted(ld-icon),
  ::slotted(.ld-icon),
  .ld-notice__icon,
  .ld-notice__headline {
    color: var(--ld-notice-error-icon-col);
  }

  .ld-notice__icon {
    transform: rotate(180deg);
  }
}

:host(.ld-notice--info),
.ld-notice--info {
  ::slotted(ld-icon),
  ::slotted(.ld-icon),
  .ld-notice__icon,
  .ld-notice__headline {
    color: var(--ld-notice-info-icon-col);
  }
}

:host(.ld-notice--warning),
.ld-notice--warning {
  background: var(--ld-thm-warning-highlight);

  ::slotted(ld-icon),
  ::slotted(.ld-icon),
  .ld-notice__icon {
    --ld-icon-secondary-col: var(--ld-col-neutral-900);
    color: var(--ld-notice-warning-icon-col);
  }

  .ld-notice__headline {
    color: var(--ld-col-neutral-900);
  }
}

:host(.ld-notice--success),
.ld-notice--success {
  ::slotted(ld-icon),
  ::slotted(.ld-icon),
  .ld-notice__icon {
    color: var(--ld-notice-success-icon-col);
  }

  .ld-notice__headline {
    color: var(--ld-notice-success-icon-col);
  }
}

.ld-notice__headline {
  margin: 0 0 var(--ld-sp-12);
}

::slotted(ld-icon),
::slotted(.ld-icon),
.ld-notice__icon {
  left: var(--ld-sp-24);
  position: absolute;
  top: var(--ld-sp-24);
}
