.pxl-checkout-content-wrap{
	input[type="checkbox"]{
		width: 20px;
		height: 20px;
		border: 1px solid $divider_color;
		cursor: pointer;
		vertical-align: top;
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		-webkit-print-color-adjust: exact;
		position: relative;
		text-align: center;
		line-height: 16px;
		margin-right: 10px;
		&:after{
			content: '\f26b';
			font-family: 'Material-Design-Iconic-Font';
			font-size: 18px;
			color: #fff;
			opacity: 0;
		}
		&:checked[type=checkbox] {
			background: $secondary_color;
			&:after{
				opacity: 1;
			}
		}
	}
	input[type="radio"]{
		width: 20px;
		height: 20px;
		border: 1px solid $divider_color;
		cursor: pointer;
		vertical-align: top;
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		-webkit-print-color-adjust: exact;
		position: relative;
		text-align: center;
		line-height: 18px;
		margin-right: 13px;
		&:after{
			content: '\f26b';
			font-family: 'Material-Design-Iconic-Font';
			font-size: 18px;
			color: #fff;
			opacity: 0;
		}
		&:checked[type=radio] {
			background: $secondary_color;
			&:after{
				opacity: 1;
			}
		}
	}
	.content-top-inner{
		padding-right: 70px;
		@media (max-width: $lg_max){
			padding-right: 30px;
		}
		@media (max-width: $md_max){
			padding-right: 0;
		}
		@media (max-width: $xs_max){
			div + div{
				margin-top: 20px;
			}
		}
	}
	.pxl-heading{
		font-size: 20px;
	}
	.customer-details{
		padding-right: 70px;
		@media (max-width: $lg_max){
			padding-right: 30px;
		}
		@media (max-width: $md_max){
			padding-right: 0;
		}
	}
}
.pxl-login-form-checkout{
	display: flex;
	flex-direction: column;
	position: fixed;
	top: 0; 
	left: 0;
	right: 0;
	width: 100%;
	height: 100vh;
	z-index: -1;
	padding: 0;
	background: rgba(0, 0, 0, 0.4);
	will-change: transform;
	-webkit-transition-duration: 500ms;
	transition-duration: 500ms;
	opacity: 0; 
	scrollbar-width: none;
	@include d-flex();
	align-items: center;
	justify-content: center;
	@media (max-width: $sm_max){
		left: 15px;
		right: 15px;
		width: calc(100% - 30px);
	}   
	.pxl-hidden-template-wrap{
		width: calc(100% - 40px);
		max-width: 570px;
		position: relative;
		background: transparent;
		border-radius: 0;
		overflow: hidden;
		max-height: 100vh;
		padding: 35px 50px 65px;
		overflow-y: auto;
		@include transition(all .3s ease);
		@include transform(scale(0.6));
		@media (max-width: $xs-max){
			padding: 25px 20px 35px;
		}
		&::-webkit-scrollbar{
			height: 0;
			width: 0;
			background-color: transparent;
		}

		&::-webkit-scrollbar-track{
			border-radius: 0;
		}

		&::-webkit-scrollbar-thumb{
			border-radius: 0;
			background-color: transparent;
		}

		&:hover::-webkit-scrollbar {
			width: 0;
			height: auto;
			background-color: rgba(255,255,255,0.1);
			border-radius: 0
		}
		&:hover::-webkit-scrollbar-thumb{
			background-color: rgba(48, 48, 48, 0.1);
		}
	} 
	.pxl-panel-header{
		margin-bottom: 68px;
	}
	.pxl-panel-content{
		position: relative;
		flex: 1;

	}
	.pxl-title{
		font-size: 30px;
		color: $heading_color;
	}
	.pxl-close{
		font-size: 18px;
		color: $heading_color;
		&:hover{
			color: $gray;
		}
	}
	&.open{
		height: 100%;
		@include transform(translate(0,0));
		opacity: 1;
		z-index: 99999;
		.pxl-hidden-template-wrap{
			@include transform(scale(1));
			background: #fff;
		}
	}
}
.woocommerce-form-login,.woocommerce-form-register{
	.form-fields + .form-fields{
		margin-top: 30px;
	}
	.input-text{
		font-size: 16px;
		height: 40px;
		@include placeholder(){
			font-size: 16px;
		}
	}
	.password-input{
		position: relative;
		display: block;
	}
	.show-password-input{
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: auto; 
		padding: 0 0 0 10px;
		border: 0;
		font-size: 18px;
		color: $gray;
		display: inline-block;
		line-height: 40px;
		cursor: pointer;
		@include transition(color .3s ease);
		&:before{
			content: "\ec57";	
			//font-family: $lineicons_font;
		}
		&:hover{
			color: $heading_color;
		}
	}
	.form-actions{
		margin-top: 47px;
	}
	.remember-forgot{
		margin-bottom: 42px;
		label{
			font-size: 16px;
			color: $heading_color;
			letter-spacing: 0.015em;
			margin: 0;
		}
		.lost_password{
			a{
				color: #0099cc;
				font-size: 14px;
				&:hover{
					color: $link_color;		
				}
			}
		}
	}
	button[type="submit"]{
		width: 100%;
		padding: 14px 35px 14px 35px
	}
}

