/* EO pager — xem shared/eo-pager.js. Màu theo token của từng mẫu (--c-accent, --c-border, --c-surface, --c-text). */
.eo-pager { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px; padding: 28px 0 8px; }
.eo-pager__btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 4px; min-width: 44px; min-height: 44px; padding: 0 14px;
  box-sizing: border-box; border-radius: 10px; border: 1.5px solid var(--eo-pager-border, var(--c-border, #d1d5db));
  background: var(--eo-pager-bg, var(--c-surface, #fff)); color: var(--eo-pager-fg, var(--c-text, #111827));
  font: inherit; font-size: 15px; font-weight: 700; text-decoration: none; line-height: 1; transition: border-color .15s, color .15s, background .15s;
}
@media (hover: hover) and (pointer: fine){a.eo-pager__btn:hover{ border-color: var(--eo-pager-accent, var(--c-accent, #0b5ed7)); color: var(--eo-pager-accent, var(--c-accent, #0b5ed7)); }}
.eo-pager__btn.is-current { background: var(--eo-pager-accent, var(--c-accent, #0b5ed7)); border-color: var(--eo-pager-accent, var(--c-accent, #0b5ed7)); color: #fff; }
.eo-pager__btn.is-disabled { opacity: .45; cursor: default; }
.eo-pager__num { padding: 0 6px; }
.eo-pager__gap { min-width: 20px; text-align: center; color: var(--c-muted, #6b7280); font-weight: 700; }
/* mobile: Trước · số · Sau trên 1 hàng, số trang gọn */
@media (max-width: 480px) {
  .eo-pager { gap: 6px; }
  .eo-pager__prev, .eo-pager__next { padding: 0 12px; }
  .eo-pager__num { min-width: 44px; }
  /* nhiều trang: chỉ giữ số quanh trang hiện tại (Trước · 1 2 3 · Sau) để không rớt dòng */
  .eo-pager__far, .eo-pager__gap { display: none; }
  .eo-pager__prev, .eo-pager__next { padding: 0 10px; }}
/* máy rất hẹp (320–360px): vẫn 1 hàng, nút vẫn ≥ 44px */
@media (max-width: 360px) {
  .eo-pager { gap: 4px; }
  .eo-pager__prev, .eo-pager__next { padding: 0 6px; }}