/* TierStep storefront. Override --tierstep-accent to match your theme. */
.tierstep-box,
.tierstep-table,
.tierstep-badge,
.tierstep-soldout {
	--tierstep-accent: #2563eb;
	--tierstep-track: rgba(127, 127, 127, 0.2);
}

.tierstep-box {
	margin: 0.5em 0 1.25em;
}

.tierstep-notice {
	margin: 0 0 0.5em;
	font-weight: 600;
}

.tierstep-progress {
	margin: 0 0 0.5em;
}

.tierstep-progress__track {
	height: 0.5em;
	border-radius: 999px;
	background: var(--tierstep-track);
	overflow: hidden;
}

.tierstep-progress__fill {
	display: block;
	height: 100%;
	min-width: 0.5em;
	border-radius: inherit;
	background: var(--tierstep-accent);
}

.tierstep-progress__label,
.tierstep-countdown {
	margin: 0.25em 0 0;
	font-size: 0.875em;
	opacity: 0.85;
}

.tierstep-countdown__time {
	font-variant-numeric: tabular-nums;
	font-weight: 600;
}

.tierstep-table {
	width: 100%;
	margin: 1em 0;
	border-collapse: collapse;
	font-size: 0.9375em;
}

.tierstep-table caption {
	text-align: start;
	font-weight: 600;
	padding-bottom: 0.5em;
}

.tierstep-table th,
.tierstep-table td {
	padding: 0.5em 0.75em;
	border-bottom: 1px solid var(--tierstep-track);
	text-align: start;
	overflow-wrap: normal;
	word-break: normal;
	hyphens: manual;
}

.tierstep-table__row--sold-out {
	opacity: 0.55;
}

.tierstep-table__row--sold-out td:nth-child(2) {
	text-decoration: line-through;
}

.tierstep-table__row--current td {
	font-weight: 600;
}

.tierstep-table__row--current td:first-child {
	box-shadow: inset 3px 0 0 var(--tierstep-accent);
}

/* Units and prices never break mid-number; savings and status wrap at spaces. */
.tierstep-table td:nth-child(1),
.tierstep-table td:nth-child(2) {
	white-space: nowrap;
}

@media (max-width: 480px) {
	.tierstep-table {
		font-size: 0.875em;
	}

	.tierstep-table th,
	.tierstep-table td {
		padding: 0.4em 0.35em;
	}
}

.tierstep-badge {
	margin: 0.25em 0 0.5em;
	font-size: 0.8125em;
	font-weight: 600;
}

.tierstep-badge .tierstep-progress__track {
	display: block;
	height: 0.3125em;
	margin-top: 0.25em;
}

.tierstep-soldout {
	margin: 0.5em 0 1em;
	font-weight: 600;
	opacity: 0.8;
}

.tierstep-prelaunch {
	margin: 0.25em 0 0;
	font-size: 0.875em;
	font-weight: 600;
}

.tierstep-cart-saving {
	display: block;
	font-size: 0.85em;
	opacity: 0.85;
}

.tierstep-lowest-price {
	display: block;
	margin-top: 2px;
	font-size: 0.85em;
	color: inherit;
	opacity: 0.8;
}

.tierstep-lowest-price--cart {
	display: inline;
	margin-left: 4px;
}