/* stylelint-disable no-descending-specificity */
///
/// Solid State by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///

/* Pagination */

ul.pagination {
    cursor: default;
    list-style: none;
    padding-left: 0;

    li {
        display: inline-block;
        padding-left: 0;
        vertical-align: middle;

        > .page {
            @include vendor('transition', (
                'background-color #{_duration(transition)} ease-in-out',
                'color #{_duration(transition)} ease-in-out'
            ));
            border-bottom: 0;
            border-radius: _size(border-radius);
            display: inline-block;
            height: 1.5em;
            line-height: 1.5em;
            margin: 0 0.125em;
            min-width: 1.5em;
            padding: 0 0.5em;
            text-align: center;

            &:hover {
                background-color: _palette(border-bg);
            }

            &.active {
                background-color: _palette(accent);
            }
        }

        &:first-child {
            padding-right: 0.75em;
        }

        &:last-child {
            padding-left: 0.75em;
        }
    }

    @include breakpoint('<=xsmall') {
        li {
            &:nth-child(n+2):nth-last-child(n+2) {
                display: none;
            }

            .button {
                width: 100%;
            }

            &:first-child {
                width: calc(50% - 2px);
                text-align: left;
                padding-right: 0.325em;
            }

            &:last-child {
                width: calc(50% - 2px);
                text-align: right;
                padding-left: 0.325em;
            }
        }
    }
}
