/**
 * Sportanen Kinderfeestjes – boekingsmodule in de huisstijl van De Sportanen.
 *
 * Kleuren en lettertypen volgen de design tokens van het Sportanen-thema (--forest, --berry,
 * --mint, ...). Zonder het thema vallen ze terug op dezelfde vaste waarden.
 */

.osbe-wrap {
	--osbe-forest:var(--forest,#246243);
	--osbe-forest-dk:var(--forest-dark,#1a4a32);
	--osbe-apple:var(--apple,#54ba6c);
	--osbe-berry:var(--berry,#b91e47);
	--osbe-blush:var(--blush,#e05b5e);
	--osbe-mint:var(--mint,#d7ecdd);
	--osbe-peach:var(--peach,#f1e6dd);
	--osbe-ink:var(--ink,#1d2b24);
	--osbe-muted:var(--ink-soft,#4b5a52);
	--osbe-line:#cfe3d5;
	--osbe-f-display:var(--f-display,"Grandstander","Trebuchet MS",system-ui,sans-serif);
	--osbe-f-hand:var(--f-hand,"Gochi Hand","Comic Sans MS",cursive);
	--osbe-f-body:var(--f-body,"PT Sans","Segoe UI",system-ui,sans-serif);
	--osbe-shadow:var(--shadow,0 18px 40px -22px rgba(36,99,67,.45));
	--osbe-ok:var(--osbe-apple);
	--osbe-ok-dk:var(--osbe-forest);
	--osbe-ok-bg:var(--osbe-mint);
	--osbe-no-dk:var(--osbe-berry);
	--osbe-no-bg:#fde8e8;
	--osbe-no-br:#f5c6cf;
	max-width:1040px;
	margin-inline:auto;
	font-family:var(--osbe-f-body);
	font-size:1rem;
	line-height:1.55;
	color:var(--osbe-ink);
}
.osbe-wrap *,
.osbe-wrap *::before,
.osbe-wrap *::after {
	box-sizing:border-box;
}
.osbe-ico {
	flex:none;
	vertical-align:-.15em;
}
.osbe-muted {
	font-weight:400;
	color:var(--osbe-muted);
}
.osbe-hint {
	margin:6px 0 0;
	font-size:.85rem;
	color:var(--osbe-muted);
}

/* ── Voortgang: stappen als pillen; eerdere stappen zijn aanklikbaar ──────── */
.osbe-progress {
	list-style:none;
	display:flex;
	gap:6px;
	margin:0 0 20px;
	padding:7px;
	background:var(--osbe-peach);
	border-radius:999px;
}
.osbe-progress-step {
	flex:1;
	min-width:0;
	margin:0;
	transition:flex .3s ease;
}
.osbe-progress-step.active {
	flex:1.6;
}
.osbe-progress-btn {
	width:100%;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:8px;
	padding:9px 12px;
	border:0;
	border-radius:999px;
	background:transparent;
	font-family:var(--osbe-f-display);
	font-weight:700;
	font-size:.9rem;
	color:var(--osbe-muted);
	cursor:default;
	transition:background .25s,color .25s;
}
.osbe-progress-btn:disabled {
	opacity:1;
}
.osbe-progress-step.done .osbe-progress-btn {
	color:var(--osbe-forest);
	cursor:pointer;
}
.osbe-progress-step.done .osbe-progress-btn:hover {
	background:rgba(255,255,255,.7);
}
.osbe-progress-step.active .osbe-progress-btn {
	background:var(--osbe-forest);
	color:#fff;
}
.osbe-step-icon {
	position:relative;
	display:grid;
	place-items:center;
	width:30px;
	height:30px;
	border-radius:50%;
	background:#fff;
	color:var(--osbe-forest);
	font-size:15px;
	flex:none;
}
.osbe-progress-step.active .osbe-step-icon {
	background:var(--osbe-apple);
	color:#fff;
}
.osbe-progress-step.done .osbe-step-icon {
	background:var(--osbe-apple);
	color:#fff;
}
/* Afgeronde stap: vinkje in plaats van het icoon */
.osbe-progress-step.done .osbe-step-icon .osbe-ico {
	opacity:0;
}
.osbe-progress-step.done .osbe-step-icon::after {
	content:"";
	position:absolute;
	inset:0;
	background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-8.5'/%3E%3C/svg%3E") center/16px no-repeat;
}
.osbe-step-lbl {
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}
@media (max-width:900px) {
	.osbe-progress-step:not(.active) .osbe-step-lbl {
		display:none;
	}
	.osbe-progress-step.active {
		flex:3;
	}
}
@media (max-width:420px) {
	.osbe-progress {
		gap:2px;
		padding:5px;
	}
	.osbe-progress-btn {
		padding:7px 6px;
	}
	.osbe-step-icon {
		width:26px;
		height:26px;
	}
}

/* ── Jouw keuze tot nu toe ───────────────────────────────────────────────── */
.osbe-choice-bar {
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:6px 12px;
	margin:0 0 22px;
	padding:10px 16px;
	border:2px dashed var(--osbe-mint);
	border-radius:18px;
	font-size:.92rem;
	color:var(--osbe-ink);
}
.osbe-choice-bar[hidden] {
	display:none;
}
.osbe-choice-lbl {
	font-family:var(--osbe-f-hand);
	font-size:1.05rem;
	color:var(--osbe-blush);
}
.osbe-choice-items i {
	font-style:normal;
	margin:0 8px;
	color:var(--osbe-apple);
	font-weight:700;
}

/* ── Stapwissel ──────────────────────────────────────────────────────────── */
.osbe-step {
	animation:osbe-step-in .35s ease both;
}
@keyframes osbe-step-in {
	from {
		opacity:0;
		transform:translateY(10px);
	}
	to {
		opacity:1;
		transform:none;
	}
}
.osbe-step-count {
	margin:0 0 2px;
	font-family:var(--osbe-f-hand);
	font-size:1.1rem;
	color:var(--osbe-blush);
}
.osbe-step-intro {
	margin:0 0 18px;
	color:var(--osbe-muted);
}
.osbe-step h3:focus {
	outline:none;
}

/* ── Stapkop ─────────────────────────────────────────────────────────────── */
.osbe-step h3,
.osbe-activities h3,
.osbe-addons-heading {
	font-family:var(--osbe-f-display);
	font-weight:800;
	font-size:clamp(1.4rem,2.6vw,1.8rem);
	line-height:1.15;
	color:var(--osbe-forest);
	margin:0 0 8px;
}
.osbe-addons-heading {
	margin-top:8px;
}
.osbe-step-sub {
	font-family:var(--osbe-f-hand);
	font-size:1.15rem;
	color:var(--osbe-blush);
	margin:0 0 18px;
	min-height:1.4em;
}

/* ── Pakketkaarten ───────────────────────────────────────────────────────── */
.osbe-arrangements {
	display:grid;
	grid-template-columns:repeat(var(--osbe-cols,3),minmax(0,1fr));
	gap:20px;
	margin:18px 0 32px;
}
@media (max-width:900px) {
	.osbe-arrangements {
		grid-template-columns:repeat(2,minmax(0,1fr));
	}
}
@media (max-width:560px) {
	.osbe-arrangements {
		grid-template-columns:1fr;
	}
}
.osbe-pkg-card {
	position:relative;
	background:#fff;
	border:2px solid var(--osbe-mint);
	border-radius:28px;
	overflow:hidden;
	cursor:pointer;
	transition:transform .3s cubic-bezier(.3,1.6,.5,1),border-color .2s,box-shadow .2s;
}
.osbe-pkg-card:hover {
	transform:translateY(-5px) rotate(-.5deg);
	border-color:var(--osbe-apple);
	box-shadow:var(--osbe-shadow);
}
.osbe-pkg-card.osbe-pkg-selected {
	border-color:var(--osbe-forest);
	box-shadow:0 0 0 4px var(--osbe-mint),var(--osbe-shadow);
}
.osbe-pkg-card.osbe-pkg-selected::after {
	content:"";
	position:absolute;
	top:14px;
	right:14px;
	width:34px;
	height:34px;
	border-radius:50%;
	background:var(--osbe-forest) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-8.5'/%3E%3C/svg%3E") center/18px no-repeat;
	box-shadow:0 0 0 3px #fff;
}
.osbe-pkg-label {
	display:flex;
	flex-direction:column;
	height:100%;
	cursor:pointer;
}
.osbe-pkg-img {
	position:relative;
	aspect-ratio:16/10;
	overflow:hidden;
	background:var(--osbe-peach);
}
.osbe-pkg-img img {
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
	transition:transform .5s ease;
}
.osbe-pkg-card:hover .osbe-pkg-img img {
	transform:scale(1.05);
}
.osbe-pkg-img-placeholder {
	height:100%;
	display:grid;
	place-items:center;
	color:var(--osbe-forest);
	font-size:42px;
	opacity:.35;
}
.osbe-pkg-tags {
	position:absolute;
	left:12px;
	bottom:12px;
	display:flex;
	flex-wrap:wrap;
	gap:6px;
}
.osbe-pkg-tag {
	background:var(--osbe-berry);
	color:#fff;
	font-family:var(--osbe-f-display);
	font-weight:700;
	font-size:.78rem;
	padding:4px 11px;
	border-radius:999px;
	transform:rotate(-2deg);
}
.osbe-pkg-body {
	flex:1;
	display:flex;
	flex-direction:column;
	gap:8px;
	padding:18px 20px 20px;
}
.osbe-pkg-name {
	font-family:var(--osbe-f-display);
	font-weight:800;
	font-size:1.35rem;
	line-height:1.15;
	color:var(--osbe-forest);
}
.osbe-pkg-days {
	margin:0;
	display:inline-flex;
	align-items:center;
	gap:6px;
	align-self:flex-start;
	padding:3px 10px;
	border-radius:999px;
	background:var(--osbe-mint);
	color:var(--osbe-forest);
	font-size:.82rem;
	font-weight:700;
}
.osbe-pkg-usps {
	list-style:none;
	margin:4px 0 0;
	padding:0;
	display:grid;
	gap:6px;
}
.osbe-pkg-usps li {
	display:flex;
	gap:8px;
	align-items:flex-start;
	font-size:.95rem;
	line-height:1.4;
}
.osbe-pkg-usps li .osbe-ico {
	color:var(--osbe-apple);
	margin-top:.15em;
	font-size:1.05em;
}
.osbe-pkg-footer {
	margin-top:auto;
	padding-top:14px;
	border-top:2px dashed var(--osbe-mint);
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:10px;
	flex-wrap:wrap;
}
.osbe-pkg-price {
	font-family:var(--osbe-f-display);
	font-weight:800;
	font-size:1.6rem;
	color:var(--osbe-forest);
	font-variant-numeric:tabular-nums;
}
.osbe-pkg-price-label {
	font-family:var(--osbe-f-body);
	font-weight:400;
	font-size:.85rem;
	color:var(--osbe-muted);
}
.osbe-pkg-details-btn {
	display:inline-flex;
	align-items:center;
	gap:6px;
	background:transparent;
	border:2px solid var(--osbe-forest);
	color:var(--osbe-forest);
	border-radius:999px;
	padding:7px 14px;
	font-family:var(--osbe-f-display);
	font-weight:700;
	font-size:.85rem;
	cursor:pointer;
	transition:background .2s,color .2s;
}
.osbe-pkg-details-btn:hover {
	background:var(--osbe-forest);
	color:#fff;
}

/* ── Pakketdetails (pop-up) ──────────────────────────────────────────────── */
.osbe-info-modal {
	position:fixed;
	inset:0;
	z-index:99999;
	display:flex;
	align-items:center;
	justify-content:center;
	padding:16px;
	background:rgba(26,74,50,.55);
	backdrop-filter:blur(3px);
}
.osbe-info-modal-inner {
	position:relative;
	width:600px;
	max-width:100%;
	max-height:90vh;
	overflow-y:auto;
	background:#fff;
	border-radius:32px;
	box-shadow:0 30px 80px -20px rgba(0,0,0,.4);
	font-family:var(--osbe-f-body);
	color:var(--osbe-ink);
}
.osbe-modal-img {
	aspect-ratio:16/8;
	overflow:hidden;
}
.osbe-modal-img img {
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
}
.osbe-info-modal-close {
	position:absolute;
	top:14px;
	right:14px;
	z-index:1;
	width:40px;
	height:40px;
	display:grid;
	place-items:center;
	border:0;
	border-radius:50%;
	background:#fff;
	color:var(--osbe-forest);
	font-size:18px;
	cursor:pointer;
	box-shadow:0 6px 16px rgba(0,0,0,.18);
	transition:transform .2s;
}
.osbe-info-modal-close:hover {
	transform:rotate(90deg);
}
.osbe-info-modal-inner h3 {
	font-family:var(--osbe-f-display);
	font-weight:800;
	font-size:1.7rem;
	color:var(--osbe-forest);
	margin:24px 28px 6px;
}
.osbe-modal-price {
	display:flex;
	align-items:center;
	gap:8px;
	margin:0 28px 16px;
	font-family:var(--osbe-f-display);
	font-weight:800;
	font-size:1.25rem;
	color:var(--osbe-berry);
}
.osbe-info-modal-body {
	padding:0 28px;
	line-height:1.7;
}
.osbe-info-modal-body ul,
.osbe-info-modal-body ol {
	padding-left:20px;
	margin:8px 0;
}
.osbe-info-modal-body p {
	margin:0 0 10px;
}
.osbe-modal-footer {
	margin-top:20px;
	padding:20px 28px 28px;
	border-top:2px dashed var(--osbe-mint);
}

/* ── Activiteiten ────────────────────────────────────────────────────────── */
.osbe-activities {
	margin:0 0 32px;
	padding:clamp(18px,3vw,28px);
	background:var(--osbe-mint);
	border-radius:28px;
}
.osbe-act-modes {
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:12px;
	margin-bottom:18px;
}
@media (max-width:640px) {
	.osbe-act-modes {
		grid-template-columns:1fr;
	}
}
.osbe-act-mode {
	position:relative;
	display:flex;
	align-items:flex-start;
	gap:12px;
	padding:16px 18px;
	background:#fff;
	border:2px solid transparent;
	border-radius:22px;
	cursor:pointer;
	transition:border-color .2s,transform .2s;
}
.osbe-act-mode:hover {
	transform:translateY(-2px);
}
.osbe-act-mode input {
	position:absolute;
	opacity:0;
	pointer-events:none;
}
.osbe-act-mode-body {
	display:flex;
	flex-direction:column;
	gap:3px;
	flex:1;
	min-width:0;
}
.osbe-act-mode-body strong {
	display:flex;
	align-items:center;
	gap:8px;
	font-family:var(--osbe-f-display);
	font-weight:700;
	color:var(--osbe-forest);
}
.osbe-act-mode-body small {
	font-size:.85rem;
	color:var(--osbe-muted);
	line-height:1.45;
}
.osbe-act-mode-check,
.osbe-addon-h-check {
	width:26px;
	height:26px;
	flex:none;
	display:grid;
	place-items:center;
	border-radius:50%;
	border:2px solid var(--osbe-line);
	color:transparent;
	font-size:15px;
	transition:background .2s,border-color .2s,color .2s;
}
.osbe-act-mode.osbe-act-mode-active {
	border-color:var(--osbe-forest);
}
.osbe-act-mode.osbe-act-mode-active .osbe-act-mode-check {
	background:var(--osbe-forest);
	border-color:var(--osbe-forest);
	color:#fff;
}
.osbe-act-list,
.osbe-multimax {
	display:flex;
	flex-wrap:wrap;
	gap:10px;
}
.osbe-act-opt,
.osbe-chip {
	display:inline-flex;
	align-items:center;
	gap:8px;
	padding:9px 16px;
	background:#fff;
	border:2px solid var(--osbe-line);
	border-radius:999px;
	font-weight:700;
	font-size:.95rem;
	color:var(--osbe-forest);
	cursor:pointer;
	transition:border-color .2s,background .2s,color .2s,transform .2s;
}
.osbe-act-opt:hover,
.osbe-chip:hover {
	border-color:var(--osbe-apple);
	transform:translateY(-2px);
}
.osbe-act-opt input,
.osbe-chip input {
	margin:0;
	accent-color:var(--osbe-forest);
}
.osbe-act-opt-dur {
	font-size:.8rem;
	font-weight:400;
	color:var(--osbe-muted);
}
.osbe-act-opt.osbe-act-opt-on,
.osbe-chip:has(input:checked) {
	background:var(--osbe-forest);
	border-color:var(--osbe-forest);
	color:#fff;
}
.osbe-act-opt.osbe-act-opt-on .osbe-act-opt-dur,
.osbe-chip:has(input:checked) .osbe-act-opt-dur {
	color:rgba(255,255,255,.8);
}
.osbe-act-opt:has(input:disabled) {
	opacity:.45;
	cursor:not-allowed;
	transform:none;
}
.osbe-act-hint {
	margin:12px 0 0;
	font-size:.9rem;
	color:var(--osbe-muted);
}
.osbe-act-counter {
	font-weight:700;
}
.osbe-act-surprise-note {
	display:flex;
	align-items:center;
	gap:10px;
	margin:0;
	padding:16px 18px;
	background:#fff;
	border:2px dashed var(--osbe-apple);
	border-radius:22px;
}
.osbe-act-surprise-note .osbe-ico {
	color:var(--osbe-berry);
	font-size:20px;
}
.osbe-act-error {
	margin:12px 0 0;
	padding:10px 14px;
	background:var(--osbe-no-bg);
	border-radius:14px;
	color:var(--osbe-no-dk);
	font-size:.9rem;
	font-weight:700;
}

/* ── Extra's ─────────────────────────────────────────────────────────────── */
.osbe-addons-list {
	display:grid;
	gap:12px;
	margin:12px 0 24px;
}
.osbe-addon-h-card {
	display:flex;
	align-items:center;
	background:#fff;
	border:2px solid var(--osbe-mint);
	border-radius:22px;
	overflow:hidden;
	cursor:pointer;
	transition:border-color .2s,transform .2s;
}
.osbe-addon-h-card:hover {
	border-color:var(--osbe-apple);
	transform:translateX(4px);
}
.osbe-addon-h-card input {
	display:none;
}
.osbe-addon-h-card:has(input:checked) {
	border-color:var(--osbe-forest);
	background:#f4faf6;
}
.osbe-addon-h-img {
	width:96px;
	align-self:stretch;
	flex:none;
	overflow:hidden;
}
.osbe-addon-h-img img {
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
}
.osbe-addon-h-body {
	flex:1;
	padding:14px 16px;
}
.osbe-addon-h-body strong {
	display:block;
	font-family:var(--osbe-f-display);
	font-weight:700;
	color:var(--osbe-forest);
}
.osbe-addon-h-body p {
	margin:2px 0 0;
	font-size:.9rem;
	color:var(--osbe-muted);
}
.osbe-addon-h-price {
	display:flex;
	flex-direction:column;
	align-items:flex-end;
	gap:6px;
	padding:14px 16px;
	flex:none;
}
.osbe-addon-h-price span {
	font-family:var(--osbe-f-display);
	font-weight:800;
	color:var(--osbe-berry);
	white-space:nowrap;
}
.osbe-addon-h-card:has(input:checked) .osbe-addon-h-check {
	background:var(--osbe-forest);
	border-color:var(--osbe-forest);
	color:#fff;
}

/* ── Kalender en tijden ──────────────────────────────────────────────────── */
#osbe-step-datum {
	display:grid;
	grid-template-columns:minmax(0,420px) minmax(0,1fr);
	gap:4px 40px;
	align-items:start;
}
#osbe-step-datum > h3,
#osbe-step-datum > .osbe-step-sub {
	grid-column:1 / -1;
}
#osbe-step-datum .osbe-cal-legend {
	grid-column:1;
}
#osbe-step-datum .osbe-time-slots {
	grid-column:2;
	grid-row:3 / span 2;
}
#osbe-step-datum[style*="display: none"],
#osbe-step-datum[style*="display:none"] {
	display:none !important;
}
@media (max-width:760px) {
	#osbe-step-datum {
		grid-template-columns:1fr;
	}
	#osbe-step-datum .osbe-time-slots {
		grid-column:1;
		grid-row:auto;
	}
}
.osbe-calendar {
	background:#fff;
	border:2px solid var(--osbe-mint);
	border-radius:28px;
	padding:18px;
	user-select:none;
}
.osbe-cal-nav {
	display:flex;
	align-items:center;
	justify-content:space-between;
	margin-bottom:12px;
}
.osbe-cal-nav button {
	width:40px;
	height:40px;
	display:grid;
	place-items:center;
	border:0;
	border-radius:50%;
	background:var(--osbe-mint);
	color:var(--osbe-forest);
	font-size:22px;
	line-height:1;
	cursor:pointer;
	transition:background .2s,color .2s;
}
.osbe-cal-nav button:hover {
	background:var(--osbe-forest);
	color:#fff;
}
.osbe-cal-month {
	font-family:var(--osbe-f-display);
	font-weight:800;
	font-size:1.15rem;
	color:var(--osbe-forest);
	text-transform:capitalize;
}
.osbe-cal-grid {
	display:grid;
	grid-template-columns:repeat(7,minmax(0,1fr));
	gap:4px;
}
.osbe-cal-hdr {
	text-align:center;
	font-size:.75rem;
	font-weight:700;
	color:var(--osbe-muted);
	text-transform:uppercase;
	padding:4px 0;
}
.osbe-cal-day {
	aspect-ratio:1;
	display:grid;
	place-items:center;
	border-radius:14px;
	font-size:.95rem;
	color:#a9b5ae;
	font-variant-numeric:tabular-nums;
	border:2px solid transparent;
}
.osbe-cal-avail {
	background:var(--osbe-ok-bg);
	color:var(--osbe-forest);
	font-weight:700;
	cursor:pointer;
	transition:transform .15s,background .15s;
}
.osbe-cal-avail:hover {
	background:var(--osbe-apple);
	color:#fff;
	transform:scale(1.06);
}
.osbe-cal-full {
	background:var(--osbe-no-bg);
	color:var(--osbe-no-dk);
	font-weight:700;
	text-decoration:line-through;
	cursor:not-allowed;
}
.osbe-cal-past {
	color:#d3dbd6;
}
.osbe-cal-selected {
	background:var(--osbe-berry) !important;
	color:#fff !important;
	border-color:var(--osbe-berry) !important;
}
.osbe-cal-loading {
	text-align:center;
	color:var(--osbe-muted);
	font-size:.9rem;
	padding:12px 0;
}
.osbe-cal-legend {
	list-style:none;
	display:flex;
	flex-wrap:wrap;
	gap:8px 18px;
	margin:14px 0 0;
	padding:0;
}
.osbe-cal-legend li {
	display:flex;
	align-items:center;
	gap:7px;
	font-size:.85rem;
	color:var(--osbe-muted);
}
.osbe-legend-dot {
	width:14px;
	height:14px;
	border-radius:5px;
	flex:none;
	border:2px solid transparent;
}
.osbe-legend-free {
	background:var(--osbe-ok-bg);
}
.osbe-legend-full {
	background:var(--osbe-no-bg);
}
.osbe-legend-sel {
	background:var(--osbe-berry);
}
.osbe-legend-none {
	background:#fff;
	border-color:var(--osbe-line);
}
.osbe-time-slots {
	margin-top:0;
	padding:22px;
	background:var(--osbe-peach);
	border-radius:28px;
}
.osbe-time-slots h4 {
	font-family:var(--osbe-f-display);
	font-weight:800;
	font-size:1.2rem;
	color:var(--osbe-forest);
	margin:0 0 12px;
}
.osbe-times-grid {
	display:flex;
	flex-wrap:wrap;
	gap:10px;
}
.osbe-time-btn {
	padding:11px 20px;
	background:#fff;
	border:2px solid transparent;
	border-radius:999px;
	font-family:var(--osbe-f-display);
	font-weight:700;
	font-size:.95rem;
	color:var(--osbe-forest);
	cursor:pointer;
	font-variant-numeric:tabular-nums;
	transition:border-color .2s,background .2s,color .2s,transform .2s;
}
.osbe-time-btn:hover {
	border-color:var(--osbe-apple);
	transform:translateY(-2px);
}
.osbe-time-btn.active {
	background:var(--osbe-forest);
	border-color:var(--osbe-forest);
	color:#fff;
}

/* ── Formulier ───────────────────────────────────────────────────────────── */
.osbe-fields-grid {
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:18px;
	margin:18px 0 22px;
}
@media (max-width:560px) {
	.osbe-fields-grid {
		grid-template-columns:1fr;
	}
}
.osbe-field {
	display:flex;
	flex-direction:column;
	min-width:0;
}
.osbe-field-full {
	grid-column:1 / -1;
}
.osbe-field > label {
	font-family:var(--osbe-f-display);
	font-weight:700;
	font-size:.95rem;
	color:var(--osbe-forest);
	margin-bottom:6px;
}
.osbe-field input:not([type="checkbox"]):not([type="radio"]),
.osbe-field textarea,
.osbe-field select,
.osbe-discount-row input {
	width:100%;
	padding:13px 16px;
	border:2px solid var(--osbe-line);
	border-radius:16px;
	background:#fff;
	font:inherit;
	color:var(--osbe-ink);
	transition:border-color .2s,box-shadow .2s;
}
.osbe-field input:focus,
.osbe-field textarea:focus,
.osbe-field select:focus,
.osbe-discount-row input:focus {
	outline:none;
	border-color:var(--osbe-forest);
	box-shadow:0 0 0 4px var(--osbe-mint);
}
.osbe-req {
	color:var(--osbe-berry);
}
.osbe-check-label {
	display:flex;
	align-items:center;
	gap:8px;
	cursor:pointer;
	font-weight:400;
}
.osbe-check-label input,
.osbe-terms input {
	width:20px;
	height:20px;
	accent-color:var(--osbe-forest);
}

/* ── Kortingscode ────────────────────────────────────────────────────────── */
.osbe-discount-row {
	display:flex;
	gap:10px;
	align-items:center;
	max-width:520px;
}
#osbe-code-msg {
	margin:8px 0 0;
	font-size:.9rem;
	font-weight:700;
	min-height:1.4em;
}
#osbe-code-msg.is-ok {
	color:var(--osbe-forest);
}
#osbe-code-msg.is-error {
	color:var(--osbe-berry);
}

