@use '../../libs/css/mixin' as *;
@use '../../libs/css/theme' as *;

@include b(toast) {
  @include e(content) {
    @include flex;
    padding: 20rpx 32rpx;
    border-radius: 16rpx;
    background-color: #585858;
    color: #ffffff;
    align-items: center;
    /* #ifndef APP-NVUE */
    max-width: 600rpx;
    /* #endif */
    position: relative;
    z-index: 11000;
    /* #ifndef APP-NVUE */
    box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.15);
    /* #endif */

    @include m(loading) {
      flex-direction: column;
      padding: 40rpx;
    }

    @include m(icon) {
      width: 40rpx;
      height: 40rpx;
      border-radius: $hy-radius-semicircle;
      box-sizing: border-box;
      margin-right: 16rpx;
      display: flex;
      justify-content: center;
      align-items: center;
      flex-shrink: 0;

      @include e(info) {
        background: $hy-info;
      }

      @include e(primary) {
        background: $hy-primary;
      }

      @include e(success) {
        background: $hy-success;
      }

      @include e(error) {
        background: $hy-error;
      }

      @include e(warning) {
        background: $hy-warning;
      }
    }

    @include m(text) {
      color: #ffffff;
      font-size: $hy-font-size-base;
      line-height: 1.5;
      max-width: 480rpx;
      word-break: break-all;

      @include e(info) {
        color: $hy-info;
      }

      @include e(error) {
        color: $hy-error;
      }

      @include e(primary) {
        color: $hy-primary;
      }

      @include e(success) {
        color: $hy-success;
      }

      @include e(warning) {
        color: $hy-warning;
      }
    }
  }

  @include m(default) {
    color: #ffffff;
    background-color: rgba(0, 0, 0, 0.75);
  }
}