.CWPF_Widget{
	border: 0 !important;
	padding: 0 !important;
	margin-bottom: 20px !important;
}
.cwpf_edit_view{
	display: none;
}
.cwpf_container.cwpf_price_filter {
	.widget_price_filter{
		.price_slider {
			background-color: #ccc;
			height: 3px;
			margin-left: 0;
			margin-right: 0;
			.ui-slider-range{
				background-color: #83b735;
			}
			.ui-slider-handle{
				background-color: #83b735;
				width: 4px;
				height: 16px;
				border-radius: 0;
				margin: 0;
				top: -6px;
			}
		}
	}
}
.cwpf_redraw_zone{
	.cwpf_container{
		margin-bottom: 20px;
		padding-bottom: 20px;
		border-bottom: 1px solid #ebebeb;
		&:last-child{
			border-bottom: none;
		}
		.cwpf_container_inner{
			h4{
				display: flex;
				align-items: center;
				justify-content: space-between;
				.cwpf_front_toggle{
					font-size: 0;
					&.cwpf_front_toggle_opened:before{
						content: "\c035";
						font-family: 'cwpf-fonts' !important;
						font-size: 16px;
					}
					&.cwpf_front_toggle_closed:before{
						content: "\c025";
						font-family: 'cwpf-fonts' !important;
						font-size: 16px;
					}
				}
			}
			.cwpf_block_html_items{
				overflow-x: hidden;
				&.cwpf_closed_block{
					display: none;
				}
				&.cwpf_section_scrolled{
					&::-webkit-scrollbar-track
					{
						-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
						background-color: #F5F5F5;
					}

					&::-webkit-scrollbar
					{
						width: 3px;
						height: 3px;
						background-color: #F5F5F5;
					}

					&::-webkit-scrollbar-thumb
					{
						background-color: #F90;	
						background-image: -webkit-linear-gradient(45deg,
							rgba(255, 255, 255, .2) 25%,
							transparent 25%,
							transparent 50%,
							rgba(255, 255, 255, .2) 50%,
							rgba(255, 255, 255, .2) 75%,
							transparent 75%,
							transparent)
					}
				}
				.cwpf_list{
					margin: 0;
					li{
						list-style-type: none;
						position: relative;
						padding: 6px 0;
						p{
							margin: 0;
						}
						.child-title{
							display: flex;
							align-items: center;
							input{
								margin: 3px;
							}
							label{
								margin-left: 2px;
								cursor: pointer;
							}
						}
						.cwpf_radio_term_reset{
							font-size: 10px;
							margin: 0 10px;
							width: 20px;
							height: 20px;
							display: flex;
							align-items: center;
							justify-content: center;
							border: 1px solid #ebebeb;
							color: red;
							border-radius: 50%;
						}
						.cwpf_childs_list_opener {
							position: absolute;
							top: 10px;
							right: 0;
							z-index: 1;
							.cwpf_is_opened{
								margin-right: 10px;
								display: block;
								&:after{
									content: "\c152";
									font-family: 'cwpf-fonts' !important;
									font-size: 12px;
									display: block;
									transform: rotate(-90deg);
								}
							}
							.cwpf_is_closed{
								margin-right: 10px;
								display: block;
								&:after{
									content: "\c152";
									font-family: 'cwpf-fonts' !important;
									font-size: 12px;
									display: block;
									transform: rotate(90deg);
								}
							}
						}
						.cwpf_radio_label{
							display: flex;
							align-items: center;
							.cwpf_radio_count{
								font-size: 12px;
								padding: 3px;
								min-width: 30px;
								height: 20px;
								border: 1px solid #ebebeb;
								border-radius: 10px;
								display: flex;
								align-items: center;
								justify-content: center;
								margin-left: 15px;
							}
						}
						.cwpf_checkbox_label{
							display: flex;
							align-items: center;
							.cwpf_checkbox_count{
								font-size: 12px;
								padding: 3px;
								min-width: 30px;
								height: 20px;
								border: 1px solid #ebebeb;
								border-radius: 10px;
								display: flex;
								align-items: center;
								justify-content: center;
								margin-left: 15px;
							}
						}
						&:hover{
							.child-title{
								label{
									color: #000;
								}
							}
						}

						//Tooltip
						.cwpf_tooltip{
							display: flex;
							align-items: center;
							justify-content: center;
							position: relative;
							&[data-tooltip] {
								position: relative;
								z-index: 2;
								cursor: pointer;
							}

							/* Hide the tooltip content by default */
							&[data-tooltip]:before,
							&[data-tooltip]:after {
								visibility: hidden;
								opacity: 0;
								pointer-events: none;
							}

							/* Position tooltip above the element */
							&[data-tooltip]:before {
								position: absolute;
								top: -36px;
								left: 50%;
								z-index: 1;
								transform: translateX(-50%);
								padding: 4px 8px;
								display: flex;
								align-items: center;
								justify-content: center;
								border-radius: 3px;
								background-color: #000;
								background-color: hsla(0, 0%, 20%, 0.9);
								color: #fff;
								white-space: nowrap;
								content: attr(data-tooltip);
								text-align: center;
								font-size: 12px;
							}

							/* Triangle hack to make tooltip look like a speech bubble */
							&[data-tooltip]:after {
								position: absolute;
								top: -10px;
								left: 50%;
								z-index: 1;
								transform: translateX(-50%);
								width: 0;
								border-top: 5px solid #000;
								border-top: 5px solid hsla(0, 0%, 20%, 0.9);
								border-right: 5px solid transparent;
								border-left: 5px solid transparent;
								content: " ";
								font-size: 0;
								line-height: 0;
							}

							/* Show tooltip content on hover */
							&[data-tooltip]:hover:before,
							&[data-tooltip]:hover:after {
								visibility: visible;
								opacity: 1;
							}
						}
					}
					&.cwpf_list_color ,
					&.cwpf_list_image{
						margin-top: 20px;
					}
				}
			}
		}
	}
	.cwpf_submit_search_form_container{
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin: 15px 0;
		.cwpf_submit_search_form{
			background: #ccc;
			color: #fff;
			padding: 10px 40px;
			font-size: 14px;
			font-weight: bold;
			order: 2;
			&:hover{
				background: #000;
				color: #fff;
			}
		}
		.cwpf_reset_search_form{
			background: none;
			color: #282828;
			font-size: 1rem;
			text-transform: capitalize;
			margin: 0;
			border-bottom: 1px solid #585858;
			padding: 0;
			&:hover{
				color: #000;
				background: none;
			}
		}

		.cwpf_submit_search_form{
			background: #333;
			order: 1;
		}
	}
}

