/*****************************************************************
PAGINADOR
*****************************************************************/
.pagination{
    background: none;
    position: relative;
    padding: 1px;
    font-size: 1rem;
    overflow: hidden;
    min-height: 2rem;
}

.pagination{
    display: flex;
    gap: .25rem;
}


.pagination li{
    display: inline-flex;
    height: 2rem;
    margin-left: 1px;
    vertical-align: top;
}

.pagination a{
    line-height: 20px;
    padding: 2px;
    height: 2rem;
    min-width: 2rem;
    display: block;
    position: relative;
    border: .25rem solid transparent;
    -ms-user-select: none;
    user-select: none;
    text-align: center;
    border-radius: .2rem;
}
.pagination li:first-child a{
    border-radius: .5rem .2rem .2rem .5rem;
}

.pagination li:last-child a{
    border-radius: .2rem .5rem .5rem .2rem;
}

.pagination li:first-child a:after,
.pagination li:last-child a:after {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    border: .5rem solid transparent;
    top: .25rem;
}

.pagination li:first-child a:after {
    left: 0;
}

.pagination li:last-child a:after {
    right: 0;
}

.pagination a{
    transition: .5s ease-in-out all;
}

.pagination a[href]:hover{
    transition: .20s ease-in-out all;
}

.pagination a:not([href]){
    transition: .5s ease-in-out all;
}

.pagination li:first-child a:after {
    border-right-color: var(--pager-next);
}

.pagination li:last-child a:after {
    border-left-color: var(--pager-next);
}

.pagination li a[href]{
    background-color: var(--pager-background);
    color: var(--pager-color);
}

.pagination li a[href]:hover{
    background-color: var(--pager-hover);
    color: var(--pager-color);
}

.pagination li.active a[href]{
    background-color: var(--pager-selected);
    color: var(--pager-color-hover);
}