/* =============================================
   Kurse Page — kurse.css
   ============================================= */

/* ── Page Hero (reuses .page-hero from uber-uns.css) ── */
.page-hero { position: relative; min-height: 52vh; display: flex; align-items: center; overflow: hidden; }
.page-hero__bg {
  position: absolute; inset: 0;
  background:
    linear-gradient(to bottom, rgba(0,0,0,.6) 0%, rgba(0,0,0,.75) 100%),
    url('../assets/b1.jpg') center / cover fixed;
}
.page-hero__body { position: relative; z-index: 1; padding-top: 7rem; padding-bottom: 4rem; text-align: center; }
.page-hero__eye  { font-size: .6875rem; font-weight: 600; letter-spacing: .3em; text-transform: uppercase; color: var(--gold); margin-bottom: 1rem; animation: fadeUp .8s var(--ease) both; }
.page-hero__title { font-family: var(--font-display); font-size: clamp(3.5rem,9vw,7rem); line-height: 1; letter-spacing: .03em; margin-bottom: 1.25rem; animation: fadeUp .8s .1s var(--ease) both; }
.page-hero__sub  { font-size: clamp(1rem,2vw,1.2rem); color: rgba(255,255,255,.75); max-width: 520px; margin: 0 auto; line-height: 1.75; animation: fadeUp .8s .2s var(--ease) both; }

/* ── Course cards ── */
.ku-courses { background: var(--bg); }

.ku-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.75rem;
  margin-top: 3rem;
}

.ku-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 2.25rem 2rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  transition: border-color .3s, box-shadow .3s, transform .25s var(--ease);
}
.ku-card:hover {
  border-color: var(--gold);
  box-shadow: 0 8px 40px rgba(0,0,0,.2), 0 0 24px var(--gold-glow);
  transform: translateY(-4px);
}

.ku-card__head {
  display: flex;
  align-items: center;
  gap: 1.25rem;
}

.ku-card__icon {
  flex-shrink: 0;
  width: 52px;
  height: 52px;
  background: var(--gold-glow);
  border: 1px solid var(--gold-border);
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gold);
}

.ku-card__title {
  font-family: var(--font-display);
  font-size: 1.5rem;
  letter-spacing: .06em;
  color: var(--text);
}

.ku-card__desc {
  font-size: .9375rem;
  color: var(--text-muted);
  line-height: 1.8;
}

.ku-card__meta {
  display: flex;
  gap: .625rem;
  flex-wrap: wrap;
  margin-top: auto;
}

.ku-badge {
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: .3rem .8rem;
  border-radius: 100px;
  border: 1px solid var(--gold-border);
  color: var(--gold);
  background: var(--gold-glow);
}

/* ── Kursplan ── */
.ku-plan { background: var(--bg-alt); }

/* Opening hours bar */
.ku-hours {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin: 1.5rem 0 0;
  padding: .875rem 1.5rem;
  background: var(--gold-glow);
  border: 1px solid var(--gold-border);
  border-radius: 100px;
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
}
.ku-hours__item {
  display: flex;
  align-items: center;
  gap: .4rem;
  font-size: .8125rem;
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--gold);
}
.ku-hours__sep { color: var(--gold); opacity: .5; font-size: 1rem; }

/* Closed cells */
.ku-table td.ku-closed {
  background: rgba(0,0,0,.04);
  color: var(--text-muted);
  opacity: .4;
  font-size: .8rem;
}
html[data-theme="dark"] .ku-table td.ku-closed { background: rgba(255,255,255,.03); }

/* Open but no course (Sa) */
.ku-table td.ku-no-course {
  background: rgba(255,189,89,.04);
}
html[data-theme="dark"] .ku-table td.ku-no-course { background: rgba(255,189,89,.03); }

/* Opening hours row */
.ku-open-row td {
  padding: 0.45rem 0.6rem;
  border-bottom: 2px solid var(--gold-border);
  background: rgba(255,189,89,.06);
}
html[data-theme="dark"] .ku-open-row td { background: rgba(255,189,89,.05); }

