UX: Adjust focus styles for autocomplete input (#12051)

app/assets/javascripts/discourse/app/lib/autocomplete.js

@@ -318,6 +318,14 @@ export default function (options) {
       return createPopper(me[0], div[0], {
         placement: "bottom-start",
         strategy: "fixed",
+        modifiers: [
+          {
+            name: "offset",
+            options: {
+              offset: [0, 2],
+            },
+          },
+        ],
       });
     }
 

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

@@ -432,13 +432,10 @@ div.ac-wrap div.item a.remove,
 }
 
 div.ac-wrap {
-  overflow: auto;
   max-height: 150px;
   display: flex;
   flex-wrap: wrap;
   align-items: center;
-  background-color: var(--secondary);
-  border: 1px solid var(--primary-medium);
   min-height: 30px;
   box-sizing: border-box;
   div.item {
@@ -461,12 +458,6 @@ div.ac-wrap {
 
   input[type="text"] {
     float: left;
-    display: block;
-    box-shadow: none;
-    border: 0;
-    margin: 0;
-    background: transparent;
-    min-height: unset;
     &.fullwidth-input {
       width: 100%;
     }