UX: Tweaks on the admin sidebar (#25717)

app/assets/stylesheets/common/admin/admin_base.scss

@@ -686,6 +686,20 @@ $mobile-breakpoint: 700px;
   @media (max-width: 500px) {
     width: 50%;
   }
+  .nav-stacked {
+    background-color: inherit;
+
+    a.active {
+      color: initial;
+      background-color: initial;
+      font-weight: 700;
+      border-right: 4px solid var(--quaternary);
+
+      &::after {
+        display: none; // Hides the arrow
+      }
+    }
+  }
 }
 
 .admin-detail {

app/assets/stylesheets/common/admin/admin_revamp.scss

@@ -25,3 +25,7 @@
     }
   }
 }
+
+.admin-area .sidebar-wrapper {
+  background-color: var(--d-sidebar-admin-background);
+}

app/assets/stylesheets/common/base/sidebar.scss

@@ -11,6 +11,7 @@
   --d-sidebar-row-height: 2.1em;
 
   --d-sidebar-background: var(--secondary);
+  --d-sidebar-admin-background: var(--primary-very-low);
   --d-sidebar-prefix-background: var(
     --primary-low
   ); // example: chat participant count

app/assets/stylesheets/common/components/navs.scss

@@ -74,7 +74,7 @@
   background: var(--primary-low);
 
   li {
-    border-bottom: 1px solid var(--primary-low-mid-or-secondary-high);
+    border-bottom: 1px solid var(--primary-low);
 
     &:last-of-type {
       border-bottom: 0;
@@ -88,7 +88,6 @@
   a {
     margin: 0;
     padding: 0.75em;
-    font-size: var(--font-up-1);
     line-height: var(--line-height-small);
     cursor: pointer;
     color: var(--primary);