.ku-open-label {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gold);
  white-space: nowrap;
}

.ku-open-hours {
  font-size: 0.68rem;
  font-weight: 500;
  color: var(--text-muted);
  text-align: center;
  white-space: nowrap;
}

.ku-open-hours--weekend {
  color: var(--gold);
  opacity: .8;
}

.ku-plan__wrap {
  overflow-x: auto;
  margin-top: 2.5rem;
  border-radius: 14px;
  border: 1px solid var(--border);
}

.ku-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 640px;
}

.ku-table th,
.ku-table td {
  padding: .875rem .75rem;
  text-align: center;
  border-bottom: 1px solid var(--border);
  font-size: .875rem;
}

.ku-table thead th {
  font-family: var(--font-display);
  font-size: .875rem;
  letter-spacing: .12em;
  color: var(--gold);
  background: var(--bg-card);
  border-bottom: 2px solid var(--gold-border);
}

.ku-table thead th:first-child { text-align: left; padding-left: 1.25rem; }

.ku-table tbody td:first-child {
  font-weight: 600;
  font-size: .8rem;
  letter-spacing: .08em;
  color: var(--text-muted);
  text-align: left;
  padding-left: 1.25rem;
  white-space: nowrap;
}

.ku-table tbody tr:last-child td { border-bottom: none; }
.ku-table tbody tr:hover td { background: var(--gold-glow); }

.ku-slot {
  display: inline-block;
  padding: .3rem .7rem;
  border-radius: 8px;
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .04em;
  white-space: nowrap;
  cursor: help;
}


