/**
 * PBV Limburg – Spieltagstafel
 *
 * Farbschema über die Modifier-Klassen:
 *   .pbv-spieltag--dark   dunkel (Standard)
 *   .pbv-spieltag--light  hell
 *   .pbv-spieltag--auto   folgt prefers-color-scheme
 *
 * Enfold setzt eigene Regeln mit #top-Präfix (ID-Spezifität). Layout-relevante
 * Eigenschaften werden weiter unten deshalb ein zweites Mal mit #top gesetzt.
 */

/* ---------------------------------------------------------------- Farben - */

.pbv-spieltag {
	--pbv-radius: 3px;
	--pbv-pad-x: 28px;
	--pbv-pad-y: 22px;
	--pbv-blue: #00a2ea;
}

/* Dunkel */
.pbv-spieltag--dark,
.pbv-spieltag--auto {
	--pbv-ink: #0d1319;
	--pbv-surface: #111820;
	--pbv-rail: #1e2a35;
	--pbv-cloth-a: #0b5e8c;
	--pbv-cloth-b: #08476a;
	--pbv-kopf-titel: #ffffff;
	--pbv-kopf-datum: #bee4f8;
	--pbv-text: #edf2f6;
	--pbv-text-weich: #c3cdd6;
	--pbv-muted: #8c99a5;
	--pbv-zahl: var(--pbv-blue);
	--pbv-sieg: #4ade80;
	--pbv-niederlage: #f87171;
}

/* Hell */
.pbv-spieltag--light {
	--pbv-ink: #ffffff;
	--pbv-surface: #ffffff;
	--pbv-rail: #dfe5ea;
	--pbv-cloth-a: #0e8fd0;
	--pbv-cloth-b: #0a6fa4;
	--pbv-kopf-titel: #ffffff;
	--pbv-kopf-datum: #e3f4fd;
	--pbv-text: #16202a;
	--pbv-text-weich: #3f4c58;
	--pbv-muted: #6d7a86;
	--pbv-zahl: #0a6fa4;
	--pbv-sieg: #16a34a;
	--pbv-niederlage: #dc2626;
}

/* Automatisch: helle Werte, wenn der Besucher Hell bevorzugt */
@media (prefers-color-scheme: light) {
	.pbv-spieltag--auto {
		--pbv-ink: #ffffff;
		--pbv-surface: #ffffff;
		--pbv-rail: #dfe5ea;
		--pbv-cloth-a: #0e8fd0;
		--pbv-cloth-b: #0a6fa4;
		--pbv-kopf-titel: #ffffff;
		--pbv-kopf-datum: #e3f4fd;
		--pbv-text: #16202a;
		--pbv-text-weich: #3f4c58;
		--pbv-muted: #6d7a86;
		--pbv-zahl: #0a6fa4;
		--pbv-sieg: #16a34a;
		--pbv-niederlage: #dc2626;
	}
}

/* ---------------------------------------------------------------- Aufbau - */

.pbv-spieltag {
	background: var(--pbv-ink);
	border: 1px solid var(--pbv-rail);
	border-radius: var(--pbv-radius);
	overflow: hidden;
	margin: 2em 0;
	color: var(--pbv-text);
	font-family: inherit;
}

.pbv-spieltag--light {
	box-shadow: 0 1px 2px rgba(16, 32, 48, 0.06);
}

/* Kopfzeile */
.pbv-spieltag .pbv-spieltag__head {
	background: linear-gradient(180deg, var(--pbv-cloth-a), var(--pbv-cloth-b));
	padding: 16px var(--pbv-pad-x);
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 6px 16px;
}

.pbv-spieltag .pbv-spieltag__titel {
	font-weight: 800;
	font-size: 15px;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--pbv-kopf-titel);
	line-height: 1.3;
}

.pbv-spieltag .pbv-spieltag__datum {
	font-size: 14px;
	color: var(--pbv-kopf-datum);
	line-height: 1.3;
}

/* Liste */
.pbv-spieltag .pbv-spieltag__liste {
	list-style: none;
	margin: 0;
	padding: 0;
}

.pbv-spieltag .pbv-spieltag__liste > li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.pbv-spieltag .pbv-spieltag__liste > li::before {
	content: none;
}

.pbv-spieltag .pbv-spieltag__zeile {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 10px 28px;
	padding: var(--pbv-pad-y) var(--pbv-pad-x);
	border-top: 1px solid var(--pbv-rail);
	background: var(--pbv-surface);
}

.pbv-spieltag .pbv-spieltag__liste > li:first-child .pbv-spieltag__zeile {
	border-top: 0;
}

.pbv-spieltag .pbv-spieltag__info {
	min-width: 0;
	flex: 1 1 240px;
}

.pbv-spieltag .pbv-spieltag__team {
	display: block;
	font-weight: 800;
	font-size: 1.05em;
	line-height: 1.35;
	color: var(--pbv-text);
}

.pbv-spieltag .pbv-spieltag__liga {
	display: block;
	font-size: 0.85em;
	line-height: 1.5;
	color: var(--pbv-muted);
	margin-top: 1px;
}

.pbv-spieltag .pbv-spieltag__gegner {
	display: block;
	font-size: 0.95em;
	line-height: 1.5;
	color: var(--pbv-text-weich);
	margin-top: 2px;
}

