/*
 * Lektionsseite (vorlagen/lektion/lektion.php) und die Helfer dazu
 * (bedeutungsfelder, bereitschaft_html, kind_lernstand_html, fehlerliste_html,
 * proben_html). Nur, was Bootstrap nicht kann.
 */

/* Aufklappbare Karten */
.lektion-seite details.card > summary { cursor: pointer; list-style-position: inside; }
.lektion-seite details.card > summary::marker { color: var(--kern-akzent); }

/* Klassenarbeit */
.termin-karte { background: var(--flaeche-hell); }
.bereitschaft .progress { min-width: 8rem; max-width: 22rem; height: .6rem; }

/* Vokabeltabelle */
.vokabel-suche { max-width: 16rem; }
.vokabeltabelle tr.problem > td:first-child { box-shadow: inset 3px 0 var(--falsch); }
.vokabeltabelle tr.bearbeiten > td { background: var(--flaeche-hell); }
.vokabeltabelle td { overflow-wrap: anywhere; }
.vokabeltabelle .aktionen .btn { text-decoration: none; }
.richtungsfach { display: inline-flex; align-items: center; gap: 2px; white-space: nowrap; }
.richtungsfach .fachmarke { min-width: 1.3rem; height: 1.3rem; }
.hinweismarke { cursor: help; margin-right: .2rem; }
.hinweismarke.bestaetigt { opacity: .55; }
.termin-datum { max-width: 12rem; }

/* Mehrere Bedeutungen ("+ weitere Bedeutung", app.js haengt Zeilen mit .weg an) */
.bedeutung-zeile .weg {
  flex: 0 0 auto; border: var(--bs-border-width) solid var(--bs-border-color); border-radius: .8rem;
  background: transparent; color: var(--bs-secondary-color); padding: .25rem .7rem;
}
.bedeutung-zeile .weg:hover { color: var(--falsch); border-color: var(--falsch); }
.bedeutungen .weitere { text-decoration: none; font-weight: 700; }

/* Rangliste */
.rangliste .platz { width: 2rem; }
.rangliste .ich { background: var(--flaeche-hell); border-radius: .6rem; }

/* Fehler: was falsch war (fehler_markieren) und Aenderungen (aenderung_html) */
.eingabe-falsch, .eingabe-richtig { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .95rem; }
.eingabe-falsch del, .fehler-legende del, .aenderung del {
  color: var(--falsch); background: var(--falsch-hell); text-decoration: line-through; border-radius: 3px;
}
.eingabe-richtig ins, .fehler-legende ins, .aenderung ins {
  color: var(--richtig); background: var(--richtig-hell); text-decoration: none; font-weight: 800; border-radius: 3px;
}
.fehlerliste-lektion > li:first-child { border-top: 0 !important; }

/* Noten der Probe-Klassenarbeit */
.note {
  display: inline-block; min-width: 1.7rem; text-align: center; font-weight: 800; border-radius: .5rem;
  padding: 0 .35rem; background: var(--fast-hell); color: var(--fast);
}
.note.n1, .note.n2 { background: var(--richtig-hell); color: var(--richtig); }
.note.n5, .note.n6 { background: var(--falsch-hell); color: var(--falsch); }