.pagination {
  --_active-bar-height: calc(0.1875rem * var(--body-scale));
  --_active-bar-gap: calc(0.3125rem * var(--body-scale));
  padding-bottom: calc((var(--_active-bar-height) + var(--_active-bar-gap)) * var(--body-scale));
}

.pagination .pagination-list {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  column-gap: calc(0.625rem * var(--body-scale));
  row-gap: calc((var(--_active-bar-height) + var(--_active-bar-gap) + 0.625rem) * var(--body-scale));
  justify-content: center;
}

.pagination a,
.pagination span {
  display: flex;
  min-width: calc(2.75rem * var(--body-scale));
  min-height: calc(2.75rem * var(--body-scale));
  border-radius: calc(0.22px * var(--layout-radius));
  justify-content: center;
  align-items: center;
  padding: calc(.625rem * var(--body-scale));
  text-decoration: none;
}

.pagination .prev[disabled],
.pagination .next[disabled] {
  cursor: default;
  opacity: 0.6;
}

.pagination .page-count.active {
  cursor: default;
  -webkit-text-stroke: 0px;
  font-weight: 700;
  position: relative;
}

.pagination .page-count.active::after {

  content: "";
  display: block;
  width: 100%;
  height: var(--_active-bar-height);
  background-color: rgb(var(--accent-color));
  position: absolute;
  left: 0;
  bottom: calc(((var(--_active-bar-height) + var(--_active-bar-gap)) * var(--body-scale)) * -1);
  border-radius: calc(0.02px * var(--layout-radius));
}

.pagination .page-count.ellipsis {
  cursor: default;
  color: rgb(var(--text-color));
}

.pagination .page-count {
  border: 1px solid rgb(var(--border-color));
}

.pagination .page-count:not(.active):not(.ellipsis):hover {
  -webkit-text-stroke: 0.5px;
}

ul.pagination-list.mobile-pagination {
  margin-top: 20px;
  display: none;
}

@media only screen and (max-width: 468px) {
  ul.pagination-list.mobile-pagination {
    display: flex;
  }

  .pagination-list:not(.mobile-pagination):has(li:nth-child(7)) .prev-btn,
  .pagination-list:not(.mobile-pagination):has(li:nth-child(7)) .next-btn {
    display: none;
  }

  .pagination-list+ul.pagination-list.mobile-pagination {
    display: none;
  }

  .pagination-list:has(li:nth-child(7))+.pagination-list {
    display: flex;
  }

  .product-result-wrapper .product-result-head .pagination,
  .product-result-wrapper .product-result-footer .pagination {
    margin-inline: auto;
  }
}