/* Workspace step 4 «Wiederherstellen» (executor RE) — the adopted #tab-remap in
   the step-2 language: 64 px head, paper cards, 68 px footer. Builds on
   ws-doc.css (.ws-head .ws-seg .ws-paper-label .ws-om .ws-chip .ws-foot).
   Colours only via tokens.css. Spec: design handoff README §1b. */

.ws-restore.ws-re-on { padding: 0; overflow: hidden; }
.ws .ws-re { flex: 1; min-height: 0; display: flex; flex-direction: column; font-family: var(--lysi-font-sans); color: var(--lysi-ink); }
.ws-re .ws-seg[hidden] { display: none; }

/* legacy chrome replaced by head + footer */
.ws-re #remapTableMode, .ws-re .map-file-bar, .ws-re #remapSummary,
.ws-re #lblRemapAnon, .ws-re #lblRestored, .ws-re #remapTableZone > .split-header { display: none; }

#remapTextZone, #remapTableZone {
  display: flex; flex-direction: column; flex: 1; min-height: 0; overflow: hidden; padding: 0 var(--lysi-s-28);
}

/* ── two paper cards (1fr 1fr, gap 12): header cell = card top, col = card body ── */
/* Ansicht + split (restore.js): --re-split = left column in % (default 50) */
.ws-re .split-view {
  position: relative;
  display: grid; grid-template-columns: minmax(0, calc(var(--re-split, 50) * 1%)) minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr);
  column-gap: var(--lysi-s-12); flex: 1; min-height: 0; overflow: hidden; background: none;
}
.ws-re .split-scroll-outer { display: contents; }
.ws-re .split-header {
  grid-row: 1; height: auto; display: flex; align-items: baseline; justify-content: flex-start;
  padding: var(--lysi-s-28) var(--lysi-s-32) var(--lysi-s-10); background: var(--lysi-paper);
  border: 1px solid var(--lysi-paper-border); border-bottom: 0; border-radius: var(--lysi-r-10) var(--lysi-r-10) 0 0;
}
.ws-re .split-header:first-child { border-right: 1px solid var(--lysi-paper-border); }
.ws-re .split-header label { font-size: var(--lysi-fs-11-5); letter-spacing: .06em; font-weight: 600; color: var(--lysi-paper-ink3); }
.ws-re .split-col {
  grid-row: 2; min-height: 0; overflow-y: auto; display: flex; flex-direction: column;
  background: var(--lysi-paper); border: 1px solid var(--lysi-paper-border); border-top: 0;
  border-radius: 0 0 var(--lysi-r-10) var(--lysi-r-10); padding: 0 var(--lysi-s-32) var(--lysi-s-28);
}
.ws-re .split-col + .split-col { border-left: 1px solid var(--lysi-paper-border); }
.ws-re .ws-paper-label { margin-bottom: 0; }
.ws-re-label-in { color: var(--lysi-accent-text); }
.ws-re-label-out { color: var(--lysi-paper-ink3); }

/* the reply grows with its content (popup.css caps textareas at 200 px) → the card
   column scrolls it exactly like the restored card on the right; no inner clipping */
.ws-re #remapInput {
  flex: 1 0 auto; height: auto; min-height: 0; max-height: none; field-sizing: content; overflow-y: auto;
  padding: 0; border: 0; background: transparent; resize: none; outline: none;
  font: var(--lysi-fs-15)/29px var(--lysi-font-sans); color: var(--lysi-paper-ink);
}
.ws-re #remapInput::placeholder, .ws-re .table-paste-input::placeholder { color: var(--lysi-paper-ink3); font-family: var(--lysi-font-sans); }
.ws-re #remapInput.border-danger::placeholder { color: var(--lysi-warn-ink); }
.ws-re #remapResult {
  padding: 0; font: var(--lysi-fs-15)/29px var(--lysi-font-sans); color: var(--lysi-paper-ink);
  white-space: pre-wrap; word-break: break-word;
}
.ws-re #remapResult .empty { color: var(--lysi-paper-ink3); font-size: var(--lysi-fs-13-5); }
.ws-re-out { white-space: pre-wrap; }
.ws-re-out .ws-chip { padding: 1px var(--lysi-s-6); }
.ws-re-out .ws-re-unk { background: var(--lysi-warn-bg); color: var(--lysi-warn-ink); box-shadow: inset 0 0 0 1px var(--lysi-warn-border); }

