/* ====================================================== 
   <!-- Pagination -->                         
/* ====================================================== */

/*
 * 1. Default
 * 2. Paginate WordPress Posts
*/



/* 
 ---------------------------
 1. Default
 ---------------------------
 */ 
.uix-pagination__container {
	margin-top: 2.84375rem;
	
	&::before {
		display: table;
		content: "";
		line-height: 0;
	}
	&::after {
		display: table;
		content: "";
		line-height: 0;
		clear: both;
	}
	
	ul {
		font-size: 0; /*Fighting the Space Between Inline Block Elements*/
		
		li {
			display: inline-block;
			font-size: 1rem;/*Fighting the Space Between Inline Block Elements*/

			a, 
			> span {
				display: inline-block;
				width: 3.125rem;
				height: 3.125rem;
				padding-top: 0.25rem;
				text-align: center;
				background: none;
				border: none;
				color: var(--uix-primary-text-color);
				font-variant-ligatures: common-ligatures;
				border-radius: 4px;
				/*Ligatures and contextual forms are ways of combining glyphs to produce more harmonized forms.*/
				margin-bottom: 0;
				font-size: 0.875rem;
				line-height: 3.25;
				margin-top: 0;
				margin-bottom: 2.06818181818rem;
			}	

			a:hover {
				background: #efefef;
				color: #232323;	
			}

			&.is-active {

				a {
					
					color: #989898;
					font-style: italic;
					&:hover {
						background: #e7e7e7;
						color: #232323;
					}
				}

				> span {
					border-color: var(--uix-btn-gradient-color1);
					background-color: var(--uix-btn-gradient-color1);
					background-image: linear-gradient(to right, var(--uix-btn-gradient-color1) 0%, var(--uix-btn-gradient-color2) 20%, var(--uix-btn-gradient-color3) 100%);
					@include outer-shadow( 'highlight', var(--uix-highlight-color1) );
					color: #fff;
					font-style: italic;
				}
			}	

		}	
		
		
	}


}



/* 
 ---------------------------
 2. Paginate WordPress Posts
 ---------------------------
 */ 
.uix-page-links {
	margin: 0.875rem 0;
	font-weight: 600;
	position: relative;
	display: block;
	padding: 0.5rem 0.75rem;
	margin-left: -1px;
	line-height: 1.25;
	border: 1px solid #dee2e6;
	
	> span {
		display: inline-block;
		margin: 0 0.13125rem;
		font-weight: normal;
		font-style: italic;
	}
	a {
		display: inline-block;
		margin: 0 0.13125rem;
		font-weight: normal;
		font-style: italic;

		> span {
			color: var(--uix-primary-text-color);
			background: #F9F9F9;
			padding: 0 0.2625rem;
			border: 1px solid #DDDDDD;
			border-radius: 2px;
		}
	}
}