[Serverless Search] refactor(security): update create api key flyout …

…markup (#170074)

## Summary

Updating the markup for the security plugin create API key flyout to
match the flyout used by serverless search getting started page.
Update API key with roles
<img width="957" alt="image"
src="https://github.com/elastic/kibana/assets/1972968/cabd5546-246e-42ef-9870-0e35a5c3aa5d">

Update API key with metadata
<img width="957" alt="image"
src="https://github.com/elastic/kibana/assets/1972968/ce774206-723b-4731-a9bf-8d9141e277a3">

### Checklist

Delete any items that are not applicable to this PR.

- [x] Any text added follows [EUI's writing
guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses
sentence case text and includes [i18n
support](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md)
- [x] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios
- [x] Any UI touched in this PR is usable by keyboard only (learn more
about [keyboard accessibility](https://webaim.org/techniques/keyboard/))
- [x] Any UI touched in this PR does not create any new axe failures
(run axe in browser:
[FF](https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/),
[Chrome](https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US))
- [x] This renders correctly on smaller devices using a responsive
layout. (You can test this [in your
browser](https://www.browserstack.com/guide/responsive-testing-on-local-server))
- [ ] This was checked for [cross-browser
compatibility](https://www.elastic.co/support/matrix#matrix_browsers)

---------

Co-authored-by: Sander Philipse <[email protected]>
Co-authored-by: Sander Philipse <[email protected]>
Co-authored-by: kibanamachine <[email protected]>