/* Greyscale images on sold-out products.
   WooCommerce adds .outofstock to the product wrapper automatically. */
.products .product.outofstock img,
.soi-sold-out img {
	filter: grayscale(100%);
	opacity: 0.85;
}
/* Positioning context for the badge */
.products .product.outofstock,
.single-product div.product.outofstock,
.soi-block-wrap {
	position: relative;
}

.soi-badge {
	position: absolute;
	top: 0.75em;
	left: 0.75em;
	z-index: 9;
	padding: 0.4em 0.75em;
	background: #111;
	color: #fff;
	font-size: 0.75rem;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	border-radius: 3px;
	pointer-events: none;
}

/* Don't stack a "Sale!" flash on top of a sold-out product */
.product.outofstock .onsale {
	display: none !important;
}