/**
* import files
*/
@import "../../../../themes/core/helpers.less";
@import "../../../../themes/core/vars.less";
@import "../../../../themes/core/common.less";

/**
* jplist checkbox dropdown control
*/
.jplist-checkbox-dropdown-control-mixin(){

	.jplist-checkbox-dropdown{
		
		.jplist-control-mixin();        	
		.linear-gradient(#fff, #fff, @light-grey4); //bgcolor, from, to		
		
		width: 150px;	
		margin: 10px 10px 0 0;

        .jplist-dd-panel{
            float: left;
            width: 130px;
            height: 30px;
            line-height: 30px;			
            overflow: hidden;
			padding: 0 20px 0 0;
						
			cursor: pointer;
			position: relative;
			
			text-indent: 10px;
			white-space: nowrap;
			text-overflow: ellipsis;
        }
		
		input[type='checkbox']{
			background: transparent;
		}
		
		.jplist-dd-panel:after{
			content: @arrow-down;
			color: #111;
			
			display: inline-block;
			margin: 0 10px;
			
			position: absolute;
			right: 0;
			top: 0;
		}
		
        ul {
			.border-box-mixin();
			border:1px solid @light-grey5;
			border-radius:0 0 3px 3px;
			
            position:relative;
            top:0;
            z-index:1000;
			
            width: 148px;
            display: none;
            overflow: hidden;
			
			background: #fff;			
            
            list-style: none;           
            margin:0;
            padding:0;
			
			box-shadow: 0 3px 6px @grey2;

            li{
                width: 90%;
				padding: 0 5%;
                float: left;
				height: 30px;
				line-height: 30px;
				text-indent: 10px;
				cursor: pointer;
            }

            li:hover {
                background-color:@light-grey3;
            }
        }
	}

	.jplist-checkbox-dropdown:hover{
		.jplist-dd-panel{
			color: @blue;
		}
		
		.jplist-dd-panel:after{
			color: @blue;
		}
	}
}

/**
* mixin calls
*/
.jplist-checkbox-dropdown-control-mixin();