/* Phase E, Paket B (Mündlich, Fahrprobe, Lehrübung). Nutzt die Farben aus basis.css, nichts Festes. */

/* ---- Uhr (Prüfer-Modus, Fahrprobe-Kommentar) */
.pm-uhrzeile { display: inline-flex; align-items: center; gap: 6px; align-self: flex-start; min-height: 32px; padding: 2px 12px; border: 1px solid var(--rand); border-radius: 999px; background: var(--flaeche); color: var(--text2); }
.pm-uhr { font-variant-numeric: tabular-nums; font-weight: 900; font-size: 1.05rem; color: var(--text); }
.fp-uhr { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.fp-uhr .knopf { flex: 0 1 auto; }

/* ---- Nachhaken des Prüfers */
.pm-nachhaken { border-left-width: 5px; }
.pm-nachfrage { margin: 0; font-size: 1.15rem; font-weight: 700; line-height: 1.4; overflow-wrap: anywhere; }

/* ---- Ergebnis: drei Kennzahlen nebeneinander (auch auf 360 px) */
.pm-ergebnis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.pm-kennzahl { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 2px; padding: 10px 6px; text-align: center; background: var(--flaeche); border: 1px solid var(--rand); border-radius: var(--radius); overflow-wrap: break-word; hyphens: auto; }
.pm-kennzahl .klein { line-height: 1.25; }
.pm-gross { font-size: 1.5rem; line-height: 1.15; font-variant-numeric: tabular-nums; }
.pm-je-schritt { margin: 0; padding: 0 0 12px 18px; display: grid; gap: 4px; }

/* ---- frühere Versuche */
.pm-versuch { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 12px; padding: 8px 14px; align-items: baseline; }
.pm-versuch-datum { font-weight: 700; grid-row: span 2; }
.pm-versuch > span:nth-child(n+3) { grid-column: 2; }

/* ---- Skizze und Animation bei der Fahrprobe-Situation */
.fp-skizze { margin: 0; }
.fp-skizze svg { max-width: 100%; height: auto; }

/* ---- Simulationen (Gesamtuhr, Plan, Übersicht) */
.sim-kopf { position: sticky; top: 0; z-index: 5; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; padding: 8px 0; background: var(--hg); border-bottom: 1px solid var(--rand-fein); }
.sim-uhr { margin-left: auto; font-variant-numeric: tabular-nums; color: var(--text2); }
.sim-uhr-zeit { font-weight: 900; font-size: 1.1rem; color: var(--text); }
.sim-uhr.ueber .sim-uhr-zeit, .sim-ueber { color: var(--nochmal-text); }
.sim-inhalt { display: flex; flex-direction: column; gap: 12px; }
.sim-inhalt > .seite { padding: 0; }
.sim-plan-zeile { cursor: default; }
.sim-ueb-zeile { display: block; }

/* ---- Lehrübung beobachten */
.seite-lehruebung { max-width: 46rem; }
.lu-form { display: flex; flex-direction: column; gap: 12px; }
.lu-grundlage { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px; }
.lu-eintrag > summary { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; min-height: 52px; padding: 8px 14px; cursor: pointer; list-style: none; }
.lu-eintrag > summary::-webkit-details-marker { display: none; }
.lu-eintrag > summary .symbol { margin-left: auto; }
.lu-eintrag[open] > summary .symbol { transform: rotate(180deg); }
.lu-eintrag > :not(summary) { margin-left: 14px; margin-right: 14px; }
.lu-eintrag > .knopf { margin-bottom: 12px; }
.lu-datum { font-weight: 900; }
.lu-werte { margin: 0 14px 8px; padding-left: 20px; display: grid; gap: 6px; }
.lu-werte li > b { display: block; color: var(--akzent); }
.lu-notiz { overflow-wrap: anywhere; white-space: pre-wrap; }

@media (min-width: 560px) {
  .pm-gross { font-size: 1.8rem; }
}