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

%toolbarbutton{
    background-color: transparent;
    border-width: 0;
    box-shadow: none;
    color: inherit;

    &:disabled{
        opacity: .2;
    }
    .fa{
        color: $base-font-color-light;
    }
    &:hover{
        box-shadow: none;
        background-color: rgba(128, 128, 128, 0.1);
    }
}

.cxb-button.cxm-toolbar{
    @extend %toolbarbutton;

    //opacity: .75;

    //&:hover{
    //    opacity: 1;
    //}
}

.cxb-button.cxm-add{
    @extend %toolbarbutton;

    border: 1px solid $main-color;
    border-radius: 5px;

    background-color: white;
    span{
        padding-left: .5rem;
    }

    &:disabled{
        border-color: transparent;
    }

    &:hover{
        background-color: $ascentI-color-light;
        font-weight: bold;
    }
}

.cxb-uploadbutton.cxm-toolbar{
    @extend %toolbarbutton;

    //opacity: .75;
    //
    //&:hover{
    //    opacity: 1;
    //}
}

.cxe-verticalseparator{
    display: inline;
    border-left: 1px solid $base-border-color;
    padding: 5px 0;
    margin: 5px 0;
    height: 100%;
}