[base-ui][number input] Icon position issue

[oliviertassinari]

Related to #38521

Steps to reproduce 🕹

Link to live example:

Steps:

1. Open https://mui.com/base-ui/react-number-input/

Screen.Recording.2023-10-03.at.01.47.30.mov

Current behavior 😯

Different look & feel between different style engines

Expected behavior 🤔

Same look & feel between different style engines.

Context 🔦

I also think that we could make some design tweaks:

• Increase the font size a bit of the arrow
• Add more padding-right to compensate for the border-radius only on the right side
• Move the arrow a bit closer to the horizontal middle

Current:

After:

Your environment 🌎

npx @mui/envinfo

  Don't forget to mention which browser you used.
  Output from `npx @mui/envinfo` goes here.

[spritualrahul]

I will be happy to contribute my experience in this project and try to resolve the issue, kindly assign this issue to me.

[DARSHANITRIPATHI]

can you please assign it to me?

[Pratik1603]

Can you please assign me this issue

[danilo-leal]

@zanivan's PR linked above will tackle this if it still needs to! 🤙
PS: I removed the bug label as this isn't a functional issue but more of a design fix.