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

.woocommerce {
	.products.jet-woo-builder-categories--columns,
	.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;
			@include column-width( var( --columns ) );

			&.jet-equal-columns {
				> .elementor {
					height: 100%;
					> .elementor-inner {
						height: 100%;
						> .elementor-section-wrap {
							height: 100%;
							> .elementor-section {
								height: 100%;
								> .elementor-container {
									height: 100%;
								}
							}
						}
					}

					// For compat with E. v3.0
					> .elementor-section-wrap {
						height: 100%;
						> .elementor-section {
							height: 100%;
							> .elementor-container {
								height: 100%;
							}
						}
					}
				}
			}
		}
	}

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