/* Post Navigation Bar — frontend styles */
.pnb-nav-bar {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	padding: 14px 0;
	margin-bottom: 20px;
	align-items: center;
}

/* Use .pnb-nav-bar .pnb-btn for higher specificity to beat most themes */
.pnb-nav-bar .pnb-btn {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 10px 22px !important;
	border-radius: 999px !important;
	background-color: #E8F0FB !important;
	color: #1A3560 !important;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Inter", sans-serif !important;
	font-size: 13.5px !important;
	font-weight: 600 !important;
	letter-spacing: 0.01em !important;
	line-height: 1 !important;
	text-decoration: none !important;
	text-transform: none !important;
	border: 1.5px solid #C2D6F5 !important;
	outline: none !important;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.10), inset 0 1px 0 rgba(255,255,255,0.7) !important;
	transition: background-color 0.15s ease, border-color 0.15s ease,
	            box-shadow 0.15s ease, transform 0.1s ease, color 0.15s ease !important;
	cursor: pointer !important;
	white-space: nowrap !important;
	user-select: none !important;
	-webkit-user-select: none !important;
	vertical-align: middle !important;
	-webkit-font-smoothing: antialiased !important;
}

.pnb-nav-bar .pnb-btn:hover {
	background-color: #D2E3F8 !important;
	border-color: #A4C2EE !important;
	color: #0F2550 !important;
	box-shadow: 0 3px 8px rgba(0, 0, 0, 0.13), inset 0 1px 0 rgba(255,255,255,0.6) !important;
	transform: translateY(-1px) !important;
	text-decoration: none !important;
}

.pnb-nav-bar .pnb-btn:active {
	transform: translateY(0px) !important;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1), inset 0 1px 3px rgba(0,0,0,0.08) !important;
}

.pnb-nav-bar .pnb-btn:focus-visible {
	outline: 2px solid #1E6FD9 !important;
	outline-offset: 2px !important;
}

/* Active / highlighted button */
.pnb-nav-bar .pnb-btn.pnb-btn--active {
	background-color: #1E6FD9 !important;
	background-image: linear-gradient(180deg, #2E7EE8 0%, #1560C8 100%) !important;
	border-color: #1254B5 !important;
	color: #ffffff !important;
	font-weight: 700 !important;
	letter-spacing: 0.015em !important;
	box-shadow: 0 2px 8px rgba(21, 96, 200, 0.45),
	            0 1px 3px rgba(21, 96, 200, 0.3),
	            inset 0 1px 0 rgba(255,255,255,0.18) !important;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.15) !important;
}

.pnb-nav-bar .pnb-btn.pnb-btn--active:hover {
	background-color: #1558B0 !important;
	background-image: linear-gradient(180deg, #2271D8 0%, #1050A8 100%) !important;
	border-color: #0E46A0 !important;
	color: #ffffff !important;
	box-shadow: 0 4px 12px rgba(21, 96, 200, 0.50),
	            0 2px 5px rgba(21, 96, 200, 0.35),
	            inset 0 1px 0 rgba(255,255,255,0.18) !important;
	transform: translateY(-1px) !important;
}

.pnb-nav-bar .pnb-btn.pnb-btn--active:active {
	background-image: linear-gradient(180deg, #1560C8 0%, #1254B5 100%) !important;
	transform: translateY(0px) !important;
	box-shadow: 0 1px 4px rgba(21, 96, 200, 0.35),
	            inset 0 1px 3px rgba(0,0,0,0.12) !important;
}

@media (max-width: 600px) {
	.pnb-nav-bar .pnb-btn {
		font-size: 12.5px !important;
		padding: 8px 16px !important;
	}
}