.cl-loading-mask__wrap {
	position: relative;

	.cl-loading-mask {
		position: absolute;
		z-index: $cl-zIndex;
		margin: 0;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		height: 100%;
		width: 100%;
		opacity: 0;
		transition: opacity 0.3s;
		pointer-events: none;

		&.is-show {
			opacity: 1;
			pointer-events: auto;
		}

		&.is-fullscreen {
			position: fixed;
		}

		&__content {
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			position: absolute;
			top: 0;
			right: 0;
			bottom: 0;
			left: 0;
			width: 100%;
		}

		&__text {
			font-size: 26rpx;
			margin-top: 16rpx;
			letter-spacing: 1rpx;
			color: $cl-color-primary;
		}

		&__border {
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
		}

		&.is-border {
			.cl-loading-mask__border {
				background-color: rgba(0, 0, 0, 0.5);
				border-radius: 20rpx;
				width: 200rpx;
				padding: 40rpx 20rpx;
			}

			.cl-loading-mask__text {
				color: #fff;
				margin-top: 30rpx;
				text-align: center;
			}
		}
	}
}