/* Shipbar – free shipping progress bar */
.sfb {
	--sfb-accent: #16a34a;
	--sfb-bg: #0f172a;
	--sfb-pct: 0%;
	box-sizing: border-box;
	font-size: 14.5px;
	line-height: 1.4;
}
.sfb[hidden] { display: none !important; }
.sfb *, .sfb *::before, .sfb *::after { box-sizing: border-box; }
.sfb .sfb__msg { margin: 0 !important; padding: 0; }
.sfb__msg strong { font-weight: 750; }

.sfb__track {
	position: relative;
	height: 8px;
	border-radius: 999px;
	overflow: hidden;
	background: color-mix(in srgb, currentColor 14%, transparent);
}
.sfb__fill {
	position: absolute;
	inset: 0 auto 0 0;
	width: var(--sfb-pct);
	min-width: 8px;
	border-radius: inherit;
	background: linear-gradient(90deg, color-mix(in srgb, var(--sfb-accent) 70%, #fff), var(--sfb-accent));
	transition: width 0.8s cubic-bezier(.2, .9, .3, 1);
	overflow: hidden;
}
.sfb.is-empty .sfb__fill { min-width: 0; }
.sfb__fill::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(110deg, transparent 30%, rgba(255, 255, 255, 0.45) 50%, transparent 70%);
	transform: translateX(-100%);
	animation: sfb-shine 2.6s ease-in-out infinite;
}
@keyframes sfb-shine { 60%, 100% { transform: translateX(100%); } }
.sfb.is-done .sfb__fill::after { animation: none; }

/* Celebration when the goal is reached */
.sfb.is-celebrating .sfb__inner { animation: sfb-pop 0.6s cubic-bezier(.2, .9, .3, 1.4); }
@keyframes sfb-pop { 40% { transform: scale(1.03); } }

/* ---------- Top bar ---------- */
.sfb--topbar {
	position: sticky;
	top: 0;
	z-index: 99980;
	width: 100%;
	color: #fff;
	background: var(--sfb-bg);
	text-align: center;
}
body.admin-bar .sfb--topbar { top: var(--wp-admin--admin-bar--height, 32px); }
.sfb--topbar.sfb--bottom { position: fixed; top: auto !important; bottom: 0; left: 0; right: 0; }
.sfb--topbar .sfb__inner {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	max-width: 1200px;
	margin: 0 auto;
	padding: 9px 16px;
}
.sfb--topbar .sfb__track { width: 180px; flex: none; height: 6px; background: rgba(255, 255, 255, 0.18); }
.sfb--topbar.is-done .sfb__track { display: none; }
.sfb--topbar.sfb--hide-done.is-done { display: none; }
@media (max-width: 640px) {
	.sfb--topbar { font-size: 13px; }
	.sfb--topbar .sfb__inner { flex-direction: column; gap: 6px; padding: 7px 14px 9px; }
	.sfb--topbar .sfb__track { width: 100%; max-width: 280px; }
	.sfb--topbar.sfb--no-mobile { display: none; }
}

/* ---------- Cart, checkout, inline ---------- */
.sfb--cart, .sfb--checkout, .sfb--inline {
	margin: 0 0 24px;
	padding: 16px 18px;
	border-radius: 16px;
	border: 1px solid color-mix(in srgb, var(--sfb-accent) 25%, transparent);
	background: color-mix(in srgb, var(--sfb-accent) 7%, transparent);
}
.sfb--cart .sfb__inner, .sfb--checkout .sfb__inner, .sfb--inline .sfb__inner { display: grid; gap: 10px; }
.sfb--cart .sfb__msg::before, .sfb--checkout .sfb__msg::before, .sfb--inline .sfb__msg::before {
	content: "";
	display: inline-block;
	width: 20px;
	height: 20px;
	margin-right: 8px;
	vertical-align: -4px;
	background: var(--sfb-accent);
	-webkit-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='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 3h15v13H1zM16 8h4l3 3v5h-7z'/%3E%3Ccircle cx='5.5' cy='18.5' r='2.5'/%3E%3Ccircle cx='18.5' cy='18.5' r='2.5'/%3E%3C/svg%3E") center / contain no-repeat;
	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='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 3h15v13H1zM16 8h4l3 3v5h-7z'/%3E%3Ccircle cx='5.5' cy='18.5' r='2.5'/%3E%3Ccircle cx='18.5' cy='18.5' r='2.5'/%3E%3C/svg%3E") center / contain no-repeat;
}
.sfb.is-done.sfb--cart, .sfb.is-done.sfb--checkout, .sfb.is-done.sfb--inline { border-color: var(--sfb-accent); }

/* ---------- Mini-cart ---------- */
.sfb--mini { margin: 10px 0 12px; font-size: 13px; }
.sfb--mini .sfb__inner { display: grid; gap: 6px; }
.sfb--mini .sfb__track { height: 6px; }

@media (prefers-reduced-motion: reduce) {
	.sfb *, .sfb__fill::after { animation: none !important; transition: none !important; }
}
@supports not (color: color-mix(in srgb, red 10%, white)) {
	.sfb__track { background: rgba(127, 127, 127, 0.2); }
	.sfb__fill { background: var(--sfb-accent); }
	.sfb--cart, .sfb--checkout, .sfb--inline { background: rgba(127, 127, 127, 0.06); border-color: rgba(127, 127, 127, 0.25); }
}
.sfb--topbar.sfb--fixed:not(.sfb--bottom) { position: fixed; left: 0; right: 0; }
