@import '../mixins.less';

.toast-modal {
  position: absolute;
  left: 50%;
  top: 50%;
  padding: .5rem 1.1rem;
  transform: translate3d(-50%, -50%, 0) scale(1.2);
  background: rgba(0,0,0,0.6);
  z-index: 11000;
  border-radius: 0.25rem;
  transition: transform .3s, opacity .3s;
  color: white;
  text-align: center;
  min-width: 5.5rem;
  opacity: 1;

  &.toast-modal-enter {
    opacity: 0;
    transform: translate3d(-50%, -50%, 0) scale(0.8);
  }
  &.toast-modal-leave-active {
    opacity: 0;
    transform: translate3d(-50%, -50%, 0) scale(1.2);
  }
}

.icon-wrap {
  margin: .2rem 0;
}

.text {
  margin: .2rem 0;
  font-size: .8rem;
}

.icon {
  font-size: 1.8rem;
}