fix(Multiselect): remove focus when MultiSelect is open (#16259)

* fix(Multiselect): remove focus when MultiSelect is open

* fix(Multiselect): add focus when item is selected, add with layer story

---------

Co-authored-by: Kritvi <158570656+Kritvi-bhatia17@users.noreply.github.com>

packages/react/src/components/FluidMultiSelect/FluidMultiSelect.stories.js

@@ -6,6 +6,8 @@
  */
 
 import React from 'react';
+
+import { WithLayer } from '../../../.storybook/templates/WithLayer';
 import {
   FluidMultiSelect,
   FluidMultiSelectSkeleton,
@@ -82,6 +84,38 @@ export const Default = () => (
   </div>
 );
 
+export const Filterable = () => (
+  <div style={{ width: '400px' }}>
+    <FluidMultiSelect
+      isFilterable
+      onChange={() => {}}
+      initialSelectedItem={items[2]}
+      id="default"
+      titleText="Label"
+      label="Choose an option"
+      items={items}
+      itemToString={(item) => (item ? item.text : '')}
+    />
+  </div>
+);
+
+export const _FilterableWithLayer = () => (
+  <WithLayer>
+    {(layer) => (
+      <div style={{ width: 300 }}>
+        <FluidMultiSelect
+          isFilterable
+          id={`carbon-multiselect-example-${layer}`}
+          titleText="Multiselect title"
+          items={items}
+          itemToString={(item) => (item ? item.text : '')}
+          selectionFeedback="top-after-reopen"
+        />
+      </div>
+    )}
+  </WithLayer>
+);
+
 export const Condensed = () => (
   <div style={{ width: '400px' }}>
     <FluidMultiSelect

packages/styles/scss/components/multiselect/_multiselect.scss

@@ -89,7 +89,13 @@
 
   .#{$prefix}--multi-select--filterable--input-focused,
   .#{$prefix}--multi-select
-    .#{$prefix}--list-box__field--wrapper--input-focused {
+    .#{$prefix}--list-box__field--wrapper--input-focused:has(
+      button[aria-expanded='false']
+    ),
+  .#{$prefix}--multi-select.#{$prefix}--multi-select--selected
+    .#{$prefix}--list-box__field--wrapper--input-focused:has(
+      button[aria-expanded='true']
+    ) {
     @include focus-outline('outline');
   }