@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';

.select-color {
	color: @common_level3_base_color;
}

.divider-title {
	font-size: 12px;
	color: #171a1d;
	line-height: 20px;
	margin: 12px;
	display: flex;
	justify-content: space-between;
	&-new {
		height: 8px;
	}
}

.divider-title-ocr {
	font-size: 12px;
	color: #171a1d;
	line-height: 20px;
	margin: 12px 12px 0 12px;
	display: flex;
	justify-content: space-between;
}

.form-font-weight {
	font-weight: 600;
}

.form-font-color-red {
	color: #f5222d;
}

.form-font-color-blue {
	color: #007fff;
}

.mini-divider-title {
	font-size: 12px;
	color: rgba(23, 26, 29, 0.6);
	line-height: 20px;
}

.select-color-disabled {
	& .dtm-list-extra {
		color: rgba(23, 26, 29, 0.24) !important;
	}
}

.divider-Tabtitle {
	font-size: 14px;
	color: #007fff;
	line-height: 20px;
	margin: 12px 12px 0px 12px;
	display: flex;
	justify-content: space-between;

	&-tabs {
		font-size: 12px;
		color: rgba(23, 26, 29, 0.6);

		& span {
			width: 10px;
			height: 10px;
			display: inline-block;
			margin-right: 8px;
			background: #d9d9d9;
			border-radius: 2px;
		}
	}

	&-tabs-green {
		font-size: 12px;
		color: #00b042;

		& span {
			width: 10px;
			height: 10px;
			display: inline-block;
			margin-right: 8px;
			background: #00b042;
			border-radius: 2px;
		}
	}

	&-tabs-red {
		font-size: 12px;
		color: #ff5219;

		& span {
			width: 10px;
			height: 10px;
			display: inline-block;
			margin-right: 8px;
			background: #ff5219;
			border-radius: 2px;
		}
	}
}

.render-form-childView4-relative {
	position: relative;
	min-height: 48px;
	padding-left: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
	overflow: hidden;
	vertical-align: middle;
	transition: background-color 200ms;
}

