.pagination-middle {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px 0;
    width: 100%
}

.pagination-middle .pagination {
    display: inline-block
}

.pagination-middle .pagination .page-numbers {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 36px;
    width: 36px;
    margin: 0 2px;
    color: var(--text);
    float: left;
    border-radius: var(--rounded-sm);
    border: 1px solid var(--border)
}

.pagination-middle .pagination .page-numbers.current {
    background-color: var(--primary);
    color: var(--white);
    font-weight: 600
}

.pagination-middle .pagination .page-numbers.hidden {
    display: none
}

.pagination-middle .pagination .page-numbers.next svg,
.pagination-middle .pagination .page-numbers.previous svg {
    height: 22px;
    width: 22px
}

.pagination-middle .pagination .page-numbers.next {
    margin-left: 12px
}

.pagination-middle .pagination .page-numbers.previous {
    margin-right: 12px
}

.pagination-middle .pagination .page-numbers:hover:not(.active) {
    background-color: var(--primary);
    color: var(--white)
}

.number-of-results {
    margin-bottom: 30px
}

.pagination-side {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 0
}

.pagination-side .pagination {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    width: 100%
}

.pagination-side .pagination .pagination-right {
    display: flex;
    align-items: center
}

.pagination-side .pagination .count {
    margin-right: 10px
}

.pagination-side .pagination a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 36px;
    padding: 5px;
    width: 36px;
    margin: 0 2px;
    color: var(--text);
    float: left;
    border-radius: var(--rounded-full);
    background-color: var(--zinc-100)
}

.pagination-side .pagination a svg {
    height: 20px;
    width: 20px
}

.pagination-side .pagination a:hover {
    background-color: var(--primary);
    color: var(--bg-zero)
}

.pagination-side .pagination a.disabled {
    display: none
}

.pagination-side .previous-link svg {
    margin-right: 4px
}

.pagination-side .next-link svg {
    margin-left: 4px
}

.pagination-side .number-of-results {
    margin-bottom: 0
}
