/* assets/css/components/pagination.css */
@layer components {
  .pagination { display: flex; align-items: center; gap: var(--space-2xs); list-style: none; margin: 0; padding: 0; }
  .pagination__item { display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; border-radius: var(--radius-s); background: var(--white); border: 1px solid var(--border-subtle); font-size: var(--text-s); font-weight: var(--weight-medium); color: var(--text-body); cursor: pointer; text-decoration: none; transition: background-color var(--duration-fast) var(--ease-default), border-color var(--duration-fast) var(--ease-default); }
  .pagination__item:hover { background: var(--surface-tinted); border-color: var(--border-default); }
  .pagination__item--active { background: var(--surface-primary); border-color: var(--surface-primary); color: var(--text-on-primary); font-weight: var(--weight-semibold); pointer-events: none; }
  .pagination__item--prev, .pagination__item--next { border-color: var(--border-default); }
  .pagination__item-icon { width: 1rem; height: 1rem; }
  .pagination__ellipsis { display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; font-size: var(--text-s); color: var(--text-muted); }
}