How to change font color of mat table on mouse hover

Question

I want to change the font color on mouse hover of mat row. I am able to change the background color, but i want to change the font color as well.

<table mat-table [dataSource]="displayvendors" class="mat-elevation-z1">
 <ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef> Vendor ID </th>
 <td mat-cell *matCellDef="let element"> {{element.id}} </td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="['id']"></tr>
<tr class="rowhover" (click)="displayData(row.id)" mat-row *matRowDef="let row; columns: ['id']"></tr>
</table>
</div>     
<router-outlet></router-outlet> 

It css

.rowhover:hover
{
    cursor: pointer;
    background-color:#A92069 ;

}

Answer 1

Use css

.mat-row:hover > .mat-cell {
    color:  white
  }