UX: fix group search result alignment and styles (#25681)

app/assets/javascripts/discourse/app/components/search-menu/results/type/group.hbs

@@ -1,15 +1,16 @@
-<div class="group-result">
+<div class="group-result {{if @result.flairUrl '--with-flair'}}">
   {{#if @result.flairUrl}}
     <AvatarFlair
       @flairName={{@result.name}}
       @flairUrl={{@result.flairUrl}}
       @flairBgColor={{@result.flairBgColor}}
       @flairColor={{@result.flairColor}}
+      @class="avatar-flair__wrapper"
     />
   {{else}}
     {{d-icon "users"}}
   {{/if}}
-  <div class="group-names">
+  <div class="group-names {{if @result.fullName '--group-with-slug'}}">
     <span class="name">{{or @result.fullName @result.name}}</span>
     {{! show the name of the group if we also show the full name }}
     {{#if @result.fullName}}

app/assets/stylesheets/common/base/search-menu.scss

@@ -165,15 +165,29 @@ $search-pad-horizontal: 0.5em;
     }
 
     .search-result-group .group-result {
-      .d-icon,
-      .avatar-flair {
-        width: 20px;
-        height: 20px;
+      display: flex;
+      gap: 0.5em;
+
+      &.--with-flair {
+        align-items: center;
       }
 
-      .avatar-flair,
+      .avatar-flair__wrapper,
       .d-icon-users {
-        margin-right: 0.5em;
+        margin-top: 0.1em; // vertical alignment
+      }
+
+      .avatar-flair {
+        width: 1.58em;
+        height: 1.6em;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+
+        .d-icon {
+          font-size: var(--font-down-1);
+          color: currentColor;
+        }
       }
 
       .avatar-flair {
@@ -182,23 +196,23 @@ $search-pad-horizontal: 0.5em;
           background-repeat: no-repeat;
           background-size: 100% 100%;
         }
-        .d-icon {
-          margin-right: 0;
-        }
       }
 
       .group-names {
         @include user-item-flex;
+        min-width: 0;
         .name,
         .slug {
           @include ellipsis;
         }
 
+        &.--group-with-slug {
           .name {
             font-weight: 700;
           }
         }
       }
+    }
 
     .search-result-category,
     .search-result-tag {