.match-type {
  display: inline-flex;
  align-items: center;

  margin-left: 10px;

  padding: 4px 12px;
  border-radius: 999px;

  font-size: 12px;
  font-weight: 600;

  white-space: nowrap; 
}

.match-type.ranked {
  background: linear-gradient(90deg, #f59e0b, #b45309);
  color: #fff;
}

.match-type.turbo {
  background: linear-gradient(90deg, #22c55e, #166534);
  color: #fff;
}

.match-type.all-pick {
  background: linear-gradient(90deg, #3b82f6, #1e3a8a);
  color: #fff;
}

.match-type.captains-mode {
  background: linear-gradient(90deg, #8b5cf6, #4c1d95);
  color: #fff;
}

.match-type.random-draft {
  background: linear-gradient(90deg, #ec4899, #831843);
  color: #fff;
}

.match-type.all-draft {
  background: linear-gradient(90deg, #ff928e, #ff4c46);
  color: #fff;
}

.match-type.default {
  background: #374151;
  color: #d1d5db;
}