/* Pager

Paged navigation is a list of page numbers when more than 1 page of content
is available. */

.pagination,
.pager {
  --flex-inline-gap: 0.5rem;

  display: flex;
  flex-wrap: wrap;
  gap: var(--flex-inline-gap);
  padding: 0;
  text-align: start;

  /* Add vertical rhythm margins. */
  margin-block: var(--spacing-m);
  justify-content: center;

  a {
    text-decoration: none;

    &:hover,
    &:focus {
      text-decoration: underline;
    }
  }

  .pager__item,
  .page-link {
    padding-inline: 2px;
  }

  .active {
    font-weight: var(--fw-bold);
  }

  .disabled {
    .page-link {
      /* Re-set default cursor for disabled elements. */
      cursor: default;
      color: var(--color-disabled);

      &:hover,
      &:focus,
      &:active {
        /* Override any link underlines and color changes. */
        color: var(--color-disabled);
        text-decoration: none;
      }
    }
  }
}