/* lern.css — Lernbereich der WingTsun Schule Attendorn.
   Erbt saemtliche Farben, Schriften und Abstaende aus /styles.css.
   Hier stehen nur die Ergaenzungen, die es dort noch nicht gibt.
   Mobile first: entworfen fuer 390 px, waechst nach oben. */

/* ---------- Grundgeruest ---------- */
.lb-breite { max-width: var(--inhalt); margin: 0 auto; padding: 0 16px; }

.lb-kopf {
  background: var(--dunkel);
  padding: 12px 0;
  margin-bottom: 28px;
}
.lb-kopf .lb-breite { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.lb-zurueck {
  display: inline-flex;
  align-items: center;
  min-height: 44px;            /* Fingerziel: der Zurueck-Weg wird am Handy getippt */
  padding: 0 10px 0 0;
  color: var(--gelb);
  text-decoration: none;
  font-size: 16px;
}
.lb-zurueck:hover { text-decoration: underline; }
.lb-abmelden-kopf {
  min-height: 40px; padding: 0 12px; font: inherit; font-size: 14px; cursor: pointer;
  color: #fff; background: transparent; border: 1px solid rgba(255,255,255,.55); border-radius: var(--radius-btn);
}
.lb-abmelden-kopf:hover { border-color: var(--gelb); color: var(--gelb); }
.lb-marke {
  font-family: 'Barlow Condensed', Arial, sans-serif;
  font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: #FFFFFF; margin-left: auto;
}

main.lb-breite { padding-bottom: 48px; }

/* ---------- Anmeldung ---------- */
.lb-tor { max-width: var(--textbreite); }

.lb-form {
  background: var(--bg2);
  border: 1px solid var(--rahmen);
  border-radius: var(--radius);
  padding: 20px 16px;
  margin: 24px 0 20px;
}
.lb-label {
  display: block;
  font-family: 'Barlow Condensed', Arial, sans-serif;
  font-size: 14px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--text2); margin-bottom: 8px;
}
.lb-eingabe {
  width: 100%;
  font-family: inherit;
  font-size: 19px;              /* >=16px verhindert das Zoomen auf dem iPhone */
  letter-spacing: .04em;
  padding: 14px 12px;
  min-height: 52px;
  border: 2px solid var(--rahmen-ui);
  border-radius: var(--radius-btn);
  background: var(--bg1);
  color: var(--text);
}
.lb-eingabe:focus-visible { outline: 2px solid var(--dunkel); outline-offset: 2px; }
.lb-eingabe::placeholder { color: #8E877A; letter-spacing: normal; }

.lb-knopf {
  width: 100%;
  margin-top: 14px;
  min-height: 52px;             /* Fingerziel deutlich ueber 44 px */
  font-family: 'Barlow Condensed', Arial, sans-serif;
  font-size: 19px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: var(--dunkel);
  background: var(--gelb);
  border: none;
  border-radius: var(--radius-btn);
  cursor: pointer;
}
.lb-knopf:hover { background: var(--gelb-hover); }
.lb-knopf:disabled { opacity: .6; cursor: progress; }
.lb-knopf:focus-visible { outline: 2px solid var(--dunkel); outline-offset: 2px; }

.lb-meldung { margin: 12px 0 0; font-size: 16px; min-height: 1.5em; }
.lb-meldung.fehler   { color: var(--fehler); font-weight: 600; }
.lb-meldung.erfolg   { color: var(--erfolg); font-weight: 600; }
.lb-meldung.neutral  { color: var(--text2); }

.lb-hinweis { font-size: 15px; color: var(--text2); }
.lb-hinweis p { margin: 0; }

/* ---------- Freigeschalteter Bereich ---------- */
.lb-kursliste { display: grid; gap: 14px; margin: 20px 0 28px; }

.lb-kurs {
  display: block;
  background: var(--bg2);
  border: 1px solid var(--rahmen);
  border-left: 4px solid var(--gelb);
  border-radius: var(--radius);
  padding: 16px;
  text-decoration: none;
  color: var(--text);
}
.lb-kurs:hover { background: var(--bg3); }
.lb-kurs h2 { font-size: 24px; margin: 0 0 4px; }
.lb-kurs p  { margin: 0; font-size: 15px; color: var(--text2); }

.lb-leer {
  background: var(--bg3);
  border-radius: var(--radius);
  padding: 16px;
  font-size: 16px;
  color: var(--text2);
}

.lb-abmelden { margin-top: 8px; }
.lb-textknopf {
  background: none; border: none; padding: 0;
  font: inherit; font-size: 15px;
  color: var(--gold); text-decoration: underline; cursor: pointer;
}
.lb-textknopf:focus-visible { outline: 2px solid var(--dunkel); outline-offset: 2px; }

/* ---------- Dauerhafter Hinweis ---------- */
.lb-fussnote {
  max-width: var(--textbreite);
  margin: 32px 0 0;
  padding: 14px 16px;
  background: var(--bg3);
  border-radius: var(--radius);
}
.lb-fussnote p { margin: 0; font-size: 15px; color: var(--text2); }

/* ---------- Fuss ---------- */
.lb-fuss {
  background: var(--dunkel);
  color: #D8D3CA;
  padding: 24px 0;
  margin-top: 40px;
  font-size: 15px;
}
.lb-fuss p { margin: 0 0 6px; max-width: none; }
.lb-fuss a { color: var(--gelb); }
.lb-fusslinks { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 10px; }

/* ---------- Ab Tablet ---------- */
@media (min-width: 640px) {
  .lb-form { padding: 24px; }
  .lb-knopf { width: auto; padding: 0 32px; }
}

/* Kurskachel ohne Inhaltsseite: sichtbar, aber nicht klickbar */
.lb-kurs-bald { border-left-color: var(--rahmen-ui); cursor: default; }
.lb-kurs-bald:hover { background: var(--bg2); }
.lb-bald { margin-top: 6px !important; font-size: 14px !important; color: var(--warnung) !important; }

/* ==========================================================================
   Kurs- und Themenseiten (kurs.html). Ergaenzt am 26.09.2026.
   Mobile first: entworfen fuer 390 px, waechst nach oben.
   ========================================================================== */

.lb-laedt { padding: 32px 0; color: var(--text2); font-size: 16px; }

#lb-seite { max-width: var(--textbreite); }
#lb-seite h1 { margin: 0 0 18px; }

.lb-h2 {
  font-size: 22px;
  margin: 32px 0 10px;
  padding-top: 18px;
  border-top: 1px solid var(--rahmen);
}
#lb-seite > .lb-h2:first-of-type { border-top: none; padding-top: 0; }

.lb-p { margin: 0 0 14px; font-size: 17px; line-height: 1.6; }

/* ---------- Hervorhebungen ---------- */
.lb-merk {
  margin: 18px 0;
  padding: 14px 16px;
  background: var(--bg2);
  border-left: 4px solid var(--gelb);
  border-radius: var(--radius);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.5;
}
.lb-warn {
  margin: 18px 0;
  padding: 14px 16px;
  background: var(--bg3);
  border-left: 4px solid var(--warnung);
  border-radius: var(--radius);
  font-size: 16px;
  line-height: 1.55;
}
.lb-quelle {
  margin: 24px 0 0;
  padding: 12px 14px;
  background: var(--bg3);
  border-radius: var(--radius);
  font-size: 14px;
  line-height: 1.5;
  color: var(--text2);
}

/* ---------- Listen ---------- */
.lb-liste { margin: 0 0 16px; padding-left: 22px; }
.lb-liste li { margin-bottom: 8px; font-size: 17px; line-height: 1.55; }

/* ---------- Nummerierte Schritte ---------- */
.lb-schritte { list-style: none; margin: 4px 0 20px; padding: 0; }
.lb-schritt {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 12px;
}
.lb-schritt-nr {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;   /* Zahl mittig im Feld */
  min-width: 34px;
  height: 34px;
  padding: 0 6px;
  box-sizing: border-box;
  border-radius: 50px;
  background: var(--gelb);
  color: var(--dunkel);
  font-family: "Barlow Condensed", Arial, sans-serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
}
.lb-schritt-text { font-size: 17px; line-height: 1.55; }

/* ---------- Tabellen: am Handy gestapelt ---------- */
.lb-tabwrap { margin: 4px 0 20px; }
.lb-tab { width: 100%; border-collapse: collapse; font-size: 16px; }
.lb-tab thead { display: none; }
.lb-tab tr {
  display: block;
  margin-bottom: 12px;
  padding: 12px 14px;
  background: var(--bg2);
  border: 1px solid var(--rahmen);
  border-radius: var(--radius);
}
.lb-tab td { display: block; padding: 0 0 8px; line-height: 1.5; }
.lb-tab td:last-child { padding-bottom: 0; }
.lb-tab td::before {
  content: attr(data-kopf);
  display: block;
  font-family: "Barlow Condensed", Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--text2);
  margin-bottom: 2px;
}
.lb-tab td[data-kopf=""]::before { display: none; }

