/* Shared pagination control: see pager.js. Uses the page's own colour variables when it has them. */
.nb-pager { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 6px; margin: 0; }
.nb-nums { display: inline-flex; gap: 6px; }
.nb-pager-btn {
    min-width: 38px; height: 36px; padding: 0 13px;
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    border: 1px solid var(--border, #e2e8f0); border-radius: 9px;
    background: var(--surface, #fff); color: var(--text-main, #1a2233);
    font: 600 13px/1 inherit; font-family: inherit; cursor: pointer;
    transition: border-color .15s, color .15s, background .15s;
}
.nb-pager-btn:hover:not(:disabled):not(.active) { border-color: var(--primary, #e04420); color: var(--primary, #e04420); }
.nb-pager-btn.active { background: var(--primary, #e04420); border-color: var(--primary, #e04420); color: #fff; cursor: default; }
.nb-pager-btn:disabled { opacity: .4; cursor: not-allowed; }
.nb-pager-btn:focus-visible { outline: 2px solid var(--primary, #e04420); outline-offset: 2px; }
.nb-pager-btn span[aria-hidden] { font-size: 16px; line-height: 1; }
/* Phones: symbols only, so First / Previous / 2 numbers / Next / Last fit on one line. */
@media (max-width: 520px) {
    .nb-pager { gap: 4px; }
    .nb-nums { gap: 4px; }
    .nb-pager-btn { min-width: 38px; padding: 0 9px; }
    .nb-pager .lbl { display: none; }
}
