// 笔记本适配 暂定1680
$font-small: 12px;
$font-normal:14px;

@media screen and (max-width:1710px) {
	.el-icon-refresh {
		font-size: 14px;
		margin-left: 8px;
		cursor: pointer;
	}
	.chartSetting_main {
		display: flex;
		flex-direction: column;
		div::-webkit-scrollbar {
			width: 5px !important;
		}
		.slide-icon {
			padding: 20px 0;
			/* display: block; */
			box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.3);
			border-radius: 5px;
			cursor: pointer;
			position: absolute;
			top: 50%;
			transform: translateY(-50%);
			z-index: 99;
			&:hover {
				background-color: rgba(0, 0, 0, 0.05);
			}
			&.slide-left {
				right: 0;
			}
			&.slide-right {
				left: 0;
			}
		}
		.main-left {
			width: 400px;
			min-width: 300px;
			background: #fff;
			margin-right: 20px;
			border: 1px solid #ececec;
			border-radius: 4px;
			box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.05);
			height: calc(100vh - 113px);
			overflow: hidden;
			position: relative;
			box-sizing: border-box;
			.chartSetting_main_top {
				padding: 10px 20px 15px;
				.add-cont {
					cursor: pointer;
					font-size: 14px;
					color: #409eff;
				}
			}
			.tree-cont {
				padding: 15px 20px 30px;
				overflow: auto;
				max-height: calc(100vh - 330px);
			}
			.target_tree {
				font-size: 12px;
				color: #333;
				.label-input .el-input__inner {
					height: 25px;
					line-height: 25px;
				}
				.custom-tree-node {
					display: flex !important;
					justify-content: space-between;
					align-items: center;
					display: block;
					flex: 1;
					.node_label {
						margin-right: 2px;
					}
				}
				.el-tree__drop-indicator {
					/* position:absolute; */
					/* left:0;
					right:0; */
					height: 3px;
					margin-top: 8px;
					background-color: #409eff;
				}
				.el-tree-node__content {
					margin-bottom: 14px !important;
				}
				.el-tree-node__children {
					.el-tree-node {
						/* margin-bottom: 8px !important; */
						margin-bottom: 0px !important;
						padding-left: 18px;
					}
					.el-tree-node__content {
						margin-bottom: 5px !important;
						padding-left: 0 !important;
					}
				}
				.expanded.el-icon-caret-right:before {
					content: url('../../assets/img/set_m/down.png') !important;
				}
				.el-icon-caret-right:before {
					content: url('../../assets/img/set_m/slide.png') !important;
				}
				.el-tree-node__expand-icon.is-leaf.el-icon-caret-right:before {
					content: '' !important;
				}
				.el-tree-node__expand-icon.expanded {
					-webkit-transform: rotate(0deg);
					transform: rotate(0deg);
				}
				.el-tree-node.is-current > .el-tree-node__content {
					background-color: #f0f4ff !important;
				}
				.el-tree-node__content {
					padding-right: 10px !important;
				}
			}
			.noDepart {
				margin: 60px 0;
				display: flex;
				align-items: center;
				justify-content: center;
				color: #409eff;
				font-size: 16px;
				cursor: pointer;
			}
			.move-btn {
				height: 100%;
				width: 4px;
				/* opacity: 0; */
				position: absolute;
				right: 0px;
				top: 0;
				&:hover {
					cursor: col-resize;
					/* background-color: orange */
				}
			}
		}
		.main-right {
			width: 80%;
			.mx-datepicker {
				width: 220px !important;
			}
			/* =================== */
			.chart-min-cont {
				background: #fff;
				border: 1px solid #ececec;
				height: calc(100vh - 118px);
				// overflow: hidden;
				overflow: auto;
				border-radius: 4px;
				box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.05);
				.cont-top {
					padding: 12px 20px;
					border-bottom: 1px solid #ececec;
					display: flex;
					justify-content: space-between;
					align-items: center;
					box-shadow: 0px 3px 6px rgba(167, 167, 167, 0.09);
					.top-left {
						.year-btn {
							font-size: $font-small;
							margin-left: 5px;
							margin-right: 5px;
							margin-bottom: 5px;
							padding: 6px 12px;
						}
						.btn-sty {
							font-size: $font-small;
							margin-left: 5px;
							padding: 6px;
							border: 1px solid #409eff;
						}
					}
					.top-right {
						.join_txt {
							color: #409eff;
							cursor: pointer;
							&:hover {
								text-decoration: underline;
							}
						}
						.collected {
							color: #f00;
							cursor: pointer;
							&:hover {
								text-decoration: underline;
							}
						}
						font-size: $font-normal;
						.span-item {
							color: #409eff;
							cursor: pointer;
							&:hover {
								text-decoration: underline;
							}
							.el-icon-collection,
							.el-icon-document-copy {
								color: #409eff;
							}
						}
					}
				}
				.cont-bottom {
					padding: 20px;
					// height: calc(100vh - 250px);
					// overflow: auto;
					.el-input__inner {
						height: 27px;
						line-height: 27px;
						padding: 0 4px;
					}
					.el-input-number .el-input__inner {
						padding: 0 34px 0 4px;
					}
					.el-color-picker--mini .el-color-picker__trigger {
						width: 60px;
						height: 25px;
						padding: 0;
					}
					.el-color-picker--mini .el-color-picker__mask {
						width: 60px;
						height: 25px;
					}
					.el-table {
						font-size: $font-small;
					}
					.el-table td, .el-table th {
						padding: 8px 0;
					}
					.el-table .el-table__expanded-cell {
						padding: 8px 10px;
					}
					.highcharts-range-selector-group {
						display: none;
						.highcharts-input-group {
							display: none;
						}
					}
					.highcharts-axis-title {
						display: block;
					}
					.calendar-cont {
						display: block;
						margin: 10px auto 0;
						text-align: center;
					}
					/* =================== */
					.chart-show-cont {
						padding: 0 160px 0 120px;
						position: relative;
						.chart-title {
							font-size: 16px;
							font-weight: normal;
							text-align: center;
						}
						.chart-author {
							font-size: 14px;
							color: #333;
							position: absolute;
							bottom: -20px;
							right: 50px;
						}
						.chartWrapper {
							position: relative;
							.range-cont {
								position: absolute;
								top: 13%;
								.min-data-input {
									width: 60px;
									display: block;
									margin-top: 230px;
								}
								&.left {
									left: -80px;
								}
								&.right {
									right: -65px;
								}
								&.rightTwo {
									right: -130px;
								}
								&.bottom {
									width: 100%;
									display: flex;
									justify-content: space-between;
									top: auto;
									right: 0;
									bottom: -3%;
									.left {
										width: 60px;
										display: block;
										flex-shrink: 0;
									}
								}
							}
						}
					}
					.options-cont {
						display: flex;
						flex-wrap: wrap;
						justify-content: space-between;
					}
				}
			}
		}
		.chartSetting-main{
			display: flex;
		}
		.chartSetting-label-list{
			margin-bottom: 22px;
		}
	}

	.drawImg {
		position: absolute;
		top: -999px;
		z-index: -100;
	}
}