.app-name {
    display: inline-block;
    max-width: 160px; /* Ajusta el ancho máximo que quieras permitir */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1rem; /* tamaño normal */
}

.app-table {
    background-color: #ffffff;
    border: 1px solid #d9e2ec;
    border-collapse: separate;
    border-spacing: 0;
    color: #263238;
    margin-bottom: 0;
}

.app-table thead th {
    background-color: #eaf3fb;
    border-bottom: 1px solid #c8d9e8;
    color: #1f3a4d;
    font-weight: 600;
    padding: 0.85rem;
    vertical-align: middle;
}

.app-table tbody td {
    border-color: #e1e8ef;
    padding: 0.8rem;
    vertical-align: middle;
}

.app-table.table-striped tbody tr:nth-of-type(odd) {
    background-color: #f8fbfd;
}

.app-table tbody tr:hover {
    background-color: #eef6fc;
}

.app-table th,
.app-table td {
    border-color: #e1e8ef;
}

/* Si quieres que a partir de cierta longitud reduzca el font-size, puedes agregar media queries */
@media (max-width: 768px) {
    .app-name {
        max-width: 80px; /* para móviles */
        font-size: 0.9rem;
    }
}