/* =====================================================================
 *  BARRAS DE DESPLAZAMIENTO — UNA SOLA IDENTIDAD EN TODA LA WEB  (3.0.2)
 *
 *  Pedido: que TODAS las barras —verticales y horizontales, la de la
 *  página y las de las tiras que deslizan (relacionados, comprado junto,
 *  etiquetas, tablas)— se vean iguales. Va en un fichero que se encola en
 *  TODO el sitio (site-wide), no solo en la tienda, para que sea la barra
 *  de la casa en cada página.
 *
 *  Diseño: fina, en tinta tenue, con la Forma insinuada (un chaflán mínimo
 *  arriba-izq y abajo-der del pulgar). En la pista, casi invisible. Al pasar
 *  el ratón, el pulgar se enciende en rojo de marca. Sobre fondo oscuro
 *  (barra de admin, cajas negras) se aclara para no perderse.
 * ===================================================================== */

/* Firefox */
* {
    scrollbar-width: thin;
    scrollbar-color: rgba(21,24,28,.34) transparent;
}

/* WebKit / Blink (Chrome, Edge, Safari) */
::-webkit-scrollbar{
    width: 11px;
    height: 11px;
}
::-webkit-scrollbar-track{
    background: transparent;
}
::-webkit-scrollbar-thumb{
    background: rgba(21,24,28,.30);
    border: 3px solid transparent;   /* aire alrededor del pulgar: se ve fino */
    background-clip: padding-box;
    /* La Forma insinuada: un chaflán mínimo en dos esquinas opuestas. A este
       tamaño no se nota un hexágono completo, pero sí que no es un óvalo. */
    clip-path: polygon(3px 0,100% 0,100% calc(100% - 3px),calc(100% - 3px) 100%,0 100%,0 3px);
}
::-webkit-scrollbar-thumb:hover{
    background: var(--rsux-red, #da1921);
    background-clip: padding-box;
}
::-webkit-scrollbar-corner{ background: transparent; }

/* Sobre fondos OSCUROS (barra de administrador de WP, cajas negras de la
   casa, el panel móvil): el pulgar se aclara para que no se trague. */
.rsux-panel-movil::-webkit-scrollbar-thumb,
.ofertas-visor::-webkit-scrollbar-thumb,
#wpadminbar ::-webkit-scrollbar-thumb,
[class*="dark"] ::-webkit-scrollbar-thumb{
    background: rgba(255,255,255,.34);
    background-clip: padding-box;
}