Margins on icon buttons

[GCHQ-Developer-847]

Summary of the bug

Icon buttons have a 1px margin at the top and bottom which isn't needed. It means the space they take up technically isn't square and may cause slight alignment issues.

🪜 How to reproduce

1. Inspect the ic-button element on an icon button, e.g. on the website.
2. See that its height is 2px more than its width.

📸 Screenshots or code

🧐 Expected behaviour

There shouldn't be an extra margin. The whole icon button should be square.

Additional info

The icon button is used in a few different components, so it will require updates to quite a few visual test screenshots. It's also important to check in these components that this change doesn't cause their measurements / layouts to no longer match their Figma designs.

When completing this ticket please also complete the work done in https://github.com/mi6/ic-ui-kit/pull/2376 to ensure the search icon appears on safari

[GCHQ-Developer-741]

On hold whilst #884 is being completed

3 Mar 25: No longer on hold as the XS Buttons work has been pushed back

[ad9242]

unassigned gd2910 - there is a closed PR which contains changes, but probably best to pick this up in a new branch\PR and get new baseline images genereated