/* ==========================================================================
   Dokumentfuss am Bildschirm
   --------------------------------------------------------------------------
   Das Druckbild steht in druck.css. Hier steht nur, wie der Block aussieht,
   solange er noch auf dem Schirm ist.

   Warum eine eigene Datei und nicht ein Abschnitt in styles.css: An styles.css
   arbeitet gerade jemand anderes. Zwei Haende in derselben Datei kosten mehr
   Zeit, als eine zusaetzliche Zeile im Kopf der Seite je kosten wird.
   ========================================================================== */

.dokfuss {
  display: flex;
  gap: 14px;
  align-items: center;
  margin-top: 22px;
  padding-top: 14px;
  border-top: 1px solid var(--border);
}

/* Am Bildschirm klein: Wer vor dem Rechner sitzt, klickt. Der Code ist fuer
   den Fall gedacht, dass man den Rapport aufs eigene Handy holen will -
   gross genug zum Scannen aus etwa 20 cm, mehr braucht es nicht. */
.dokfuss-qr {
  flex: 0 0 88px;
  padding: 6px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 8px;
}
.dokfuss-qr svg { display: block; width: 100%; height: auto; }

.dokfuss-text {
  min-width: 0;                 /* sonst sprengt die lange Adresse die Zeile */
  font-size: .78rem;
  line-height: 1.5;
  color: var(--muted);
}
.dokfuss-titel { font-weight: 600; color: var(--text); }
.dokfuss-url {
  font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  font-size: .72rem;
  word-break: break-all;
}
.dokfuss-summe code {
  font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  font-size: .72rem;
}

/* Auf schmalen Geraeten untereinander – nebeneinander bliebe fuer den Text
   eine Spalte von vier Zeichen Breite. */
@media (max-width: 460px) {
  .dokfuss { flex-direction: column; align-items: flex-start; gap: 10px; }
  .dokfuss-qr { flex: 0 0 auto; width: 96px; }
}

/* Im dunklen Bild bleibt der Code weiss hinterlegt. Ein invertierter
   QR-Code laesst sich zwar theoretisch lesen, aber viele Kamera-Apps
   versuchen es gar nicht erst. */
[data-theme="dark"] .dokfuss-qr { background: #fff; }