/* ═══════════════════════════════════════════
   Fussball Spieltag Widget – Stylesheet
   Vereinsfarben werden per Inline-Style überschrieben
   (Admin: Primärfarbe + Akzentfarbe)
   Kleine Schriftgrößen in rem, damit sie der Browser-Schriftgröße folgen.
   ═══════════════════════════════════════════ */

:root {
	--fsw-primary: #29166f;   /* Primärfarbe (Vereinsfarbe) */
	--fsw-primary-text: #29166f; /* Primärfarbe als Text auf Weiß – bei hellen Vereinsfarben abgedunkelt */
	--fsw-dark:    #1d0f52;   /* Dunkle Variante (Kopfzeilen, Tabs) */
	--fsw-light:   #3a2490;   /* Helle Variante (Hover-States) */
	--fsw-accent:  #d4a843;   /* Akzentfarbe (CTAs, aktive Tabs) */
	--fsw-txt:     #1a1a2e;   /* Fließtext */
	--fsw-mut:     #6b6b78;   /* Sekundärtext, Labels */
	--fsw-bg:      #f5f5f7;   /* Hintergrundflächen */
	--fsw-wh:      #fff;      /* Weiß */
	--fsw-brd:     #e0e0e4;   /* Rahmen */
	/* Ergebnisfarben: als Text auf hellem Grund und mit weißer Schrift ≥ 4.5:1 (WCAG AA) */
	--fsw-win:     #15803d;   /* Sieg */
	--fsw-loss:    #b91c1c;   /* Niederlage */
	--fsw-draw:    #a16207;   /* Unentschieden */
	--fsw-friendly-bg:  #ececf0; /* Freundschaftsspiel */
	--fsw-friendly-txt: #4b4b57;

	/* Automatisch je nach Helligkeit der Vereinsfarbe gesetzt (Fallback: Weiß) */
	--fsw-on-primary:  #fff;                  /* Text auf --fsw-primary */
	--fsw-on-dark:     #fff;                  /* Text auf --fsw-dark */
	--fsw-on-dark-mut: rgba(255,255,255,.70); /* gedämpfter Text auf --fsw-dark */
}

.fsw-w {
	font-family: "Source Sans 3", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	color: var(--fsw-txt);
	line-height: 1.5;
}


/* ═══ Hilfsklassen ═══ */

