.paginator {
  @include flex-align-items();

  font-size: 12px;
  color: $palette-neutral-900;
  justify-content: space-between;
  width: 100%;
}

.paginator__button {
  color: $palette-neutral-900;
  width: 24px;
  height: 24px;
  justify-content: center;
  background: $white;
  border: 1px solid $palette-neutral-400;
  font-size: 14px;

  @include flex-align-items();
  @include add-elevation($elevation-low);
  @include rounded($rounded-md);

  &:hover:not(.paginator__button--disabled) {
    color: $palette-neutral-1200;
  }
}

.paginator__content {
  display: flex;
  text-align: center;
  align-items: center;
}

.paginator__button--disabled {
  cursor: initial;
  background-color: $palette-neutral-100;
  color: $palette-neutral-700;
}

.paginator__count {
  padding: 0 10px;
  color: $color-neutral-500;
  border-right: solid 1px $color-neutral-400;
}

.paginator__current-page {
  font-weight: bold;
}

.paginator__content-text {
  text-transform: capitalize;
}

.paginator__content-current-page {
  font-weight: bold;
}

.paginator__content-input {
  border: 1px solid $palette-neutral-400;
  height: 24px;
  padding: 2px 8px;
  font-size: 12px;
  text-align: center;
  margin: 0 6px;

  @include rounded($rounded-md);
  @include add-elevation($elevation-low);
}