:root {
	--earthum-progress-white: #F5F5F5;
	--earthum-progress-reached: #73EF07;
	--earthum-details-open: #FF6900;
}

.earthum-shortcode-progress-host {
	width: 100%;
	min-width: 54px;
	pointer-events: none;
}

.earthum-cart-progress {
	position: relative;
	width: 100%;
	height: 24px;
	box-sizing: border-box;
}

.earthum-cart-progress[hidden],
.earthum-cart-progress-details[hidden],
.earthum-drawer-progress-host[hidden],
.earthum-cart-benefits-panel[hidden] {
	display: none !important;
}

.earthum-cart-progress__track {
	position: absolute;
	left: 0;
	right: 0;
	top: 11px;
	height: 2px;
	border-radius: 999px;
	background: var(--earthum-progress-white);
	box-shadow: 0 0 1px rgba(0, 0, 0, .75);
	overflow: hidden;
}

.earthum-cart-progress__fill {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	display: block;
	border-radius: inherit;
	background: var(--earthum-progress-reached);
	transition: width .28s ease, left .28s ease;
}

/*
 * Beide Teilflächen sind grün. Zusammen bilden sie einen
 * lückenlosen, kontinuierlichen Fortschritt bis zum aktuellen Warenwert.
 */
.earthum-cart-progress__fill--reached {
	width: var(--earthum-reached-progress, 0%);
}

.earthum-cart-progress__fill--current {
	left: var(--earthum-reached-progress, 0%);
	width: max(0%, calc(var(--earthum-progress, 0%) - var(--earthum-reached-progress, 0%)));
}

.earthum-cart-progress__points {
	position: absolute;
	inset: 0;
}

.earthum-cart-progress__point {
	position: absolute;
	top: 5px;
	width: 14px;
	height: 14px;
	border: 0;
	border-radius: 50%;
	box-sizing: border-box;
	background: var(--earthum-progress-white);
	transform: translateX(-50%);
	box-shadow: 0 0 1px rgba(0, 0, 0, .75);
	transition: background-color .2s ease;
}

.earthum-cart-progress__point:nth-child(1) { left: 33.3333%; }
.earthum-cart-progress__point:nth-child(2) { left: 66.6666%; }
.earthum-cart-progress__point:nth-child(3) { left: 100%; }

.earthum-cart-progress__point.is-next {
	background: var(--earthum-progress-white);
}

.earthum-cart-progress__point.is-reached {
	background: var(--earthum-progress-reached);
}

.earthum-cart-progress--compact {
	height: 19px;
}

.earthum-cart-progress--compact .earthum-cart-progress__track {
	top: 8px;
	height: 1.5px;
}

.earthum-cart-progress--compact .earthum-cart-progress__point {
	top: 3px;
	width: 11px;
	height: 11px;
}

.earthum-drawer-progress-host,
.widget_shopping_cart_content > .earthum-cart-progress,
.woocommerce-mini-cart + .earthum-cart-progress {
	margin: 14px 18px 10px;
}

.earthum-drawer-progress-host .earthum-cart-progress,
.earthum-cart-progress--drawer {
	max-width: 100%;
}

.earthum-cart-benefits-panel {
	margin: 0 0 24px;
	padding: 18px 20px;
	border: 1px solid rgba(245, 245, 245, .22);
	border-radius: 4px;
	background: rgba(0, 0, 0, .08);
}

.earthum-cart-benefits-panel h2 {
	margin: 0 0 14px;
	font-size: 1.15em;
}

.earthum-cart-progress-details__message {
	margin: 12px 0 10px;
	font-family: "Fraunces", Georgia, serif;
	font-weight: 600;
	text-transform: uppercase;
}

.earthum-cart-progress-details ul {
	margin: 0;
	padding: 0;
	list-style: none;
	font-family: "Manrope", Arial, sans-serif;
}

.earthum-cart-progress-details li {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 6px 0;
}

.earthum-cart-progress-details__dot {
	flex: 0 0 8px;
	width: 8px;
	height: 8px;
	margin-top: 0;
	border-radius: 50%;
	background: var(--earthum-details-open);
}

.earthum-cart-progress-details li.is-reached .earthum-cart-progress-details__dot {
	background: var(--earthum-progress-reached);
}

.earthum-cart-progress-details li.is-reached {
	font-weight: 600;
}

@media (max-width: 767px) {
	.earthum-shortcode-progress-host {
		min-width: 50px;
	}

	.earthum-cart-benefits-panel {
		padding: 16px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.earthum-cart-progress__fill,
	.earthum-cart-progress__point {
		transition: none;
	}
}