.cwpf_sid_auto_shortcode{
	.cwpf_redraw_zone .cwpf_redraw_zone_inner{
		display: flex;
		align-items: center;
		flex-wrap: wrap;
		justify-content: space-between;
		border-top: 1px solid #ebebeb;
		border-bottom: 1px solid #ebebeb;
		.cwpf_container {
			border-bottom: none;
			padding-bottom: 0;
			margin-bottom: 0;
			.cwpf_container_inner{
				position: relative;
				cursor: pointer;
				h4{
					margin: 0;
					font-size: 16px;
					color: #333;
					padding: 10px 15px;
					border: 1px solid transparent;
					position: relative;
					background: #fff;
					&:after{
						content: "\c152";
						font-family: 'cwpf-fonts' !important;
						font-size: 12px;
						display: block;
						transform: rotate(90deg);
						margin-left: 5px;
					}
				}
				form,
				.irs.irs-with-grid,
				.cwpf_block_html_items{
					opacity: 0;
					visibility: hidden;
					position: absolute;
					top: calc(100% - 1px);
					left: 0;
					z-index: 8;
					min-width: 350px;
					transition: all 350ms;
					background: #fff;
					padding: 10px;
					border: 1px solid transparent;
				}
				form{
					padding-top: 30px;
				}
				&:hover{
					h4{
						border-color: #333;
					}
				}
				&.active{
					h4{
						border-top-color: #333;
						border-left-color: #333;
						border-right-color: #333;
						border-bottom: none;
						z-index: 9;
						&:after{
							transform: rotate(-90deg);
						}
					}
					form,
					.irs.irs-with-grid,
					.cwpf_block_html_items{
						opacity: 1;
						visibility: visible;
						border-color: #333;
					}
					&:hover{
						h4{
							border-top-color: #333;
							border-left-color: #333;
							border-right-color: #333;
							border-bottom: none;
						}
					}
				}
			}
		}
		.cwpf_submit_search_form_container{
			margin-bottom: 30px;
			width: 100%;
			padding-top: 20px;
		}
	}
}
@media(max-width: 767px){
	.cwpf_sid_auto_shortcode{
		.cwpf_redraw_zone{
			position: relative;
			.cwpf_redraw_zone_inner{
				.cwpf_container {
					.cwpf_container_inner{
						position: unset;
						form,
						.irs.irs-with-grid,
						.cwpf_block_html_items{
							top: 100%;
							min-width: 100%;
						}

						&.active{
							h4{
							    border: 1px solid #333;
							}
							form,
							.irs.irs-with-grid,
							.cwpf_block_html_items{
								opacity: 1;
								visibility: visible;
								border-color: #333;
							}
							&:hover{
								h4{
									border: 1px solid #333;
								}
							}
						}
					}
				}
			}
			
		}
	}
}
.cwpf_shortcode_output{
	clear: both;
}
.cwpf_products_top_panel {
	ul {
		display: flex;
		align-items: center;
		margin-left: 0;
		li {
			list-style-type: none;
			margin: 5px 10px;
			span.cwpf_remove_ppi:before{
				content: "\c213";
				font-family: 'cwpf-fonts' !important;
				font-size: 12px;
				margin-right: 5px;
				color: red;
			}
			&.cwpf-reset-button{
				.cwpf_reset_search_form{
					background: none;
					color: #282828;
					font-size: 1rem;
					text-transform: capitalize;
					margin: 0;
					border-bottom: 1px solid #585858;
					padding: 0;
					&:hover{
						color: #000;
						background: none;
					}
				}
			}
		}
	}
}

/* RTL CUSTOM */
.rtl{
	.cwpf_redraw_zone .cwpf_container .cwpf_container_inner .cwpf_block_html_items .cwpf_list li .cwpf_radio_label .cwpf_radio_count {
		margin-left: 0;
		margin-right: 15px;
	}
	.cwpf_redraw_zone .cwpf_container .cwpf_container_inner .cwpf_block_html_items .cwpf_list li .cwpf_checkbox_label .cwpf_checkbox_count {
		margin-left: 0;
		margin-right: 15px;
	}
	.cwpf_redraw_zone .cwpf_container .cwpf_container_inner .cwpf_block_html_items .cwpf_list li .cwpf_childs_list_opener {
		right: auto;
		left: 0;
	}
	.cwpf_price_search_container .price_slider_amount .price_label {
		text-align: right !important;
	}
}