#main {
	background: #E4EAEE;
}
#outlet-heading-wrap {
	background: #F9FAFB;
	padding-top: 16px;
	padding-bottom: 30px;
	.outlet-heading-column {
		max-width: 100%;
		width: 1320px;
		margin-left: auto;
		margin-right: auto;
		@media(max-width: 1440px) {
			max-width: calc(100% - 60px) !important;
			width: calc(100% - 60px) !important;
			padding-left: 30px;
			padding-right: 30px;
		}
		@media(max-width: 767px) {
			max-width: calc(100% - 40px) !important;
			width: calc(100% - 40px) !important;
			padding-left: 20px !important;
			padding-right: 20px !important;
		}
		.ot-breadcrumbs-block {
			margin-bottom: 30px;
			span {
				font-size: 14px;
				line-height: 22px;
				a {
					text-decoration: underline;
					&:hover {
						color: #932F65;
					}
				}
				&.ot-separation {
					
				}
			}
		}
		h1 {
			font-size: 36px;
			line-height: 48px;
			margin-bottom: 0px;
			@media(max-width: 900px) {
				font-size: 30px;
				line-height: 40px;
			}
		}
	}
}
#outlet-main-wrap {
	padding-top: 32px;
	display: flex;
	max-width: 100%;
	width: 1320px;
	margin-left: auto;
	margin-right: auto;
	@media(max-width: 1440px) {
		max-width: calc(100% - 60px) !important;
		width: calc(100% - 60px) !important;
		padding-left: 30px;
		padding-right: 30px;
	}
	@media(max-width: 767px) {
		max-width: calc(100% - 40px) !important;
		width: calc(100% - 40px) !important;
		padding-left: 20px !important;
		padding-right: 20px !important;
	}
	#ot-filter-column {
		width: 100%;
		max-width: 260px;
		padding-right: 32px;
		.ot-mobile-buttons-wrapper {
			bottom: 0px;
			background: #fff;
			width: calc(100% - 40px);
			left: 0px;
			padding: 0px 20px;
			.ot-mobile-buttons {
				padding: 20px 0px;
				border-top: 1px solid #D9D9D9;
				display: flex;
				gap: 20px;
				.ot-cancel-mobile-filters {
					padding: 10px 20px;
					outline-offset: -1px;
					outline: 1px solid #100C08;
					width: 50%;
				}
				.ot-apply-mobile-filters {
					padding: 10px 20px;
					outline: 1px solid #100C08;
					outline-offset: -1px;
					background: #100C08;
					color: #fff;
					width: 50%;
				}
				div {
					text-align: center;
					height: 28px;
					cursor: pointer;
					border-radius: 5px;
					display: flex;
					align-items: center;
					align-content: center;
					justify-content: center;
				}
			}
		}
		.ot-filter-group {
			margin-bottom: 16px;
			background: #fff;
			border-radius: 10px;
			padding: 22px;
			padding-bottom: 22px;
			.ot-filter-label {
				display: flex;
				align-items: center;
				align-content: center;
				gap: 10px;
				h4 {
					font-family: Montserrat-Medium;
					font-weight: 500;
					font-size: 18px;
					color: #101828;
					line-height: 24px;
					margin-bottom: 0px;
				}
				.tooltip {
					position: relative;
					cursor: pointer;
					display: flex;
					.tooltip-text {
						width: 232px;
						visibility: hidden;
						background: #000;
						color: #fff;
						padding: 12px;
						position: absolute;
						border-radius: 5px;
						bottom: 30px;
						left: calc(50% + 3px);
						transform: translate(-50%, 0%);
						font-size: 14px;
						@media(max-width: 600px) {
							width: 120px;
						}
						a {
							color: #fff;
							font-size: 14px;
							text-decoration: underline;
							margin-top: 10px;
							display: block;
						}
						&::after {
							content: '';
							position: absolute;
							top: 100%;
							left: 50%;
							margin-left: -8px;
							border-width: 5px;
							border-style: solid;
							border-color: black transparent transparent transparent;
						}
					}
					&:hover .tooltip-text {
						visibility: visible;
					}
				}
			}
			.ot-filter-options {
				position: relative;
				padding-top: 16px;
				display: flex;
				flex-direction: column;
				.ot-filter-option {
					margin-bottom: 12px;
					display: flex;
					justify-content: space-between;
					align-items: center;
					gap: 8px;
					.ot-count {
						color: #99A1AF;
						font-size: 12px;
					}
					&.unavailable {
						pointer-events: none;
						opacity: 0.3;
					}
				}
				&.ot-color-filter {
					.ot-filter-option {
						flex-direction: column;
						align-items: flex-start;
					}
					.ot-filter-sub-label {
						display: flex;
						justify-content: space-between;
						cursor: pointer;
						width: 100%;
						h5 {
							margin-bottom: 0px;
							font-size: 14px;
							color: #364153;
						}
					}
					.dp-toggle {
						display: flex;
						align-items: center;
						svg {
							transform: rotate(0deg);
							transition: transform 0.3s ease;
						}
						&.active {
							svg {
								transform: rotate(180deg);
								transition: transform 0.3s ease;
							}
						}
					}
					.ot-color-filter-column {
						display: none;
						gap: 8px;
						flex-wrap: wrap;
						.ot-color-item {
							display: flex;
							flex-direction: column;
							align-items: center;
							gap: 4px;
							cursor: pointer;
							width: calc(33.333% - 8px);
							&.unavailable {
								opacity: 0.3;
								pointer-events: none;
							}
							&:hover {
								.ot-color-img img {
									outline: 2px solid #000;
									outline-offset: -2px;
								}
							}
							.ot-color-img {
								border-radius: 5px;
								position: relative;
								img {
									border-radius: 5px;
									aspect-ratio: 1;
									width: 100%;
									height: 100%;
									object-fit: cover;
								}
							}
							.ot-color-title {
								font-size: 10px;
								font-family: Montserrat-Medium;
								font-weight: 500;
							}
							&.ot-color-selected {
								.ot-color-img {
									&:after {
										content:'';
										background-image: url('/wp-content/themes/Betono-mozaika/images/ot-white-arrow.svg');
										width: 24px;
										height: 17px;
										background-size: cover;
										position: absolute;
										top: 50%;
										left: 50%;
										transform: translate(-50%, -50%);
									}
								}
							}
						}
						&.open {
							display: flex;
						}
					}
				}
				.ot-filter-option:last-child {
					margin-bottom: 0px;
				}
				label {
					font-size: 14px;
					line-height: 18px;
					font-family: Montserrat-Medium;
					font-weight: 500;
					color: #364153;
					padding-left: 28px;
					cursor: pointer;
					display: flex;
					position: relative;
					&::before {
						content: "";
						position: absolute;
						left: 0;
						top: 50%;
						width: 16px;
						height: 16px;
						outline: 1px solid #364153;
						border-radius: 2px;
						background: #fff;
						transition: all 0.2s ease;
						transform: translate(0px, -50%);
					}
				}
				& input[type="checkbox"] {
					display: none;
				}
				& input[type="checkbox"]:checked + label::before {
					outline: 1px solid #000;
				}
				& input[type="checkbox"]:checked + label::after {
					content: "";
					width: 16px;
					height: 16px;
					background-repeat: no-repeat;
					background-image: url(/wp-content/themes/Betono-mozaika/images/dp-image/check.svg);
					position: absolute;
					left: 0px;
					top: 50%;
					font-size: 14px;
					color: #000;
					background-size: 15px;
					background-position: center;
					transform: translate(0px, -50%);
				}
				.ot-filter-parent {
					display: flex;
					align-items: center;
					justify-content: space-between;
					.dp-toggle {
						cursor: pointer;
					}
				}
				.ot-sub-filter-options {
					margin-left: 32px;
				}
			}
		}
	}
	#ot-product-column {
		width: calc(100% - 292px);
		@media(max-width: 900px) {
			width: 100%;
		}
		.ot-notification-block {
			display: flex;
			gap: 12px;
			margin-bottom: 16px;
			svg {
				min-width: 36px;
				min-height: 36px;
				@media(max-width: 900px) {
					display: none;
				}
			}
			p {
				font-size: 14px;
				line-height: 24px;
				margin-bottom: 0px;
				margin-bottom: 8px;
			}
		}
		.ot-active-filters-wrapper {
			background: #fff;
			border-radius: 10px;
			padding: 10px 12px;
			margin-bottom: 16px;
			.ot-active-filters {
				display: flex;
				gap: 12px;
				flex-wrap: wrap;
				.ot-active-filters-title {
					font-size: 14px;
					font-family: Montserrat-Medium;
					font-weight: 500;
					display: flex;
					align-items: center;
				}
				.ot-remove-icon {
					cursor: pointer;
					&:hover {
						svg {
							path {
								stroke: #932F65;
							}
						}
					}
				}
				.ot-single-filter {
					gap: 14px;
					display: flex;
					padding: 8px;
					font-size: 12px;
					line-height: 14px;
					color: #101828;
					border-radius: 5px;
					background: #E4EAEE;
					width: fit-content;
				}
				.ot-clear-filters-button {
					text-decoration: underline;
					font-size: 12px;
					font-family: Montserrat-Medium;
					font-weight: 500;
					display: flex;
					align-items: center;
					cursor: pointer;
					&:hover {
						color: #932F65;
					}
				}
			}
		}
		#ot-product-top-block {
			display: flex;
			justify-content: space-between;
			align-items: flex-end;
			margin-bottom: 16px;
			.ot-mobile-filters-button {
				@media(min-width: 801px) {
					display: none;
				}
				.ot-filters-button {
					outline: none !important;
					background: transparent !important;
					display: flex;
					gap: 8px;
					padding: 0px !important;
					flex-direction: column;
					width: fit-content;
					position: relative;
					.ot-button-icon-wrapper {
						display: flex;
						padding: 7px 10px;
						border: 1px solid #ABB8C3;
						background: #fff;
						align-items: center;
						justify-content: center;
						align-content: center;
						border-radius: 8px;
						cursor: pointer;
						.ot-button-icon {
							display: flex;
							gap: 10px;
							align-items: center;
							span {
								text-transform: uppercase;
								font-size: 12px;
							}
						}
					}
					.ot-term-count {
						top: -3px;
						right: -10px;
						font-size: 12px;
						position: absolute;
						width: 20px;
						height: 20px;
						border-radius: 50%;
						color: #fff;
						background: #222;
						display: flex;
						align-content: center;
						justify-content: center;
						align-items: center;
					}
				}
			}
			.ot-product-showing-block {
				display: flex;
				gap: 5px;
				@media(max-width: 900px) {
					display: none;
				}
				span {
					display: flex;
					font-family: Montserrat-Regular;
					font-weight: 400;
					font-size: 14px;
					line-height: 22px;
					color: #6C757D;
				}
			}
			#ot-sort-by-wrapper {
				.ot-dropdown {
					position: relative;
					width: 196px;
					z-index: 999;
				}
				.ot-dropdown-btn {
					width: 100%;
					padding: 10px 10px;
					border-radius: 8px;
					font-size: 12px;
					letter-spacing: -1.5%;
					font-family: Montserrat-Regular;
					font-weight: 400;
					background: #fff;
					color: #364153;
					cursor: pointer;
					display: flex;
					justify-content: space-between;
					align-items: center;
					border: 1px solid #ABB8C3;
					.ot-dropdown-left-block {
						display: flex;
						align-items: center;
						gap: 8px;
					}
					.arrow {
						.svg {
							transform: rotate(0deg);
							transition: transform 0.3s ease;
						}
						&.rotate {
							svg {
								transform: rotate(180deg);
								transition: transform 0.3s ease;
							}
						}
					}
				}
				.ot-dropdown-content {
					position: absolute;
					top: 110%;
					left: 0;
					width: 100%;
					background: #fff;
					border-radius: 10px;
					border: 1px solid #CED4DA;
					display: none;
					overflow: hidden;
					gap: 4px;
					width: 178px;
					padding: 8px;
					div {
						padding: 7px 10px 7px 26px;
						cursor: pointer;
						font-family: Montserrat-Regular;
						font-weight: 400;
						border-radius: 4px;
						font-size: 12px;
						line-height: 18px;
						&:hover {
							background: #E4EAEE;
						}
						&.selected {
							background: #E4EAEE;
							font-family: Montserrat-Medium;
							font-weight: 500;
						}
					}
					&.active {
						display: flex;
						flex-direction: column;
					}
				}
			}
		}
		#ot-product-grid-wrap {
			display: flex;
			gap: 16px;
			flex-wrap: wrap;
			margin-bottom: 16px;
			.ot-product-item {
				background: #fff;
				outline: 1px solid #ABB8C3;
				box-shadow: 0px 10px 15px 0px #0000001A;
				border-radius: 14px;
				width: calc(25% - 12px);
				flex-wrap: wrap;
				@media(max-width: 1440px) {
					width: calc(33.333% - 11px);
				}
				@media(max-width: 1120px) {
					width: calc(50% - 8px);
				}
				@media(max-width: 600px) {
					width: 100%;
				}
				.ot-product-img-wrap {
					position: relative;
					img {
						width: 100%;
						height: 100%;
						object-fit: cover;
						border-top-left-radius: 14px;
						border-top-right-radius: 14px;
						aspect-ratio: 1.5;
					}
					.ot-sale-sticky {
						background: linear-gradient(90deg, #E7000B 0%, #C10007 100%);
						box-shadow: 0px 10px 15px -3px #0000001A;
						padding: 6px 12px;
						color: #fff;
						position: absolute;
						top: 16px;
						right: 16px;
						border-radius: 100px;
						font-size: 12px;
						line-height: 16px;
						font-family: Montserrat-SemiBold;
						font-weight: 600;
					}
				}
				.ot-product-content-wrap {
					padding: 16px;
					.ot-content-top-box {
						display: flex;
						padding-bottom: 16px;
						gap: 4px;
						justify-content: space-between;
						position: relative;
						.ot-content-top-left {
							z-index: 9;
							h4 {
								font-size: 18px;
								line-height: 24px;
								margin-bottom: 8px;
							}
							.ot-dimensions-html {
								font-family: Montserrat-Regular;
								font-weight: 400;
								font-size: 14px;
								line-height: 24px;
								color: #4A5565;
								margin-bottom: 8px;
							}
							.ot-single-term {
								border-radius: 5px;
								color: #000;
								background: #E4EAEE;
								font-family: Montserrat-Regular;
								font-weight: 400;
								font-size: 12px;
								line-height: 22px;
								width: fit-content;
								padding: 4px 8px;
							}
						}
						.ot-content-top-right {
							position: absolute;
							right: 0px;
							max-width: 80px;
							a {
								display: flex;
								width: 100%;
								height: 100%;
								object-fit: contain;
								cursor: pointer;
								img {
									width: 100%;
									height: 100%;
									object-fit: contain;
								}
							}
						}
					}
					.ot-product-information-btn {
						font-family: Montserrat-Regular;
						font-weight: 400;
						font-size: 12px;
						line-height: 18px;
						border-bottom: 1px solid #E4EAEE;
						padding-bottom: 16px;
						margin-bottom: 16px;
						display: flex;
						align-items: center;
						align-content: center;
						gap: 8px;
						&:hover {
							font-family: Montserrat-Medium;
							font-weight: 500;
							cursor: pointer;
						}
						a {
							display: flex;
							align-items: center;
							align-content: center;
							gap: 5px;
						}
					}
					.ot-product-price-color-wrap {
						display: flex;
						gap: 16px;
						margin-bottom: 16px;
						.ot-product-sub-title {
							font-family: Montserrat-Regular;
							font-weight: 400;
							font-size: 12px;
							line-height: 16px;
							color: #292B2F;
							max-width: 115px;
							margin-bottom: 4px;
							@media(max-width: 600px) {
								max-width: 100%;
							}
						}
						.ot-product-price-column {
							width: 50%;
							.ot-price-block {
								display: flex;
								align-items: flex-end;
								gap: 8px;
								span {
									font-family: Montserrat-Medium;
									font-weight: 500;
									font-size: 16px;
									line-height: 22px;
									&.ot-sale-price {
										font-family: Montserrat-Regular;
										font-weight: 400;
										font-size: 14px;
										color: #99A1AF;
										line-height: 20px;
										text-decoration: line-through;
									}
								}
							}
						}
						.ot-product-color-column {
							width: 50%;
							.ot-color-block {
								span {
									font-family: Montserrat-Medium;
									font-weight: 500;
									font-size: 12px;
									line-height: 16px;
								}
							}
						}
					}
					.ot-product-stock-total-wrap {
						display: flex;
						padding: 12px;
						border-radius: 10px;
						border-top: 1px solid #E5E7EB;
						background: linear-gradient(135deg, #F9FAFB 0%, #F3F4F6 100%);
						margin-bottom: 16px;
						gap: 16px;
						.ot-product-sub-title {
							font-family: Montserrat-Regular;
							font-weight: 400;
							font-size: 10px;
							line-height: 14px;
							color: #292B2F;
							margin-bottom: 4px;
							text-transform: uppercase;
							max-width: 115px;
							@media(max-width: 600px) {
								max-width: 100%;
							}
							span {
								color: #932F65;
								font-family: Montserrat-Medium;
								font-weight: 500;
							}
						}
						.ot-product-stock-column {
							width: 50%;
							display: flex;
							flex-direction: column;
							justify-content: space-between;
							.ot-stock-block {
								span {
									color: #101828;
									font-family: Montserrat-Medium;
									font-weight: 500;
									font-size: 16px;
									line-height: 20px;
								}
							}
						}
						.ot-product-total-column {
							width: 50%;
							display: flex;
							flex-direction: column;
							justify-content: space-between;
							.ot-price-block {
								display: flex;
								flex-direction: column;
								span {
									color: #101828;
									font-family: Montserrat-Medium;
									font-weight: 500;
									font-size: 16px;
									line-height: 20px;
									&.ot-sale-price {
										font-family: Montserrat-Regular;
										font-weight: 400;
										font-size: 10px;
										color: #99A1AF;
										line-height: 15px;
										text-decoration: line-through;
									}
								}
							}
						}
					}
					.ot-product-reserve-btn {
						background: #000;
						color: #fff;
						padding: 12px;
						border-radius: 10px;
						justify-content: center;
						display: flex;
						align-items: center;
						gap: 12px;
						font-family: Montserrat-Medium;
						font-size: 14px;
						font-weight: 500;
						line-height: 24px;
						.ot-arrow-hover {
							display: none;
						}
						.ot-arrow-main {
							display: flex;
						}
						&:hover {
							background: #932F65;
							cursor: pointer;
							.ot-arrow-main {
								display: none;
							}
							.ot-arrow-hover {
								display: flex;
							}
						}
					}
				}
			}
		}
		#ot-bottom-block {
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-bottom: 40px;
			.ot-pagination-column {
				display: flex;
				gap: 8px;
				.ot-pagination-arrow {
					border: 1px solid #CED4DA;
					background: #fff;
					width: 38px;
					height: 38px;
					border-radius: 8px;
					display: flex;
					align-items: center;
					justify-content: center;
					align-content: center;
					cursor: pointer;
				}
				.ot-paginations-box {
					display: flex;
					.ot-paginations-items {
						display: flex;
						gap: 8px;
						.ot-paginations-item:not(.ot-pagination-spacer) {
							border: 1px solid #CED4DA;
							width: 38px;
							height: 38px;
							border-radius: 8px;
							display: flex;
							align-items: center;
							justify-content: center;
							align-content: center;
							cursor: pointer;
							background: #fff;
							&:hover {
								border: 1px solid #932F65;
							}
							&.ot-current {
								border: 1px solid #CED4DA;
								cursor: default;
								background: #ABB8C3;
								color: #fff;
							}
						}
						.ot-paginations-item {
							font-family: Montserrat-Medium;
							font-weight: 500;
							font-size: 14px;
							&.ot-pagination-spacer {
								padding-top: 11px;
							}
						}
					}
				}
			}
			.ot-per-page-column {
				display: flex;
				color: #687588;
				font-size: 14px;
				font-family: Montserrat-Medium;
				font-weight: 500;
			}
		}
	}
}

