/* Was für Sigis Zielgruppe gilt — auch in der Datei, die die Teilnehmer bekommen.
   Ältere Hände treffen kein 25 px hohes Ziel: 44 px ist die Untergrenze. Das
   geerbte Design-System setzt keine Mindesthöhe, und Textlinks haben von sich
   aus nur die Höhe ihrer Zeile. */

.btn, .input, .select, #tool-btn,
.ia-block button, .ia-block label, .dropdown-item { min-height: 44px; }

/* Knöpfe ohne Text sind nur so breit wie ihr Zeichen — die Mindesthöhe allein
   ergibt einen Streifen von 29 bis 36 px. Gemessen am Werkzeug-Knopf der
   RTO-Seiten und an der Blätter-Leiste der Interaktionen, deren Pfeile und
   Fragennummern aus `mod-interaktion.js` kommen. */
#tool-btn, .btn.icon-only { min-width: 44px; }

/* Die Blätter-Leiste der Interaktionen braucht ein Gewicht mehr: `mod-interaktion.js`
   schiebt seine Regeln zur Laufzeit als <style> ins Dokument, die stehen damit hinter
   jeder Datei. Bei gleicher Spezifität gewinnt die spätere — deshalb `body` davor.
   (`#tool-btn` oben braucht das nicht, eine ID wiegt ohnehin schwerer.) */
body .ia-nav-arrow, body .ia-jump { min-width: 44px; }

/* Die Verweise. ⚠ `b > a` und `i > a` gehoeren zwingend dazu: ein Wikilink, der
   in der .md fett oder kursiv gesetzt ist (`**[[wanderball]]**`), steckt im
   HTML in einem <b> bzw. <i> — der Eltern-Selektor greift dann nicht, und das
   Ziel blieb bei 16 bis 19 px. Gemessen an einer Offline-Datei mit 29
   Bausteinen: 13 solcher Faelle. */
li > a, td > a, .card h3 a, p > a, .adm a, .ia-block a,
b > a, i > a, strong > a, em > a {
  display: inline-flex; align-items: center; min-height: 44px;
}

a.chip { display: inline-flex; align-items: center; min-height: 44px; padding: 0 .9em; }

.link-tot { color: var(--danger, #b00); text-decoration: underline wavy; }

/* Der Aufklapp-Pfeil im Inhaltsverzeichnis misst geerbt 21 px. Er sitzt neben
   dem Zweigtitel, deshalb wächst er nur in die Breite mit, nicht in die Höhe
   der Zeile hinein. */
.sidebar-toggle { min-width: 44px; min-height: 44px; }

/* Das Zeichen im Kopf der RTO-Seitenleiste: die geerbte Regel gibt ihm 80 %
   der Spaltenbreite — bei einem quadratischen SVG ist das ein Klotz. */
#school-logo img { max-width: 5rem; }

/* Das Zeichen steht fuer sich — der geerbte Kasten dahinter sah aus wie ein
   Platzhalter, in den noch etwas kommen soll. */
#school-logo { background: none; }

/* Der Musikknopf der Halten-Ansicht: die geerbten Abspielknöpfe des Browsers
   sind klein, die Leiste gibt ihnen die Zeilenhöhe der übrigen Bedienelemente. */
audio { height: 44px; max-width: 100%; }

/* Abbildungen. Sie stehen in einem eigenen Block, nicht im Textfluss: die
   Schaubilder sind beschriftet und werden gelesen, nicht überflogen. Die Breite
   ist gedeckelt, weil ein 800 px breites Schema auf dem Tablet sonst die ganze
   Seite einnimmt — die Unterschrift gehört mit ins Bild. */
figure.abb {
  margin: var(--sp-4) 0;
  max-width: 100%;
}

/* Die Schaubilder sind auf weißem Papier gezeichnet und haben keinen eigenen
   Rand — in der dunklen Ansicht schwimmt die Zeichnung sonst im Nichts. */
figure.abb img {
  display: block;
  max-width: 100%;
  height: auto;
  background: #fff;
  border-radius: var(--radius-md);
}

figure.abb figcaption {
  margin-top: var(--sp-2);
  font-size: var(--fs-sm);
  color: var(--fg-2);
}
