
.post-navigation {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-column-gap: 8%;
	position: relative;
	margin-top: var(--margin, 50px);
}

.post-navigation figure {
	flex: 0 0 var(--thumb-width, 70px);
	max-width: var(--thumb-width, 70px);
	align-items: center;
	justify-content: center;
	position: relative;
	border-radius: var(--theme-border-radius, 100%);
}

@media (max-width: 689.98px) {
	.post-navigation figure {
		--thumb-width: 45px;
		--thumb-margin: 15px;
	}
}

.post-navigation figure svg, .post-navigation figure:after {
	position: absolute;
	opacity: 0;
	transition: all .12s cubic-bezier(.455, .03, .515, .955);
}

.post-navigation figure svg {
	z-index: 3;
}

.post-navigation figure:after {
	content: "";
	z-index: 2;
	inset: 0;
	background: var(--image-overlay-color, var(--theme-palette-color-1));
}

.post-navigation [class*=nav-item] {
	display: flex;
	align-items: center;
}

.post-navigation [class*=nav-item]:hover figure:after {
	opacity: .85;
}

.post-navigation [class*=nav-item]:hover svg {
	opacity: 1;
	transform: translateX(0);
}

.post-navigation .nav-item-prev figure {
	margin-inline-end: var(--thumb-margin, 25px);
}

.post-navigation .nav-item-prev svg {
	transform: translateX(10px);
}

.post-navigation .nav-item-next {
	text-align: end;
	justify-content: flex-end;
}

.post-navigation .nav-item-next figure {
	margin-inline-start: var(--thumb-margin, 25px);
}

.post-navigation .nav-item-next svg {
	transform: translateX(-10px);
}

.post-navigation .item-label {
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	opacity: .9;
}

@media (max-width: 689.98px) {
	.post-navigation .item-label span {
		display: none;
	}
}

.post-navigation .item-title {
	display: block;
	margin-top: 5px;
	font-size: 14px;
	font-weight: 700;
	word-break: break-word;
}

.post-navigation:after {
	position: absolute;
	content: "";
	top: 25%;
	left: 50%;
	width: 1px;
	height: 50%;
	background: var(--theme-border-color);
}
