Update flash container with height variable for top position

What does this MR do and why?

!114984 (merged) introduces new $calc-application-header-height, $calc-application-footer-height, and $calc-application-viewport-height variables which use calc() to calculate heights based on the conditional presence of system header, system footer, performance bar, and header.

Use $calc-application-header-height variable for top property.

Remove $flash-container-top variable.

Screenshots or screen recordings

Before	After
CleanShot_2023-04-18_at_16.03.53	CleanShot_2023-04-18_at_16.02.47

How to set up and validate locally

1. Toggle the performance bar with p + b
2. Enable system header/footer messages in admin settings. This should provide a flash message in the container.
3. Ensure header top position is correct

Alternative: force a message in the container to display on any view with the following diff:

diff --git a/app/views/layouts/_flash.html.haml b/app/views/layouts/_flash.html.haml
index 5a558d42802a..7b4e6da47e45 100644
--- a/app/views/layouts/_flash.html.haml
+++ b/app/views/layouts/_flash.html.haml
@@ -5,6 +5,8 @@
 - type_to_variant = {'alert' => 'danger', 'notice' => 'info', 'success' => 'success', 'warning' => 'warning'}
 - closable = %w[alert notice success]
 .flash-container.flash-container-page.sticky{ data: { qa_selector: 'flash_container' }, class: flash_container_class }
+  .gl-p-5.gl-bg-blue-200
+    Hello I am a flash message inside a sitcky container
   - flash.each do |key, value|
     - if key == 'toast' && value
       .js-toast-message{ data: { message: value } }

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 #403579 (closed)