/* ============================================================
   LifeFolder — Add document (Mehrdatei-KI-Batch)
   ============================================================ */
.crumb { display: flex; align-items: center; gap: 6px; font-size: 13px; margin-bottom: 6px; }
.crumb__link { color: var(--color-muted); }
.crumb__link:hover { color: var(--color-selected); }
.crumb__sep { color: var(--color-muted-2); display: inline-flex; }
.crumb__here { color: var(--color-ink); font-weight: 600; }

/* [hidden] muss display:flex/grid der Batch-Elemente schlagen */
.batch__queuehead[hidden], .batch__done[hidden], .batch__panel[hidden], .scan-tray[hidden] { display: none; }

/* Kamera-Scan-Ablage: gepufferte Foto-Seiten (mehrere Seiten → ein Dokument) */
.scan-tray { display: flex; flex-direction: column; gap: 12px; padding: 14px; border: 1px solid var(--color-line); border-radius: 14px; background: var(--color-bg); }
.scan-tray__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.scan-tray__title { display: inline-flex; align-items: center; gap: 7px; font-size: 14px; font-weight: 700; color: var(--color-ink); }
.scan-tray__count { font-size: 12.5px; font-weight: 600; color: var(--color-muted); }
.scan-tray__thumbs { display: flex; flex-wrap: wrap; gap: 8px; }
.scan-tray__thumb { width: 56px; height: 74px; object-fit: cover; border-radius: 8px; border: 1px solid var(--color-line); background: var(--color-surface); }
.scan-tray__actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.scan-tray__cancel { margin-left: auto; border: none; background: none; color: var(--color-muted); font: inherit; font-size: 13px; cursor: pointer; }
.scan-tray__cancel:hover { color: var(--color-ink); }

.batch { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 20px; align-items: start; }
.batch__main { display: flex; flex-direction: column; gap: 16px; min-width: 0; }

.batch__zone.is-compact { padding: 20px; }
.batch__zone.is-compact .add-dropzone__hint, .batch__zone.is-compact .add-dropzone__secure { display: none; }

.batch__queuehead { display: flex; align-items: center; gap: 8px; padding: 2px 2px 0; font-size: 13.5px; }
.batch__count { font-weight: 700; color: var(--color-ink); }
.batch__waiting { color: var(--color-muted-2); }
.batch__clear { margin-left: auto; border: none; background: transparent; color: var(--status-urgent-fg); font-size: 13px; font-weight: 600; cursor: pointer; padding: 0; }
.batch__clear:hover { text-decoration: underline; }

/* Sammel-Bestätigung: sitzt rechts vor „Clear all" (nur sichtbar ab 2 Karten) */
.batch__confirmall { margin-left: auto; }
.batch__confirmall[hidden] { display: none; }
.batch__confirmall:not([hidden]) ~ .batch__clear { margin-left: 0; }

.batch__queue { display: flex; flex-direction: column; gap: 12px; }

/* Datei-Karte */
.bcard { display: flex; gap: 16px; padding: 14px; border: 1px solid var(--color-line); border-radius: 16px; background: var(--color-surface); align-items: flex-start; }
.bcard.is-editing { border-color: var(--color-ai); box-shadow: 0 0 0 1px var(--color-ai); }
/* Wird die Karte gerade im Panel bearbeitet, gibt es genau EINEN Speicherweg:
   das Panel. Karten-Buttons weichen einem Hinweis (keine zwei grünen Primaries). */
