<div class="row">
  <div class="page-wrapper chiller-theme toggled">
    <nav id="sidebar" class="sidebar-wrapper">
      <menu-admin name={{name}} dock={{dock}}></menu-admin>
      <link-exit></link-exit>
    </nav>

    <main class="page-content" ng-init="inicio()">
      <div class="container justify-content-md-center">
        <h2>Painel Principal</h2>

        <p ng-show="mensagem.length" class="alert alert-info">{{mensagem}}</p>

        <div class="row form-login">
          <div class="col-md-3">
            <div class="card border-dark mb-3" style="width: 12rem;">
              <a href="#/orders" class="card-link">
                <div class="card-header text-white bg-dark">Total de Pedidos: {{dash.orders}}</div>
              </a>
            </div>
          </div>

          <div class="col-md-3">
            <div class="card border-success mb-3" style="width: 12rem;">
              <a href="#/invoiced" class="card-link">
                <div class="card-header text-white bg-success">Faturados: {{dash.invoiced}}</div>
              </a>
            </div>
          </div>

          <div class="col-md-3">
            <div class="card border-primary mb-3" style="width: 12rem;">
              <a href="#/ready" class="card-link">
                <div class="card-header text-white bg-primary">Prontos para faturar: {{dash.ready}}</div>
              </a>
            </div>
          </div>

          <div class="col-md-3">
            <div class="card border-danger mb-3" style="width: 12rem;">
              <a href="#/canceled" class="card-link">
                <div class="card-header text-white bg-danger">Cancelados: {{dash.canceled}}</div>
              </a>
            </div>
          </div>

        </div>

      </div>
    </main>

  </div>

</div>
