/* login.css - 湖南省殡葬协会登录专用样式 */
/* 所有样式限定在 .rhsq-login-form 内部，避免全局污染 */

.rhsq-login-form {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding: 20px;
	box-sizing: border-box;
}

/* === 登录类型选择器（人像）=== */
.login-type-selector {
	display: flex;
	gap: 50px;
	margin-bottom: 30px;
}

.type-option {
	display: flex;
	flex-direction: column;
	align-items: center;
	cursor: pointer;
	opacity: 0.6;
	transition: opacity 0.2s, transform 0.2s;
}

.type-option.active {
	opacity: 1;
	transform: scale(1.05);
}

.type-option .avatar {
	width: 60px;
	height: 60px;
	border-radius: 50%;
	background-color: white;
	border: 2px solid #ddd;
	margin-bottom: 8px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='4' fill='%23aaa'/%3E%3Cpath d='M20 22H4a2 2 0 01-2-2v-4c0-1.5.8-2.8 2-3.6V10a6 6 0 0112 0v2.4c1.2.8 2 2.1 2 3.6v4a2 2 0 01-2 2z' fill='%23aaa'/%3E%3C/svg%3E");
	background-size: 60%;
	background-repeat: no-repeat;
	background-position: center;
}

.type-option.active .avatar {
	border-color: #1C983E;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='4' fill='%231C983E'/%3E%3Cpath d='M20 22H4a2 2 0 01-2-2v-4c0-1.5.8-2.8 2-3.6V10a6 6 0 0112 0v2.4c1.2.8 2 2.1 2 3.6v4a2 2 0 01-2 2z' fill='%231C983E'/%3E%3C/svg%3E");
}

.type-option span {
	font-size: 14px;
	color: #555;
}

.type-option.active span {
	color: #1C983E;
	font-weight: bold;
}

/* === 登录框 === */
.login-box {
	max-width: 400px;
	width: 100%;
	padding: 30px;
	background: #ffffff;
	border-radius: 8px;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.login-title {
	text-align: center;
	font-size: 20px;
	font-weight: bold;
	margin-bottom: 24px;
	color: #333;
}

/* === 水平表单行 === */
.form-row {
	display: flex;
	align-items: center;
	margin-bottom: 18px;
}

.form-label {
	width: 70px;
	font-weight: bold;
	color: #444;
	font-size: 14px;
	text-align: justify;
	text-align-last: justify;
	margin-right: 12px;
}

.form-control {
	flex: 1;
	padding: 8px 12px;
	border: 1px solid #ccc;
	border-radius: 4px;
	font-size: 14px;
	box-sizing: border-box;
}

.btn-submit {
	width: 100%;
	padding: 10px;
	background-color: #1C983E;
	color: white;
	border: none;
	border-radius: 4px;
	font-size: 16px;
	cursor: pointer;
	font-weight: bold;
}

.btn-submit:hover {
	background-color: #177a30;
}

.login-error {
	color: #e74c3c;
	font-size: 14px;
	margin-top: 10px;
	text-align: center;
	padding: 8px;
	background-color: #ffebee;
	border-radius: 4px;
}

/* === 密码输入框 + 小眼睛样式 === */
.password-container {
	position: relative;
	flex: 1; /* 保持和原输入框一样的宽度 */
}

.password-container .form-control {
	width: 100%;
	padding-right: 36px; /* 给小眼睛留空间 */
}

.password-toggle {
	position: absolute;
	right: 10px;
	top: 50%;
	transform: translateY(-50%);
	cursor: pointer;
	user-select: none;
	transition: all 0.2s;
}

.password-toggle:hover {
	opacity: 0.8;
}

/* 错误提示样式（确保显示正常） */
.login-error {
	color: #e74c3c;
	font-size: 14px;
	margin-top: 10px;
	text-align: center;
	padding: 8px;
	background-color: #ffebee;
	border-radius: 4px;
	display: none; /* 默认隐藏 */
}