Nav Pagination

.nav-pagination {
	text-align: center;
	max-width: none;
	margin-bottom: 2rem!important;
	margin-top: 3rem!important;
	padding: .7rem 0;

	li {
		display: inline-block;
		vertical-align: middle;
		margin: 0 .4rem;

		> a, > span {
         height: 45px;
			text-align: center;
         text-decoration: none;
			font-family: $font-secondary;
			font-weight: 700;
		}

		&:not(.active) {
			display: none;
         
         @include mediaWQuery($media-query-m) {
            display: inline-block;
         }
		}

		&:not(.arrow-pagination) {
			> a, > span { width: 45px }
			font-size: rem(18);
		}
	}

	li.arrow-pagination {
		font-size: 0;
		display: inline-block;

		> a {
			display: flex;
			align-items: center;
			padding: 0 .4rem!important;
         font-size: 0;
         
         span {
            display: none;
         }

         @include mediaWQuery($media-query-m) {
            color: $c-font-color;
            
            span {
               font-size: $font-size-m;
					font-weight: 700;
               display: inline-block;
            }

            i { display: none }

            &:hover, &:focus {
               text-decoration: underline;
            }
         }
		}
	}

	li:not(.arrow-pagination) {

		> a, > span {
			display: flex;
			justify-content: center;
			align-items: center;
			padding: 0 1rem!important;
			border-radius: $border-radius-s;
			background: $c-white;
         color: $c-black;
			border: 1px solid $c-black;

			&:hover, &:focus {
				background: $c-black;
				color: $c-white;
				outline: 0;
			}
		}

		&.active {
			> span {
				background: $c-black;
				color: $c-white;
				outline: 0;
			}
		}
	}
}

// Algolia
.ais-Pagination-list {
	.ais-Pagination-item--page {
		display: none;
		@include mediaWQuery($media-query-m) { display: block }

		a {
			width: 45px;
			display: flex;
			justify-content: center;
			align-items: center;
			padding: 0 1rem !important;
			border-radius: 8px;
			background: #fff;
			color: #222;
			border: 1px solid #222;
			height: 45px;
			text-align: center;
			text-decoration: none;
			font-family: $font-secondary;
			font-weight: 700;

			&:hover, &:focus {
				background: $c-black;
				color: $c-white;
			}
		}

		&.ais-Pagination-item--selected {
			display: block;
			a {
				background: $c-black;
				color: $c-white;
			}
		}
	}

	.ais-Pagination-item--firstPage,
	.ais-Pagination-item--previousPage,
	.ais-Pagination-item--nextPage,
	.ais-Pagination-item--lastPage {
		

		a, span {
			display: flex;
			justify-content: center;
			align-items: center;
			width: 25px;
			height: 45px;
			margin-top: -2px;
			font-size: 1.6em;
			text-decoration: none;
		}

		&.ais-Pagination-item--disabled { opacity: 0 }
	}
}