/* ── Samenvatting ────────────────────────────────────────────────────────── */
.osbe-summary {
	background:var(--osbe-peach);
	border-radius:28px;
	padding:clamp(18px,3vw,28px);
	margin:16px 0 22px;
}
.osbe-sum-row {
	display:flex;
	justify-content:space-between;
	align-items:baseline;
	gap:16px;
	padding:9px 0;
	font-size:.98rem;
}
.osbe-sum-row + .osbe-sum-row {
	border-top:1px dashed rgba(36,99,67,.25);
}
.osbe-sum-row span {
	color:var(--osbe-muted);
}
.osbe-sum-row strong {
	text-align:right;
	font-variant-numeric:tabular-nums;
}
.osbe-sum-total {
	margin-top:6px;
	padding-top:14px !important;
	border-top:2px solid var(--osbe-forest) !important;
	font-family:var(--osbe-f-display);
	font-size:1.3rem;
}
.osbe-sum-total span,
.osbe-sum-total strong {
	color:var(--osbe-forest);
	font-weight:800;
}
.osbe-terms {
	margin-bottom:20px;
}
.osbe-terms label {
	display:block;
	padding-left:30px;
	text-indent:-30px;
	cursor:pointer;
}
.osbe-terms input {
	margin:0 10px 0 0;
	vertical-align:-4px;
}
.osbe-terms a {
	color:var(--osbe-berry);
	font-weight:700;
}
.osbe-error {
	background:var(--osbe-no-bg);
	border-radius:16px;
	color:var(--osbe-no-dk);
	font-weight:700;
	padding:12px 16px;
	margin:0 0 16px;
}

