fix:(input-group) fluent theme styles

[desig9stein]

Closes #11145

Additional information (check all that apply):

• Bug fix
• New functionality
• Documentation
• Demos
• CI/CD

Checklist:

• All relevant tags have been applied to this PR
• This PR includes unit tests covering all the new code (test guidelines)
• This PR includes API docs for newly added methods/properties (api docs guidelines)
• This PR includes feature/README.MD updates for the feature docs
• This PR includes general feature table updates in the root README.MD
• This PR includes CHANGELOG.MD updates for newly added functionality
• This PR contains breaking changes
• This PR includes ng update migrations for the breaking changes (migrations guidelines)
• This PR includes behavioral changes and the feature specification has been updated with them

[StefanIvanov]

You also need to update the caret color on focus from primary 500 to grays 900

[StefanIvanov]

You also need to update the caret color on focus from primary 500 to grays 900

And one more thing, do you plan to update the disabled styles of the fluent input as well with this PR or it will be a separate task? The idle and filled state also should be updated, more specifically the border color.

[desig9stein]

@StefanIvanov I will update the issue with all the required changes. I will fix them all with this PR

[simeonoff]

Actually, the styles differ from the reference implementation in Fluent UI. The focused styles are achieved using border and not box-shadow. The box shouldn't visibly grow on hover/focus. Please, take a look at how the design is implemented in the Ignite UI for Web Components. I will merge it as it is here, but we will need to make further changes to make sure that web components and angular look and behave the same.