.editor-styles-wrapper .wc-block-grid__products .wc-block-grid__product .wc-block-components-product-image,
.wc-block-components-product-image {
	margin-top: 0;
	margin-bottom: $gap-small;
	text-decoration: none;
	display: block;
	position: relative;

	a {
		text-decoration: none;
		border: 0;
		outline: 0;
		box-shadow: none;
	}

	img {
		vertical-align: middle;
		width: 100%;

		&[hidden] {
			display: none;
		}
	}

	.wc-block-components-product-sale-badge {
		&--align-left {
			position: absolute;
			left: $gap-smaller/2;
			top: $gap-smaller/2;
			right: auto;
			margin: 0;
		}
		&--align-center {
			position: absolute;
			top: $gap-smaller/2;
			left: 50%;
			right: auto;
			transform: translateX(-50%);
			margin: 0;
		}
		&--align-right {
			position: absolute;
			right: $gap-smaller/2;
			top: $gap-smaller/2;
			left: auto;
			margin: 0;
		}
	}
}

.is-loading .wc-block-components-product-image {
	@include placeholder();
}