/* Estilos personalizados para mejorar la visualización en móviles */
        @media (max-width: 768px) {
            thead {
                display: none; /* Oculta el encabezado en móviles */
            }

            tr {
                display: block; /* Cada fila se comporta como un bloque */
                margin-bottom: 15px;
                border: 1px solid #ddd;
                border-radius: 5px;
                padding: 15px;
            }

            td {
                display: flex;
                justify-content: space-between;
                border: none; /* Elimina el borde de las celdas */
                padding: 5px 0;
            }

            td::before {
                content: attr(data-label); /* Muestra el nombre del encabezado */
                font-weight: bold;
                margin-right: 10px;
            }
        }