{% from "components/big-number.html" import big_number_with_status %}

<div class="govuk-grid-row bottom-gutter">
  <div class="govuk-grid-column-one-third">
    {{ big_number_with_status(
      global_stats.email.delivered + global_stats.email.failed,
      global_stats.email.delivered|message_count_label('email'),
      global_stats.email.failed,
      global_stats.email.failure_rate,
      global_stats.email.failure_rate|float > 3,
      smaller=True
    ) }}
  </div>
  <div class="govuk-grid-column-one-third">
    {{ big_number_with_status(
      global_stats.sms.delivered + global_stats.sms.failed,
      global_stats.sms.delivered|message_count_label('sms'),
      global_stats.sms.failed,
      global_stats.sms.failure_rate,
      global_stats.sms.failure_rate|float > 3,
      smaller=True
    ) }}
  </div>
  <div class="govuk-grid-column-one-third">
    {{ big_number_with_status(
      global_stats.letter.requested,
      global_stats.letter.requested|message_count_label('letter'),
      global_stats.letter.failed,
      global_stats.letter.failure_rate,
      global_stats.letter.failure_rate|float > 3,
      smaller=True
    ) }}
  </div>
</div>