/* Uncode-Standard-Navigation ausblenden, aber NICHT unsere */
nav.post-navigation:not(.post-navigation--custom) {
  display: none !important;
}

/* Unser Layout: links | mitte | rechts */
.post-navigation--custom .navigation {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 16px;
  width: 100%;
  padding-inline: 20px;            /* verhindert, dass der rechte Pfeil "anstößt" */
}

.post-navigation--custom .page-prev { justify-self: start; }
.post-navigation--custom .nav-back  { justify-self: center; }
.post-navigation--custom .page-next { justify-self: end; }

.post-navigation--custom .navigation > li { list-style: none; }

/* Links/Buttons */
.post-navigation--custom a,
.post-navigation--custom span.disabled {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
}

/* Reihenfolge sicherstellen:
   Prev:  [Icon][Titel]
   Next:  [Titel][Icon]  (Icon außen rechts)
*/
.post-navigation--custom .page-next a { flex-direction: row; }
.post-navigation--custom .page-next a .nav-label { order: 1; }
.post-navigation--custom .page-next a .nav-icon  { order: 2; }

/* Icon-Größen */
.post-navigation--custom .nav-icon { 
  width: 40px;                 /* Pfeile */
  height: auto;
  transition: transform .15s ease, opacity .15s ease;
}
.post-navigation--custom .nav-back .nav-icon {
  width: 28px;                 /* mittleres Icon kleiner */
}

.post-navigation--custom a:hover .nav-icon { transform: translateY(-1px); opacity: .9; }

/* Titel (nur Titel – keine "Prev/Next"-Wörter) */
.post-navigation--custom .nav-label {
  font-size: 16px;
  line-height: 1.2;
  font-weight: 600;
  max-width: 34ch;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Responsiv */
@media (max-width: 640px) {
  .post-navigation--custom .nav-icon { width: 34px; }
  .post-navigation--custom .nav-back .nav-icon { width: 24px; }
  .post-navigation--custom .nav-label { max-width: 22ch; }
}
/* Wenn es keinen Nachbar-Post gibt: Pfeil/Platzhalter ausblenden */
.post-navigation--custom .disabled { 
  display: none !important;
}