/* public/assets/css/components/scroll.css
   Componente: barra de scroll personalizada para TODA la app (scroll de
   pagina y cualquier contenedor con overflow propio: .app-tabla-wrap,
   .app-buscador-panel, .app-chat-mensajes, modales, desplegables...).
   Sustituye la barra gris nativa del navegador (ancha, cuadrada, igual en
   cualquier web) por una version fina, redondeada y en la gama de
   color_principal del usuario (deriva de --app-primary-rgb via
   App\src\Utils\Color::paleta(), mismo criterio de personalizacion que el
   resto de la interfaz, ver panel-form.css/tabla.css), acorde a los design
   tokens de 06_ESTILO_FRONT.md (radios var(--app-radius-*), escala aurea).

   Inspirado en el ::-webkit-scrollbar de CONSULTORIA (APP/assets/css/
   style.css), pero sin colores fijos (CONSULTORIA usa un borde blanco
   solido #ffffff que solo funciona sobre fondo blanco) y con el equivalente
   estandar (scrollbar-width/scrollbar-color) para Firefox, que no soporta
   pseudo-elementos ::-webkit-scrollbar-*.

   Selector universal (no solo html/body): un solo sitio para TODA la app,
   sin tener que repetir esto por cada componente con su propio scroll
   interno, presente o futuro. */

/* Firefox: unico navegador que soporta esta propiedad estandar (no hay
   pseudo-elementos que combinar con lo de abajo). rgba sobre
   --app-primary-dark-rgb (el tono oscuro de la personalizacion, mismo que
   .app-tabla-enlace/.app-tabla-pagina, no el --app-primary "plano") en vez
   de un color solido: se lee bien tanto sobre tarjetas blancas (.app-panel)
   como sobre el degradado suave del fondo de pagina (body, base.css), sin
   depender de conocer el fondo exacto de cada contenedor. Peticion
   explicita del usuario, 2026-09-21: el tono oscuro se ve mejor que el
   --app-primary plano del primer intento. */
* {
    scrollbar-width: thin;
    scrollbar-color: rgba(var(--app-primary-dark-rgb), 0.55) transparent;
}

/* Chrome/Edge/Safari (WebKit/Blink): sin equivalente estandar todavia. */
*::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}
*::-webkit-scrollbar-track {
    background: transparent;
}
*::-webkit-scrollbar-thumb {
    background-color: rgba(var(--app-primary-dark-rgb), 0.55);
    border-radius: var(--app-radius-md);
}
*::-webkit-scrollbar-thumb:hover {
    background-color: rgba(var(--app-primary-dark-rgb), 0.8);
}
*::-webkit-scrollbar-corner {
    background: transparent;
}
