/* ── KPI Cards - Unified metric card component ─────────────────── */

.kpi-card {
  transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
  border: 1px solid #e9ecef;
}

.kpi-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  border-color: #ddd;
}

.kpi-card-clickable {
  cursor: pointer;
}

a:hover .kpi-card-clickable {
  transform: translateY(-3px);
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.13);
  border-color: #bbb;
}

/* ── Mobile optimizations ───────────────────────────────────────── */
@media (max-width: 767.98px) {
  .kpi-card .card-body {
    padding: 0.75rem;
  }

  .kpi-card h3 {
    font-size: 1.25rem;
  }

  .kpi-card .fw-medium {
    font-size: 0.75rem;
  }

  .kpi-card small {
    font-size: 0.7rem;
  }
}