.retrieve-password,
.register,
.login {
	width: 100%;
	height: 100%;
	overflow: hidden;
	display: flex;
	user-select: none;

	>.left {
		flex: 1;
		height: 100%;
		position: relative;
		overflow: hidden;

		>.bg {
			width: 100%;
			height: 100%;
			object-fit: cover;
		}

		>.logo {
			position: absolute;
			top: 3.2rem;
			left: 3.8rem;
			width: auto;
			height: 2.5rem;

			>span {
				font-weight: 600;
				font-size: 3.3rem;
				font-family: SemiBold;
			}
		}
	}

	>.right {
		width: 50%;
		min-width: 600px;
		display: flex;
		flex-direction: column;
		background-image: url('@/assets/images/login/right-bg.png');
		background-size: auto 100%;
		background-position: left center;
		background-repeat: no-repeat;

		>.top {
			display: flex;
			padding: 3rem 0 0 3rem;

			>.back {
				width: 5rem;
				height: 5rem;
				border-radius: 1.2rem;
				border: 0.25rem solid #252727;
				background-color: transparent;
				cursor: pointer;
			}
		}

		>.box {
			min-width: 50rem;
			flex: 1;
			overflow-y: auto;
			margin: 0 auto;
			display: flex;
			flex-direction: column;
			align-items: center;

			>img {
				width: auto;
				height: 12rem;
				margin-top: 2rem;
			}

			>.visible-code {
				margin-top: 1.7rem;
				margin-bottom: 7.2rem;
			}

			>.title {
				font-weight: 600;
				font-size: 6.1rem;
				display: flex;
				align-items: center;
				justify-content: center;
				color: #252727;

				&:deep(*) {
					margin-left: 1rem;
					font-family: LBold;
					margin-bottom: -1rem;
				}
			}

			>.tip {
				font-weight: 400;
				font-family: Regular;
				font-size: 1.8rem;
				color: #666;
				margin-top: 0.5rem;
			}

			&:deep(.el-form) {
				margin-top: 5rem;
				width: 100%;
				font-family: Regular;

				.el-form-item {
					position: relative;
					margin-bottom: 2rem;
				}

				.el-form-item__content {
					position: relative;
				}

				.password-tip {
					position: absolute;
					z-index: 10;
					top: -1rem;
					right: 0;
					transform: translateY(-100%);
				}

				.el-form-item__label {
					color: #252727;
					font-size: 1.8rem;
					margin-bottom: 0.8rem;
					font-family: Medium;
				}

				.el-input {
					--el-input-height: 5rem;
					--el-input-border-radius: 0.8rem;
					--el-input-text-color: #252727;
					--el-border-color: #dfdfdf;
					font-size: 1.4rem;
				}

				.forgotPassword {
					margin-top: -1.2rem;
					margin-bottom: 2rem;
					font-size: 1.6rem;
					text-align: right;
					color: #666666;
					cursor: pointer;
					text-decoration: underline;
				}


				.privacy {
					--el-checkbox-height: auto;
					margin-bottom: 4rem;

					.el-checkbox__label {
						font-size: 1.6rem;
						color: #666666;
						font-weight: 400;

						>div {
							>span {
								text-decoration: underline;
								cursor: pointer;
							}
						}
					}
				}

				.el-form-item__error {
					padding-top: 1px;
					font-size: 1.4rem;
				}

				.submit {
					width: 100%;
					height: 6rem;
					background: #252727;
					font-size: 2rem;
					border-radius: 0.8rem;
					color: #fff;
					font-weight: 600;
					font-family: SemiBold;
				}
			}

			>.tip-2 {
				font-weight: 400;
				font-size: 1.6rem;
				color: #666;
				font-family: Regular;

				&:deep(span) {
					text-decoration: underline;
					color: #FF7A50;
					cursor: pointer;
				}
			}

			>.other-login {
				margin-top: 5rem;
			}
		}
	}
}