/* ---------- Musterdialoge ---------- */
.lb-dialog {
  margin: 18px 0;
  padding: 14px;
  background: var(--bg2);
  border: 1px solid var(--rahmen);
  border-radius: var(--radius);
}
.lb-dialog-spruch {
  margin: 0 0 12px;
  font-size: 19px;
  font-weight: 700;
  line-height: 1.4;
}
.lb-dialog-weg {
  padding: 10px 0;
  border-top: 1px solid var(--rahmen);
}
.lb-dialog-regel {
  margin: 0 0 6px;
  font-family: "Barlow Condensed", Arial, sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--gold);
}
.lb-dialog-du, .lb-dialog-er, .lb-dialog-dann {
  margin: 0 0 6px;
  font-size: 16px;
  line-height: 1.5;
}
.lb-dialog-du span, .lb-dialog-er span, .lb-dialog-dann span {
  font-weight: 700;
  color: var(--text2);
}
.lb-dialog-dann { margin-bottom: 0; }

/* ---------- Hilfsmittel ---------- */
.lb-mittel-liste { margin: 4px 0 20px; }
.lb-mittel {
  margin-bottom: 14px;
  padding: 14px;
  background: var(--bg2);
  border: 1px solid var(--rahmen);
  border-radius: var(--radius);
}
.lb-mittel-name { margin: 0 0 10px; font-size: 21px; }
.lb-mittel-zeile { margin-bottom: 10px; font-size: 16px; line-height: 1.5; }
.lb-mittel-zeile:last-child { margin-bottom: 0; }
.lb-mittel-label {
  display: block;
  font-family: "Barlow Condensed", Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--text2);
  margin-bottom: 2px;
}
.lb-mittel-nicht .lb-mittel-label { color: var(--warnung); }
.lb-mittel-fazit {
  padding: 10px 12px;
  background: var(--bg3);
  border-radius: var(--radius);
}

