/* Sport Skills Leden: alleen geladen bij een leden-shortcode, afgeschermde pagina of video.
 * Huisstijl: navy #0A091E, blauw #14AAF3, tekstblauw #0A72B5, lichtgrijs #EFEFF0, grijs #5B5D6E.
 * Mobiel eerst, koppen in hoofdletters, geen schaduwen of verlopen, knoppen minimaal 44px. */
.ss-leden,
.ss-leden-player {
	--ss-leden-navy: #0A091E;
	--ss-leden-blauw: #14AAF3;
	--ss-leden-blauw-hover: #0F98DA;
	--ss-leden-link: #0A72B5;
	--ss-leden-grijs: #EFEFF0;
	--ss-leden-rand: #C9C9D0;
	--ss-leden-tekst-zacht: #5B5D6E;
	--ss-leden-rood: #B3261E;
	--ss-leden-radius: 4px;
}

.ss-leden {
	box-sizing: border-box;
	max-width: 36rem;
	margin: 1.5em 0;
	padding: 1.5em;
	background: var(--ss-leden-grijs);
	border-radius: var(--ss-leden-radius);
	color: var(--ss-leden-navy);
	font: inherit;
	line-height: 1.5;
}

.ss-leden--breed {
	max-width: none;
}

.ss-leden *,
.ss-leden *::before,
.ss-leden *::after {
	box-sizing: inherit;
}

.ss-leden p {
	margin: 0 0 1em;
}

.ss-leden > :last-child,
.ss-leden form > :last-child,
.ss-leden-sectie > :last-child {
	margin-bottom: 0;
}

