Is it possible to have it highlight the 1st level a color, the side and then add padding to bottom to wrap it in the same color.  Similar to this example

https://cdn.shopify.com/s/files/1/0035/7279/3459/files/microbit-if-statement-for-robots-button-is-pressed_large.png?v=1530304913

The blue being the 1st level and the green being the 2nd level.

Attached a grid we are currently using with the blue square where we want it to be a blue background.

You can inspect the rendered classes on the respective elements and devise CSS rules to provide the desired coloring. The following blog post can help you get started with this: https://www.telerik.com/blogs/improve-your-debugging-skills-with-chrome-devtools#see-the-applied-styles.

For your convenience, I created a basic example on top of our declarative relations demo. Below you will find attached the results of the rules below. You can extend/change them to match your needs and also you can use the CssClass of a concrete table view to set a custom class name to cascade through. In the ItemDataBound event you can also easily set classes to entire rows if you need that.