/**
 * werkzeuge.css — nur Werkzeug-Spezifika (v0.2.0 SSOT-Refactor)
 *
 * Alle generischen Listen-Patterns kommen aus dem Shared-Set:
 *  - Listen-Layout, Hover, Empty, Loading, Load-More, Status-Pille-Geometrie,
 *    Sortier-Indikatoren, Save-Animation, Drag/Done/Delete-Buttons, Toggle-
 *    Button, Due-Badge, Two-Line-Cell, Avatar-Cell, Plain-Text-Cell,
 *    Action-Cell (Icon-Button-only):  _shared/functions/list-view/grid-css/idf-list-grid.css
 *  - Inline-Edit-Affordance:           _shared/functions/inline-editing/idf-inline-edit.css
 *  - Modal-Form-Felder (idf-form):     _shared/blocks/forms/idf-forms.css
 *
 * Hier bleiben ausschließlich Werkzeug-Spezifika:
 *  - Spaltenbreiten (.wz-grid)
 *  - Cell-Layout-Anker (.wz-cell-* für Inline-Edit-hostSel + Responsive-Hide)
 *  - Status-Pillen-Farben pro werkzeug_status (Werkzeug-Domäne)
 *  - Sicherheits-Sektion + Checkbox-Row im Modal (TODO: shared-Konsolidierung)
 *  - Responsive
 * Unterlagen-Tab-CSS kommt seit #137 aus
 * _shared/functions/file-attachment/idf-file-attachment.css.
 */

/* ================================================================ */
/* Grid: Spaltenbreiten                                              */
/* ================================================================ */
/* Spalten: Name (1fr) · Marke (Logo+Name) · Bereich · Lagerort ·
   Regal-Nr · Status · Prüfung · Löschen.
   Konvention `aufgaben/`: EINE 1fr-Spalte (Name) nimmt den Restplatz,
   alle anderen sind fix. */

.wz-grid {
  display: grid;
  /* Breiten aus der CSS-Variable (col-resize-Baustein); Fallback = Defaults. */
  grid-template-columns: var(--wz-cols,
    52px                /* Produktbild — quadratisch, füllt Row-Höhe */
    minmax(220px, 1fr)  /* Name — wächst */
    180px               /* Marke (Logo + Name) */
    220px               /* Bereich — 180 → 220 (war angeschnitten) */
    170px               /* Standort (Enum-Label aus lagerort.standort) — User-Wunsch breiter (war 130) */
    140px               /* Lagerort — User-Wunsch kleiner (war 180) */
    110px               /* Regal-Nr */
    180px               /* Zeichen (ISO-7010-Piktogramm-Strip, max. 5 Thumbs) */
    170px               /* Status — 130 war zu schmal: Status-Pille + Pen passten nicht, Pen wurde verdeckt */
    140px               /* Nächste Prüfung (Datum + Sub-Line) — User-Wunsch kleiner (war 170) */
    44px                /* Löschen */
  );
  align-items: stretch;
  gap: 0;
}

/* Zeichen-Cell — Strip aus _shared/zeichen-strip. Body-Cell-Default-
   Padding (12 px) bleibt, aber overflow:visible für Tooltips an den
   Thumbs. */
.wz-cell-zeichen {
  display: flex;
  align-items: center;
  gap: 4px;
  overflow: visible;
}

/* Produktbild-Cell - 1. Spalte, quadratisch (52 x 52 px). Kommt jetzt
   komplett aus dem Shared-Baustein `.idf-cell-bild*`
   (_shared/primitives/cells/idf-bild-cell.css, Audit L4/#198);
   nur die 52px-Spaltenbreite bleibt hier im .wz-grid. */

/* Pen + Inhalt mit einheitlichem Abstand, falls die Cell direkt Host ist
   (keine inner-row wie bei Two-Line-Cell). Cell-Default ist
   flex+align-items:center aus _shared/list-grid; gap braucht ein
   ergänzender Selector. */
.idf-list-rows .idf-list-row .wz-grid .idf-inline-edit-host {
  gap: 8px;
}

