:root, ::before, ::after, ::selection {
--pagination-outer-height: calc(var(--pagination-inner-height) + 2 * var(--pagination-border-width));
--pagination-inner-height: 2em;
--pagination-border-width: 1px;
--pagination-color: var(--primary);
--pagination-bg-color: var(--white);
--pagination-border-color: var(--secondary);
--pagination-idle-color: var(--dark);
--pagination-disabled-color: var(--light);
--pagination-hover-color: var(--pagination-bg-color);
--pagination-hover-bg-color: var(--pagination-color);
--pagination-hover-border-color: var(--pagination-color);
--pagination-jumper-hover-color: var(--pagination-bg-color);
--pagination-jumper-hover-bg-color: var(--pagination-idle-color);
}

.pagination-control ::selection {
color: inherit;
background-color: transparent;
}

.pagination-control, .pagination-control * {
box-sizing: content-box;
user-select: none;
}

.pagination-control {
position: relative;
height: var(--pagination-outer-height);
font-size: 1.2rem;
line-height: var(--pagination-inner-height);
}

.pagination-control > * {
vertical-align: top;
display: inline-block;
height: var(--pagination-outer-height);
}

.pagination-control .page-item {
vertical-align: top;
display: inline-block;
height: var(--pagination-outer-height);
}

.pagination-control label.page-link, .pagination-control .page-link label {
display: inline-block;
min-width: var(--pagination-inner-height);
height: var(--pagination-inner-height);
margin: 0 0 0 calc(-1 * var(--pagination-border-width));
text-decoration: none;
cursor: pointer;
}

.pagination-control label:hover {
transition: all 0s;
}

.pagination-control .page-item.active .page-link {
color: var(--pagination-bg-color);
background-color: var(--pagination-color);
border-color: var(--pagination-color);
cursor: default;
}

.pagination-control .page-item.fast-paging-previous {
margin-right: calc(var(--pagination-inner-width) / 8);
}

.pagination-control .page-item.previous + .page-item.fast-paging-previous, .pagination-control .page-item.fast-paging-next, .pagination-control .page-item.fast-paging-next + .page-item.next {
margin-left: calc(var(--pagination-inner-width) / 8);
}

.pagination-control .page-link {
display: inline-block;
padding: 0;
line-height: inherit;
color: var(--pagination-color);
background-color: var(--pagination-bg-color);
border-color: var(--pagination-border-color);
}

.pagination-control .page-item:not(.active) .page-link:hover {
color: var(--pagination-hover-color);
background-color: var(--pagination-hover-bg-color);
border-color: var(--pagination-hover-border-color);
}

.pagination-control .page-item.disabled label.page-link, .pagination-control .page-item.disabled .page-link label {
color: var(--pagination-disabled-color);
}

.pagination-control label i {
font-size: inherit;
}

.pagination-control .pagination-ellipsis {
padding: 0 0.5ex;
}

.pagination-control .pagination-jumper {
display: inline-block;
min-width: 2em;
border: var(--pagination-border-width) solid var(--pagination-border-color);
background-color: var(--pagination-bg-color);
font: inherit;
text-decoration: none;
}

.pagination-control .pagination-jumper:hover, .pagination-control .pagination-jumper input[type="text"]:focus {
background-color: var(--pagination-jumper-hover-bg-color);
color: var(--pagination-jumper-hover-color);
}

.pagination-control .pagination-jumper input[type="text"] {
vertical-align: top;
height: var(--pagination-inner-height);
padding: 0;
outline: none;
border: none;
text-align: center;
font: inherit;
color: inherit;
background-color: Transparent;
}

.pagination-control .pagination-total {
display: inline-block;
padding: 0 1ex 0 0.5ex;
border: var(--pagination-border-width) solid transparent;
}

.pagination-control .pagination-elements {
position: absolute;
right: 0;
height: var(--pagination-outer-height);
padding: 0 1ex;
background-color: var(--pagination-bg-color);
}