.pagination {
  text-align: center;
  margin: 3.2rem 0 1.6rem 0;
  color: var(--foreground-2);
}

.pagination-controls {
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 1.6rem;

  .button {
    background: var(--background-3);
    &:hover:not(:disabled) {
      background: var(--background-4);
    }

    /* disabled because it's the current page */
    &:disabled {
      background: var(--orange-1);
      color: var(--white);
      border-color: var(--orange-1);
      opacity: 1;
    }
  }
}

.pagination-ellipsis {
  padding: 0 1ex;
}