/* pager.css — "« newer · page [N] go · rows a–b · older »" under a paged list
 * (src/shared/components/pager.php): a row of small buttons, 8 px apart (1.11.0), the current
 * page the filled member, an end without a page the disabled look (docs/design.md, "Knöpfe").
 * Since 1.13.0 the filled member holds the jump form: a number field four characters wide and
 * a "go" button, both 16 px tall so the member keeps the 20 px line of its neighbours. Loaded
 * on every page after base.css. */

.pager { display: flex; align-items: center; flex-wrap: wrap; margin: 0 0 var(--s4); font-size: var(--fs-12); line-height: var(--lh-12); font-variant-numeric: tabular-nums; }
.pager a, .pager span { margin-right: var(--s2); }
.pager span.dim { color: var(--muted); background: var(--surface); border-color: var(--line); cursor: not-allowed; }
/* the jump form (1.13.0): a flex item like the links, no box of its own — the span inside it is
   the filled "current" member (base.css); the field and the button sit in that line */
.pager-jump { display: inline-block; margin: 0; }
.pager-jump input[type=number] {
  width: 4ch; box-sizing: content-box; height: 14px; padding: 0 3px; margin: 0 var(--s1) 0 var(--s1);
  font-size: var(--fs-12); line-height: 14px; text-align: right; font-variant-numeric: tabular-nums;
  vertical-align: top; -moz-appearance: textfield; appearance: textfield;
}
.pager-jump input[type=number]::-webkit-outer-spin-button, .pager-jump input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
/* vertical-align: top on both: aligned to the baseline, a 16 px inline block would push the
   member's 16 px line to 17 and the member to 21 px — one taller than its neighbours */
.pager-jump button { padding: 0 var(--s1); font-size: var(--fs-11); line-height: 14px; vertical-align: top; }