/**
 * Social-proof & urgency UI. Hairlines + squared corners (no emoji, no
 * pills) to match the UTILIQ motif. Colours from the theme --uq-* tokens.
 */

/* --- urgency row (countdown + low stock), above the offers --- */
/* Quiet inline line (no box): one less container fighting for attention
   above the CTA - scarcity reads as a footnote to the price, not a banner. */
.uq-urgency {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 18px;
	align-items: center;
	margin: 14px 0 0;
	font-size: .8rem;
	color: var( --uq-ink-soft, #6e6154 );
}

.uq-urgency-item {
	display: inline-flex;
	align-items: center;
	gap: 7px;
}

.uq-urgency b {
	color: var( --uq-ink, #241b13 );
	font-weight: 700;
}

.uq-urgency .uq-ic {
	color: var( --uq-cta, #e0702f );
	width: 1.15em;
	height: 1.15em;
}

.uq-cd .uq-cd-time {
	font-family: var( --uq-font-mono, ui-monospace, monospace );
	font-weight: 500;
	letter-spacing: .04em;
	color: var( --uq-cta, #e0702f );
	font-variant-numeric: tabular-nums;
}

/* --- proof BAR: slim second announcement bar under the delivery topbar --- */
.uq-proofbar {
	background: var( --uq-cream-deep, #ede4d3 );
	border-bottom: 1px solid var( --uq-line, #d8c9b2 );
	font-size: .76rem;
	color: var( --uq-ink-soft, #6e6154 );
}

.uq-proofbar-in {
	display: flex;
	justify-content: center;
	flex-wrap: nowrap;
	gap: 26px;
	padding: 7px 12px;
	overflow: hidden;
}

.uq-proofbar-item {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	white-space: nowrap;
}

.uq-proofbar-item b {
	color: var( --uq-ink, #241b13 );
	font-weight: 700;
}

.uq-proofbar-item .uq-ic {
	color: var( --uq-cta, #e0702f );
	width: 1.15em;
	height: 1.15em;
}

/* Narrow screens keep only the strongest claims. */
@media ( max-width: 860px ) {
	.uq-proofbar-lg { display: none; }
}
@media ( max-width: 640px ) {
	.uq-proofbar-md { display: none; }
	.uq-proofbar-in { gap: 16px; }
}
