.wp-block-sogutenberg-product-match {
	border-radius: 40px;
	display: flex;
	background: var(--so-color-snow-white);
	box-sizing: border-box;
	margin-top: 40px;
	overflow: hidden;
	padding: 20px;
	gap: 40px;

	.content {
		display: flex;
		flex-direction: column;
		gap: 16px;
		padding: 20px;
		align-items: flex-start;

		h2 {
			margin: 0;
			max-width: 600px;
		}

		p {
			margin: 0;
			font-size: 16px;
		}

		.info {
			border-radius: 32px;
			background: #E6ECF0;
			padding: 16px;
			display: flex;
			color: var(--so-color-primary);
			gap: 8px;
			font-size: 14px;
			margin-top: auto;
			align-items: flex-start;

			&:before {
				content: '';
				width: 24px;
				aspect-ratio: 1/1;
				flex: 0 0 24px;
				background-size: contain;
				background-repeat: no-repeat;
				background-position: center;
				background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 11.6667C0 8.57247 1.22916 5.60501 3.41709 3.41709C5.60501 1.22916 8.57247 0 11.6667 0C14.7609 0 17.7283 1.22916 19.9162 3.41709C22.1042 5.60501 23.3333 8.57247 23.3333 11.6667C23.3333 14.7609 22.1042 17.7283 19.9162 19.9162C17.7283 22.1042 14.7609 23.3333 11.6667 23.3333C8.57247 23.3333 5.60501 22.1042 3.41709 19.9162C1.22916 17.7283 0 14.7609 0 11.6667ZM13 6.33333C13 6.68696 12.8595 7.02609 12.6095 7.27614C12.3594 7.52619 12.0203 7.66667 11.6667 7.66667C11.313 7.66667 10.9739 7.52619 10.7239 7.27614C10.4738 7.02609 10.3333 6.68696 10.3333 6.33333C10.3333 5.97971 10.4738 5.64057 10.7239 5.39052C10.9739 5.14048 11.313 5 11.6667 5C12.0203 5 12.3594 5.14048 12.6095 5.39052C12.8595 5.64057 13 5.97971 13 6.33333ZM11.6667 10C11.9319 10 12.1862 10.1054 12.3738 10.2929C12.5613 10.4804 12.6667 10.7348 12.6667 11V17.6667C12.6667 17.9319 12.5613 18.1862 12.3738 18.3738C12.1862 18.5613 11.9319 18.6667 11.6667 18.6667C11.4015 18.6667 11.1471 18.5613 10.9596 18.3738C10.772 18.1862 10.6667 17.9319 10.6667 17.6667V11C10.6667 10.7348 10.772 10.4804 10.9596 10.2929C11.1471 10.1054 11.4015 10 11.6667 10Z' fill='%23102941'/%3E%3C/svg%3E%0A");
			}
		}
	}

	.right {
		flex: 1 0 424px;
		background: var(--so-color-primary);
		color: var(--so-color-white);
		padding: 20px;
		border-radius: 24px;

		form {
			display: flex;
			flex-direction: column;
			gap: 12px;
			position: relative;
			width: 100%;

			&:after {
				content: '';
				width: 24px;
				aspect-ratio: 1/1;
				position: absolute;
				opacity: 0;
				top: 50%;
				left: 50%;
				transform: translate(-50%, -50%);
				transform-origin: center;
				background-size: contain;
				background-repeat: no-repeat;
				background-position: center;
				pointer-events: none;
				background-image: url("data:image/svg+xml,%3Csvg width='26' height='26' viewBox='0 0 26 26' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13 1V5M13 21V25M25 13H21M5 13H1M21.4853 4.516L18.656 7.344M7.344 18.656L4.516 21.484M21.4853 21.4853L18.656 18.656M7.344 7.344L4.516 4.516' stroke='%23102941' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E%0A");
				animation: so-spin 2s linear infinite;
			}

			&.is-loading {
				pointer-events: none;

				> * {
					opacity: .6;
				}

				&:after {
					opacity: 1;
				}
			}

			h3 {
				font-size: var(--so-fontsize-h5);
				font-weight: bold;
				margin: 0;
			}

			label {
				font-size: 14px;
				font-weight: 500;
				position: relative;

				&:before {
					content: '';
					position: absolute;
					width: 44px;
					height: 47px;
					bottom: 0;
					left: 0;
					background-position: center;
					background-repeat: no-repeat;
				}

				&:has(input[name="height"]):before {
					background-size: 14px;
					background-image: url("data:image/svg+xml,%3Csvg width='12' height='15' viewBox='0 0 12 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.72 0C0.529044 3.92978e-09 0.345909 0.0740789 0.210883 0.20594C0.0758568 0.337802 0 0.516645 0 0.703125C0 0.889605 0.0758568 1.06845 0.210883 1.20031C0.345909 1.33217 0.529044 1.40625 0.72 1.40625H11.28C11.471 1.40625 11.6541 1.33217 11.7891 1.20031C11.9241 1.06845 12 0.889605 12 0.703125C12 0.516645 11.9241 0.337802 11.7891 0.20594C11.6541 0.0740789 11.471 3.92978e-09 11.28 0H0.72ZM0.72 13.5938C0.529044 13.5938 0.345909 13.6678 0.210883 13.7997C0.0758568 13.9316 0 14.1104 0 14.2969C0 14.4834 0.0758568 14.6622 0.210883 14.7941C0.345909 14.9259 0.529044 15 0.72 15H11.28C11.471 15 11.6541 14.9259 11.7891 14.7941C11.9241 14.6622 12 14.4834 12 14.2969C12 14.1104 11.9241 13.9316 11.7891 13.7997C11.6541 13.6678 11.471 13.5938 11.28 13.5938H0.72ZM6.5088 11.9812L8.4288 10.1062C8.49954 10.0419 8.55628 9.96425 8.59563 9.878C8.63498 9.79175 8.65614 9.69865 8.65785 9.60424C8.65955 9.50983 8.64177 9.41605 8.60556 9.3285C8.56935 9.24095 8.51545 9.16142 8.44708 9.09465C8.37871 9.02788 8.29727 8.97525 8.20761 8.93989C8.11796 8.90452 8.02193 8.88715 7.92526 8.88882C7.82858 8.89049 7.73324 8.91115 7.64492 8.94958C7.5566 8.98801 7.47712 9.04342 7.4112 9.1125L6.72 9.7875V5.2125L7.4112 5.8875C7.47712 5.95658 7.5566 6.01199 7.64492 6.05042C7.73324 6.08885 7.82858 6.10951 7.92526 6.11118C8.02193 6.11285 8.11796 6.09548 8.20761 6.06011C8.29727 6.02475 8.37871 5.97212 8.44708 5.90535C8.51545 5.83858 8.56935 5.75905 8.60556 5.6715C8.64177 5.58395 8.65955 5.49017 8.65785 5.39576C8.65614 5.30135 8.63498 5.20824 8.59563 5.122C8.55628 5.03575 8.49954 4.95812 8.4288 4.89375L6.5088 3.01875C6.3738 2.88708 6.1908 2.81312 6 2.81312C5.8092 2.81312 5.6262 2.88708 5.4912 3.01875L3.5712 4.89375C3.44402 5.02704 3.37478 5.20333 3.37807 5.38549C3.38136 5.56765 3.45693 5.74145 3.58884 5.87027C3.72076 5.99909 3.89873 6.07289 4.08526 6.0761C4.27179 6.07932 4.45231 6.0117 4.5888 5.8875L5.28 5.2125V9.7875L4.5888 9.1125C4.45231 8.9883 4.27179 8.92068 4.08526 8.9239C3.89873 8.92711 3.72076 9.00091 3.58884 9.12973C3.45693 9.25855 3.38136 9.43235 3.37807 9.61451C3.37478 9.79667 3.44402 9.97296 3.5712 10.1062L5.4912 11.9812C5.6262 12.1129 5.8092 12.1869 6 12.1869C6.1908 12.1869 6.3738 12.1129 6.5088 11.9812Z' fill='%23102941'/%3E%3C/svg%3E%0A");
				}

				&:has(input[name="width"]):before {
					background-size: 16px;
					background-image: url("data:image/svg+xml,%3Csvg width='15' height='12' viewBox='0 0 15 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15 0.72C15 0.529044 14.9259 0.345909 14.7941 0.210883C14.6622 0.0758568 14.4834 0 14.2969 0C14.1104 0 13.9316 0.0758568 13.7997 0.210883C13.6678 0.345909 13.5938 0.529044 13.5938 0.72V11.28C13.5938 11.471 13.6678 11.6541 13.7997 11.7891C13.9316 11.9241 14.1104 12 14.2969 12C14.4834 12 14.6622 11.9241 14.7941 11.7891C14.9259 11.6541 15 11.471 15 11.28V0.72ZM1.40625 0.72C1.40625 0.529044 1.33217 0.345909 1.20031 0.210883C1.06845 0.0758568 0.889606 0 0.703125 0C0.516644 0 0.337802 0.0758568 0.20594 0.210883C0.0740786 0.345909 0 0.529044 0 0.72V11.28C0 11.471 0.0740786 11.6541 0.20594 11.7891C0.337802 11.9241 0.516644 12 0.703125 12C0.889606 12 1.06845 11.9241 1.20031 11.7891C1.33217 11.6541 1.40625 11.471 1.40625 11.28V0.72ZM3.01875 6.5088L4.89375 8.4288C4.95812 8.49954 5.03575 8.55628 5.122 8.59563C5.20825 8.63498 5.30135 8.65614 5.39576 8.65785C5.49017 8.65955 5.58395 8.64177 5.6715 8.60556C5.75905 8.56935 5.83858 8.51545 5.90535 8.44708C5.97212 8.37871 6.02475 8.29727 6.06011 8.20761C6.09548 8.11796 6.11285 8.02193 6.11118 7.92526C6.10951 7.82858 6.08885 7.73324 6.05042 7.64492C6.01199 7.5566 5.95658 7.47712 5.8875 7.4112L5.2125 6.72H9.7875L9.1125 7.4112C9.04342 7.47712 8.98801 7.5566 8.94958 7.64492C8.91115 7.73324 8.89049 7.82858 8.88882 7.92526C8.88715 8.02193 8.90452 8.11796 8.93989 8.20761C8.97525 8.29727 9.02788 8.37871 9.09465 8.44708C9.16142 8.51545 9.24095 8.56935 9.3285 8.60556C9.41605 8.64177 9.50983 8.65955 9.60424 8.65785C9.69865 8.65614 9.79176 8.63498 9.878 8.59563C9.96425 8.55628 10.0419 8.49954 10.1063 8.4288L11.9813 6.5088C12.1129 6.3738 12.1869 6.1908 12.1869 6C12.1869 5.8092 12.1129 5.6262 11.9813 5.4912L10.1063 3.5712C9.97296 3.44402 9.79667 3.37478 9.61451 3.37807C9.43235 3.38136 9.25855 3.45693 9.12973 3.58884C9.00091 3.72076 8.92711 3.89873 8.9239 4.08526C8.92068 4.27179 8.9883 4.45231 9.1125 4.5888L9.7875 5.28H5.2125L5.8875 4.5888C6.0117 4.45231 6.07932 4.27179 6.0761 4.08526C6.07289 3.89873 5.99909 3.72076 5.87027 3.58884C5.74145 3.45693 5.56765 3.38136 5.38549 3.37807C5.20333 3.37478 5.02704 3.44402 4.89375 3.5712L3.01875 5.4912C2.88708 5.6262 2.81312 5.8092 2.81312 6C2.81312 6.1908 2.88708 6.3738 3.01875 6.5088Z' fill='%23102941'/%3E%3C/svg%3E%0A");
				}

				input {
					padding-left: 44px;
				}
			}

			input {
				width: 100%;
				box-sizing: border-box;
			}

			input[type="submit"] {
				margin-top: 12px;
				text-align: left;
				font-weight: bold;
				color: var(--so-color-primary);
				background-color: var(--so-color-white);
				background-size: 16px;
				background-position: center right 20px;
				background-repeat: no-repeat;
				background-image: url("data:image/svg+xml,%3Csvg width='16' height='12' viewBox='0 0 16 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_1133_8691)'%3E%3Cpath d='M12.15 6.99996H1C0.71667 6.99996 0.479337 6.90396 0.288004 6.71196C0.0966702 6.51996 0.000670115 6.28263 3.44827e-06 5.99996C-0.000663218 5.7173 0.0953369 5.47996 0.288004 5.28796C0.48067 5.09596 0.718003 4.99996 1 4.99996H12.15L9.3 2.14996C9.1 1.94996 9.004 1.71663 9.012 1.44996C9.02 1.1833 9.116 0.949963 9.3 0.749963C9.5 0.549963 9.73767 0.445963 10.013 0.437963C10.2883 0.429963 10.5257 0.525629 10.725 0.724963L15.3 5.29996C15.4 5.39996 15.471 5.5083 15.513 5.62496C15.555 5.74163 15.5757 5.86663 15.575 5.99996C15.5743 6.1333 15.5537 6.2583 15.513 6.37496C15.4723 6.49163 15.4013 6.59996 15.3 6.69996L10.725 11.275C10.525 11.475 10.2877 11.571 10.013 11.563C9.73834 11.555 9.50067 11.4506 9.3 11.25C9.11667 11.05 9.02067 10.8166 9.012 10.55C9.00334 10.2833 9.09934 10.05 9.3 9.84996L12.15 6.99996Z' fill='%23102941'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_1133_8691'%3E%3Crect width='16' height='12' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
				
				&:hover {
					background-color: var(--so-color-orange-hover);
					color: var(--so-color-white);
					background-image: url("data:image/svg+xml,%3Csvg width='16' height='12' viewBox='0 0 16 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.15 6.56246H1C0.71667 6.56246 0.479337 6.46646 0.288004 6.27446C0.0966702 6.08246 0.000670115 5.84513 3.44827e-06 5.56246C-0.000663218 5.2798 0.0953369 5.04246 0.288004 4.85046C0.48067 4.65846 0.718003 4.56246 1 4.56246H12.15L9.3 1.71246C9.1 1.51246 9.004 1.27913 9.012 1.01246C9.02 0.745796 9.116 0.512463 9.3 0.312463C9.5 0.112463 9.73767 0.00846303 10.013 0.000463024C10.2883 -0.00753698 10.5257 0.0881294 10.725 0.287463L15.3 4.86246C15.4 4.96246 15.471 5.0708 15.513 5.18746C15.555 5.30413 15.5757 5.42913 15.575 5.56246C15.5743 5.6958 15.5537 5.8208 15.513 5.93746C15.4723 6.05413 15.4013 6.16246 15.3 6.26246L10.725 10.8375C10.525 11.0375 10.2877 11.1335 10.013 11.1255C9.73834 11.1175 9.50067 11.0131 9.3 10.8125C9.11667 10.6125 9.02067 10.3791 9.012 10.1125C9.00334 9.8458 9.09934 9.61246 9.3 9.41246L12.15 6.56246Z' fill='white'/%3E%3C/svg%3E%0A");
				}
			}
		}

		.product {
			display: none;
			flex-direction: column;
			gap: 16px;

			.top {
				display: flex;
				gap: 16px;
				align-items: flex-start;

				figure {
					aspect-ratio: 1/1;
					width: 100px;
					flex: 0 0 100px;
					margin: 0;
					overflow: hidden;
					border-radius: 24px;
					background: #E6ECF0;

					img {
						width: 100%;
						height: 100%;
						object-fit: cover;
						object-position: center;
					}
				}

				.salediscount {
					position: static;
				}

				.freedelivery {
					justify-content: flex-end;
					display: none;
					color: #c1ffb2;

					img {
						width: 16px;
					}

					@media screen and (max-width: 600px) {
						display: none !important;
					}
				}

				.heading {
					display: flex;
					flex-direction: column;
					gap: 8px;
					flex: 1;
					align-items: flex-start;
					justify-content: center;

					h3 {
						font-size: var(--so-fontsize-h5);
						margin: 0;
						font-weight: bold;
					}

					.wrapper {
						display: flex;
						gap: 8px;
						justify-content: space-between;
						width: 100%;

						.price {
							display: flex;
							align-items: flex-end;
                            gap: 0 8px;

							.woocommerce-Price-amount {
								display: flex;
								gap: 8px;
								align-items: flex-end;
								justify-content: space-between;
							}

							del {
								color: var(--so-color-gray);
								font-size: 14px;
							}

							ins {
								font-weight: bold;
								text-decoration: none;
								font-size: 20px;
							}

							.tag {
								width: 100%;
							}
						}
					}
				}
			}

			.productincluded {
				display: none;
				background: var(--so-color-primary-hover);
				border: none;

				label {
					background: rgba(255, 255, 255, .12);
				}

				li {
					color: var(--so-color-white);
				}
			}

			.productincluded:has(ul li) {
				display: block;
			}
		}

		.no-results {
			display: none;
			flex-direction: column;
			gap: 16px;

			h3, p {
				margin: 0
			}
		}

		.wp-block-button__link:hover {
			background-color: var(--so-color-orange-hover) !important;
		}

		.back {
			background-color: var(--so-color-orange-hover) !important;
			color: var(--so-color-white) !important;

			&:after {
				display: none;
			}

			&:hover {
				background-color: var(--so-color-white) !important;
				color: var(--so-color-primary) !important;
			}
		}

		.back:before {
			content: '';
			transform: rotate(180deg);
			background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='12' viewBox='0 0 16 12' fill='none'%3E%3Cpath d='M12.15 6.99996H1C0.71667 6.99996 0.479337 6.90396 0.288004 6.71196C0.0966702 6.51996 0.000670115 6.28263 3.44827e-06 5.99996C-0.000663218 5.7173 0.0953369 5.47996 0.288004 5.28796C0.48067 5.09596 0.718003 4.99996 1 4.99996H12.15L9.3 2.14996C9.1 1.94996 9.004 1.71663 9.012 1.44996C9.02 1.1833 9.116 0.949963 9.3 0.749963C9.5 0.549963 9.73767 0.445963 10.013 0.437963C10.2883 0.429963 10.5257 0.525629 10.725 0.724963L15.3 5.29996C15.4 5.39996 15.471 5.5083 15.513 5.62496C15.555 5.74163 15.5757 5.86663 15.575 5.99996C15.5743 6.1333 15.5537 6.2583 15.513 6.37496C15.4723 6.49163 15.4013 6.59996 15.3 6.69996L10.725 11.275C10.525 11.475 10.2877 11.571 10.013 11.563C9.73834 11.555 9.50067 11.4506 9.3 11.25C9.11667 11.05 9.02067 10.8166 9.012 10.55C9.00334 10.2833 9.09934 10.05 9.3 9.84996L12.15 6.99996Z' fill='%23000000'/%3E%3C/svg%3E");
			display: block;
			width: 16px;
			height: 12px;
			background-repeat: no-repeat;
			background-size: contain;
			background-position: center;
			filter: var(--so-color-white-filter);
		}

		.back:hover:before {
			filter: var(--so-color-primary-filter);
		}
	}

	@media screen and (max-width: 970px) {
		flex-direction: column;

		.right {
			flex: 1 0;
		}
	}
}

@keyframes so-spin {
	from {
		transform: translate(-50%, -50%) rotate(0deg);
	}
	to {
		transform: translate(-50%, -50%) rotate(360deg);
	}
}