.pagy {
  @apply flex flex-wrap items-center justify-center gap-2 text-sm font-semibold text-slate-500;

  a:not(.gap) {
    @apply inline-flex items-center justify-center rounded-xl border border-slate-200 bg-white px-3 py-1.5 text-slate-600 shadow-sm transition;

    &:hover {
      @apply border-slate-300 bg-slate-50;
    }

    &:not([href]) { /* disabled links */
      @apply cursor-default border-slate-200 bg-slate-100 text-slate-300 shadow-none;
    }

    &.current {
      @apply text-white;
      background-color: var(--accent);
      border-color: transparent;
      box-shadow: 0 8px 18px rgba(254, 95, 10, 0.18);

      &:hover {
        filter: brightness(1.05);
      }
    }
  }

  .pagy-ellipsis {
    @apply inline-flex items-center justify-center px-2 text-slate-400;
  }

  label {
    @apply inline-flex items-center gap-2 whitespace-nowrap rounded-xl border border-slate-200 bg-white px-3 py-1.5 text-slate-500 shadow-sm;

    input {
      @apply w-16 rounded-lg border border-slate-200 bg-slate-50 px-2 py-1 text-center text-sm text-slate-600;
    }
  }
}