/* ============================================================
   Component: pagination
   ============================================================ */
.pagination {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--space-3); margin-top: var(--space-4); flex-wrap: wrap;
}
.pg-info { font-size: var(--fs-sm); color: var(--text-muted); }
.pg-btns { display: flex; align-items: center; gap: var(--space-2); }
.pg-page { font-size: var(--fs-sm); color: var(--text-muted); min-width: 64px; text-align: center; }
.pg-perpage { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-sm); color: var(--text-muted); white-space: nowrap; flex: 0 0 auto; }
.pg-perpage-sel {
  font-size: var(--fs-sm); color: var(--text); background: var(--surface);
  border: 1px solid var(--border-strong); border-radius: var(--radius-sm);
  padding: 4px 8px; cursor: pointer; outline: none;
}
.pg-perpage-sel:focus { border-color: var(--brand); }