/* Kobras Verein – Komponenten. Farben kommen aus dem Theme, mit Ersatzwerten. */
:root {
	--kv-schwarz: var(--wp--preset--color--schwarz, #0b0b0c);
	--kv-weiss: var(--wp--preset--color--weiss, #ffffff);
	--kv-grau: var(--wp--preset--color--grau, #55595e);
	--kv-linie: var(--wp--preset--color--linie, #dcdde0);
	--kv-hell: var(--wp--preset--color--hellgrau, #f2f2f3);
	--kv-akzent: var(--wp--preset--color--orange, #ff751f);
	--kv-display: var(--wp--preset--font-family--anton, Anton, Impact, sans-serif);
}

.kv-button {
	display: inline-flex; align-items: center; gap: 6px; min-height: 44px; box-sizing: border-box;
	padding: 14px 24px; background: var(--kv-akzent); color: var(--kv-schwarz) !important;
	font-weight: 700; letter-spacing: .1em; text-transform: uppercase; font-size: 14px;
	text-decoration: none; border: 0; border-radius: 2px; cursor: pointer;
}
.kv-button:hover, .kv-button:focus-visible { background: var(--kv-schwarz); color: var(--kv-weiss) !important; }
.kv-button--outline { background: transparent; border: 2px solid currentColor; color: inherit !important; padding: 12px 20px; }
.kv-button--outline:hover { background: var(--kv-schwarz); border-color: var(--kv-schwarz); color: var(--kv-weiss) !important; }
.kv-buttons { display: flex; flex-wrap: wrap; gap: 12px; }
.kv-link { font-weight: 700; text-transform: uppercase; letter-spacing: .08em; font-size: 14px; color: inherit; text-decoration: none; border-bottom: 2px solid var(--kv-akzent); padding-bottom: 3px; }

/* Kacheln */
.kv-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
.kv-tile { position: relative; min-height: 420px; display: flex; align-items: flex-end; overflow: hidden; color: #fff !important; text-decoration: none;
	background-color: #17181a;
	background-image: repeating-linear-gradient(45deg, rgba(255,255,255,.045) 0 2px, transparent 2px 22px), repeating-linear-gradient(-45deg, rgba(255,255,255,.045) 0 2px, transparent 2px 22px); }
.kv-tile__bild { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(100%); transition: transform .5s ease, filter .3s; }
.kv-tile::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.88) 0%, rgba(0,0,0,0) 60%); }
.kv-tile:hover .kv-tile__bild, .kv-tile:focus-visible .kv-tile__bild { transform: scale(1.04); }
.kv-tile__text { position: relative; z-index: 1; padding: 26px; display: flex; flex-direction: column; gap: 8px; }
.kv-tile__titel { font-family: var(--kv-display); font-size: clamp(30px, 3vw, 38px); line-height: 1; text-transform: uppercase; }
.kv-tile__sub { color: #e4e5e7; font-size: 15px; }
.kv-tile__strich { display: block; width: 48px; height: 3px; background: var(--kv-akzent); margin-top: 8px; transition: width .3s; }
.kv-tile:hover .kv-tile__strich { width: 96px; }
.kv-tiles--teams .kv-tile { min-height: 320px; }

/* Kompakte Teamliste */
.kv-teamliste { display: flex; flex-direction: column; }
.kv-teamliste__row { display: flex; flex-wrap: wrap; gap: 8px 24px; padding: 22px 0; border-bottom: 1px solid var(--kv-linie); color: inherit; text-decoration: none; align-items: baseline; }
.kv-teamliste__name { font-family: var(--kv-display); font-size: 28px; text-transform: uppercase; min-width: 170px; }
.kv-teamliste__info { flex: 1 1 240px; display: flex; flex-direction: column; gap: 4px; color: var(--kv-grau); }
.kv-teamliste__info strong { color: var(--kv-schwarz); }

/* Mannschaftsseite */
.kv-team { display: flex; flex-direction: column; gap: 48px; }
.kv-fakten { display: flex; flex-wrap: wrap; gap: 16px 48px; margin: 0; }
.kv-fakten dt { font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--kv-grau); font-weight: 700; }
.kv-fakten dd { margin: 4px 0 0; font-size: 20px; font-weight: 700; }
.kv-block__titel { font-family: var(--kv-display); font-weight: 400; text-transform: uppercase; font-size: 36px; margin: 0 0 20px; }
.kv-personen { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
.kv-person { display: flex; gap: 14px; align-items: center; padding: 16px; border: 1px solid var(--kv-linie); background: var(--kv-weiss); }
.kv-person__foto { width: 64px; height: 64px; object-fit: cover; border-radius: 50%; filter: grayscale(100%); }
.kv-person__text { display: flex; flex-direction: column; gap: 2px; font-size: 15px; }
.kv-person__name { font-size: 17px; }
.kv-person__funktion { color: var(--kv-grau); }
.kv-kontakt { margin-top: 16px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.kv-kontakt__label { font-size: 12px; letter-spacing: .2em; text-transform: uppercase; font-weight: 700; color: var(--kv-grau); }
.kv-zeiten { border-collapse: collapse; width: 100%; max-width: 760px; }
.kv-zeiten th, .kv-zeiten td { text-align: left; padding: 14px 16px 14px 0; border-bottom: 1px solid var(--kv-linie); }
.kv-zeiten th { font-weight: 700; width: 140px; }
.kv-status { display: inline-block; background: var(--kv-akzent); color: var(--kv-schwarz); font-size: 12px; font-weight: 700; padding: 2px 8px; margin-left: 6px; }
.kv-probe { background: var(--kv-hell); padding: 32px; }
.kv-2klick { margin-top: 20px; padding: 24px; border: 1px dashed var(--kv-linie); }
.kv-hinweis { padding: 24px; border: 1px dashed var(--kv-linie); color: var(--kv-grau); }

/* Spielbetrieb */
.kv-spielbetrieb { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; }
.kv-spiel { border: 1px solid var(--kv-linie); padding: 24px; display: flex; flex-direction: column; gap: 10px; background: var(--kv-weiss); }
.kv-badge { align-self: flex-start; background: var(--kv-schwarz); color: var(--kv-weiss); font-size: 12px; font-weight: 700; letter-spacing: .12em; padding: 6px 10px; text-transform: uppercase; }
.kv-spiel__team { font-family: var(--kv-display); font-weight: 400; text-transform: uppercase; font-size: 28px; line-height: 1.1; margin: 4px 0 0; }
.kv-spiel__team a { color: inherit; text-decoration: none; }
.kv-spiel__liga { color: var(--kv-grau); font-size: 15px; }
.kv-spiel__links { display: flex; flex-wrap: wrap; gap: 16px; margin-top: auto; padding-top: 14px; border-top: 1px solid var(--kv-linie); }
.kv-spiel__links a { font-weight: 700; color: inherit; text-decoration: none; border-bottom: 2px solid var(--kv-akzent); }
.kv-spielbetrieb__alle { margin-top: 20px; }

/* Partner */
.kv-partner { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 12px; }
.kv-partner li { background: var(--kv-weiss); border: 1px solid #e4e5e7; height: 96px; display: flex; align-items: center; justify-content: center; padding: 10px; box-sizing: border-box; }
.kv-partner li > a { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; }
.kv-partner img { max-width: 100%; max-height: 72px; width: auto; height: auto; object-fit: contain; filter: grayscale(100%); opacity: .75; transition: filter .2s, opacity .2s; }
.kv-partner li:hover img, .kv-partner a:focus-visible img, .kv-partner--farbig img { filter: none; opacity: 1; }
.kv-partner__name { font-weight: 700; font-size: 14px; letter-spacing: .06em; text-transform: uppercase; color: var(--kv-grau); text-align: center; }

/* Termine */
.kv-termine { list-style: none; margin: 0; padding: 0; }
.kv-termin { display: flex; flex-wrap: wrap; gap: 20px; align-items: center; padding: 18px 0; border-top: 1px solid var(--kv-linie); }
.kv-termin__datum { width: 80px; height: 80px; background: var(--kv-schwarz); color: var(--kv-weiss); display: flex; flex-direction: column; align-items: center; justify-content: center; }
.kv-termin__tag { font-family: var(--kv-display); font-size: 32px; line-height: 1; }
.kv-termin__monat { font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--kv-akzent); }
.kv-termin__text { flex: 1 1 200px; display: flex; flex-direction: column; gap: 4px; }
.kv-termin__titel { font-weight: 700; font-size: 20px; color: inherit; text-decoration: none; }
.kv-termin__info { color: var(--kv-grau); }

/* Beiträge, Dokumente */
.kv-beitraege { border-collapse: collapse; width: 100%; max-width: 640px; }
.kv-beitraege th, .kv-beitraege td { text-align: left; padding: 14px 0; border-bottom: 1px solid var(--kv-linie); }
.kv-beitraege td { text-align: right; font-weight: 700; }
.kv-dokumente { list-style: none; padding: 0; }
.kv-dokumente li { padding: 14px 0; border-bottom: 1px solid var(--kv-linie); }
.kv-dokumente a { font-weight: 700; color: inherit; }
.kv-dokumente__meta { color: var(--kv-grau); font-size: 14px; margin-left: 8px; }
.kv-missing { background: #fff3cd; padding: 0 4px; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); white-space: nowrap; }