.ss-leden a {
	color: var(--ss-leden-link);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.ss-leden a:hover {
	text-decoration-thickness: 2px;
}

.ss-leden a:focus-visible,
.ss-leden button:focus-visible,
.ss-leden input:focus-visible,
.ss-leden select:focus-visible,
.ss-leden textarea:focus-visible,
.ss-leden summary:focus-visible,
.ss-leden-player button:focus-visible {
	outline: 2px solid var(--ss-leden-navy);
	outline-offset: 2px;
}

.ss-leden-melding__tekst,
.ss-leden-welkom {
	font-weight: 600;
}

.ss-leden-welkom {
	font-size: 1.15em;
}

.ss-leden-klein {
	font-size: 0.875em;
	color: var(--ss-leden-tekst-zacht);
}

.ss-leden-notice {
	padding: 0.6em 0.9em;
	background: #fff;
	border-left: 4px solid var(--ss-leden-blauw);
	border-radius: var(--ss-leden-radius);
}

/* Formulieren (wp_login_form, agenda) */
.ss-leden form label {
	display: block;
	margin-bottom: 0.3em;
	font-weight: 600;
}

.ss-leden input[type="text"],
.ss-leden input[type="password"],
.ss-leden input[type="email"],
.ss-leden select,
.ss-leden textarea {
	display: block;
	width: 100%;
	max-width: 24rem;
	min-height: 44px;
	padding: 0.6em 0.75em;
	border: 1px solid var(--ss-leden-rand);
	border-radius: var(--ss-leden-radius);
	background: #fff;
	color: var(--ss-leden-navy);
	font: inherit;
}

.ss-leden input[type="text"]:focus,
.ss-leden input[type="password"]:focus,
.ss-leden input[type="email"]:focus,
.ss-leden select:focus,
.ss-leden textarea:focus {
	border-color: var(--ss-leden-blauw);
}

.ss-leden .login-remember label {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	font-weight: 400;
}

/* Knoppen: blauw met navy tekst */
.ss-leden input[type="submit"],
.ss-leden button,
.ss-leden .ss-leden-knop {
	display: inline-block;
	min-height: 44px;
	padding: 0.7em 1.4em;
	border: 0;
	border-radius: var(--ss-leden-radius);
	background: var(--ss-leden-blauw);
	color: var(--ss-leden-navy);
	font: inherit;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
}

.ss-leden input[type="submit"]:hover,
.ss-leden button:hover,
.ss-leden .ss-leden-knop:hover {
	background: var(--ss-leden-blauw-hover);
	color: var(--ss-leden-navy);
	text-decoration: none;
}

.ss-leden .ss-leden-knop--secundair {
	background: #fff;
	border: 1px solid var(--ss-leden-rand);
	font-weight: 600;
}

.ss-leden .ss-leden-knop--secundair:hover {
	background: #fff;
	border-color: var(--ss-leden-blauw);
}

/* Dashboardsecties */
.ss-leden-sectie {
	margin: 0 0 1.75em;
}

.ss-leden .ss-leden-sectie__kop,
.ss-leden .ss-leden-week {
	margin: 0 0 0.6em;
	font-size: 1.1em;
	font-weight: 800;
	line-height: 1.3;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: var(--ss-leden-navy);
}

.ss-leden .ss-leden-week {
	margin-top: 1.5em;
	font-size: 1em;
}

.ss-leden-sectie__meer {
	margin-top: 0.6em;
	font-weight: 600;
}

/* Paginalijst */
.ss-leden-lijst {
	margin: 0 0 1.25em;
	padding: 0;
	list-style: none;
}

.ss-leden-lijst li {
	margin: 0 0 0.5em;
	padding: 0;
}

.ss-leden-lijst a {
	display: block;
	padding: 0.65em 0.9em;
	background: #fff;
	border-radius: var(--ss-leden-radius);
	text-decoration: none;
}

.ss-leden-lijst a:hover {
	text-decoration: underline;
}

/* Mededelingen */
.ss-leden-mededeling {
	margin: 0 0 0.75em;
	padding: 0.9em 1.1em;
	background: #fff;
	border-radius: var(--ss-leden-radius);
}

.ss-leden-mededeling.is-vast {
	border-left: 4px solid var(--ss-leden-blauw);
}

.ss-leden .ss-leden-mededeling__titel {
	margin: 0 0 0.2em;
	font-size: 1em;
	line-height: 1.35;
	color: var(--ss-leden-navy);
}

.ss-leden-mededeling__meta {
	font-size: 0.85em;
	color: var(--ss-leden-tekst-zacht);
}

.ss-leden-mededeling .ss-leden-mededeling__meta {
	margin-bottom: 0.5em;
}

.ss-leden-mededeling__tekst > :last-child {
	margin-bottom: 0;
}

/* Agenda */
.ss-leden-ical {
	margin: 0 0 1em;
}

.ss-leden-ical__uitleg summary {
	cursor: pointer;
	color: var(--ss-leden-link);
	font-weight: 600;
}

.ss-leden-ical__uitleg[open] {
	margin-bottom: 1em;
	padding: 0.9em 1.1em;
	background: #fff;
	border-radius: var(--ss-leden-radius);
}

.ss-leden-ical__uitleg[open] summary {
	margin-bottom: 0.75em;
}

.ss-leden input.ss-leden-ical__url {
	max-width: 100%;
	font-size: 0.85em;
}

.ss-leden-trainingen {
	margin: 0;
	padding: 0;
	list-style: none;
}

.ss-leden-training {
	display: flex;
	gap: 1em;
	margin: 0 0 0.5em;
	padding: 0.75em 1em;
	background: #fff;
	border-radius: var(--ss-leden-radius);
}

.ss-leden-training__wanneer {
	display: flex;
	flex: 0 0 7.5em;
	flex-direction: column;
	font-weight: 600;
}

.ss-leden-training__tijd {
	font-weight: 400;
	font-variant-numeric: tabular-nums;
	color: var(--ss-leden-tekst-zacht);
}

.ss-leden-training__wat {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	min-width: 0;
}

.ss-leden-training__titel {
	font-weight: 600;
}

.ss-leden-training__meta,
.ss-leden-training__notitie {
	font-size: 0.9em;
	color: var(--ss-leden-tekst-zacht);
}

.ss-leden-training__notitie {
	margin-top: 0.25em;
}

.ss-leden-training.is-afgelast .ss-leden-training__dag,
.ss-leden-training.is-afgelast .ss-leden-training__tijd,
.ss-leden-training.is-afgelast .ss-leden-training__titel {
	text-decoration: line-through;
	text-decoration-thickness: 2px;
	color: var(--ss-leden-tekst-zacht);
}

.ss-leden-label {
	display: inline-block;
	align-self: flex-start;
	margin: 0.15em 0;
	padding: 0.1em 0.5em;
	border-radius: var(--ss-leden-radius);
	font-size: 0.8em;
	font-weight: 700;
	line-height: 1.5;
	vertical-align: 0.1em;
}

.ss-leden-label--afgelast {
	background: var(--ss-leden-rood);
	color: #fff;
}

/* Video's */
.ss-leden-filter ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em;
	margin: 0 0 1.25em;
	padding: 0;
	list-style: none;
}

