/* Step 6 (report): the step body and the preview pane that replaces the family tree.
   The report document itself is styled in report-doc.css (it lives inside an iframe). */

.report-step__intro,
.report-step__ai,
.report-step__hint,
.report-step__done {
  margin: 0 0 0.625rem;
  font-size: 0.875rem;
  line-height: 1.5;
}

.report-step__ai,
.report-step__hint {
  color: var(--color-text-muted);
}

.report-step__ai[data-state="off"] {
  padding: 0.5rem 0.625rem;
  border: 1px dashed var(--color-border);
  border-radius: var(--radius-sm);
}

/* ---------- Tree column: tree view <-> report view ---------- */

.case-form-workspace__tree > .report-preview {
  display: none;
}

.case-form-workspace__tree[data-view="report"] > .family-tree__title,
.case-form-workspace__tree[data-view="report"] > .family-tree__canvas {
  display: none;
}

.case-form-workspace__tree[data-view="report"] > .report-preview {
  display: flex;
}

/* ---------- Preview pane ---------- */

.report-preview {
  flex: 1 1 auto;
  flex-direction: column;
  gap: 0.75rem;
  min-block-size: 0;
}

.report-preview__toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.625rem;
}

.report-preview__title {
  margin: 0;
  margin-inline-end: auto;
  font-size: 0.9375rem;
  font-weight: 700;
}

.report-preview__stale {
  padding: 0.25rem 0.5rem;
  border: 1px solid var(--color-danger);
  border-radius: var(--radius-sm);
  color: var(--color-danger);
  font-size: 0.8125rem;
}

.report-preview__frame {
  flex: 1 1 auto;
  inline-size: 100%;
  min-block-size: 28rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface);
}