.wp-pagenavi {
    margin: 50px 0;
    display: flex;
    gap: 10px;
}

.wp-pagenavi a.page,
.wp-pagenavi span.current,
.wp-pagenavi a.nextpostslink  {
    display: block;
    width: 30px;
    height: 30px;
    text-align: center;
    font: 18px 'urbanist-bold', sans-serif;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
}

.wp-pagenavi a.last,
.wp-pagenavi .extend {
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    font: 16px 'urbanist-bold', sans-serif;
}

.wp-pagenavi a.page {
    color: var(--link-color);
    border: 1px solid var(--link-color);
    transition: all .2s ease-in;
}
.wp-pagenavi a.page:hover {
    color: var(--button-primary-color);
    background-color: var(--button-primary-bkg-color);
}

.wp-pagenavi span.current {
    background-color: var(--button-primary-bkg-color);
    color: var(--button-primary-color);
    border: 1px solid var(--btn-primary-border-color ); 
}