.render-form-childView4-absolute:before {
	position: absolute;
	left: 6px;
	display: inline-block;
	color: var(--theme_danger1_color, #ff5219);
	font-size: 14px;
	font-family: SimSun, sans-serif;
	line-height: 2px;
	content: '*';
}

.dtm-list-item {
	min-height: 46px;
}

.render-form-view {
	&-main {
		// overflow: hidden;
		// padding-bottom: 16px;

		& .dtm-space-item {
			font-size: 16px;
		}
	}

	&-overflow {
		// height: 100%;
		// overflow: scroll;
		// &::-webkit-scrollbar {
		// 	display: none !important;
		// }
	}

	&-input .dtm-input-item-input {
		// color: var(--common_level3_base_color, rgba(23, 26, 29, 0.4));
		font-size: 14px;
		text-align: right;
	}

	&-input-brief .dtm-input-item-input {
		// color: var(--common_level3_base_color, rgba(23, 26, 29, 0.4));
		font-size: 14px;
		// text-align: right;
	}

	&-title-borderRadius {
		border-radius: 10px;
	}

	&-switch-title {
		font-size: 14px;
		padding-right: 8px;
		color: #171a1d;
		opacity: 0.85;
	}

	&-switch .dtm-switch-fake {
		width: 43px !important;
		height: 22px !important;
	}

	&-switch .dtm-switch-fake::after {
		width: 18px !important;
		height: 18px !important;
		background-color: var(--common_white1_color, #ffffff);
	}

	&-switch .dtm-form-item-default-label {
		width: auto;
	}

	&-multiple {
		&-top .dtm-list-item-middle {
			border-radius: 10px 10px 0px 0px;
		}

		&-bottom .dtm-list-item-middle {
			border-radius: 0px 0px 10px 10px;
		}

		&-radius .dtm-list-item-middle {
			border-radius: 10px;
		}
	}

	&-select_multiple {
		display: flex;
		justify-content: space-between;

		&-value {
			color: #171a1d;
			opacity: 0.85;
			font-size: 14px;
		}

		&-m {
			font-size: 14px;
			color: rgba(23, 26, 29, 0.4);
		}
	}

	&-space {
		width: 100%;
	}

	&-files {
		background: #ffffff;
		border-radius: 10px;
		padding: 12px 16px 16px;

		&-title {
			font-size: 14px;
			text-align: LEFT;
			color: #171a1d;
			line-height: 22px;
			margin-bottom: 12px;
		}

		&-col {
			display: flex;
			justify-content: space-between;
		}
	}

	&-childView {
		margin-bottom: 0px;
		background: #fff;
		padding: 10px 16px;

		&-flex {
			display: flex;
			align-items: center;

			& img {
				padding-left: 6px;
				width: 14px;
				height: 14px;
			}
		}

		&-rightArrow {
			margin-left: 5px;
			font-size: 15px;
			color: var(--common_level4_base_color, #ffffff);
		}
	}

	&-headtTitle {
		background: #fff;
		padding: 12px 16px;

		&-overflow {
			overflow: scroll;
			height: 300px;
		}

		&-flex {
			display: flex;
			align-items: center;
			justify-content: space-between;

			& img {
				padding-left: 6px;
				width: 14px;
				height: 14px;
			}
		}

		&-border {
			position: relative;
			background-color: @common_bg_z1_color;

			&::after {
				content: '';
				position: absolute;
				height: 1px;
				background-color: @common_line_light_color;
				left: 0;
				right: 0;
				z-index: 99;
				bottom: -12px;
			}
		}
	}

	&-checkbox {
		margin: 12px 0;
		& .dtm-list-thumb {
			// margin: 0 !important;
		}
		& .dtm-list-item {
			padding: 0;
		}
		& .dtm-list-line {
			padding: 0;
		}
	}

	&-number {
		& .dtm-form-item-default-label {
			flex: 3;
		}
		& .dtm-form-item-default-label .dtm-space-item {
			width: 100%;
			white-space: pre-wrap;
		}

		& .dtm-form-item-default-field {
			flex: 1;
		}
	}
}

.people-visit-edit-select-subtitle {
	color: rgba(23, 26, 29, 0.24);
	font-size: 14px;
	line-height: 22px;
	padding-left: 24px;
}

.render-form-view-headtTitle-select {
	display: flex;
	background: #f2f2f6;
	padding: 6px 5px;
	border-radius: 4px;
	align-items: center;
	&-person {
		background-color: #007fff;
		border-radius: 4px;
		font-size: 14px;
		line-height: 24px;
		padding: 0px 5px;
		height: 24px;
		color: #fff;
		margin-right: 8px;
    white-space: nowrap;
	}
	& img {
		width: 16px;
		height: 16px;
	}
}

.headerTitleAdd-empty {
	flex: 2;
	height: 110px;
}

.renderFormView {
	&-card {
		padding: 12px 16px;
		background-color: #fff;
		margin-top: 8px;
		&-title {
			font-size: 16px;
			line-height: 24px;
			display: flex;
			align-items: center;
			& img {
				width: 16px;
				height: 16px;
				margin-left: 4px;
			}
		}
		&-header {
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-bottom: 8px;
		}
		&-main {
			display: flex;
			line-height: 22px;
			color: rgba(23, 26, 29, 0.6);
			&-flex {
				font-size: 14px;
				line-height: 22px;
				flex: 1 1;
				display: flex;
			}
		}
	}
}

.switchSelect {
	display: flex;
	align-items: center;
	font-size: 14px;
	line-height: 22px;
	background-color: #d9d9d9;
	padding: 2px;
	border-radius: 4px;
	&-name {
		white-space: nowrap;
		padding: 1px 8px;
	}
	&-active {
		background-color: #fff;
		border-radius: 4px;
	}
}

.background-purple {
	background-color: #b963d3;
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	text-align: center;
	justify-content: center;
	border-radius: 50%;
	&-size {
		font-size: 24px;
		line-height: 32px;
		color: #fff;
	}
}

.background-orange {
	background-color: #ff9200;
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	text-align: center;
	justify-content: center;
	border-radius: 50%;
	&-size {
		font-size: 24px;
		line-height: 32px;
		color: #fff;
	}
}

.color-purple {
	color: #b963d3;
	&-title {
		font-size: 16px;
		line-height: 24px;
	}
	&-borderRadius {
		background: rgba(185, 99, 211, 0.12);
		border-radius: 15px;
	}
	&-flex {
		display: flex;
		&-margin {
			margin-top: 4px;
			& img {
				width: 14px;
				height: 14px;
				margin-right: 4px;
			}
		}
	}
}

.color-orange {
	color: #ff9200;
	&-title {
		font-size: 16px;
		line-height: 24px;
	}
	&-borderRadius {
		background: rgba(255, 146, 0, 0.12);
		border-radius: 15px;
	}
	&-flex {
		display: flex;
		&-margin {
			margin-top: 4px;
			& img {
				width: 14px;
				height: 14px;
				margin-right: 4px;
			}
		}
	}
}