Why hover css properties not working when using SortableJs

Question

I have used SortableJs for drag and droping a table row into a div using angular14

The issue i am facing is when dragging a row and hovering over an element, the element's hover css properties are not applying.

HTML

<tbody  [sortablejs]="(data)"
                  [sortablejsOptions]="sortableOptions" > 

Component.ts sortOptions

public sortableOptions: SortablejsOptions = {
        group: {somedata
 },
        handle: '.handle',
        onUpdate: this.priorityChanged.bind(this),
        onAdd: this.onAdd.bind(this),
        onMove: this.onMove.bind(this),
        onEnd: this.onEnd.bind(this)
    };

.treeDiv:hover {
  background: red !important;
  border: none;
}

Hover is working in one of my another component. Am I missing any options to pass in sortableOptions