MOBILE-4060 theme: Fix ionic mixin when using add-root-selector

More info: https://github.com/ionic-team/ionic-framework/pull/25264

src/theme/helpers/ionic.functions.string.scss

@@ -147,7 +147,8 @@
     // If the selector contains :host it means it is targeting just the host
     // element so we can change it to look for host-context
     } @else if str-contains($selector, ":host") {
-      $list: append($list, ":host-context(#{$addHostSelector})", comma);
+      $shadow-element: str-replace($selector, ":host", ":host-context(#{$addHostSelector})");
+      $list: append($list, $shadow-element, comma);
       // If the selector does not contain host at all it is either a shadow
       // or normal element so append both the dir check and host-context
     } @else {