/* =========================================================
   Seite „Kursplan“ (/kursplan/) – nur Tokens und Klassen aus theme.css,
   eigene Klassen mit Präfix .kursplan-… (die Komponente in bausteine.css belegt bereits
   .kursplan, .kursplan-kopf, .kursplan-text, .kursplan-kategorie u. a. – daher hier andere Namen).
   Mobile-first, Breakpoints 600 / 900 / 1100.
   ========================================================= */

/* ---------- Kopfband: Kicker, H1, Satz | Aktionen ---------- */
.kursplan-kopfband {
	margin-bottom: 0; /* die Kursplan-Sektion bringt ihren eigenen Abstand mit */
}
.kursplan-kopfband-innen {
	display: grid;
	gap: 24px;
}
.kursplan-kopfband-satz {
	max-width: 40rem;
	margin: 12px 0 0;
	color: var(--grau-text); /* 5,45:1 auf Hellgrau */
}
.kursplan-kopfband-aktionen {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}
html.kein-js .kursplan-druck-knopf {
	display: none;
}
@media (min-width: 900px) {
	.kursplan-kopfband-innen {
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 24px 48px;
		align-items: end;
	}
	.kursplan-kopfband-aktionen {
		justify-content: flex-end;
	}
}

/* ---------- Schwerpunkte: Überschrift links, große Textlinks rechts ---------- */
.kursplan-schwerpunkte-innen {
	display: grid;
	gap: 32px;
}
.kursplan-schwerpunkte-kopf {
	max-width: 36rem;
}
.kursplan-schwerpunkte-kopf > :last-child {
	margin-bottom: 0;
}
.kursplan-schwerpunkte-kopf p:not(.kicker) {
	color: var(--grau-text);
}
.kursplan-schwerpunkte-liste {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--grau-rand);
}
.kursplan-schwerpunkte-liste li {
	margin: 0;
	padding: 4px 0 16px;
	border-bottom: 1px solid var(--grau-rand);
}
/* Hellgrau setzt Links sonst auf Orange-dunkel (theme.css) – hier Anthrazit mit orangem Pfeil und oranger Linie */
.kursplan-schwerpunkte-liste a.kursplan-schwerpunkt-link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	min-height: var(--ziel);
	padding: 8px 0 2px;
	font-family: var(--schrift-titel);
	font-weight: 700;
	font-size: var(--schrift-zwischen);
	line-height: var(--zeile-titel);
	color: var(--anthrazit);
	text-decoration: underline;
	text-decoration-color: var(--orange);
	text-decoration-thickness: 2px;
	text-underline-offset: 0.2em;
}
.kursplan-schwerpunkte-liste a.kursplan-schwerpunkt-link .icon {
	width: 26px;
	height: 26px;
	color: var(--orange-tief);
	transition: transform 0.15s ease;
}
.kursplan-schwerpunkte-liste a.kursplan-schwerpunkt-link:hover {
	color: var(--orange-dunkel);
	text-decoration-color: currentColor;
}
.kursplan-schwerpunkte-liste a.kursplan-schwerpunkt-link:hover .icon {
	transform: translateX(4px);
}
.kursplan-schwerpunkt-kurse {
	max-width: 40rem; /* Kursnamen-Zeile nicht breiter als ≈ 80 Zeichen (Prüfrunde 2, Befund 22) */
	margin: 4px 0 0;
	font-size: var(--schrift-klein);
	color: var(--grau-text);
}
@media (min-width: 900px) {
	.kursplan-schwerpunkte-innen {
		grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
		gap: 32px 64px;
		align-items: start;
	}
	.kursplan-schwerpunkte-liste li {
		padding: 8px 0 20px;
	}
	.kursplan-schwerpunkte-liste a.kursplan-schwerpunkt-link {
		padding-top: 12px;
	}
}

