/*
 * Ranking Section Styles
 * Desktop: Table | Mobile: Cards
 */

/* Section Header */
.digi-section__header {
  margin-bottom: var(--space-5);
}

.digi-section__title {
  font-size: var(--fs-2xl);
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
}

/* Ranking Wrapper */
.digi-ranking__wrapper {
  position: relative;
}

/* Desktop Table */
.digi-ranking__table-wrapper {
  border-radius: var(--radius-card);
  background: var(--digi-card);
  box-shadow: var(--shadow-card);
}

.digi-ranking__team {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.digi-ranking__avatar {
  width: 32px;
  height: 32px;
  border-radius: var(--radius-full);
  background: var(--digi-primary-light);
  color: var(--digi-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--fs-xs);
  font-weight: var(--font-weight-title);
  flex-shrink: 0;
}

.digi-ranking__pts {
  font-weight: var(--font-weight-heading);
  color: var(--digi-primary);
  font-size: var(--fs-lg);
}

.digi-ranking__top-1 .rank { color: #FFD700; }
.digi-ranking__top-2 .rank { color: #C0C0C0; }
.digi-ranking__top-3 .rank { color: #CD7F32; }

/* Mobile Cards - Hidden on Desktop */
.digi-ranking__cards {
  display: none;
}

.digi-ranking__card {
  padding: var(--space-3);
}

.digi-ranking__card-header {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin-bottom: var(--space-3);
}

.digi-ranking__card-rank {
  width: 36px;
  height: 36px;
  border-radius: var(--radius-full);
  background: var(--digi-background);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: var(--font-weight-heading);
  font-size: var(--fs-lg);
  flex-shrink: 0;
}

.digi-ranking__card-rank.digi-ranking__top-1 { background: #FFD700; color: #fff; }
.digi-ranking__card-rank.digi-ranking__top-2 { background: #C0C0C0; color: #fff; }
.digi-ranking__card-rank.digi-ranking__top-3 { background: #CD7F32; color: #fff; }

.digi-ranking__card-team {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-weight: var(--font-weight-title);
  font-size: var(--fs-lg);
}

.digi-ranking__card-stats {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--space-2);
  text-align: center;
}

.digi-ranking__stat {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  font-size: var(--fs-xs);
  color: var(--digi-muted);
}

.digi-ranking__stat span {
  font-size: var(--fs-lg);
  font-weight: var(--font-weight-title);
  color: var(--digi-text);
}

.digi-ranking__stat--pts span {
  color: var(--digi-primary);
}

@media (max-width: 767px) {
  .digi-ranking__table-wrapper { display: none; }
  .digi-ranking__cards { display: grid; gap: var(--space-3); }
}

@media (min-width: 768px) and (max-width: 1199px) {
  .digi-ranking__table-wrapper { display: none; }
  .digi-ranking__cards { display: grid; gap: var(--space-3); grid-template-columns: repeat(2, 1fr); }
}