Changing the background color of Selected Row in Grid

Flow
1

What is the correct way of doing this? I tried the following and didn’t work.

<dom-module id="so-grid" theme-for="vaadin-grid">
    <template>
        <style>
            [part="row"]
[selected]
 {
                background-color: ...;
            }
        </style>
    </template>
</dom-module>
2

I think you need to use [part~="row"] here, so


<dom-module id="so-grid" theme-for="vaadin-grid">
    <template>
        <style>
            [part~="row"]
[selected]
 {
                background-color: ...;
            }
        </style>
    </template>
</dom-module>
3

No, that too didn’t work.

4

Finally, I was able to get it right:

<dom-module id="so-grid" theme-for="vaadin-grid">
    <template>
        <style>
            :host(:not([reordering]
)) [part~="row"]
[selected]
 [part~="body-cell"]
:not([part~="details-cell"]
) {
                background: ...;
            }
        </style>
    </template>
</dom-module>