/************************************************************************************************
    WIDGET WOO SEARCH
*************************************************************************************************/
.woocommerce.widget_product_search{
    .screen-reader-text{ display: none; }
    .woocommerce-product-search{ 
        border: 1px solid $border-color; padding: 15px 10px; position: relative; 
        .search-field{ background: transparent; border: none; }
        .btn-search{ 
            border: none;
            &:before{
                font-family: FontAwesome;
                content: "\f002";
            }
        }
    }
}
/************************************************************************************************
    WIDGET WOO CATEGORIES
*************************************************************************************************/
.widget{
    // widget products
    &.widget-products{
        .tabs-container{
            overflow: hidden;
        }
        .carousel-control{
            @include rtl-left(auto);
            &.prev{
                @include rtl-right(20px);
            }
            &.next{
                @include rtl-right(0px);
            }
        }
    }
    // widget layered nav
    &.widget_layered_nav{
        @include lists-style();
        font-size: $layered-nav-font-size;
        .count{
            @include rtl-float-right();
        }
    }
    // Related
    &.widget-related-products{
         
    }
    .widget-products-carousel{
        position: relative; 
    }
}

/*------------------------------------*\
    Widget Price Filter
\*------------------------------------*/
.widget_price_filter {
	.price_slider {
		@include rtl-margin(0, 0, 30px ,0);
	}
	.price_slider_amount {
		line-height: 2.4em;
	}
	.ui-slider {
		position: relative;
		@include rtl-text-align-left();
	}
	.ui-slider .ui-slider-handle {
		z-index: 2;
		position:absolute;
        outline:none;
        top: -3px;
		@include size(10px,10px);
		@include border-radius(20px);
		cursor: pointer;
		@include gradient-vertical($start-color: darken($theme-color, 5%), $end-color: lighten($theme-color, 10%), $start-percent: 0%, $end-percent: 100%);
	}
	.ui-slider .ui-slider-range {
		position:absolute;
		z-index: 1;
        @include font-size(font-size,$font-size-base);
		display:block;
		border: 0;
		@include box-shadow(0,0,0,1px,rgba($black,0.5));
		@include border-radius(1em);
	}
	.price_slider_wrapper .ui-widget-content {
		@include border-radius(1em);
		background: darken($border-color, 10%);
	}
	.ui-slider-horizontal {
		height: 5px;
	}
	.ui-slider-horizontal .ui-slider-range {
		top: 0;
		height: 100%;
		background: $border-color;
	}
	.ui-slider-horizontal .ui-slider-range-min {
		@include rtl-left(-1px);
	}
	.ui-slider-horizontal .ui-slider-range-max {
		@include rtl-right(-1px);
	}
}

/*------------------------------------*\
    Product List Widget
\*------------------------------------*/
.product_list_widget{
    padding: 0;
	margin:0 !important;
    .widget-product{
        margin: $widget-product-list-margin;
        padding: $widget-product-list-padding;
        border-bottom: 1px solid $border-color;
        &:first-child{
            padding-top: 0;
        }
        &:last-child{
            border: 0;
            padding-bottom: 0;
        }
        .review{
            @include rtl-clear-left();
        }
        .price{
            del{
                color: $widget-product-list-price-old-color;
            }    
        }
        .image{
            display: block;
            @include rtl-margin-right(15px);
            @include square($widget-product-list-size);
            border: 1px solid $border-color;
        }
        .rating{
            margin-bottom: $theme-margin - 15;
        }
        .star-rating{
            margin: 0;
        }
        .name{
            @include font-size(font-size, $widget-product-list-font-size);
            font-weight: $widget-product-list-font-weight;
            margin-top: 0;
            text-transform: $widget-product-list-text-transform;
        }
    }
}

