Improve UX of audit events streams UI

What does this MR do and why?

This MR fixes some existing UX issues with the audit events streams UI:

1. Fixes the alignment of the various custom headers tables
2. Fixed dark mode background
3. Added tooltip to the custom header delete button
4. Changes the new header row creation to a manual process rather than an automated one
5. Revises the streaming destinations count to be clear on what is being counted
6. Changed the position of the add form button to be on the same visual line as the streaming destinations count

Known issues that will be fixed in another MR

1. The layout on smaller screens
2. The visual hierarchy between the adding form and each individual streaming item

Screenshots or screen recordings

Custom headers tables alignment

Before	After

Dark mode background

Before	After

Header row creation

Before	After
Screen_Recording_2022-07-26_at_13.40.12	Screen_Recording_2022-08-04_at_14.01.53

Streams count and add streams button position

Before	After

How to set up and validate locally

1. Visit a group's audit events page e.g. http://gdk.test:3000/groups/gitlab-org/-/audit_events and look at the Streams tab.
2. Click the Add streaming destination button and confirm you can add a new destination and new headers.
3. Click the edit button on a destination and confirm that you can add/update/delete headers.
4. Check the add form, add headers table, edit form, and edit headers table lines up with the other content properly.
5. Check the tooltip shown on the destinations delete button.
6. Enable dark mode and confirm the add form, add headers table, edit form, and edit headers table look as expected.

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

• I have evaluated the MR acceptance checklist for this MR.

Related to #367963 (closed) #368442 (closed)