/* Sidebar */

.sidebar-charts {

    margin-top: 20px;

    & nav {
        padding-bottom: 6rem !important;
    }

    & div.list-group-item {
        display: flex;
        justify-content: space-between;
        cursor: pointer;

        &>a {
            color: #000;
            text-decoration: none;
            font-weight: normal;
        }

        &.sidebar-chart-active>a {
            color: #fff;
        }

        & i.fave {
            margin: 0rem;
            font-size: 1rem;
            color: #dedede;
            margin-left: 0.4rem;


            &.selected {
                color: #FFD700;
            }
        }

        & span.rm-fv {
            margin-left: 1rem;
            color: #bbbbbb;
        }

        &.sidebar-chart-active span.rm-fv {
            color: #fff;
        }


        & div.icon-container {
            margin-left: 1rem;
            text-align: end;

            &>.spinner-border {
                width: 0.7rem;
                height: 0.7rem;
                margin: 0;
                margin-right: 0.2rem;
                margin-left: 0.4rem;
                color: #5a5a5a;
            }

            &.disabled {
                cursor: not-allowed;

                & i.fave,
                & span.rm-fv {
                    pointer-events: none;

                }
            }

        }
    }

    & .material-icons {
        user-select: none;
    }

    & div.favourites div.htmx-indicator {
        display: none;

        & .htmx-request,
        &.htmx-request {
            display: flex;
            justify-content: center;
            align-items: center;
            min-height: 100px;
            width: 100%;

        }
    }

    & a.sidebar-category.favourites>i.head-fave {
        font-size: 1.1rem;
        color: #FFD700;
    }

    & a.sidebar-category>span.badge {
        width: 25px;
        float: right;
        font-weight: 400;
    }

    & div.favourites.empty-state {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        height: 100px;
        width: 100%;
        margin-top: 20px;
        margin-bottom: 10px;

        & p {
            font-size: 1.2rem;
            font-weight: 400;
            color: #5a5a5a;

        }

        & img {
            height: 90px;
            margin-bottom: 5px;
        }

    }



}


/* Toasts */
.toast {
    min-width: 240px;
}

.toast-body span {
    font-size: 16px;
    font-weight: 400;
}

.toast-body svg {
    transform: scale(1.5);
    color: white;
    margin-left: 15px;
}

.blue {
    background-color: #3C75D5;
}


@media only screen and (max-width: 890px) {
    .sidebar-charts {
        margin-top: 20px !important;
    }
}

button.sidebar-toggle {
    z-index: 500;
    top: 135px !important;

}