.dataTable {
    font-size: 0.8rem;
}
.dataTable td, .dataTable th {
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap !important;
}

/* Ocultar el ícono de flecha por defecto */

/* Añadir el ícono de Font Awesome para la expansión */
.dtr-control::before {
    content: "\f055" !important; /* Código de Font Awesome para un círculo con '+' */
    font-family: "Font Awesome 6 Free";
    font-weight: 900; /* Necesario para los íconos de Font Awesome 5 */
    color: green;
    font-size: 1.2em;
    cursor: pointer;
    border: none !important;
}

/* Cambiar el ícono de Font Awesome cuando la fila está expandida */
.dtr-expanded .dtr-control::before {
    content: "\f056" !important; /* Código de Font Awesome para un círculo con '-' */
    color: red;
}