.checkout-content-top{
	margin-bottom: 45px;
	.checkout-login-btn-toggle{
		width: 100%;
		padding: 14px 16px 14px 16px;
		text-align: left;
		justify-content: flex-start;
		height: 50px;
		border-color: $divider_color;
		font-size: 14px;
		text-transform: capitalize;
		.pxl-icon{
			font-size: 20px;
			margin-right: 15px;
		}
		&:hover,&:active,&:focus{
			border-color: $primary_color;
		}
	}
	form.woocommerce-form-login{
		display: block !important;
	}
	form.checkout_coupon{
		display: block !important;
		.input-text{
			padding: 0px 90px 0 20px;
			@media (max-width: $xs_screen){
				padding: 0 20px 0 20px;
			}
		}
		.button {
			position: absolute;
			top: 0;
			right: 0;
			height: $input_height;
			background-color: transparent;
			color: $heading_color;
			padding: 0 24px;
			font-size: 14px;
			letter-spacing: 0.05em;
			border: 0;
			&:hover, &:active, &:focus{
				color: $heading_color;
			}
		}
	}
}
.woocommerce-checkout{
	ul.woocommerce-error{
		margin-bottom: 120px;
		list-style: none;
		font-size: 16px;
		padding: 30px 15px 30px 45px;
		&:before{
			top: 26px;
			@include transform(translateY(0));
		}
		strong{
			font-weight: 400;
			color: $heading_color;
		}
	}
}

