.uex-toast-wrapper {
  position: fixed;
  display: flex;
  width: 100%;
  top: 100%;
  left: 0;
  padding: 0;
  flex-direction: column;
  align-items: center;
  z-index: 20000 !important;

  .uex-toast {
    position: absolute;
    display: block;
    min-width: $uex-toast-min-width-sm;
    max-width: $uex-toast-max-width-sm;
    padding: $uex-toast-padding;
    top: 0;
    font-size: $uex-toast-font-size;
    color: $uex-toast-color;
    background-color: $uex-toast-bg;
    border-radius: $uex-toast-border-radius $uex-toast-border-radius 0 0;
    box-shadow: $uex-toast-box-shadow;

    .media-body {
      padding: 0;
    }

    .media-left {
      padding-left: 0;
    }
  }

  @media screen and (min-width: 576px) {
    .uex-toast {
      min-width: $uex-toast-min-width;
      max-width: $uex-toast-max-width;
    }
  }
}