.pbv-spieltag .pbv-spieltag__wert {
	text-align: right;
	flex: 0 0 auto;
}

.pbv-spieltag .pbv-spieltag__zahl {
	display: block;
	font-weight: 800;
	font-size: 1.5em;
	line-height: 1.15;
	color: var(--pbv-zahl);
	font-variant-numeric: tabular-nums;
}

.pbv-spieltag .pbv-spieltag__ort {
	display: block;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--pbv-muted);
	margin-top: 3px;
}

.pbv-spieltag .pbv-spieltag__link {
	display: inline-block;
	margin-top: 8px;
	font-size: 12.5px;
	font-weight: 700;
	color: var(--pbv-blue);
	text-decoration: none;
	border-bottom: 1px solid currentColor;
}

.pbv-spieltag .pbv-spieltag__link:hover,
.pbv-spieltag .pbv-spieltag__link:focus {
	color: var(--pbv-zahl);
}

.pbv-spieltag a:focus-visible {
	outline: 2px solid var(--pbv-blue);
	outline-offset: 3px;
}

/* Ergebnis-Status */
.pbv-spieltag .pbv-spieltag__zeile--sieg .pbv-spieltag__zahl {
	color: var(--pbv-sieg);
}

.pbv-spieltag .pbv-spieltag__zeile--niederlage .pbv-spieltag__zahl {
	color: var(--pbv-niederlage);
}

.pbv-spieltag .pbv-spieltag__zeile--unentschieden .pbv-spieltag__zahl {
	color: var(--pbv-text);
}

/* Fusszeile */
.pbv-spieltag .pbv-spieltag__hinweis {
	margin: 0;
	padding: 16px var(--pbv-pad-x);
	border-top: 1px solid var(--pbv-rail);
	background: var(--pbv-surface);
	font-size: 0.88em;
	line-height: 1.6;
	color: var(--pbv-muted);
}

.pbv-spieltag .pbv-spieltag__hinweis a {
	color: var(--pbv-blue);
}

/* ------------------------------------------- Enfold-Spezifitaet schlagen - */
/* Enfold setzt u. a. #top .entry-content-wrapper li { padding:0 } und
   ueberschreibt damit die Innenabstaende. Gleiche Werte, hoehere Spezifitaet. */

#top .pbv-spieltag .pbv-spieltag__head,
#top .pbv-spieltag .pbv-spieltag__hinweis {
	padding: 16px var(--pbv-pad-x);
}

#top .pbv-spieltag .pbv-spieltag__liste {
	margin: 0;
	padding: 0;
	list-style: none;
}

#top .pbv-spieltag .pbv-spieltag__liste > li {
	margin: 0;
	padding: 10px;
	list-style: none;
	background: none;
	border: 0;
	border-bottom: 1px solid var(--pbv-rail);
}

#top .pbv-spieltag .pbv-spieltag__liste > li::before {
	content: none;
}

#top .pbv-spieltag .pbv-spieltag__zeile {
	padding: var(--pbv-pad-y) var(--pbv-pad-x);
	border-top: 1px solid var(--pbv-rail);
	background: var(--pbv-surface);
}

#top .pbv-spieltag .pbv-spieltag__liste > li:first-child .pbv-spieltag__zeile {
	border-top: 0;
}

#top .pbv-spieltag .pbv-spieltag__team,
#top .pbv-spieltag .pbv-spieltag__liga,
#top .pbv-spieltag .pbv-spieltag__gegner,
#top .pbv-spieltag .pbv-spieltag__zahl,
#top .pbv-spieltag .pbv-spieltag__ort {
	display: block;
}

#top .pbv-spieltag .pbv-spieltag__link {
	text-decoration: none;
}

/* ----------------------------------------------------------------- Mobil - */

@media (max-width: 600px) {
	.pbv-spieltag {
		--pbv-pad-x: 18px;
		--pbv-pad-y: 18px;
	}

	.pbv-spieltag .pbv-spieltag__zeile,
	#top .pbv-spieltag .pbv-spieltag__zeile {
		flex-direction: column;
		align-items: flex-start;
		gap: 10px;
	}

	.pbv-spieltag .pbv-spieltag__info,
	#top .pbv-spieltag .pbv-spieltag__info {
		flex: 0 0 auto;
		width: 100%;
	}

	.pbv-spieltag .pbv-spieltag__wert {
		text-align: left;
	}
}

/* ----------------------------------------------------------------- Druck - */

@media print {
	.pbv-spieltag,
	#top .pbv-spieltag .pbv-spieltag__zeile,
	.pbv-spieltag .pbv-spieltag__head,
	.pbv-spieltag .pbv-spieltag__hinweis {
		background: none !important;
		color: #000;
	}

	.pbv-spieltag {
		border-color: #999;
	}

	.pbv-spieltag .pbv-spieltag__titel,
	.pbv-spieltag .pbv-spieltag__datum,
	.pbv-spieltag .pbv-spieltag__team,
	.pbv-spieltag .pbv-spieltag__gegner,
	.pbv-spieltag .pbv-spieltag__zahl {
		color: #000 !important;
	}
}
