.pagination {
    display: flex;

    &__icon {
        flex-shrink: 0;
        margin: 0 1.2rem;

        svg {
            width: 1rem;
            height: 1rem;
        }
    }

    &__prev,
    &__next {
        display: flex;
        color: var(--color-text-primary);

        &:hover {
            color: var(--color-link);
        }
    }

    &__page {
        display: flex;
        margin: 0 2rem;
    }

    &__current {
        padding-right: 1ch;
    }

    &__total {
        padding-left: 1ch;
        border-left: 1px solid var(--color-text-primary);
    }

    &__next {}

    .is-not-available {
        opacity: .5;
        pointer-events: none;
    }
}