Share button doesn't auto wrap

Hello, I have made the necessary CSS changes to address the issue where the .social-sharing-buttons component in the sidebar does not wrap correctly when all share buttons are enabled. Previously, the buttons were displayed in a single row, exceeding the container's boundaries. After applying the CSS updates, the wrapping functionality is working as expected, and the buttons now align within the container without overflowing.

While the CSS changes resolved the wrapping issue locally, the changes are failing in the pipeline when I push the code. I would like someone to review the updated CSS to identify any potential mistakes or areas for improvement to ensure it passes validation and follows best practices.

Check the screenshot of before and after difference

I'm concerned with the defined max-widths and some people may be able to go beyond that given their design. I would think we should be able to do it in a way where the module doesn't define the max width but that it should properly wrap within its container instead of extending beyond that.