/**
 * Free Shipping Nudge — matched to the store's flat design language.
 *
 * The theme (Open Sans, #333 text, 3px radii, flat #eee info boxes, no shadows,
 * flat green #7b9f35 buttons) is understated, so this stays flat too: no
 * gradients, no textures, no shadows, no constant animation. The ONLY motion is
 * the progress fill smoothly growing when the cart subtotal changes.
 */

.fsn-nudge {
	--fsn-green: #7b9f35;
	--fsn-progress: 0%;

	margin: 0 0 1.4em;
	padding: 14px;
	border-radius: 3px;
	background: #eef3e3;            /* flat, like the theme's #eee info boxes, lightly tinted green */
	border-left: 3px solid var(--fsn-green);
	color: #333;
	font-size: 14px;
	line-height: 1.4;
}

.fsn-nudge__head {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 9px;
}

.fsn-nudge__icon {
	flex: 0 0 auto;
	display: inline-flex;
	color: var(--fsn-green);
}

.fsn-nudge__message {
	flex: 1 1 auto;
	margin: 0;
	font-weight: 600;
	color: #333;
}

.fsn-nudge__percent {
	flex: 0 0 auto;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	color: var(--fsn-green);
}

.fsn-nudge__percent-sign {
	font-size: 0.8em;
	font-weight: 600;
}

/* ---- track ---- */
.fsn-nudge__track {
	position: relative;
	height: 8px;
	border-radius: 3px;
	background: #dfe4d3;
	overflow: hidden;
}

.fsn-nudge__fill {
	display: block;
	height: 100%;
	width: var(--fsn-progress);
	background: var(--fsn-green);
	border-radius: 3px;
	/* the one and only motion: smooth growth when the subtotal changes */
	transition: width 0.5s ease;
}

/* the shimmer/marker elements from the old markup are simply not shown */
.fsn-nudge__shimmer,
.fsn-nudge__marker {
	display: none;
}

/* ---- complete state (flat, just a colour shift) ---- */
.fsn-nudge--complete {
	background: #e4efce;
	border-left-color: #5e7c24;
}

.fsn-nudge--complete .fsn-nudge__message {
	color: #2f5d00;
}

@media (max-width: 1024px) {
	.fsn-nudge {
		font-size: 13px;
	}
}

/* respect reduced-motion: drop even the growth transition */
@media (prefers-reduced-motion: reduce) {
	.fsn-nudge__fill {
		transition: none;
	}
}