/* Mobile popup filter */
@media(min-width: 801px) {
	.ot-mobile-buttons-wrapper,
	.ot-mobile-filters-top,
	.ot-filters-popup-overlay {
		display: none;
	}
}
@media(max-width: 900px) {
	#outlet-main-wrap {
		#ot-filter-column {
			display: none;
			.tooltip-text {
				left: 65px !important;
				&::after {
					content: '';
					left: 30% !important;
				}
			}
			&.open-mobile-filter {
				width: 100%;
				max-width: 100%;
				padding-right: 0px;
				z-index: 999999999;
				position: fixed;
				display: block;
				left: 0;
				bottom: 0px;
				background: #fff;
				height: 90vh;
				.ot-filter-group-wrap {
					overflow: auto;
					max-height: calc(100vh - 260px);
					margin-bottom: 100px;
					margin-right: 10px;
					&::-webkit-scrollbar {
						width: 6px;
						border-radius: 10px;
					}
					&::-webkit-scrollbar-track {
						background: #E4EAEE80;
						border-radius: 10px;
					}
					&::-webkit-scrollbar-thumb {
						background: #ABB8C3;
						border-radius: 10px;
					}
				}
				.ot-mobile-buttons-wrapper {
					position: fixed;
				}
				.ot-mobile-filters-top {
					padding-left: 20px;
					padding-right: 20px;
					position: relative;
					padding-top: 30px;
					padding-bottom: 40px;
					.ot-filters-popup-header-btn-wrapper {
						position: absolute;
						padding: 15px;
						transform: translate(-50%, -50%);
						left: 50%;
						top: calc(10% + 19px);
						cursor: pointer;
						.ot-filters-popup-header-btn {
							height: 4px;
							display: flex;
							width: 70px;
							background: #D9D9D9;
							border-radius: 16px;
						}
					}
					.ot-mobile-filters-heading {
						position: fixed !important;
						color: #000 !important;
						font-family: Montserrat-Medium !important;
						font-weight: 500 !important;
						font-size: 20px !important;
					}
				}
				.ot-filter-group {
					padding: 20px;
					padding-top: 0px;
					padding-bottom: 0px;
					h4 {
						font-size: 16px;
						line-height: 20px;
					}
					.ot-filter-option {
						justify-content: flex-start;
					}
				}
			}
		}
	}
	.ot-filters-popup-overlay {
		display: none;
		background: #000;
		opacity: 0.6;
		z-index: 9999999;
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		cursor: pointer;
	}
}
/* Outlet order popup */
body.no-scroll {
	overflow: hidden;
}
.outlet-order-popup-wrapper {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	z-index: 999999999;
	.outlet-order-popup {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: 485px;
		max-width: 90%;
		border-radius: 5px;
		background: #fff;
		padding: 45px 20px 40px 20px;
		@media(max-width: 600px) {
			padding: 45px 10px 20px 10px;
		}
		.close-popup {
			position: absolute;
			top: 19px;
			right: 19px;
			display: flex;
			cursor: pointer;
			&:hover {
				svg {
					path {
						stroke: #932F65;
					}
				}
			}
		}
		.popup-content-wrapper {
			max-height: 80vh;
			overflow: auto;
			padding: 0px 20px 0px 20px;
			@media(max-width: 600px) {
				padding: 0px 10px 0px 10px;
			}
			&::-webkit-scrollbar {
				width: 6px;
				border-radius: 10px;
			}
			&::-webkit-scrollbar-track {
				background: #E4EAEE80;
				border-radius: 10px;
			}
			&::-webkit-scrollbar-thumb {
				background: #ABB8C3;
				border-radius: 10px;
			}
			.content-header {
				text-align: center;
				.heading-message {
					display: none;
					font-size: 12px;
					line-height: 17px;
					font-family: Montserrat-Regular;
					font-weight: 400;
					color: #101828;
					margin-bottom: 16px;
				}
				.heading-title {
					h3 {
						font-family: Montserrat-SemiBold;
						font-size: 14px;
						line-height: 17px;
						font-weight: 600;
						text-transform: uppercase;
						margin-bottom: 16px;
					}
				}
			}
			.stock-select-wrapper {
				display: none;
				.stock-select {
					.quantity-selectors {
						padding: 16px;
						background: #E4EAEE;
						border: 1px solid #ABB8C3;
						border-radius: 10px;
						.select-title {
							h4 {
								font-size: 12px;
								line-height: 20px;
								font-family: Montserrat-Medium;
								font-weight: 500;
								color: #101828;
								margin-left: 0px;
								margin-bottom: 8px;
							}
						}
						.select-wrapper {
							display: flex;
							gap: 8px;
							flex-wrap: wrap;
							.select-title {
								margin-left: 8px;
								margin-right: 5px;
								font-size: 12px;
								line-height: 16px;
								color: #101828;
							}
							.select-amount-wrapper {
								font-size: 12px;
								line-height: 16px;
								color: #101828;
							}
							.single-select {
								display: inline-flex;
								align-items: center;
								cursor: pointer;
							}
							.single-select input {
								display: none;
							}
							.single-select label {
								display: inline-flex;
								align-items: center;
								cursor: pointer;
								position: relative;
							}
							.single-select label::before {
								content: "";
								width: 16px;
								height: 16px;
								border: 1px solid #CED4DA;
								background: #fff;
								border-radius: 50%;
								display: inline-block;
								position: relative;
							}
							.single-select input:checked + label::before {
								border: 1px solid #101828;
							}
							.single-select input:checked + label::after {
								content: "";
								width: 8px;
								height: 8px;
								background: #101828;
								border-radius: 50%;
								position: absolute;
								transform: translate(5px, 0px);
							}
						}
					}
					.quantity-calculator-wrapper {
						display: none;
						margin-top: 16px;
						.quantity-calculator {
							display: flex;
							flex-direction: column;
							padding: 16px;
							background: #E4EAEE;
							border: 1px solid #ABB8C3;
							border-radius: 10px;
							.area-input-wrapper {
								display: flex;
								flex-direction: column;
								label {
									font-size: 12px;
									line-height: 20px;
									font-family: Montserrat-Medium;
									font-weight: 500;
									color: #101828;
									margin-left: 0px;
									margin-bottom: 8px;
								}
								#order-amount {
									outline: unset;
									border: 1px solid #ABB8C3;
									background: #fff;
									height: 14px;
									padding: 13px 5px 13px 16px;
									border-radius: 5px;
									font-family: Montserrat-Medium;
									font-weight: 500;
									color: #101828;
									font-size: 12px;
								}
							}
							.calculator-result-wrapper {
								display: flex;
								justify-content: space-between;
								border-bottom: 1px solid #ABB8C3;
								margin-top: 12px;
								&.price {
									.pack-price-wrapper {
										display: flex;
										align-items: center;
										width: 100%;
										justify-content: space-between;
										flex-wrap: wrap;
										.result-price {
											font-family: Montserrat-SemiBold;
											font-size: 14px;
											line-height: 17px;
											font-weight: 600;
										}
									}
								}
								.result-texts {
									font-size: 12px;
									line-height: 24px;
									font-family: Montserrat-Regular;
									font-weight: 400;
									color: #000;
									display: flex;
									padding-top: 4px;
									padding-bottom: 4px;
									gap: 7px;
									align-items: center;
									.result-count {
										
									}
									.tooltip {
										position: relative;
										cursor: pointer;
										display: flex;
										.tooltip-text {
											width: 232px;
											visibility: hidden;
											background: #000;
											color: #fff;
											padding: 12px;
											position: absolute;
											border-radius: 5px;
											bottom: 25px;
											left: calc(50% + 3px);
											transform: translate(-50%, 0%);
											font-size: 14px;
											@media(max-width: 600px) {
												width: 120px;
											}
											a {
												color: #fff;
												font-size: 14px;
												text-decoration: underline;
												margin-top: 10px;
												display: block;
											}
											&::after {
												content: '';
												position: absolute;
												top: 100%;
												left: 50%;
												margin-left: -8px;
												border-width: 5px;
												border-style: solid;
												border-color: black transparent transparent transparent;
											}
										}
										&:hover .tooltip-text {
											visibility: visible;
										}
									}
								}
								.result-count {
									display: flex;
									align-items: center;
									.count {
										display: flex;
										font-family: Montserrat-SemiBold;
										font-size: 14px;
										line-height: 17px;
										font-weight: 600;
										align-items: center;
									}
								}
								.result-coverage {
									display: flex;
									font-family: Montserrat-SemiBold;
									font-size: 14px;
									line-height: 17px;
									font-weight: 600;
									align-items: center;
									gap: 5px;
								}
							}
						}
						.next-button-wrapper {
							display: none;
							.next-step-button {
								margin-top: 16px;
								display: flex;
								justify-content: center;
								.next-step  {
									padding: 0px 15px;
									color: #fff;
									background: #000;
									border-radius: 10px;
									cursor: pointer;
									width: 100%;
									text-align: center;
									text-transform: uppercase;
									font-size: 14px;
									line-height: 14px;
									height: 47px;
									font-weight: 600;
									font-family: Montserrat-SemiBold;
									display: flex;
									align-items: center;
									justify-content: center;
									align-content: center;
									&:hover {
										background: #932F65;
									}
								}
							}
						}
					}
				}
			}
			.stock-amount-notifier {
				display: none;
				margin-top: 15px;
				.stock-amount {
					display: flex;
					flex-direction: column;
					align-content: center;
					flex-wrap: wrap;
					padding: 15px;
					background: #E4EAEE;
					border: 1px solid #E4EAEE;
					border-radius: 15px;
					.full-amount {
						display: flex;
						font-size: 12px;
						line-height: 20px;
						margin-bottom: 0px;
						gap: 3px;
						color: #101828;
						align-items: center;
						font-family: Montserrat-Medium;
						font-weight: 500;
						justify-content: flex-start;
						width: 100%;
						flex-wrap: wrap;
					}
					.selected {
						font-family: Montserrat-Medium;
						font-weight: 500;
						font-size: 12px;
						line-height: 20px;
						margin-bottom: 0px;
					}
					.whole-stock-notice {
						display: none;
					}
					.edit-stock-amount {
						display: none;
						cursor: pointer;
						.edit-amount-text {
							font-size: 12px;
							line-height: 20px;
							font-family: Montserrat-Regular;
							font-weight: 400;
						}
					}
					&.restrict-whole-stock {
						display: block;
						align-content: flex-start;
						.whole-stock-notice {
							display: block;
							font-size: 12px;
							line-height: 20px;
							margin-top: 4px;
							font-family: Montserrat-Regular;
							font-weight: 400;
						}
					}
					&.editable-stock {
						flex-direction: row;
						justify-content: space-between;
						gap: 8px;
						.edit-stock-amount {
							display: flex;
							gap: 4px;
						}
					}
					h4 {
						display: none;
					}
				}
			}
			.outlet-order-form {
				display: none;
				.popup-form {
					span.wpcf7-not-valid-tip {
						position: relative !important;
						margin-top: 5px;
						top: unset !important;
						text-align: left;
					}
					input {
						outline: unset;
						width: 100%;
						border: 1px solid #CED4DA !important;
						border-radius: 5px !important;
						margin-top: 15px;
						font-size: 14px;
						color: #000;
						padding: 0px 14px;
						font-family: Montserrat-Regular;
						font-weight: 400;
						height: 47px;
						&::placeholder {
							color: #101828 !important;
						}
					}
					.wpcf7-submit {
						padding: 15px;
						color: #fff;
						background: #000;
						border-radius: 10px !important;
						cursor: pointer;
						width: 100%;
						text-align: center;
						text-transform: uppercase;
						font-size: 14px;
						line-height: 14px;
						font-weight: 600;
						font-family: Montserrat-SemiBold;
						&:hover {
							background: #932F65;
						}
					}
					.wpcf7-spinner {
						position: absolute;
						margin-top: 28px;
					}
					.select-contact-type-wrapper {
						margin-top: 16px;
						.wpcf7-list-item {
							&.first {
								margin-left: 0px;
							}
						}
						label {
							font-family: Montserrat-Regular;
							font-weight: 400;
							font-size: 12px;
							line-height: 20px;
							color: #101828;
							cursor: pointer;
						}
						input[type="checkbox"] {
							padding: 0px !important;
						}
						input[type="checkbox"] {
							appearance: none;
							width: 14px;
							height: 14px;
							border: 1px solid #CED4DA;
							position: relative;
							top: 5px;
							margin-top: 0px;
							cursor: pointer !important;
							margin-left: 0px;
							border-radius: 2px !important;
						}
						.input[type="checkbox"] {
							width: 16px;
							height: 16px;
						}
						input[type="checkbox"] {
							width: 14px;
							height: 14px;
						}
						input[type="checkbox"]:checked {
							background-color: #932F65;
							border: 1px solid #932F65 !important;
							background-image: url(/wp-content/themes/Betono-mozaika/images/check.svg);
							background-position: center;
						}
					}
					[data-id="contact-condition-phone"] {
						width: calc(100% - 30px);
					}
					[data-id="contact-condition-phone"],
					[data-id="contact-condition-email"] {
						input {
							outline: unset;
							width: 100%;
							border: 1px solid #CED4DA !important;
							border-radius: 5px !important;
							margin-top: 15px;
							font-size: 14px;
							color: #000;
							padding: 0px 14px;
							font-family: Montserrat-Regular;
							font-weight: 400;
							height: 47px;
							&::placeholder {
								color: #000 !important;
							}
						}
					}
					.calculator-message {
						margin-top: 16px;
						margin-bottom: 0px;
						height: 129px;
						border: 1px solid #BEC1C4;
						border-radius: 10px;
						padding: 16px 14px;
					}
					.input_label {
						display: none;
					}
				}
				.popup-form-footer {
					margin-top: 8px !important;
					.acceptance-privacy-policy {
						margin-bottom: 30px;
						input[type="checkbox"] {
							width: 14px;
							height: 14px;
						}
					}
					p {
						font-size: 12px;
						line-height: 17px;
					}
					a {
						font-size: 12px;
						line-height: 17px;
						color: #1D1F21;
						&:hover {
							color: #932F65;
						}
					}
				}
			}
		}
	}
}