/* =========================
   GAME EVENTS PAGE STYLES
   ========================= */
.events-nav {
  margin-bottom: var(--space-8);
}
.events-nav-list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  padding: 0;
  list-style: none;
  margin-bottom: 0;
  justify-content: flex-start;
}
.events-nav-list li {
  margin: 0;
}
.events-nav-list a {
  display: inline-block;
  padding: 8px 16px;
  background: var(--color-neutral-100);
  border-radius: var(--radius-md);
  color: var(--color-primary);
  font-weight: 600;
  text-decoration: none;
  transition: background var(--transition-fast), color var(--transition-fast);
}
.events-nav-list a:hover, .events-nav-list a:focus-visible {
  background: var(--color-primary);
  color: #fff;
}

.events-schedule {
  width: 100%;
  border-radius: var(--radius-md);
  overflow: hidden;
  font-size: var(--font-size-sm);
  margin-bottom: var(--space-2);
  background: var(--color-neutral-50);
}
.events-schedule th, .events-schedule td {
  padding: var(--space-2);
  text-align: left;
  border-bottom: 1px solid var(--color-neutral-200);
}
.events-schedule th {
  background: var(--color-neutral-100);
  color: var(--color-primary);
  font-weight: 700;
}
.events-schedule tr:last-child td {
  border-bottom: none;
}

.leaderboard-wrapper {
  padding: 0;
}
.leaderboard-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding-left: 0;
  margin: 0 0 var(--space-2) 0;
  counter-reset: lb;
}
.leaderboard-list li {
  display: flex;
  align-items: center;
  background: var(--color-neutral-100);
  border-radius: var(--radius-sm);
  padding: var(--space-2) var(--space-3);
  font-size: var(--font-size-md);
  font-weight: 500;
  gap: var(--space-2);
}
.leaderboard-score {
  margin-left: var(--space-2);
  color: var(--color-primary);
  font-weight: bold;
}
.badge {
  margin-left: var(--space-2);
  font-size: 1.25em;
  vertical-align: middle;
}
.badge--gold { color: #e0b300; }
.badge--silver { color: #bcbcbc; }
.badge--bronze { color: #b87333; }
.leaderboard-info {
  font-size: var(--font-size-xs);
  color: var(--color-neutral-500);
  margin-top: 8px;
}

.rewards-list {
  list-style: none;
  padding-left: 0;
  margin-bottom: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
.rewards-list li {
  background: var(--color-neutral-100);
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-sm);
}

.rules-list {
  padding-left: 1.25em;
  margin-bottom: 0;
}
.rules-list li {
  margin-bottom: var(--space-2);
}

.special-events-list {
  list-style: none;
  padding-left: 0;
  margin-bottom: 0;
}
.special-events-list li {
  background: var(--color-neutral-50);
  margin-bottom: var(--space-3);
  padding: var(--space-3);
  border-left: 4px solid var(--color-primary);
  border-radius: var(--radius-md);
}
.special-events-list h3 {
  margin-bottom: var(--space-1);
  font-size: var(--font-size-md);
}

.game-event-form, .feedback-form {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.form-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.form-group.checkbox {
  flex-direction: row;
  align-items: center;
  gap: 8px;
}
.form-message {
  margin-top: 0.5em;
  font-size: var(--font-size-xs);
  min-height: 1.2em;
}
.form-message--success {
  color: var(--color-success);
}
.form-message--error {
  color: var(--color-danger);
}

.event-highlights-list {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: var(--space-4);
}
.event-highlight {
  display: flex;
  flex-direction: column;
  background: var(--color-neutral-50);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-xs);
  padding: var(--space-2);
  gap: var(--space-2);
  align-items: flex-start;
}
.event-highlight img {
  border-radius: var(--radius-sm);
  width: 100%;
  aspect-ratio: 3/2;
  object-fit: cover;
}
.event-highlight blockquote {
  font-size: var(--font-size-sm);
  color: var(--color-neutral-700);
  margin: 0;
  border-left: 3px solid var(--color-primary);
  padding-left: 10px;
}
.event-highlight cite {
  font-style: normal;
  color: var(--color-neutral-400);
}

@media (max-width: 900px) {
  .event-highlights-list {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 620px) {
  .event-highlights-list {
    grid-template-columns: 1fr;
  }
  .events-nav-list {
    gap: 2px;
  }
}
/* END GAME EVENTS STYLES */