Keep add-to-list overlay header and footer fixed

styles/27-patterns-delete-confirmation.css

@@ -49,13 +49,13 @@
   box-sizing: border-box;
   max-width: calc(100% * var(--layout-delete-confirmation-overlay-width-factor));
   height: var(--layout-delete-confirmation-overlay-height, auto);
-  overflow: auto;
+  overflow: hidden;
   z-index: var(--layer-delete-confirmation-overlay);
   box-shadow: var(--shadow-overlay);
 }
 
 .sg-delete-confirmation-pattern__floating-card.sg-card.sg-card--overlay-host {
-  overflow: auto;
+  overflow: hidden;
 }
 
 .sg-delete-confirmation-pattern__floating-card[hidden] {
@@ -69,9 +69,18 @@
   background: var(--surface-delete-confirmation-overlay);
 }
 
+.sg-delete-confirmation-pattern__scroll-region {
+  display: flex;
+  flex: 1 1 auto;
+  min-height: 0;
+  flex-direction: column;
+  overflow: auto;
+}
+
 .sg-delete-confirmation-pattern__actions-segment {
   border-bottom-left-radius: var(--radius-card);
   border-bottom-right-radius: var(--radius-card);
+  flex: 0 0 auto;
 }
 
 .sg-delete-confirmation-pattern__list {
@@ -165,6 +174,10 @@
   margin-top: 0;
 }
 
+.sg-delete-confirmation-pattern__scroll-region > .sg-delete-confirmation-pattern__create-list-segment {
+  flex: 0 0 auto;
+}
+
 .sg-delete-confirmation-pattern__create-list-toggle {
   width: 100%;
 }