/* ---------- Die neun Fragen ---------- */
.lb-fragen { margin: 4px 0 20px; }
.lb-frage {
  margin-bottom: 14px;
  padding: 14px;
  background: var(--bg2);
  border-left: 4px solid var(--gelb);
  border-radius: var(--radius);
}
.lb-frage-titel {
  display: flex;
  gap: 10px;
  align-items: baseline;
  margin: 0 0 8px;
  font-size: 18px;
  line-height: 1.4;
}
.lb-frage-nr {
  flex: 0 0 auto;
  color: var(--gold);
  font-family: "Barlow Condensed", Arial, sans-serif;
  font-size: 22px;
}
.lb-frage-antwort { margin: 0 0 10px; font-size: 16px; line-height: 1.6; }

/* ---------- Kacheln und Themenliste ---------- */
.lb-kacheln { display: grid; gap: 12px; margin: 4px 0 20px; }
.lb-kachel {
  display: block;
  padding: 14px 16px;
  background: var(--bg2);
  border: 1px solid var(--rahmen);
  border-left: 4px solid var(--gelb);
  border-radius: var(--radius);
  text-decoration: none;
  color: var(--text);
}
.lb-kachel:hover { background: var(--bg3); }
.lb-kachel h3 { margin: 0 0 4px; font-size: 20px; }
.lb-kachel p  { margin: 0; font-size: 15px; color: var(--text2); }
.lb-kachel-kopf {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 6px;
}
.lb-kachel-nr {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px; height: 28px;
  border-radius: 50%;
  background: var(--gelb);
  color: var(--dunkel);
  font-family: "Barlow Condensed", Arial, sans-serif;
  font-size: 17px; font-weight: 700; line-height: 1;
}
.lb-kachel-datum {
  font-family: "Barlow Condensed", Arial, sans-serif;
  font-size: 13px; font-weight: 700; letter-spacing: .1em;
  text-transform: uppercase; color: var(--text2);
}
.lb-kachel-betont { border-left-color: var(--gold); margin-bottom: 20px; }

.lb-themen { display: grid; gap: 8px; margin: 4px 0 20px; }
.lb-thema {
  display: block;
  padding: 12px 14px;
  background: var(--bg2);
  border: 1px solid var(--rahmen);
  border-radius: var(--radius);
  text-decoration: none;
  color: var(--text);
}
.lb-thema:hover { background: var(--bg3); }
.lb-thema strong { display: block; font-size: 17px; }
.lb-thema span   { display: block; font-size: 14px; color: var(--text2); margin-top: 2px; }

/* ---------- Weiterfuehrende Links ---------- */
.lb-weiterliste { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 20px; }
.lb-weiter {
  display: inline-block;
  padding: 9px 14px;
  min-height: 44px;              /* Fingerziel */
  box-sizing: border-box;
  line-height: 26px;
  background: var(--bg3);
  border-radius: var(--radius-btn);
  color: var(--text);
  text-decoration: none;
  font-size: 16px;
}
.lb-weiter:hover { background: var(--bg2); text-decoration: underline; }
.lb-frage .lb-weiter { margin-top: 2px; }

/* ---------- Dateien ---------- */
.lb-dateien { display: grid; gap: 8px; margin: 4px 0 20px; }
.lb-datei {
  display: block;
  padding: 14px;
  min-height: 52px;
  box-sizing: border-box;
  background: var(--bg2);
  border: 1px solid var(--rahmen);
  border-radius: var(--radius);
  color: var(--text);
  text-decoration: none;
  font-size: 17px;
}
.lb-datei::before { content: "PDF \00b7 "; color: var(--gold); font-weight: 700; }
.lb-datei:hover { background: var(--bg3); }

