/**
 * The pager element
 */

.pbuic-pager {
    margin: 2em 0 1em;
    padding: 0;
    list-style: none;
}

.pbuic-pager li {
    display: inline-block;
    margin: 0 .5em .5em 0;
}

.pbuic-pager a,
.pbuic-pager span {
    display: inline-block;
    min-width: 3ex;
    height: 3ex;
    margin: 0;
    border-radius: 50%;
    line-height: 3.3ex;
    text-decoration: none;
    text-align: center;
    vertical-align: middle;
}

/**
 * Active state
 */

.pbuic-pager .pgr-active span {
    background: #375fc3;
    color: #fff
}

/**
 * Inactive state
 */

.pbuic-pager .pgr-inactive {
    display: none;
}

/**
 * Spacers ("...")
 */

.pbuic-pager .pgr-space span {
    display: block;
    height: 18px;
}

.pbuic-pager-container {
    container: pbuic-pager / inline-size;
}

@container pbuic-pager (max-width: 400px) {
    .pbuic-pager-container .pgr-previous a,
    .pbuic-pager-container .pgr-next a {
        text-indent: -999em;
    }
}