/* 当事人信息页面的主容器 */
.party-info-container {
	position: absolute;
	top: 44px;
	width: 100%;
	padding-bottom: 68px;

	/* 内容区包装器，用于表单及所有区块的排列 */
	.content-wrapper {
		display: flex;
		flex-direction: column;
		/* 每个表单区块的通用样式 */
		.section {
			background-color: #ffffff;
		}

		/* 两行布局样式，用于姓名和联系方式 */
		.form-two-column-layout {
			display: flex;
			flex-direction: column;
			width: 100%;
			margin-bottom: 8px;
			padding: 12px 0;
			background-color: #ffffff;

			/* 姓名和联系方式的表单项样式 */
			.dtm-form-item-required-label::before {
				display: inline-block;
				margin-right: 4px;
				color: #ff0000;
				font-size: 15px;
				line-height: 1;
				content: '*';
				vertical-align: middle;
			}

			.dtm-form-item-default-label {
				display: flex;
				align-items: center;
				padding: 12px 0;
			}

			.dtm-form-item-default {
				padding: 0;
			}

			.form-component-wrapper {
				width: 100%;

				&.form-input-wrapper,
				&.form-textarea-wrapper {
					box-sizing: border-box;
					display: block;
				}
			}
		}

		/* 企业信息下拉选择区域样式 */
		#companyInfo {
			min-height: 47px;
			height: 47px;
			.dtm-form-item-default-label {
				font-size: 15px;
			}
			> .dtm-list-item {
				min-height: 47px;
				height: 47px;
				padding-right: 16px;
				> .dtm-list-line {
					min-height: 47px;
					padding: 0px;
				}
			}
		}
		/* 人员类型选择区域样式 */
		.personnel-type {
			height: 132px;
			padding-left: 16px;
			margin-bottom: 8px;

			/* 人员类型标题样式 */
			&-title {
				padding-top: 12px;
				padding-bottom: 8px;
				width: 60px;
				height: 23px;
				font-size: 15px;
				font-family: PingFang SC, PingFang SC-400;
				font-weight: 400;
				text-align: left;
				color: #171a1d;
				line-height: 23px;
			}

			/* 人员类型选项容器 */
			&-content {
				display: flex;

				/* 每个类型选项的样式 */
				.type-option {
					display: flex;
					margin-right: 16px;
					width: 104px;
					height: 63px;
					flex-direction: column;
					align-items: center;
					cursor: pointer;
					border: 1px solid #e8e8e8;
					border-radius: 8px;
					padding-top: 9px;

					/* 选中状态样式 */
					&.selected {
						border-color: #1a6fb8;
						position: relative;

						/* 选中图标样式 */
						.selected-icon {
							position: absolute;
							top: 5px;
							right: 5px;
							color: #1a6fb8;
							font-size: 16px;
							z-index: 1;
						}

						/* 选中状态下的类型图标样式 */
						.type-icon {
							&.natural-person {
								background: url('../../../assets/img/natural_person_1.png') center/cover no-repeat;
							}

							&.legal-person {
								background: url('../../../assets/img/legal_person_1.png') center/cover no-repeat;
							}

							&.non-legal-person {
								background: url('../../../assets/img/unincorporated_org_1.png') center/cover no-repeat;
							}
						}

						/* 选中状态下的类型名称样式 */
						.type-name {
							color: #1a6fb8;
						}
					}
					/* 默认状态下的类型图标样式 */
					.type-icon {
						width: 32px;
						height: 32px;
						background-color: #f5f5f5;
						display: flex;
						align-items: center;
						justify-content: center;

						&.natural-person {
							background: url('../../../assets/img/natural_person_0.png') center/cover no-repeat;
						}

						&.legal-person {
							background: url('../../../assets/img/legal_person_0.png') center/cover no-repeat;
						}

						&.non-legal-person {
							background: url('../../../assets/img/unincorporated_org_0.png') center/cover no-repeat;
						}
					}

					/* 类型名称样式 */
					.type-name {
						padding-top: 4px;
						padding-bottom: 5px;
						line-height: 23px;
						font-size: 15px;
						font-family: PingFang SC, PingFang SC-400;
						font-weight: 400;
						color: #171a1d 60%;
						text-align: center;
					}
				}
			}
		}

		//自然人表单区域样式
		.natural-person-content-wrapper {
			//自然人表单内容样式
			.dtm-list-content {
				width: 100%;
				font-size: 15px;
				font-family: PingFang SC, PingFang SC-400;
				font-weight: 400;
				text-align: left;
				color: #171a1d;
				line-height: 23px;
			}
			//自然人表单项样式
			.dtm-form-item-default {
				font-size: 15px;
				font-family: PingFang SC, PingFang SC-400;
				font-weight: 400;
				text-align: left;
				color: #171a1d;
				line-height: 23px;
			}
			// 身份证明材料特殊样式
			.id-card-materials-item {
				.dtm-form-item-default {
					min-height: 47px;
					padding: 0;
				}

				.dtm-list-content {
					width: 100%;
				}

				.dtm-list-line {
					min-height: 47px;
					padding: 0;
				}

				.dtm-form-item-default-field {
					text-align: right;
					padding-right: 14px;
					margin-right: 16px;
				}

				.dtm-upload {
					width: auto !important;
					justify-content: flex-end;
				}
			}

			// 身份证明材料文件列表容器样式
			.id-card-files-container {
				padding: 0 16px;
				margin-bottom: 8px;
				background-color: #ffffff;

				.file-item {
					display: flex;
					align-items: center;
					padding: 12px 0;
					border-bottom: 1px solid #f2f3f5;

					&:last-child {
						border-bottom: none;
					}

					.file-icon {
						width: 36px;
						height: 42px;
						margin-right: 12px;
						flex-shrink: 0;
					}

					.file-info {
						flex: 1;
						min-width: 0;

						.file-name {
							font-size: 14px;
							color: #171a1d;
							line-height: 20px;
							margin-bottom: 4px;
							white-space: nowrap;
							overflow: hidden;
							text-overflow: ellipsis;
						}

						.file-size-preview {
							display: flex;
							align-items: center;
							font-size: 12px;
							line-height: 17px;

							.file-size {
								color: rgba(23, 26, 29, 0.6);
								margin-right: 8px;
							}

							.preview-text {
								color: #1a6fb8;
								cursor: pointer;
							}
						}
					}

					.file-actions {
						margin-left: 8px;

						.delete-btn-wrapper {
							cursor: pointer;

							.delete-icon {
								width: 16px;
								height: 16px;
							}
						}
					}
				}
			}
		}

		/* 企业信息区域样式 */
		.company-info {
			margin-bottom: 8px;
			.dtm-list-line {
				padding: 12px 0px;
				padding-right: 16px;
				height: 50px;
			}
			.dtm-list-content {
				// height: 47px;
				padding: 0px;
				.form-item-label {
					padding: 0px;
				}
			}

			/* 表单项标签容器样式 */
			.form-item-label {
				display: flex;
				justify-content: space-between;
				align-items: center;
				// min-height: 47px;
				width: 100%;

				/* 标签文本样式 */
				.form-item-label-text {
					flex: 1;
					width: 50%;
					font-size: 15px;
				}

				/* 营业执照识别按钮样式 */
				.license-recognition-btn {
					font-size: 15px;
					flex: 1;
					width: 50%;
					text-align: right;
					padding: 0;
					background: none;
					border: none;
					color: #1a6fb8;
					margin: 0px;
					.dtm-button-text {
						// 靠右显示
						justify-content: flex-end;
					}

					.id-card-icon {
						margin-right: 4px;
					}
				}
			}
		}

		/* 企业详细信息区域样式 */
		.company-detail {
			margin-bottom: 8px;
			padding-right: 16px;
			.dtm-list-item {
				.dtm-list-line {
					height: 74px;
					padding: 0px;
				}
			}
			.company-type-item {
				.dtm-list-item {
					min-height: 47px;
					.dtm-list-line {
						height: 47px;
						padding: 0px;
					}
				}
			}
		}
		.flex-center(@axis: both) {
			display: flex;
			justify-content: center; // 水平居中
			align-items: center; // 垂直居中
			flex-direction: @axis; // 可选参数，调整主轴方向
		}
		/* 企业登记材料和法定代表人身份证明材料区域样式 */
		.registration-materials,
		.legal-identity {
			margin-bottom: 8px;
			padding-right: 16px;
			> .dtm-list-item {
				min-height: 47px;
				> .dtm-list-line {
					min-height: 47px;
					padding: 0px;
					> .dtm-list-content {
						> .dtm-form-item-default {
							display: flex;
							justify-content: space-between;
							align-items: center;
							width: 100%;
							padding-right: 16px;

							> .dtm-form-item-default-label {
								flex: 3;
								width: 100%;
								min-width: 0;
								padding-right: 12px;
								word-break: break-word;
								white-space: normal;
							}
							> .dtm-form-item-default-field {
								flex: 1;
								/* 上传容器样式 */
								> .upload-container {
									/* 上传按钮容器样式 */
									.upload-button-container {
										display: flex;
										align-items: center;
										height: 100%;
										justify-content: flex-end;
										.dtm-upload {
											justify-content: flex-end;
											display: flex;
											.dtm-list-item {
												min-height: 47px;
												.dtm-list-line {
													padding: 0%;
													min-height: 47px;
													padding-right: 0;
													.dd-icon {
														.flex-center();
													}
												}
											}
										}
										.dtm-divider {
											width: 0px;
											min-width: 0;
											height: 0px;
											margin: 0px;
										}
									}
								}
							}
						}
					}
				}
			}
			/* 文件列表区域样式 */
			.file-list {
				padding: 0px;
				padding-left: 16px;

				/* 单个文件项样式 */
				.file-item {
					display: flex;
					align-items: center;
					padding: 13px 0;
					// border-bottom: 1px solid #f2f3f5;

					// &:last-child {
					//     border-bottom: none;
					// }

					/* 文件图标样式 */
					.file-icon {
						width: 42px;
						height: 48px;
						margin-right: 16px;
						// flex-shrink: 0;
					}

					/* 文件信息区域样式 */
					.file-info {
						flex: 1;
						min-width: 0;

						/* 文件名称样式 */
						.file-name {
							font-size: 14px;
							color: #171a1d;
							line-height: 20px;
							margin-bottom: 4px;
							white-space: nowrap;
							overflow: hidden;
							text-overflow: ellipsis;
						}

						/* 文件大小和预览区域样式 */
						.file-size-preview {
							display: flex;
							align-items: center;
							font-size: 12px;
							line-height: 17px;

							/* 文件大小样式 */
							.file-size {
								color: rgba(23, 26, 29, 0.6);
								margin-right: 4px;
							}

							/* 预览文本样式 */
							.preview-text {
								color: #1a6fb8;
								cursor: pointer;

								&:active {
									opacity: 0.8;
								}
							}
						}
					}

					/* 文件操作区域样式 */
					.file-actions {
						display: flex;
						align-items: center;
						justify-content: center;
						margin-left: 12px;
						height: 100%;

						/* 删除按钮包装器样式 */
						.delete-btn-wrapper {
							display: flex;
							align-items: center;
							justify-content: center;
							cursor: pointer;
							height: 100%;

							/* 删除图标样式 */
							.delete-icon {
								width: 16px;
								height: 16px;

								&:active {
									opacity: 0.8;
								}
							}
						}
					}
				}
			}
		}

		/* 反映诉求记录样式 */
		.complaint-record {
			background-color: #ffffff;
			margin-bottom: 8px;

			.complaint-title {
				font-size: 16px;
				font-weight: 500;
				color: #171a1d;
				margin-bottom: 12px;
				text-align: left;
			}

			.complaint-stats {
				.stats-item {
					display: flex;
					width: 300px;
					margin-bottom: 8px;
					font-size: 15px;
					color: #4e5969;
					line-height: 22px;
					text-align: left;

					&:last-child {
						margin-bottom: 0;
					}
				}
			}
		}
	}

	/* 底部保存按钮区域样式 */
	.bottom-button-area {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 68px;
		background-color: #ffffff;
		z-index: 100;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 0;
		margin: 0;
		box-sizing: border-box;

		/* 保存按钮样式 */
		.save-button {
			width: 343px;
			height: 44px;
			margin: 12px 0;
			background: #1a6fb8;
			border-radius: 8px;
			padding: 0;

			/* 保存按钮文本样式 */
			&-text {
				margin-top: 8px;
				height: 24px;
				display: flex;
				align-items: center;
				justify-content: center;
				font-size: 17px;
				font-family: PingFang SC, PingFang SC-400;
				font-weight: 400;
				text-align: center;
				color: #ffffff;
			}
		}
	}
}