/*------------------------------------*\
    Product Special Widget
\*------------------------------------*/
.product_special_widget{
    .widget-product{
        margin: $widget-product-special-margin;
        position: relative;   
        border-bottom: 1px solid $white;
        &:first-child{
            padding: 0;
            .image{ 
                max-width: 60%;
                position: relative;
                margin: 0;
                @include rtl-margin-right(10px);
                .first-order{
                    @include size(32px, 32px);
                    position: absolute;  
                    bottom: 0; 
                    left: 0;
                    background: $theme-color;
                    padding: 5px 11px;
                    z-index: 99;
                    color: $white;
                    font-weight: 900; 
                } 
            }
            .media-body{
                max-width: 40%;
                float: none;
                padding: 0;
            }
        }
        .media-body{ 
             padding: $widget-product-special-padding;
        } 
        .order{
            width: 32px;
            background: #DADADA;
            position: absolute;
            top: 0;
            left: 0;
            height: 100%;
            color: #6A6A6A;
            font-weight: 900;
            padding:0 10px;
            span{
                position: relative;
                top: 50%;
                margin-top: -10px;
                display: block;
            }
        }
        .review{
            @include rtl-clear-left();
        }
        .rating{
            margin-bottom: $theme-margin - 5;
        }
        .star-rating{
            margin: 0;
        }
        .name{
            @include font-size(font-size, $widget-product-special-font-size);
            font-weight: 400;
        }
        .price{
            @include rtl-text-align-left();
            > * {
                color: $black;
            }
        }
        &.last{
            background: #F5F5F5;
        }
    }
}

/*
    Widget Sidebar
*------------------------------------------------------------------------
*/
.#{$app-prefix}-sidebar{
    .product_list_widget{
        .image{
            @include rtl-margin-right(10px);
            @include size($block-sidebar-widget-product-list-size, auto);
        }
    }
}

// best deals
.widget_deals_products{
    overflow: hidden;
    .widget-title{
        margin: 0;
    }
}

.woo-deals{
    .caption{
        border: 1px solid $border-color;
        border-top: none;
        padding: 5px 20px 20px!important;
    }
    .carousel-inner{
        overflow:visible;
    }
    .product-block {
        margin: 0;
        border:none;
        .price > *{
            color: $black;
        }
        .name{
            margin: 0;
            min-height: 0;
            font-weight: 400;
        }
    }
    .description{
        margin-bottom: $theme-padding/2;
        font-size: 13px;
    }
    .pts-countdown{
        padding: $deals-times-padding;
        font-family: $deals-times-font-family;
        font-size: $deals-times-font-size;
    }
    .deals-information{
        padding-bottom: 15px;
        border-bottom: 1px solid $border-color;
        > *{
            padding-top: 15px;
        }
    }
    .rating > *{
        float: left;
    }
    .countdown-times{
        overflow: hidden;
        @include translate(0px, 0px);
        @include  transition(all 0.4s ease);
        > div{
            float: left;
            text-align: center;
            margin-right: 5%;
            width: 20%;
            > b{
                display: block;
                font-size: 14px;
                font-weight: 900;
                color: $theme-color;
            } 
            &:last-child{
                padding-right: 0;
                float: right;
            }
        }
    }
    .cart{
        left: 0;
        position: absolute;
        right: 0;
        @include opacity(0);
        @include translate(0px, 60px);
        @include  transition(all 0.4s ease);
        visibility: hidden;
        .add_to_cart_button{
            &.added{
                display: none;
            }
            color: #000000;
            background: #fff;
            font-weight: 900;
            &:hover,&:active,&:focus{
                color: #fff;
                background: $theme-color;
            }
        }
        .wc-forward{
            margin: 0 auto;
        }
    }
    &:hover{
        .cart{
            @include translate(0px, 30px);
            visibility: visible;
            @include opacity(1);
        }
    }
}

.widget.product-bottom{
    display: table;
    height: auto;
    width: 100%;
    border: 1px solid $border-color;
    padding: 10px;
}

.vertical-menu{
    .product-block{
        .name a{
            font-size: $product-name-font-size!important;
            line-height: $product-name-line-height!important;
            color:  $product-name-color!important;
            font-weight: $product-name-font-weight!important;
            text-transform: none!important;
            &:hover{
                color: $theme-color;
            }
        } 
    }
}

.widget.product-bottom{
    background: $white;
}

