.dashboard-content {
  display: grid;
  gap: 1rem;
}

@media (min-width: 992px) {
    .dashboard-content {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 991px) and (min-width: 576px) {
    .dashboard-content {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 575px) {
    .dashboard-content {
        grid-template-columns: 1fr;
    }
}

.dashboard-content .counter {
  border: 1px solid var(--border-color);
  padding: 1rem;
  border-radius: 6px;
}

.dashboard-content .counter h3 {
  color: gray;
  margin: auto;
}

.dashboard-content .counter .value {
  font-size: 2rem;
  font-weight: 600;
  text-align: right;
}

.dashboard-content a.counter {
  color: var(--text-color);
  text-decoration: none;
}