<div class="parcelamentos-kpis" *ngIf="cards?.length">
  <div class="kpi-card" *ngFor="let k of cards">
    <span class="kpi-label">{{ k?.label }}</span>
    <span
      class="kpi-value"
      [class.tone-brand]="k?.tone === 'brand'"
      [class.tone-success]="k?.tone === 'success'"
      [class.tone-danger]="k?.tone === 'danger'"
      [class.tone-info]="k?.tone === 'info'">
      {{ k?.value }}
    </span>
    <span class="kpi-hint" *ngIf="k?.hint">{{ k?.hint }}</span>
  </div>
</div>
