$wc-max-columns: 6;
$gutter: 30px;

.products{}


.woocommerce .products.jet-woo-builder-categories--columns ,
.woocommerce .products.jet-woo-builder-products--columns {
	display: flex;
	flex-wrap: wrap;
	margin-left: ($gutter / -2);
	margin-right: ($gutter / -2);
	list-style: none;
	
	.product {
		position: relative;
		// Prevent columns from becoming too narrow when at smaller grid tiers by
		// always setting `width: 100%;`. This works because we use `flex` values
		// later on to override this initial width.
		min-height: 1px; // Prevent collapsing
		padding-right: ($gutter / 2);
		padding-left: ($gutter / 2);
		width: 100%!important;
		float: none!important;
		margin-right: 0!important;
		margin-left: 0!important;
	}
}

.woocommerce .products.jet-woo-builder-categories--columns {
	@for $i from 1 through $wc-max-columns {
		&.jet-woo-builder-cat-columns-#{$i} {
			.product.product-category {
				@include column-width($i);
				width: 100%!important;
				float: none!important;
				margin-right: 0!important;
				margin-left: 0!important;
			}
		}
	}
	
	@media (max-width: 1024px) {
		@for $i from 1 through $wc-max-columns {
			&.jet-woo-builder-cat-columns-tab-#{$i} {
				.product.product-category {
					@include column-width($i);
					width: 100%!important;
					float: none!important;
					margin-right: 0!important;
					margin-left: 0!important;
				}
			}
		}
	}
	
	@media (max-width: 767px) {
		@for $i from 1 through $wc-max-columns {
			&.jet-woo-builder-cat-columns-mob-#{$i} {
				.product.product-category {
					@include column-width($i);
					width: 100%!important;
					float: none!important;
					margin-right: 0!important;
					margin-left: 0!important;
				}
			}
		}
	}
}

.woocommerce .products.jet-woo-builder-products--columns {
	@for $i from 1 through $wc-max-columns {
		&.jet-woo-builder-columns-#{$i} {
			.product {
				@include column-width($i);
				width: 100%!important;
				float: none!important;
				margin-right: 0!important;
				margin-left: 0!important;
			}
		}
	}
	
	@media (max-width: 1024px) {
		@for $i from 1 through $wc-max-columns {
			&.jet-woo-builder-columns-tab-#{$i} {
				.product {
					@include column-width($i);
					width: 100%!important;
					float: none!important;
					margin-right: 0!important;
					margin-left: 0!important;
				}
			}
		}
	}
	
	@media (max-width: 767px) {
		@for $i from 1 through $wc-max-columns {
			&.jet-woo-builder-columns-mob-#{$i} {
				.product {
					@include column-width($i);
					width: 100%!important;
					float: none!important;
					margin-right: 0!important;
					margin-left: 0!important;
				}
			}
		}
	}
}

.jet-woo-builder-hide{
	display: none;
}