/* gobal popup-ajaxsuite style */
.flex(){
    display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;      /* TWEENER - IE 10 */
    display: -webkit-flex;     /* NEW - Chrome */
    display: flex;       
}
& when (@media-common = true) {
	.popup-ajaxsuite{
		max-width: 76rem;
		margin: auto;
	}
	.modals-wrapper{
		.modal-popup._inner-scroll{
			.flex();
			justify-content: center;
			align-items: center;
			transition: all .2s ease-in-out;
		    -webkit-transform: scale(.8);
		    -moz-transform: scale(.8);
		    -ms-transform: scale(.8);
		    -o-transform: scale(.8);
		    transform: scale(.8);
		    &._show{
		    	-webkit-transform: scale(1);
			    -moz-transform: scale(1);
			    -ms-transform: scale(1);
			    -o-transform: scale(1);
			    transform: scale(1);
		    }
			.modal-inner-wrap{
				width: fit-content;
				position: relative;
				box-shadow: none;
				transform: none;
				.lib-css(border-radius, @form-element-input__border-radius);
			    .modal-header{
			    	padding: 0;
			    	.action-close{
			    		box-shadow: none;
			    		z-index: 222;
			    		background: @button__background;
			    		color: @button__color;
			    		padding: 0;
			    		&:before{
			    			color: @button__color;
			    		}
			    	}
			    }
			    .modal-content{
			    	padding-top: 3rem;
			    	.lib-css(border-radius, @form-element-input__border-radius);
			    	#mb-ajaxsuite-popup-wrapper{
			    		text-align: center;
			    		.photo.image {
			    			max-width: 35.5rem;
			    			width: 100%;
			    			height: 100%;
			    		}
			    		.product-name{
			    			margin-top: 1rem;
			    			margin-bottom: 1.5rem;
			    			strong{
			    				.lib-css(color, @product-name-link__color);
			    				display: block;
			    				margin-bottom: 6px;
			    			}
			    			.greycolor{
			    				color: @color-gray60;
			    				font-size: @font-size__base;
			    			}
			    		}
			    		.ajaxsuite-buttons{
			    			button{
			    				display: block;
			    				width: 100%;
			    				padding: 13.5px 2rem;
			    			}
			    		}
			    		.wrapper-success{
			    			.pupup-suc-added-to-your-bag{
			    				position: relative;
							    top: -30px;
							    text-transform: uppercase;
							    font-weight: @heading__font-weight__base;
							    color: @heading__color__base;
							    text-align: left;
							    margin-left: -3rem;
							    margin-right: -30px;
							    border-bottom: 1px solid @border-color__base;
							    padding: 1.3rem 0 1.3rem 1.8rem;
			    			}
			    			.product-information{
			    				margin-bottom: 3rem;
			    				.flex();
			    				flex-wrap: nowrap;
			    				.product-infor{
			    					.flex();
			    					flex-wrap: nowrap;
			    					flex-direction: column;
			    					justify-content: space-between;
			    				}
			    				.product-name{
			    					margin: 0;
			    					text-align: left;
			    					.pupup-suc-added-to-your-bag{
			    						font-weight: @heading__color__base;
			    						margin-bottom: 1rem;
			    						font-size: 1.8rem;
			    						color: @heading__color__base;
			    					}
			    					.pupup-suc-added-ajax-cart-qty-price{
			    						.flex();
			    						flex-direction: column;
			    						flex-wrap: wrap;
			    						margin-top: 0.7rem;
			    						.lib-font-size(16);
										color: @heading__color__base;
			    						.pupup-suc-added-ajax-cart-qty{
			    							margin-top: 0.8rem;
			    							.lib-font-size(14);
			    						}
			    					}
			    				}
			    				.price{
									/* font-family: @heading__font-family__base;
									color: @heading__color__base; */
									font-weight: @heading__font-weight__base;
			    				}
			    			}
			    		}
			    	}
			    	.block-authentication{
			    		.lib-css(border-radius, @form-element-input__border-radius);
						.block-title{
							text-align: center;
							font-weight: @heading__font-weight__base;
							.lib-font-size(24);
							margin-bottom: 1.7rem;
							strong{
								color: @heading__color__base;
								font-weight: @heading__font-weight__base;
							}
						}
						.block-customer-login{
							justify-content: center;
						}
					}
					.form-login{
						.fieldset{
							margin-bottom: 0;
							label{
								text-transform: uppercase;
								.lib-font-size(12);
								color: #999999;
								display: inline-block;
								margin-bottom: 4px;
							}
							input{
								height: 45px;
							}
						}
						.password {
							.action{
								display: block;
								text-align: right;
								margin-top: 0.5rem;
								color: @color-gray60;
							}
						}
			    		.actions-toolbar{
			    			> .primary{
			    				float: none;
    							display: block;
    							margin-bottom: 1.7rem;
    							button{
    								.lib-css(border-radius, @form-element-input__border-radius);
    								padding-top: 13.5px;
    								padding-bottom: 13.5px;
    							}
			    			}
			    			.action-register,
			    			.action-login{
								display: block;
								width: 100%;
								text-align: center;
								float: none;
							}
							.action-register{
								padding: 0; 
								font-size: @font-size__base;
								text-transform: capitalize;
								margin-top: 1.5rem;
							}
			    		}
			    	}
			    }
			}
		}
	}
	.action{
		&.tocart,
		&.towishlist,
		&.tocompare,
		&.link-quickview{
			&.loading,
			&.disabled{
				&:before{
					content: "" !important;
					border: 1px solid;
				    color: transparent;
				    width: 14px;
				    height: 14px;
				    border-top-color: currentcolor;
				    border-right-color: currentcolor;
				    border-bottom-color: currentcolor;
				    border-left-color: currentcolor;
				    border-radius: 50px;
				    border-color: #5f5f5f #797979 #ccc #fff;
				    line-height: 1;
				    @animation: spin .2s infinite linear;
				    .lib-css(animation, @animation, @_prefix: 1);
				    display: inline-block;
				}
			}
		}
	}
	@keyframes wave{
	  0%{
	    transform: rotate(0deg);
	  }
	  100%{
	    transform: rotate(360deg);
	  }
	}
}
/* Ipad and lager srceen */
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) { 
   	.modals-wrapper{
		.modal-popup._inner-scroll{
			.modal-inner-wrap{
				min-width: 300px; 
				.modal-content{
					.block-authentication{
						border: 0;
						margin: -3rem -3rem -2.6rem;
						min-height: 49.1rem;
						.bg-login-popup{
							width: 50%;
							background-size: cover;
						    background-repeat: no-repeat;
						    background-position: center;
						    color: @color-white;
						    .flex();
						    flex-direction: column;
						    align-items: center;
						    justify-content: center;
						    text-align: center;
						    position: relative;
						    padding-bottom: 1rem;
						    .login-content{
						    	padding: 0 3rem;
							    .logo{
						    	    margin: 0 auto;
						    	    margin-bottom: 6%;
									float: none;
							    }
							    .title{
							    	.lib-font-size(30);
							    	margin-bottom: 0.8rem;
							    }
							    .description{
							    	color: #dfdfdf;
							    }
							}
						}
						.block-customer-login{
							padding: 3rem;
						}
					}
			    	#mb-ajaxsuite-popup-wrapper{
			    		 .photo.image{
			    		 	max-width: 27rem;
			    		 }
			    		.pop-up-success{
			    			max-width: 25.5rem;
			    		}
			    		.wrapper-success{
			    			.photo.image{
			    				max-width: 100%;
			    			}
			    			max-width: 50rem;
			    			.product-information{
			    				.photo.image{
			    					max-width: 23.6rem;
			    					margin-right: 3rem;
			    					width: 50%;
			    					height: 100%;
			    				}
			    				.product-name{
			    					margin: 0;
			    					text-align: left;
			    					.product-item-name{
			    						.lib-font-size(18);
			    						padding-top: 11%;
			    					}
			    				}
			    			}
			    			.ajaxsuite-buttons{
				    			display: grid;
							    grid-template-columns: 1fr 1fr;
							    grid-gap: 30px;
			    			}
			    		}
			    		
			    	}
				}
			}
		}
	}
	.action{
		&.tocart{
			&.disabled{
				&:before{
					position: relative;
					top: 2px;
					left: -2px;
				}
			}
		}
	}
	.wave-top{
	    height: 85px;
	    border-radius: 5px;
	    margin: 0;
	    position: absolute;
	    left: 0;
	    right: 0;
	    bottom: 0;
	    overflow: hidden;
	    @transform: rotate(-180deg);
	    .lib-css(transform, @transform, 1);
	}
	.wave{
	    bottom: 36px;
	    left: -80%;
	    width: 1000px;
	    height: 1025px;
	    background-color: @theme__color__primary;
	    opacity:0.6;
	    position: absolute;
	    border-radius: 40%; 
	  }
	.wave.one{
	    animation: wave 15s linear -1s infinite;
	}
	.wave.two{
	    animation: wave 18s linear -1s infinite;
	}
	.wave.three{
	    animation: wave 21s linear -1s infinite;
	}
}
/* Mobile screen */
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) {
	.modals-wrapper{
		.modal-popup._inner-scroll{
			left: 0;
			.modal-inner-wrap{
				background: @color-white;
				max-width: 90%;
				min-height: 1rem;
				.modal-content{
					#mb-ajaxsuite-popup-wrapper{
	    				.photo.image{
	    					display: none;
	    				}
	    				.product-name,
	    				.product-information .product-name{
	    					text-align: center !important;
					       	&:before{
					        	content: "\f00c";
					        	font-family: 'Font Awesome 5 Free';
					        	font-weight: 900;
					        	font-size: 2rem;
								color: @theme__color__primary;
								width: 5rem;
							    height: 5rem;
							    background-color: #d4edda;
							    display: inline-flex;
							    align-items: center;
							    justify-content: center;
							    border-radius: 50%;
							    margin: auto;
							    text-align: center;
							    margin-bottom: 1.5rem;
					        }
					        .product-name{
					        	&:before{
					        		display: none;
					        	}
					        }
	    				}
	    				.pupup-suc-added-ajax-cart-qty-price{
	    					justify-content: center;
	    				}
			    		.ajaxsuite-buttons{
			    			#button_continue_shopping{
			    				display: none;
			    			}
			    		}
			    		.wrapper-success {
			    			.product-information {
			    				.product-name{
			    					text-align: center;
			    				}
			    			}
			    		}
			    	}
			    	.block-authentication{
			    		.bg-login-popup{
			    			display: none;
			    		}
			    	}
				}
			}
		}
	}
}