@layer components {
  .report-debts__body { display: flex; flex-direction: column; gap: var(--space-md); }

  .report-debts__entity { display: flex; flex-direction: column; gap: var(--space-sm); padding-top: var(--space-md); border-top: 2px dashed var(--xf-ink); }
  .report-debts__entity:first-child { padding-top: 0; border-top: 0; }
  .report-debts__entity-name { font-family: var(--xf-font-body); font-size: 1.0625rem; font-weight: 600; }

  .report-debts__records { display: flex; flex-direction: column; gap: var(--space-sm); }
  .report-debts__record { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-xs) var(--space-md); }
  .report-debts__source { flex: 1 1 10rem; font-weight: 600; }
  .report-debts__amount { font-weight: 600; font-variant-numeric: tabular-nums; }
  .report-debts__date { color: var(--xf-ink-soft); font-variant-numeric: tabular-nums; }

  .report-debts__in-progress,
  .report-debts__origin,
  .report-debts__no-entity { color: var(--xf-ink-soft); font-size: var(--text-sm); }

  .report-debts__empty { display: flex; align-items: center; gap: var(--space-sm); }
  .report-debts__empty .icon { flex: none; color: var(--xf-green); }

  .report-debts__failed { align-self: flex-start; padding: 0.375rem 0.75rem; border: var(--xf-border-thin); border-radius: var(--xf-radius-sm); background: var(--xf-red-soft); font-size: var(--text-sm); font-weight: 600; }
}