@import (reference) './variable.less';

@toastPrefix: ant-toast;

.@{toastPrefix} {
  color: #fff;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  z-index: 999;
  padding: 24 * @rpx;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: #000;
  border-radius: 16 * @rpx;

  &-icon,
  &-image,
  &-normal {
    margin-bottom: 16 * @rpx;
  }

  &-normal {
    height: 80 * @rpx;
  }

  &-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 100 * @rpx;
  }

  &-image,
  &-icon {
    width: 80 * @rpx;
    height: 80 * @rpx;
    background-size: contain;
    background-repeat: no-repeat;
  }

  &-text {
    &-body {
      display: flex;
      max-width: 380 * @rpx;
      max-height: 84 * @rpx;
      justify-content: center;
    }

    &-box {
      min-width: 0;
      max-height: 84 * @rpx;
    }

    &-content {
      font-size: 30 * @rpx;
      line-height: 42 * @rpx;
      max-width: 100%;
      overflow: hidden;
      text-overflow: ellipsis;
    }
  }

  &-icon-wrapper {
    width: 280 * @rpx;
    height: 280 * @rpx;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
  }

  &-mask {
    z-index: 998;
  }
}