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

// 区块组件
.c_box {
	background:@bg; position:relative; .x_bs;
	> .more {
		text-align:right; line-height:2em; color:@fg-light-4; cursor:pointer;
		&:before { font-family:"ico"; content:"\e05a"; text-align:left; margin-right:0.5em;}
	}
}



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



// 圆角
.c_box-r { border-radius:0.5em;}



// 全屏高度
.c_box-full { height:100%;}



// 色彩
.c_box-gray       { background:@bg-dark-0-3;}
.c_box-gray-light { background:@bg-dark-0-1;}
.c_box-red        { background:@danger;}
.c_box-orange     { background:@warning;}
.c_box-blue       { background:@primary;}
.c_box-navy       { background:@secondary;}
.c_box-green      { background:@success;}



// 渐变
.c_box {
	&-gd           { background:linear-gradient(to right, @primary, @success);}
	&-gd-green     { background:linear-gradient(to right, @success, saturate(@success-light-3, 30%));}
	&-gd-red       { background:linear-gradient(to right, @danger, saturate(@danger-light-3, 30%));}
	&-gd-blue      { background:linear-gradient(to right, @primary, saturate(@primary-light-3, 30%));}
	&-gd-orange    { background:linear-gradient(to right, @warning, saturate(@warning-light-3, 30%));}
	&-gd-navy      { background:linear-gradient(to right, @secondary, saturate(@secondary-light-3, 30%));}

	&-gd-greenBlue { background:linear-gradient(to right, @success, @primary);}
	&-gd-redOrange { background:linear-gradient(to right, @danger, @warning);}
	&-gd-blueRed   { background:linear-gradient(to right, @primary, @danger);}
	&-gd-redBlue   { background:linear-gradient(to right, @danger, @primary);}
	&-gd-orangeRed { background:linear-gradient(to right, @warning, @danger);}
}


// 色彩与渐变色彩内部元素默认效果改变
[class*="c_box-gd"],
.c_box-red,
.c_box-orange,
.c_box-blue,
.c_box-navy,
.c_box-green {
	color:@bg;
	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_mix > [class^="e_ico"],
	.e_mix .e_button,
	.e_mix button,
	.e_group,
	.e_button,
	.e_select,
	button { border:0 none;}
	.e_group {
		button,
		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_select,
		.e_label { margin-top:0; border:0 none;}
	}
	.more { color:@bg;}
}