Add direct children selectors to avoid cascading styles into a menu form (#25279)

diff --git a/scss/_input-group.scss b/scss/_input-group.scss
index fcf7c3c432201f9a52c7f28d2b18c33f46ae9328..2f7b05d5d82d7e78e633862570084c0624257705 100644 (file)
--- a/scss/_input-group.scss
+++ b/scss/_input-group.scss
@@ -11,9 +11,9 @@
   align-items: stretch;
   width: 100%;
 
-  .form-control,
-  .custom-select,
-  .custom-file {
+  > .form-control,
+  > .custom-select,
+  > .custom-file {
     position: relative; // For focus state's z-index
     flex: 1 1 auto;
     // Add width 1% and flex-basis auto to ensure that button will not wrap out
@@ -33,15 +33,15 @@
     }
   }
 
-  .form-control,
-  .custom-select {
+  > .form-control,
+  > .custom-select {
     &:not(:last-child) { @include border-right-radius(0); }
     &:not(:first-child) { @include border-left-radius(0); }
   }
 
   // Custom file inputs have more complex markup, thus requiring different
   // border-radius overrides.
-  .custom-file {
+  > .custom-file {
     display: flex;
     align-items: center;