/* BLACK NOVEMBER badge; scoped to the ten selected campaign product cards. */
.woocommerce ul.products li.product .a4u-black-november-badge,
.a4u-product-section ul.products li.product .a4u-black-november-badge {
	position: absolute;
	top: 2px;
	left: 2px;
	z-index: 5;
	display: block;
	width: 76px;
	height: 83px;
	margin: 0;
	padding: 0;
	line-height: 0;
	pointer-events: none;
}

.woocommerce ul.products li.product .a4u-black-november-badge img,
.a4u-product-section ul.products li.product .a4u-black-november-badge img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: contain;
}

.woocommerce ul.products li.product .a4u-black-november-badge__text,
.a4u-product-section ul.products li.product .a4u-black-november-badge__text {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	overflow: visible;
	pointer-events: none;
}

@media (max-width: 767px) {
	.woocommerce ul.products li.product .a4u-black-november-badge,
	.a4u-product-section ul.products li.product .a4u-black-november-badge {
		top: 2px;
		left: 2px;
		width: 62px;
		height: 68px;
	}
}

/* Make the campaign badge easier to read specifically in the Sale category. */
body.tax-product_cat.term-sale.woocommerce ul.products li.product .a4u-black-november-badge,
body.tax-product_cat.term-sale .a4u-product-section ul.products li.product .a4u-black-november-badge {
	width: 100px;
	height: 110px;
}

@media (max-width: 767px) {
	body.tax-product_cat.term-sale.woocommerce ul.products li.product .a4u-black-november-badge,
	body.tax-product_cat.term-sale .a4u-product-section ul.products li.product .a4u-black-november-badge {
		width: 80px;
		height: 88px;
	}
}

/* Keep the campaign badge more compact across homepage product sections. */
body.home .woocommerce ul.products li.product .a4u-black-november-badge,
body.home .a4u-product-section ul.products li.product .a4u-black-november-badge {
	width: 56px;
	height: 62px;
}

@media (max-width: 767px) {
	body.home .woocommerce ul.products li.product .a4u-black-november-badge,
	body.home .a4u-product-section ul.products li.product .a4u-black-november-badge {
		width: 46px;
		height: 51px;
	}
}

/* On mobile archives, the badge markup is inside a padded product link.
   Offset it back to the top-left corner of the product card. */
@media (max-width: 767px) {
	body.woocommerce.archive ul.products li.product .a4u-black-november-badge,
	body.woocommerce.archive .a4u-product-section ul.products li.product .a4u-black-november-badge {
		top: -24px;
		left: -24px;
	}
}