/**
 * WooCommerce customizations (block-scoped CSS, auto-enqueued by the theme).
 * Behaviors (badge text, header icon removal) live in woocommerce.php;
 * markup changes live in the templates/archive-product.html and single-product.html overrides.
 */

/* Sale badge: pill using the theme colors (listing + single product). */
.onsale,
.wc-block-components-product-sale-badge {
	background: var(--wp--preset--color--accent-1) !important;
	color: var(--wp--preset--color--base) !important;
	border: none !important;
	border-radius: 999px !important;
	padding: 0.38em 0.95em !important;
	min-width: 0 !important;
	min-height: 0 !important;
	font-size: 0.72rem !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	letter-spacing: 0.05em !important;
	text-transform: uppercase !important;
	box-shadow: 0 3px 12px color-mix(in srgb, var(--wp--preset--color--accent-1) 35%, transparent) !important;
}

/* On the single product the badge sits top-left (so it doesn't collide with the zoom icon). */
.wp-block-woocommerce-product-image-gallery {
	position: relative !important;
}

.wp-block-woocommerce-product-image-gallery > .onsale,
.woocommerce div.product .onsale {
	position: absolute !important;
	top: 1rem !important;
	left: 1rem !important;
	right: auto !important;
	margin: 0 !important;
	z-index: 2 !important;
}

/* Shop breadcrumb matched to the theme's (News): top gap and accent-4 color. */
.wc-block-breadcrumbs {
	margin-top: var(--wp--preset--spacing--30) !important;
	color: var(--wp--preset--color--accent-4) !important;
}

.wc-block-breadcrumbs a,
.wc-block-breadcrumbs .woocommerce-breadcrumb,
.wc-block-breadcrumbs .woocommerce-breadcrumb a {
	color: var(--wp--preset--color--accent-4) !important;
}