.nf-shipping-progress[hidden] { display: none !important; }
.nf-shipping-progress {
	--nf-sp-color: #365e4b;
	box-sizing: border-box;
	container-type: inline-size;
	width: 100%;
	margin: 12px 0;
	padding: 14px 15px;
	border: 1px solid #e6e9e7;
	border-radius: 10px;
	background: #fafbf9;
	color: #242b27;
	font-family: inherit;
	font-size: 14px;
	line-height: 1.45;
	text-align: start;
}
/* The theme gives totals/buttons their own inset; this hook sits outside it. */
.widget_shopping_cart_content > .nf-shipping-progress[data-location="mini_cart"],
.shopping-cart-widget-footer > .nf-shipping-progress[data-location="mini_cart"] {
	width: calc(100% - 2 * var(--nf-sp-mini-inset, 15px));
	margin-inline: var(--nf-sp-mini-inset, 15px);
}
/* Keep the native WoodMart drawer and percentage-based slide animation. */
.cart-widget-side.wd-side-hidden {
	--wd-side-hidden-w: 420px;
	width: min(var(--wd-side-hidden-w), 100vw);
	max-width: 100vw;
	container: nf-mini-cart / inline-size;
}
.cart-widget-side .wd-scroll-content > .nf-shipping-progress[data-location="mini_cart"] {
	width: calc(100% - 2 * var(--nf-sp-mini-inset, 15px));
	margin-inline: var(--nf-sp-mini-inset, 15px);
}
.cart-widget-side .cart-info,
.cart-widget-side .wd-heading .title { min-width: 0; }
.cart-widget-side .cart-info .wd-entities-title,
.cart-widget-side .cart-info .wd-product-detail { overflow-wrap: anywhere; }
@media (max-width: 767px) {
	.cart-widget-side.wd-side-hidden { --wd-side-hidden-w: 100vw; }
	/* WoodMart reserves a scrollbar gutter even while the mobile page is locked. */
	html:has(.cart-widget-side.wd-opened) { scrollbar-gutter: auto; }
}
@container nf-mini-cart (max-width: 360px) {
	.cart-widget-side .cart-item-image { margin-inline-end: 10px; }
	.cart-widget-side .cart-info { padding-inline-end: 16px; }
}
.nf-shipping-progress--near { --nf-sp-color: #aa7529; }
.nf-shipping-progress--close { --nf-sp-color: #3b7955; }
.nf-shipping-progress--success { --nf-sp-color: #2d7652; background: #f4faf5; border-color: #dcebe0; }
.nf-shipping-progress__title { margin: 0 0 4px; color: #242b27; font: inherit; font-size: 14px; font-weight: 600; overflow-wrap: anywhere; }
.nf-shipping-progress--success .nf-shipping-progress__title { color: #286546; }
.nf-shipping-progress__subtitle { margin: 0; color: #667069; font: inherit; font-size: 12px; overflow-wrap: anywhere; }
.nf-shipping-progress__track { height: 4px; margin-top: 12px; background: #e5e9e6; border: 0; border-radius: 4px; overflow: hidden; }
/* Keep a visible unfinished tail even when only cents remain. Actual totals stay exact. */
.nf-shipping-progress:not(.nf-shipping-progress--success) .nf-shipping-progress__fill { max-width: calc(100% - 12px); }
.nf-shipping-progress__fill { height: 100%; background: var(--nf-sp-color); border-radius: 4px; transition: width 180ms ease, background-color 180ms ease; }
.nf-shipping-progress__next { margin: 10px 0 0; color: #667069; font: inherit; font-size: 12px; overflow-wrap: anywhere; }
.nf-shipping-progress__retry { margin: 8px 0 0; padding: 0; border: 0; background: none; color: #365e4b; font: inherit; font-size: 12px; text-decoration: underline; cursor: pointer; }
/* Style stays in a data attribute when AJAX replaces the loading/success classes. */
.nf-shipping-progress[data-style="minimal"],
.nf-shipping-progress[data-style="goal"],
.nf-shipping-progress[data-style="text"] { padding: 8px 0; border: 0; border-radius: 0; background: transparent; }
.nf-shipping-progress[data-style]:not([data-style="boxed"]) .nf-shipping-progress__title,
.nf-shipping-progress[data-style]:not([data-style="boxed"]) .nf-shipping-progress__subtitle { display: inline; font-size: 13px; line-height: inherit; }
.nf-shipping-progress[data-style]:not([data-style="boxed"]) .nf-shipping-progress__subtitle { margin-inline-start: 4px; }
.nf-shipping-progress[data-style="text"] .nf-shipping-progress__track,
.nf-shipping-progress[data-style]:not([data-style="boxed"]) .nf-shipping-progress__skeleton-subtitle,
.nf-shipping-progress[data-style="text"] .nf-shipping-progress__skeleton-track { display: none; }
.nf-shipping-progress__meter { display: flex; align-items: center; gap: 10px; margin-top: 12px; min-width: 0; }
.nf-shipping-progress[data-style="goal"] .nf-shipping-progress__track { flex: 1 1 0; min-width: 0; margin: 0; overflow: hidden; }
.nf-shipping-progress__goal { flex: 0 0 auto; max-width: 50%; box-sizing: border-box; overflow-wrap: anywhere; padding: 3px 7px; border: 1px solid #e6e9e7; border-radius: 20px; background: #fff; color: #242b27; font-size: 11px; font-weight: 700; line-height: 1.45; }
.nf-shipping-progress--success .nf-shipping-progress__goal { color: #2d7652; }
.nf-shipping-progress[data-style="goal"] .nf-shipping-progress__skeleton-track { margin-top: 17px; margin-bottom: 10px; }
/* Package heading and shipping milestones: the single mini-cart layout. */
.nf-shipping-progress[data-style="parcel"] {
	--nf-sp-color: #307653;
	padding: 8px 0 16px;
	border: 0;
	border-bottom: 1px solid #e6e9e7;
	border-radius: 0;
	background: transparent;
}
.nf-shipping-progress__header { display: flex; align-items: flex-start; gap: 10px; }
.nf-shipping-progress__copy { flex: 1 1 0; min-width: 0; }
.nf-shipping-progress[data-style="parcel"] .nf-shipping-progress__copy .nf-shipping-progress__title { display: block; margin: 0 0 3px; font-size: 14px; font-weight: 600; }
.nf-shipping-progress[data-style="parcel"] .nf-shipping-progress__copy .nf-shipping-progress__subtitle { display: block; margin: 0; font-size: 12px; }
.nf-shipping-progress__parcel-icon {
	flex: 0 0 14px;
	width: 14px;
	height: 14px;
	margin-top: 3px;
	background: var(--nf-sp-color);
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 8V16a2 2 0 0 1-1 1.73l-7 4a2 2 0 0 1-2 0l-7-4A2 2 0 0 1 3 16V8a2 2 0 0 1 1-1.73l7-4a2 2 0 0 1 2 0l7 4A2 2 0 0 1 21 8Z'/%3E%3Cpath d='m3.3 7 8.7 5 8.7-5M12 22V12M7.5 4.5l9 5'/%3E%3C/svg%3E") center / contain no-repeat;
}
.nf-shipping-progress__route { position: relative; height: 60px; margin: 16px 18px 0; }
.nf-shipping-progress[data-style="parcel"] .nf-shipping-progress__track { position: absolute; inset-inline: 0; top: 17px; height: 6px; margin: 0; border-radius: 6px; }
/* Leave 12px visible before the unearned endpoint badge. */
.nf-shipping-progress[data-style="parcel"] .nf-shipping-progress__route--pending .nf-shipping-progress__fill { max-width: calc(100% - var(--nf-sp-badge-size, 36px) / 2 - 12px); }
.nf-shipping-progress__milestone { position: absolute; top: 2px; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 6px; }
.nf-shipping-progress:dir(rtl) .nf-shipping-progress__milestone { transform: translateX(50%); }
.nf-shipping-progress__milestone--lower::before { content: ''; position: absolute; inset-inline-start: 50%; top: calc(-1 * var(--nf-sp-stem)); height: var(--nf-sp-stem); width: 1px; background: #e5e9e6; }
.nf-shipping-progress__milestone--lower.nf-shipping-progress__milestone--earned::before { background: var(--nf-sp-color); }
.nf-shipping-progress__milestone-badge { display: grid; place-items: center; box-sizing: border-box; width: 36px; height: 36px; border: 2px solid #e5e9e6; border-radius: 50%; color: #667069; background: #fff; }
.nf-shipping-progress__milestone--earned .nf-shipping-progress__milestone-badge { border-color: var(--nf-sp-color); background: var(--nf-sp-color); color: #fff; }
.nf-shipping-progress__milestone .nf-shipping-progress__milestone-icon { display: block; flex: none; width: 18px; height: 18px; margin: 0; background: currentColor; }
.nf-shipping-progress__truck-icon { mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 3h13v12H1zM14 8h4l4 4v3h-8M1 15h2m4 0h10m4 0h1'/%3E%3Ccircle cx='5' cy='17' r='2'/%3E%3Ccircle cx='19' cy='17' r='2'/%3E%3C/svg%3E") center / contain no-repeat; }
.nf-shipping-progress__milestone-label { color: #667069; font-size: 12px; line-height: 1.45; white-space: nowrap; font-variant-numeric: tabular-nums; }
.nf-shipping-progress__milestone--earned .nf-shipping-progress__milestone-label { color: #286546; }
.nf-shipping-progress[data-style="parcel"] .nf-shipping-progress__next { margin-top: 6px; }
.nf-shipping-progress__next-compact { display: none; }
@media (max-width: 767px) {
	.nf-shipping-progress[data-location="mini_cart"][data-style="parcel"] { --nf-sp-badge-size: 28px; margin-block: 6px; padding-block: 4px 10px; }
	.nf-shipping-progress[data-location="mini_cart"][data-style="parcel"] .nf-shipping-progress__copy .nf-shipping-progress__title { margin-bottom: 1px; }
	.nf-shipping-progress[data-location="mini_cart"][data-style="parcel"] .nf-shipping-progress__route { margin-top: 8px; }
	.nf-shipping-progress[data-location="mini_cart"][data-style="parcel"] .nf-shipping-progress__track { top: 13px; }
	.nf-shipping-progress[data-location="mini_cart"][data-style="parcel"] .nf-shipping-progress__milestone { gap: 4px; }
	.nf-shipping-progress[data-location="mini_cart"][data-style="parcel"] .nf-shipping-progress__milestone-badge { width: 28px; height: 28px; }
	.nf-shipping-progress[data-location="mini_cart"][data-style="parcel"] .nf-shipping-progress__milestone-icon { width: 15px; height: 15px; }
	.nf-shipping-progress[data-location="mini_cart"][data-style="parcel"] .nf-shipping-progress__next { margin-top: 4px; }
	.nf-shipping-progress[data-location="mini_cart"][data-style="parcel"] .nf-shipping-progress__next-full { display: none; }
	.nf-shipping-progress[data-location="mini_cart"][data-style="parcel"] .nf-shipping-progress__next-compact { display: inline; }
}
.nf-shipping-progress[data-style="parcel"] .nf-shipping-progress__skeleton-subtitle { display: block; margin-inline-start: 24px; }
.nf-shipping-progress[data-style="parcel"] .nf-shipping-progress__skeleton-track { height: 6px; }
.nf-shipping-progress__skeleton > span {
	display: block;
	border-radius: 4px;
	background: linear-gradient(100deg, #e8ece9 25%, #f5f7f5 45%, #e8ece9 65%);
	background-size: 240% 100%;
	animation: nf-shipping-progress-loading 1.6s ease-in-out infinite;
}
.nf-shipping-progress__skeleton > .nf-shipping-progress__skeleton-title { position: relative; width: 78%; height: 1.45em; background: none; animation: none; }
.nf-shipping-progress__skeleton-title::before,
.nf-shipping-progress__skeleton-title::after {
	content: '';
	position: absolute;
	inset: 3px 0 auto;
	height: 14px;
	border-radius: 4px;
	background: linear-gradient(100deg, #e8ece9 25%, #f5f7f5 45%, #e8ece9 65%);
	background-size: 240% 100%;
	animation: nf-shipping-progress-loading 1.6s ease-in-out infinite;
}
.nf-shipping-progress__skeleton-title::after { display: none; }
.nf-shipping-progress__skeleton-subtitle { width: 32%; height: 17.4px; margin-top: 4px; }
.nf-shipping-progress__skeleton-track { width: 100%; height: 4px; margin-top: 12px; }
@container (max-width: 300px) {
	.nf-shipping-progress__skeleton > .nf-shipping-progress__skeleton-title { width: 92%; height: 2.9em; }
	.nf-shipping-progress__skeleton-title::after { display: block; top: 23px; right: 28%; }
}
@keyframes nf-shipping-progress-loading { from { background-position: 100% 0; } to { background-position: -100% 0; } }
@media (prefers-reduced-motion: reduce) {
	.nf-shipping-progress__fill { transition: none; }
	.nf-shipping-progress__skeleton > span,
	.nf-shipping-progress__skeleton-title::before,
	.nf-shipping-progress__skeleton-title::after { animation: none; }
}
