$react-rater-link: #ccc !default;
$react-rater-hover: #666 !default;
$react-rater-active: #000 !default;

.react-rater {
    display: inline-block;
    line-height: normal;

    >* {
        display: inline-block;
    }
}

.react-rater-star {
    cursor: pointer;
    position: relative;

    &.will-be-active {
        color: $react-rater-hover;
    }

    &.is-active-half:before {
        position: absolute;
        left: 0;
        width: 50%;
        overflow: hidden;
    }

    &.is-disabled {
        cursor: default;
    }
}