.ss-leden .ss-leden-filter__knop {
	display: inline-block;
	padding: 0.45em 0.9em;
	background: #fff;
	border-radius: var(--ss-leden-radius);
	color: var(--ss-leden-navy);
	font-weight: 600;
	text-decoration: none;
}

.ss-leden .ss-leden-filter__knop:hover {
	outline: 2px solid var(--ss-leden-blauw);
	outline-offset: -2px;
}

.ss-leden .ss-leden-filter__knop.is-actief {
	background: var(--ss-leden-blauw);
	color: var(--ss-leden-navy);
}

.ss-leden-videos {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 14rem), 1fr));
	gap: 1em;
	margin: 0 0 1.25em;
	padding: 0;
	list-style: none;
}

.ss-leden-videos--compact {
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 11rem), 1fr));
	gap: 0.75em;
}

.ss-leden-video {
	margin: 0;
	padding: 0;
}

.ss-leden .ss-leden-video__link {
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	background: #fff;
	border-radius: var(--ss-leden-radius);
	color: var(--ss-leden-navy);
	text-decoration: none;
}

.ss-leden-video__beeld {
	position: relative;
	display: block;
	aspect-ratio: 16 / 9;
	background: var(--ss-leden-navy);
}

.ss-leden-video__beeld img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ss-leden-video__play {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 2.75em;
	height: 2.75em;
	margin: -1.375em 0 0 -1.375em;
	background: var(--ss-leden-blauw);
	border-radius: 50%;
	opacity: 0.92;
}

.ss-leden-video__play::after,
.ss-leden-player__icoon::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 54%;
	border-style: solid;
	border-width: 0.5em 0 0.5em 0.8em;
	border-color: transparent transparent transparent var(--ss-leden-navy);
	transform: translate(-50%, -50%);
}

.ss-leden-video__tekst {
	display: flex;
	flex-direction: column;
	gap: 0.2em;
	padding: 0.65em 0.8em 0.8em;
}

.ss-leden-video__titel {
	font-weight: 600;
	line-height: 1.35;
}

.ss-leden .ss-leden-video__link:hover .ss-leden-video__titel {
	color: var(--ss-leden-link);
	text-decoration: underline;
}

.ss-leden-video__cat {
	font-size: 0.85em;
	color: var(--ss-leden-tekst-zacht);
}

.ss-leden-paginering {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75em;
}

