Adjust overlay card dialog sizing

styles/01-foundations.css

@@ -231,7 +231,7 @@
   --layout-delete-confirmation-target-max-width: 35rem;
   --layout-delete-confirmation-overlay-width-factor: 0.8;
   --layout-delete-confirmation-overlay-offset-block-start: 10%;
-  --layout-delete-confirmation-overlay-max-height: calc(100vh - 10vh);
+  --layout-delete-confirmation-overlay-max-height: calc(100% - var(--layout-delete-confirmation-overlay-offset-block-start) - var(--layout-delete-confirmation-overlay-offset-block-start));
   --layout-delete-confirmation-content-gap: var(--spacing-small);
   --layout-delete-confirmation-actions-gap: var(--spacing-small);
   --layout-delete-confirmation-actions-offset-block-start: var(--spacing-large);

styles/27-patterns-delete-confirmation.css

@@ -42,13 +42,14 @@
 
 .sg-delete-confirmation-pattern__floating-card {
   position: absolute;
-  top: 50%;
+  top: var(--layout-delete-confirmation-overlay-offset-block-start);
   left: 50%;
-  transform: translate(-50%, -50%);
+  transform: translateX(-50%);
   width: calc(100% * var(--layout-delete-confirmation-overlay-width-factor));
   box-sizing: border-box;
   max-width: calc(100% * var(--layout-delete-confirmation-overlay-width-factor));
-  height: var(--layout-delete-confirmation-overlay-height, auto);
+  height: auto;
+  max-height: var(--layout-delete-confirmation-overlay-max-height);
   overflow: hidden;
   z-index: var(--layer-delete-confirmation-overlay);
   box-shadow: var(--shadow-overlay);

styles/33-layouts-vsf-list-detailseite.css

@@ -48,10 +48,10 @@
 
 .sg-vsf-list-detail-page__meldungen-overlay-pattern {
   max-width: 100%;
+  --layout-delete-confirmation-overlay-offset-block-start: calc(var(--spacing-large) * 5);
 }
 
 .sg-vsf-list-detail-page__meldungen-overlay-pattern .sg-delete-confirmation-pattern__floating-card {
-  top: calc(var(--spacing-large) * 5);
   transform: translateX(-50%);
 }