/**
 * core/query-pagination
 */

/* Wrapper */
.wp-block-pagination-wrapper.wp-block-pagination-wrapper {
	margin-block: var(--wp--preset--spacing--90);
	margin-inline: 0;
}


/* Pagination */
.wp-block-query-pagination {
	display: flex;
	flex-wrap: nowrap;
	gap: var(--wp--preset--spacing--60);
	inline-size: 100%;

	&:last-child {
		margin-block-end: 0;
	}

	&.is-layout-flex {
		margin-inline: auto;
	}
}

.wp-block-query-pagination-numbers .current {
	color: var(--wp--preset--color--accent-1);
	font-weight: 700;
	text-decoration: underline
}


/* Previous / Next buttons */
:is(.wp-block-query-pagination-next, .wp-block-query-pagination-previous):disabled {
	pointer-events: none;
	background-color: var(--wp--preset--color--gray);
	border: none;
}

/* Next */
.wp-block-query-pagination-next {
	&::after {
		margin-inline-start: 0.5em;
	}
}

/* Previous */
.wp-block-query-pagination-previous {
	margin: 0 !important;

	&::after {
		scale: -1 1;
	}
}

:root :where(.wp-block-query-pagination-next, .wp-block-query-pagination-previous) {
	display: flex;
	align-items: center;
	justify-content: center;
	block-size: 44px;
	inline-size: 44px;
	margin: 0 !important;
	background-color: var(--wp--preset--color--accent-1);
	border-radius: var(--wp--custom--border--radius--10);
	transition: 0.33s ease;

	&::after {
		display: block;
		position: absolute;
		block-size: 16px;
		inline-size: 10px;
		margin: 0;
		background-color: var(--wp--preset--color--base);
		background-repeat: no-repeat;
		background-size: contain;
		content: '';
		clip-path: var(--wp--custom--icons--chevron-right);
	}

	&:hover, &:active {
		background-color: var(--wp--preset--color--accent-2);
	}
}

@media (--min-tablet) {
	.wp-block-query-pagination {
		inline-size: auto;
	}
}