/*to use global variables, import them into your component stylesheet*/
@import "./../../../styles/global.scss";

.tabs-bar {
    width: 100%;
    display: flex;
    border-bottom: 2px solid $blue;
    justify-content: flex-start;
    user-select: none;
    overflow-y: scroll;
}

.tabs-bar a {
    padding: 10px 15px;
    background-color: $grey-light;
    color: $black-blue;
    cursor: pointer;
    margin-right: 10px;
    font-weight: 600;
    transition: color 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38),
        background-color 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38);
}

.tabs-bar a.active {
    background-color: $blue;
    color: $white;
}