@import "../../../../../../src/theme.less";
:host{
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
	.cursor{
		cursor: pointer;
	}
	.text-sign{
		text-decoration: underline;
		cursor: pointer;
	}
	.synthesize-box{
		background: #F0F2F5 !important;
		height: calc((100vh - 92px));
		overflow-y: auto;
		overflow-x: hidden;
		.searchDataWrap{
		  display: flex;
		  align-items: center;
		  justify-content: space-between;
			padding-right: 15px;
			background: #fff;
			margin-bottom: 8px;
		  .searchData{
		    padding: 16px;
		    .searchDataItem{
		      .label{
		        font-size: 16px;
		      }
          .selectItem{
            width: 160px;
          }
		    }
		  }
		}
		.top1-statistics{
			display: flex;
			background: #fff;
			padding: 10px 0;
			margin-bottom: 8px;
			.top-list{
				display: flex;
				align-items: center;
				justify-content: center;
				width: 20%;
				position: relative;
				.border{
					width: 1px;
					height: 42px;
					background: #D9D9D9;
					position: absolute;
					right: 0;
				}
				.special-box{
					text-align: center;
					position: relative;
					top: -5px;
					.num{
						font-size: 35px;
						font-weight: 500;
						color: #64BD7B;
					}
					.describe{
						font-size: 14px;
						color: #8F8F8F;
					}
				}
				.special-box-right{
					margin-left: 16px;
					.sign-describe{
						font-size: 12px;
						color: #8F8F8F;
						.sign-num{
							font-size: 14px;
							font-weight: 500;
							color: #000;
						}
					}
				}
			}
		}
		.top2-statistics{
			display: flex;
			// flex-flow: row wrap;
			// justify-content: space-between;
			height: 310px;
			margin-bottom: 8px;
			.mar-right-8{
				margin-right: 8px;
			}
			.statistics{
				padding: 10px;
				background: #fff;
				.statistics-box{
					height: 41px;
					display: flex;
					align-items: center;
					position: relative;
					.sign-green{
						width: 6px;
						height: 6px;
						border-radius: 50%;
						background: #64BD7B;
						margin-right: 5px;
					}
					.statistics-title{
						color: #000;
						font-size: 16px;
						font-weight: 500;
						margin-right: 10px;
					}
					.statistics-select{
						display: flex;
						.statistics-select-list{
							width: 58px;
							height: 23px;
							line-height: 23px;
							text-align: center;
							border-radius: 3px;
							border: 1px solid #E2E2E2;
							font-size: 12px;
							margin-right: 3px;
							cursor: pointer;
						}
						.activeClass{
							color: #64BD7B !important;
							border: 1px solid #64BD7B !important;
							background: #E9F7E9 !important;
						}
					}
					.more{
						position: absolute;
						right: 0;
						cursor: pointer;
					}
				}
				.table{
					width: 100%;
					.td{
						display: flex;
						height: 45px;
						border-bottom: 1px solid #D9D9D9;
						background: #FAFAFA;
						.table-td{
							line-height: 45px;
							text-align: center;
							width: 16.66%;
							color: #000;
						}
						.table-td-4{
							line-height: 45px;
							text-align: center;
							width: 25%;
							color: #000;
						}
					}
					.th{
						display: flex;
						height: 40px;
						border-bottom: 1px solid #D9D9D9;
						.table-list{
							line-height: 40px;
							text-align: center;
							width: 16.66%;
							color: #8F8F8F;
							.img{
								width: 25px;
							}
						}
						.table-list-4{
							line-height: 40px;
							text-align: center;
							width: 25%;
							color: #8F8F8F;
						}
					}
				}
			}
			.width-60{
				width: 60%;
			}
			.width-50{
				width: calc((100% - 8px)/2);
				background: #fff;
				.echarts-repairs{
					.echarts{
						width: 100%;
						height: 260px;
					}
				}
			}
			.width-49{
				width: calc((100% - 8px)/2);
				background: #fff;
				.echarts-repairs{
					.echarts{
						width: 100%;
						height: 260px;
					}
				}
			}
			.width-40{
				width: 40%;
				background: #fff;
				.echarts-repairs{
					.echarts{
						width: 100%;
						height: 260px;
					}
				}
			}
		}
		.top3-statistics{
			// display: flex;
			// height: 310px;
			margin-bottom: 8px;
		}
	}
}

.mask-style{
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999;
	display: flex;
	background: rgba(0,0,0,0.2);
	align-items: center;
	justify-content: center;
}
.spin-style{
	z-index:9999;
}
