@import "../default-skin.less";
@import "../../global/mixin.less";

.e_checks {
	display:block; overflow:hidden;
	> label {
		height:1+2*@gap; box-sizing:border-box; line-height:1+2*@gap; padding:0 @gap; color:@fg; -webkit-appearance:none; border-radius:0; min-width:0; vertical-align:middle; display:inline-block;
		&:hover { background:@bg-dark-0-7;}
	}
	> label input[type="checkbox"] {
		margin-right:0.5*@gap; vertical-align:top; margin-top:@gap;
	}
}
[class*="e_checks-col-"] {
	> label { margin-right:-0.28*@gap; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
}
[class*="e_checks-col-"].e_checks-line {
	> label {
		border-left:1px solid @fg-light-8-5; border-bottom:1px solid @fg-light-8-5; margin-left:-1px; margin-bottom:-1px; margin-top:1px;
		&:last-child {
			border-right:1px solid @fg-light-8-5;
		}
	}
}
[class*="e_checks-col-"].e_checks-border {
	border:1px solid @fg-light-8-5; display:block; margin-right:1px; margin-top:1px; 
}
.e_checks-col-1 {
	> label { width:100%;}
}
.e_checks-col-2 {
	> label { width:50%;}
	> label.merge-2 { width:100%;}
}
.e_checks-col-3 {
	> label { width:33.33%;}
	> label.merge-2 { width:66.66%;}
	> label.merge-3 { width:100%;}
}
.e_checks-col-4 {
	> label { width:25%;}
	> label.merge-2 { width:50%;}
	> label.merge-3 { width:75%;}
	> label.merge-4 { width:100%;}
}
.e_checks-col-5 {
	> label { width:20%;}
	> label.merge-2 { width:40%;}
	> label.merge-3 { width:60%;}
	> label.merge-4 { width:80%;}
	> label.merge-5 { width:100%;}
}
.e_checks-col-6 {
	> label { width:16.66%;}
	> label.merge-2 { width:33.32%;}
	> label.merge-3 { width:49.98%;}
	> label.merge-4 { width:66.64%;}
	> label.merge-5 { width:83.3%;}
	> label.merge-6 { width:100%;}
}
.e_checks-col-7 {
	> label { width:14.28%;}
	> label.merge-2 { width:28.56%;}
	> label.merge-3 { width:42.84%;}
	> label.merge-4 { width:57.12%;}
	> label.merge-5 { width:71.4%;}
	> label.merge-6 { width:85.68%;}
	> label.merge-6 { width:100%;}
}
.e_checks-col-8 {
	> label { width:12.5%;}
	> label.merge-2 { width:25%;}
	> label.merge-3 { width:37.5%;}
	> label.merge-4 { width:50%;}
	> label.merge-5 { width:62.5%;}
	> label.merge-6 { width:75%;}
	> label.merge-6 { width:87.5%;}
	> label.merge-6 { width:100%;}
}