Fix styling issue when using EW modules (#31533)

* style: move compound loading order

* fix: spotlight fiting

* fix: don't use internal compound css var in settings subsection

* fix: don't use internaal compound css var in read receipt group

* fix: add important to font settings on body element

* fix: remove play pause button color and fix padding

This color wasn't apply because this PR. Removing to avoid visual
regression

* fix: add important to form help message override in preference settings

* fix: override compound in space panel buttons

* fix: layout of forgot password

* fix: height of encryption tab

* fix: widget avatar border radius

res/css/structures/_QuickSettingsButton.pcss

@@ -7,7 +7,8 @@ Please see LICENSE files in the repository root for full details.
 */
 
 .mx_QuickSettingsButton {
-    border-radius: 8px;
+    /* !important override compound */
+    border-radius: 8px !important;
     margin: 12px auto 12px;
 
     svg {
@@ -57,7 +58,8 @@ Please see LICENSE files in the repository root for full details.
         }
 
         & .mx_QuickSettingsButton_label {
-            color: $secondary-content;
+            /* !important override compound  */
+            color: $secondary-content !important;
         }
     }
 }

res/css/structures/_ThreadsActivityCentre.pcss

@@ -11,7 +11,8 @@
 }
 
 .mx_ThreadsActivityCentreButton {
-    border-radius: 8px;
+    /* !important override compound */
+    border-radius: 8px !important;
     margin: 18px auto auto auto;
 
     &.expanded {
@@ -50,14 +51,16 @@
         }
 
         & .mx_ThreadsActivityCentreButton_Text {
-            color: $secondary-content;
+            /* !important override compound  */
+            color: $secondary-content !important;
         }
     }
 
     &:not(.expanded) {
         &:hover,
         &:hover .mx_ThreadsActivityCentreButton_Icon {
-            background-color: $quaternary-content;
+            /* !important override compound */
+            background-color: $quaternary-content !important;
             fill: $primary-content;
         }
     }