/* 表单项标签样式，用于包含识别按钮的标签 */
.form-item-label {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;

	/* 营业执照识别按钮样式 */
	.license-recognition-btn {
		background: none;
		color: #1a6fb8;
		border: none;
		height: 32px;
		padding: 0;
		font-size: 14px;
		white-space: nowrap;
		line-height: 32px;
		display: flex;
		align-items: center;
		min-width: 100px;

		/* 身份证图标样式 */
		.id-card-icon {
			font-size: 16px;
			margin-right: 4px;
			flex-shrink: 0;
		}

		/* 按钮文本样式 */
		.dtm-button-text {
			display: flex;
			align-items: center;
			height: 100%;
			padding: 0;
			margin: 0;
			font-size: 14px;
			font-family: PingFang SC, PingFang SC-400;
			font-weight: 400;
			text-align: left;
			color: #1a6fb8;
			line-height: 32px;
			flex: 1;
		}

		/* 按钮激活状态样式 */
		&:active {
			opacity: 0.8;
		}
	}
}

/* 人员标签相关样式 */
.card-select-container {
	.label {
		align-items: center;
		justify-content: center;
		width: 30px;
		height: 24px;
		border-radius: 4px;
		font-size: 14px;
		font-family: PingFang SC, PingFang SC-400;
		font-weight: 400;
		color: #ffffff;
		padding: 8px;
		margin-right: 8px;
		cursor: pointer;
		transition: all 0.3s ease;
		position: relative;
	}

	/* 标签被选中状态的样式 */
	.label-selected {
		transform: scale(1.1);
		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
	}

	.label-selected::after {
		content: '✓';
		position: absolute;
		top: -5px;
		right: -5px;
		width: 15px;
		height: 15px;
		background-color: #fff;
		border-radius: 50%;
		color: #000;
		font-size: 10px;
		display: flex;
		align-items: center;
		justify-content: center;
		font-weight: bold;
	}

	/* 每个标签的不同背景色 */
	.label:nth-child(1) {
		background-color: #c874d9; /* 精 */
	}

	.label:nth-child(2) {
		background-color: #4cd987; /* 流 */
	}

	.label:nth-child(3) {
		background-color: #e6be41; /* 毒 */
	}

	.label:nth-child(4) {
		background-color: #d95e94; /* 矫 */
	}

	.label:nth-child(5) {
		background-color: #20b0b8; /* 刑 */
	}

	.label:nth-child(6) {
		background-color: #377eee; /* 少 */
	}

	.label:nth-child(7) {
		background-color: #5d9cee; /* 潜 */
	}

	.label:nth-child(8) {
		background-color: #6764d7; /* 涉 */
	}
}

