/**
 * Sidrene cijene za WooCommerce - the anchor price label on the storefront.
 *
 * The label is appended to whatever element the theme renders the price in, and on this
 * kind of shop that element is rarely a paragraph. On markuswines.com the price comes
 * from an Elementor heading widget (an `h6` with custom typography), so the label would
 * inherit a heading's size, weight, letter spacing and upper casing and would read as a
 * second price rather than as a note under it.
 *
 * Everything below therefore states its own value instead of inheriting one, and sizes
 * are in `rem` rather than `em`: an `em` inside a heading that is itself sized in `em`
 * compounds, and the label would come out a different size on every template.
 */

.sc-anchor {
	/* Themes that lay the price out as a flex row (Lagar cart/mini-cart) would otherwise
	   place the label beside the price; a full-basis flex item always wraps to its own line. */
	flex: 0 0 100%;
	display: block;
	font-size: 0.875rem;
	line-height: 1.4;
	font-weight: 400;
	letter-spacing: normal;
	text-transform: none;
	margin-top: 0.25em;
	white-space: normal;

	/* The one property that is here for legibility rather than for layout. The label
	   inherits the colour of the element the theme renders the price in, and on
	   markuswines.com that is a pale sand (#e19b85 on #f4f3ef): a contrast of 2.05:1,
	   measured by the inspection persona on 21.09.2026, where WCAG AA asks for 4.5:1.
	   NN 101/2026-1212 t. II requires the additional price to be "readable", and a value
	   that a shop can read is a value this plugin has to state itself rather than
	   inherit. A theme that has its own opinion still wins: one class, no `!important`,
	   so `.sc-anchor { color: … }` in the theme stylesheet overrides this line. */
	color: #1d2327;
}

/* `wc_price()` wraps the amount in its own span, which themes often style as a price —
   in size and in colour. Inside the label it is part of a sentence and keeps the
   sentence's size and the sentence's colour. */
.sc-anchor .amount {
	font-size: inherit;
	color: inherit;
}

/* A theme may render the item price as a non-wrapping flex row (Lagar cart and mini-cart:
   span.quantity is display:flex, flex-wrap:nowrap). Without wrapping the full-basis label still
   sits beside the price, so the immediate flex parent of a label is allowed to wrap. */
:is(span, div, p, bdi):has(> .sc-anchor) {
	flex-wrap: wrap;
}

/* The date inside the sentence is one token: a narrow price column wraps the sentence between
   its words, never through "10. 9. 2026.". */
.sc-anchor__date {
	white-space: nowrap;
}