#navbar,
.navbar_icon_wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
#navbar {
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 9999;
    width: 100%;
    padding: 0 28px;
    height: 60px;
    background-color: var(--cor_terciaria);
    overflow: hidden;

    .navbar_btn {
        background-color: transparent;
        border: none;
    }

    .navbar_icon:hover path {
        /*color: #3D3D3D;*/
        stroke: #FF3333;
        fill: #FF3333;
    }
}
@media (min-width: 992px) {
    .dashboard {
        display: flex;
    }
    #navbar {
        flex-shrink: 0;
        overflow-y: auto;
        position: static;
        min-width: 60px;
        width: 60px;
        height: calc(100vh - 70px);
        justify-content: start;
        gap: 44px;
        padding: 28px 0;
        flex-direction: column;
        /* background-image: var(--bg_gradiente_navbar); */
        background-color: transparent;
        border-radius: 0 0 8px 0;

        .ativo {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 32px;
            height: 32px;
            background-color: var(--cor_branco);
            padding: 4px;
            border-radius: 8px;
        }
        .ativo_stroke {
            .navbar_icon_wrapper {
                path {
                    stroke: var(--cor_principal);
                }
            }
        }
        .ativo_fill {
            .navbar_icon_wrapper {
                path {
                    fill: var(--cor_principal);
                }
            }
        }
    }
    .ativo_fill {
        fill: var(--cor_principal);
    }
}