.counter {
  justify-content: flex-start !important;

  & h3 {
    border-bottom: 1px solid var(--gray-300);
    font-size: 1.125rem;
    font-weight: bold;
    padding: 1rem;
  }

  & .capacity-progress {
    flex-grow: 0;
    padding: 0.5rem 1rem;
  }

  & .capacity-progress {
    & .allocated {
      background-color: var(--yellow);
    }

    & .issued {
      background-color: var(--green);
    }

    & .key.total {
      background-color: var(--gray-200);
    }
  }

  .grow {
    flex-grow: 1;
  }

  .counter-percentage {
    font-size: 2rem;
    padding: 0.25rem 1rem !important;
    justify-content: flex-end !important;
  }

  .allocations {
    text-align: center;
  }
}

.dashboard {
  & data.counter.list-links li.without-link {
    padding: 0.25rem 1rem;
  }

  & data.counter > div {
    flex: 0;
  }
}