/* SCROLL PARA CHROME */

.layout__scroll::-webkit-scrollbar {
    width: 30px;
    background: transparent;
}

.layout__scroll::-webkit-scrollbar-thumb {
    border: 10px solid transparent;
    box-shadow: none;
    border-radius: 20px;
}

.layout__scroll:hover::-webkit-scrollbar-thumb {
    border: 9px solid transparent;
    box-shadow: inset 0 0 0 10px var(--color-gris);
}

.layout__scroll:hover::-webkit-scrollbar-thumb:hover {
    border: 9px solid transparent;
    box-shadow: inset 0 0 0 10px var(--color-secondary);
}

.layout__scroll::-webkit-scrollbar-track {
    margin: 40px;
}

/* SCROLL CHROME BARRA LATERAL */

.aside__scroll::-webkit-scrollbar {
    width: 30px;
    background: transparent;
    scrollbar-gutter: stable both-edge;
}

.aside__scroll::-webkit-scrollbar-thumb {
    border: 10px solid transparent;
    box-shadow: none;
    border-radius: 20px;
}

.aside__scroll:hover::-webkit-scrollbar-thumb {
    border: 9px solid transparent;
    box-shadow: inset 0 0 0 10px var(--color-gris);
}

.aside__scroll:hover::-webkit-scrollbar-thumb:hover {
    border: 9px solid transparent;
    box-shadow: inset 0 0 0 10px var(--color-principal);
}

.aside__scroll::-webkit-scrollbar-track {
    margin: 40px;
}

/* SCROLL PARA MOZZILLA FIREFOX */

@-moz-document url-prefix() {
    .layout__scroll{
        scrollbar-width: thin;
        scrollbar-gutter: stable both-edge;
        scrollbar-color: var(--color-secondary) transparent;
    }
}

/* SCROLL PARA MOZZILLA FIREFOX BARRA LATERAL */

@-moz-document url-prefix() {
    .aside__scroll{
        scrollbar-width: thin;
        scrollbar-color: var(--color-gris-claro) transparent;
    }
}
