InteractiveTable: Updated design and minor tweak to Correlactions page

[torkelo]

In an effort to align table designs I propose we make this change to the InterativeTable to make it look better and more inline with other tables.

• Remove table header background (standard Table component does not have this)
• Remove the surrounding border (Feels unnecessary, placing the table inside a box with border feels like should be up to each use case and not part of the component itself).
• Add row hover highlight (Same as we have with standard Table component)
• Remove striped rows and just use border separator for all rows (it's the same in standard Table)
• For expanded rows we don't show the bottom border, and we add a left border to make the expanded content more connected to the expanded row.
• Improve indentation of the expanded row content

Fixes

• Issue with bad background for even rows where forms where placed on a background they were not designed for (Correlations edit form).
• Better add button placement on the correlations page

Before:

After:

Also tweaks some things on the correlations page

• Use Page subtitle for the paragraph below instead of the two page descriptions
• Place add button in the top right corner (Page actions slot)

Correlations table question

• Think it would make sense to move the "Read only" label to be the last column instead of first

[Elfo404]

not sure why, but it renders like this for me (both on FF and chrome)

[torkelo]

@Elfo404 fixed it! lol, just before pushing I moved some styles for the expanded row from being at the bottom to the top of css class and I moved it too far up, outside the td selector :)

[Elfo404]

so happy to see the zebra styles die ❤️

[github-actions]

Backend code coverage report for PR #66443
No changes

[github-actions]

Frontend code coverage report for PR #66443

Plugin	Main	PR	Difference
correlations	90.9%	90.93%	.03%