/* md_stickers: the corners of a product photo. A card: .product-thumb__image is the box (relative, overflow
   hidden); its top-right holds the wishlist/compare icons (z-index 10), its bottom-right the video indicator
   of md_product_video 1.0.1+ (z-index 2), the photo Swiper of addit-img.js has z-index 1. The product page:
   inside .product__images-main. */
.md-stickers {
	position: absolute;
	z-index: 3;
	display: flex;
	flex-direction: column;
	gap: 4px;
	max-width: calc(100% - 16px);
	pointer-events: none;
}

.md-stickers > * {
	pointer-events: auto;
}

.md-stickers--tl { top: 8px; left: 8px; align-items: flex-start; }
.md-stickers--tr { top: 8px; right: 52px; align-items: flex-end; }
.md-stickers--bl { bottom: 8px; left: 8px; align-items: flex-start; }
.md-stickers--br { bottom: 8px; right: 8px; align-items: flex-end; }

/* a card with the video indicator (bottom-right, 21px high): the bottom-right stack sits above it */
.product-thumb__image:has(.product-card__video-indicator) .md-stickers--br {
	bottom: 40px;
}

.md-sticker {
	display: inline-flex;
	align-items: center;
	max-width: 100%;
	text-decoration: none;
}

a.md-sticker:hover,
a.md-sticker:focus {
	text-decoration: none;
}

.md-sticker--text {
	padding: 3px 8px;
	font-size: 12px;
	line-height: 1.25;
	font-weight: 600;
	color: var(--md-sticker-fg, #fff);
	background: var(--md-sticker-bg, #ff5252);
	border-radius: var(--border-radius-1, 4px);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

a.md-sticker--text:hover,
a.md-sticker--text:focus {
	color: var(--md-sticker-fg, #fff);
	filter: brightness(1.1);
}

.md-sticker--image img {
	display: block;
	height: var(--md-sticker-h, 30px);
	width: auto;
	max-width: 100%;
}

.md-sticker--sprite svg {
	display: block;
	width: var(--md-sticker-h, 30px);
	height: var(--md-sticker-h, 30px);
	color: var(--md-sticker-fg, #333);
	fill: currentColor;
}

.md-sticker--code {
	line-height: 0;
}

.md-sticker--code svg,
.md-sticker--code img {
	height: var(--md-sticker-h, 30px);
	width: auto;
}

/* the product page: no icons at the top-right, bigger text */
#product-product .product__images-main .md-stickers--tr {
	right: 8px;
}

#product-product .product__images-main .md-sticker--text {
	padding: 4px 10px;
	font-size: 14px;
}