.trx-card {
  border: 2px solid transparent;
  border-radius: 10px;
  background: #fff;
  transition: all 0.3s ease;
  cursor: pointer;
}

.trx-card:hover {
  background: 
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(to right, rgb(92, 212, 205), rgb(44, 165, 159)) border-box;
  box-shadow: 0 6px 14px rgba(0,0,0,0.15);
  transform: translateY(-3px);
}

.trx-icon {
  font-size: 28px;
  color: rgb(44, 165, 159);
}

.trx-card:hover .trx-icon {
  color: rgb(92, 212, 205);
}

.trx-amount {
  font-size: 24px;
  font-weight: bold;
}

.trx-label {
  font-size: 14px;
  color: #777;
}

.revenue-card {
  border: 2px solid transparent;
  border-radius: 12px;
  background: #fff;
  transition: all 0.25s ease;
  cursor: pointer;
}

.revenue-card:hover {
  background: 
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(135deg, rgb(92, 212, 205), rgb(44, 165, 159)) border-box;
  box-shadow: 0 8px 20px rgba(0,0,0,0.12);
  transform: translateY(-4px);
}

.revenue-card:active {
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

/* Optional: only affect this card’s title */
.revenue-card:hover .card-title h5 {
  color: rgb(44, 165, 159);
  transition: color 0.25s ease;
}


.growth-card {
  border: 2px solid transparent;
  border-radius: 12px;
  background: #fff;
  transition: all 0.25s ease;
  cursor: pointer;
}

.growth-card:hover {
  background: 
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(135deg, rgb(92, 212, 205), rgb(44, 165, 159)) border-box;
  box-shadow: 0 8px 20px rgba(0,0,0,0.12);
  transform: translateY(-4px);
}

.growth-card:active {
  transform: translateY(-1px);
}

/* KPI subtle interaction */
.growth-card:hover h5 {
  color: rgb(44, 165, 159);
}   

.badge-positive {
  background-color: rgba(40, 167, 69, 0.1);
  color: #28a745;
}

.badge-negative {
  background-color: rgba(220, 53, 69, 0.1);
  color: #dc3545;
}


.student-card {
  border-radius: 12px;
  transition: all 0.25s ease;
}

.student-card:hover {
  box-shadow: 0 8px 20px rgba(0,0,0,0.10);
  transform: translateY(-2px);
}

/* cleaner list feel */
.student-list .border-bottom:last-child {
  border-bottom: none !important;
}

/* avatar soft style */
.student-list .avatar-initial {
  width: 36px;
  height: 36px;
  font-size: 14px;
}

.student-scroll {
  max-height: 320px;   /* adjust if you want more/less space */
  overflow-y: auto;
  padding-right: 6px;
}

/* nicer scrollbar (optional but recommended) */
.student-scroll::-webkit-scrollbar {
  width: 6px;
}

.student-scroll::-webkit-scrollbar-thumb {
  background: rgba(0,0,0,0.15);
  border-radius: 10px;
}

.student-scroll::-webkit-scrollbar-track {
  background: transparent;
}

/* cleaner list spacing */
.student-item {
  padding: 6px 0;
  border-bottom: 1px solid rgba(0,0,0,0.05);
}

.student-item:last-child {
  border-bottom: none;
}

.student-scroll {
  mask-image: linear-gradient(to bottom, black 85%, transparent 100%);
}

.student-scroll {
  max-height: 260px;
  overflow-y: auto;
  padding-right: 6px;
}

/* Top 5 highlight */
.leaderboard-item.top {
  background: linear-gradient(135deg, rgba(44,165,159,0.08), rgba(44,165,159,0.02));
  border-left: 3px solid #2ca59f;
  padding: 10px;
  border-radius: 8px;
  margin-bottom: 8px;
}

/* Normal items */
.leaderboard-item {
  padding: 10px;
  border-bottom: 1px solid rgba(0,0,0,0.05);
}

/* Rank badge */
.rank {
  font-size: 12px;
  font-weight: 700;
  color: #2ca59f;
  background: rgba(44,165,159,0.1);
  padding: 2px 6px;
  border-radius: 6px;
}