Merge remote-tracking branch 'origin/mpopov/fix/input-group/indigo-outline' into mpopov/fix/input-group/indigo-outline

# Conflicts:
#	src/components/input/themes/shared/input.fluent.scss
#	src/components/textarea/themes/shared/textarea.fluent.scss

Author: desig9stein

src/components/textarea/themes/shared/textarea.fluent.scss

@@ -74,6 +74,46 @@ $border-size: rem(1px);
 }
 
 
+[part~='container'] {
+    position: relative;
+    background: var-get($theme, 'border-background');
+    align-items: stretch;
+    overflow: hidden;
+    border-radius: var-get($theme, 'border-border-radius');
+
+    &::before {
+        content: '';
+        position: absolute;
+        inset: 0;
+        width: 100%;
+        height: 100%;
+        box-shadow: inset 0 0 0 $border-size  var-get($theme, 'border-color');
+        border-radius: var-get($theme, 'border-border-radius');
+        user-select: none;
+        pointer-events: none;
+        z-index: 1;
+    }
+}
+
+
+:host(:hover) {
+    [part~='container'] {
+        &::before {
+            box-shadow: inset 0 0 0 $border-size var-get($theme, 'hover-border-color');
+        }
+    }
+}
+
+:host(:focus-within) {
+    [part~='container'] {
+        &::before {
+            box-shadow: 0 0 0 $border-size var-get($theme, 'focused-border-color'),
+            inset 0 0 0 calc($border-size + #{rem(1px)}) var-get($theme, 'focused-border-color');
+        }
+    }
+}
+
+
 :host([invalid]) {
     [part~='label'] {
         color: var-get($theme, 'idle-text-color');