/* Nur für Screenreader – eigene Klasse, damit nichts vom Theme abhängt */
.fsw-sr-only {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* Überschriften (h2…h6): Theme-Stile zurücksetzen, Aussehen kommt von der jeweiligen Klasse.
   Doppelte Klasse (0,2,0) schlägt typische Theme-Regeln wie .entry-content h2 (0,1,1). */
.fsw-h.fsw-h {
	margin: 0;
	padding: 0;
	border: 0;
	line-height: 1.3;
	color: inherit;
	font-size: inherit;
	background: none;
}

.fsw-tbl abbr[title],
.fsw-sched abbr[title] {
	text-decoration: underline dotted;
	text-underline-offset: 2px;
	border: 0;
	cursor: help;
}


/* ═══ Transparent / Box ═══ */

/* Doppelte Klasse statt !important: schlägt die Hintergründe der Einzelbausteine */
.fsw-transparent.fsw-transparent {
	background: transparent;
	border: none;
	border-radius: 0;
}

.fsw-full {
	display: flex;
	flex-direction: column;
	background: var(--fsw-wh);
	border-radius: 12px;
	border: 1px solid var(--fsw-brd);
	overflow: hidden;
}
.fsw-full > .fsw-match,
.fsw-full > .fsw-form-dots,
.fsw-full > .fsw-tbl {
	border-radius: 0;
	border: none;
}

.fsw-err {
	border-left: 3px solid var(--fsw-loss);
	background: #fef2f2;
	border-radius: 4px;
}
.fsw-err p {
	margin: 0;
	padding: 16px;
	color: var(--fsw-loss);
	font-size: 14px;
	font-weight: 600;
}

/* Normaler Leerzustand (z.B. Saisonpause) – neutral, kein Fehler */
.fsw-notice p {
	margin: 0;
	padding: 16px;
	text-align: center;
	color: var(--fsw-mut);
	font-size: 14px;
}


/* ═══ Header Bars ═══ */

.fsw-hdr {
	background: var(--fsw-dark);
	color: var(--fsw-on-dark);
	padding: 9px 16px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.fsw-hdr .fsw-badge {
	font-family: "Oswald", sans-serif;
	font-weight: 600;
	font-size: .75rem;
	text-transform: uppercase;
	letter-spacing: 1.2px;
	color: var(--fsw-on-dark);
}
.fsw-league, .fsw-sm {
	font-size: .75rem;
	color: var(--fsw-on-dark-mut);
}


/* ═══ Section Title (Gievenbeck-Stil: — Text —) ═══ */

.fsw-section-title {
	display: flex;
	align-items: center;
	gap: 16px;
	margin: 8px 0 20px;
	padding: 0 4px;
}
.fsw-section-title::before,
.fsw-section-title::after {
	content: '';
	flex: 1;
	height: 1px;
	background: var(--fsw-brd);
}
.fsw-section-title .fsw-section-h {
	font-family: "Oswald", sans-serif;
	font-size: .8125rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	color: var(--fsw-mut);
	white-space: nowrap;
}


/* ═══ Match Display (Nächstes Spiel + Letztes Ergebnis) ═══ */

.fsw-match {
	background: var(--fsw-wh);
}
.fsw-mu {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 28px;
	padding: 28px 16px 12px;
}
.fsw-t {
	text-align: center;
	flex: 1;
	max-width: 180px;
}

/* Logo-Container – kein Kreis, kein Hintergrund */
.fsw-crest {
	width: 72px;
	height: 72px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 8px;
	overflow: visible;
}
.fsw-logo {
	width: 72px;
	height: 72px;
	object-fit: contain;
}

/* Text-Fallback (wenn kein Logo vorhanden) – bekommt den Kreis */
.fsw-crest-txt {
	font-family: "Oswald", sans-serif;
	font-weight: 700;
	font-size: 16px;
	letter-spacing: .5px;
	color: var(--fsw-mut);
	width: 72px;
	height: 72px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--fsw-bg);
}
.fsw-t.fsw-hl .fsw-crest-txt {
	color: var(--fsw-on-primary);
	background: var(--fsw-primary);
}

/* Teamname */
.fsw-tn {
	font-family: "Oswald", sans-serif;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.25;
	letter-spacing: .3px;
}
.fsw-t.fsw-hl .fsw-tn {
	color: var(--fsw-primary-text);
	font-weight: 700;
}

/* Mitte: Uhrzeit oder Score */
.fsw-mid {
	text-align: center;
	flex-shrink: 0;
}
.fsw-center {
	font-family: "Oswald", sans-serif;
	font-weight: 700;
	line-height: 1;
	padding: 8px 16px;
	border-radius: 8px;
}
.fsw-kick {
	font-size: 32px;
	color: var(--fsw-primary-text);
	background: var(--fsw-bg);
}
.fsw-score {
	font-size: 28px;
}
.fsw-score-w { background: #f0fdf4; color: var(--fsw-win); }
.fsw-score-l { background: #fef2f2; color: var(--fsw-loss); }
.fsw-score-d { background: #fffbeb; color: var(--fsw-draw); }

/* Ergebnis als Text unter dem Score (nicht nur über die Farbe erkennbar) */
.fsw-res-lbl {
	margin-top: 6px;
	font-family: "Oswald", sans-serif;
	font-size: .75rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 1px;
}
.fsw-res-w { color: var(--fsw-win); }
.fsw-res-l { color: var(--fsw-loss); }
.fsw-res-d { color: var(--fsw-draw); }

/* Meta-Zeile unter dem Spiel (Datum, Liga) */
.fsw-match-meta {
	text-align: center;
	font-size: 13px;
	color: var(--fsw-mut);
	padding: 4px 16px 20px;
}


/* ═══ Formkurve: Dots (einfach) ═══ */

.fsw-form-dots {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 16px;
	background: var(--fsw-bg);
	border-top: 1px solid var(--fsw-brd);
}
.fsw-form-dots.fsw-transparent {
	background: transparent;
	border-top: none;
}
.fsw-form-lbl {
	font-family: "Oswald", sans-serif;
	font-size: .75rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: var(--fsw-mut);
	flex-shrink: 0;
}
.fsw-dots-row {
	display: flex;
	gap: 5px;
}
.fsw-dot {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: "Oswald", sans-serif;
	font-weight: 700;
	font-size: .75rem;
	color: #fff;
	cursor: default;
	transition: transform .15s;
}
.fsw-dot:hover { transform: scale(1.15); }
.fsw-dot-w { background: var(--fsw-win);  box-shadow: 0 2px 8px rgba(21,128,61,.3); }
.fsw-dot-l { background: var(--fsw-loss); box-shadow: 0 2px 8px rgba(185,28,28,.3); }
.fsw-dot-d { background: var(--fsw-draw); box-shadow: 0 2px 8px rgba(161,98,7,.25); }
/* Freundschaftsspiel: hell mit gestricheltem Rand statt kaum lesbarem Grau */
.fsw-dot.fsw-dot-f {
	background: var(--fsw-friendly-bg);
	color: var(--fsw-friendly-txt);
	border: 1px dashed var(--fsw-friendly-txt);
	box-shadow: none;
}


/* ═══ Formkurve: Gievenbeck-Stil (Linien-Diagramm) ═══ */

.fsw-formchart {
	padding: 0 0 8px;
}
.fsw-fc-graph {
	display: flex;
	align-items: stretch;
	position: relative;
}
.fsw-fc-y {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: 16px 12px 16px 0;
	width: 28px;
	flex-shrink: 0;
}
.fsw-fc-y span {
	font-family: "Oswald", sans-serif;
	font-weight: 600;
	font-size: 13px;
	color: var(--fsw-mut);
	text-align: right;
	line-height: 1;
}
.fsw-fc-area {
	flex: 1;
	position: relative;
	height: 180px;
	padding: 16px 0;
	box-sizing: content-box;
}

/* Horizontale Gridlinien */
.fsw-fc-gridlines {
	position: absolute;
	left: 0;
	right: 0;
	top: 16px;
	bottom: 16px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	pointer-events: none;
}
.fsw-fc-gl {
	height: 1px;
	background: var(--fsw-brd);
}

/* SVG-Verbindungslinie */
.fsw-fc-svg {
	position: absolute;
	left: 0;
	right: 0;
	top: 16px;
	bottom: 16px;
	width: 100%;
	height: calc(100% - 32px);
}

/* Gegner-Logos als absolute Punkte */
.fsw-fc-points {
	position: absolute;
	left: 0;
	right: 0;
	top: 16px;
	bottom: 16px;
}
.fsw-fc-point {
	position: absolute;
	transform: translate(-50%, -50%);
	z-index: 2;
}
.fsw-fc-point img {
	width: 32px;
	height: 32px;
	object-fit: contain;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 1px 4px rgba(0,0,0,.12);
	display: block;
}
.fsw-fc-fallback {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	display: block;
}

/* Freundschaftsspiel: Logo ausgegraut */
.fsw-fc-friendly {
	opacity: 0.35;
}
.fsw-fc-friendly img {
	filter: grayscale(100%);
}

/* Ergebnis-Badges unter dem Diagramm */
.fsw-fc-results {
	display: flex;
	margin-top: 8px;
	padding-left: 28px;
}
.fsw-fc-res {
	flex: 1;
	text-align: center;
}
.fsw-fcr {
	display: inline-block;
	font-family: "Oswald", sans-serif;
	font-size: 13px;
	font-weight: 700;
	padding: 3px 8px;
	border-radius: 4px;
}
.fsw-fcr-w { background: #f0fdf4; color: var(--fsw-win); }
.fsw-fcr-l { background: #fef2f2; color: var(--fsw-loss); }
.fsw-fcr-d { background: #fffbeb; color: var(--fsw-draw); }
.fsw-fcr-date {
	display: block;
	font-size: .75rem;
	color: var(--fsw-mut);
	margin-top: 2px;
}
/* Freundschaftsspiel: Ergebnis neutral mit gestricheltem Rand */
.fsw-fc-res-friendly .fsw-fcr {
	background: var(--fsw-friendly-bg);
	color: var(--fsw-friendly-txt);
	outline: 1px dashed var(--fsw-friendly-txt);
	outline-offset: -1px;
}


/* ═══ Tabelle ═══ */

.fsw-tbl {
	background: var(--fsw-wh);
}
.fsw-tbl-scroll {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}
.fsw-tbl-scroll:focus-visible {
	outline: 2px solid var(--fsw-primary);
	outline-offset: 2px;
}
.fsw-tbl table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
}
.fsw-tbl thead {
	background: var(--fsw-bg);
}
.fsw-tbl thead th {
	padding: 8px 6px;
	text-align: center;
	font-family: "Oswald", sans-serif;
	font-weight: 600;
	font-size: .75rem;
	text-transform: uppercase;
	letter-spacing: .5px;
	color: var(--fsw-mut);
}
.fsw-tbl td,
.fsw-tbl tbody th {
	padding: 10px 6px;
	text-align: center;
	border-bottom: 1px solid var(--fsw-brd);
	font-size: 13px;
}
/* Team-Zelle ist ein Zeilenkopf (th) – Browser-/Theme-Fettdruck für th zurücksetzen */
.fsw-tbl tbody th {
	font-weight: 400;
	color: inherit;
	background: none;
}
.fsw-tbl .fsw-al { text-align: left; }
.fsw-pos { font-weight: 700; color: var(--fsw-mut); width: 30px; }
.fsw-pts { font-weight: 700; }
.fsw-goal { white-space: nowrap; }
.fsw-tc  {
	font-weight: 500;
	max-width: 180px;
	display: flex;
	align-items: center;
	gap: 8px;
}
/* Ellipse greift nur am Text-Element, nicht am Flex-Container */
.fsw-tc-name {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.fsw-tbl-logo {
	width: 22px;
	height: 22px;
	object-fit: contain;
	flex-shrink: 0;
}
/* Eigenes Team hervorheben */
.fsw-our {
	background: var(--fsw-primary-faint, rgba(41, 22, 111, 0.07));
}
.fsw-our .fsw-tc  { color: var(--fsw-primary-text); font-weight: 700; }
.fsw-our .fsw-pts { color: var(--fsw-primary-text); }


/* ═══ Tabs (Startseite-Widget) ═══ */

.fsw-tabs {
	display: flex;
	background: var(--fsw-dark);
	border-radius: 12px 12px 0 0;
	overflow-x: auto;
}
.fsw-tab {
	background: 0 0;
	border: none;
	color: var(--fsw-on-dark-mut);
	font-family: "Oswald", sans-serif;
	font-weight: 500;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 1px;
	padding: 12px 18px;
	cursor: pointer;
	transition: color .2s, background-color .2s, border-color .2s;
	white-space: nowrap;
	text-decoration: none;
	border-bottom: 2px solid transparent;
}
.fsw-tab:hover       { color: var(--fsw-on-dark); background: rgba(255,255,255,.07); }
.fsw-tab:focus-visible { outline: 2px solid var(--fsw-accent); outline-offset: -2px; }
.fsw-tab.fsw-active  { color: var(--fsw-accent); border-bottom-color: var(--fsw-accent); }
/* Panels nur verbergen, wenn JS läuft – ohne JS bleiben alle Mannschaften sichtbar */
.fsw-js .fsw-panel { display: none; }
.fsw-js .fsw-panel.fsw-show { display: block; }
.fsw-home {
	background: var(--fsw-wh);
	border-radius: 12px;
	border: 1px solid var(--fsw-brd);
	overflow: hidden;
}
.fsw-home .fsw-full { border-radius: 0; border: none; }


/* ═══ Spielplan ═══ */

.fsw-sched {
	background: var(--fsw-wh);
	border-radius: 12px;
	border: 1px solid var(--fsw-brd);
	overflow: hidden;
}
.fsw-sr-list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.fsw-sr {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 16px;
	border-bottom: 1px solid var(--fsw-brd);
	font-size: 13px;
}
.fsw-sr:last-child { border-bottom: none; }
.fsw-sd { display: block; width: 50px; text-align: center; flex-shrink: 0; }
.fsw-swd {
	display: block;
	font-family: "Oswald", sans-serif;
	font-weight: 600;
	font-size: .75rem;
	text-transform: uppercase;
	color: var(--fsw-primary-text);
}
.fsw-sdd { font-size: .75rem; color: var(--fsw-mut); }
.fsw-st-time {
	width: 40px;
	font-family: "Oswald", sans-serif;
	font-weight: 600;
	font-size: 13px;
	flex-shrink: 0;
}
.fsw-sm-match { flex: 1; min-width: 0; }
.fsw-sm-match .fsw-hl { font-weight: 700; color: var(--fsw-primary-text); }
.fsw-team-label {
	display: inline-block;
	font-family: "Oswald", sans-serif;
	font-size: .75rem;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: .5px;
	color: var(--fsw-primary-text);   /* Gold auf Hell wäre nur ~1.8:1 */
	background: var(--fsw-primary-faint2, rgba(41, 22, 111, 0.08));
	padding: 1px 6px;
	border-radius: 3px;
	margin-left: 6px;
	vertical-align: middle;
}
.fsw-slg {
	flex-shrink: 0;
	font-size: .75rem;
	color: var(--fsw-mut);
	max-width: 90px;
	text-align: right;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}


/* ═══ Banner-Texte ═══ */

.fsw-txt-datum, .fsw-txt-liga {
	font-family: "Oswald", sans-serif;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .5px;
	font-size: 22px;
}
.fsw-txt-datum { color: var(--fsw-accent); }
.fsw-txt-liga  { color: #fff; }


/* ═══ Responsive ═══ */

@media (max-width: 640px) {
	.fsw-mu             { gap: 14px; padding: 20px 10px 8px; }
	.fsw-t              { max-width: 120px; }
	.fsw-crest          { width: 56px; height: 56px; }
	.fsw-logo           { width: 56px; height: 56px; }
	.fsw-crest-txt      { width: 56px; height: 56px; font-size: 14px; }
	.fsw-tn             { font-size: 13px; }
	.fsw-kick           { font-size: 24px; padding: 6px 10px; }
	.fsw-score          { font-size: 22px; }
	.fsw-tab            { padding: 10px 12px; font-size: 12px; }
	.fsw-sr             { flex-wrap: wrap; }
	/* Liga-Zeile unter der Paarung: Datum 50px + Abstand 10 + Zeit 40 + Abstand 10 */
	.fsw-slg            { flex-basis: 100%; max-width: none; text-align: left; margin-left: 110px; }
	.fsw-tbl td,
	.fsw-tbl th,
	.fsw-tbl thead th,
	.fsw-tbl tbody th   { padding: 7px 4px; font-size: .75rem; }
	.fsw-fc-area        { height: 130px; }
	.fsw-fc-point img   { width: 24px; height: 24px; }
	.fsw-section-title .fsw-section-h { font-size: .75rem; }
}
@media (max-width: 400px) {
	.fsw-crest     { width: 48px; height: 48px; }
	.fsw-logo      { width: 48px; height: 48px; }
	.fsw-crest-txt { width: 48px; height: 48px; }
	.fsw-tn        { font-size: 12px; }
	.fsw-kick      { font-size: 20px; }
	.fsw-score     { font-size: 18px; }
}
@media (max-width: 380px) {
	/* Sehr schmale Screens: alle Spalten behalten (keine Information ausblenden), dafür
	   kompakter. Reicht die Breite nicht, scrollt die Tabelle in ihrem Container. */
	.fsw-tbl td,
	.fsw-tbl th,
	.fsw-tbl thead th,
	.fsw-tbl tbody th   { padding: 6px 2px; }
	.fsw-tbl .fsw-pos   { width: 20px; }
	.fsw-tc             { gap: 4px; max-width: 120px; }
	.fsw-tbl-logo       { width: 16px; height: 16px; }
}

@media (prefers-reduced-motion: reduce) {
	.fsw-dot,
	.fsw-tab {
		transition: none;
	}
	.fsw-dot:hover {
		transform: none;
	}
}


/* ═══ Kalender-Abo ([fsw_kalender]) ═══ */

.fsw-cal {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 16px;
}
.fsw-cal-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 18px;
	border-radius: 6px;
	background: var(--fsw-primary);
	color: var(--fsw-on-primary);
	font-family: "Oswald", sans-serif;
	font-weight: 600;
	font-size: .875rem;
	text-transform: uppercase;
	letter-spacing: 1px;
	text-decoration: none;
}
.fsw-cal-btn:hover,
.fsw-cal-btn:focus-visible {
	background: var(--fsw-dark);
	color: var(--fsw-on-dark);
}
.fsw-cal-btn:focus-visible {
	outline: 2px solid var(--fsw-accent);
	outline-offset: 2px;
}
.fsw-cal-dl {
	font-size: .875rem;
	color: var(--fsw-primary-text);
}