@media (max-width: 768px) {
   tr {
        display: flex;
        flex-direction: column;
        margin-bottom: 15px; /* Espaciado entre tarjetas */
        border: 1px solid #ccc; /* Opcional: agregar borde */
        padding: 10px; /* Opcional: agregar relleno */
    }

   td {
        width: 100%; /* Cada celda ocupa todo el ancho */
        text-align: left; /* Alinear texto a la izquierda */
        border: none; /* Quitar bordes entre celdas */
    }

   td .text-center {
            text-align: left; /* Mantener texto centrado para las celdas centradas */
        }
   td .text-end{
       text-align: center;
   }
}