/* Status- und Prüf-Cells dürfen während des Edits aufmachen (overflow:visible),
   damit eine Combobox-Popup-Anker- oder Select-Open-Höhe nicht abgeschnitten
   wird. is-editing wird vom Cell-Dispatcher gesetzt. */
.idf-list-rows .idf-list-row .wz-grid > div.is-editing {
  overflow: visible;
}

/* ================================================================ */
/* Status-Pille — Color-Modifier pro werkzeug_status                 */
/* ================================================================ */
/* Geometrie + Typografie kommen aus shared `.idf-pill-tag` (13 px
   UPPERCASE, getöntes BG mit Brand-Textfarbe). Markup:
   <span class="idf-pill-tag wz-status-pill" data-status="verfuegbar">
   Verfügbar</span>. Modul liefert nur noch die rgba-Tints + Textfarbe
   pro Domain-Status. Damit ist Werkzeuge-Status konvergent zu
   SafeGuard-Prüfpunkte-Typ, BA-Status, DS-Risiko etc.
   (vorher Solid-Color über `.idf-list-status-pill` — wirkte als
   einzige Liste lauter und uneinheitlich). */

/* ================================================================ */
/* „Nächste Prüfung"-Cell — Two-Line (Datum + Tage-Subline)         */
/* ================================================================ */
/* Layout-Geometrie liefert das shared `.idf-list-cell-two-line` aus
   _shared/list-grid. Hier nur Modul-spezifische Color-Modifier
   analog SafeGuard `.sg-cell-naechste` / DS `.sgds-cell-datum`. */