// 添加缓存的自然人卡片样式
.cached-natural-persons {
	margin: 10px 16px;

	.cache-title {
		font-size: 16px;
		font-weight: 500;
		color: #333;
		margin-bottom: 10px;
	}

	.person-card {
		background-color: #fff;
		border-radius: 8px;
		padding: 12px;
		margin-bottom: 10px;
		box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);

		&:active {
			background-color: #f5f5f5;
		}

		.person-info {
			.person-name {
				font-size: 16px;
				font-weight: 500;
				color: #333;
				margin-bottom: 8px;
			}

			.person-details {
				.detail-item {
					display: flex;
					margin-bottom: 4px;
					font-size: 14px;

					.detail-label {
						color: #666;
						margin-right: 8px;
						min-width: 70px;
					}

					.detail-value {
						color: #333;
						flex: 1;
						word-break: break-all;
					}
				}
			}
		}
	}
}

/* Select组件样式调整 */
:global {
	.dtm-select {
		.dtm-select-selector {
			display: flex;
			align-items: center;
			height: 100%;
			
			.dtm-select-selection-item {
				display: flex;
				align-items: center;
				line-height: 1;
				height: 100%;
				padding: 0;
			}
			
			.dtm-select-arrow {
				display: flex;
				align-items: center;
				margin-top: 0;
				height: 100%;
				position: absolute;
				right: 0;
				top: 50%;
				transform: translateY(-50%);
			}
		}
	}

	/* 全局InputItem样式调整 */
	.dtm-input-item-input {
		margin-bottom: 8px;
	}
}