/* ── Knoppen (zelfde vorm als de knoppen van het thema) ──────────────────── */
.osbe-nav {
	display:flex;
	justify-content:space-between;
	gap:12px;
	margin-top:28px;
	padding-top:22px;
	border-top:2px dashed var(--osbe-mint);
}
.osbe-btn {
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:8px;
	padding:.85em 1.5em;
	border:2px solid transparent;
	border-radius:999px;
	font-family:var(--osbe-f-display);
	font-weight:700;
	font-size:1rem;
	line-height:1.1;
	cursor:pointer;
	transition:transform .2s,background .2s,color .2s,border-color .2s;
}
.osbe-btn:hover {
	transform:translateY(-2px);
}
.osbe-btn:disabled {
	opacity:.6;
	cursor:not-allowed;
	transform:none;
}
.osbe-btn-primary,
#osbe-next,
#osbe-pay-btn {
	background:var(--osbe-berry);
	color:#fff;
}
.osbe-btn-primary:hover,
#osbe-next:hover,
#osbe-pay-btn:hover {
	background:#a01a3d;
}
#osbe-pay-btn {
	font-size:1.1rem;
	padding:.95em 2em;
}
.osbe-btn-secondary {
	background:var(--osbe-forest);
	color:#fff;
}
.osbe-btn-secondary:hover {
	background:var(--osbe-forest-dk);
}
#osbe-prev {
	background:transparent;
	border-color:var(--osbe-forest);
	color:var(--osbe-forest);
}
#osbe-prev:hover {
	background:var(--osbe-forest);
	color:#fff;
}
#osbe-next {
	margin-left:auto;
}

