.gamipress-leaderboard-table {
  max-width: var(--wp--style--global--wide-size);
  border-collapse: separate;
  border-spacing: 0 8px;
}

.gamipress-leaderboard-table thead th {
  padding: 0.625em 1.5em;
  text-align: left;
  color: var(--wp--preset--color--light-blue);
  font-size: 15px;
}

.gamipress-leaderboard-table .column-display_name img.avatar {
  border-radius: 50%;
  border: 2px solid var(--wp--preset--color--green);
  object-fit: cover;
  width: 40px;
  height: 40px;
  margin-right: 0.7em;
  vertical-align: middle;
}

.gamipress-leaderboard-table td,
.gamipress-leaderboard-table th {
  vertical-align: middle !important;
  padding: 1em 1.25em;
  border: none;
  background: transparent;
}

.gamipress-leaderboard-table .column-position span,
.gamipress-leaderboard-table .column-position strong {
  vertical-align: middle;
}

.gamipress-leaderboard-table .column-grade img {
  vertical-align: middle;
  margin-right: 0.5em;
  width: 1.7em;
  height: 1.7em;
}

.gamipress-leaderboard-table .column-jeton img,
.gamipress-leaderboard-table .column-point-xp img {
  vertical-align: middle;
  margin-right: 0.5em;
  width: 1.5em;
  height: 1.5em;
}

.gamipress-leaderboard-table tr {
  overflow: hidden;
}

.gamipress-leaderboard-table-responsive.gamipress-leaderboard-table-responsive-toggleable
  tr
  td.column-display_name:after {
  filter: invert(1);
}

.gamipress-leaderboard-table tbody tr td:first-child {
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
}

.gamipress-leaderboard-table tbody tr td:last-child {
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}

.gamipress-leaderboard-table tbody tr {
  background: var(--wp--preset--color--blue-4);
}

.gamipress-leaderboard-table tbody tr:nth-child(-n + 3) {
  background: var(--wp--preset--color--dark-blue);
}

.gamipress-leaderboard-table tr.is-current-user {
  border-radius: 10px;
  border: 2px solid var(--wp--preset--color--green);
  margin-bottom: 8px;
}

@media only screen and (min-width: 1025px) {
  .gamipress-leaderboard-table tr.is-current-user td:first-child {
    border-left: 2px solid var(--wp--preset--color--green);
    border-top: 2px solid var(--wp--preset--color--green);
    border-bottom: 2px solid var(--wp--preset--color--green);
  }

  .gamipress-leaderboard-table tr.is-current-user td:last-child {
    border-right: 2px solid var(--wp--preset--color--green);
    border-top: 2px solid var(--wp--preset--color--green);
    border-bottom: 2px solid var(--wp--preset--color--green);
  }

  .gamipress-leaderboard-table
    tr.is-current-user
    td:not(:first-child):not(:last-child) {
    border-top: 2px solid var(--wp--preset--color--green);
    border-bottom: 2px solid var(--wp--preset--color--green);
  }
}

.gamipress-leaderboard-table tbody tr.current-user-separator {
  background: transparent;
}

.gamipress-leaderboard-table .position-evolution img {
  width: 17px;
  margin-right: 10px;
}

.leaderboard-info-panel {
  max-width: var(--wp--style--global--wide-size);
  margin: 0 auto;
  margin-bottom: 1rem;
  display: flex;
  flex-direction: column;
  padding: 0.5rem;
  gap: 0.25em;
}

.leaderboard-info-panel .leaderboard-update-info {
  color: var(--wp--preset--color--light-blue);
  font-size: 12px;
}

.leaderboard-info-panel .end-date {
  color: var(--wp--preset--color--green);
}

.leaderboard-info-panel .leaderboard-closure-and-stats {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.25em;
  font-size: 15px;

  > span:nth-child(2) {
    display: none;
  }

  @media (min-width: 768px) {
    flex-wrap: nowrap;

    > span:nth-child(2) {
      display: initial;
    }
  }
}