/**
 * Numbered pagination (template-parts/global/pagination.php), shared by the
 * stock archives and the Happy Customers page. Phones show
 * "Previous · Page X of Y · Next"; larger screens show numbered links.
 */

.nscb-pagination {
	margin-top: var(--nscb-space-8);
}

.nscb-pagination__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: var(--nscb-space-2);
	margin: 0;
	padding: 0;
	list-style: none;
}

.nscb-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--nscb-space-2);
	min-width: 3rem;
	min-height: 3rem;
	padding: 0 var(--nscb-space-3);
	border: 1px solid var(--nscb-edge-strong);
	border-radius: var(--nscb-radius-pill);
	background-color: var(--nscb-surface-raised);
	box-shadow: var(--nscb-edge-light);
	color: var(--nscb-color-text-secondary);
	font-size: var(--nscb-text-sm);
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	text-decoration: none;
	transition: border-color var(--nscb-duration-fast) var(--nscb-ease-standard), color var(--nscb-duration-fast) var(--nscb-ease-standard), background-color var(--nscb-duration-fast) var(--nscb-ease-standard);
}

.nscb-pagination a.page-numbers:hover {
	border-color: var(--nscb-color-highlight);
	color: var(--nscb-color-text);
}

.nscb-pagination a.page-numbers:active {
	transform: scale(0.95);
}

/* Current page: the selected state uses the highlight color. */
.nscb-pagination .page-numbers.current {
	border-color: transparent;
	background-color: var(--nscb-color-highlight);
	box-shadow: inset 0 1px 0 color-mix(in srgb, #FFFFFF 35%, transparent), 0 8px 20px -10px var(--nscb-highlight-glow);
	color: var(--nscb-color-highlight-text);
}

/* Sold Out: the current page in silver, so the yellow stays with available cars. */
/* Previous / Next: text with the arrow in a small round well. */
.nscb-pagination .prev,
.nscb-pagination .next {
	padding-inline: var(--nscb-space-4);
	color: var(--nscb-color-text);
}

.nscb-pagination .page-numbers.dots {
	min-width: auto;
	padding: 0 var(--nscb-space-1);
	border: 0;
	background: none;
	box-shadow: none;
}

.nscb-pagination .nscb-icon {
	width: 1rem;
	height: 1rem;
}

/* "Page X of Y" status: phones only. */
.nscb-pagination__item--status {
	display: none;
}

/* Phones: Previous · Page X of Y · Next (numbered links don't fit). */
@media (max-width: 47.99rem) {
	.nscb-pagination__list {
		flex-wrap: nowrap;
		justify-content: space-between;
	}

	.nscb-pagination__item--number {
		display: none;
	}

	.nscb-pagination__item--status {
		display: block;
		order: 1;
		color: var(--nscb-color-text-secondary);
		font-size: var(--nscb-text-sm);
		font-variant-numeric: tabular-nums;
		white-space: nowrap;
	}

	.nscb-pagination__item--prev {
		order: 0;
	}

	.nscb-pagination__item--next {
		order: 2;
	}

	/* Keep the status centred when Previous or Next is absent (first/last page). */
	.nscb-pagination__list:not(:has(.nscb-pagination__item--prev))::before,
	.nscb-pagination__list:not(:has(.nscb-pagination__item--next))::after {
		content: "";
		width: 2.75rem;
	}

	.nscb-pagination__list:not(:has(.nscb-pagination__item--next))::after {
		order: 3;
	}

	.nscb-pagination .prev,
	.nscb-pagination .next {
		padding: 0 var(--nscb-space-4);
	}
}