.uc-pagination {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--spacing-2); /* 8px */
}
.uc-pagination.left {
    justify-content: flex-start;
}
.uc-pagination.center {
    justify-content: center;
}
.uc-pagination.right {
    justify-content: flex-end;
}
.uc-pagination a:hover {
    color: var(--color-neutral-text);
}
.pagination__options {
    display: flex;
    align-items: center;
    gap: var(--spacing-1-5); /* 6px */
}
.pagination__total-text {
    margin-right: var(--spacing-2); /* 8px */
    font-size: var(--font-size-base); /* 16px */
    color: var(--color-neutral-text);
   
}
.pagination__options {
    margin-left: var(--spacing-3); /* 12px */
    font-size: 16px;
}
:is(.pagination__prev, .pagination__item, .pagination__jump-prev, .pagination__jump-next, .pagination__next) {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    height: 32px;
    padding: 0 8px;
    /*border: 1px solid var(--color-neutral-border-secondary);*/
    border-radius: var(--radius-base); /* 6px */
    cursor: pointer;
    user-select: none;
    font-size: var(--font-size-base); /* 16px */
    color: var(--color-neutral-title);
    background-color: var(--color-neutral-bg);
    transition: all var(--transition-duration-200) var(--transition-timing-ease);
}
:is(.pagination__prev, .pagination__item, .pagination__jump-prev, .pagination__jump-next, .pagination__next) a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: inherit;
}
.pagination__item.active {
    background-color: var(--color-neutral-bg);
    border-color: #000000;
    box-shadow: none;
}
.pagination__item.active a {
    font-weight: var(--font-weight-semibold);
    color: var(--color-neutral-title);
}
:is(.pagination__prev, .pagination__item:not(.active), .pagination__next):hover {
    border-color: #000000;
}
:is(.pagination__prev, .pagination__next) {
    font-size: 20px;
    font-weight: var(--font-weight-light);
}
:is(.pagination__prev, .pagination__next) a {
    color: #12141D; /* fallback for var(--color-neutral-title) */
    font-weight: 300;
}
:is(.pagination__prev, .pagination__next, .pagination__jump-prev, .pagination__jump-next) .iconfont {
    font-size: 18px;
}
.icon__ellipsis {
    color: #12141D; /* fallback for var(--color-neutral-title) */
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 1px;
}
.icon__left,
.icon__right {
    font-size: 18px;
    font-weight: 700;
    color: #12141D; /* fallback for var(--color-neutral-title) */
}
:is(.pagination__jump-prev .icon__left, .pagination__jump-next .icon__right) {
    display: none;
    opacity: 0;
}
:is(.pagination__jump-prev, .pagination__jump-next):hover .icon__ellipsis{
    display: none;
}
.pagination__jump-prev:hover .icon__left,
.pagination__jump-next:hover .icon__right {
    color: var(--color-primary);
    display: initial;
    transition: all var(--transition-duration-300) var(--transition-timing-ease);
    opacity: 1;
}
:is(.pagination__jump-prev, .pagination__jump-next):hover {
    border-color: #000000;
}
.select__pagination-size-changer .uc-select-selection {
    min-width: 52px;
}
.pagination__input {
    width: 58px;
    margin: 0 var(--spacing-1-5); /* 6px */
    height: 32px;
    padding: 0 var(--spacing-2);
    border: 1px solid var(--color-neutral-border-secondary);
    border-radius: var(--radius-base);
    font-size: var(--font-size-base); /* 16px */
    text-align: center;
    transition: all var(--transition-duration-200) var(--transition-timing-ease);
}
.pagination__input:hover {
    border-color: black;
}
.pagination__input:focus {
    outline: none;
    border-color: black;
    box-shadow: none;
}

.pagination__prev.disabled,
.pagination__next.disabled {
    cursor: not-allowed;
    opacity: 0.5;
    background-color: var(--color-neutral-bg-disabled);
}
:is(.pagination__prev.disabled, .pagination__next.disabled):hover {
    background-color: var(--color-neutral-bg-disabled);
    border-color: var(--color-neutral-border-secondary);
    transform: none;
}
:is(.pagination__prev.disabled, .pagination__next.disabled) a {
    color: var(--color-neutral-text-disabled);
}