.wz-cell-pruef.is-ueberfaellig .idf-list-cell-two-line-text {
  color: var(--primary, #c8134b);
  font-weight: var(--weight-bold, 700);
}
.wz-cell-pruef.is-heute .idf-list-cell-two-line-text {
  color: var(--yellow-text, #b58600);
  font-weight: var(--weight-bold, 700);
}
.wz-cell-pruef.is-bald .idf-list-cell-two-line-text {
  color: var(--yellow-text, #b58600);
}
.wz-cell-pruef.is-ueberfaellig .idf-list-cell-two-line-sub {
  color: var(--primary, #c8134b);
}

.wz-status-pill[data-status="verfuegbar"]    { background: var(--tint-confirm); color: var(--confirm, #0c998e); }
.wz-status-pill[data-status="verliehen"]     { background: var(--tint-orange); color: var(--orange, #e8710a); }
.wz-status-pill[data-status="defekt"]        { background: var(--tint-primary); color: var(--primary, #c8134b); }
.wz-status-pill[data-status="ausgemustert"]  { background: var(--tint-neutral);     color: var(--mid, #555); }

/* Delete-Cell-Layout (.idf-list-cell-action) kommt aus
   _shared/functions/list-view/grid-css/idf-list-grid.css — padding:0 + justify-content
   center, damit der 28×28-Trash-Button nicht von der 44px-Cell geclippt
   wird. */

/* ================================================================ */
/* Modal-Tab Stammdaten — 2-Spalten-Layout (Daten links, Bild rechts) */
/* ================================================================ */
/* Der 2-Spalten-Layout-Wrapper (Formular links, Bild rechts) kommt jetzt
   aus dem Shared-Baustein `.idf-basics-split(-fields)`
   (_shared/functions/detail-modal/idf-standard-artefakt.css, Audit L4/#198).
   Hier bleiben nur die Bild-Block-Zustaende (Preview/Empty/Busy/Actions)
   bis zur createImageField-Migration (#225). */

/* Bild-Block links — Preview oben, Aktionen darunter. Preview ist
   quadratisch (1:1, dank aspect-ratio). Bei vorhandenem Bild deckt das
   <img> die ganze Preview-Box ab. */
.wz-basics-bild {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.wz-basics-bild-preview {
  width: 100%;
  aspect-ratio: 1 / 1;
  background: var(--bg, #fafafa);
  border: 1px solid var(--line, #e5e5e5);
  border-radius: var(--radius-md, 6px);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.wz-basics-bild-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.wz-basics-bild-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  color: var(--soft, #ae9586);
  font-size: var(--font-sm, 0.8125rem);
}
.wz-basics-bild-empty i { font-size: 40px; opacity: 0.6; }
.wz-basics-bild-busy {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--mid, #555);
  font-size: var(--font-sm, 0.8125rem);
}
.wz-basics-bild-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

/* ================================================================ */
/* Modal-Tab Sicherheit                                              */
/* ================================================================ */
/* Stammdaten-Form nutzt .idf-form (label-basiert) aus _shared/forms.
   Hier nur Werkzeug-spezifische Rest-Bausteine. */

/* Checkbox-Row im Sicherheit-Tab — Wrapper-Span um Checkbox + Label-Text
   in einer `<label class="idf-form-row-full">`. Höhere Spezifität via
   .idf-form-Scope, damit die idf-form-span-Default-Farbe (mid 14px für
   Field-Labels) durch ink-Schwarz überschrieben wird — der Text neben
   der Checkbox ist Inhalt, nicht Field-Label. */
.idf-form .wz-checkbox-row {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: var(--ink);
}
.idf-form .wz-checkbox-row input[type=checkbox] {
  width: 16px;
  height: 16px;
  accent-color: var(--accent);
  cursor: pointer;
}

/* Sub-Grid mit den Prüf-Details unter der Pruefpflichtig-Checkbox.
   `display: grid` + `grid-column: 1 / -1` kommen aus shared
   `.idf-form-subgrid` (das Markup setzt beide Klassen). Hier nur
   Modul-spezifische Grid-Spalten + visueller Trenner. */
.wz-sicherheit-details {
  grid-template-columns: 1fr 1fr;
  gap: 16px 20px;
  padding-top: 8px;
  margin-top: 4px;
  border-top: 1px solid var(--line);
}

/* Modal-Tab: Unterlagen — kommt jetzt aus
   _shared/functions/file-attachment/idf-file-attachment.css (#137). */

/* ================================================================ */
/* Responsive (≤ 1100px) — drei Spalten ausblenden, schmaleres Grid  */
/* ================================================================ */

@media (max-width: 1100px) {
  .wz-grid {
    grid-template-columns:
      minmax(0, 1fr)  /* Name */
      130px            /* Marke */
      120px            /* Status */
      120px            /* Prüfung */
      44px;            /* Löschen */
  }
  /* Drift-Fix (Audit L4/Scout §6): das 5-Track-Template oben droppt auch
     die Tracks Bild + Standort - die fehlten aber in der Hide-Liste, die
     sichtbaren Zellen verrutschten. Bild-Zelle ueber den .wz-grid-Scope
     ausblenden (Shared-Klasse .idf-cell-bild, cross-geladene Module
     duerfen nicht mitgetroffen werden). !important noetig: die Shared-
     Body-/Head-Cell-Regeln (.idf-list-rows .idf-list-row .idf-list-grid
     > div bzw. .idf-list-thead ...) setzen display:flex mit hoeherer
     Spezifitaet - Repo-Muster wie .dl-cell-akteure/.pl-cell-akteure. */
  .wz-grid > .idf-cell-bild,
  .wz-grid > .idf-cell-bild-head,
  .wz-cell-standort,
  .wz-cell-bereich,
  .wz-cell-lagerort,
  .wz-cell-regal-nr,
  .wz-cell-zeichen {
    display: none !important;
  }
  .wz-sicherheit-details {
    grid-template-columns: 1fr;
  }
  /* col-resize im Schmal-Layout inaktiv (Modul-Grid gewinnt hier): Griffe weg,
     Scroll-Modus neutralisieren, damit nichts verrutscht/ueberlaeuft. */
  .idf-colresize-layer { display: none; }
  .idf-colresize-scroll .idf-list-thead,
  .idf-colresize-scroll .idf-list-rows { width: auto; min-width: 0; }
}