.cl-form {
	.cl-form-item {
		display: flex;
		margin-bottom: 32rpx;
		position: relative;
		font-size: 28rpx;

		&.is-required {
			.cl-form-item__label::after {
				content: "*";
				color: $cl-color-error;
				margin-left: 6rpx;
			}
		}

		&__container {
			display: flex;
			align-items: center;
			flex: 1;
		}

		&__label {
			height: $cl-height;
			line-height: $cl-height;
			flex-shrink: 0;
			margin-right: 20rpx;
		}

		&__content {
			flex: 1;

			&.is-justify--left {
				text-align: left;
			}

			&.is-justify--center {
				text-align: center;
			}

			&.is-justify--end {
				text-align: right;
			}
		}

		&__message {
			display: block;
			color: $cl-color-error;
			font-size: 24rpx;
			text-align: right;
			margin-top: 6rpx;
		}

		&__append {
			display: flex;
			align-items: center;
			margin-left: 20rpx;
		}

		&.is-top {
			flex-direction: column;

			.cl-form-item__label {
				margin-right: 0;
				margin-bottom: 10rpx;
			}
		}

		&.is-left {
			.cl-form-item__label {
				text-align: left;
			}
		}

		&.is-right {
			.cl-form-item__label {
				text-align: right;
			}
		}
	}

	&--border {
		.cl-form-item {
			border-bottom: $cl-border-width solid #eeeeee;
		}
	}
}