/* verdachtsfaelle.css: Liste offener Verdachtsdiagnosen (nur Tokens und Bausteine) */

.page {
  max-width: 900px;
}

.zahl {
  margin: 0 0 var(--abstand-md);
  font-size: var(--schrift-text);
  font-weight: 700;
  color: var(--blue-dark);
}

.tabelle tbody tr {
  position: relative;
}

.tabelle tbody tr:focus-within {
  outline: var(--fokus-breite) solid var(--farbe-fokus);
  outline-offset: calc(-1 * var(--fokus-breite));
}

td.diagnose {
  overflow-wrap: anywhere;
}

td.kurz,
.zeilenlink,
.ohne-taube {
  white-space: nowrap;
}

/* Ganze Zeile bzw. Karte ist der Link: Die Fläche des Links wird auf die Zeile gezogen. */
.zeilenlink {
  display: inline-flex;
  align-items: center;
  min-height: var(--tippflaeche);
  font-weight: 700;
  color: var(--blue-dark);
}

.zeilenlink::after {
  content: "";
  position: absolute;
  inset: 0;
}

.ohne-taube {
  display: inline-flex;
  align-items: center;
  min-height: var(--tippflaeche);
  color: var(--muted);
}

.liste-mehr {
  display: flex;
  justify-content: center;
  padding: var(--abstand-md) 0 0;
}

.liste-mehr .btn {
  font-size: var(--schrift-text);
  white-space: nowrap;
}

/* Zustandszeile (Laden, leer, Fehler) über die ganze Tabellenbreite */
.tabelle td[colspan] {
  padding: 0;
}

@media (max-width: 599.98px) {
  .tabelle td[colspan] {
    display: block;
  }

  .tabelle td[colspan]::before {
    content: none;
  }
}

footer {
  max-width: 900px;
}

/* Die globale .badge-Regel in components.css übertrifft die Baustein-Varianten; hier mit höherer Spezifität wieder gültig */
.badge.badge--warn { background: var(--farbe-warn-bg); color: var(--farbe-warn); border-color: var(--farbe-warn-rand); }
