//
// Product Filter Box Styles
// --------------------------------------------------

.block-product-filters .listbox {
	background-color: @var_ProductFilterBackgroundColor !important;
	.small();
}

.product-filter-block .listbox {
	background-color: @var_ProductFilterBackgroundColor !important;
	.small();
	padding: 0 !important;
	position: relative;
	min-height: 32px;
	
	.spinner {
		position: absolute;
		left: 50%;
		top: 50%;
		margin-left: -8px;
		margin-top: -8px;
	}
}
.product-filter-block .filter-product-form {
	display: none;
}
.product-filter-block .filter-group {
	position: relative;
	clear: both;
	border-bottom: 1px dotted darken(@grayLighter, 10%);
	.transition(background-color .1s ease-in);
	
	&:last-child { 
		border-bottom: none;
	}
	&:hover {
        background-color: lighten(greyscale(@var_ProductFilterBackgroundColor), 10%); 
	}
	.chevron-icon {
		display: inline-block;
		text-decoration: none;
		text-align: center;
		font-size: 12px;
		width: 10px;
		float: left;
		&:before {
			font-family: FontAwesome;
			font-weight: normal;
			font-style: normal;
			display: inline-block;
			text-decoration: none;
			content: '\f054'; /* fa-chevron-right */
		}
	}
	&.expanded .chevron-icon:before {
		content: '\f078'; /* fa-chevron-down */
	}
}

.product-filter-block .name {
	cursor: pointer;
	font-weight: bold;
	padding: 6px 6px;
	.transition(color .1s ease-in);
	span { 
        padding-left: 2px 
	}
    i { 
        min-width: 13px; 
        text-align: left; 
    }
	&:hover { 
        color: @black 
	}
}
.product-filter-block .filter-group.static .name {
	cursor: default;
}
.product-filter-block .data {
	padding: 2px 10px 10px 10px;
	display: none;
}
.product-filter-block .filter-group.expanded .data {
	display: block;
}
.product-filter-block .data .note {
	font-style: italic;
}
.product-filter-block .data .count {
	.smaller();
	color: @grayLight;
}
.product-filter-block .data > div {
	line-height: normal;
}
.product-filter-block .data .filter-item {
    clear: both;
    padding-left: 14px;
}
.product-filter-block .data .filter-item a {
	&.inactive:hover { text-decoration: underline; }
}
.product-filter-block .data .filter-item a.active {
	color: #bbb;
	text-shadow: 0 1px 0 #fff;
	&:hover { color: @red }
}
.product-filter-block .data .filter-item .applied-filter {
	.smaller();
	font-weight: bold;	
}
.product-filter-block .data a.inactive {
	color: @linkColor;
	&:hover { color: @linkColorHover }
}
.product-filter-block .data a.active {
	float: right;
}
.product-filter-block .data .foot {
	margin-top: 4px;
	padding-left: 14px;
	text-shadow: 0 1px 0 #fff;
	a { 
		color: #888;
		&:hover { color: #333 } 
	}
}
.product-filter-block .no-filter {
	font-style: italic;
	padding: 6px 0 0 10px;
}

#product-filter-modal .modal-body {
	max-height: 304px;
}
#product-filter-modal .multi-select-container {
	display: inline-block;
	margin: 0 0 8px 0;
}
#product-filter-modal .checkbox-container {
	float: left;
	margin-right: 14px;
	padding: 0 0 1px 0;
}
#product-filter-modal .checkbox-container .highlight {
	font-weight: bold;
}
#product-filter-modal .remove-checkmarks,
#product-filter-modal .checkbox-container input {
	float: left;
}
#product-filter-modal .checkbox-container label {
	float: left;
	display: inline;
	margin: 0 0 0 4px;
	width: 220px;
	max-width: 220px;
}