/* cf-kachelwand.css — die drei Listen als Higgsfield-Kachelwand.

   Kein zweites Designsystem: .ig-sec/.ig-eb/.ig-grid/.ig-tile/.ig-badge/.ig-t-ic kommen
   aus cf-intel.css. Hier steht nur, was eine LISTE zusaetzlich braucht — Avatar im
   Icon-Chip, Chip-Leiste am Fuss, Umschalter, Leerzustand. Praefix kw-.

   Der Abstandsvertrag aus cf-intel.css gilt unveraendert und wird von
   docs/guard-kachelwand.mjs gemessen: >= 56 px ueber dem Sektionskopf, 20-24 px zum
   Raster, 16-20 px Kachel-Gap, 22-26 px Kachel-Polster. */

/* Der erste Sektionskopf einer Ansicht steht direkt unter dem Seitenkopf — dort waeren
   56 px Luft doppelt gemoppelt, weil der Seitenkopf seinen eigenen Abstand mitbringt.
   Ueberall sonst gilt der Vertrag. */
.kw-host{margin-top:0}
/* Die Eyebrow-Zeile ersetzt hier den vollen Sektionskopf (Begruendung in cf-kachelwand.js).
   Sie braucht deshalb den Abstand, den sonst .ig-sec mitbringt — nach oben zum Seitenkopf
   und nach unten zum Raster. Der Vertrag 20-24 px zum Raster gilt unveraendert. */
.kw-eb{margin:6px 0 22px;align-items:baseline}
.kw-hint{font-size:.86rem;color:var(--ink-soft);line-height:1.5;font-weight:500;
  letter-spacing:0;text-transform:none}

.kw-grid{align-items:start}

/* Die Kachel ist ein Knopf: sie muss wie einer aussehen und sich wie einer anfassen. */
.kw-tile{width:100%;gap:11px}
.kw-tile:focus-visible{outline:2px solid var(--lime);outline-offset:2px}
.kw-tile h4{overflow-wrap:anywhere}

/* Avatar im Icon-Chip: dieselbe Flaeche wie ein Symbol, damit die Kopfzeile aller
   Kacheln auf einer Linie sitzt — auch gemischt (Kontakt mit Initialen, Nummer mit
   Symbol). Ohne feste Flaeche springt die Ueberschrift je Kachel um ein paar Pixel,
   und genau das liest sich als "nicht sauber gebaut". */
.kw-av{font-weight:800;font-size:.86rem;letter-spacing:.02em;
  background:var(--rail-active);color:var(--ink)}

/* Chip-Leiste am Fuss: die Angaben, die in der Tabelle eigene Spalten waren. Sie stehen
   bewusst KLEIN und ohne Rahmen — sie sind Beiwerk, nicht die Aussage der Kachel. */
.kw-chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:auto;padding-top:4px}
.kw-chips span{font-size:.74rem;font-weight:700;color:var(--ink-soft);
  background:var(--surface-3);border-radius:20px;padding:3px 9px;white-space:nowrap;
  max-width:100%;overflow:hidden;text-overflow:ellipsis}

/* Das Ergebnis-/Bewertungs-Chip der Tabelle traegt seine Semantikklasse (good/warn/bad/
   mut/info) mit auf die Kachel. Die .ig-badge-Flaeche bleibt, die Farbe kommt aus der
   Semantik — sonst haette die Kachelwand andere Farben als die Tabelle daneben. */
.kw-badge.good{color:var(--good);background:var(--good-bg)}
.kw-badge.warn{color:var(--warn);background:var(--warn-bg)}
.kw-badge.bad{color:var(--bad);background:var(--bad-bg)}
.kw-badge.info{color:var(--info);background:var(--info-bg)}
.kw-badge.mut{color:var(--ink-soft);background:var(--surface-3)}

.kw-leer{grid-column:1 / -1;border:1px dashed var(--line-strong);border-radius:14px;
  padding:22px;color:var(--ink-soft);font-size:.9rem;line-height:1.6}

/* Umschalter Kacheln | Tabelle. Nutzt die bestehende .seg-Optik der Konsole. */
.kw-seg .ic{width:16px;height:16px}
@media(max-width:720px){.kw-seg span{display:none}}

/* ---------------------------------------------------------------- Zeilen-Karte
   Panel-Verdikt fuer die Kontaktliste: Zeilen-Karte statt Kachel. Getragen von
   .ig-bf/.ig-bf-row/.ig-bf-mid/.ig-bf-acts aus cf-intel.css — die Klassen gab es
   bereits fuer die Befund-Liste der Unternehmens-Akte. Kein Neubau, nur die
   Ergaenzungen, die eine anklickbare Zeile braucht. */
.kw-bf{display:flex;flex-direction:column;gap:12px}
.kw-row{width:100%;text-align:left;font:inherit;color:var(--ink);cursor:pointer;
  transition:transform .16s var(--ease),box-shadow .16s var(--ease),border-color .16s var(--ease)}
.kw-row:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);border-color:var(--line-strong)}
.kw-row:focus-visible{outline:2px solid var(--lime);outline-offset:2px}
.kw-row .kw-chips{margin-top:6px;padding-top:0}
/* Der Status sitzt in der Zeilen-Karte IMMER rechts auf derselben Hoehe — das ist ihr
   ganzer Vorteil gegenueber der Kachel. Bricht er um, ist er wieder gesucht. */
.kw-row .ig-bf-acts{justify-content:flex-start}

/* Filterleiste: nutzt die bestehende .filters/.fchip-Optik der Gespraechsliste. */
.kw-filters{margin:0 0 18px}