<div class="bg-primary-gradient vh-100 disable-user-select">
  <div class="d-flex justify-content-center">
    <div class="row m-5 text-white text-center">

      <div class="col-12 p-0">
        <p class="h1 m-0">Su pedido ya esta listo.</p>
        <p class="h2 m-0">Nº de Pedido</p>
      </div>

      <div
        *ngIf="pedidosRecientes.length"
        class="col-12 p-2">
        <div class="border rounded shadow h-big">
          <div class="font-weight-bold heartbeat m-0 h-100">
            {{rellenar(pedidosRecientes[0].id, 2)}}
          </div>
        </div>
      </div>

      <div
        *ngFor="let pedido of pedidosRecientes; let i = index"
        [hidden]="i == 0 || i > 8"
        class="col-3 p-2">
        <p class="font-weight-bold display-1 m-0 py-1 border rounded shadow">
          {{rellenar(pedido.id, 2)}}
        </p>
      </div>

    </div>
  </div>
</div>