/* Contenedor con desplazamiento lateral para tablas que no caben (lo crea js/tablas-movil.js). Solo en pantalla y bajo 960 px;
   a más ancho el contenedor no cambia nada. Las sombras laterales avisan de que hay más columnas y se apagan al llegar al borde. */
@media screen and (max-width: 960px) {
    .fp-resp .fp-tabla-scroll {
        position: relative; max-width: 100%; margin: 0 0 12px; overflow-x: auto; overflow-y: hidden;
        -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain;
        background-color: #ffffff;
        background-image: linear-gradient(to right, #ffffff 30%, rgba(255, 255, 255, 0)), linear-gradient(to left, #ffffff 30%, rgba(255, 255, 255, 0)),
                          radial-gradient(farthest-side at 0 50%, rgba(0, 0, 0, 0.28), rgba(0, 0, 0, 0)), radial-gradient(farthest-side at 100% 50%, rgba(0, 0, 0, 0.28), rgba(0, 0, 0, 0));
        background-position: left center, right center, left center, right center;
        background-repeat: no-repeat;
        background-size: 40px 100%, 40px 100%, 14px 100%, 14px 100%;
        background-attachment: local, local, scroll, scroll;
    }
    .fp-resp .fp-tabla-scroll > table { margin-bottom: 0; }
    .fp-resp .fp-tabla-scroll:focus-visible { outline: 2px solid #3cbae3; outline-offset: 2px; }
}