.woocommerce-checkout .select2-container .select2-dropdown {
	border: 1px solid #999;
	top: 3px;
}
.pxl-checkout-wrap{
	.form-row{
		margin-bottom: 20px;
		&:last-child{
			margin-bottom: 0;
		}
	}
	@media (min-width: $sm_min){
		.form-row-first{
			width: 50%;
			padding-right: 15px;
			display: inline-block;
		}
		.form-row-last{
			width: 50%;
			padding-left: 15px;
			display: inline-block;
		}
	}
}
.woocommerce-billing-fields{
	margin-bottom: 45px;
}
.woocommerce-account-fields{
	margin-bottom: 10px;
	label{
		color: $heading_color;
		font-size: 16px;
		letter-spacing: 0.015em;
	}
}
.woocommerce-shipping-fields{
	margin-bottom: 32px;
	.ship-to-different-address{
		label{
			color: $heading_color;
			font-size: 16px;
			letter-spacing: 0.015em;
		}
	}
}
.woocommerce-additional-fields{
	textarea{
		height: 130px;
	}
}
@media (max-width: $md_max){
	.checkout-col-right{
		margin-top: 80px;
	} 
}  
.checkout-review-wrap{
	margin-top: -95px;
	background-color: #f0f1f4;
	border: 1px solid;
	border-color: $divider_color;
	border-radius: var(--checkout_radius-width);
	position: relative;
	@media (max-width: $md_max){
		margin-top: 0;
	}
	.order-review-heading{
		padding-bottom: 15px;
		margin-bottom: 20px;
		border-bottom: 1px solid $divider_color;
	}
	.checkout-review-inner{
		padding: 30px;
		font-family: $body_font_family;
		@media (max-width: $xs_screen){
			padding: 20px;
		}
		.woocommerce-error, .woocommerce-info, .woocommerce-message {
			background-color: transparent;
			padding: 0 20px 0 50px;
			&:before {
				left: 0;
			}
		}
		.woocommerce-checkout-review-order-table{
			position: static !important;
		}
		.blockUI.blockOverlay {
			position: absolute !important;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			background-color: transparent !important;
			&:before {
				content: "";
				position: absolute;
				top: 0;
				left: 0;
				bottom: 0;
				right: 0;
				background-color: rgba(255, 255, 255, 0.8);
				z-index: 2;
				@include transition(all .3s ease);
			}
			&:after {
				content: "\e95b";
				position: absolute;
				font-family: $pxli_font;
				color: #000;
				@include animation(pxl-spin 2s linear infinite);
				top: 50%;
				left: 50%;
				@include transform(translate(-50%, -50%));
				display: inline-block;
				line-height: 1;
				z-index: 3;
				@include transition(all .3s ease);
			}
		}
	}
	.shop_table{
		padding-bottom: 25px;
	}
	.review-order-list{
		.cart_item + .cart_item{
			margin-top: 25px;
		}
		.product-thumbs{
			img{
				width: 45px;
			}
		}
		.product-name{
			font-family: $body_font_family;
			font-size: 16px;
			line-height: 24px;
			color: $heading_color;
		}
		.variation{
			margin-top: 8px;
			padding-bottom: 4px;
			line-height: 1.3;
			color: $gray;
			span{
				margin: 0;
				padding: 0;
				position: relative;
				display: inline-flex;
				& + span{
					padding-left: 8px;
					&:before{
						content: ",";
						position: absolute;
						left: 0;
					}
				}
			}
		}
		.product-total{
			font-size: 16px;
			line-height: 1.2;
			color: $heading_color;
		}
	}
	.review-order-subtotal-shiping{
		margin-top: 30px;
		padding-top: 20px;
		border-top: 1px solid $divider_color;
		.cart-subtotal {
			margin-bottom: 10px;
		}
		.lbl {
			font-size: 16px;
			color: $body_color;
		}
		.value {
			font-size: 16px;
			color: $heading_color;
		}
		.nice-select span.current {
			font-size: 16px;
		}
	}

	.order-total{
		padding-top: 25px;
		span.lbl{
			font-size: 18px;
			color: $heading_color;
			text-transform: uppercase;
			letter-spacing: 0.05em;
		}
		span.value{
			font-size: 20px;
			font-weight: 600;
			color: $heading_color;
			letter-spacing: 0.015em;
			strong{
				font-weight: 600;
			}
		}
	}
}
.woocommerce-checkout-payment{
	padding-top: 25px;
	border-top: 1px solid $divider_color;
	position: static !important;
	.blockUI.blockOverlay {
		position: relative !important;
		display: none !important;
	}
	ul.payment_methods {
		margin: 0;
		list-style: none outside;
		li {
			margin: 0;
			&+li{
				margin-top: 15px;
			}
			label{
				font-size: 16px;
				letter-spacing: 0.015em;
				color: $heading_color;
			}
			.payment_box{
				font-family: $body_font_family;
				font-size: 14px;
				line-height: 24px;
				color: $body_color;
				letter-spacing: 0.015em;
				padding-left: 40px;
			}
			input {
				margin: 0 19px 0 0;
				float: left;
			}
			img {
				vertical-align: middle;
				padding: 0;
				position: relative;
				max-width: 150px;
			}
			img + img {
				margin-left: 2px;
			}
		}
	}
	.woocommerce-terms-and-conditions-wrapper{
		font-family: $body_font_family;
		margin-top: 20px;
		font-size: 14px;
		line-height: 24px;
		letter-spacing: 0.015em;
		margin-top: 30px;
		padding-top: 25px;
		border-top: 1px solid $divider_color;
		a{
			text-decoration: underline;
			text-underline-offset: 3px;
		}
	}
	button[type="submit"]{
		width: 100%;
		margin-top: 35px;
		background-color: $primary_color;
		border: 1px solid $primary_color;
		border-radius: var(--checkout_button_radius-width);
		font-weight: 500;
		height: $input_height;
		&:hover {
			background-color: $secondary_color;
		}
	}
}