.admin-bar {
	.unero-modal {
		top: 32px;
	}
}

body.modal-open {
	overflow: hidden;
	.site-header {
		z-index: 99;
		position: relative;
		background-color: @light;
	}

	&.header-transparent {
		.site-header {
			position: absolute;
		}
	}

	&.sticky-header {
		.site-header {
			position: fixed;
		}
	}

	&.single-product {
		.site-header {
			background-color: @light;
		}
	}

}

.unero-modal {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	display: none;
	overflow: auto;
	backface-visibility: hidden;
	visibility: visible;
	outline: none;
	background: #fff;
	z-index: -1;

	.modal-title {
		font-weight: 400;
		margin: 0;
		line-height: 1;
		font-size: 24px;
		text-align: center;
		margin-bottom: 100px;
	}

	.modal-content {
		transition: opacity 0.5s;
		transition-delay: 0.5s;
		box-shadow: none;
		border: 0;
		opacity: 0;
		padding-top: 90px;
		border-radius: 0;

	}

	.modal-footer {
		position: absolute;
		bottom: 100px;
		left: 50%;
		z-index: 99;
		transform: translateX(-50%);

		.close-modal {
			font-size: 18px;
			color: @dark;
		}
	}

	.close-modal {
		line-height: 1;
	}

	&.open {
		visibility: visible;
		z-index: 90;

		.modal-header {
			opacity: 1;
		}

		.modal-content {
			opacity: 1;
		}

		&.quick-view-modal {
			z-index: 999;
		}
	}
}

.header-layout-3,
.header-layout-4 {
	.unero-modal.open {
		z-index: 999;
		padding-top: 40px;
		padding-bottom: 40px;
	}

	.login-modal .modal-content {
		padding-top: 0;
	}
}

.search-modal {
	.modal-content {
		transition: none;
		transform: translateY(-40%);
		position: absolute;
		top: 35%;
		width: 100%;
		padding-top: 0;
	}

	.modal-footer {
		transform: translateY(30px);
		transition: all 0.5s ease 0.5s;
		opacity: 0;
		transition-delay: 0.9s;
	}

	.modal-title {
		transform: translateY(30px);
		transition: all 0.5s ease 0.5s;
		opacity: 0;
		transition-delay: 0.3s;
	}

	.search-results {
		transform: translateY(30px);
		transition: all 0.5s ease 0.5s;
		opacity: 0;
		transition-delay: 0.9s;
	}

	.instance-search {
		max-width: 970px;
		margin: 0 auto;
	}

	.product-cats {
		transition: all 0.5s ease 0.5s;
		transform: translateY(30px);
		text-align: center;
		margin-bottom: 55px;
		opacity: 0;
		transition-delay: 0.5s;

		label {
			font-weight: 400;
			padding: 0 20px;
			cursor: pointer;
			font-size: 18px;
			color: #999;

			&:first-child {
				padding-left: 0;
			}

			&:last-child {
				padding-right: 0;
			}

			span {
				transition: 0.3s;

				&:hover {
					color: @primary-color;
				}
			}
		}

		input {
			display: none;
		}

		input:checked + span {

			color: @primary-color;
		}
	}

	.search-fields {
		transition: transform 0.5s ease 0.6s, opacity 0.5s ease 0.6s, border 0.5s;
		transform: translateY(30px);
		position: relative;
		padding: 15px;
		border: 1px solid #ccc;
		opacity: 0;
		transition-delay: 0.7s;

		.search-submit {
			color: @dark;
			&:before {
				.icon('\e944');
				font-size: 24px;
			}
		}

		.btn-submit,
		.search-submit {
			position: absolute;
			top: 14px;
			right: 15px;
		}

		.btn-submit {
			opacity: 0;
			width: 30px;
			padding: 0;
			height: 30px;
			z-index: 10;
		}
	}

	.search-field {
		width: 100%;
		border: 0;
		padding: 0;
	}

	.search-results {
		.woocommerce {
			margin: 0 auto;
			max-width: 970px;
		}

		ul {
			margin: 0;
			padding: 0;
			max-height: 400px;
			overflow-y: scroll;
			overflow-x: hidden;
			border-bottom: 1px solid #ccc;

			&::-webkit-scrollbar {
				display: none;
			}

			li {
				width: 100%;
				padding: 15px;
				margin-bottom: 0;
				border: 1px solid #ccc;
				border-top: none;
				list-style: none;

				&:last-child {
					border-bottom: none;
				}

				.search-item {
					display: flex;
					align-items: center;
					white-space: inherit;

					img {
						width: 70px;
						float: left;
						margin-right: 35px;
					}

					.title {
						color: @dark;
						line-height: 1.3;
					}

					&:hover {

						.title {
							color: @primary-color;
						}
					}
				}
			}
		}

		.loading {
			transition: opacity 0.5s;
			opacity: 0;
			display: none;
			margin-top: 30px;
		}

		.not-found {
			margin-top: 40px;
		}

		.woocommerce,
		.buttons {
			display: none;
			transition: opacity 0.5s;
		}
	}

	&.open {
		.product-cats,
		.search-fields,
		.modal-title,
		.modal-footer,
		.search-results {
			transform: translateY(0);
			opacity: 1;
		}
	}

	&.searching {
		.loading {
			opacity: 1;
			display: block;
		}
	}

	&.searched {
		&.searching {
			.woocommerce,
			.buttons {
				opacity: 0;
				visibility: hidden;
			}
		}

		&.found-no-product {
			.buttons {
				opacity: 0;
				visibility: hidden;
			}
		}
	}

	&.invalid-length {
		.woocommerce,
		.buttons {
			opacity: 0;
			visibility: hidden;
		}
	}
}

