/* Spar Shop – "Je bestelling" panel (wide screens) and bottom bar + sheet (phones) */
.spar-cart {
	--sc-brown: #6b4a33;
	--sc-ink: #3b2a1e;
	--sc-muted: #6f5a49;
	--sc-line: #ece2d6;
	--sc-field: #d9c9b6;
	font-family: Roboto, Arial, sans-serif;
	color: var(--sc-ink);
}
.spar-cart [hidden],
.spar-cartbar[hidden],
.spar-cart__backdrop[hidden] {
	display: none !important;
}

.spar-cart__box {
	display: flex;
	flex-direction: column;
	max-height: inherit;
	background: #fff;
	border: 1px solid var(--sc-line);
	border-radius: 14px;
	box-shadow: 0 8px 24px rgba(59, 42, 30, 0.08);
	overflow: hidden;
}
.spar-cart.is-busy .spar-cart__lines {
	opacity: 0.6;
	pointer-events: none;
}

.spar-cart__head {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 14px 18px 12px;
	border-bottom: 1px solid var(--sc-line);
}
.spar-cart__title {
	margin: 0 !important;
	font-family: 'Roboto Slab', Georgia, serif;
	font-size: 20px !important;
	line-height: 1.2;
	color: var(--sc-ink) !important;
}
.spar-cart__close {
	display: none;
	width: 40px;
	height: 40px;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 999px !important;
	background: #f6efe6 !important;
	color: var(--sc-ink) !important;
	font-size: 22px;
	line-height: 1;
	cursor: pointer;
}

.spar-cart__empty {
	padding: 26px 18px 30px;
	text-align: center;
	color: var(--sc-muted);
	font-size: 14px;
	line-height: 1.5;
}
.spar-cart__empty svg {
	display: block;
	width: 36px;
	height: 36px;
	margin: 0 auto 8px;
	color: #c9b8a6;
}
.spar-cart__empty p {
	margin: 0;
}

.spar-cart__lines {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	transition: opacity 0.15s;
}
.spar-cart__line {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	margin: 0 !important;
	padding: 12px 18px;
	border-bottom: 1px solid #f3ebe1;
	background: #fff;
	transition: background-color 0.6s ease;
}
.spar-cart__line.is-flash {
	background: #eef4e2;
	transition: none;
}
.spar-cart__info {
	flex: 1;
	min-width: 0;
}
.spar-cart__name {
	display: block;
	color: var(--sc-ink) !important;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.3;
	text-decoration: none !important;
}
.spar-cart__name:hover {
	color: var(--sc-brown) !important;
}
.spar-cart__options {
	margin-top: 2px;
	font-size: 12px;
	color: var(--sc-muted);
}
.spar-cart__row {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 8px;
}
.spar-cart__stepper {
	display: inline-flex;
	height: 32px;
	border: 1px solid var(--sc-field);
	border-radius: 6px;
	overflow: hidden;
	background: #fff;
}
.spar-cart__step {
	width: 30px;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	color: var(--sc-brown) !important;
	font-size: 16px;
	line-height: 1;
	cursor: pointer;
}
.spar-cart__step:disabled {
	opacity: 0.35;
	cursor: default;
}
.spar-cart__qty {
	min-width: 28px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-left: 1px solid var(--sc-line);
	border-right: 1px solid var(--sc-line);
	font-size: 13px;
	font-weight: 600;
}
.spar-cart__remove {
	margin: 0 !important;
	padding: 4px 0 !important;
	border: 0 !important;
	background: none !important;
	color: #8a6f58 !important;
	font-size: 12px;
	text-decoration: underline;
	cursor: pointer;
}
.spar-cart__price {
	flex: none;
	font-size: 14px;
	font-weight: 600;
	white-space: nowrap;
}
.spar-cart__msg {
	margin: 0;
	padding: 10px 18px;
	background: #fcf0f1;
	color: #a1271b;
	font-size: 13px;
}

.spar-cart__foot {
	flex: none;
	padding: 14px 18px 18px;
	border-top: 1px solid var(--sc-line);
	background: #fcf9f5;
}
.spar-cart__total {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	font-size: 15px;
}
.spar-cart__total strong {
	font-size: 20px;
}
.spar-cart__note {
	margin: 6px 0 0 !important;
	font-size: 12px;
	line-height: 1.45;
	color: var(--sc-muted);
}
.spar-cart__order {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	margin-top: 12px;
	border-radius: 10px;
	background: var(--sc-brown);
	color: #fff !important;
	font-size: 16px;
	font-weight: 700;
	text-decoration: none !important;
}
.spar-cart__order:hover {
	background: #5a3d29;
}
.spar-cart__view {
	display: block;
	margin-top: 8px;
	text-align: center;
	font-size: 13px;
	color: var(--sc-brown) !important;
}

