diff --git a/app/assets/javascripts/admin/addon/components/admin-site-settings-filter-controls.gjs b/app/assets/javascripts/admin/addon/components/admin-site-settings-filter-controls.gjs
index 7c67f28ff31..44fdb370813 100644
--- a/app/assets/javascripts/admin/addon/components/admin-site-settings-filter-controls.gjs
+++ b/app/assets/javascripts/admin/addon/components/admin-site-settings-filter-controls.gjs
@@ -11,6 +11,7 @@ import i18n from "discourse-common/helpers/i18n";
 export default class AdminSiteSettingsFilterControls extends Component {
   @tracked filter = this.args.initialFilter || "";
   @tracked onlyOverridden = false;
+  @tracked isMenuOpen = false;
 
   @action
   clearFilter() {
@@ -47,6 +48,12 @@ export default class AdminSiteSettingsFilterControls extends Component {
     this.onChangeFilter();
   }
 
+  @action
+  toggleMenu() {
+    this.isMenuOpen = !this.isMenuOpen;
+    this.args.onToggleMenu();
+  }
+
   <template>
     <div
       class="admin-controls admin-site-settings-filter-controls"
@@ -57,8 +64,8 @@ export default class AdminSiteSettingsFilterControls extends Component {
         <div class="inline-form">
           {{#if @showMenu}}
             <DButton
-              @action={{@onToggleMenu}}
-              @icon="bars"
+              @action={{this.toggleMenu}}
+              @icon={{if this.isMenuOpen "times" "bars"}}
               class="menu-toggle"
             />
           {{/if}}
diff --git a/app/assets/stylesheets/common/admin/admin_base.scss b/app/assets/stylesheets/common/admin/admin_base.scss
index ec4001172ef..d9eabe9f8da 100644
--- a/app/assets/stylesheets/common/admin/admin_base.scss
+++ b/app/assets/stylesheets/common/admin/admin_base.scss
@@ -84,7 +84,7 @@ $mobile-breakpoint: 700px;
   position: relative;
   .nav-stacked {
     @media screen and (max-width: 700px) {
-      margin: 0 15px 0 -10px;
+      margin: 0;
     }
   }
 
@@ -96,6 +96,14 @@ $mobile-breakpoint: 700px;
   .row:after {
     clear: both;
   }
+
+  &.admin-site-settings-category {
+    overflow: hidden;
+
+    @media (max-width: 500px) {
+      background-color: var(--primary-very-low);
+    }
+  }
 }
 
 .admin-contents table {
@@ -710,7 +718,7 @@ $mobile-breakpoint: 700px;
   width: 82%;
   box-sizing: border-box;
   @media (max-width: $mobile-breakpoint) {
-    width: 95%;
+    width: 100%;
     border: none;
   }
 }
@@ -730,7 +738,7 @@ $mobile-breakpoint: 700px;
   @media (max-width: $mobile-breakpoint) {
     transition: transform 0.3s ease;
     @include transform(translateX(0));
-    margin-left: -10px;
+    padding: 30px 20px;
   }
 }