/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   SMOUSE STUDIO — PER-PRODUCT SALE BANNER
   Top strip shown on a product page when that product's own sale is active.
   Injected by productSaleBanner.js; matches the site-wide sale banner's look.
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.sm-pbanner {
	background: var(--smouse-orange, #E35300);
	color: #FAF2F0;
	text-align: center;
	padding: 0.45em 1.5em;

	font-family: 'DM Mono', monospace;
	font-weight: 600;
	letter-spacing: 0.1em;
	font-size: 0.8em;
	line-height: 1.5;
}

/* " || " divider when the product message is merged into the site-wide sale banner. */
.smouse-banner-sep {
	opacity: 0.55;
	font-weight: 400;
	padding: 0 0.15em;
}

/* The struck-through original price inside {price}. */
.sm-pbanner__was {
	opacity: 0.55;
	font-weight: 300;
	margin-left: 0.35em;
	text-decoration: line-through;
	letter-spacing: 0.04em;
}