/* ── table mode: paste + drop as paper cards, restored tables as the same cards ── */
.ws-re .table-input-zone {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--lysi-s-12);
  margin: 0; flex: 1; min-height: 0;
}
.ws-re .table-input-card {
  align-items: stretch; gap: var(--lysi-s-10); padding: var(--lysi-s-28) var(--lysi-s-32);
  background: var(--lysi-paper); border: 1px solid var(--lysi-paper-border); border-radius: var(--lysi-r-10);
  color: var(--lysi-paper-ink3);
}
.ws-re .table-input-card svg { display: none; }
.ws-re .table-input-label {
  margin: 0; text-align: left; font-size: var(--lysi-fs-11-5); letter-spacing: .06em;
  text-transform: uppercase; font-weight: 600; color: var(--lysi-paper-ink3);
}
.ws-re .table-input-card:first-child .table-input-label { color: var(--lysi-accent-text); }
.ws-re .table-paste-input {
  flex: 1; min-height: 72px; max-height: none; height: auto; resize: none;
  border: 0; border-radius: 0; background: transparent; padding: 0; outline: none;
  font: var(--lysi-fs-13-5)/25px var(--lysi-font-mono); color: var(--lysi-paper-ink);
}
.ws-re .table-drop-zone { justify-content: flex-start; }
.ws-re .table-drop-zone::after {
  content: '⤓'; flex: 1; display: flex; align-items: center; justify-content: center; font-size: 28px;
  color: var(--lysi-paper-ink3); border: 1.5px dashed var(--lysi-ghost); border-radius: var(--lysi-r-8);
}
.ws-re .table-drop-zone:hover, .ws-re .table-drop-zone.drag-over { background: var(--lysi-paper); border-color: var(--lysi-accent); }
.ws-re .table-view { font: var(--lysi-fs-13)/1.5 var(--lysi-font-sans); }
.ws-re .table-view th {
  background: var(--lysi-paper); color: var(--lysi-paper-ink3); border-bottom: 1px solid var(--lysi-paper-border);
  font-size: var(--lysi-fs-11); letter-spacing: .06em;
}
.ws-re .table-view td { color: var(--lysi-paper-ink); border-bottom: 1px solid var(--lysi-paper-border); }
.ws-re .table-view tr:hover td { background: var(--lysi-row-on); }
.ws-re #remapTableSplitView .split-col { padding-top: var(--lysi-s-8); }

/* ── footer (68 px): ghost left, actions right ── */
.ws-re-foot { font-size: var(--lysi-fs-13-5); }
.ws-re-left { display: flex; align-items: center; gap: var(--lysi-s-12); min-width: 0; }
.ws-re-act { margin-left: auto; display: flex; align-items: center; gap: var(--lysi-s-10); }
.ws-re[data-mode="text"] .ws-re-act-table, .ws-re[data-mode="table"] .ws-re-act-text,
.ws-re[data-mode="text"] #remapTableMappingBadge, .ws-re[data-mode="table"] #mappingBadge { display: none; }

.ws-re-foot #loadMappingFileBtn, .ws-re-ghost, .ws-re-foot .table-export-btn, .ws-re-foot #remapBtn:not(.is-primary) {
  background: transparent; color: var(--lysi-ink2); border: 1px solid var(--lysi-ghost); box-shadow: none;
  border-radius: var(--lysi-r-8); padding: 9px var(--lysi-s-16); font: 500 var(--lysi-fs-13-5) var(--lysi-font-sans);
  cursor: pointer; white-space: nowrap; margin: 0; width: auto;
}
.ws-re-foot #loadMappingFileBtn { font-size: 0; }   /* drops the legacy 📁 glyph; the span keeps its size */
.ws-re-foot #loadMappingFileBtn span { font-size: var(--lysi-fs-13-5); }
.ws-re-foot #loadMappingFileBtn:hover, .ws-re-ghost:hover:not(:disabled), .ws-re-foot .table-export-btn:hover { background: var(--lysi-seg); color: var(--lysi-ink); }
.ws-re-ghost:disabled { opacity: .5; cursor: default; }

