@import "~ngx-toastr/toastr";

.toast-container .ngx-toastr {
  background-color: $white;
  background-size: 50px auto;
  background-repeat: repeat-y;
  background-position: 0px;
  padding: 10px 10px 10px 60px;
  color: black;
  &.toast-info,
  &.toast-error,
  &.toast-warning,
  &.toast-success {
    &::after {
      position: absolute;
      text-align: center;
      font: normal normal normal 14px/1 AmericanIcons;
      text-rendering: auto;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      font-size: 28px;
      color: $white;
      width: 50px;
      margin-top: auto;
      margin-bottom: auto;
      top: 0;
      left: 0;
      bottom: 0;
      right: 0;
      height: 36px;
    }
  }
  &.toast-info {
    background-image: linear-gradient(90deg, $dark-blue, $dark-blue);

    &::after {
      content: "\10e03c";
    }
  }
  &.toast-error {
    background-image: linear-gradient(90deg, $dark-red, $dark-red);

    &::after {
      content: "\10e03e";
    }
  }
  &.toast-success {
    background-image: linear-gradient(90deg, $dark-green, $dark-green);

    &::after {
      content: "\10e049";
    }
  }
  &.toast-warning {
    background-image: linear-gradient(90deg, $dark-orange, $dark-orange);

    &::after {
      content: "\10e03d";
    }
  }
}
.dark-theme .toast-container .ngx-toastr {
  background-color: #303030;
  color: white;
}