/* ── Boeken gesloten ─────────────────────────────────────────────────────── */
.osbe-wrap.osbe-closed {
	display:flex;
	justify-content:center;
}
.osbe-closed-card {
	width:100%;
	max-width:540px;
	text-align:center;
	background:#fff;
	border-radius:32px;
	box-shadow:var(--osbe-shadow);
	padding:40px 28px;
}
.osbe-closed-icon {
	display:inline-grid;
	place-items:center;
	width:68px;
	height:68px;
	margin-bottom:16px;
	border-radius:50%;
	background:var(--osbe-mint);
	color:var(--osbe-forest);
	font-size:30px;
}
.osbe-closed-card h3 {
	margin:0 0 8px;
	font-family:var(--osbe-f-display);
	font-weight:800;
	font-size:1.5rem;
	color:var(--osbe-forest);
}
.osbe-closed-card p {
	margin:0;
	color:var(--osbe-muted);
}

@media (prefers-reduced-motion:reduce) {
	.osbe-wrap *,
	.osbe-info-modal * {
		transition:none !important;
	}
}
.osbe-nav-msg {
	margin:20px 0 0;
}

@media (prefers-reduced-motion:reduce) {
	.osbe-step {
		animation:none;
	}
}
.osbe-nav .osbe-btn {
	white-space:nowrap;
}
@media (max-width:900px) {
	.osbe-progress-step.active {
		flex:0 0 auto;
	}
}
@media (max-width:480px) {
	.osbe-nav {
		gap:8px;
	}
	.osbe-nav .osbe-btn {
		padding:.8em 1.05em;
		font-size:.92rem;
	}
	.osbe-choice-bar {
		font-size:.85rem;
		padding:8px 12px;
	}
}