/* ---------- Rehasport-Gruppen: Text links, Tabelle rechts ---------- */
.kursplan-reha-innen {
	display: grid;
	gap: 40px;
}
.kursplan-reha-text {
	max-width: 36rem;
}
.kursplan-reha-aktionen {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 32px;
	margin-top: 8px;
}
.kursplan-reha-hinweis {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	margin: 0 0 24px;
	padding: 16px 20px;
	border-left: 4px solid var(--orange);
	border-radius: 0 var(--radius) var(--radius) 0;
	background: var(--hellgrau);
}
.kursplan-reha-hinweis .icon {
	width: 24px;
	height: 24px;
	margin-top: 1px;
	color: var(--orange-tief);
}
.kursplan-reha-hinweis p {
	margin: 0;
	font-weight: 600;
}
.kursplan-reha-tabelle {
	width: 100%;
	border-collapse: collapse;
}
.kursplan-reha-tabelle th,
.kursplan-reha-tabelle td {
	padding: 14px 0;
	border-bottom: 1px solid var(--grau-linie);
	text-align: left;
	vertical-align: top;
	line-height: var(--zeile-text);
}
.kursplan-reha-tabelle thead th {
	padding-top: 0;
	padding-bottom: 10px;
	border-bottom: 2px solid var(--anthrazit);
	font-family: var(--schrift-titel);
	font-weight: 600;
	font-size: var(--schrift-klein);
	color: var(--grau-text);
}
.kursplan-reha-tabelle tbody th {
	width: 1%;
	padding-right: 32px;
	font-family: var(--schrift-titel);
	font-weight: 600;
	white-space: nowrap;
}
.kursplan-reha-tabelle td {
	font-variant-numeric: tabular-nums;
}
.kursplan-reha-tabelle tbody tr:last-child th,
.kursplan-reha-tabelle tbody tr:last-child td {
	border-bottom: 0;
}
@media (max-width: 380px) {
	.kursplan-reha-tabelle tbody th {
		white-space: normal;
		padding-right: 16px;
	}
}
@media (min-width: 900px) {
	.kursplan-reha-innen {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
		gap: 48px 80px;
		align-items: start;
	}
}

/* ---------- Öffnungszeiten: weiße Karte | kurzer Text ---------- */
.kursplan-zeiten-innen {
	display: grid;
	gap: 32px;
}
.kursplan-zeiten-innen > * {
	min-width: 0; /* die Karte darf schmaler werden als die Mindestbreite der Zeiten-Tabelle (320 px mit Textabständen) */
}
.kursplan-zeiten-karte {
	padding: 24px 20px;
}
.kursplan-zeiten-karte .zeiten {
	max-width: none;
}
.kursplan-zeiten-satz {
	max-width: 24rem;
	margin: 0 0 20px;
	font-family: var(--schrift-titel);
	font-weight: 600;
	font-size: var(--schrift-zwischen);
	line-height: var(--zeile-titel);
	letter-spacing: -0.01em;
}
.kursplan-zeiten-aktionen {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 32px;
}
@media (min-width: 600px) {
	.kursplan-zeiten-karte {
		padding: 36px 40px;
	}
}
@media (min-width: 900px) {
	.kursplan-zeiten-innen {
		grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
		gap: 48px 80px;
		align-items: center;
	}
	.kursplan-zeiten-text {
		padding-left: 8px;
	}
}

/* ---------- Bewegung reduzieren ---------- */
@media (prefers-reduced-motion: reduce) {
	.kursplan-schwerpunkte-liste a.kursplan-schwerpunkt-link:hover .icon {
		transform: none;
	}
}

/* ---------- Druck: nur Titel, Plan und Hinweise ---------- */
@media print {
	.kursplan-kopfband {
		margin: 0 0 12pt;
		padding: 0;
		background: none;
	}
	.kursplan-kopfband .kicker,
	.kursplan-kopfband-aktionen,
	.kursplan-schwerpunkte,
	.kursplan-reha,
	.kursplan-zeiten {
		display: none !important;
	}
	.kursplan-kopfband-satz {
		margin-top: 4pt;
		color: #000;
	}
	.kursplan-kopfband .seite-titel {
		font-size: 24pt;
	}
	.kursplan .kursplan-titel {
		font-size: 16pt;
	}
	/* Hinweise-Box nicht über einen Seitenumbruch ziehen */
	.kursplan .kursplan-hinweise {
		break-inside: avoid;
	}
}