//模态框的标题背景色 主题色
$funColor: #31b546;
//模态框的标题字体色
$funfont: #ffffff;
//第二级标题背景色--浅绿
$mainBackColor : #C6E3CA;
//页面主表导航栏背景色
$mainHeadColor:#f3f3f3;
//bootstrap contain的覆盖
//模态框标题字体色
$modalTitleFontColor:#ffffff;

//模态框内容标题背景色
$modalTitleBackColor:#f2f2f2;
//模态框上左,上右圆角
$modalTitleBR: 0;
//模态框标题内边距
$modalTitlePd: 8px 5px;
//公共按钮背景
$commonButtonBack:url(/dx-disinfectsystem/img/newButton.png) repeat;
//sprite图地址,输入框背景
$inputGroupBack:url(/dx-disinfectsystem/img/inputGroupBack.png) no-repeat;
//公共按钮样式
.dx-btn-primary {
	background: url(/dx-disinfectsystem/img/inputGroupBack.png) repeat;
	background-position: 0 -70px;
	&:hover{
		border-color: #ffffff;
	}
}
//输入框的边框圆角
$commonIBR: 0;
//输入框的输入文字左内边距,有需要也设右内边距
$commonTP: 10px;

//模态框label的字体
$labelFontSize: 15px;
$labelFontBold: normal;
//页面主表字号
$fontSize: 15px;

//模态框标题
@mixin modalTh{
	height: 37px;
	background-color: $funColor;
	font-weight: bold;
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
	color: $funfont;
	font-family: arial;
	font-size: 10px;
}
html{
	height: 100% !important;
	background-color: #f3f3f3;
}
body{
	margin: 0 0;
	padding: 0 0;
	background-color: #f3f3f3;
}

//select2框的样式
.select2{
	height: 25px;
	border-radius: 0;
	&-container{
		vertical-align: top;
		&--default{
			.select2-selection{
				border-radius: 0;
				height: 25px;
				border: 1px solid #ccc;
				&__rendered{
					height: 25px;
				}
				&__arrow{
					height: 25px;
				}
			}
		}
	}
}

.mainNav{
	height: 28px;
	display:none;
	&-title{
		height: 28px;
		background-color:  #C6E3CA;
		-ms-background-color:#BEDEC2;
		font-family: "宋体";
		font-size: 18px;
		color: #337ab7;
		font-weight: bold;
		padding: 3px 5px;
		border: 1px solid #BEDEC2 ;
	}
	&-shop{
		height: 37px;
		width: 100%;
		background:  $mainHeadColor;
		border-bottom: 2px solid #efefef; 
		padding: 10px 20px 45px 10px;
		margin-bottom: 10px;
		&-button{
			width: 50px;
			height: 30px;
			display: inline-block;
			background: blue;
		}
		.buttonGroup{
			width:350px;
			vertical-align: top;
			display: inline-block;
			.form{
				&-group{
					width: 340px;
				}
			}
		}
		.form{
			&-group{
				width: 235px;
				display: inline-block;
				vertical-align: top; 
				.form{
					&-group{
						width: 100%;
						select{
							width: 100%;
							height: 30px;
							border: 1px solid #ccc;
							border-radius: $commonIBR;
						}
					}
				}
				&>div,label{
					font-size: $labelFontSize;
					font-weight: $labelFontBold;
					padding-left: 0;
					padding-right: 0;
				}
			}
		}
		.control{
			&-label{
			}
		}
		.columnScreen{
			float: right;
			display: inline-block;
			button{
			border-color: #f2f2f2;
			background-color: #f2f2f2;
			}
		}
		&-search{
			display: inline-block;
			float:right;
			background: #ffffff;
			background-position: 165px 7px;
			padding-right: 25px;
			border-radius: $commonIBR;
		}
	}
	.btn{
		background:  #C6E3CA;
		border: rgba(0,0,0,0);
	}
}
 
.mainView{
	.slick{
		&-cell{
			&-checkboxsel{
				    padding: 0px 2px 0px 2px;
			}
		}
	}
	input[type="checkbox"]{
		width: 13px;
	}
	.mainContainer{
		background: #ffffff;
	}
}

.keep-open .dropdown-menu input{
	width: 20px;
}


