/* Inschrijfformulier op de activiteitpagina */

.tsm-registration {
	margin: 1.5em 0;
}

.tsm-form fieldset {
	border: 0;
	padding: 0;
	margin: 0 0 1.5em;
}

.tsm-form legend {
	font-weight: 600;
	margin-bottom: 0.5em;
}

.tsm-session-card {
	display: block;
	border: 1px solid #c3c4c7;
	border-radius: 6px;
	padding: 0.75em 1em;
	margin-bottom: 0.5em;
	cursor: pointer;
}

.tsm-session-card:has(.tsm-session-input:checked) {
	border-color: currentColor;
	box-shadow: 0 0 0 1px currentColor;
}

.tsm-session-card.is-full {
	opacity: 0.55;
	cursor: not-allowed;
}

.tsm-session-card input {
	margin-right: 0.5em;
}

.tsm-session-label {
	font-weight: 600;
}

.tsm-session-date,
.tsm-session-location,
.tsm-session-price,
.tsm-session-stock {
	display: block;
	font-size: 0.9em;
	margin-left: 1.6em;
}

.tsm-session-stock {
	color: #1a7a2e;
}

.is-full .tsm-session-stock {
	color: #b32d2e;
}

.tsm-qty {
	display: flex;
	align-items: center;
	gap: 0.75em;
	margin: 0 0 0.5em;
}

.tsm-qty input {
	width: 5.5em;
}

.tsm-rates label {
	display: block;
	margin-bottom: 0.35em;
}

.tsm-hint {
	font-size: 0.9em;
	opacity: 0.75;
	margin: 0.25em 0 0;
}

.tsm-bundle-note {
	font-size: 0.95em;
	margin: 0 0 1.5em;
}

.tsm-bundle-note.is-active {
	font-weight: 600;
}

.tsm-total {
	font-size: 1.15em;
	font-weight: 600;
}

/* Checkout: samenvatting en deelnemersblokken */

.tsm-checkout-summary {
	border: 1px solid #c3c4c7;
	border-radius: 6px;
	padding: 0.75em 1em;
	margin-bottom: 1.5em;
}

.tsm-participant {
	border: 1px solid #c3c4c7;
	border-radius: 6px;
	padding: 1em 1.25em;
	margin: 0 0 1.5em;
}

.tsm-participant legend {
	font-weight: 600;
	padding: 0 0.5em;
}

.tsm-participant-sessions {
	font-size: 0.9em;
	opacity: 0.75;
	margin: 0 0 0.75em;
}

.tsm-copy-tools {
	margin: 0 0 1em;
}

.tsm-field {
	margin: 0 0 1em;
}

.tsm-field label {
	display: block;
	font-weight: 600;
	margin-bottom: 0.25em;
}

.tsm-field-instructions {
	display: block;
	font-size: 0.9em;
	opacity: 0.75;
	margin-bottom: 0.25em;
}

.tsm-field input[type="text"],
.tsm-field input[type="email"],
.tsm-field input[type="number"],
.tsm-field input[type="date"],
.tsm-field select,
.tsm-field textarea {
	width: 100%;
	max-width: 100%;
}

.tsm-field-half {
	display: inline-block;
	width: calc(50% - 0.5em);
	vertical-align: top;
}

.tsm-field-half + .tsm-field-half {
	margin-left: 1em;
}

.tsm-choices .tsm-choice {
	display: block;
	font-weight: 400;
	margin-bottom: 0.25em;
}

.tsm-field .tsm-choice input {
	margin-right: 0.4em;
}

.tsm-order-fields {
	margin: 1.5em 0;
}

.tsm-thankyou {
	margin: 1.5em 0;
}

.tsm-thankyou ul {
	list-style: none;
	padding: 0;
}

.tsm-thankyou li {
	margin-bottom: 0.75em;
}

/* Toegankelijkheid: zichtbare focus voor toetsenbordnavigatie */

.tsm-session-card:focus-within {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

.tsm-form input:focus-visible,
.tsm-form select:focus-visible,
.tsm-form textarea:focus-visible,
.tsm-checkout input:focus-visible,
.tsm-checkout select:focus-visible,
.tsm-checkout textarea:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 1px;
}

/* Mobiel: velden onder elkaar en ruimere aanraakvlakken */

@media (max-width: 600px) {
	.tsm-field-half {
		display: block;
		width: 100%;
	}

	.tsm-field-half + .tsm-field-half {
		margin-left: 0;
	}

	.tsm-session-card {
		padding: 1em;
	}

	.tsm-choices .tsm-choice {
		padding: 0.35em 0;
	}

	.tsm-qty {
		flex-wrap: wrap;
	}

	.tsm-qty input {
		width: 100%;
		max-width: 8em;
	}

	.tsm-participant {
		padding: 1em;
	}
}