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

.s_phone .c_list {
	> ul > li > .op {
		li.active { background:@bg-dark-0-7;}
	}
	> ul > li > .op-show-phone {
		ul { transform:translateY(0%);}
	}
	.link:not(.checked):not(.on).active {
		background:@bg-dark-0-7;
		.pic { opacity:0.6;}
	}
	> ul > li > .content > .fn,
	> ul > li > .group > .fn,
	> ul > li > .sub > .fn,
	> ul > li > .fn {
		&.active { background:rgba(0,0,0,0.05);}
	}
	> ul > li > label .fn.active { background:transparent;}
	> ul > li > .group > .value,
	> ul > li > .content > .value,
	> ul > li > .sub > .value,
	> ul > li > .value .e_mix {
		.e_select {
			&.active { background:@bg-dark-0-7;}
		}
	}
	&-blue {
		> ul .link:not(.checked):not(.on).active { background:@primary-dark-2;}
	}
	&-red {
		> ul .link:not(.checked):not(.on).active { background:@danger-dark-2;}
	}
	&-green {
		> ul .link:not(.checked):not(.on).active { background:@success-dark-2;}
	}
	&-orange {
		> ul .link:not(.checked):not(.on).active { background:@warning-dark-2;}
	}
	&-gray {
		> ul .link:not(.checked):not(.on).active { background:@bg;}
	}
	> ul > .blue.link.active { background:@primary-dark-2 !important;}
	> ul > .red.link.active { background:@danger-dark-2 !important;}
	> ul > .green.link.active { background:@success-dark-2 !important;}
	> ul > .orange.link.active { background:@warning-dark-2 !important;}
	> ul > .gray.link.active { background:@bg !important;}
	&-space {
		> ul .link:not(.checked):not(.on).active { background:linear-gradient(90deg,rgba(0,0,0,0) 0, rgba(0,0,0,0) 0.43em, @bg-dark-0-7 0.43em, @bg-dark-0-7 100%);}
		> ul > .blue.link.active { background:linear-gradient(90deg,rgba(0,0,0,0) 0, rgba(0,0,0,0) 0.43em, @primary-dark-2 0.43em, @primary-dark-2 100%) !important;}
		> ul > .red.link.active { background:linear-gradient(90deg,rgba(0,0,0,0) 0, rgba(0,0,0,0) 0.43em, @danger-dark-2 0.43em, @danger-dark-2 100%) !important;}
		> ul > .orange.link.active { background:linear-gradient(90deg,rgba(0,0,0,0) 0, rgba(0,0,0,0) 0.43em, @warning-dark-2 0.43em, @warning-dark-2 100%) !important;}
		> ul > .green.link.active { background:linear-gradient(90deg,rgba(0,0,0,0) 0, rgba(0,0,0,0) 0.43em, @success-dark-2 0.43em, @success-dark-2 100%) !important;}
		> ul > .gray.link.active { background:linear-gradient(90deg,rgba(0,0,0,0) 0, rgba(0,0,0,0) 0.43em, @bg 0.43em, @bg 100%) !important;}
	}
	&-blue&-space {
		> ul .link:not(.checked):not(.on).active { background:linear-gradient(90deg,rgba(0,0,0,0) 0, rgba(0,0,0,0) 0.43em, @primary-dark-2 0.43em, @primary-dark-2 100%);}
	}
	&-red&-space {
		> ul .link:not(.checked):not(.on).active { background:linear-gradient(90deg,rgba(0,0,0,0) 0, rgba(0,0,0,0) 0.43em, @danger-dark-2 0.43em, @danger-dark-2 100%);}
	}
	&-orange&-space {
		> ul .link:not(.checked):not(.on).active { background:linear-gradient(90deg,rgba(0,0,0,0) 0, rgba(0,0,0,0) 0.43em, @warning-dark-2 0.43em, @warning-dark-2 100%);}
	}
	&-green&-space {
		> ul .link:not(.checked):not(.on).active { background:linear-gradient(90deg,rgba(0,0,0,0) 0, rgba(0,0,0,0) 0.43em, @success-dark-2 0.43em, @success-dark-2 100%);}
	}
	&-gray&-space {
		> ul .link:not(.checked):not(.on).active { background:linear-gradient(90deg,rgba(0,0,0,0) 0, rgba(0,0,0,0) 0.43em, @bg 0.43em, @bg 100%);}
	}
}