.root
    +flex('', center)

    & > div
        width: 40px
        margin: 0 $gutter_sm

.page, .goto_prev, .goto_next
    +flex(center, center)
    +font(20px, 40px, $secondary)
    height: 40px
    border: $border
    border-width: 2px
    border-radius: 50%
    cursor: pointer


.icon_prev, .goto_next
    i
        +font(26px, '', $secondary)
        pointer-events: none

.goto_prev i
    transform: rotate(-180deg)

.change__disabled
    border-color: $border_color_light
    cursor: default

    i
        color: $border_color_light

.page__active
    color: $white
    background: $primary
    border-color: $primary

.separator
    align-self: flex-end
    font-size: 20px
    letter-spacing: 2px
    text-align: center