:root {
    --star-size: 20px;
    --star-color: #fff;
    --star-background: #fc0;
}

.Stars {
    --percent: calc(var(--rating) / 5 * 100%);
    font-size: var(--star-size);
    font-family: Times;
    /* make sure ★ appears correctly */
    line-height: 1;
    text-shadow: 0px 0px #f7ca002b;
    &::before

{
    content: '★★★★★';
    letter-spacing: 3px;
    background: linear-gradient(90deg, var(--star-background) var(--percent), var(--star-color) var(--percent));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
}

.table-grey tbody tr {
    background-color: #f2f2f2;
}

.bootstrap-tagsinput {
    width: 100%
}

    .bootstrap-tagsinput .tag {
        background-color: #8fc0ff;
        padding: 3px;
        border-radius: 6px;
        color: white;
        font-weight: 100;
    }

.nice-select.input {
    height: 54px;
    width: 100%;
    padding-top: 5px;
}

.nice-select .list {
    width: 100%
}

:disabled {
    cursor: not-allowed
}

.disabled {
    cursor: not-allowed
}

.ellipsis {
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: top;
}

.ellipsis-10 {
    --max-chars: 10ch;
}

.ellipsis-20 {
    --max-chars: 20ch;
}

.ellipsis-30 {
    --max-chars: 30ch;
}

.ellipsis-40 {
    --max-chars: 40ch;
}

.ellipsis-50 {
    --max-chars: 50ch;
}

.ellipsis {
    max-width: var(--max-chars);
}