/* ***********************************************************************************************
    WIDGET POLICY  
*************************************************************************************************/
.policy-detail{
    .banner-policy{
        text-transform: uppercase;
        .policy{
            width: 100%;
            padding: 20px 20px 25px;
            background: #252525;
            color: #fff;
            margin-bottom: 10px;
            .fa{
                color: #fff;
                font-size: 25px;
                text-align: center;
                display: inline-block;
                @include rtl-float-left();
                @include rtl-margin-left(10px);
            }
            .banner-cont{
                @include rtl-margin-left(65px);
                h2{font-size: 14px; margin-top: 0; font-weight: bold; color: #fff; margin: 4px 0 0;}
            }
        }
    }
}

/* ***********************************************************************************************
    BANNER DETAIL  
*************************************************************************************************/

.contents-detail{
    .banner-wrapper{margin-top: 30px;}
    .productListBanner{ margin: 0; }
}
/*
    Product Sidebar
*------------------------------------
*/
.bwp-woocommerce-filter-product{
	width:100%;
}
.sidebar-product{
	@media (max-width:$screen-sm-max){
		max-width: 330px;
		display:block !important;
		position:fixed;
		top:0;
		left:0;
		background:$white;
		height:100%;
		z-index:99999;
		overflow:auto;
		padding:30px 20px 0px !important;
		@include transition(all 0.3s ease);
		@include transform(translateX(-330px));
		@include opacity-h();
		margin:0;
		@include box-shadow( 0px 1px 12px 2px rgba(144, 144, 144, 0.3));
		@media (max-width:$screen-xs-max){
			width:260px;
			@include transform(translateX(-260px));
			padding:30px 15px 0 !important;
		}
		.button-filter-toggle{
			color: $gray-dark;
			font-size: 10px;
			text-transform: uppercase;
			font-weight:700;
			font-weight: 500;
			text-align: right;
			cursor: pointer;
			position: relative;
			margin-bottom:20px;
			padding:0;
			&:after{
				content: "\f136";
				font-family: Material;
				font-size: 14px;
				display: inline-block;
				position: relative;
				top: 1px;
				@include rtl-margin-left(5px);
			}
		}
		&.active{
			&.bwp-sidebar{
				@include opacity-s();
				max-width: 330px;
				@include transform(translateX(0));
			}
		}
	}
	>.widget.bwp_woo_categories_widget{
		border:1px solid #e5e5e5;
		border-top: 0;
		font-size:14px;
		font-weight:600;
		margin-bottom:30px;
		background:$white;
		.widget-title{
			padding:15px 30px;
			margin:0;
		}
		ul.product-categories{
			margin:0;
			overflow:hidden;
			li{
				&.current-category{
					> a{
						color: $theme-color !important;
						span{
							color:$theme-color;
						}
					}
				}
				&.cat-parent{
					position: relative;
					> span.arrow{
						top: 0;
						position: absolute;
						@include rtl-right(0);
						text-align: center;  
						&:hover{
							cursor: pointer;
						}     
						&:after{
							content: "\4c";
							font-family: eleganticons;
							padding: 0 3px;  
							font-size: 20px;
							color: #bababa;
							font-weight: 400;
							display:inline-block;
							@include transition(all 0.3s ease);
						}
					}
					&.open{
						> span.arrow{
							&:after{
								content: "\4b";                              
							}
						}
					}
				}
				&.back-shop,&.current-parent{
					a{
						color:$gray-dark !important;
						position:relative;
						&:hover{
							color:$theme-color !important;
							span{
								color:$theme-color;
							}
						}
						&:before{
							content:"\f104";
							font-family: FontAwesome;
							display:inline-block;
							font-size:20px;
							@include rtl-margin-right(10px);
							position:relative;
							top:2px;
							line-height:1;
						}
						span{
							color:$gray-dark;
						}
					}
				}
				span{
					color:#a4a4a4;
				}
				ul.children{
					display: none;
					margin-top:7px !important;
					position:relative;
					padding:0 !important;
					padding-top:8px !important;
					&:before{
						content:"";
						position:absolute;
						top:0;
						width:500px;
						left:calc(50% - 250px);
						background:$border-color;
						height:1px;
					}
					li{
						padding:1.5px 0!important;
						a{
							color:#969696 !important;
							&:before{
								content:"\f0da";
								display:inline-block;
								font-family:FontAwesome;
								@include rtl-margin-right(5px);
							}
							span{
								color:#a4a4a4;
							}
							&:hover{
								color:$theme-color !important;
								span{
									color:$theme-color;
								}
							}
						}
						span{
							color:#a4a4a4;
						}
						ul.children{
							@include rtl-padding-left(20px !important);
						}
					}
				}
				a{
					color: $text-color;
					&:hover{
						color: $theme-color;
					}
				}
			}
			>li{
				padding: 9px 30px !important;
				border-bottom: 1px solid #e5e5e5;
				&.open{
					> a{
						color: $gray-dark !important;
					}
					span{
						color: $gray-dark;
					}
				}
				&:last-child{
					border-bottom:0;
				}
				&.cat-parent{
					position: relative;
					> span.arrow{
						top: 3px;
						@include rtl-right(20px);
					}
				}
			}
			&.sub-categories{
				li.cat-item {
					padding:1.5px 20px!important;
					border:0;
					a{
						color:#868686 !important;
						&:before{
							content:"\f0da";
							display:inline-block;
							font-family:FontAwesome;
							@include rtl-margin-right(5px);
						}
						&:hover{
							color:$theme-color !important;
							span{
								color:$theme-color;
							}
						}
					}
					&:last-child{
						padding-bottom:7px !important;
					}
				}
				li.current-category{
					margin-bottom:7px;
				}
			}
		}
	}
	.button-filter-toggle{
		color:$gray-dark;
		font-size:10px;
		text-transform:uppercase;
		font-weight:500;
		@include rtl-text-align-right();
		cursor:pointer;
		position:relative;
		font-weight:700;
		&:after{
			content: "\f136";
			font-family: Material;
			font-size:14px;
			display:inline-block;
			position:relative;
			top:1px;
			@include rtl-margin-left(5px);
		}
		&:hover{
			color:$theme-color;
		}
		@media (max-width:$screen-xs-max){
			margin-bottom:30px;
			padding:0;
		}
	}
}
/*
    Tags Widget
*------------------------------------
*/
.widget_product_tag_cloud{
    .tagcloud a{
        color: $light-gray;
		border: 1px solid rgba($text-color,0.25);
		overflow:hidden;
		background:transparent;
		padding: 10px 20px;
		text-transform: capitalize;
		position:relative;
		&:before{
			content:"";
			position:absolute;
			@include size(0px,100%);
			@include rtl-right(0);
			bottom:0;
			background:#efefef;
			@include transition(all 0.3s ease);
			z-index:-1;
		}
		&:hover{
			background:transparent;
			&:before{
				@include square(100%);
				background:$theme-color;
			}
		}
    }
}
.tagcloud{
	a{
        position: relative;
        z-index: 1;
        font-size: $widget-tag-font-size;
        color: $widget-tag-color;
        margin: $widget-tag-margin;
	    padding: $widget-tag-padding;
        background: $widget-tag-bg;
        text-transform: $widget-tag-transform;
        border: $widget-tag-border;
        @include inline-block();
        position: relative;
        font-weight: 400;
        z-index: 0;
		line-height:18px;
        &:hover{
            border-color: $theme-color;
			background:$theme-color;
            color: $widget-tag-color-hover;
        }
	}
}
/*
    Widget Filter Product
*------------------------------------
*/
.bwp_ajax_filte{
    display: -webkit-box;
    .bwp-block-title h2{
        font-size: 18px;
        margin-bottom: 20px;
    }
}
.bwp-filter-ajax{
    label{
        margin-bottom: 0;
    }
    #bwp_form_filter_product{
        float: none;
		>div{
			border:1px solid #e5e5e5;
			background:$white;
			border-top: 0;
		}
        ul{
            padding: 0;
			li{
				@include rtl-margin-left(0);
				&:before{
					display:none;
				}
			}
        }
        h3{
            color: $block-sidebar-heading-color;
            padding: 15px 30px;
            background: $block-sidebar-heading-hightlight-bg;
            font-weight: $block-sidebar-heading-font-weight;
            font-size: $block-sidebar-heading-font-size;
            margin: 0;
            position: relative;
			text-transform: uppercase;
			@include rtl-border-left(3px solid $theme-color);
        }
        .bwp-filter-price{
			.content-filter-price{
				padding:30px 30px 20px;
			}
            #bwp_slider_price{
                margin: 0;
                background: #f5f5f5;
                border: 0;
                height: 2px;
                width: calc(100% - 14px);
                @include border-radius(0);
                @include rtl-margin-left(7px);
                &:after, &:before{
                    display: none;
                }
                .ui-slider-handle{
                    @include square(10px);
					background:$theme-color;
					border-color: $theme-color;
                    top: -5px;  
                    @include rtl-margin-left(-5px);
                }
                .ui-slider-range{
                    top: -1px;
                    height: 2px;
                    position: absolute;
                    background: $gray-dark;
                    border-color: $gray-dark;
                }
            }
            .price-input{
                margin-top: 20px;
				color: $text-color;
				font-weight:500;
				>span:not(.input-text){
					color:$text-color;
					font-weight:400;
				}
            }
        }
        .bwp-filter{
			.content_filter{
				padding:30px;
			}
            ul{
                li.filter_color{
					position:relative;
					line-height:30px;
					display: flex;
					align-items: center;
					font-size:14px;
					padding: 0 5px;
					border: 1px solid #e5e5e5;
					@include border-radius(50px);
					@include rtl-margin-right(5px);
					margin-bottom: 15px;
					@media (max-width:$screen-md-max){
						@include rtl-margin-right(10px);
					}
                    &.white{
						>span{
							border:1px solid #cfcfcf;
							&:before{
								color:$gray-dark;
							}
						}
                    }
                    label{
                    	@include rtl-margin-left(10px);
                    	cursor: pointer;
                    }
                    mark{
                    	background: transparent;
                    	color: $text-color;
                    }
                    >span{
						@include square(20px !important);
                        overflow: visible;
                        border: none !important;
                        position: relative;
                        @include transition(transform 0.1s ease);
						@include border-radius(50%);
						padding:0 !important;
						margin: 0 !important;
						min-width:unset;
						text-indent: unset;
						cursor:pointer;
						&:before{
							content: "\4e";
							position:absolute;
							font-family: eleganticons;
							color:$white;
							font-size: 10px;
							left: 5px;
							top: -5px;
							@include opacity-h();
						}
                    }
					&:hover,&.active{
						mark{
							color: $theme-color;
						}
						color: $theme-color;
						>span{
							&:before{
								@include opacity-s();
							}
						}
					}
                }
				li.filter_orther{
					cursor:pointer;
					display:block;
					float:unset;
					div{
						mark{
							background:transparent;
							color:#a4a4a4;
						}
						label{
							cursor:pointer;
						}
						span{
							content:"";
							display:inline-block;
							@include square(14px);
							border:1px solid #d2d2d2;
							position:relative;
							@include rtl-margin(0 ,10px ,0 ,0);
							top:3px;
							&:before{
								content:"";
								@include square(8px);
								position:absolute;
								background:$theme-color;
								left:calc(50% - 4px);
								top:calc(50% - 4px);
								@include opacity-h();
							}
						}
						&.active{
							color:$theme-color;
							span{
								border-color:$theme-color;
								&:before{
									@include opacity-s();
								}
							}
						}
						&:hover{
							color:$theme-color;
						}
					}
				}
				li.filter_image{
					display:block;
					width:100%;
					div{
						cursor:pointer;
						display:flex;
						align-items:center;
						span{
							content:"";
							display:inline-block;
							@include square(40px);
							border:1px solid #d2d2d2;
							@include border-radius(50%);
							position:relative;
							@include rtl-margin(0 ,10px ,0 ,0);
							background-size: contain;
							background-position: center;
							background-repeat: no-repeat;
						}
						&.active{
							color:$theme-color;
							span{
								border-color:$theme-color;
								&:before{
									@include opacity-s();
								}
							}
						}
						&:hover{
							color:$theme-color;
						}
					}
				}
            }
        }
		.bwp-filter-brand{
			ul.filter_brand_product{
				padding: 30px;
				display:flex;
				flex-wrap:wrap;
				li{
					padding:0 5px !important;
					margin:0 0 10px;
					width:50%;
					@media (min-width:$screen-xs-max) and (max-width:$screen-md){
						width:33.33%;
					}
					> span{
						@include square(100% !important);
						padding:5px !important;
						margin:0 !important;
						box-sizing: inherit !important;
						min-height: 65px;
						display:flex !important;
						align-items:center;
						justify-content:center;
						cursor: pointer;
						img{
							display:block !important;
						}
						&:after{
							display:none;
						}
					}
					label{
						display:none !important;
					}
				}
				@media(max-width: $screen-md-max){
					padding: 5px;
				}
			}
		}
		.bwp-filter-rating{
			ul{
				li{
					cursor:pointer;
					display:block;
					float:unset;
					.star-rating{
						top:2px;
						font-size:13px;
						width:90px;
						@include rtl-margin-right(5px);
						span{
							@include square(auto);
							border:0;
							margin:0;
							text-indent:0;
							font-size:0;
							&:before{
								font-size:13px;
							}
						}
					}
					div{
						@include square(auto);
						border:0;
						margin:0;
						overflow: unset;
						text-indent: unset;
						white-space: unset;
						position:relative;
						cursor:pointer;
						mark{
							background:transparent;
							color:#a4a4a4;
							padding:0;
						}
						label{
							cursor:pointer;
						}
						>span{
							content:"";
							display:inline-block;
							@include square(14px);
							border:1px solid #d2d2d2;
							position:relative;
							@include rtl-margin(0 ,10px ,0 ,0);
							top:3px;
							&:before{
								content:"";
								@include square(8px);
								position:absolute;
								background:$theme-color;
								left:calc(50% - 4px);
								top:calc(50% - 4px);
								@include opacity-h();
							}
						}
						&.active{
							color:$theme-color;
							>span{
								border-color:$theme-color;
								&:before{
									@include opacity-s();
								}
							}
						}
						&:hover{
							>span{
								border-color:$theme-color;
							}
						}
					}
				}
			}
		}
        >div{
            margin-bottom: 50px;
			float:unset;
			margin-bottom:30px;
            ul{
                display: inline-block;
                vertical-align: top;
                width: 100%;
				max-height:300px;
				overflow:auto;
				&::-webkit-scrollbar-track
				{
					background-color: #F5F5F5;
				}

				&::-webkit-scrollbar
				{
					width: 3px;
					background-color: #F5F5F5;
				}

				&::-webkit-scrollbar-thumb
				{
					background-color: rgba($gray-dark, 0.1);
				}
                li{
					border:none;
                    padding: 5px 0;
                }
            }
            &:last-child{
                &:last-child{
                    margin-bottom: 0;
                }
            }
        }
    }
    .filter_clear_all{
        background: $theme-color;
        color: $white;
        text-transform: uppercase;
        padding:10px;
        font-size: 12px;
        border: none;
		letter-spacing:3.2px;
        margin-top: 25px;
        margin-bottom: 0;
        font-weight: 500;
		cursor:pointer;
		&:hover{
			background:darken($theme-color,10%);
		}
    }
}
.bwp-filter-attribute{
	border:1px solid #e5e5e5;
	margin-bottom:30px;
	h3{
		color: $block-sidebar-heading-color;
		padding: 12px 20px;
		background: $block-sidebar-heading-hightlight-bg;
		font-weight: $block-sidebar-heading-font-weight;
		font-size: $block-sidebar-heading-font-size;
		margin: 0;
		position: relative;
		text-transform: uppercase;
		border-bottom:1px solid $gray-light;
		font-family:$font-family-second;
	}
	.filter-attribute{
		padding:20px;
		span{
			color:$theme-color;
			cursor:pointer;
			@include rtl-margin-right(10px);
			&:before{
				content: "\4d";
				font-family: ElegantIcons;
				display:inline-block;
				@include square(12px);
				border:1px solid $theme-color;
				@include border-radius(50%);
				line-height:10px;
				text-align:center;
				font-size:10px;
				@include rtl-margin-right(5px);
			}
			&:hover{
				&:before{
					background:$gray-dark;
					color:$white;
					border-color:$gray-dark;
				}
			}
		}
		.filter_clear_all{
			color:$theme-color;
			background:transparent;
			border:0;
			border-bottom:1px solid $theme-color;
			padding:0;
			line-height:16px;
			color:$theme-color;
			cursor:pointer;
			&:hover{
				color:$gray-dark;
				border-color:$gray-dark;
			}
		}
	}
}