/*
 * fworks — archive pagination: First/Last jumps (|<  >|), prev/next text vs
 * symbol, and a single-line mobile layout. The buttons carry `page-numbers`
 * too, so they inherit the theme's pagination button styling (tone matches).
 * Current-page highlight is left to the theme (unchanged). Tokens only — no
 * raw color codes. `.ct-pagination[data-pagination]` raises specificity so we
 * override Blocksy's own pagination.min.css (which loads later) without
 * !important; !important is used only against Blocksy's `!important` hide rule.
 */

/* Blocksy makes [data-pagination=simple] a grid (1fr auto 1fr), which scatters
   the injected jump buttons across cells. Switch to a centered flex row so
   "|< Previous 1 2 3 Next >|" reads as one cohesive bar. `.ct-pagination
   [data-pagination]` (0,2,0) outranks Blocksy's `[data-pagination=simple]`
   (0,1,0), so no !important is needed. */
.ct-pagination[data-pagination] {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 8px;
}

/* ---- First/Last jump buttons ---- */
.fworks-pagejump {
	padding: 0 10px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: -0.03em;
	white-space: nowrap;
}
.fworks-pagejump.is-disabled {
	opacity: 0.4;
	pointer-events: none;
	cursor: default;
}
.fworks-pagejump:focus-visible,
.fworks-pnav:focus-visible {
	outline: 3px solid var(--fw-vermilion);
	outline-offset: 2px;
}

/* ---- prev/next: desktop shows text, hides the "<"/">" symbol ---- */
.fworks-pnav__icon { display: none; }
.fworks-pnav__text { display: inline; }

/* ---- Mobile: symbol-only prev/next, numbers on one line ---- */
@media (max-width: 768px) {
	/* Swap "Previous"/"Next" for "<"/">"; keep the words for screen readers. */
	.fworks-pnav__text {
		position: absolute !important;
		width: 1px;
		height: 1px;
		margin: -1px;
		padding: 0;
		overflow: hidden;
		clip: rect(0 0 0 0);
		white-space: nowrap;
		border: 0;
	}
	.fworks-pnav__icon {
		display: inline;
		font-weight: 700;
	}

	/* First/Last jumps are redundant on mobile — the "1" and last number links
	   act as first/last — so hide them; keep "< number … number >". !important
	   to beat the theme's own `a.page-numbers { display: inline-flex }`. */
	.fworks-pagejump { display: none !important; }

	/* One line, no wrap; scroll if it can't all fit (many pages).
	   Covers Blocksy archives and the All Posts (paginate_links) list. */
	.ct-pagination[data-pagination],
	.fworks-allposts__pagination ul.page-numbers {
		flex-wrap: nowrap;
		/* Left-anchored so the first pages + current stay visible; the row
		   scrolls horizontally (never wraps) if a very narrow screen can't fit
		   every button. */
		justify-content: flex-start;
		gap: 2px;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
	/* Dots aren't tappable — keep them narrow so the row fits on one line. */
	.ct-pagination .page-numbers.dots,
	.fworks-allposts__pagination .page-numbers.dots {
		min-width: 1.2rem !important;
		width: 1.2rem !important;
		padding: 0 !important;
	}
	/* Reveal Blocksy's number links (hidden ≤689.98px via !important). */
	.ct-pagination .ct-hidden-sm { display: contents !important; }

	/* Uniform ≥40px tap targets that don't shrink in the nowrap row. */
	.ct-pagination[data-pagination] .page-numbers {
		min-width: 40px;
		width: auto;
		height: 40px;
		margin: 0;
		flex: 0 0 auto;
	}
	.fworks-allposts__pagination a.page-numbers,
	.fworks-allposts__pagination span.page-numbers {
		min-width: 40px;
		height: 40px;
		/* border-box + tight padding so the real button width is ~40px (the
		   theme's 0.6rem padding on content-box otherwise makes them ~59px and
		   the row overflows). */
		box-sizing: border-box;
		padding: 0 4px;
		flex: 0 0 auto;
	}
}