fix(box): remove focus outline

[tomdavies73]

Proposed behaviour

Removes all outlines when the component is focused, removes default browser outline when the component is focused with a set tabIndex.

Current behaviour

Currently, browsers apply a default outline when the component is focused with a set tabIndex.

Checklist

• Commits follow our style guide
• Related issues linked in commit messages if required
• Screenshots are included in the PR if useful
• All themes are supported if required
• Unit tests added or updated if required
• Playwright automation tests added or updated if required
• Storybook added or updated if required
• Translations added or updated (including creating or amending translation keys table in storybook) if required
• Typescript d.ts file added or updated if required
• Related docs have been updated if required

QA

• Tested in provided StackBlitz sandbox/Storybook
• Add new Playwright test coverage if required
• Carbon implementation matches Design System/designs
• UI Tests GitHub check reviewed if required

Additional context

Testing instructions

[tomdavies73]

It is worth noting this PR removes the default focus styling added by browsers for consuming teams using tabIndex on the Box component.

However, due to Box being a layout based component, there are potential plans to deprecate and remove tabIndex from Box to prevent misuse of the component in the future.