/* =========================================================
   HELIOS PREVIOUS / NEXT — CLEAN
   Do not modify native text structure.
   ========================================================= */

.eleon-pns-card{
  position:relative!important;
  min-height:82px!important;
  overflow:hidden!important;
}

/* Remove underline only inside the two navigation cards. */
.eleon-pns-card a,
.eleon-pns-card a:visited,
.eleon-pns-card a:hover,
.eleon-pns-card a:focus,
.eleon-pns-card a:active{
  text-decoration:none!important;
}

/* Native title changes color on hover, no line. */
.eleon-pns-card a{
  transition:color .14s ease;
}

.eleon-pns-card a:hover{
  color:var(--helios-accent,#78a6ff)!important;
}

/*
 * Reserve a clean side area for the icon.
 * Previous icon on left, Next icon on right.
 */
.eleon-pns-card.is-prev{
  padding-left:64px!important;
}

.eleon-pns-card.is-next{
  padding-right:64px!important;
}

/* Small Helios icon chip. */
.eleon-pns-decoration{
  position:absolute;
  top:50%;
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  transform:translateY(-50%);
  border:1px solid rgba(120,130,145,.20);
  border-radius:8px;
  background:rgba(255,255,255,.012);
  color:rgba(150,181,235,.70);
  pointer-events:none;
  box-sizing:border-box;
}

.eleon-pns-card.is-prev
.eleon-pns-decoration{
  left:20px;
}

.eleon-pns-card.is-next
.eleon-pns-decoration{
  right:20px;
}

.eleon-pns-decoration svg{
  width:15px;
  height:15px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.55;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/*
 * Keep native PREVIOUS / NEXT label and title alignment.
 * Only add breathing room so icon never overlaps.
 */
.eleon-pns-card.is-prev > a,
.eleon-pns-card.is-prev a{
  text-align:left!important;
}

.eleon-pns-card.is-next > a,
.eleon-pns-card.is-next a{
  text-align:right!important;
}

@media(max-width:700px){
  .eleon-pns-card.is-prev{
    padding-left:54px!important;
  }

  .eleon-pns-card.is-next{
    padding-right:54px!important;
  }

  .eleon-pns-decoration{
    width:26px;
    height:26px;
  }

  .eleon-pns-card.is-prev
  .eleon-pns-decoration{
    left:16px;
  }

  .eleon-pns-card.is-next
  .eleon-pns-decoration{
    right:16px;
  }
}