:root {
	--uk-blue: #005ba9;
	--uk-blue-dark: #003f76;
	--uk-orange: #f59b00;
	--uk-teal: #009a9b;
	--uk-light-blue: #84cee4;
	--uk-magenta: #c7007f;
	--uk-ink: #30343b;
	--uk-muted: #5a5a5a;
	--uk-line: #dfe7ec;
	--uk-surface: #f5f9fb;
}

.uk-sd-site-content,
.uk-sd-course-browser {
	color: var(--uk-ink);
	font-family: Roboto, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.uk-sd-course-browser {
	max-width: 100%;
	width: 100%;
}

@media (min-width: 1024px) {
	/*
	 * The Ulmkolleg theme places post content in the centered two-column area
	 * of a four-column grid. Expand the course browser to that grid's full
	 * width so it aligns with the header image above it.
	 */
	.uk-sd-course-browser {
		margin-left: -50%;
		max-width: none;
		width: 200%;
	}

	/*
	 * Pages in the Fortbildungen section already have the theme's navigation
	 * in the first grid column. Start beside that menu and only use the space
	 * to its right instead of expanding across the complete four-column grid.
	 */
	.uk-sd-course-browser.is-theme-sidebar {
		margin-left: 0;
		width: 100%;
	}

	.uk-sd-course-browser.has-theme-filter-menu .uk-sd-course-layout {
		grid-template-columns: minmax(0, 1fr);
		padding-left: 0;
		padding-right: 0;
	}

	.uk-sd-course-content-column {
		grid-column: span 3 / span 3;
		min-width: 0;
	}

	.uk-sd-course-content-frame {
		max-width: none !important;
		width: 100%;
	}

	.uk-sd-course-unused-sidebar {
		display: none !important;
	}
}

.uk-sd-course-browser *,
.uk-sd-course-browser *::before,
.uk-sd-course-browser *::after {
	box-sizing: border-box;
}

.uk-sd-course-hero {
	background: linear-gradient(120deg, rgba(132, 206, 228, .3), rgba(0, 154, 155, .08));
	border-bottom: 5px solid var(--uk-orange);
	padding: clamp(2.5rem, 6vw, 5.25rem) 1.5rem;
}

.uk-sd-course-hero.is-theme-header {
	align-items: flex-end;
	box-sizing: border-box;
	display: flex;
	height: 100%;
	min-height: 300px;
	width: 100%;
}

.uk-sd-course-hero.is-theme-header .uk-sd-course-hero__inner {
	width: 100%;
}

.uk-sd-course-hero__inner,
.uk-sd-course-layout {
	margin: 0 auto;
	max-width: none;
	width: 100%;
}

.uk-sd-eyebrow {
	color: var(--uk-teal);
	font-size: .8rem;
	font-weight: 800;
	letter-spacing: .12em;
	margin: 0 0 .75rem;
	text-transform: uppercase;
}

.uk-sd-course-hero h1 {
	color: var(--uk-blue);
	font-family: "Roboto Slab", Georgia, serif;
	font-size: clamp(2.25rem, 5vw, 4rem);
	font-weight: 800;
	line-height: 1.08;
	margin: 0 0 1rem;
}

.uk-sd-course-hero p:last-child {
	font-size: clamp(1rem, 2vw, 1.25rem);
	line-height: 1.65;
	margin: 0;
	max-width: 760px;
}

.uk-sd-course-layout {
	display: grid;
	gap: clamp(2rem, 4vw, 4rem);
	grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
	padding: clamp(2.5rem, 5vw, 5rem) 1.5rem;
}

.uk-sd-course-filters {
	align-self: start;
	background: var(--uk-surface);
	border-top: 5px solid var(--uk-teal);
	padding: 1.5rem;
	position: sticky;
	top: 2rem;
}

.uk-sd-course-filters.is-theme-menu-filter {
	box-sizing: border-box;
	margin-top: 1.5rem;
	position: static;
	width: 100%;
}

.uk-sd-course-filters h2,
.uk-sd-course-search label {
	color: var(--uk-blue);
	font-family: "Roboto Slab", Georgia, serif;
	font-size: 1.15rem;
	font-weight: 800;
}

.uk-sd-course-filters h2 {
	margin: 0 0 1rem;
}

.uk-sd-filter-list {
	display: grid;
	gap: .25rem;
}

.uk-sd-filter {
	appearance: none;
	background: transparent;
	border: 0;
	border-left: 3px solid transparent;
	color: var(--uk-muted);
	cursor: pointer;
	font: inherit;
	font-weight: 600;
	padding: .65rem .75rem;
	text-align: left;
	transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}

.uk-sd-filter:hover,
.uk-sd-filter:focus-visible,
.uk-sd-filter.is-active {
	background: #fff;
	border-left-color: var(--uk-orange);
	color: var(--uk-blue);
}

.uk-sd-status-legend {
	border-top: 1px solid var(--uk-line);
	display: grid;
	gap: .65rem;
	margin-top: 1.75rem;
	padding-top: 1.5rem;
}

.uk-sd-status-legend span {
	align-items: center;
	display: flex;
	font-size: .88rem;
	gap: .6rem;
}

.uk-sd-status-legend i,
.uk-sd-status i {
	background: var(--uk-teal);
	border-radius: 50%;
	display: inline-block;
	flex: 0 0 auto;
	height: .7rem;
	width: .7rem;
}

.uk-sd-status-legend .is-limited,
.uk-sd-status.is-limited i {
	background: var(--uk-orange);
}

.uk-sd-status-legend .is-wait-list,
.uk-sd-status.is-wait_list i,
.uk-sd-status.is-fully_booked i {
	background: var(--uk-magenta);
}

.uk-sd-status.is-canceled i {
	background: #70757a;
}

.uk-sd-status.is-cancelled i,
.uk-sd-status.is-unknown i {
	background: #70757a;
}

.uk-sd-course-search {
	margin-bottom: 1.5rem;
}

.uk-sd-course-search label {
	display: block;
	margin-bottom: .65rem;
}

.uk-sd-search-control {
	display: flex;
	gap: .65rem;
}

.uk-sd-search-control input {
	background: #fff;
	border: 2px solid var(--uk-line);
	border-radius: 0;
	color: var(--uk-ink);
	font: inherit;
	min-width: 0;
	padding: .9rem 1rem;
	width: 100%;
}

.uk-sd-search-control input:focus {
	border-color: var(--uk-blue);
	box-shadow: 0 0 0 3px rgba(0, 91, 169, .14);
	outline: 0;
}

.uk-sd-search-control button {
	background: var(--uk-blue);
	border: 0;
	color: #fff;
	cursor: pointer;
	font: inherit;
	font-weight: 700;
	padding: .9rem 1.2rem;
}

.uk-sd-search-control button:hover,
.uk-sd-search-control button:focus-visible {
	background: var(--uk-blue-dark);
}

.uk-sd-result-count {
	color: var(--uk-muted);
	font-size: .9rem;
	margin: .75rem 0 0;
}

.uk-sd-course-table-wrap {
	overflow-x: auto;
}

.uk-sd-course-table {
	border: 0;
	border-collapse: collapse;
	font-size: .94rem;
	margin: 0;
	width: 100%;
}

.uk-sd-course-table thead {
	background: var(--uk-blue);
	color: #fff;
}

.uk-sd-course-table th,
.uk-sd-course-table td {
	border: 0;
	padding: 1rem;
	text-align: left;
	vertical-align: top;
}

.uk-sd-course-table th {
	font-size: .76rem;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.uk-sd-course-table tbody tr {
	border-bottom: 1px solid var(--uk-line);
	transition: background-color .2s ease;
}

.uk-sd-course-table tbody tr:nth-child(even) {
	background: var(--uk-surface);
}

.uk-sd-course-table tbody tr:hover {
	background: rgba(132, 206, 228, .18);
}

.uk-sd-course-table th:first-child,
.uk-sd-course-table td:first-child {
	width: 145px;
}

.uk-sd-course-table th:nth-child(2),
.uk-sd-course-table td:nth-child(2) {
	white-space: nowrap;
	width: 175px;
}

.uk-sd-course-table th:last-child,
.uk-sd-course-table td:last-child {
	font-weight: 700;
	white-space: nowrap;
	width: 120px;
}

.uk-sd-status {
	align-items: center;
	display: inline-flex;
	font-size: .8rem;
	font-weight: 700;
	gap: .5rem;
}

.uk-sd-course-title {
	color: var(--uk-blue);
	font-weight: 800;
	line-height: 1.4;
	text-decoration: none;
}

a.uk-sd-course-title:hover,
a.uk-sd-course-title:focus-visible {
	color: var(--uk-magenta);
	text-decoration: underline;
	text-underline-offset: .2em;
}

.uk-sd-course-venue {
	color: var(--uk-muted);
	display: block;
	font-size: .85rem;
	margin-top: .35rem;
}

.uk-sd-empty,
.uk-sd-notice {
	background: var(--uk-surface);
	border-left: 5px solid var(--uk-orange);
	margin: 1.5rem 0;
	padding: 1rem 1.25rem;
}

@media (max-width: 900px) {
	.uk-sd-course-layout {
		grid-template-columns: 1fr;
	}

	.uk-sd-course-filters {
		position: static;
	}

	.uk-sd-filter-list {
		display: flex;
		flex-wrap: wrap;
	}

	.uk-sd-filter {
		border: 1px solid var(--uk-line);
		padding: .55rem .8rem;
	}

	.uk-sd-filter.is-active {
		border-color: var(--uk-orange);
	}
}

@media (max-width: 680px) {
	.uk-sd-course-hero,
	.uk-sd-course-layout {
		padding-left: 1rem;
		padding-right: 1rem;
	}

	.uk-sd-search-control {
		align-items: stretch;
		flex-direction: column;
	}

	.uk-sd-course-table thead {
		clip: rect(0 0 0 0);
		clip-path: inset(50%);
		height: 1px;
		overflow: hidden;
		position: absolute;
		white-space: nowrap;
		width: 1px;
	}

	.uk-sd-course-table,
	.uk-sd-course-table tbody,
	.uk-sd-course-table tr,
	.uk-sd-course-table td {
		display: block;
		width: 100%;
	}

	.uk-sd-course-table tbody tr {
		background: #fff;
		border: 1px solid var(--uk-line);
		border-top: 5px solid var(--uk-blue);
		margin-bottom: 1rem;
		padding: .5rem 1rem;
	}

	.uk-sd-course-table tbody tr:nth-child(even) {
		background: #fff;
	}

	.uk-sd-course-table td,
	.uk-sd-course-table td:first-child,
	.uk-sd-course-table td:nth-child(2),
	.uk-sd-course-table td:last-child {
		border-bottom: 1px solid var(--uk-line);
		padding: .75rem 0 .75rem 7rem;
		position: relative;
		white-space: normal;
		width: 100%;
	}

	.uk-sd-course-table td:last-child {
		border-bottom: 0;
	}

	.uk-sd-course-table td::before {
		color: var(--uk-blue);
		content: attr(data-label);
		font-size: .72rem;
		font-weight: 800;
		left: 0;
		letter-spacing: .04em;
		position: absolute;
		text-transform: uppercase;
		top: .85rem;
	}
}
