/* TuS Rheindorf — Mobile CSS
   Wird mit media="(max-width:768px)" eingebunden.
   WP Fastest Cache kombiniert Dateien mit media-Attribut nicht. */

/* OVERFLOW */
html, body { overflow-x: hidden; max-width: 100%; }

/* HEADER */
.site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 9999 !important;
  width: 100vw !important;
  max-width: 100vw !important;
  box-sizing: border-box !important;
  left: 0 !important;
  right: 0 !important;
}
.nav-inner {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding: 0 .875rem !important;
  margin: 0 !important;
  gap: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  height: 58px !important;
}
.site-logo { flex-shrink: 1; min-width: 0; overflow: hidden; }
.site-logo img { height: 34px; }
.site-logo-text { font-size: .82rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 180px; }

/* DESKTOP-NAV: Layout neutralisieren (primary-menu bleibt im DOM) */
.nav-desktop {
  display: contents !important; /* kein eigenes Layout, Kinder bleiben erreichbar */
}
/* Desktop-Menü-Items: auf Mobile versteckt, bis is-open aktiv */
.nav-cta { display: none !important; }

/* HAMBURGER — immer sichtbar, immer rechts */
.menu-toggle {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  background: rgba(255,255,255,.15) !important;
  border: 1.5px solid rgba(255,255,255,.3) !important;
  border-radius: 4px !important;
  color: #fff !important;
  font-size: 1.3rem !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
  padding: 0 !important;
  margin-left: .75rem !important;
  position: relative !important;
  z-index: 10000 !important;
}

/* MENÜ ZU */
.primary-menu { display: none !important; }

