/*
 * NKC Club – Frontend
 * Nutzt die Farb-Variablen des NKC-Themes, funktioniert mit Fallbacks aber auch in anderen Themes.
 */
.nkc-rennplan,
.nkc-training,
.nkc-standings,
.nkc-teams,
.nkc-facebook,
.nkc-events {
	--_ink: var(--nkc-ink, #10202f);
	--_muted: var(--nkc-muted, #5b6b7a);
	--_line: var(--nkc-line, #e3e8ee);
	--_bg: var(--nkc-surface, #fff);
	--_soft: var(--nkc-soft, #f3f6f8);
	--_brand: var(--nkc-brand, #0f8b8d);
	--_accent: var(--nkc-accent, #ff6b35);
	--_navy: var(--nkc-navy, #0b2238);
	--_radius: var(--nkc-radius, 18px);
	color: var(--_ink);
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

.nkc-empty {
	padding: 1.5rem;
	border: 1px dashed var(--_line, #e3e8ee);
	border-radius: var(--_radius, 18px);
	color: var(--_muted, #5b6b7a);
	text-align: center;
}

.nkc-small { font-size: .85rem; color: var(--_muted); }

/* ---------- Buttons ---------- */
.nkc-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .4em;
	padding: .7em 1.2em;
	border: 0;
	border-radius: 999px;
	background: var(--_navy, #0b2238);
	color: #fff;
	font: inherit;
	font-weight: 600;
	line-height: 1.1;
	text-decoration: none;
	cursor: pointer;
	transition: transform .15s ease, background .15s ease, box-shadow .15s ease;
}
.nkc-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgb(11 34 56 / .18); color: #fff; }
.nkc-btn:disabled { opacity: .55; cursor: wait; transform: none; }
.nkc-btn--primary { background: var(--_accent, #ff6b35); }
.nkc-btn--danger { background: #c2412d; }
.nkc-btn--small { padding: .5em .95em; font-size: .9rem; }
.nkc-btn--block { width: 100%; }

/* ---------- Ankündigung ---------- */
.nkc-announcement {
	position: relative;
	z-index: 60;
	padding: .65rem 1rem;
	background: var(--nkc-accent, #ff6b35);
	color: #fff;
	font-weight: 600;
	text-align: center;
	font-size: .95rem;
}
.nkc-announcement a { color: inherit; text-decoration: none; }
.nkc-announcement a:hover { text-decoration: underline; }
.nkc-announcement--dark { background: var(--nkc-navy, #0b2238); }
.nkc-announcement--warning { background: #ffd23f; color: #3a2a00; }

/* ---------- Rennplan ---------- */
.nkc-toolbar {
	display: flex;
	flex-wrap: wrap;
	gap: .75rem 1rem;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 1.25rem;
	position: sticky;
	top: var(--nkc-sticky-top, 0px);
	z-index: 5;
	padding: .75rem;
	background: color-mix(in srgb, var(--_bg) 88%, transparent);
	backdrop-filter: blur(10px);
	border: 1px solid var(--_line);
	border-radius: calc(var(--_radius) + 4px);
}
.nkc-toolbar__right { display: flex; gap: .5rem; flex-wrap: wrap; }
.nkc-chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.nkc-chip {
	padding: .45em .95em;
	border: 1px solid var(--_line);
	border-radius: 999px;
	background: var(--_bg);
	color: var(--_ink);
	font: inherit;
	font-size: .9rem;
	font-weight: 600;
	cursor: pointer;
}
.nkc-chip.is-active { background: var(--_navy); border-color: var(--_navy); color: #fff; }
.nkc-select,
.nkc-search input {
	padding: .55em .9em;
	border: 1px solid var(--_line);
	border-radius: 999px;
	background: var(--_bg);
	font: inherit;
	font-size: .9rem;
	color: var(--_ink);
}
.nkc-search input { min-width: 14rem; }

.nkc-live {
	display: flex;
	align-items: center;
	gap: .5rem;
	font-size: .9rem;
	color: var(--_muted);
}
.nkc-live__dot {
	width: .6rem;
	height: .6rem;
	border-radius: 50%;
	background: #e63946;
	box-shadow: 0 0 0 0 rgb(230 57 70 / .6);
	animation: nkc-pulse 1.6s infinite;
}
@keyframes nkc-pulse {
	70% { box-shadow: 0 0 0 .6rem rgb(230 57 70 / 0); }
	100% { box-shadow: 0 0 0 0 rgb(230 57 70 / 0); }
}

.nkc-day {
	margin: 2rem 0 1rem;
	font-size: 1.1rem;
	color: var(--_muted);
	text-transform: uppercase;
	letter-spacing: .06em;
}

.nkc-race {
	display: grid;
	grid-template-columns: 5.5rem 1fr;
	gap: 1rem;
	margin-bottom: .9rem;
	padding: 1rem 1.1rem;
	background: var(--_bg);
	border: 1px solid var(--_line);
	border-radius: var(--_radius);
	scroll-margin-top: 6rem;
	transition: box-shadow .2s ease, border-color .2s ease;
}
.nkc-race.is-next {
	border-color: var(--_accent);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--_accent) 20%, transparent), 0 12px 30px rgb(11 34 56 / .08);
}
.nkc-race.is-finished { background: var(--_soft); }
.nkc-race__time { display: flex; flex-direction: column; gap: .15rem; }
.nkc-race__time strong { font-size: 1.5rem; line-height: 1; font-variant-numeric: tabular-nums; }
.nkc-race__time span { font-size: .8rem; color: var(--_muted); font-weight: 600; }
.nkc-race__head {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 1rem;
	margin-bottom: .5rem;
}
.nkc-race__title { margin: .3rem 0 0; font-size: 1rem; }
.nkc-tag {
	display: inline-block;
	padding: .15em .6em;
	border-radius: 6px;
	background: var(--_soft);
	font-size: .75rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: var(--_muted);
}
.nkc-tag--round { background: color-mix(in srgb, var(--_brand) 14%, transparent); color: var(--_brand); }
.nkc-status {
	flex-shrink: 0;
	padding: .2em .7em;
	border-radius: 999px;
	font-size: .75rem;
	font-weight: 700;
	background: var(--_soft);
	color: var(--_muted);
}
.nkc-race.is-next .nkc-status { background: var(--_accent); color: #fff; }
.nkc-status--running { background: #e63946; color: #fff; }
.nkc-status--finished { background: color-mix(in srgb, var(--_brand) 16%, transparent); color: var(--_brand); }

.nkc-lanes { width: 100%; border-collapse: collapse; font-size: .95rem; }
.nkc-lanes th:first-child { width: 8.5rem; }
.nkc-lanes th:last-child { width: 3.5rem; }
.nkc-lanes td, .nkc-lanes th { border-bottom: 0; }
.nkc-lanes th {
	text-align: left;
	font-size: .7rem;
	text-transform: uppercase;
	letter-spacing: .05em;
	color: var(--_muted);
	font-weight: 600;
	padding: .25rem .4rem;
}
.nkc-lanes td { padding: .4rem; border-top: 1px solid var(--_line); }
.nkc-lanes__lane { width: 8.5rem; color: var(--_muted); font-variant-numeric: tabular-nums; }
.nkc-lanes__team { font-weight: 600; }
.nkc-lanes__time { width: 6rem; font-variant-numeric: tabular-nums; }
.nkc-lanes__place { width: 3rem; }
.nkc-lanes tr.is-highlight td { background: color-mix(in srgb, var(--_accent) 12%, transparent); }
.nkc-lanes tr.is-winner .nkc-lanes__team::after { content: " 🏆"; }

.nkc-place {
	display: inline-grid;
	place-items: center;
	width: 1.7rem;
	height: 1.7rem;
	border-radius: 50%;
	background: var(--_soft);
	font-weight: 700;
	font-size: .85rem;
}
.nkc-place--1 { background: #ffd23f; color: #3a2a00; }
.nkc-place--2 { background: #d9dee3; }
.nkc-place--3 { background: #e7b07a; color: #3d2410; }

@media (max-width: 640px) {
	.nkc-race { grid-template-columns: 1fr; gap: .5rem; }
	.nkc-race__time { flex-direction: row; align-items: baseline; gap: .6rem; }
	.nkc-search input { min-width: 0; width: 100%; }
	.nkc-toolbar__right, .nkc-search { width: 100%; }
	.nkc-lanes__lane { width: 5.5rem; }
}

/* ---------- Tabellen (Rangliste) ---------- */
.nkc-standings__cat { margin-bottom: 2rem; }
.nkc-table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	background: var(--_bg);
	border: 1px solid var(--_line);
	border-radius: var(--_radius);
	overflow: hidden;
	font-variant-numeric: tabular-nums;
}
.nkc-table th, .nkc-table td { padding: .65rem .8rem; text-align: left; border-bottom: 1px solid var(--_line); }
.nkc-table th { background: var(--_soft); font-size: .75rem; text-transform: uppercase; letter-spacing: .05em; color: var(--_muted); }
.nkc-table tr:last-child td { border-bottom: 0; }
.nkc-table { border-bottom: 3px solid var(--_ink, #0f2233); }

/* ---------- Teams ---------- */
.nkc-teams section { margin-bottom: 1.5rem; }
.nkc-teams h3 small { font-weight: 500; color: var(--_muted); font-size: .8em; }
.nkc-teams__list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr));
	gap: .5rem;
}
.nkc-teams__list li {
	padding: .7rem 1rem;
	background: var(--_bg);
	border: 1px solid var(--_line);
	border-radius: 12px;
	font-weight: 600;
}

/* ---------- Training ---------- */
.nkc-training__intro {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	margin-bottom: 1.5rem;
}
.nkc-hint { margin: 0; max-width: 46rem; color: var(--_muted); }
.nkc-legend { display: flex; gap: 1rem; list-style: none; margin: 0; padding: 0; font-size: .9rem; color: var(--_muted); }
.nkc-dot { display: inline-block; width: .7rem; height: .7rem; border-radius: 50%; vertical-align: middle; margin-right: .25rem; }
.nkc-dot--free { background: #2bb673; }
.nkc-dot--full { background: #c6ced6; }

.nkc-notice {
	padding: 1rem 1.25rem;
	border-radius: var(--_radius);
	background: var(--_soft);
	margin-bottom: 1.5rem;
}
.nkc-notice--cancel { background: #fff4e5; border: 1px solid #ffd59e; }

.nkc-day-slots { margin-bottom: 1.5rem; }
.nkc-day-slots__date {
	display: flex;
	align-items: baseline;
	gap: .6rem;
	margin: 0 0 .6rem;
	font-size: 1.05rem;
}
.nkc-day-slots__weekday {
	display: inline-grid;
	place-items: center;
	min-width: 2.6rem;
	padding: .25rem .5rem;
	border-radius: 10px;
	background: var(--_navy);
	color: #fff;
	font-size: .8rem;
	text-transform: uppercase;
}
.nkc-day-slots__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr));
	gap: .6rem;
}
.nkc-slot {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: .9rem;
	padding: .8rem 1rem;
	background: var(--_bg);
	border: 1px solid var(--_line);
	border-left: 4px solid #2bb673;
	border-radius: 14px;
}
.nkc-slot.is-full { border-left-color: #c6ced6; background: var(--_soft); }
.nkc-slot__time { display: flex; flex-direction: column; line-height: 1.15; }
.nkc-slot__time strong { font-size: 1.25rem; font-variant-numeric: tabular-nums; }
.nkc-slot__time span { font-size: .8rem; color: var(--_muted); }
.nkc-slot__info { min-width: 0; font-size: .9rem; }
.nkc-slot__info small { display: block; color: var(--_muted); }
.nkc-slot__teams { list-style: none; margin: 0; padding: 0; font-weight: 600; }
.nkc-slot__teams li { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nkc-slot__badge { font-size: .8rem; font-weight: 700; color: var(--_muted); }

/* Dialog */
.nkc-dialog {
	width: min(32rem, calc(100vw - 2rem));
	padding: 0;
	border: 0;
	border-radius: calc(var(--_radius) + 6px);
	box-shadow: 0 30px 80px rgb(6 25 43 / .35);
	color: var(--_ink, #10202f);
}
.nkc-dialog::backdrop { background: rgb(6 25 43 / .55); backdrop-filter: blur(3px); }
.nkc-form { position: relative; padding: 1.75rem; display: grid; gap: .9rem; }
.nkc-form h3 { margin: 0; font-size: 1.4rem; }
.nkc-form__slot { margin: -.4rem 0 .3rem; color: var(--nkc-brand, #0f8b8d); font-weight: 600; }
.nkc-dialog__close {
	position: absolute;
	top: .8rem;
	right: .8rem;
	width: 2.2rem;
	height: 2.2rem;
	border: 0;
	border-radius: 50%;
	background: var(--nkc-soft, #f3f6f8);
	font-size: 1.4rem;
	line-height: 1;
	cursor: pointer;
}
.nkc-field { display: grid; gap: .3rem; font-size: .85rem; font-weight: 600; }
.nkc-field input {
	padding: .75em .9em;
	border: 1px solid var(--nkc-line, #d5dde5);
	border-radius: 12px;
	font: inherit;
	font-weight: 400;
	font-size: 1rem;
}
.nkc-field input:focus { outline: 2px solid var(--nkc-brand, #0f8b8d); outline-offset: 1px; border-color: transparent; }
.nkc-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
@media (max-width: 480px) { .nkc-field-row { grid-template-columns: 1fr; } }
.nkc-check { display: flex; gap: .55rem; align-items: flex-start; font-size: .85rem; line-height: 1.4; }
.nkc-check input { margin-top: .2rem; }
.nkc-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.nkc-msg { margin: 0; min-height: 1.2em; font-size: .9rem; }
.nkc-msg.is-success { color: #13804b; font-weight: 600; }
.nkc-msg.is-error { color: #c2412d; font-weight: 600; }

/* ---------- Countdown ---------- */
.nkc-countdown { display: flex; gap: .6rem; }
.nkc-countdown > div {
	min-width: 4.4rem;
	padding: .7rem .5rem;
	border-radius: 16px;
	background: rgb(255 255 255 / .1);
	border: 1px solid rgb(255 255 255 / .18);
	text-align: center;
	backdrop-filter: blur(6px);
}
.nkc-countdown span { display: block; font-size: 2rem; font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; }
.nkc-countdown small { font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; opacity: .75; }

/* ---------- Termine ---------- */
.nkc-events { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.nkc-event {
	display: flex;
	gap: 1rem;
	align-items: center;
	padding: .75rem;
	background: var(--_bg);
	border: 1px solid var(--_line);
	border-radius: 16px;
}
.nkc-event__date {
	display: grid;
	place-items: center;
	flex-shrink: 0;
	width: 3.6rem;
	height: 3.6rem;
	border-radius: 12px;
	background: var(--_navy);
	color: #fff;
	line-height: 1;
}
.nkc-event__day { font-size: 1.35rem; font-weight: 700; }
.nkc-event__month { font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; opacity: .8; }
.nkc-event__title { display: block; font-weight: 700; color: inherit; text-decoration: none; }
.nkc-event__title:hover { color: var(--_brand); }
.nkc-event__meta { font-size: .85rem; color: var(--_muted); }

/* ---------- Facebook ---------- */
.nkc-facebook { display: grid; gap: 1rem; }
.nkc-facebook__group {
	display: grid;
	grid-template-columns: auto 1fr auto;
	gap: 1rem;
	align-items: center;
	padding: 1.1rem 1.25rem;
	border-radius: var(--_radius);
	background: #1877f2;
	color: #fff;
}
.nkc-facebook__group p { margin: .15rem 0 0; font-size: .9rem; opacity: .9; }
.nkc-facebook__group .nkc-btn { background: #fff; color: #1877f2; }
@media (max-width: 560px) { .nkc-facebook__group { grid-template-columns: 1fr; } }
.nkc-facebook__embed {
	min-height: 12rem;
	display: grid;
	place-items: center;
	border-radius: var(--_radius);
	background: var(--_soft);
	border: 1px solid var(--_line);
	overflow: hidden;
}
.nkc-facebook__embed.is-loaded { background: transparent; border: 0; place-items: start center; }
.nkc-facebook__consent { padding: 1.5rem; text-align: center; max-width: 26rem; }
.nkc-facebook__consent .nkc-check { justify-content: center; margin-top: .6rem; }

/* ---------- Bootsklassen (10er / 20er) ---------- */
.nkc-tag--boat { background: var(--_navy); color: #fff; }
.nkc-slot.is-partial { border-left-color: #f2a900; }
.nkc-boats { list-style: none; margin: 0; padding: 0; display: grid; gap: .25rem; }
.nkc-boat { display: flex; flex-wrap: wrap; align-items: baseline; gap: .15rem .5rem; line-height: 1.35; }
.nkc-boat__class {
	flex-shrink: 0;
	padding: .05rem .45rem;
	border-radius: 999px;
	background: color-mix(in srgb, #2bb673 16%, transparent);
	color: #17784a;
	font-size: .72rem; font-weight: 800; letter-spacing: .02em;
}
.nkc-boat.is-full .nkc-boat__class { background: var(--_soft); color: var(--_muted); }
.nkc-boat__state { color: var(--_muted); font-size: .85rem; }
.nkc-boat__teams { flex-basis: 100%; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.nkc-boat-choice { border: 0; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.nkc-boat-choice legend { padding: 0; margin-bottom: .3rem; }
.nkc-boat-choice__opt {
	display: flex; align-items: center; gap: .5rem;
	padding: .7rem .8rem;
	border: 1px solid var(--_line); border-radius: 12px;
	cursor: pointer; font-weight: 500;
}
.nkc-boat-choice__opt:has(input:checked) { border-color: var(--nkc-brand, #0f8b8d); background: color-mix(in srgb, var(--nkc-brand, #0f8b8d) 8%, transparent); }
.nkc-boat-choice__opt.is-disabled { opacity: .45; cursor: not-allowed; }
.nkc-boat-choice__opt span { display: grid; line-height: 1.25; }
.nkc-boat-choice__opt small { color: var(--_muted); font-size: .75rem; }

/* ---------- Handy ---------- */
@media (max-width: 640px) {
	.nkc-slot { grid-template-columns: auto minmax(0, 1fr) auto; gap: .7rem; padding: .75rem .8rem; }
	.nkc-slot .nkc-btn--small { padding: .5em .8em; font-size: .85rem; }
	.nkc-boat__state { font-size: .8rem; }
	.nkc-standings__cat { overflow-x: auto; }
	.nkc-table th, .nkc-table td { padding: .55rem .45rem; }
	.nkc-table th { font-size: .65rem; letter-spacing: .03em; }
	.nkc-teams__list { grid-template-columns: 1fr 1fr; }
	.nkc-teams__list li { padding: .6rem .75rem; font-size: .92rem; }
}
.nkc-lanes__place small { white-space: nowrap; color: var(--_muted); }
.nkc-dot--partial { background: #f2a900; }

/* Bootsname unter der Bahnnummer, Läufe ohne feste Teams, Endergebnis */
.nkc-lanes__lane small { display: block; font-size: .68rem; line-height: 1.2; color: var(--_muted); white-space: nowrap; }
.nkc-lanes__lane { width: auto; min-width: 2.5rem; }
.nkc-lanes__empty { color: var(--_muted); font-style: italic; }
.nkc-podium { display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: 1rem; margin-bottom: 2rem; }
.nkc-podium__group { padding: 1.1rem 1.25rem; background: var(--_bg); border: 1px solid var(--_line); border-radius: var(--_radius); }
.nkc-podium__group h3 { margin: 0 0 .75rem; font-size: 1.1rem; }
.nkc-podium__list { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; font-weight: 600; }
.nkc-podium__list li { display: flex; align-items: center; gap: .6rem; }
.nkc-standings__title { margin-top: 1rem; }