/****************************
 * Pagination
****************************/
/* General */
.vii-pagination {
    --spacing:25px;
    --pagi-size:34px;

    padding-top:19px;
    border-top:1px solid var(--vii-color-light-gold);
}
.vii-pagination ul.page-numbers {margin:0 var(--spacing); gap:12px;}

.vii-pagination a, .vii-pagination span {
    width:var(--pagi-size);height:var(--pagi-size);
    background-color:transparent;
    opacity:.7;
}
.vii-pagination span {
    display:flex;align-items:center;justify-content:center;
}

/* Arrows */
.vii-pagination .page-arrow {opacity:1;}

/* disabled */
.vii-pagination a.disabled {opacity:.5; pointer-events:none;}

/* current and hover */
.vii-pagination span.current,
.vii-pagination a:hover,
.vii-pagination a:not(.disabled):focus {
    opacity:1;
    color:var(--vii-color-light-yellow);
    background-color:var(--vii-color-dark-gold);
    box-shadow:inset 1px 1px 1px #fff, inset -1px 0px 0.6px rgba(0, 0, 0, 0.25);
}


/****************************
 * Pagination Responsive
****************************/
@media only screen and (min-width:1700px) {
    .vii-pagination {
        --spacing:32px;
        --pagi-size:48px;
    }
}
@media only screen and (max-width:1024px) {
    .vii-pagination {--spacing:20px;}
    .vii-pagination ul.page-numbers {gap:14px;}
}

@media only screen and (max-width:480px) {
    .vii-pagination {--spacing:10px;}
    .vii-pagination ul.page-numbers {gap:5px;}
}