/*
 * Pagination
 */

/* Load More button and spinner */
.g-loadmore {
	visibility: hidden;
	text-align: center;
	position: relative;
	min-height: 2.5rem; /* height of g-preloader */
	margin-top: calc(var(--gap, 0px) * 2);
	}
.w-grid.preload_style_spinner.filtering {
	height: 20rem;
	}
.w-grid.preload_style_spinner.filtering > .g-loadmore,
.w-grid.pagination_ajax > .g-loadmore, /* required for deprecated Grid button to show up */
.w-grid.pagination_load_on_btn:not(.filtering) > .g-loadmore,
.w-grid.pagination_load_on_scroll.loading_items:not(.filtering) > .g-loadmore,
.w-grid.pagination_infinite.loading_items > .g-loadmore { /* required for deprecated Grid scroll pagination */
	visibility: visible;
	}
	.g-loadmore > .g-preloader {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
		opacity: 0;
		}
	.w-grid.loading_items:not(.filtering) > .g-loadmore > .g-preloader {
		opacity: 1;
		}
	.g-loadmore > .w-btn {
		z-index: 1;
		}
	.g-loadmore.width_full > .w-btn {
		width: 100%;
		}
	.w-grid.loading_items > .g-loadmore > .w-btn {
		opacity: 0;
		transition: none;
		}

/* Numbered AJAX pagination */
.w-grid.pagination_numbered_ajax.loading_items:not(.filtering) {
	opacity: .5;
	pointer-events: none;
	}

/* WordPress numbered pagination */
.pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	margin: 0 -0.2rem;
	}
	.pagination .page-numbers {
		flex-shrink: 0;
		text-align: center;
		position: relative;
		margin: 0.2rem;
		}
		.pagination .page-numbers:before {
			content: '';
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			border-radius: inherit;
			border-width: var(--btn-border-width, 0px);
			border-style: solid;
			border-color: inherit;
			border-image: inherit;
			}
		.pagination .page-numbers span {
			vertical-align: top;
			position: relative;
			z-index: 1
			}
	.pagination > :not(.custom) .page-numbers {
		font-size: 1.4rem;
		line-height: 3.5rem;
		height: 3.5rem;
		width: 3.5rem;
		overflow: hidden;
		border-radius: 50%;
		transition: none;
		}
	.pagination > :not(.custom) a.page-numbers {
		color: inherit;
		}
	.pagination > :not(.custom) .page-numbers.current {
		background: var(--color-content-primary-grad);
		color: #fff !important;
		}
	.no-touch .pagination > :not(.custom) a.page-numbers:not(.current):hover {
		background: var(--color-content-bg-alt-grad);
		}
	.pagination .page-numbers.dots {
		background: none !important;
		border: none !important;
		box-shadow: none !important;
		color: inherit !important;
		}
		.pagination .page-numbers.dots:before,
		.pagination > :not(.custom) .page-numbers:before {
			display: none;
			}
	.pagination > :not(.custom) .page-numbers.prev,
	.pagination > :not(.custom) .page-numbers.next,
	.pagination .page-numbers.prev span,
	.pagination .page-numbers.next span {
		font-size: 0;
		}
		.pagination > :not(.custom) .page-numbers.prev:after,
		.pagination > :not(.custom) .page-numbers.next:after {
			font-size: 1.5rem;
			}
		.pagination .page-numbers.prev:after {
			content: '\f104';
			font-family: fontawesome;
			font-weight: 400;
			vertical-align: top;
			position: relative;
			padding-right: 0.1em;
			}
		.pagination .page-numbers.next:after {
			content: '\f105';
			font-family: fontawesome;
			font-weight: 400;
			vertical-align: top;
			position: relative;
			padding-left: 0.1em;
			}

.w-grid > .pagination {
	margin-top: 2rem;
	}
	.w-grid:not(.cols_1) > .pagination .nav-links {
		justify-content: center;
		}

/* Add min-width to make correct circles or squares */
.pagination .nav-links[class*="us-nav-style_"] > * {
	min-width: var(--btn-height, 3em);
	}

/* Colors
   ========================================================================== */
.color_alternate .pagination > :not(.custom) .page-numbers.current {
	background: var(--color-alt-content-primary-grad);
	}
.no-touch .color_alternate .pagination > :not(.custom) a.page-numbers:not(.current):hover {
	background: var(--color-alt-content-bg-alt-grad);
	}

/* Responsive
   ========================================================================== */
@media screen and (max-width: 480px) {
.g-loadmore > .w-btn {
	font-size: 1rem !important;
	}
.pagination .nav-links {
	justify-content: flex-start !important;
	}
}
