fix: correct the display of checkbox read-only state

[jawinn]

Description

As noted in CSS-833, the CSS, SWC, and RSP implementations of read-only checkboxes/checkbox groups, and the docs surrounding them, conflicted with each other. After discussing with the design team, it was decided that the first step would be for CSS to bring our visual styles in line with React's implementation.

This PR updates field group to remove the additional checkbox read-only styles that were causing the box to not display and for commas to be appended. It also moves the order of some checkbox CSS slightly to make sure the correct styles are applied when the read-only checkbox does not also have the disabled attribute (how it was displayed previously was partly relying on disabled styles). The checkboxes are made sure to be shown as both focusable and immutable.

This also updates all of the docs surrounding these things and adds a new storybook Docs example for Checkbox.

CSS-1004

How and where has this been tested?

Please tag yourself on the tests you've marked complete to confirm the tests have been run by someone other than the author.

Validation steps

• [ ] Field group docs page: read-only example shows full checkbox with boxes and no added commas, and read-only colors
• [ ] Checkbox docs page: read-only example shows full checkbox with boxes and no added commas, and read-only colors
• [ ] Review and proofread docs for both examples
• [ ] Read-only checkbox is immutable in both docs and stories (clicking does not change checkedness)
• [ ] Read-only checkboxes are focusable

Regression testing

Validate:

1. The documentation pages for at least two other components are still loading, including:

• [ ] The pages render correctly, are accessible, and are responsive.

2. If components have been modified, VRTs have been run on this branch:

• [ ] VRTs have been run and looked at.
• [ ] Any VRT changes have been accepted (by reviewer and/or PR author), or there are no changes.

Screenshots

Before:

After:

To-do list

• [x] I have read the contribution guidelines.
• [x] I have updated relevant storybook stories and templates.
• [ ] I have tested these changes in Windows High Contrast mode.
• [x] If my change impacts documentation, I have updated the documentation accordingly.
• [ ] ✨ This pull request is ready to merge. ✨