.lego-toast {
  background-color: $toast-bg;
  box-shadow: $box-shadow-toast;
  position: relative;
  padding: 0;
  display: flex;
  align-items: flex-start;
  top: 0;
  right: 0;
  bottom: inherit;
  left: inherit;
  border-radius: 4px;
  width: 20.5rem;

  .lego-toast-icon {
    width: 2rem;
    height: 2rem;
    margin: 0.75rem;
  }

  .lego-toast-close-icon {
    width: 18px;
    height: 18px;
    margin-right: 0.25rem;
    margin-top: 0.25rem;
    color: $light-gray;
    cursor: pointer;

    &:hover {
      color: $text-gray;
    }
  }

  .lego-toast-content {
    flex: 1;
    margin: 1rem 0;
    word-break: break-word;
  }

  a {
    font-size: 0.875rem;
  }
}

.lego-toast-error {
  @extend .lego-toast;
  border-left: 0.5rem solid $toast-error-color;

  .lego-toast-icon {
    color: $toast-error-color;
  }
}

.lego-toast-warning {
  @extend .lego-toast;
  border-left: 0.5rem solid $toast-warning-color;

  .lego-toast-icon {
    color: $toast-warning-color;
  }
}

.lego-toast-success {
  @extend .lego-toast;
  border-left: 0.5rem solid $toast-success-color;

  .lego-toast-icon {
    color: $toast-success-color;
  }
}

.lego-toast-info {
  @extend .lego-toast;
  border-left: 0.5rem solid $toast-info-color;

  .lego-toast-icon {
    color: $toast-info-color;
  }
}