/* Termine. Akzentfarbe unter Termine → Einstellungen oder im Theme: :root { --tm-akzent: #c62828; } */

.tm {
	--tm-akzent-wert: var(--tm-akzent, #c62828);
	--tm-gedimmt: var(--tm-gedimmt-farbe, rgba(128, 128, 128, 0.9));
	--tm-linie: rgba(128, 128, 128, 0.25);
	--tm-flaeche: rgba(128, 128, 128, 0.08);
}

/* Liste (Widget, Shortcode) */
body .tm .tm-eintraege {
	list-style: none;
	margin: 0;
	padding: 0;
}

body .tm .tm-eintrag {
	margin: 0;
	padding: 0 0 1.1em;
	border: 0;
	background: none;
	list-style: none;
}

body .tm .tm-eintrag + .tm-eintrag {
	padding-top: 1.1em;
	border-top: 1px solid var(--tm-linie);
}

body .tm .tm-eintrag::before {
	content: none;
}

.tm .tm-bild {
	display: block;
	margin: 0 0 0.7em;
	line-height: 0;
}

.tm .tm-bild img {
	display: block;
	width: 100%;
	height: auto;
	max-width: 100%;
	border-radius: 0;
}

.tm .tm-wann {
	margin: 0 0 0.25em;
	font-weight: 700;
	color: var(--tm-akzent-wert);
	line-height: 1.4;
}

.tm .tm-zeit {
	display: block;
}

.tm .tm-mehr {
	font-weight: 400;
	color: var(--tm-gedimmt);
}

body .tm .tm-titel {
	margin: 0;
	font-size: 1.05em;
	line-height: 1.35;
}

body .tm .tm-titel a {
	color: inherit;
	text-decoration: none;
}

body .tm .tm-titel a:hover,
body .tm .tm-titel a:focus-visible {
	text-decoration: underline;
}

.tm .tm-ort {
	margin: 0.2em 0 0;
	font-size: 0.9em;
	color: var(--tm-gedimmt);
}

.tm .tm-leer,
.tm .tm-alle {
	margin: 0;
}

.tm .tm-alle {
	margin-top: 0.4em;
	font-weight: 700;
}

/* Veranstaltungsart */
.tm .tm-art {
	display: inline-block;
	margin: 0 0 0.4em;
	padding: 0.1em 0.6em;
	border-radius: 999px;
	background: var(--tm-art, var(--tm-flaeche));
	color: #fff;
	font-size: 0.75em;
	font-weight: 700;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	line-height: 1.6;
}

/* Abgesagt, vorbei */
.tm .tm-abgesagt {
	text-decoration: line-through;
}

.tm .tm-abgesagt em {
	display: inline-block;
	margin-left: 0.3em;
	text-decoration: none;
	font-style: normal;
	font-size: 0.85em;
	text-transform: uppercase;
	color: #b32d2e;
}

.tm .tm-vorbei {
	opacity: 0.55;
}

/* Wann und wo (Terminseite) */
.tm-details {
	margin: 0 0 1.6em;
	padding: 1em 1.2em;
	background: var(--tm-flaeche);
	border-left: 4px solid var(--tm-akzent-wert);
}

.tm-details .tm-programm {
	margin: 0 0 0.6em;
	padding: 0;
}

.tm-details .tm-punkt {
	padding: 0.35em 0;
}

.tm-details .tm-punkt + .tm-punkt {
	border-top: 1px solid var(--tm-linie);
}

.tm-details dt {
	margin: 0;
	font-weight: 700;
}

.tm-details dd {
	margin: 0.1em 0 0;
}

.tm-details .tm-ort-zeile {
	margin: 0;
}

.tm-details .tm-label {
	font-weight: 700;
}

.tm-details .tm-knoepfe {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em;
	margin: 0.9em 0 0;
}

body .tm-details a.tm-knopf {
	display: inline-block;
	padding: 0.45em 1em;
	border: 2px solid var(--tm-akzent-wert);
	border-radius: 4px;
	background: var(--tm-akzent-wert);
	color: #fff;
	font-weight: 700;
	text-decoration: none;
	line-height: 1.3;
}

body .tm-details a.tm-knopf--zweit {
	background: transparent;
	color: var(--tm-akzent-wert);
}

body .tm-details a.tm-knopf:hover,
body .tm-details a.tm-knopf:focus-visible {
	opacity: 0.85;
}

/* Umschalter im Archiv */
.tm-umschalter {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4em;
	margin: 0 0 1.4em;
}

.tm-umschalter a,
.tm-umschalter span {
	padding: 0.35em 0.9em;
	border: 1px solid var(--tm-linie);
	border-radius: 999px;
	text-decoration: none;
}

.tm-umschalter span[aria-current] {
	background: var(--tm-akzent-wert);
	border-color: var(--tm-akzent-wert);
	color: #fff;
	font-weight: 700;
}