/* ---------- Bilder ---------- */
.lb-bild { margin: 4px 0 20px; }
.lb-bild img {
  display: block;
  width: 100%;
  height: auto;               /* ohne das verzerrt der Browser bei width-Angabe */
  border-radius: var(--radius);
  border: 1px solid var(--rahmen);
}
.lb-bild figcaption {
  margin-top: 8px;
  font-size: 15px;
  line-height: 1.5;
  color: var(--text2);
}

/* ---------- Gesperrt ---------- */
.lb-gesperrt { max-width: var(--textbreite); }
.lb-gesperrt p { font-size: 17px; line-height: 1.6; }
.lb-knopf-link {
  display: inline-block;
  margin-top: 8px;
  padding: 14px 28px;
  min-height: 52px;
  box-sizing: border-box;
  background: var(--gelb);
  color: var(--dunkel);
  border-radius: var(--radius-btn);
  text-decoration: none;
  font-family: "Barlow Condensed", Arial, sans-serif;
  font-size: 19px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
}
.lb-knopf-link:hover { background: var(--gelb-hover); }

/* ---------- Ab Tablet: Tabellen wieder als Tabelle ---------- */
@media (min-width: 640px) {
  .lb-tab thead { display: table-header-group; }
  .lb-tab tr {
    display: table-row;
    margin: 0; padding: 0;
    background: none; border: none; border-radius: 0;
    border-bottom: 1px solid var(--rahmen);
  }
  .lb-tab th {
    text-align: left;
    padding: 8px 12px 8px 0;
    font-family: "Barlow Condensed", Arial, sans-serif;
    font-size: 13px; font-weight: 700; letter-spacing: .1em;
    text-transform: uppercase; color: var(--text2);
    border-bottom: 2px solid var(--rahmen);
  }
  .lb-tab td { display: table-cell; padding: 10px 12px 10px 0; vertical-align: top; }
  .lb-tab td::before { display: none; }
  .lb-kacheln { grid-template-columns: repeat(2, 1fr); }
  .lb-themen  { grid-template-columns: repeat(2, 1fr); }
  .lb-dateien { grid-template-columns: repeat(2, 1fr); }
}

/* ---------- Notfallnummern: am Handy antippbar ---------- */
.lb-notruf { display: grid; gap: 8px; margin: 4px 0 20px; }
.lb-notruf-zeile {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 8px 8px 14px;
  background: var(--bg2);
  border: 1px solid var(--rahmen);
  border-radius: var(--radius);
}
.lb-notruf-was { font-size: 16px; line-height: 1.4; }
.lb-notruf-nr {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;      /* Nummer mittig im Feld */
  min-height: 44px;             /* Fingerziel */
  padding: 0 16px;
  background: var(--gelb);
  color: var(--dunkel);
  border-radius: var(--radius-btn);
  text-decoration: none;
  font-family: "Barlow Condensed", Arial, sans-serif;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: .02em;
  white-space: nowrap;
}
a.lb-notruf-nr:hover { background: var(--gelb-hover); }

/* ---------- Trainerbereich: Kopiervorlage und Uebungskatalog (30.09.2026) ---------- */
.lb-vorlage { margin: 4px 0 20px; }
.lb-vorlage-text {
  white-space: pre-wrap; word-break: break-word;
  font-family: ui-monospace, Consolas, monospace; font-size: 15px; line-height: 1.5;
  background: var(--bg2); border: 1px solid var(--rahmen); border-radius: var(--radius);
  padding: 14px; margin: 0 0 8px;
}
.lb-vorlage-knopf { min-height: 44px; }

