@mixin estimation {
    .points-per-role {
        display: flex;
        flex-direction: column;
    }
    .ticket-role-points {
        background: rgba($gray-light, .2);
        color: $gray-light;
        display: flex;
        flex: 1;
        justify-content: space-between;
        margin-bottom: .1rem;
        min-height: 2rem;
        padding: .5rem 1rem;
        position: relative;
        &.clickable {
            &:hover,
            &.active {
                background: rgba($primary-light, .9);
                color: $whitish;
                .points,
                .role,
                .icon-arrow-bottom {
                    color: currentColor;
                    fill: currentColor;
                }
            }
        }
        &:last-child {
            background: rgba($primary-dark, .5);
            border-bottom: 0;
            color: $whitish;
            .points,
            .role,
            .icon-arrow-bottom {
                @include font-type(text);
                color: currentColor;
                fill: currentColor;
            }
        }
        .icon-arrow-down {
            fill: currentColor;
            height: .6rem;
            margin-left: .25rem;
            width: .6rem;
        }
        .points {
            @include font-type(light);
            color: $grayer;
        }
        .role {
            @include font-type(light);
        }
    }
    .popover {
        @include popover(200px, $top: 100%, $left: .5rem, $arrow-width: 10px, $arrow-top: -5px, $arrow-left: 10px, $arrow-height: 10px);
        li {
            display: inline-block;
            width: 23%;
        }
        a {
            display: block;
            text-align: center;
            &:hover,
            &.active {
                background: $primary-light;
                color: $white;
            }
        }
        &.fix {
            @include popover(200px, $top: 100%, $left: -160px, $arrow-width: 10px, $arrow-top: -5px, $arrow-left: 90%, $arrow-height: 10px);
        }
    }
}

.ticket-estimation {
    @include estimation;
}