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

// 筛选组件
.c_filter {
	padding:@gap; position:relative; line-height:1+@gap; background:@bg-dark-0-4; overflow:hidden;
	> ul > li { margin-top:0.25*@gap;}
	> ul > li:first-child { margin-top:0;}
	.label { float:left; vertical-align:top; white-space:nowrap; width:3.1em; text-align:right;}
	.more {
		float:right; margin-left:0.25*@gap;
		> .e_mix { 
			font-size:85.71%; height:(1+@gap)/0.8751;
			input { height:(1+@gap)/0.8751; line-height:(1+@gap)/0.8751;}
			.e_label { height:(1+@gap)/0.8751; line-height:(1+@gap)/0.8751;}
			button { height:(1+@gap)/0.8751; line-height:(1+@gap)/0.8751;}
		}
		> button { height:(1+@gap)/0.8751; font-size:85.71%; line-height:(1+@gap)/0.8751; vertical-align:top;}
	}
	.option {
		overflow:hidden;
		ul { overflow:hidden;}
		li { float:left; padding:0 0.75*@gap; cursor:default;}
		li.on { color:@primary;}
		input[type="checkbox"] { margin-right:0.25*@gap; display:none;}
		label { display:block; height:1+@gap; margin:0 -0.75*@gap; padding:0 0.75*@gap;}
		input[type="text"],
		input[type="date"],
		input[type="datetime"],
		input[type="datetime-local"],
		input[type="month"],
		input[type="week"],
		input[type="number"],
		input[type="tel"],
		input[type="time"] { vertical-align:middle;}
		button { vertical-align:middle;}
	}
	// 多选
	.option-multiple {
		input[type="checkbox"] { display:inline-block; vertical-align:top; margin-top:0.5*@gap;}
	}
	// 折叠
	.option-fold { overflow:hidden; height:1+@gap;}
}



// 边框
.c_filter-border {
	border:1px solid @fg-light-8-5;
}



// 标签文字长度
.c_filter-label-auto .label { width:auto;}
.c_filter-label-2 .label { width:3.1em;}
.c_filter-label-3 .label { width:4.2em;}
.c_filter-label-4 .label { width:5.2em;}
.c_filter-label-5 .label { width:6.2em;}
.c_filter-label-6 .label { width:7.3em;}
.c_filter-label-7 .label { width:8.3em;}
.c_filter-label-8 .label { width:9.3em;}
.c_filter-label-9 .label { width:10.4em;}
.c_filter-label-10 .label { width:11.4em;}
.c_filter-label-11 .label { width:12.4em;}
.c_filter-label-12 .label { width:13.5em;}
.c_filter-label-13 .label { width:14.5em;}
.c_filter-label-14 .label { width:15.5em;}
.c_filter-label-15 .label { width:16.6em;}
.c_filter-label-16 .label { width:17.6em;}
.c_filter-label-17 .label { width:18.6em;}
.c_filter-label-18 .label { width:19.7em;}