/*
|--------------------------------------------------------------------------
| Rolagem da sidebar da Central
|--------------------------------------------------------------------------
|
| Substitui o jQuery slimScroll na sidebar. O plugin força overflow: hidden
| e só aceita a rodinha depois de um mouseenter; quando a página carrega com
| o cursor já sobre a sidebar (após clicar num menu), a rolagem ficava travada
| e a rodinha rolava a página. Aqui a rolagem é nativa do navegador:
| funciona com rodinha, trackpad, arrastar a barra, teclado e touch, e
| acompanha a altura dos submenus ao abrir/fechar sem recalcular nada.
|
*/

.sidebar .sidebar-inner.sidebar-rolagem {
    height: 100%;
    width: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    /* Ao chegar no fim da sidebar, não passa a rolar a página (como o slimScroll fazia) */
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;

    /* Barra fina, discreta, visível ao passar o mouse (Firefox) */
    scrollbar-width: thin;
    scrollbar-color: transparent transparent;
}

.sidebar .sidebar-inner.sidebar-rolagem:hover,
.sidebar .sidebar-inner.sidebar-rolagem:focus-within {
    scrollbar-color: rgba(0, 0, 0, 0.25) transparent;
}

/* Chrome, Edge e Safari: mesma largura da barra do slimScroll (7px) */
.sidebar .sidebar-inner.sidebar-rolagem::-webkit-scrollbar {
    width: 7px;
}

.sidebar .sidebar-inner.sidebar-rolagem::-webkit-scrollbar-track {
    background: transparent;
}

.sidebar .sidebar-inner.sidebar-rolagem::-webkit-scrollbar-thumb {
    background-color: transparent;
    border-radius: 7px;
}

.sidebar .sidebar-inner.sidebar-rolagem:hover::-webkit-scrollbar-thumb,
.sidebar .sidebar-inner.sidebar-rolagem:focus-within::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.25);
}

/* Tema escuro */
[data-theme=dark] .sidebar .sidebar-inner.sidebar-rolagem:hover,
[data-theme=dark] .sidebar .sidebar-inner.sidebar-rolagem:focus-within {
    scrollbar-color: rgba(255, 255, 255, 0.25) transparent;
}

[data-theme=dark] .sidebar .sidebar-inner.sidebar-rolagem:hover::-webkit-scrollbar-thumb,
[data-theme=dark] .sidebar .sidebar-inner.sidebar-rolagem:focus-within::-webkit-scrollbar-thumb {
    background-color: rgba(255, 255, 255, 0.25);
}

/* Touch: sem hover, a barra fica sempre discretamente visível */
@media (hover: none) {
    .sidebar .sidebar-inner.sidebar-rolagem {
        scrollbar-color: rgba(0, 0, 0, 0.25) transparent;
    }

    .sidebar .sidebar-inner.sidebar-rolagem::-webkit-scrollbar-thumb {
        background-color: rgba(0, 0, 0, 0.25);
    }

    [data-theme=dark] .sidebar .sidebar-inner.sidebar-rolagem {
        scrollbar-color: rgba(255, 255, 255, 0.25) transparent;
    }

    [data-theme=dark] .sidebar .sidebar-inner.sidebar-rolagem::-webkit-scrollbar-thumb {
        background-color: rgba(255, 255, 255, 0.25);
    }
}

/*
|--------------------------------------------------------------------------
| Labels dos menus e submenus
|--------------------------------------------------------------------------
|
| O tema (style.css) usa white-space: nowrap nos labels e os mais longos
| (ex.: "Agendamento Chamado") eram cortados pela largura da sidebar.
| Aqui o texto quebra em linhas. Vale para a Central e para o tenant
| (as regras de rolagem acima só pegam a classe .sidebar-rolagem, da Central).
|
*/

.sidebar .sidebar-menu ul li a span:not(.menu-arrow):not(.badge) {
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.3;
}