/*
  26/10 — barra de rolagem ROBUSTA, visível, em todo o sistema.

  O tema zera as barras de TODO elemento rolável (`body *::-webkit-scrollbar { width: 0; height: .25rem }`) — por isso a tela de busca do Lastro, as listas
  e as grades com rolagem própria não mostravam nenhuma barra para o usuário arrastar. Aqui ela volta grossa (14px), roxa (cor do sistema), com trilho
  visível, no computador (Chrome/Edge/Safari desktop e Firefox) e na página inteira. No celular o toque rola a página; navegadores móveis (principalmente
  o Safari do iPhone) só mostram a barra "flutuante" do sistema e ignoram este estilo — por isso o botão "voltar ao topo" continua existindo.
*/

html {
    scrollbar-width: auto;
    scrollbar-color: #845ADF #E9E6F7;
}

html::-webkit-scrollbar,
html body *::-webkit-scrollbar {
    width: 14px;
    height: 14px;
}

html::-webkit-scrollbar-track,
html body *::-webkit-scrollbar-track {
    background: #E9E6F7;
    border-radius: 999px;
}

html::-webkit-scrollbar-thumb,
html body *::-webkit-scrollbar-thumb,
html body *:hover::-webkit-scrollbar-thumb {
    background: #845ADF !important;
    border-radius: 999px;
    border: 3px solid #E9E6F7;
    min-height: 48px;
    min-width: 48px;
}

html::-webkit-scrollbar-thumb:hover,
html body *::-webkit-scrollbar-thumb:hover {
    background: #6B3FD0 !important;
}

html::-webkit-scrollbar-corner,
html body *::-webkit-scrollbar-corner {
    background: transparent;
}

/* Firefox: qualquer elemento rolável (o `html` acima já cobre a página) */
* {
    scrollbar-width: auto;
    scrollbar-color: #845ADF #E9E6F7;
}

/* O menu lateral usa o próprio componente de rolagem do tema — não herda a barra grossa (ficaria espremida) */
.app-sidebar *::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}