/* ---------- Wide screens: panel next to the products ---------- */
@media (min-width: 1100px) {
	.spar-shop.has-cart {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 320px;
		gap: 28px;
		align-items: start;
	}
	/* Always below the bar (and the sub-category row when one is open). */
	.spar-cart {
		position: sticky;
		top: calc(var(--sm-sticky-top, 0px) + var(--sm-bar-h, 72px) + var(--sm-sub-h, 0px) + 16px);
		max-height: calc(100vh - var(--sm-sticky-top, 0px) - var(--sm-bar-h, 72px) - var(--sm-sub-h, 0px) - 32px);
		margin-top: calc(var(--sm-bar-h, 72px) + var(--sm-sub-h, 0px) + 16px);
		transition: top 0.2s ease, margin-top 0.2s ease;
	}
	/* The search + category bar and the sub-category row run over both
	   columns (320px panel + 28px gap), so every chip fits. */
	.spar-shop.has-cart .spar-menu__bar {
		margin-right: -348px;
	}
	.spar-cartbar,
	.spar-cart__backdrop {
		display: none !important;
	}
}

/* ---------- Smaller screens: bottom bar that opens a sheet ---------- */
@media (max-width: 1099px) {
	.spar-cart {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 100001;
		max-width: 560px;
		max-height: 82vh;
		margin: 0 auto;
		transform: translateY(105%);
		transition: transform 0.25s ease;
		visibility: hidden;
	}
	.spar-cart.is-open {
		transform: none;
		visibility: visible;
	}
	.spar-cart__box {
		max-height: 82vh;
		border-radius: 18px 18px 0 0;
		border-bottom: 0;
		box-shadow: 0 -8px 30px rgba(0, 0, 0, 0.2);
	}
	.spar-cart__close {
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}
	.spar-cart__line {
		padding: 14px 18px;
	}
	.spar-cart__name {
		font-size: 15px;
	}
	.spar-cart__stepper {
		height: 40px;
	}
	.spar-cart__step {
		width: 38px;
		font-size: 18px;
	}
	.spar-cart__remove {
		min-height: 40px;
		font-size: 13px;
	}
	.spar-cart__backdrop {
		position: fixed;
		inset: 0;
		z-index: 100000;
		background: rgba(40, 25, 15, 0.45);
	}
	html.spar-cart-open,
	html.spar-cart-open body {
		overflow: hidden;
	}
	/* Room at the bottom of the page so the bar never covers the last products. */
	html.spar-cartbar-visible .spar-shop {
		padding-bottom: 84px;
	}
}

.spar-cartbar {
	position: fixed;
	left: 12px;
	right: 12px;
	bottom: 12px;
	z-index: 99999;
	display: flex;
	align-items: center;
	gap: 12px;
	max-width: 560px;
	min-height: 58px;
	margin: 0 auto !important;
	padding: 0 16px !important;
	border: 0 !important;
	border-radius: 14px !important;
	background: #3b2a1e !important;
	color: #fff !important;
	font-family: Roboto, Arial, sans-serif;
	font-size: 15px;
	text-align: left;
	box-shadow: 0 8px 24px rgba(59, 42, 30, 0.3);
	cursor: pointer;
}
.spar-cartbar__count {
	flex: none;
	min-width: 28px;
	height: 28px;
	padding: 0 6px;
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 999px;
	background: #fff;
	color: #3b2a1e;
	font-size: 14px;
	font-weight: 700;
}
.spar-cartbar__text {
	flex: 1;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.spar-cartbar__cta {
	flex: none;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-weight: 700;
}
@keyframes spar-cartbar-bump {
	0%, 100% { transform: translateY(0); }
	35% { transform: translateY(-6px); }
}
.spar-cartbar.is-bump {
	animation: spar-cartbar-bump 0.45s ease;
}
@media (prefers-reduced-motion: reduce) {
	.spar-cart,
	.spar-cartbar.is-bump {
		transition: none;
		animation: none;
	}
}
