Removed some unused at extends from SCSS

What does this MR do?

Delete some more @extends for #323021 (closed)

If the extend was close to the selector it was extending, I just combined the rules. This gives the same result but is cheaper for compiler. For simple ones I swapped CSS rules for util classes.

There are some minor CSS output changes, but no (intended) visual changes

Screenshots (strongly suggested)