/* MENÜ AUF */
.primary-menu.is-open {
  display: flex !important;
  flex-direction: column;
  position: fixed;
  top: 57px; left: 0; right: 0;
  background: #1a1a1a;
  border-top: 3px solid #cc0000;
  padding: 0;
  box-shadow: 0 8px 32px rgba(0,0,0,.5);
  z-index: 9998;
  max-height: calc(100vh - 57px);
  overflow-y: auto;
}
.primary-menu.is-open > li { border-bottom: 1px solid rgba(255,255,255,.08); }
.primary-menu.is-open > li > a {
  display: block;
  padding: .9rem 1.25rem;
  font-size: .95rem; font-weight: 600;
  color: #fff; text-decoration: none;
}
.primary-menu.is-open > li.current-menu-item > a,
.primary-menu.is-open > li.current-menu-parent > a { color: #cc0000; }

/* UNTERMENÜ */
.primary-menu.is-open .sub-menu {
  display: none;
  position: static;
  background: rgba(255,255,255,.04);
  box-shadow: none; border-radius: 0; animation: none;
  padding: 0; width: 100%; min-width: unset;
}
.primary-menu.is-open .menu-item-has-children.submenu-open > .sub-menu { display: block; }
.primary-menu.is-open .sub-menu a {
  display: block;
  padding: .75rem 1.25rem .75rem 2.25rem;
  font-size: .875rem; color: rgba(255,255,255,.65);
  text-decoration: none;
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.menu-arrow { float: right; font-size: 1rem; opacity: .55; }
.submenu-open > a .menu-arrow { color: #cc0000; opacity: 1; }
.nav-cta { display: block !important; margin: .75rem 1.25rem; text-align: center; }

/* HERO STARTSEITE */
.hero { overflow: hidden; }
.hero-inner { padding: 2rem 1.25rem; }
/* Titel auf max 62% begrenzen damit er nicht in den roten Streifen läuft */
.hero-title {
  font-size: clamp(1.9rem, 8.5vw, 2.6rem) !important;
  line-height: 1.05 !important;
  max-width: 62% !important;
  word-break: break-word !important;
}
.hero-lead { font-size: .85rem; max-width: 65%; }
.hero-actions { flex-direction: column; gap: .625rem; }
.hero-actions .btn { width: 100%; justify-content: center; }
.hero-logo-3d { display: none; }

/* HERO ANDERE SEITEN */
.generic-page-hero, .news-hero, .kurs-hero,
.spenden-hero, .contact-hero, .dept-hero, .tz-header {
  padding: 1.5rem 1.25rem; overflow: hidden;
}
.generic-page-hero-title, .news-hero-title, .kurs-hero-title,
.spenden-hero-title, .contact-hero-title, .dept-hero-title, .tz-header-title {
  font-size: 1.75rem; line-height: 1.05; max-width: 58%;
}
.generic-page-hero-sub, .news-hero-sub, .kurs-hero-sub,
.spenden-hero-sub, .contact-hero-sub { font-size: .75rem; max-width: 55%; }
.generic-page-hero-logo, .news-hero-logo, .kurs-hero-logo,
.spenden-hero-logo, .contact-hero-logo, .dept-hero-logo { display: none; }

/* STATS */
.stats-bar { padding: 1rem .75rem; }
.stats-inner { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: .75rem .5rem !important; }
.stat { text-align: center; }
.stat-number { font-size: 1.75rem; }
.stat-label { font-size: .55rem; }

/* KURSPROGRAMM WOCHENPLAN STARTSEITE */
.hp-week-scroll-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.hp-week-grid { display: grid !important; grid-template-columns: repeat(4,140px) !important; gap: 8px !important; width: max-content !important; }
.hp-day-col { width: 140px; }
.hp-day-header { font-size: .72rem; padding: 6px 8px; }
.hp-day-body { padding: 4px; gap: 4px; }
.hp-kurs-slot { padding: 5px 6px; }
.hp-slot-kat { font-size: .52rem; }
.hp-slot-name { font-size: .7rem; }
.hp-slot-time { font-size: .58rem; }
.hp-slot-ort { font-size: .55rem; }

/* KURSPROGRAMM-SEITE */
.kurs-filter-bar { top: 57px; padding: .75rem 1rem; }
.kurs-grid { grid-template-columns: 1fr 1fr !important; gap: .625rem !important; }

/* ALLGEMEIN */
.section-inner { padding: 0 1rem !important; box-sizing: border-box; }
.section-title { font-size: clamp(1.4rem,6vw,2rem); }
.two-col { grid-template-columns: 1fr !important; }
.footer-top { grid-template-columns: 1fr !important; }
.footer-bottom { flex-direction: column; gap: .75rem; text-align: center; }
.sponsors-section, .sponsors-track-wrap { overflow: hidden; }

/* TRAININGSZEITEN — Legende ausblenden */
.tz-legend { display: none; }

/* TRAININGSZEITEN — Listenansicht: alle Infos sichtbar */
.list-row {
  flex-wrap: wrap;
  padding: 10px 12px;
  gap: .375rem;
  align-items: flex-start;
}
.lr-day {
  font-weight: 700;
  font-size: .82rem;
  min-width: 80px;
  flex-shrink: 0;
}
.lr-time {
  font-size: .82rem;
  flex-shrink: 0;
  min-width: 120px;
}
.lr-group {
  font-size: .82rem;
  font-weight: 600;
  flex: 1;
  min-width: 100%;
  color: var(--color-text);
}
.lr-loc {
  font-size: .72rem;
  color: var(--color-gray-text);
  background: var(--color-gray-light);
  padding: 2px 8px;
  border-radius: 20px;
  white-space: normal;
  word-break: break-word;
}
.lr-tbd {
  font-size: .72rem;
  font-style: italic;
  color: var(--color-gray-text);
}
.lr-hint {
  font-size: .75rem;
}
/* Gruppenname in Liste: volle Breite */
.list-dept-header { flex-wrap: wrap; }
.list-dept-title { font-size: 1.2rem; }

/* ============================================================
   v6.11.0 — MOBILE-ÜBERARBEITUNG (gilt nur bis 768px Breite)
   Steht bewusst am Ende, damit es ältere Regeln überschreibt.
   ============================================================ */

/* --- Startseite: Variante C (rote Kante unten + Wappen) --- */
.hero { min-height: 0 !important; }
.hero-stripe { width: 100% !important; bottom: -2px !important; clip-path: polygon(0 94%, 100% 82%, 100% 100%, 0 100%) !important; }
.hero-stripe-shine, .hero-particles { display: none !important; }
.hero-logo-3d { display: block !important; right: -56px !important; left: auto !important; top: 28px !important; transform: none !important; animation: none !important; z-index: 0; }
.hero-logo-3d img { width: 250px !important; height: 250px !important; opacity: .07 !important; }
.hero-inner { position: relative; z-index: 2; padding: 2.5rem 1.25rem 4.75rem !important; }
.hero-eyebrow { font-size: .62rem !important; letter-spacing: .14em !important; background: none !important; border: 1px solid rgba(255,255,255,.25) !important; color: rgba(255,255,255,.75) !important; white-space: normal; }
.hero-title { max-width: 100% !important; font-size: clamp(2.6rem, 14vw, 3.6rem) !important; line-height: .95 !important; letter-spacing: -.01em !important; word-break: normal !important; overflow-wrap: normal !important; }
.hero-lead { max-width: 100% !important; font-size: .95rem !important; line-height: 1.6 !important; color: rgba(255,255,255,.75) !important; }

/* --- Unterseiten-Köpfe: gleiche rote Kante statt Schräge über dem Text --- */
.generic-page-hero-stripe, .tz-header-stripe, .contact-hero-stripe, .dept-hero-stripe,
.kurs-hero-stripe, .spenden-hero-stripe, .news-hero-stripe {
  width: 100% !important; clip-path: polygon(0 100%, 100% 72%, 100% 100%) !important; }
.generic-page-hero, .tz-header, .contact-hero, .dept-hero, .kurs-hero, .spenden-hero, .news-hero { padding-bottom: 2.75rem !important; }
.generic-page-hero-sub, .news-hero-sub, .kurs-hero-sub, .spenden-hero-sub, .contact-hero-sub { max-width: 100% !important; font-size: .85rem !important; }
.tz-header-logo { display: none !important; }
.generic-page-hero-inner, .tz-header-inner, .contact-hero-inner, .dept-hero-inner, .kurs-hero-inner, .spenden-hero-inner, .news-hero-inner { position: relative; z-index: 1; }

/* --- Lesbarkeit: zu kleine Beschriftungen anheben --- */
.generic-page-hero-eye, .dept-hero-eye, .dept-section-eye { font-size: .7rem !important; }
.stat-label, .dept-stat-lbl { font-size: .66rem !important; }
.dept-contact-role { font-size: .75rem !important; }

/* --- Trainingszeiten: Hinweisbox untereinander statt drei schmaler Spalten --- */
.tz-info { flex-direction: column !important; gap: .35rem !important; margin-left: 1.25rem !important; margin-right: 1.25rem !important; font-size: .85rem !important; }

.tz-info a { color: inherit; }
.tz-divider { display: none !important; }

/* --- Kursprogramm: eine Karte pro Zeile --- */
.kurs-grid { grid-template-columns: 1fr !important; gap: 1rem !important; }

/* --- Formulare: mehrspaltige Zeilen (z. B. Anschrift) untereinander --- */
div.wpforms-container-full .wpforms-form .wpforms-field-row-block.wpforms-one-fifth,
div.wpforms-container-full .wpforms-form .wpforms-field-row-block.wpforms-two-fifths,
div.wpforms-container-full .wpforms-form .wpforms-field-row-block.wpforms-one-third,
div.wpforms-container-full .wpforms-form .wpforms-field-row-block.wpforms-two-thirds {
  width: 100% !important; margin-left: 0 !important; padding: 0 !important; float: none !important; margin-bottom: .6rem !important; }
div.wpforms-container-full .wpforms-form .wpforms-submit { width: 100% !important; }

/* --- Spendenaufruf: Titel kompakt --- */
.donation-title { font-size: 1.75rem !important; line-height: 1.05 !important; }
.donation-banner::before { font-size: 6rem !important; }

/* --- Inhalte nicht unter dem Chat-Knopf verstecken --- */
.site-footer { padding-bottom: 5rem !important; }