.lb-kat { margin: 8px 0 24px; }
.lb-kat-suche { font-size: 17px; min-height: 48px; margin-bottom: 10px; }
.lb-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 10px; }
.lb-chip {
  font: inherit; font-size: 14px; line-height: 1.2;
  min-height: 36px; padding: 6px 12px;
  border: 1px solid var(--rahmen); border-radius: 999px;
  background: var(--bg2); color: var(--text); cursor: pointer;
}
.lb-chip.an { background: var(--gelb); border-color: var(--gelb); color: #111; font-weight: 700; }
.lb-kat-zahl { font-size: 14px; color: var(--text2); margin: 6px 0 8px; }
.lb-kat-liste { display: grid; gap: 8px; }
.lb-ueb {
  border: 1px solid var(--rahmen); border-left: 5px solid var(--rahmen);
  border-radius: var(--radius); background: var(--bg2);
}
.lb-ueb-A { border-left-color: #2E9D57; }
.lb-ueb-B { border-left-color: #D4A200; }
.lb-ueb-C { border-left-color: #C0392B; }
.lb-ueb-kopf {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px;
  padding: 12px 14px; min-height: 44px; cursor: pointer; list-style: none;
}
.lb-ueb-kopf::-webkit-details-marker { display: none; }
.lb-ueb-id { font-size: 13px; color: var(--text2); }
.lb-ueb-name { font-weight: 700; font-size: 17px; flex: 1 1 60%; }
.lb-ueb-ampel { font-size: 13px; white-space: nowrap; }
.lb-ueb-inhalt { padding: 0 14px 12px; }
.lb-ueb-zeile { margin: 0 0 8px; font-size: 16px; line-height: 1.5; }
.lb-ueb-block h4 { margin: 10px 0 4px; font-size: 15px; color: var(--text2); }
.lb-glossar { margin-top: 16px; }

/* ---------- Trainingsplaner (30.09.2026) ---------- */
/* hidden muss immer gewinnen (sonst überstimmt z. B. display:flex der Summenleiste das Ausblenden) */
.pl-seite [hidden] { display: none !important; }
.pl-neuwahl { display: flex; flex-wrap: wrap; gap: 10px; margin: 8px 0 20px; }
.pl-plaene { display: grid; gap: 8px; margin: 4px 0 24px; }
.pl-planzeile {
  display: grid; gap: 6px;
  background: var(--bg2); border: 1px solid var(--rahmen); border-left: 4px solid var(--gelb);
  border-radius: var(--radius); padding: 10px 14px; color: var(--text);
}
.pl-planoeffnen { display: grid; gap: 2px; text-align: left; font: inherit; cursor: pointer; background: none; border: 0; padding: 2px 0; color: var(--text); }
.pl-planoeffnen span { font-size: 15px; color: var(--text2); }
.pl-planaktionen { display: flex; flex-wrap: wrap; gap: 4px 18px; }
.pl-planaktionen .lb-textknopf { min-height: 40px; }
.pl-doppelt { color: #9a6a00 !important; font-weight: 700; }
.pl-master { margin: 8px 0; padding: 10px 12px; border: 2px solid #C0392B; border-radius: var(--radius); background: var(--bg1); }
.pl-master-titel { margin: 0 0 8px; font-weight: 700; color: #C0392B; }
.pl-master-reihe { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; }
.pl-master-reihe .lb-eingabe { flex: 1 1 200px; min-height: 44px; }
.pl-gefahr-knopf { background: #C0392B !important; color: #fff !important; }
.pl-master-info { margin: 6px 0 0; font-size: 15px; }
/* Anmeldeprotokoll */
.pk-personen { display: grid; gap: 8px; margin: 4px 0 20px; }
@media (min-width: 640px) { .pk-personen { grid-template-columns: repeat(3, 1fr); } }
.pk-person { display: grid; gap: 2px; background: var(--bg2); border: 1px solid var(--rahmen); border-left: 4px solid var(--gelb); border-radius: var(--radius); padding: 10px 12px; }
.pk-person span { font-size: 15px; color: var(--text2); }
.pk-klein { font-size: 13px !important; }
.pk-filter { display: flex; flex-wrap: wrap; gap: 8px 16px; }
.pk-filter label { display: grid; gap: 4px; font-size: 14px; font-weight: 700; color: var(--text2); }
.pk-tabelle-rahmen { overflow-x: auto; }
.pk-tabelle { width: 100%; border-collapse: collapse; font-size: 15px; }
.pk-tabelle th, .pk-tabelle td { text-align: left; padding: 6px 8px; border-bottom: 1px solid var(--rahmen); vertical-align: top; }
.pk-zeit { white-space: nowrap; font-variant-numeric: tabular-nums; }
.pk-info { color: var(--text2); }
.pk-anmeldung td { font-weight: 700; }
.pk-geloescht td { color: #C0392B; }
.pl-fusslink { margin: 28px 0 8px; font-size: 14px; }
.pl-warnklein { color: #C0392B !important; font-weight: 700; }
.pl-kopfdaten { display: grid; gap: 12px; grid-template-columns: 1fr; margin: 8px 0 12px; }
@media (min-width: 640px) { .pl-kopfdaten { grid-template-columns: 1fr 1fr 1fr; } .pl-breit { grid-column: 1 / -1; } }
.pl-feld { display: grid; gap: 4px; border: 0; padding: 0; margin: 0; }
.pl-feld > span, .pl-feld legend { font-size: 14px; font-weight: 700; color: var(--text2); }
.pl-feld .lb-eingabe { font-size: 17px; min-height: 48px; }
.pl-gruppe { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.pl-gruppe label { display: inline-flex; gap: 6px; align-items: center; min-height: 44px; font-size: 17px; }
.pl-bloecke { list-style: none; padding: 0; margin: 0 0 16px; display: grid; gap: 8px; }
.pl-block {
  background: var(--bg2); border: 1px solid var(--rahmen); border-left: 5px solid var(--rahmen);
  border-radius: var(--radius); padding: 10px 12px;
}
.pl-typ-fest { border-left-color: var(--text2); }
.pl-ampel-A { border-left-color: #2E9D57; }
.pl-ampel-B { border-left-color: #D4A200; }
.pl-ampel-C { border-left-color: #C0392B; }
.pl-blockkopf { display: grid; grid-template-columns: auto 1fr auto; gap: 8px 10px; align-items: start; }
.pl-knoepfe { grid-column: 1 / -1; display: flex; gap: 6px; justify-content: flex-end; }
.pl-knoepfe:empty { display: none; }
@media (min-width: 640px) { .pl-blockkopf { grid-template-columns: auto 1fr auto auto; } .pl-knoepfe { grid-column: auto; } }
.pl-nr { display: inline-grid; place-items: center; width: 30px; height: 30px; margin-top: 9px; border-radius: 50%; background: var(--gelb); color: #111; font-weight: 700; }
.pl-blockmitte { display: grid; gap: 4px; min-width: 0; min-height: 48px; align-content: center; }
.pl-blockzeile { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; margin: 0 0 6px; }
.pl-uhr { font-size: 13px; font-weight: 700; color: var(--text2); font-variant-numeric: tabular-nums; }
.pl-uhr-zuviel { color: #C0392B; }
.pl-griff { cursor: grab; touch-action: none; }
.pl-ziehen { position: relative; z-index: 6; opacity: .92; box-shadow: 0 6px 18px rgba(0,0,0,.25); }
.pl-ziel { outline: 3px dashed var(--gelb); outline-offset: 2px; }
.pl-listaktionen { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: -6px 0 14px; }
.pl-fix { font-size: 13px; color: var(--text2); }
.pl-ampel { font-size: 13px; }
/* Auswahl, Freitext und Minuten: gleiche Höhe, oben bündig */
.pl-auswahl, .pl-freitext, .pl-min .lb-eingabe { box-sizing: border-box; height: 48px; min-height: 48px; margin: 0; }
.pl-auswahl { font-size: 16px; max-width: 100%; }
.pl-auswahl, .pl-freitext { padding-top: 0; padding-bottom: 0; line-height: 46px; }
.pl-knoepfe .pl-kn { box-sizing: border-box; height: 48px; min-width: 48px; }
.pl-min { display: inline-flex; gap: 6px; align-items: center; }
.pl-min { align-self: start; min-height: 48px; }
.pl-min .lb-eingabe { width: 72px; text-align: center; font-size: 18px; padding: 6px; }
.pl-kn {
  min-width: 44px; min-height: 44px; font: inherit; font-size: 18px; cursor: pointer;
  border: 1px solid var(--rahmen); border-radius: var(--radius-btn); background: var(--bg1); color: var(--text);
}
.pl-kn:disabled { opacity: .35; cursor: default; }
.pl-hinweis { margin: 8px 0 0; font-size: 15px; line-height: 1.45; }
.pl-ampel-C .pl-hinweis { color: #C0392B; font-weight: 700; }
.pl-zusatz, .pl-leer { border-style: dashed; color: var(--text2); }
.pl-zusatz .pl-kn { width: 100%; font-size: 16px; }
.pl-hinzu { margin: 12px 0 20px; }
.pl-hinzu h3 { margin: 0 0 8px; }
.pl-treffer { display: grid; gap: 6px; }
.pl-trefferzeile {
  display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: center;
  background: var(--bg2); border: 1px solid var(--rahmen); border-left: 5px solid var(--rahmen); border-radius: var(--radius); padding: 8px 10px;
}
.pl-treffertext { display: grid; gap: 2px; min-width: 0; }
.pl-treffertext span { font-size: 14px; color: var(--text2); }
.pl-klein { font-size: 14px; color: var(--text2); margin: 4px 0; }
.pl-material { margin: 12px 0; font-size: 16px; }
.pl-aktionen { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 16px 0 8px; }
.pl-zweit { background: var(--bg2) !important; color: var(--text) !important; border: 2px solid var(--gelb) !important; }
.pl-gefahr { color: #C0392B; }
.pl-summe {
  position: sticky; bottom: env(safe-area-inset-bottom, 0px); z-index: 5;
  display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: baseline;
  background: var(--dunkel); color: #fff; border-radius: var(--radius); padding: 12px 14px; margin: 16px 0;
}
.pl-summe strong { font-size: 18px; }
.pl-zuviel { background: #C0392B; }
.pl-leiste { position: relative; flex-basis: 100%; display: flex; height: 22px; margin-top: 6px; background: rgba(255,255,255,.18); border-radius: 4px; overflow: hidden; }
.pl-seg { display: grid; place-items: center; min-width: 0; overflow: hidden; font-size: 11px; font-weight: 700; color: #111; border-right: 1px solid rgba(0,0,0,.35); }
.pl-seg-0 { background: var(--gelb); }
.pl-seg-1 { background: #f3dd7a; }
.pl-seg-rot { background: #ff8a7a; }
.pl-marke { position: absolute; top: 0; bottom: 0; width: 3px; margin-left: -1.5px; background: #fff; box-shadow: 0 0 0 1px #000; }
.lb-werkzeuge { display: grid; gap: 10px; grid-template-columns: 1fr; margin: 0 0 24px; }
@media (min-width: 640px) { .lb-werkzeuge { grid-template-columns: 1fr 1fr; } }
.lb-werkzeug { display: block; margin: 0; text-decoration: none; }
.lb-werkzeug-breit { grid-column: 1 / -1; }
.pl-druck { display: none; }
/* Infofenster zur Übung */
.pl-infoknopf { font-family: Georgia, serif; font-style: italic; font-weight: 700; color: #1f5fa8; }
.pl-trefferknoepfe { display: flex; gap: 6px; }
.pl-info { width: min(640px, calc(100vw - 32px)); max-height: calc(100vh - 48px); padding: 0; border: 0; border-radius: var(--radius); background: var(--bg1); color: var(--text); box-shadow: 0 12px 40px rgba(0,0,0,.35); }
.pl-info::backdrop { background: rgba(0,0,0,.55); }
.pl-info-rahmen { position: relative; padding: 18px 20px 20px; }
.pl-info-zu { position: sticky; top: 0; float: right; margin: -6px -8px 0 8px; }
.pl-info-inhalt h2 { margin: 2px 0 10px; font-size: 24px; line-height: 1.2; }
.pl-info-inhalt h3 { margin: 16px 0 4px; font-size: 17px; }
.pl-info-inhalt p, .pl-info-inhalt li { font-size: 16px; line-height: 1.5; margin: 0 0 4px; }
.pl-info-inhalt ul { margin: 0; padding-left: 20px; }
.pl-info-kopf { font-size: 13px !important; color: var(--text2); }
.pl-info-warn { font-weight: 700; }
.pl-info-C { color: #C0392B; }
.pl-info-fakten { display: grid; grid-template-columns: max-content 1fr; gap: 2px 12px; margin: 8px 0 0; font-size: 15px; }
.pl-info-fakten dt { font-weight: 700; color: var(--text2); }
.pl-info-fakten dd { margin: 0; }

/* Druckfassung: Stile gelten immer (Bildschirm: versteckt), damit planer.js die Höhe vorab messen kann. */
.pl-druck { color: #000; font-family: Arial, sans-serif; font-size: 9pt; line-height: 1.3; background: #fff; }
.pd-kopf { display: flex; justify-content: space-between; align-items: baseline; border-bottom: 2px solid #000; margin-bottom: 4pt; }
.pd-kopf h1 { font-size: 15pt; margin: 0; }
.pd-meta { margin: 0; font-size: 10pt; font-weight: 700; }
.pd-ziel { margin: 2pt 0; }
.pd-warn { margin: 3pt 0; color: #C0392B; font-weight: 700; }
.pd-tab { width: 100%; border-collapse: collapse; margin-top: 4pt; }
.pd-tab th { text-align: left; background: #eee; border: 1px solid #999; padding: 3pt 4pt; font-size: 8.5pt; }
.pd-tab td { border: 1px solid #999; padding: 3pt 4pt; vertical-align: top; }
.pd-tab tr { break-inside: avoid; }
.pd-nr { width: 4%; text-align: center; font-weight: 700; }
.pd-min { width: 5%; text-align: center; font-weight: 700; }
.pd-block { width: 20%; }
.pd-id { display: block; font-size: 8pt; color: #333; }
.pd-so { width: 47%; }
.pd-ansage { font-style: italic; }
.pd-hinweis { width: 24%; font-size: 8.5pt; }
.pd-B .pd-hinweis { font-weight: 700; }
.pd-C td { background: #fde8e6; }
.pd-C .pd-hinweis { color: #a02018; font-weight: 700; }
.pl-druck p { max-width: none; }
.pd-fuss { margin-top: 5pt; font-size: 8.5pt; border-top: 1px solid #000; padding-top: 3pt; }

@media print {
  @page { size: A4 landscape; margin: 9mm 10mm; }
  body.pl-seite > *:not(.pl-druck) { display: none !important; }
  .pl-info { display: none !important; }
  body.pl-seite { background: #fff !important; }
  .pl-druck { display: block !important; position: static !important; left: auto !important; }
}

/* ---------- Laufzettel & Prüfungsprogramme (30.09.2026) ---------- */
.lz-wahl { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 12px; }
.lz-typ { min-height: 44px; padding: 0 16px; font: inherit; font-weight: 700; cursor: pointer; border: 2px solid var(--gelb); border-radius: var(--radius-btn); background: var(--bg2); color: var(--text); }
.lz-typ.lz-an { background: var(--gelb); color: #111; }
.lz-grade { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 16px; }
.lz-chip { min-width: 64px; min-height: 44px; font: inherit; font-size: 15px; cursor: pointer; border: 1px solid var(--rahmen); border-radius: var(--radius-btn); background: var(--bg1); color: var(--text); }
.lz-chip.lz-an { background: var(--dunkel); color: #fff; border-color: var(--dunkel); }
.lz-chip.lz-warn { border-style: dashed; border-color: #C0392B; }
.lz-suchfeld { margin: 0 0 8px; }
.lz-treffer { display: grid; gap: 6px; margin: 0 0 16px; max-height: 50vh; overflow: auto; }
.lz-trefferzeile { display: grid; grid-template-columns: 64px 1fr; gap: 8px; text-align: left; font: inherit; font-size: 15px; cursor: pointer; background: var(--bg2); border: 1px solid var(--rahmen); border-radius: var(--radius); padding: 8px 10px; color: var(--text); }
.lz-trefferzeile span { color: var(--text2); }
.lz-grad { background: var(--bg2); border: 1px solid var(--rahmen); border-left: 5px solid var(--gelb); border-radius: var(--radius); padding: 14px 16px; margin: 8px 0 16px; }
.lz-titel { margin: 0 0 4px; }
.lz-meta { margin: 0 0 8px; color: var(--text2); font-size: 15px; }
.lz-hinweis { margin: 8px 0; padding: 8px 10px; border: 2px solid #C0392B; border-radius: var(--radius); color: #C0392B; font-weight: 700; }
.lz-abschnitt h3 { margin: 16px 0 6px; font-size: 18px; }
.lz-abschnitt ul { margin: 0; padding-left: 20px; }
.lz-abschnitt li { font-size: 16px; line-height: 1.5; margin: 2px 0; }
.lz-abschnitt li.lz-unter { list-style: none; margin-left: -20px; font-weight: 700; }
.lz-markiert { background: #fff3b0; outline: 2px solid var(--gelb); border-radius: 3px; }
.lz-kat { margin: 6px 0; }
.lz-kat summary { cursor: pointer; font-weight: 700; min-height: 40px; display: flex; align-items: center; }
.lz-kat .pl-trefferzeile { margin: 4px 0; }
.lz-legende { margin: 20px 0; }
.lz-legende summary { cursor: pointer; font-weight: 700; min-height: 40px; display: flex; align-items: center; }
/* Druckfassung (Stile gelten immer, am Bildschirm versteckt; so kann laufzettel.js vorab messen) */
.lz-druck { display: none; color: #000; background: #fff; font-family: Arial, sans-serif; font-size: 9pt; line-height: 1.25; page: lzhoch; }
.lzd-kopf { display: flex; justify-content: space-between; align-items: baseline; border-bottom: 2px solid #000; margin-bottom: 4pt; }
.lzd-kopf h1 { font-size: 13pt; margin: 0; }
.lzd-kopf p { margin: 0; font-size: 11pt; font-weight: 700; }
.lzd-hinweis { margin: 2pt 0; color: #a02018; font-weight: 700; }
.lzd-person { border-collapse: collapse; margin: 2pt 0 4pt; width: 100%; }
.lzd-person th { text-align: left; font-weight: 700; width: 32%; padding: 2pt 4pt; border-bottom: 1px solid #999; }
.lzd-person td { padding: 2pt 4pt; border-bottom: 1px solid #999; height: 12pt; }
.lz-druck p { max-width: none; }
.lzd-zeile { margin: 3pt 0; font-weight: 700; }
.lzd-tab { width: 100%; border-collapse: collapse; }
.lzd-tab th, .lzd-tab td { border: 1px solid #777; padding: 1.5pt 3pt; vertical-align: top; }
.lzd-tab th { background: #eee; font-size: 7.5pt; text-align: center; }
.lzd-tab th.lzd-technik { text-align: left; }
.lzd-technik { width: 52%; }
.lzd-sp { width: 6%; }
.lzd-abschnitt td { background: #e6e6e6; font-weight: 700; }
.lzd-unter td.lzd-technik { font-weight: 700; }
.lzd-tab tr { break-inside: avoid; }
.lzd-fuss { margin-top: 10pt; }
@page lzhoch { size: A4 portrait; margin: 10mm; }
@media print {
  body.lz-seite > .lz-druck { display: block !important; }
  body.lz-seite .pl-info { display: none !important; }
}

/* Die Website-Stildatei gibt jedem <section> 64–96 px Innenabstand (Startseiten-Blöcke).
   Im Lernbereich (Planer, Protokoll, Laufzettel, Druckfassungen) ist das falsch -> zurücksetzen. */
.pl-seite section, .lz-abschnitt, .pl-druck, .lz-druck { padding: 0; }
.lz-abschnitt:first-of-type h3 { margin-top: 8px; }

/* Sparten im Trainerbereich */
.lb-sparte { margin-top: 28px; }
.lb-sparte-text { margin: -4px 0 10px; color: var(--text2); }
