.pagination-box{
    min-height:50px;
}
.pagination-box.with-loader.processing{
    position: relative;
}
/* HTML: <div class="loader"></div> */
.pagination-box.with-loader.processing:before {
    position: absolute;
    left: calc( 50% - 19px );
    top: calc( 50% - 2px );
    content:"";
    color: rgb(252 98 98);
    z-index: 1000;
    width: 4px;
    aspect-ratio: 1;
    border-radius: 50%;
    box-shadow: 19px 0 0 7px, 38px 0 0 3px, 57px 0 0 0;
    transform: translateX(-38px);
    animation: l21 .5s infinite alternate linear;
}

@keyframes l21 {
    50%  {box-shadow: 19px 0 0 3px, 38px 0 0 7px, 57px 0 0 3px}
    100% {box-shadow: 19px 0 0 0  , 38px 0 0 3px, 57px 0 0 7px}
}

.pagination_box_pager_container {
    display: flex;
    gap: 8px;
    justify-content: center;
    flex-wrap: wrap;
    margin: 20px 0;
    padding: 0;
    text-align: center;
    font-size: 12.8px;
}
.pagination_box_pager_container .extend,
.pagination_box_pager_container > span a,
.pagination_box_pager_container > .pager span a {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    width: 40px;
    height: 40px;
    padding: 5px 10px;
    color: #b4b4b4;
    border: 1px solid transparent;
    border-radius: 8px;
    line-height: 0;
}
.pagination_box_pager_container .extend:hover:not(.active),
.pagination_box_pager_container > span a:hover:not(.active),
.pagination_box_pager_container > .pager span a:hover:not(.active) {
    border-color: #ea5455;
}
.pagination_box_pager_container > span {
    display: flex;
    gap: 8px;
}
.pagination_box_pager_container > span a.active {
    background-color: #ea5455;
    color: #fff;
}
.pagination_box_pager_container > span a.page {
    position: relative;
}
.pagination_box_pager_container > span a.page.first::before, .pagination_box_pager_container > span a.page.prev::before {
    rotate: -90deg;
}
.pagination_box_pager_container > span a.page.first::before {
    content: "";
    rotate: -180deg;
}
.pagination_box_pager_container > span a.page.last::before {
    content: "";
    rotate: 0deg;
    position: relative;
    top: 1px;
    left: 2px;
}
.pagination_box_pager_container .pager {
    display: inline-flex;
    gap: 8px;
}
.pagination_box_pager_container .pager span a {
    font-family: monospace;
    letter-spacing: -3px;
}
.pagination_box_pager_container .pager span.last a, .pagination_box_pager_container .pager span.next a, .pagination_box_pager_container .pager span.first a, .pagination_box_pager_container .pager span.prev a {
    color: #ea5455;
    font-weight: 600;
    font-size: 18px;
}