.pagination-standard {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: center;
  margin-block: 56px 24px;
}

@media (max-width: 959px) {
  .pagination-standard {
    gap: 8px;
    margin-block: 40px 16px;
  }
}

.pagination-standard a,
.pagination-standard span {
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgb(var(--color-text));
  text-decoration: none;
}

.pagination-standard__parts-wrapper,
.pagination-standard__parts {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
}

@media (max-width: 959px) {
  .pagination-standard__parts-wrapper,
  .pagination-standard__parts {
    gap: 6px;
  }
}

.pagination-standard__parts-wrapper--reverse,
.pagination-standard__parts--reverse {
  flex-direction: row-reverse;
}

.pagination-standard__item {
  display: flex;
  align-items: center;
  justify-content: center;
}

.pagination-standard__button {
  width: 44px;
  height: 44px;
  color: rgb(var(--color-text)) !important;
  background: transparent;
  border: 1px solid rgba(var(--color-text), 0.28);
  border-radius: 0;
  transition: color 180ms ease, background-color 180ms ease, border-color 180ms ease;
}

.pagination-standard__button:hover,
.pagination-standard__button:focus-visible {
  color: rgb(var(--color-background)) !important;
  background: rgb(var(--color-text));
  border-color: rgb(var(--color-text));
}

.pagination-standard__button.disabled {
  cursor: not-allowed;
  opacity: 0.32;
}

@media (max-width: 959px) {
  .pagination-standard__button {
    width: 40px;
    height: 40px;
  }

  .pagination-standard__button .icon {
    width: 12px;
  }
}

.pagination-standard__button--previous {
  transform: rotate(180deg);
}

.pagination-standard__button svg {
  width: 12px;
  height: 12px;
}

.pagination-standard__indicator {
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid rgba(var(--color-text), 0.28);
  transition: color 180ms ease, background-color 180ms ease, border-color 180ms ease;
}

.pagination-standard__indicator:not(.active):not(.is-text):hover,
.pagination-standard__indicator:not(.active):not(.is-text):focus-within {
  border-color: rgb(var(--color-text));
}

.pagination-standard__indicator.is-text {
  width: auto;
  min-width: 22px;
  border-color: transparent;
}

.pagination-standard__indicator.active {
  color: rgb(var(--color-background));
  background: rgb(var(--color-text));
  border-color: rgb(var(--color-text));
}

.pagination-standard__indicator.active .pagination-standard__indicator-text {
  color: rgb(var(--color-background));
}

@media (max-width: 959px) {
  .pagination-standard__indicator {
    width: 40px;
    height: 40px;
    padding: 0;
  }

  .pagination-standard__indicator.active {
    display: flex;
  }

  .pagination-standard__indicator.is-text {
    width: auto;
    min-width: 14px;
  }

  .pagination-standard__parts-wrapper,
  .pagination-standard__parts {
    gap: 4px;
  }
}
