/* 全局重置 */
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: "Microsoft Yahei", sans-serif;
}

body {
	background-color: #f0f4f8;
}

/* 顶部图片区域 */
.top-banner {
	width: 100%;
	overflow: hidden;
}

.top-banner img {
	display: block;
	width: 100%;
	height: auto;
}

/* 表单容器 */
.form-container {
	max-width: 800px;
	margin: 0 auto;
	padding: 2.5rem;
	/*background-color: #e6edf7;*/
	/* 浅蓝背景，与原图一致 */
	border-radius: 8px;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}

.form-container h2 {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
	color: #e60012;
	/* 红色标题 */
	margin-bottom: 2rem;
	font-size: 1.2rem;
}

.form-container h2::before,
.form-container h2::after {
	content: '';
	display: block;
	width: 280px;
	height: 2px;
	background-color: #e60012;
}

.form-container h2::before {
	flex: 0 0 1;
}

.form-container h2::after {
	flex: 0 0 1;
}

.form-type-switch {
	display: flex;
	justify-content: center;
	gap: 12px;
	margin: 0 auto 24px;
}

.type-option {
	min-width: 120px;
	padding: 10px 20px;
	border: 1px solid #e60012;
	border-radius: 999px;
	background-color: #fff;
	color: #e60012;
	font-size: 14px;
	cursor: pointer;
	transition: all 0.3s ease;
}

.type-option.is-active {
	background-color: #e60012;
	color: #fff;
	box-shadow: 0 6px 16px rgba(214, 48, 49, 0.18);
}

.type-option:hover {
	background-color: #fbe5e5;
}

.type-option.is-active:hover {
	background-color: #c02728;
}

/* 表单模块 */
.form-section {
	margin-bottom: 2rem;
}

.form-section h3 {
	color: #e60012;
	margin-bottom: 1rem;
	font-size: 0.95rem;
	display: flex;
	align-items: center;
}

.form-section h3::before {
	content: '▶';
	color: #e60012;
	margin-right: 0.5rem;
	font-size: 0.8rem;
}

/* 表单组 */
.form-section h3 {
	color: #222;
	font-size: 16px;
	font-weight: 700;
	width: 100%;
	line-height: 1;
}

.form-section h3::before {
	content: '';
	width: 0;
	height: 0;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-left: 8px solid #e60012;
	margin-right: 8px;
	font-size: 0;
}

.form-section h3::after {
	content: '';
	flex: 1;
	height: 3px;
	margin-left: 10px;
	background: linear-gradient(to right, #777 0 28px, #d6d6d6 28px 100%);
}

.form-group {
	margin-bottom: 1rem;
	
}


.form-group label {
	display: block;
	margin-bottom: 0.5rem;
	color: #333;
	font-size: 0.85rem;
}

.form-group label span {
	color: #e60012;
	/* 必填星号标红 */
}

.form-group input {
	width: 100%;
	padding: 0.8rem;
	border: 1px solid #ddd;
	border-radius: 4px;
	font-size: 0.9rem;
	/* background-color: #f5f7fa; */
	background-color: #b2b2b2;
	/* 浅灰输入框背景 */
}

.form-group select {
	width: 100%;
	padding: 0.8rem;
	padding-right: 2rem;
	border: 1px solid #ddd;
	border-radius: 4px;
	font-size: 0.9rem;
	background-color: #f5f7fa;
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%23666' d='M1 0l4 4 4-4 1 1-5 5-5-5z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right .5rem center;
	background-size: 10px 6px;
}
.city-selects select {
	background-color: #b2b2b2;
}
.form-group select::-ms-expand {
	display: none;
}

.form-group select:disabled {
	background-color: #b2b2b2;
	color: #000;
	cursor: not-allowed;
}
input::placeholder {
    color: #000; /* 修改为你想使用的颜色 */
}
#container_box {
    width: 100%;
	background: url(../../images/testdrive/bg_body.jpg);
	padding-top: 2.5rem;
}
.city-selects {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0.6rem;
}

/* 错误状态样式 */
.form-group input.error,
.form-group select.error {
	border-color: #e60012;
	background-color: #fde2e2;
}

.error-message {
	color: #e60012;
	font-size: 0.8rem;
	margin-top: 0.3rem;
	display: block;
}

/* 按钮区域 */
.form-actions {
	display: flex;
	justify-content: center;
	gap: 1.2rem;
	margin-top: 2.5rem;
	padding-bottom: 2.5rem;
}

.btn-reset,
.btn-submit {
	padding: 0.8rem 1.8rem;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	font-size: 0.9rem;
	transition: background-color 0.3s;
}

.btn-reset {
	background-color: #ddd;
	color: #333;
}

.btn-submit {
	background-color: #e60012;
	color: #fff;
}

.btn-reset:hover {
	background-color: #ccc;
}

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

/* 免责声明 */
.disclaimer {
	text-align: center;
	margin-top: 1.2rem;
	font-size: 0.75rem;
	color: #666;
}

/* 手机端响应式适配 */
@media (max-width: 768px) {
	.top-banner img {
		width: 100%;
		height: auto;
	}

	.form-container {
		margin: 1rem;
		padding: 1.5rem;
	}

	.form-container h2::before,
	.form-container h2::after {
		display: none;
		/* 手机端隐藏标题两侧的线 */
	}

	.form-actions {
		flex-direction: column;
		/* 按钮垂直排列 */
	}

	.btn-reset,
	.btn-submit {
		width: 100%;
	}

	.city-selects {
		grid-template-columns: 1fr;
	}
}
