/* ==================== ESTILOS AL DEL CONTENEDOR PRINCIPAL ==================== */

/* Estilo del html.Div que encierra a las tablas */
.plot-style-type-b {
    border: 0px solid #ffffff;
    border-radius: 0px;
    background-color: #ffffff;
    padding: 5px 5px 25px 5px;
    box-sizing: border-box;
    /* Importante para respetar padding sin crecer el ancho */
    box-shadow: 1px 4px 8px rgba(0, 0, 0, 0.2);
    transition: transform 1s ease, box-shadow 1s ease;
}

.plot-style-type-b:hover {
    box-shadow: 2px 6px 12px rgb(0, 0, 0);
}

/* Efecto de zoom suave */
.plot-style-zoom {
    border-radius: 15px;
    background-color: #ffffff;
    padding: 5px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.plot-style-zoom:hover {
    transform: scale(1.03);
    box-shadow: 0 8px 16px rgb(0, 0, 0);
}

/* ==================== ALTuRA DINÁMICA DE LOS CONTENEDORES ==================== */

/* Contenedor general de la visual */
.plot-div {
    height: 350px;
}

@media (max-width: 576px) {
    .plot-div {
        height: 450px;
    }
}