.bcard.is-editing .bcard__side .btn { display: none; }
.bcard__editing { display: none; }
.bcard.is-editing .bcard__editing { display: inline-flex; align-items: center; font-size: 12.5px; font-weight: 600; color: var(--color-ai); }
.bcard__error { font-size: 12.5px; font-weight: 600; color: var(--status-urgent-fg); margin-top: 8px; }
.bcard__thumb { width: 66px; height: 82px; flex: none; border-radius: 10px; background: var(--status-valid-bg); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.bcard__type { font-size: 11px; font-weight: 800; letter-spacing: .04em; color: var(--color-muted-2); }
/* Echtes Bild-Thumbnail bzw. farbige Kategorie-Kachel */
.bcard__thumb-img { width: 100%; height: 100%; display: block; }
.bcard__thumb-img img { width: 100%; height: 100%; object-fit: cover; object-position: top; display: block; }
.bcard__thumb-icon { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; }
.bcard__thumb-ext { font-size: 10.5px; font-weight: 800; letter-spacing: .04em; }
.bcard__body { flex: 1; min-width: 0; }
.bcard__body--clickable { cursor: pointer; }
.bcard__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 18px; }
.bcard__field { min-width: 0; }
.bcard__k { display: block; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--color-muted-2); }
.bcard__v { display: block; font-size: 14px; font-weight: 600; color: var(--color-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bcard__tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 11px; }
.bcard__tag { font-size: 11.5px; font-weight: 600; color: var(--color-muted); background: var(--status-valid-bg); border-radius: 6px; padding: 3px 8px; }
.bcard__side { flex: none; width: 160px; display: flex; flex-direction: column; gap: 8px; align-items: stretch; }
.bcard__side .btn { width: 100%; }
.bcard__remove { border: none; background: transparent; color: var(--color-muted-2); font-size: 12.5px; font-weight: 600; cursor: pointer; padding: 2px 0; display: inline-flex; align-items: center; gap: 5px; justify-content: center; }
.bcard__remove:hover { color: var(--status-urgent-fg); }
.bcard__reading { display: flex; align-items: center; gap: 10px; color: var(--ask-ai-ink); font-size: 14px; font-weight: 600; padding: 20px 0; }
.bcard__name { font-size: 15px; font-weight: 700; font-family: var(--font-head); }
.bcard__added { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; color: var(--status-valid-fg); margin-top: 4px; }
.bcard[data-status="done"] { opacity: .75; align-items: center; }
.bcard[data-status="done"]:hover { opacity: 1; }
.bcard__name-link { color: inherit; }
.bcard__name-link:hover { text-decoration: underline; }
.bcard__open { flex: none; }

/* Upload-Fortschritt (Analyse & Speichern laden beide die Datei hoch) */
.bcard__progress { height: 4px; border-radius: 999px; background: var(--color-line); margin-top: 10px; overflow: hidden; }
.bcard__progress-bar { display: block; height: 100%; width: 0; border-radius: 999px; background: var(--brand-green); transition: width .2s ease; }

/* Duplikat-Hinweis — Warnung, kein Fehler: speichern bleibt erlaubt */
.bcard__dup { font-size: 12.5px; font-weight: 600; color: var(--status-review-fg); margin-top: 8px; }
.bcard__dup a { color: inherit; text-decoration: underline; }

/* Confidence-Badge */
.bconf { display: inline-flex; align-items: center; justify-content: center; height: 24px; padding: 0 10px; border-radius: 7px; font-size: 12px; font-weight: 700; }
.bconf--high { background: var(--status-valid-bg); color: var(--status-valid-fg); }
.bconf--med  { background: var(--status-review-bg); color: var(--status-review-fg); }
.bconf--low  { background: var(--status-urgent-bg); color: var(--status-urgent-fg); }

/* Erledigt-Leiste */
.batch__done { display: flex; align-items: center; gap: 12px; padding: 16px 18px; border-radius: 14px; background: var(--status-valid-bg); color: var(--color-ink); font-weight: 600; }
.batch__done-icon { display: inline-flex; color: var(--status-valid-fg); }
.batch__done .btn { margin-left: auto; }

/* Rechtes „AI review"-Panel — passt IMMER in den Viewport: Felder scrollen
   intern, „Confirm & save" bleibt unten sichtbar (nie unterm Fold). */
.batch__panel { position: sticky; top: 18px; max-height: calc(100vh - 36px); padding: 20px; border: 1px solid var(--color-ai-border); border-radius: 16px; background: var(--color-surface); box-shadow: var(--shadow-2); display: flex; flex-direction: column; gap: 12px; }
/* Hellblau strahlendes AI-Banner (AI = Blau): gleicher Glow wie die Suchleiste. */
.batch__ai-banner {
  display: flex; align-items: center; gap: 9px;
  padding: 12px 15px; border-radius: 13px;
  background: linear-gradient(180deg, var(--color-ai-tile), var(--color-ai-soft));
  border: 1px solid var(--color-ai-border); color: var(--color-ai);
  font-family: var(--font-head); font-size: 15.5px; font-weight: 700; letter-spacing: -.01em;
  box-shadow: var(--ai-glow);
}
.batch__ai-banner__icon { display: inline-flex; flex: none; }

.batch__panel-head { display: flex; align-items: center; gap: 12px; }
.batch__panel-headtext { min-width: 0; }
.batch__panel-thumb { width: 48px; height: 48px; flex: none; border-radius: 12px; overflow: hidden; display: inline-flex; }
.batch__panel-thumb:empty { display: none; }
.batch__panel-thumb .bcard__thumb-img, .batch__panel-thumb .bcard__thumb-icon { width: 100%; height: 100%; }
.batch__panel-thumb img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.batch__panel-title { font-family: var(--font-head); font-size: 18px; font-weight: 700; color: var(--color-ink); margin: 0; }
.batch__panel-sub { font-size: 13px; color: var(--color-muted); margin: 2px 0 0; }
.batch__type { font-size: 15px; font-weight: 600; color: var(--color-ink); }
.batch__panel-fields { display: flex; flex-direction: column; gap: 12px; overflow-y: auto; min-height: 0; margin: 0 -4px; padding: 0 4px; }
.batch__panel-error { font-size: 13px; font-weight: 600; color: var(--status-urgent-fg); }
.batch__panel-error[hidden] { display: none; }
.batch__panel-actions { display: flex; flex-direction: column; gap: 8px; margin-top: 6px; }
.batch__panel-actions .btn { width: 100%; }

/* „+ New category" — Add-Affordance neben dem Kategorie-Label (ink-navy, nicht grün) */
.field__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.field__addbtn {
  display: inline-flex; align-items: center; gap: 4px; padding: 0;
  border: none; background: transparent; cursor: pointer;
  font-size: 12.5px; font-weight: 600; color: var(--color-muted); transition: color .15s;
}
.field__addbtn:hover { color: var(--color-selected); }

/* Inline-Eingabe für die neue Kategorie */
.cat-inline { display: flex; gap: 8px; margin-top: 8px; }
.cat-inline[hidden] { display: none; }
.cat-inline__input { flex: 1; min-width: 0; }
.cat-inline__error { display: block; margin-top: 6px; font-size: 12.5px; color: var(--status-urgent-fg); }
.cat-inline__error[hidden] { display: none; }

@media (max-width: 1080px) {
  .batch { grid-template-columns: 1fr; }
  .batch__panel { position: static; }
}
@media (max-width: 640px) {
  .bcard { flex-wrap: wrap; }
  .bcard__side { width: 100%; }
  .bcard__grid { grid-template-columns: 1fr; }
}
