.pagy.series-nav {
  display: flex;
  justify-content: center;
  gap: calc(var(--inline-space) * 0.5);
  padding: var(--inline-space) 0;

  a {
    font-family: var(--font-mono);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: var(--button-size-small);
    height: var(--button-size-small);
    padding-inline: calc(var(--inline-space) * 0.75);
    border-radius: calc(var(--button-size-small) / 2);
    background-color: var(--color-button-bg);
    color: var(--color-text);
    font-size: var(--button-font-size-small);
    transition: background-color 0.2s, color 0.2s;

    &:hover:not([aria-disabled="true"]) {
      background-color: var(--primary-color);
      color: var(--color-text-dark);
    }

    &[aria-current="page"] {
      background-color: var(--primary-color);
      color: var(--color-text-dark);
    }

    &[aria-disabled="true"]:not([aria-current="page"]) {
      opacity: 0.3;
      pointer-events: none;
    }
  }
}