/* Video-bibliotheek (2.1): zoeken, badges, bekeken, lightbox */
.ss-leden-sr {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.ss-leden-video-balk {
	margin: 0 0 1.25em;
}

.ss-leden-video-zoek {
	margin: 0 0 1em;
}

.ss-leden .ss-leden-video-zoek__label {
	display: block;
	margin: 0 0 0.35em;
	font-size: 0.85em;
	font-weight: 700;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}

.ss-leden-video-zoek__rij {
	display: flex;
	gap: 0.5em;
	max-width: 32rem;
}

.ss-leden .ss-leden-video-zoek__veld {
	flex: 1 1 auto;
	min-width: 0;
	min-height: 44px;
	padding: 0.5em 0.75em;
	border: 1px solid var(--ss-leden-rand);
	border-radius: var(--ss-leden-radius);
	background: #fff;
	color: var(--ss-leden-navy);
	font: inherit;
}

.ss-leden .ss-leden-video-zoek__veld:focus {
	border-color: var(--ss-leden-blauw);
	outline: 2px solid var(--ss-leden-blauw);
	outline-offset: -1px;
}

.ss-leden .ss-leden-video-zoek__knop {
	flex: 0 0 auto;
	width: auto;
}

.ss-leden-video-zoek__wis {
	display: inline-block;
	margin-top: 0.4em;
	font-size: 0.9em;
	color: var(--ss-leden-link);
}

.ss-leden-video-filter ul {
	margin-bottom: 0;
}

.ss-leden-video-aantal,
.ss-leden-video-leeg {
	margin: 0 0 1em;
	color: var(--ss-leden-tekst-zacht);
}

.ss-leden-video {
	display: flex;
	flex-direction: column;
}

.ss-leden-video.is-bekeken .ss-leden-video__beeld img {
	opacity: 0.6;
}

.ss-leden-video__nieuw,
.ss-leden-video__duur {
	position: absolute;
	padding: 0.15em 0.5em;
	border-radius: var(--ss-leden-radius);
	font-size: 0.75em;
	font-weight: 700;
	line-height: 1.4;
}

.ss-leden-video__nieuw {
	top: 0.5em;
	left: 0.5em;
	background: var(--ss-leden-blauw);
	color: var(--ss-leden-navy);
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.ss-leden-video__duur {
	right: 0.5em;
	bottom: 0.5em;
	background: var(--ss-leden-navy);
	color: #fff;
	font-variant-numeric: tabular-nums;
}

.ss-leden-video__bekeken-label {
	align-self: flex-start;
	margin-top: 0.2em;
	padding: 0 0.45em;
	border-radius: var(--ss-leden-radius);
	background: var(--ss-leden-grijs);
	font-size: 0.75em;
	font-weight: 700;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}

.ss-leden-video__bekeken {
	margin: 0.4em 0 0;
}

.ss-leden .ss-leden-video__bekeken-knop {
	width: 100%;
	min-height: 44px;
	padding: 0.5em 0.8em;
	font-size: 0.9em;
}

.ss-leden .ss-leden-video__bekeken-knop[aria-pressed="true"] {
	border-color: var(--ss-leden-blauw);
}

.ss-leden-video-lightbox {
	box-sizing: border-box;
	width: min(60rem, calc(100% - 2rem));
	max-width: none;
	max-height: calc(100% - 2rem);
	margin: auto;
	padding: 0;
	overflow: auto;
	border: 0;
	border-radius: var(--ss-leden-radius);
	background: var(--ss-leden-navy);
	color: #fff;
}

.ss-leden-video-lightbox::backdrop {
	background: rgba(10, 9, 30, 0.88);
}

.ss-leden-video-lightbox__kop {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1em;
	padding: 0.5em 0.5em 0.5em 1em;
}

.ss-leden .ss-leden-video-lightbox__titel {
	margin: 0;
	color: #fff;
	font-size: 1em;
	font-weight: 800;
	line-height: 1.3;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}

.ss-leden .ss-leden-video-lightbox__sluit {
	flex: 0 0 auto;
	width: 44px;
	min-width: 44px;
	height: 44px;
	padding: 0;
	background: transparent;
	color: #fff;
	font-size: 1.75em;
	line-height: 1;
}

.ss-leden .ss-leden-video-lightbox__sluit:hover,
.ss-leden .ss-leden-video-lightbox__sluit:focus-visible {
	background: var(--ss-leden-blauw);
	color: var(--ss-leden-navy);
}

.ss-leden-video-lightbox .ss-leden-player {
	margin: 0;
}

.ss-leden-video-lightbox .ss-leden-player__scherm {
	border-radius: 0;
}

.ss-leden-video-lightbox .ss-leden-player__melding {
	margin: 0;
	padding: 0.5em 1em 0;
	color: #c9c9d0;
}

.ss-leden-video-lightbox__meer {
	margin: 0;
	padding: 0.75em 1em 1em;
}

.ss-leden .ss-leden-video-lightbox__meer a {
	color: #fff;
	font-weight: 600;
}

/* Speler op de losse videopagina */
.ss-leden-player {
	margin: 0 0 1.5em;
}

.ss-leden-player__scherm {
	position: relative;
	overflow: hidden;
	aspect-ratio: 16 / 9;
	background: var(--ss-leden-navy);
	border-radius: var(--ss-leden-radius);
}

.ss-leden-player__beeld,
.ss-leden-player__iframe {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
	object-fit: cover;
}

.ss-leden-player__beeld {
	opacity: 0.8;
}

.ss-leden-player__knop {
	position: absolute;
	top: 50%;
	left: 50%;
	display: inline-flex;
	align-items: center;
	gap: 0.6em;
	padding: 0.75em 1.4em 0.75em 0.9em;
	border: 0;
	border-radius: var(--ss-leden-radius);
	background: var(--ss-leden-blauw);
	color: var(--ss-leden-navy);
	font: inherit;
	font-weight: 700;
	line-height: 1.2;
	cursor: pointer;
	transform: translate(-50%, -50%);
}

.ss-leden-player__knop:hover {
	background: var(--ss-leden-blauw-hover);
}

.ss-leden-player__icoon {
	position: relative;
	display: inline-block;
	width: 1.6em;
	height: 1.6em;
	background: #fff;
	border-radius: 50%;
	font-size: 0.85em;
}

.ss-leden-player__melding {
	margin: 0.5em 0 0;
	font-size: 0.85em;
	color: var(--ss-leden-tekst-zacht);
}

.ss-leden-player.is-actief .ss-leden-player__melding {
	display: none;
}

@media (max-width: 480px) {
	.ss-leden {
		padding: 1.1em;
	}

	.ss-leden input[type="submit"],
	.ss-leden .ss-leden-knop {
		width: 100%;
		text-align: center;
	}

	.ss-leden-training {
		flex-direction: column;
		gap: 0.25em;
	}

	.ss-leden-training__wanneer {
		flex: none;
		flex-direction: row;
		gap: 0.5em;
	}
}

.ss-leden .ss-leden-video__link:hover {
	outline: 2px solid var(--ss-leden-blauw);
	outline-offset: 0;
}

/* ==================================================================
 * 2.0: spelers, aanwezigheid, huiswerk en vragen
 * ================================================================== */

.ss-leden textarea {
	max-width: 100%;
	min-height: 7em;
	resize: vertical;
	line-height: 1.5;
}

.ss-leden select {
	max-width: 100%;
}

.ss-leden .ss-leden-filter__knop {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
}

.ss-leden-notice.is-fout {
	border-left-color: var(--ss-leden-rood);
}

.ss-leden-terug {
	font-weight: 600;
}

.ss-leden .ss-leden-label--nieuw {
	background: var(--ss-leden-blauw);
	color: var(--ss-leden-navy);
}

.ss-leden .ss-leden-label--trainer {
	background: var(--ss-leden-navy);
	color: #fff;
}

.ss-leden-tellers {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em;
}

/* Spelerkeuze (tabs) */
.ss-leden-spelerkeuze ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em;
	margin: 0 0 1.5em;
	padding: 0;
	list-style: none;
}

.ss-leden .ss-leden-spelerkeuze__tab {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0.5em 1.1em;
	background: #fff;
	border: 1px solid var(--ss-leden-rand);
	border-radius: var(--ss-leden-radius);
	color: var(--ss-leden-navy);
	font-weight: 700;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

.ss-leden .ss-leden-spelerkeuze__tab:hover {
	border-color: var(--ss-leden-blauw);
}

.ss-leden .ss-leden-spelerkeuze__tab.is-actief {
	background: var(--ss-leden-navy);
	border-color: var(--ss-leden-navy);
	color: #fff;
}

/* Uitklapbare sectie (eerder, afgelopen week) */
.ss-leden-uitklap > summary {
	cursor: pointer;
	min-height: 44px;
	padding: 0.6em 0;
	list-style-position: inside;
}

/* Status van een speler */
.ss-leden-status {
	display: inline-block;
	padding: 0.15em 0.6em;
	border-radius: var(--ss-leden-radius);
	font-size: 0.8em;
	font-weight: 700;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	background: var(--ss-leden-grijs);
	color: var(--ss-leden-navy);
}

.ss-leden-status--aanwezig {
	background: var(--ss-leden-blauw);
	color: var(--ss-leden-navy);
}

.ss-leden-status--afwezig {
	background: var(--ss-leden-navy);
	color: #fff;
}

.ss-leden-status--afgemeld {
	background: var(--ss-leden-tekst-zacht);
	color: #fff;
}

/* Afmelden bij een training */
.ss-leden-afmeld {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5em;
	margin-top: 0.6em;
}

.ss-leden-afmeld__reden {
	font-size: 0.9em;
	color: var(--ss-leden-tekst-zacht);
}

.ss-leden-afmeld__details {
	flex: 1 1 100%;
}

.ss-leden-afmeld__details > summary {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0.5em 1.1em;
	border: 1px solid var(--ss-leden-rand);
	border-radius: var(--ss-leden-radius);
	background: #fff;
	color: var(--ss-leden-navy);
	font-weight: 700;
	cursor: pointer;
	list-style: none;
}

.ss-leden-afmeld__details > summary::-webkit-details-marker {
	display: none;
}

.ss-leden-afmeld__details > summary:hover {
	border-color: var(--ss-leden-blauw);
}

.ss-leden-afmeld__details[open] > summary {
	margin-bottom: 0.6em;
}

.ss-leden .ss-leden-afmeld__form {
	margin: 0;
}

.ss-leden .ss-leden-afmeld__form input[type="text"] {
	margin-bottom: 0.6em;
}

/* Trainerweergave: lijst met trainingen */
.ss-leden-trainerlijst {
	margin: 0 0 1em;
	padding: 0;
	list-style: none;
}

.ss-leden-trainerlijst li {
	margin: 0 0 0.5em;
}

.ss-leden .ss-leden-trainerlijst__link {
	display: flex;
	flex-direction: column;
	gap: 0.15em;
	min-height: 44px;
	padding: 0.8em 1em;
	background: #fff;
	border-left: 4px solid var(--ss-leden-blauw);
	border-radius: var(--ss-leden-radius);
	color: var(--ss-leden-navy);
	text-decoration: none;
}

.ss-leden .ss-leden-trainerlijst__link:hover .ss-leden-trainerlijst__titel {
	color: var(--ss-leden-link);
	text-decoration: underline;
}

.ss-leden .ss-leden-trainerlijst__link.is-afgelast {
	border-left-color: var(--ss-leden-rood);
}

.ss-leden-trainerlijst__titel {
	font-weight: 700;
}

.ss-leden-trainerlijst__meta,
.ss-leden-trainerlijst__telling {
	font-size: 0.9em;
	color: var(--ss-leden-tekst-zacht);
}

/* Trainerweergave: aanwezigheid per speler */
.ss-leden-presentie__telling {
	font-weight: 700;
}

.ss-leden-presentie__lijst {
	margin: 0 0 1em;
	padding: 0;
	list-style: none;
}

.ss-leden-presentie__speler {
	position: relative;
	margin: 0 0 0.6em;
	padding: 0.8em 1em;
	background: #fff;
	border-left: 4px solid var(--ss-leden-rand);
	border-radius: var(--ss-leden-radius);
}

.ss-leden-presentie__speler.is-aanwezig {
	border-left-color: var(--ss-leden-blauw);
}

.ss-leden-presentie__speler.is-afwezig {
	border-left-color: var(--ss-leden-navy);
}

.ss-leden-presentie__speler.is-afgemeld {
	border-left-color: var(--ss-leden-tekst-zacht);
}

.ss-leden-presentie__speler.is-bezig {
	opacity: 0.7;
}

.ss-leden-presentie__speler fieldset {
	min-width: 0;
	margin: 0;
	padding: 0;
	border: 0;
}

.ss-leden-presentie__naam {
	padding: 0;
	font-weight: 700;
	font-size: 1.05em;
}

.ss-leden .ss-leden-presentie__meta,
.ss-leden .ss-leden-presentie__reden,
.ss-leden .ss-leden-presentie__notitie {
	margin: 0.15em 0 0;
	font-size: 0.875em;
	color: var(--ss-leden-tekst-zacht);
}

.ss-leden .ss-leden-presentie__reden {
	color: var(--ss-leden-navy);
}

.ss-leden-presentie__knoppen {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
	gap: 0.4em;
	margin-top: 0.6em;
}

.ss-leden-presentie__radio {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: 0;
	opacity: 0;
}

.ss-leden form label.ss-leden-presentie__knop {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	margin: 0;
	padding: 0.4em 0.5em;
	background: #fff;
	border: 1px solid var(--ss-leden-rand);
	border-radius: var(--ss-leden-radius);
	color: var(--ss-leden-navy);
	font-size: 0.95em;
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
	cursor: pointer;
	user-select: none;
}

.ss-leden form label.ss-leden-presentie__knop--ingedeeld {
	padding: 0.4em 0.75em;
	font-size: 0.8em;
	font-weight: 600;
	color: var(--ss-leden-tekst-zacht);
}

.ss-leden form label.ss-leden-presentie__knop:hover {
	border-color: var(--ss-leden-blauw);
}

.ss-leden-presentie__radio:focus-visible + label {
	outline: 2px solid var(--ss-leden-navy);
	outline-offset: 2px;
}

.ss-leden-presentie__radio:checked + .ss-leden-presentie__knop--aanwezig {
	background: var(--ss-leden-blauw);
	border-color: var(--ss-leden-blauw);
	color: var(--ss-leden-navy);
}

.ss-leden-presentie__radio:checked + .ss-leden-presentie__knop--afwezig {
	background: var(--ss-leden-navy);
	border-color: var(--ss-leden-navy);
	color: #fff;
}

.ss-leden-presentie__radio:checked + .ss-leden-presentie__knop--afgemeld {
	background: var(--ss-leden-tekst-zacht);
	border-color: var(--ss-leden-tekst-zacht);
	color: #fff;
}

.ss-leden-presentie__radio:checked + .ss-leden-presentie__knop--ingedeeld {
	border-color: var(--ss-leden-navy);
	color: var(--ss-leden-navy);
}

.ss-leden .ss-leden-presentie__acties {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5em;
	margin: 0.4em 0 0;
}

.ss-leden button.ss-leden-presentie__weg {
	min-height: 44px;
	padding: 0.4em 0;
	background: none;
	color: var(--ss-leden-link);
	font-size: 0.85em;
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.ss-leden button.ss-leden-presentie__weg:hover {
	background: none;
	color: var(--ss-leden-navy);
}

.ss-leden-presentie__bericht {
	font-size: 0.85em;
	font-weight: 600;
	color: var(--ss-leden-tekst-zacht);
}

.ss-leden-presentie__bericht.is-fout {
	color: var(--ss-leden-rood);
}

.ss-leden-presentie__toevoegen {
	margin: 0 0 1em;
	padding: 0.8em 1em;
	background: #fff;
	border-radius: var(--ss-leden-radius);
}

.ss-leden-presentie__toevoegen select {
	margin-bottom: 0.6em;
}

/* Huiswerk */
.ss-leden-huiswerk-item {
	margin: 0 0 0.75em;
	padding: 0.9em 1.1em;
	background: #fff;
	border-left: 4px solid var(--ss-leden-blauw);
	border-radius: var(--ss-leden-radius);
}

.ss-leden-huiswerk-item.is-gedaan {
	border-left-color: var(--ss-leden-rand);
}

.ss-leden .ss-leden-huiswerk-item__titel {
	margin: 0 0 0.2em;
	font-size: 1em;
	font-weight: 800;
	line-height: 1.35;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: var(--ss-leden-navy);
}

.ss-leden .ss-leden-huiswerk-item__meta {
	margin: 0 0 0.5em;
	font-size: 0.85em;
	color: var(--ss-leden-tekst-zacht);
}

.ss-leden-huiswerk-item__video {
	margin: 0.75em 0;
}

.ss-leden .ss-leden-huiswerk-item__videotitel {
	margin: 0 0 0.35em;
	font-weight: 700;
}

.ss-leden-huiswerk-item .ss-leden-player {
	margin-bottom: 0.5em;
}

.ss-leden .ss-leden-huiswerk-item__form {
	margin: 0.5em 0 0;
}

/* Vragen */
.ss-leden-vragenlijst {
	margin: 0 0 1em;
	padding: 0;
	list-style: none;
}

.ss-leden-vragenlijst li {
	margin: 0 0 0.5em;
}

.ss-leden .ss-leden-vragenlijst__link {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.15em 0.5em;
	min-height: 44px;
	padding: 0.75em 1em;
	background: #fff;
	border-left: 4px solid var(--ss-leden-blauw);
	border-radius: var(--ss-leden-radius);
	color: var(--ss-leden-navy);
	text-decoration: none;
}

.ss-leden .ss-leden-vragenlijst__link.is-beantwoord {
	border-left-color: var(--ss-leden-navy);
}

.ss-leden .ss-leden-vragenlijst__link.is-gesloten {
	border-left-color: var(--ss-leden-rand);
}

.ss-leden .ss-leden-vragenlijst__link:hover .ss-leden-vragenlijst__onderwerp {
	color: var(--ss-leden-link);
	text-decoration: underline;
}

.ss-leden-vragenlijst__onderwerp {
	font-weight: 700;
}

.ss-leden-vragenlijst__meta {
	flex: 1 1 100%;
	font-size: 0.85em;
	color: var(--ss-leden-tekst-zacht);
}

.ss-leden-draad__bericht {
	margin: 0 0 0.75em;
	padding: 0.9em 1.1em;
	background: #fff;
	border-left: 4px solid var(--ss-leden-rand);
	border-radius: var(--ss-leden-radius);
}

.ss-leden-draad__bericht.is-trainer {
	border-left-color: var(--ss-leden-blauw);
}

.ss-leden .ss-leden-draad__auteur {
	margin: 0 0 0.4em;
	font-size: 0.85em;
	font-weight: 600;
	color: var(--ss-leden-tekst-zacht);
}

.ss-leden-draad__tekst > :last-child {
	margin-bottom: 0;
}

.ss-leden-vraagform {
	margin: 1em 0;
}

.ss-leden-vraagform input[type="text"],
.ss-leden-vraagform textarea {
	max-width: 100%;
}

.ss-leden form.ss-leden-vraagstatus {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5em;
}

.ss-leden form.ss-leden-vraagstatus label {
	margin: 0;
}

.ss-leden form.ss-leden-vraagstatus select {
	width: auto;
}

@media (max-width: 480px) {
	.ss-leden .ss-leden-presentie button.ss-leden-presentie__weg,
	.ss-leden .ss-leden-afmeld .ss-leden-knop,
	.ss-leden form.ss-leden-vraagstatus .ss-leden-knop {
		width: auto;
	}

	.ss-leden-presentie__speler {
		padding: 0.7em 0.75em;
	}

	.ss-leden form label.ss-leden-presentie__knop {
		font-size: 0.875em;
	}
}

@media (min-width: 720px) {
	.ss-leden-presentie__knoppen {
		max-width: 34rem;
	}
}