.product_listing {
	.woo_page {
		display: flex;
		gap: var(--gap-xl);
	}
	.woocommerce_content {
		flex: 1;
	}
	.archive_meta {
		display: flex;
		flex-flow: row wrap;
		align-items: center;
		justify-content: space-between;
		gap: 20px;
		margin-bottom: 20px;
		p {
			margin: 0;
			color: var(--woo-grey);
		}
		form.woocommerce-ordering {
			select {
				appearance: none;
				-webkit-appearance: none;
				border: 1px solid rgba(255, 255, 255, 0.50);
				color: var(--woo-grey);
				padding: 8px 20px;
				height: 50px;
				background: rgba(255, 255, 255, 0.50) calc(100% - 20px) center  / 15px 7px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 17 9'%3E%3Cpath stroke='%23939393' d='m1 .5 7.5 7 7.5-7'/%3E%3C/svg%3E");
			}
		}
	}
	ul.products {
		list-style: none;
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 20px;
		margin-bottom: var(--gap-xl);
		li.product {
			padding: 20px;
			background: var(--white);
			border-radius: var(--border-radius-m);
			margin: 0;
			display: flex;
			flex-flow: column;
			justify-content: space-between;
			align-items: flex-start;
			gap: 10px;
			> a.woocommerce-loop-product__link {
				position: relative;
				display: flex;
				flex-flow: column;
				justify-content: space-between;
				gap: 10px;
				flex: 1;
				text-decoration: none;
				width: 100%;
			}
			img {
				width: 100%;
				height: auto;
				aspect-ratio: 405 / 291;
				object-fit: contain;
			}
			.product_header {
				h2 {
					margin-bottom: 5px;
					font-weight: 700;
					color: var(--deep-grey);
				}
				p {
					margin: 0;
					color: var(--woo-mid-grey);
				}
			}
			.button {
				margin: 0;
				&:before {
					content: none;
				}
				&:hover {
					background: var(--deep-grey);
					border-color: var(--deep-grey);
				}
			}
		}
	}
	.product_badge_container {
		display: flex;
		flex-flow: row wrap;
		gap: 10px;
		margin-bottom: 10px;
	}
	.product_badge {
		display: flex;
		align-items: center;
		gap: 10px;
		font-size: 14px;
		font-weight: 600;
		padding: 8px 15px;
		color: var(--deep-grey);
		background: var(--light-grey);
		border-radius: var(--border-radius-l);
		&.top {
			position: absolute;
			top: 0;
			left: 0;
		}
		&.featured {
			background: var(--tertiary);
		}
		&.advanced_system {
			color: var(--white);
			background-color: var(--primary);
		}
		&.compact_design {
			&:before {
				content: '';
				aspect-ratio: 12 / 5;
				width: 24px;
				background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 10'%3E%3Cpath fill='%23231F20' d='M1.8 8h20.4V2h-5.8v3.3h-1.5V2h-1.4v1.8h-1.4V2h-1.3v3.3H9.3V2H8.1v1.8H6.6V2H5.2v3.3H3.8V2h-2v6ZM20 4c.6 0 1 .5 1 1s-.4 1-1 1-1-.5-1-1 .4-1 1-1ZM0 9.8V.2h24v9.6H0Z'/%3E%3C/svg%3E");
			}
		}
		&.intuitive_software {
			&:before {
				content: '';
				aspect-ratio: 7 / 9;
				height: 18px;
				background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 15 18'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%23231F20' d='M14.2 5a2.8 2.8 0 1 0-3.6 2.8c0 .5-.2 1-.4 1.3-.6.6-1.8.7-3 .9-1 0-2 .2-2.9.6V5.5a2.8 2.8 0 1 0-1.7 0v7a2.8 2.8 0 1 0 1.9 0l.5-.4c.6-.3 1.4-.4 2.3-.5 1.5 0 3.2-.3 4.2-1.5.5-.6.7-1.4.8-2.4 1-.3 1.9-1.4 1.9-2.6ZM3.5 2.3c.3 0 .5.3.5.6s-.2.6-.5.6a.6.6 0 0 1-.6-.6c0-.3.3-.5.6-.5Zm0 13.6a.6.6 0 0 1-.6-.6c0-.3.3-.6.6-.6s.5.3.5.6-.2.6-.5.6Zm7.9-11.3c.3 0 .5.3.5.6s-.2.5-.5.5a.6.6 0 0 1-.6-.5c0-.3.2-.6.6-.6Z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M.7 0h13.5v18H.7z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
			}
		}
		&.manual_system {
			&:before {
				content: '';
				aspect-ratio: 7 / 9;
				height: 18px;
				background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 14 18'%3E%3Cpath fill='%23231F20' d='M11.5 5.9c-.3 0-.7 0-1 .2V3.4a2.2 2.2 0 0 0-3.2-1.9 2.2 2.2 0 0 0-4.2.7v.5a2.2 2.2 0 0 0-3.1 2v6.5a6.8 6.8 0 1 0 13.7 0V8a2.2 2.2 0 0 0-2.2-2.2Zm1 5.3a5.6 5.6 0 1 1-11.3 0V4.6a1 1 0 1 1 2 0v3.5a.6.6 0 1 0 1.1 0V2a1 1 0 1 1 2 0v5.3a.6.6 0 0 0 1.2 0v-4a1 1 0 1 1 1.8 0V9a3.7 3.7 0 0 0-3 3.7.6.6 0 0 0 1.2 0 2.5 2.5 0 0 1 2.4-2.5.6.6 0 0 0 .7-.6V8.1a1 1 0 1 1 1.8 0v3Z'/%3E%3C/svg%3E");
			}
		}
		&.stain_free {
			&:before {
				content: '';
				aspect-ratio: 1 / 1;
				width: 18px;
				background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 18 18'%3E%3Cpath fill='%23231F20' d='M17.7 6.7A9 9 0 1 0 .3 11.3a9 9 0 0 0 17.4-4.6Zm-1.2.3c.2.5.3 1 .3 1.7l-3 1.7V2.9c1.3 1 2.3 2.4 2.7 4ZM5.4 11V7L9 4.7 12.6 7v4.2L9 13l-3.6-2Zm7.2-9v3.5L6.1 1.8a7.7 7.7 0 0 1 6.5.3Zm-7.8.4 3 1.7L1.3 8a7.7 7.7 0 0 1 3.5-5.5Zm-3.6 7 3-1.8v7.5a7.8 7.8 0 0 1-3-5.8Zm4.2 6.5v-3.4l6.5 3.7a7.8 7.8 0 0 1-6.5-.3Zm7.8-.3-3-1.7 6.5-3.8a7.8 7.8 0 0 1-3.5 5.5Z'/%3E%3C/svg%3E");
			}
		}
	}
}
.shop_sidebar {
	width: 270px;
	.filter_toggle {
		margin: 0;
		display: none;
	}
	& ul {
		list-style: none;
		padding: 0;
		margin: 0;
	}
	& form.woocommerce-product-search {
		position: relative;
		& button {
			cursor: pointer;
			width: 20px;
			aspect-ratio: 1 / 1;
			background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath fill='%23AFAFAF' d='m19.7 17.3-3.9-3.9a1 1 0 0 0-.6-.3h-.7a8.1 8.1 0 1 0-1.4 1.4v.7c0 .2.1.5.3.6l3.9 4c.4.3 1 .3 1.3 0l1.1-1.2c.4-.3.4-1 0-1.3ZM8.1 13a5 5 0 1 1 0-10 5 5 0 0 1 0 10Z'/%3E%3C/svg%3E");
			position: absolute;
			right: 15px;
			top: 15px;
			text-indent: -99999px;
			overflow: hidden;
			border: none;
		}
		& input[type=search] {
			border: none;
			padding: 12px 15px;
			width: 100%;
			height: 50px;
			border-radius: var(--border-radius-xs);
		}
	}
	.woo-filters {
		> li {
			&:not(.widget_product_search) {
				background: var(--white);
				border-radius: var(--border-radius-m);
				padding: 15px;
			}
			& ul.product-categories {
				display: flex;
				flex-flow: column;
				gap: 3px;

				& > li {
					display: none;
				}
				& > li.current-cat ,
				& > li.cat-parent {
					display: block;
					> a {
						color: var(--primary);
						background: var(--woo-white-smoke);
					}
				}
				& li {
					margin: 0;
				}

				& a {
					display: block;
					color: var(--woo-grey);
					text-decoration: none;
					padding: 6px 10px 9px;
					border-radius: var(--border-radius-xs);
					&:hover {
						color: var(--primary);
						background: var(--woo-white-smoke);
					}
				}

				& ul {
					padding: 3px 0 0 15px;
					display: flex;
					flex-flow: column;
					gap: 3px;
					& a {
						font-weight: 400;
					}
					& li.current-cat a {
						color: var(--primary);
						background: var(--woo-white-smoke);
					}
				}

			}

			&.woocommerce-widget-layered-nav {
				& ul {
					display: flex;
					flex-flow: row wrap;
					align-items: center;
					gap: 5px;
					& li {
						& a {
							font-weight: 400;
							padding: 5px 15px;
							background: var(--woo-white-smoke);
							border: 1px solid #B5B5B5;
							border-radius: var(--border-radius-m);
							display: flex;
							align-items: center;
							gap: 5px;
							transition: all .3s ease-in-out;
							&:hover {
								color: var(--primary);
								border-color: var(--primary);
							}
						}
						&.chosen {
							& a {
								color: var(--primary);
								&:after {
									content: '';
									width: 19px;
									aspect-ratio: 1 / 1;
									margin-right: 0;
									background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 19 20'%3E%3Ccircle cx='9.5' cy='10' r='9.5' fill='%23B72E54'/%3E%3Cpath fill='%23fff' d='M5 14.5c0 .2.2.3.4.3s.4-.1.5-.3L9.5 11l3.6 3.6c.1.2.3.3.5.3l.4-.3c.3-.2.3-.6 0-.9L10.4 10 14 6.4c.3-.3.3-.7 0-1a.7.7 0 0 0-.9 0L9.5 9.2 5.9 5.5a.7.7 0 0 0-1 0c-.2.2-.2.6 0 .9L8.7 10 5 13.6c-.3.3-.3.7 0 1Z'/%3E%3C/svg%3E");
								}
							}
						}
					}
				}
			}
		}
		.tab-title {
			margin-bottom: 15px;
		}
	}
}

@media (width < 1500px) {
	.product_listing {
		& ul.products {
			grid-template-columns: repeat(2, 1fr);
		}
	}
}

@media (width <= 1024px) {
	.product_listing {
		.woo_page {
			flex-flow: column;
			align-items: center;
		}
		.archive_meta {
			justify-content: center;
		}
	}
	.shop_sidebar {
		width: 100%;
		.filter_toggle {
			display: flex;
			align-items: center;
			margin: 0;
			padding: 5px;
			position: relative;
			justify-content: center;
		}
		.woo-filters {
			max-height: 0;
			overflow: hidden;
			transition: .2s;
		}
		&.open .woo-filters {
			max-height: 3000px;
		}
	}
}

@media (width <= 750px) {
	div.product_listing {
		& ul.products {
			grid-template-columns: repeat(1, 1fr);
		}
	}
}