.login-modal {
	.modal-content {
		padding-top: 200px;
		min-height: 80%;
	}

	.customer-login {
		transform: translateY(30px);
		transition: all 0.5s ease 0.5s;
		opacity: 0;
		transition-delay: 0.3s;

	}

	.modal-footer {
		transform: translateY(30px);
		transition: all 0.5s ease 0.5s;
		opacity: 0;
		transition-delay: 0.5s;
		position: static;
		text-align: center;
		margin-top: 20px;

	}


	&.open {
		.tabs-nav,
		.customer-login,
		.modal-footer {
			transform: translateY(0);
			opacity: 1;
		}

	}
}

.quick-view-modal {
	background: rgba(35, 35, 44, .5);

	.unero-loader {
		display: none;
		position: absolute;
		top: 50%;
		left: 50%;
		right: 0;
		bottom: 0;
		z-index: 99;
		transform: translate(-50%, -50%);
	}

	&.loading .unero-loader {
		display: block;
	}

	.modal-header {
		display: none;
	}

	.modal-content {
		transition: transform 0.5s;
		transform: translateY(-50%);
		position: absolute;
		top: 50%;
		width: 100%;
		padding-top: 0;
		background-color: transparent;

		div.product .unero-single-product-detail {
			margin: 0;
			padding: 0;
			background-color: transparent;
		}

		.product {
			transition: 0.7s;
			background: #fff;
			overflow: hidden;

			.unero-product-image-icon {
				display: none;
			}

			.woo-short-description {
				margin-bottom: 30px;
			}

			.photoswipe.video {
				&:after,
				&:before {
					display: none;
				}
			}

			div.images {
				.photoswipe {
					cursor: auto;
				}
			}

			&.invisible {
				opacity: 0;
			}

			.close-modal {
				position: absolute;
				right: 20px;
				top: 20px;
				z-index: 1;
				font-size: 30px;
				color: @dark;
			}

			.ribbons {
				top: 10px;
			}

			.product-summary,
			.product-images-wrapper {
				width: 50%;
				float: left;
				margin: 0;
				background-color: @light;
			}

			.woocommerce-product-gallery {
				padding-left: 0;
			}

			.summary {
				padding-left: 70px;
				padding-right: 90px;
				position: relative;
				padding-top: 50px;
				padding-bottom: 40px;
				max-height: 570px;
				overflow: auto;
				margin-bottom: 0;

				&::-webkit-scrollbar {
					display: none;
				}

				.col-product_summary {
					width: 100%;
					margin-left: 0;
				}

				.page-header {
					display: none;
				}
			}

		}
	}
}