.ku-slot--hiit     { background: rgba(255,140, 60,.18); color: #e07020; border: 1px solid rgba(255,140,60,.3); }
.ku-slot--yoga     { background: rgba( 80,180,120,.18); color: #2d9e68; border: 1px solid rgba(80,180,120,.3); }
.ku-slot--func     { background: rgba(255,189, 89,.18); color: var(--gold); border: 1px solid var(--gold-border); }
.ku-slot--zumba    { background: rgba(200, 80,200,.18); color: #c050c0; border: 1px solid rgba(200,80,200,.3); }
.ku-slot--ruecken  { background: rgba( 74,158,255,.18); color: #2a80e0; border: 1px solid rgba(74,158,255,.3); }
.ku-slot--hyrox    { background: rgba(229, 57, 53,.18); color: #c62828; border: 1px solid rgba(229,57,53,.3); }
.ku-slot--hula     { background: rgba(255,107,157,.18); color: #d63e7a; border: 1px solid rgba(255,107,157,.3); }
.ku-slot--jumping  { background: rgba(  0,188,212,.18); color: #007c91; border: 1px solid rgba(0,188,212,.3); }
.ku-slot--stretch  { background: rgba(156,111,228,.18); color: #7c4dbe; border: 1px solid rgba(156,111,228,.3); }
.ku-slot--geraete  { background: rgba(255,120, 40,.18); color: #d05800; border: 1px solid rgba(255,120,40,.3); }

html[data-theme="dark"] .ku-slot--hiit    { color: #ffaa60; border-color: rgba(255,140,60,.4); }
html[data-theme="dark"] .ku-slot--yoga    { color: #60d090; border-color: rgba(80,180,120,.4); }
html[data-theme="dark"] .ku-slot--zumba   { color: #e080e0; border-color: rgba(200,80,200,.4); }
html[data-theme="dark"] .ku-slot--ruecken { color: #70b8ff; border-color: rgba(74,158,255,.4); }
html[data-theme="dark"] .ku-slot--hyrox   { color: #ff6b6b; border-color: rgba(229,57,53,.4); }
html[data-theme="dark"] .ku-slot--hula    { color: #ff8fb5; border-color: rgba(255,107,157,.4); }
html[data-theme="dark"] .ku-slot--jumping { color: #26d4e8; border-color: rgba(0,188,212,.4); }
html[data-theme="dark"] .ku-slot--stretch { color: #c09af0; border-color: rgba(156,111,228,.4); }
html[data-theme="dark"] .ku-slot--geraete { color: #ff9040; border-color: rgba(255,120,40,.4); }

.ku-legend {
  display: flex;
  gap: 1.25rem;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 1.5rem;
}
.ku-legend__item {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: .8125rem;
  color: var(--text-muted);
}
.ku-legend__dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}

.ku-plan__note {
  text-align: center;
  font-size: .8rem;
  color: var(--text-muted);
  margin-top: 1.25rem;
  font-style: italic;
}

.ku-plan__link {
  color: var(--gold);
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: opacity 0.2s;
}
.ku-plan__link:hover { opacity: 0.75; }

/* ── CTA ── */
.ku-cta {
  background:
    linear-gradient(135deg, rgba(0,0,0,.85) 0%, rgba(0,0,0,.7) 100%),
    url('../assets/b1.jpg') center / cover fixed;
  text-align: center;
}
.ku-cta__title {
  font-family: var(--font-display);
  font-size: clamp(2.2rem,6vw,4rem);
  letter-spacing: .04em;
  color: #fff;
  margin-bottom: 1rem;
}
.ku-cta__sub {
  font-size: 1.0625rem;
  color: rgba(255,255,255,.65);
  max-width: 460px;
  margin: 0 auto 2.5rem;
  line-height: 1.75;
}
.ku-cta__btns { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }

/* ── Light mode backgrounds ── */
html[data-theme="light"] .ku-courses,
html[data-theme="light"] .ku-plan {
  background:
    linear-gradient(rgba(255,255,255,0.87), rgba(255,255,255,0.87)),
    url('../assets/b6.jpg') center / cover fixed;
}

/* ── Sticky time column ── */
.ku-table thead th:first-child,
.ku-table tbody td:first-child {
  position: sticky;
  left: 0;
  z-index: 1;
  background: var(--bg-card);
}
.ku-table tbody tr:hover td:first-child {
  background: var(--bg-card);
}
html[data-theme="dark"] .ku-table thead th:first-child,
html[data-theme="dark"] .ku-table tbody td:first-child {
  background: var(--bg-card);
}

/* Scroll hint */
.ku-scroll-hint {
  display: none;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  font-size: .75rem;
  color: var(--text-muted);
  margin-top: .75rem;
  opacity: .7;
}
.ku-scroll-hint svg { flex-shrink: 0; }

/* ── Responsive ── */
@media (max-width: 768px) {
  .ku-grid { grid-template-columns: 1fr; }
  .ku-cta__btns { flex-direction: column; align-items: center; }
}

@media (max-width: 600px) {
  .ku-plan__wrap {
    overflow-x: hidden;
  }

  .ku-table {
    min-width: 0;
    table-layout: fixed;
    width: 100%;
    font-size: .65rem;
  }

  .ku-table th,
  .ku-table td {
    padding: .45rem .18rem;
    font-size: .65rem;
    word-break: break-word;
  }

  .ku-table thead th {
    font-size: .65rem;
    letter-spacing: .03em;
  }

  .ku-table tbody td:first-child {
    font-size: .6rem;
    padding-left: .35rem;
    min-width: unset;
    width: 24%;
    white-space: normal;
  }

  .ku-table thead th:first-child {
    padding-left: .35rem;
    width: 24%;
  }

  .ku-slot {
    padding: .15rem .3rem;
    font-size: .6rem;
    letter-spacing: 0;
    border-radius: 4px;
    white-space: normal;
    word-break: break-word;
    display: block;
  }

  .ku-scroll-hint { display: none; }

  .ku-legend { gap: .75rem; }
  .ku-legend__item { font-size: .75rem; }
}