/* kanzleizentrale — see kronenwerk.css for the tokens these rules read. */

/*
  Der Bildschirm einer Kanzlei ist eine Tabelle, und das ist die Entscheidung.

  Fünfzig Mandanten nebeneinander zu vergleichen ist genau das, wofür eine Tabelle da
  ist: gleiche Zahl an gleicher Stelle, Auge fährt die Spalte hinunter. Fünfzig Kacheln
  wären fünfzig Objekte, von denen keines mit dem nächsten vergleichbar wäre -- und der
  Strukturtest verbietet die Karte ohnehin, weil ein Mandant hier eine ZEILE ist und
  kein Gegenstand, den man aufheben und wegtragen kann.

  Breite Tabellen scrollen in ihrem eigenen Rahmen. Der Rumpf der Seite scrollt nie
  waagerecht.
*/

.kz-leer {
  color: var(--tinte-3);
  padding: var(--raum-3) 0;
}

.kz-abschnitt {
  font-size: 0.95rem;
  letter-spacing: 0.02em;
  margin: 0 0 var(--raum-2);
}

.kz-block {
  margin: var(--raum-4) 0;
  padding-top: var(--raum-3);
  border-top: 1px solid var(--linie);
}

.kz-zahlen {
  margin-bottom: var(--raum-3);
}

/* --------------------------------------------------------------- je Währung */

.kz-waehrungen {
  margin: var(--raum-3) 0;
}

.kz-waehrungsliste {
  list-style: none;
  margin: 0 0 var(--raum-1);
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--raum-3);
}

.kz-waehrungszeile {
  display: flex;
  align-items: baseline;
  gap: var(--raum-1);
}

.kz-waehrungsbetrag {
  font-size: 1.05rem;
  color: var(--negativ);
}

/* ------------------------------------------------------------ zuletzt / Filter */

.kz-zuletzt {
  margin: var(--raum-3) 0;
}

.kz-zuletzt-liste,
.kz-zuletzt-form {
  display: inline-flex;
  flex-wrap: wrap;
  gap: var(--raum-1);
}

.kz-filter {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--raum-1);
  margin: var(--raum-3) 0;
}

/* ------------------------------------------------------------------ die Tafel */

.kz-tafel-rahmen {
  overflow-x: auto;
  border: 1px solid var(--linie);
  border-radius: var(--radius);
  background: var(--flaeche);
}

.kz-tafel {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.92rem;
}

.kz-tafel th,
.kz-tafel td {
  padding: var(--raum-2);
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--linie);
  white-space: nowrap;
}

.kz-tafel thead th {
  font-weight: 600;
  color: var(--tinte-3);
  background: var(--flaeche-tief);
  position: sticky;
  top: 0;
}

.kz-tafel tbody tr:last-child td {
  border-bottom: 0;
}

.kz-rechts {
  text-align: right;
}

/* Die Zeile, an der heute jemand etwas zu tun hat. Eine Kante, keine Fläche: eine
   eingefärbte Zeile unter fünfzig eingefärbten Zeilen färbt gar nichts mehr. */
.kz-achtung td:first-child {
  box-shadow: inset 3px 0 0 var(--gold);
}

.kz-name {
  font-weight: 600;
}

.kz-unterzeile {
  display: block;
  white-space: normal;
}

.kz-anzahl {
  margin-left: var(--raum-1);
}

.kz-spaet {
  color: var(--negativ);
}

.kz-warnung {
  color: var(--negativ);
}

.kz-aktivitaet {
  display: flex;
  flex-direction: column;
}

.kz-tat {
  display: flex;
  gap: var(--raum-1);
  align-items: center;
}

.kz-herkunft {
  margin-top: var(--raum-2);
}

/* -------------------------------------------------------------------- die Akte */

.kz-wechseln {
  margin: var(--raum-2) 0;
}

.kz-zeile-form,
.kz-anfrage-form,
.kz-antwort-form {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--raum-1);
}

.kz-notiz-form {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--raum-2);
  max-width: 46rem;
}

.kz-notiz-form textarea {
  width: 100%;
}

/* Der Satz, der sagt, wer die Notiz lesen kann. Er steht auf der Seite, weil eine
   private Notiz nur nützt, wenn der Schreibende weiss, dass sie privat ist. */
.kz-privat {
  color: var(--tinte-3);
  font-size: 0.9rem;
  border-left: 2px solid var(--gold-linie);
  padding-left: var(--raum-2);
  margin: 0 0 var(--raum-2);
}

.kz-anfrageliste {
  list-style: none;
  margin: var(--raum-2) 0 0;
  padding: 0;
}

.kz-anfrage {
  padding: var(--raum-2) 0;
  border-bottom: 1px solid var(--linie);
}

.kz-anfrage:last-child {
  border-bottom: 0;
}

.kz-anfrage-kopf {
  display: flex;
  align-items: baseline;
  gap: var(--raum-2);
}

.kz-anfrage-titel {
  font-weight: 600;
}

.kz-marke {
  font-size: 0.8rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--tinte-3);
}

.kz-anfrage-tat {
  display: flex;
  flex-wrap: wrap;
  gap: var(--raum-1);
  margin-top: var(--raum-1);
}