@import "../variables";
@import "../mixins";

$control_width: 30px;

.Pagination {
    @include inline-middle;
}

.Pagination-info,
.Pagination-navigation {
    display: inline-block;
}

.Pagination-item {
    display: inline-block;

    & + &,
    .Button + .Button {
        margin-left: $offset_main;
    }

    &-ellipsis {
        vertical-align: bottom;
    }
}

.Pagination-previous-next {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin: $offset_main * 2 0;

    &-right {
        justify-content: flex-end;
    }

    &:first-child {
        margin-top: 0;
    }
    &:last-child {
        margin-bottom: 0;
    }
    .Pagination-title {
        color: $color_dark_text;
        flex-grow: 1;
        font-size: $font_size_heading_s;
        font-weight: $weight-bold;
        line-height: $control_height_normal;
        text-align: center;
    }
}

.Pagination-ellipsis-icon {
    color: $color_text_label;
    vertical-align: bottom;
}

.Pagination-info {
    position: relative;
    top: 1px;
}

.Pagination-control {
    @include button-direction-control;

    &.Button-active {
        cursor: default;
        pointer-events: none;
    }
}

.Pagination-navigation {
    user-select: none;

    .Pagination-info + & {
        margin-left: $offset_main;
    }
}

.Pagination-total-count {
    font-weight: $weight-bold;
}

.Pagination-ellipsis {
    display: inline-block;
}

.Pagination-search-text {
    font-size: $font_size_default;
}

.Pagination-alphalist {
    text-align: right;
}