fix(material-experimental/mdc-tabs): CSS applied to wrong element when preserveContent is enabled (#24346)

When `preserveContent` is enabled we add an extra `display: none` to prevent users from tabbing into hidden content. The selector was placed on the wrong element for the MDC-based tabs.

Author: crisbeto

src/material-experimental/mdc-tabs/tab-body.scss

@@ -22,6 +22,15 @@
   .mat-mdc-tab-group.mat-mdc-tab-group-dynamic-height &.mat-mdc-tab-body-active {
     overflow-y: hidden;
   }
+}
+
+.mat-mdc-tab-body-content {
+  height: 100%;
+  overflow: auto;
+
+  .mat-mdc-tab-group-dynamic-height & {
+    overflow: hidden;
+  }
 
   // Usually the `visibility: hidden` added by the animation is enough to prevent focus from
   // entering the collapsed content, but children with their own `visibility` can override it.
@@ -34,12 +43,3 @@
     display: none;
   }
 }
-
-.mat-mdc-tab-body-content {
-  height: 100%;
-  overflow: auto;
-
-  .mat-mdc-tab-group-dynamic-height & {
-    overflow: hidden;
-  }
-}