From d2a66c6c5b6274c1371f851db9ba7a11e7af53b6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mathias=20Gla=CC=88ser?= <mathias.glaeser@beaufort.ch>
Date: Thu, 28 May 2026 14:35:23 +0200
Subject: [PATCH] Add overlay host wrapper behavior for consistent target card
 height

---
 patterns/delete-confirmation-overlay.html    |  2 +-
 patterns/vsf-listen-uebersicht-seite-v2.html |  2 +-
 styles/27-patterns-delete-confirmation.css   | 11 +++++++++++
 3 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/patterns/delete-confirmation-overlay.html b/patterns/delete-confirmation-overlay.html
index 93b60cd..1395d4c 100644
--- a/patterns/delete-confirmation-overlay.html
+++ b/patterns/delete-confirmation-overlay.html
@@ -13,7 +13,7 @@
   <section id="pattern-overlay-card" class="sg-delete-confirmation-pattern">
     <p class="sg-preview-label">Pattern: Overlay Card</p>
 
-    <div class="sg-delete-confirmation-pattern__stage" data-pattern="overlay-card" data-dialog-open="false">
+    <div class="sg-delete-confirmation-pattern__stage sg-delete-confirmation-pattern__host sg-object-card" data-pattern="overlay-card" data-dialog-open="false">
       <article class="sg-card sg-object-card sg-delete-confirmation-pattern__target" aria-label="Zu löschendes Objekt">
         <header class="sg-card-segment sg-card-segment--header sg-card-segment--darkblue sg-object-card__header">
           <div class="sg-strong">Alcon Inc.</div>
diff --git a/patterns/vsf-listen-uebersicht-seite-v2.html b/patterns/vsf-listen-uebersicht-seite-v2.html
index 18925a7..d5b4939 100644
--- a/patterns/vsf-listen-uebersicht-seite-v2.html
+++ b/patterns/vsf-listen-uebersicht-seite-v2.html
@@ -112,7 +112,7 @@
     </div>
 
     <div class="sg-object-card-grid" aria-label="VSF Listen Cards Übersicht">
-      <div class="sg-object-card sg-delete-confirmation-pattern sg-delete-confirmation-pattern__stage sg-vsf-list-card-context" data-pattern="overlay-card" data-dialog-open="false" aria-label="VSF List Card Layout List Card">
+      <div class="sg-object-card sg-delete-confirmation-pattern sg-delete-confirmation-pattern__stage sg-delete-confirmation-pattern__host sg-vsf-list-card-context" data-pattern="overlay-card" data-dialog-open="false" aria-label="VSF List Card Layout List Card">
       <article class="sg-card sg-delete-confirmation-pattern__target" data-pattern="object-group-card" aria-label="List Card">
         <header class="sg-card-segment sg-card-segment--header sg-card-segment--darkblue sg-object-card__header" data-pattern-part="object-group-card-header">
           <div class="sg-strong">NAME DER LISTE</div>
diff --git a/styles/27-patterns-delete-confirmation.css b/styles/27-patterns-delete-confirmation.css
index b869bd6..0330e73 100644
--- a/styles/27-patterns-delete-confirmation.css
+++ b/styles/27-patterns-delete-confirmation.css
@@ -11,6 +11,17 @@
   position: relative;
 }
 
+.sg-delete-confirmation-pattern__host {
+  display: flex;
+  flex-direction: column;
+}
+
+.sg-delete-confirmation-pattern__host > .sg-delete-confirmation-pattern__target {
+  flex: 1 1 auto;
+  width: 100%;
+  min-height: 100%;
+}
+
 .sg-delete-confirmation-pattern__target {
   position: relative;
   overflow: hidden;