.app-dashboard-qualification-row {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
  gap: 12px;
}

.app-dashboard-qualification-card {
  min-width: 0;
}

.app-dashboard-qualification-metrics {
  display: grid;
  gap: 8px;
}

.app-dashboard-qualification-metrics-volume {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.app-dashboard-qualification-metrics-service {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.app-dashboard-qualification-metric {
  min-width: 0;
  min-height: 74px;
  padding: 12px 14px;
  border: 1px solid hsl(var(--border));
  border-left: 3px solid hsl(var(--muted-foreground) / 0.55);
  border-radius: 12px;
  background: hsl(var(--muted) / 0.2);
}

.app-dashboard-qualification-metric[data-kind="high"],
.app-dashboard-qualification-metric[data-kind="offered"] {
  border-left-color: hsl(var(--primary));
}

.app-dashboard-qualification-label {
  color: hsl(var(--muted-foreground));
  font-size: 12px;
  line-height: 16px;
}

.app-dashboard-qualification-value {
  margin-top: 6px;
  color: hsl(var(--foreground));
  font-size: 24px;
  font-weight: 650;
  line-height: 28px;
  font-variant-numeric: tabular-nums;
}

@media (max-width: 900px) {
  .app-dashboard-qualification-row {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 540px) {
  .app-dashboard-qualification-metric {
    padding: 10px;
  }

  .app-dashboard-qualification-label {
    font-size: 11px;
  }
}