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

// 标题组件
.c_title {
	position:relative; z-index:1; line-height:(1+2*@gap)*1.1667; padding-left:@gap; overflow:hidden;
	&:after { content:"."; display:block; height:0; clear:both; overflow:hidden;}
	.text {
		float:left; color:@primary; padding-right:@gap; font-weight:bold; font-size:116.67%;
		[class*="e_ico-pic"] { vertical-align:middle;}
	}
	.tip { float:left; color:@fg-light-1; padding:0 @gap;}
	.tip-right { float:right;}
	.sort {
		float:right;
		li { float:left; padding:0 1*@gap; position:relative; cursor:pointer; color:@fg-light-1;}
		li:not(:first-child):before { content:""; display:block; height:1em; width:1px; background:@bg-dark-2; position:absolute; left:0; top:1.1667*@gap;}
	}
	.fn {
		float:right;
		ul { float:left; line-height:1+2.57*@gap;}
		li {
			float:left; font-size:1em; color:@fg-light-1; padding:0 @gap; cursor:pointer;
			> button { float:left; background:none; border:0 none; color:@fg; margin:0 -@gap; line-height:1.1667*(1+2*@gap); height:1.1667*(1+2*@gap);}
			> .e_select { float:left; margin:0 -@gap; line-height:1.1667*(1+2*@gap); height:1.1667*(1+2*@gap); border:0 none; background:none;}
			> .e_select:after { margin-top:-1.1667*(1+2*@gap)/0.75; line-height:1.1667*(1+2*@gap)/0.75; height:1.1667*(1+2*@gap)/0.75;}
			[class*="e_ico"] { margin-right:0.5*@gap;}
			.e_ico-fold,
			.e_ico-unfold { color:@fg-light-7;}
			span + .e_ico-fold,
			span + .e_ico-unfold { margin:0 0 0 1/0.75*@gap; font-size:75%;}
			> label {
				float:left; padding:0 @gap; margin:0 -@gap;
				input[type="checkbox"] { vertical-align:top; margin-top:((1+2*@gap)/0.8571-1)/2; margin-right:0.5*@gap;}
			}
		}
		> .e_mix,
		> .e_group,
		> button,
		> .e_select,
		> input[type="date"],
		> input[type="datetime"],
		> input[type="datetime-local"],
		> input[type="email"],
		> input[type="month"],
		> input[type="week"],
		> input[type="number"],
		> input[type="tel"],
		> input[type="time"],
		> input[type="url"],
		> input[type="text"],
		> input[type="password"],
		> .e_segment { float:left; margin-top:(1+2*@gap)*0.1667/2; margin-right:(1+2*@gap)*0.1667/2; line-height:(1+2*@gap);}
		> .label { float:left; line-height:1+1.86*@gap; margin-top:0.355*@gap;}
		> label {
			float:left; padding:0 @gap; margin-right:(1+2*@gap)*0.1667/2;
			input[type="checkbox"] { vertical-align:top; margin-top:((1+2*@gap)/0.8571-1)/2; margin-right:0.5*@gap;}
		}
		.e_space { float:left;}
	}
}



// 级别
.c_title-level-2 {
	.text { color:@fg-light-2; font-size:100%;}
}
.c_title-level-3 {
	.text { color:@fg-light-5; font-size:100%;}
}



// 边框
.c_title-border { border-left:1px solid @fg-light-8; border-right:1px solid @fg-light-8;}



// 无内边距（左）
.c_title-nopadding { padding-left:0;}



// 色彩
.c_title-green {
	background:@success;
	.text { color:#fff;}
	.fn {
		li { color:#fff;}
	}
}
.c_title-gray {
	background:@bg-dark-0-2;
	.text { color:@fg-light-1;}
	.fn {
		li { color:@fg-light-1;}
	}
}