/* Single Product Shortcode CSS */
.shortcode-single-product-wrap {
	.product-item-wrap {
		padding: 0;
		margin: 0;
		&:hover{
			.product-item-inner{
				.box-shadow(none);
			}
		}
		// Style 1
		.product-item-inner{
			.product-thumb{
				.product-link{
					z-index: 4;
				}
				.product-hover-sign{
					display: none;
				}
			}
			.product-actions{
				z-index: 4;
			}
		}
		&.product-style_1 {
			.product-item-inner{
				&:before{
					content: '';
					opacity: 0;
					background-color: fade(@black, 50%);
					width: 100%;
					height: 100%;
					position: absolute;
					top: 0;
					left: 0;
					z-index: 2;
					.transition( all 0.6s ease);
				}
				.product-thumb{
					.product-link{
						z-index: 4;	
					}
				}
				.product-info{
					z-index: 3;
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
					background-color: transparent;
					.star-rating{
						right: auto;
						top: auto;
						bottom: 50px;
						left: 50%;
						.translateX(-50%);
					}
					h3{
						position: absolute;
						width: 100%;
						text-align: center;
						bottom: 0;
						top: auto;
						.transition( all 0.35s ease);
						color: lighten(@black, 25%);
						left: 0;
						padding-right: 0;
					}
					span.price{
						opacity: 0;
						right: auto;
						left: 50%;
						position: absolute;
						top: 30px;
						margin: 0;
						.translateX(-50%);
						.transition( all 0.35s ease );
						border-top: 1px solid @white;
						border-bottom: 1px solid @white;
						font-size: 24px;
						color: @white !important;
						line-height: 1;
						ins{
							color: @white !important;
						}
						del{
							display: none;
							font-size: 16px;
							color: fade(@white, 70%) !important;
						}
					}
				}
				.product-actions{
					background-color: transparent;
					border: none;
					top: 50%;
					bottom: auto;
					z-index: 4;
					.transform(translateY(-50%) scale(0));
					.transition( all 0.6s ease 0s);
					.yith-wcwl-wishlistaddedbrowse a,
					.yith-wcwl-wishlistexistsbrowse a,
					.add_to_wishlist,
					.compare,
					.product-quick-view,
					.btn_add_to_cart,
					.add-to-cart-wrap a {
						width: 50px;
						height: 50px;
						line-height: 50px !important;
						text-align: center;
						color: @white;
						background-color: fade(@white, 35%);
						display: inline-block;
						padding: 0;
						position: relative;
						border-radius: 100%;
						font-size: 0;
						min-width: 0;
						vertical-align: middle;
						margin-left: 4px;
						margin-right: 4px;
						opacity: 1;
						.transition( all 0.4s ease);
						i {
							font-size: 16px;
							line-height: 1;
							vertical-align: middle;
						}
						&:hover,
						&.active {
							color: lighten(@black, 25%);
							background-color: @white;
						}
					}
				}
			}
			&:hover{
				.product-item-inner{
					&:before{
						opacity: 1;
						.scale(0.93);
					}
					.product-info{
						span.price{
							opacity: 1;
						}
						h3{
							color: @white;
						}
					}
					.product-actions{
						.transform(translateY(-50%) scale(1));
					}
				}
			}		
		}
		// Home 2
		&.product-style_2 {
			.product-item-inner {
				.product-thumb{
					padding-top: 50px;
					padding-bottom: 25px;
					.product-link{
						&:before{
							opacity: 0;
						}
						&:after{
							opacity: 0;
							content: 'shop now';
							font-weight: bold;
							text-transform: uppercase;
							background-color: @white;
							color: lighten(@black, 35%);
							position: absolute;
							white-space: nowrap;
							top: 50%;
							left: 50%;
							.transform(translate( -50%,-50%) scale3d(1.5,1.5,1.5)) ;
							.transition( all 0.35s ease-in-out );
							padding: 8px 30px;
							z-index: 3;
							.box-shadow(0px 2px 3px 0px rgba(0, 0, 0, 0.15));
						}
						.product-hover-sign{
							display: none;
						}
					}
					a.shop_now{
						opacity: 0;
						font-weight: bold;
						text-transform: uppercase;
						background-color: @white;
						color: lighten(@black, 35%);
						position: absolute;
						white-space: nowrap;
						top: 50%;
						left: 50%;
						.transform(translate( -50%,-50%) scale3d(1.5,1.5,1.5)) ;
						.transition( all 0.35s ease-in-out );
						padding: 8px 30px;
						z-index: 3;
						.box-shadow(0px 2px 3px 0px rgba(0, 0, 0, 0.15));
					}
				}
				.product-content{
					position: relative;
				}
				.product-actions{
					position: relative;
					.translate(0,0);
					width: 20%;
					float: left;
					opacity: 1;
					border: none;
					z-index: 4;
					.add-to-cart-wrap a{
						margin-top: 15px;
						width: 60px;
						height: 60px;
						line-height: 58px !important;
						border: 1px solid @border_color;
						i{
							font-size: 24px;
							color: lighten(@black, 35%);
							&:before{
								content: '\f290';
							}
						}
						&.added-spinner{
							i{
								&:before{
									content: '\f110';
								}
							}
						}
						@media (min-width:768px) and ( max-width: 991px){
							width: 40px;
							height: 40px;
							line-height: 38px !important;
						}
						@media ( max-width: 479px){
							width: 40px;
							height: 40px;
							line-height: 38px !important;
						}
					} 
					&:hover{
						.add-to-cart-wrap a{
							border-color: @primary_color;
							background-color: @primary_color;
						}
					}
				}
				.product-info {
					float: right;
					width: 80%;
					h3{
						font-size: 24px;
						text-transform: uppercase;
						font-weight: 300;
						padding-right: 0;
						margin: 0;
						white-space: nowrap;
						.transition( all 0.35s ease );
						&:hover{
							color: @primary_color;
						}
					}
					.star-rating {
						display: none;
					}
					@media (min-width:768px) and ( max-width: 991px){
						h3{
							font-size: 14px;
						}
						span.price{
							margin-top: 25px;
						}
					}
					@media ( max-width: 479px){
						h3{
							font-size: 16px;
						}
						span.price{
							margin-top: 25px;
						}
					}
				}
				&:hover{
					.product-thumb{
						.product-link{
							&:before{
								//opacity: 1;
							}
						}
						a.shop_now{
							opacity: 1;
							.transform(translate( -50%,-50%) scale3d(1,1,1)) ;
						}
					}
				}
			}
		}

		// Home 3
		&.product-style_3 {
			.product-item-inner{
				&:before{
					content: '';
					opacity: 0;
					background-color: fade(@black, 50%);
					width: 100%;
					height: 100%;
					position: absolute;
					top: 0;
					left: 0;
					z-index: 2;
					.transition( all 0.35s ease);
				}
				.product-thumb{
					.product-link{
						z-index: 4;
					}
					.product-hover-sign{
						display: none;
					}
				}
				.product-info{
					z-index: 3;
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
					background-color: transparent;
					.star-rating{
						opacity: 0;
						right: auto;
						top: auto;
						bottom: 50px;
						left: 100%;
						.transition( all 0.35s ease);
					}
					h3{
						opacity: 0;
						position: absolute;
						text-align: left;
						bottom: 0;
						top: auto;
						padding-left: 20px;
						.transition( all 0.35s ease);
						color: lighten(@black, 25%);
						left: 100%;
						padding-right: 0;
					}
					span.price{
						opacity: 0;
						right: auto;
						left: 100%;
						position: absolute;
						top: 30px;
						margin: 0;
						.transition( all 0.35s ease );
						border-top: 1px solid @white;
						border-bottom: 1px solid @white;
						font-size: 24px;
						color: @white !important;
						line-height: 1;
						ins{
							color: @white !important;
						}
						del{
							font-size: 16px;
							color: fade(@white, 70%) !important;
						}
					}
				}
				.product-actions{
					z-index: 4;
					background-color: transparent;
					border: none;
					top: 50%;
					bottom: auto;
					left: -50%;
					.transform(translateY(-50%));
					.transition( all 0.35s ease-in-out);
					.yith-wcwl-wishlistaddedbrowse a,
					.yith-wcwl-wishlistexistsbrowse a,
					.add_to_wishlist,
					.compare,
					.product-quick-view,
					.btn_add_to_cart,
					.add-to-cart-wrap a {
						width: 50px;
						height: 50px;
						line-height: 50px !important;
						text-align: center;
						color: @white;
						background-color: fade(@black, 35%);
						display: inline-block;
						padding: 0;
						position: relative;
						border-radius: 100%;
						font-size: 0;
						min-width: 0;
						vertical-align: middle;
						margin-right: 4px;
						margin-left: 4px;
						opacity: 1;
						.transition( all 0.35s ease);
						i {
							font-size: 16px;
							line-height: 1;
							vertical-align: middle;
						}
						&:hover,
						&.active {
							color: lighten(@black, 25%);
							background-color: @white;
						}
					}
				}
			}
			&:hover{
				.product-item-inner{
					.product-thumb{
						img{
							.transform(scale3d(1.5,1.5,1.5));
						}
					}
					&:before{
						opacity: 1;
						.scale(1);
					}
					.product-info{
						span.price{
							opacity: 1;
							left: 30px;
						}
						h3{
							opacity: 1;
							color: @white;
							left: 10px;
						}
						.star-rating{
							opacity: 1;
							left: 30px;
						}
					}
					.product-actions{
						left: 0;
						.transform(translateY(-50%));
					}
				}
			}		
		}

		// Home 4
		&.product-style_4 {
			.product-item-inner{
				&:before{
					content: '';
					opacity: 0;
					background-color: fade(@black, 50%);
					width: 100%;
					height: 100%;
					position: absolute;
					top: 0;
					left: 0;
					z-index: 2;
					.scale(0.7);
					.transition( all 0.6s ease-in-out);
				}
				.product-thumb{

				}
				.product-info{
					z-index: 3;
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
					background-color: transparent;
					.star-rating{
						display: none;
					}
					h3{
						opacity: 0;
						width: 100%;
						position: absolute;
						text-align: center;
						bottom: -15%;
						top: auto;
						.transition( all 0.35s ease);
						color: @white;
						margin: 0;
						padding-right: 0;
					}
					span.price{
						opacity: 0;
						right: auto;
						left: 50%;
						.translateX(-50%);
						position: absolute;
						top: -15%;
						margin: 0;
						.transition( all 0.35s ease );
						font-size: 24px;
						color: @white !important;
						line-height: 1;
						ins{
							color: @white !important;
						}
						del{
							font-size: 16px;
							color: fade(@white, 70%) !important;
						}
					}
				}
				.product-actions{
					background-color: transparent;
					border: none;
					top: 50%;
					bottom: auto;
					.transform(translateY(-50%) scale(1.3));
					.transition( all 0.7s ease);
					.yith-wcwl-wishlistaddedbrowse a,
					.yith-wcwl-wishlistexistsbrowse a,
					.add_to_wishlist,
					.compare,
					.product-quick-view,
					.btn_add_to_cart,
					.add-to-cart-wrap a {
						width: 50px;
						height: 50px;
						line-height: 50px !important;
						text-align: center;
						color: @white;
						background-color: fade(@white, 35%);
						display: inline-block;
						padding: 0;
						position: relative;
						border-radius: 100%;
						font-size: 0;
						min-width: 0;
						vertical-align: middle;
						margin-right: 4px;
						margin-left: 4px;
						opacity: 1;
						.transition( all 0.35s ease);
						i {
							font-size: 16px;
							line-height: 1;
							vertical-align: middle;
						}
						&:hover,
						&.active {
							color: lighten(@black, 25%);
							background-color: @white;
						}
					}
				}
			}
			&:hover{
				.product-item-inner{
					.product-thumb{
					}
					&:before{
						opacity: 1;
						.scale(1);
					}
					.product-info{
						span.price{
							opacity: 1;
							top: 15%;
						}
						h3{
							opacity: 1;
							color: @white;
							bottom: 15%;
						}
						.star-rating{
							opacity: 1;
						}
					}
					.product-actions{
						.transform(translateY(-50%) scale(1));
					}
				}
			}		
		}
		// style 5
		&.product-style_5 {
			.product-item-inner{
				.product-thumb{
					img {
						.transition( all 0.8s ease 0s);
					}
					.product-flash-wrap{
						position: absolute;
					    z-index: 2;
					    width: 100%;
					    height: 100%;
					    top: 0;
					    left: 0;
					    span:first-child{
					    	display: none;
					    }
					    span:nth-child(2){
					    	top: 30px;
						    right: 30px;
						    height: 60px;
						    width: 60px;
						    line-height: 60px;
						    text-align: center;
						    border-radius: 100%;
						    .rotate(0deg);
						    padding: 0;
					    }
					}
					.product-link{
						&:before{
							background-color: transparent;
							mix-blend-mode: normal;
						}
					}
				}
				.product-info{
					z-index: 3;
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
					background-color: transparent;
					.star-rating{
						right: auto;
						top: 30px;
						left: 30px;	
					}
					h3{
						position: absolute;
						width: 100%;
						text-align: left;
						padding-left: 30px;
    					bottom: 10px;
						top: auto;
						left: 0;
						.transition( all 0.35s ease);
						color: lighten(@black, 25%);
						padding-right: 0;
						
					}
					span.price{
						right: 30px;
						position: absolute;
						bottom: 30px;
						margin: 0;
						.transition( all 0.35s ease );
						border-top: 1px solid lighten(@black, 25%);
						border-bottom: 1px solid lighten(@black, 25%);
						font-size: 24px;
						color: lighten(@black, 25%)!important;
						line-height: 1;
						ins{
							color: lighten(@black, 25%) !important;
						}
						del{
							display: none;
						}
					}
				}
				.product-actions{
					background-color: transparent;
					border: none;
					top: 50%;
					bottom: auto;
					.transform(translateY(-50%) scale(1.5));
					.transition( all 0.6s ease);
					.yith-wcwl-wishlistaddedbrowse a,
					.yith-wcwl-wishlistexistsbrowse a,
					.add_to_wishlist,
					.compare,
					.product-quick-view,
					.btn_add_to_cart,
					.add-to-cart-wrap a {
						border-radius: 100%;
						width: 50px;
						height: 50px;
						line-height: 50px !important;
						text-align: center;
						color: @white;
						background-color: fade(@black, 60%);
						display: inline-block;
						padding: 0;
						position: relative;
						font-size: 0;
						min-width: 0;
						vertical-align: middle;
						margin-left: 4px;
						margin-right: 4px;
						opacity: 1;
						.transition( all 0.35s ease);
						.box-shadow(1px 1px 5px rgba(0, 0, 0, 0.1));
						i {
							font-size: 16px;
							line-height: 1;
							vertical-align: middle;
						}
						&:hover,
						&.active {
							color: lighten(@black, 25%);
							background-color: @white;
						}
					}
				}
			}
			&:hover{
				.product-item-inner{
					.product-thumb {
						img {
							.transform(scale(1.1));
						}
					}
					.product-actions{
						.transform(translateY(-50%) scale(1));
					}
				}
			}		
		}
		@media (max-width:767px){
			margin: 15px 0;
		}
	}
}