/**
 * Artikel-zu-Artikel-Navigation (pdp-neighbors.php/.js).
 *
 * Bewusst dezent (Axel 2026-07-28): keine gefüllten Buttons, nur ruhige
 * Ghost-Links mit Chevron. Oben schmal über der Kaufzeile, unten nach allen
 * Sektionen. Verschwindet komplett, solange JS die Nachbarn nicht geliefert hat
 * (Attribut hidden), damit im gecachten HTML nichts Totes steht.
 */

.zwcl-artnav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	margin: 0 0 1rem;
	font-size: 0.9rem;
}

.zwcl-artnav--bottom {
	margin: 1.75rem 0 0.5rem;
	padding-top: 1rem;
	border-top: 1px solid var(--zcf-border, #E3DCCF);
}

.zwcl-artnav[hidden] {
	display: none;
}

.zwcl-artnav__btn {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	padding: 0.35rem 0.6rem;
	border-radius: var(--radius-pill, 999px);
	color: var(--zcf-muted, #6B6459);
	text-decoration: none;
	line-height: 1.2;
	transition: color 0.15s ease, background-color 0.15s ease;
	max-width: 45%;
}

.zwcl-artnav__btn[hidden] {
	display: none;
}

.zwcl-artnav__btn:hover,
.zwcl-artnav__btn:focus-visible {
	color: var(--zcf-petrol, #23434A);
	background: var(--zcf-cream, #F6F1E7);
}

.zwcl-artnav__btn--next {
	margin-left: auto; /* rechts halten, auch wenn „Zurück" fehlt */
}

.zwcl-artnav__chevron {
	font-size: 1.15em;
	line-height: 1;
}

.zwcl-artnav__label {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.zwcl-artnav__meta {
	flex: 0 1 auto;
	text-align: center;
	color: var(--zcf-muted, #6B6459);
	font-size: 0.82rem;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Auf schmalen Screens die Mitte zugunsten der Pfeile ausblenden. */
@media (max-width: 480px) {
	.zwcl-artnav__meta {
		display: none;
	}
	.zwcl-artnav__btn {
		max-width: 48%;
	}
}