@layer components {
  .pagination-link {
    display: block;
    padding: var(--space-3) var(--space-4);
    text-align: center;
    color: var(--color-link);
    text-decoration: none;
    font-size: var(--text-sm);
  }

  .pagination-link:hover {
    text-decoration: underline;
  }

  /* Auto-loading pagination link is visually hidden but still triggers intersection observer */
  .pagination-link--auto {
    height: 1px;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
  }
}