.ws-re-foot #remapBtn.is-primary, .ws-re-ghost.is-primary, .ws-re-foot #remapTableBtn {
  display: flex; align-items: center; gap: var(--lysi-s-10); width: auto; margin: 0; box-shadow: none;
  background: var(--lysi-accent); color: var(--lysi-on-accent); border: 0; border-radius: var(--lysi-r-8);
  padding: var(--lysi-s-10) var(--lysi-s-18); font: 600 var(--lysi-fs-14) var(--lysi-font-sans); white-space: nowrap;
}
.ws-re-foot #remapBtn:not(.is-primary) .ws-foot-kbd { display: none; }
.ws-re-foot #remapTableBtn:disabled { background: var(--lysi-disabled); color: var(--lysi-disabled-ink); cursor: default; }

.ws-re-foot .table-export-row { display: flex; gap: var(--lysi-s-10); }
.ws-re-foot .table-export-btn {
  /* table.css forces compact export sizes with !important; the footer ghost size must win */
  font-size: var(--lysi-fs-13-5) !important; padding: 9px var(--lysi-s-16) !important;
}
.ws-re-foot .table-new-file-link { padding: 0; font-size: var(--lysi-fs-13-5); color: var(--lysi-ink3); white-space: nowrap; }
.ws-re-foot .table-export-btn svg { display: none; }   /* text-mode footer buttons carry no icons */
.ws-re-foot .table-new-file-link:hover { color: var(--lysi-ink); }

.ws-re-foot .mapping-badge { border: 0; padding: 0; font-size: var(--lysi-fs-13); color: var(--lysi-ink3); }
.ws-re-foot .mapping-badge .text-success, .ws-re-foot .mapping-badge .text-muted-label { color: var(--lysi-ink3); font-size: var(--lysi-fs-13); }
/* legacy «Kein Mapping» is not refreshed after a scan (rail shows the live count) → show only the ✓ state */
.ws-re-foot .mapping-badge .text-muted-label { display: none; }
.ws-re-foot .mapping-badge .btn-clear-small { color: var(--lysi-ink3); background: transparent; border: 0; }
.ws-re-hint { display: flex; align-items: center; gap: var(--lysi-s-10); font-size: var(--lysi-fs-13); white-space: nowrap; }
.ws-re-done { color: var(--lysi-ok-ink); font-weight: 500; }
.ws-re-warn {
  color: var(--lysi-warn-ink); background: var(--lysi-warn-bg); font-weight: 500;
  padding: var(--lysi-s-4) var(--lysi-s-10); border-radius: var(--lysi-r-6);
}
.ws-re #remapTableSplitView .split-header:first-child label { color: var(--lysi-accent-text); }
.ws-re-foot #remapTableCopyBtn:not(:disabled), .ws-re-foot #remapTableCopyBtn:not(:disabled) span { background: var(--lysi-accent); color: var(--lysi-on-accent); border: 0; font-weight: 600; }
/* table mode like text mode: «Wiederherstellen» first, «Kopieren» visible but disabled until there is output */
.ws-re-act-table #remapTableBtn { order: -1; }
.ws-re-foot #remapTableExportRow.is-idle > :not(#remapTableCopyBtn) { display: none; }
.ws-re-foot #remapTableCopyBtn:disabled { opacity: .5; cursor: default; }
.ws-re .table-view .ws-re-out { font: inherit; }

/* Ansicht: one side only → one column; the other header/column hidden */
.ws-re[data-re-view="in"] .split-view, .ws-re[data-re-view="out"] .split-view { grid-template-columns: minmax(0, 1fr); }
.ws-re[data-re-view="in"] .split-view > .split-header ~ .split-header,
.ws-re[data-re-view="in"] .split-scroll-outer > .split-col + .split-col,
.ws-re[data-re-view="out"] .split-view > .split-header:first-child,
.ws-re[data-re-view="out"] .split-scroll-outer > .split-col:first-child { display: none; }
.ws-re[data-re-view="out"] .split-scroll-outer > .split-col + .split-col { border-left: 0; }
.ws-re-views { margin-left: var(--lysi-s-8); }
/* draggable split between the two cards (Nebeneinander only) */
.ws-re-grip {
  position: absolute; top: 0; bottom: 0; left: calc(var(--re-split, 50) * 1% - 3px); width: 6px; z-index: 4;
  cursor: col-resize; touch-action: none;
}
.ws-re-grip:hover, .ws-re.is-resizing .ws-re-grip { background: var(--lysi-accent); opacity: .35; }
.ws-re[data-re-view="in"] .ws-re-grip, .ws-re[data-re-view="out"] .ws-re-grip { display: none; }
.ws-re.is-resizing { user-select: none; cursor: col-resize; }