.modal{
	&-body{
		margin: 0 auto;
	}
	&-content{
		margin:0 auto;
		border-radius: 0;
		width: 900px;
		margin:0 auto;
	}
	&-title{
		padding: 9px;
		@include modalTh;
	}
	&-header{
		@include modalTh;
		padding: 0 0 ;
		border-radius: 0;
		.close{
			margin: 10px 11px 0 0;
			font-size: 14px;
			font-weight: 700;
		}
	}
	&-footer{
		text-align: center;
	}
	&-tab{
		width: 2px;
		height: 12px;
		display: inline-block;
		background: $funColor;
	}
	&-empty-button{
		border: 1px solid $funColor;
		background-color: #ffffff;
		color: $funColor;
	}
	&-full-button{
		border-color: white;
		@extend .dx-btn-primary;
		color: #ffffff;
	}
	&-dialog{
		/*width: 960px;*/
	}
}


.thead{
	&-nav{
		&-select{
			input{
				margin:8px;
			}
			button{
				border: none;
				background: #F5F5F5;
			}
		}
	}
}


.ui-widget-content .mainFont{
	color: $funColor;
	font-weight: bold;
	&:hover{
	text-decoration: none;
	}
} 

.tips{ 
	font-size: 20px;
	font-weight: bold;
	color: #008000;
	text-align: center;
}
@mixin deliveryInfoLabel{
	width: 75px;
	height: 25px;
	display: inline-block;
	vertical-align: top;
	text-align: right;
}
.deliveryInfo{
	height: 625px;
	position: relative;
	padding: 0 10px 0 511px;
	height: 460px;
    overflow: scroll;
	&-left{
		width: 503px;
		height: 639px;
		position: absolute; 
		top: 0;
		left: 0;
		&-ul{
			ul{
				width: 245px;
				list-style: none;
				padding: 0;
				vertical-align: top;
				display: inline-block;
				 li{
					height: 30px;
					margin:6px 0;
					.form-group{
						width: 100%;
						label{
							@include deliveryInfoLabel;
							font-size: $labelFontSize;
							font-weight: $labelFontBold;
						}
						input{
							width: 150px;
							height: 25px;
							display: inline-block;
							vertical-align: top;
							padding: 0 10px;
							border: 1px solid #ccc;
						}
					}
				}
			}
		}
		&-handleName{
			width: 80px;
			display: inline-block;
			text-align: right;
		}
		&-input{
			width: 125px;
			display: inline-block;
		}
		&-title{
			width: 100%;
			font-size: 14px;
			border-top-left-radius: $modalTitleBR;
			border-top-right-radius: $modalTitleBR;
			padding: $modalTitlePd;
			margin-bottom: 10px;
			background-color: $modalTitleBackColor;
			color: $funColor;
			
		}
		&-bottom{
			height: 470px;
		}
	}
	&-right{
		&-top{
			&-title{
				width: 100%;
				font-size: 14px;
				border-top-left-radius: $modalTitleBR;
				border-top-right-radius: $modalTitleBR;
				color: $funColor;
				padding: 6px;
				background-color: $modalTitleBackColor;
				margin-bottom: 10px;
			}
			&-table{
				height: 270px;
				margin-bottom:10px;
			}
		}
		&-bottom{
			&-title{
				width: 100%;
				font-size: 14px;
				border-top-left-radius: $modalTitleBR;
				border-top-right-radius: $modalTitleBR;
				color: $funColor;
				padding: 6px;
				margin-bottom: 10px;
				background-color: $modalTitleBackColor;
			}
			&-table{
				height: 270px;
				margin-bottom:10px;
			}
		}
	}
} 

.bottomContain{
	position: absolute;
	width: 100%;
	height: 40px;
	padding-right: 20px;
	.pageContain{
		height: 35px;
		float: right;
		&Total{
			height: 35px;
			display: inline-block;
			vertical-align: top;
			padding: 8px 0 0 0;
		}
		&Button{
			height: 35px;
			vertical-align: top;
			display: inline-block;
			.pagination{
				margin: 0 0; 
				li{
					a{
						margin-left: 6px;
						color: #555555;
						border-radius: 5px;
						background-color: #efefef;
						border-color:#ffffff;
					}
				}
				.active{
					a{
						color: #ffffff;
						background-color: #31b546;
						border-color:#ffffff;
					}
				}
			}
		}
		.dataAmount{
			display: inline-block;
			vertical-align: top;
			.dropdown-menu{
				min-width: 0;
				width: 60px;
				right: 0;
				.btn{
					background: red;
				}
				li{
					text-align: center;
				}
			}
		}
	}
}