.pagy {
  display: flex;
  gap: var(--spacing-xxs);
  font-family: var(--font-sans);
  font-size: var(--text-s);
  line-height: var(--text-s--line-height);
  letter-spacing: var(--text-s--letter-spacing);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-secondary);
}
.pagy a:not(.gap) {
  display: block;
  text-decoration: none;
  border-radius: var(--radius-s);
  background-color: var(--color-surface);
  padding: var(--spacing-xxs) var(--spacing-s);
  color: inherit;
}
.pagy a:not(.gap):hover {
  background-color: var(--color-surface-sunken);
}
.pagy a:not(.gap):not([href]) {
  /* disabled links */
  cursor: default;
  background-color: var(--color-surface-sunken);
  color: var(--color-text-disabled);
}
.pagy a:not(.gap).current {
  background-color: var(--color-accent-solid);
  color: var(--color-accent-foreground);
}
.pagy label {
  white-space: nowrap;
  display: inline-block;
  border-radius: var(--radius-s);
  background-color: var(--color-surface-sunken);
  padding: var(--spacing-xxs) var(--spacing-s);
}
.pagy label input {
  line-height: var(--text-m--line-height);
  border-radius: var(--radius-xs);
  border-style: none;
  background-color: var(--color-surface);
}