/****************************
 * Module Pagination
****************************/
.site-pagination {
    --pagination-size:32px; --spacing:32px;
    --spacing-element-top:35px;
    padding-top:var(--spacing-element-top);
    position:relative;
}
.site-pagination:after {
    content:""; display:block;
    width:var(--vii-100vw); height:2px; background:var(--vii-color-neutral-100);
    position:absolute; top:0; left:calc(-1 * var(--vii-gap-side));
}

/*arrow*/
.site-pagination .page-arrow {
    width:var(--pagination-size); height:var(--pagination-size);
    display:flex; align-items:center; justify-content:center;
    border:2px solid var(--vii-color-primary); border-radius:50%;
    color:var(--vii-color-primary); font-size:10px;
    transition:var(--vii-transition);
}
.site-pagination .page-arrow i {line-height:1;}
.site-pagination .page-arrow i:before {font-weight:900;}
.site-pagination .page-arrow:hover {background:var(--vii-color-primary); color:#fff;}

/*number*/
.site-pagination ul {
    list-style:none; margin:0 calc(3 * var(--spacing) / 4);
    display:flex; align-items:center;
}
.site-pagination ul li {padding:0; margin:0 calc(var(--spacing) / 4);}
.site-pagination a.page-numbers {color:var(--vii-color-text);}
.site-pagination a.page-numbers:hover {text-decoration:none; color:var(--vii-color-primary);}
.site-pagination ul li .current {
    margin:0 2px;
    width:var(--pagination-size); height:var(--pagination-size);
    display:flex; align-items:center; justify-content:center;
    background:var(--vii-color-primary); color:#fff; font-weight:700;
    clip-path:polygon(0 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%);
}


/* disabled */
.site-pagination a.disabled {
    pointer-events:none;
    color:var(--vii-color-neutral-200); border-color:var(--vii-color-neutral-200);
}

/****************************
 * Module Pagination Responsive
****************************/
@media only screen and (max-width:480px) {
    .site-pagination {--spacing:20px;}
    .site-pagination ul, .site-pagination ul li {margin:0 calc(var(--spacing) / 2);}
}