/*
 * Previous, the pages, Next (`shared/_pagination`): the screener's results and
 * the admin list of data anomalies. Pagy computes the series; the markup is
 * the app's own, because pagy_nav emits class names of its own.
 */
@layer components {
  .pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: var(--space-2xs);
    margin-block-start: var(--space-lg);
    font-size: var(--text-ui);

    & > * {
      display: inline-grid;
      place-items: center;
      min-inline-size: 2.5rem;
      min-block-size: 2.5rem;
      padding-inline: var(--space-xs);
      border-radius: var(--radius-md);
    }

    & > a:hover {
      background-color: var(--color-surface-raised);
    }
  }

  .pagination__current {
    background-color: var(--color-accent-tint);
    color: var(--color-accent-strong);
    font-weight: var(--weight-semibold);
  }

  .pagination__disabled {
    color: var(--color-ink-subtle);
  }
}