/* --------------------
 * Name: Custom Paginator
 * Desc: Custom paginator at the top or bottom of main and archive pages
 * Created: 07.02.2026
 * Last Edited: 07.02.2026
 * --------------------
 */
.pagination {
  	display: flex;
	justify-content:center;
 	gap: 6px;
 	font-family: Arial, sans-serif;
}

.page-item .page-link{
	min-width: 32px;
  	height: 32px;
	padding: 0px;
  	display: flex;
  	align-items: center;
  	justify-content: center;
  	background-color: #eaeaea;
	color:#555555;
  	text-decoration: none;
  	border-radius: 4px;
  	font-size: 16px;
  	transition: background-color 0.2s, color 0.2s;
	font-weight: bold;
	cursor: pointer;
	/*smooth generator*/
  	transition: 
    	transform .15s ease,
      	background-color .15s ease;
}

.page-item .page-link:hover{
	transform: scale(1.1);
}

.page-item .page-link.prev,
.page-item .page-link.next{
  	background-color: #1F5E43;
  	color: #fafafa;
  	text-decoration: none;
  	border-radius: 4px;
	padding: 0px 15px;
}

.page-item .page-link.dots{
  	background-color: rgba(0,0,0,0);
	border:none;
  	user-select: none;
}

.page-item .page-link.dots:hover{
  	color:#555555;
}

.page-item .page-link:hover:not(.page-link.dots,
								.page-item .page-link.prev,
								.page-item .page-link.next,
								.page-item .page-link.active) {
  	background-color: #efefef;
	color:#333333;
}

.page-item .page-link.active {
  	background-color: #1F5E43;
  	color: #fafafa;
}

.page-item .page-link.prev:hover,
.page-item .page-link.next:hover,
.page-item .page-link.active:hover{
  	background-color:#338462;
	color:#ffffff;
}