diff --git a/core/src/css/palettes/dark.scss b/core/src/css/palettes/dark.scss
index 18179f2e2e8..0b213df01ed 100644
--- a/core/src/css/palettes/dark.scss
+++ b/core/src/css/palettes/dark.scss
@@ -130,8 +130,13 @@ $colors:  (
     --ion-card-background: #1c1c1d;
   }
 
+  & ion-card {
+    --ion-item-background: var(--ion-card-background);
+  }
+
   & ion-modal {
     --ion-background-color: var(--ion-color-step-100, var(--ion-background-color-step-100));
+    --ion-item-background: var(--ion-background-color);
     --ion-toolbar-background: var(--ion-color-step-150, var(--ion-background-color-step-150));
     --ion-toolbar-border-color: var(--ion-color-step-250, var(--ion-background-color-step-250));
   }
diff --git a/core/src/css/test/list-surfaces/index.html b/core/src/css/test/list-surfaces/index.html
new file mode 100644
index 00000000000..da343e28472
--- /dev/null
+++ b/core/src/css/test/list-surfaces/index.html
@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>List surfaces</title>
+    <link href="../../../../css/ionic.bundle.css" rel="stylesheet" />
+    <link href="../../../../scripts/testing/styles.css" rel="stylesheet" />
+    <script src="../../../../scripts/testing/scripts.js"></script>
+    <script type="module" src="../../../../dist/ionic/ionic.esm.js"></script>
+  </head>
+  <body>
+    <ion-app>
+      <ion-content>
+        <div id="surfaces">
+          <ion-list id="outside-list"><ion-item lines="none">Outside the cards</ion-item></ion-list>
+          <ion-card id="default-card">
+            <ion-card-header><ion-card-title>Default card</ion-card-title></ion-card-header>
+            <ion-list><ion-item lines="none">In the card</ion-item></ion-list>
+          </ion-card>
+          <ion-card id="custom-card" style="--ion-card-background: #243b53">
+            <ion-card-header><ion-card-title>Custom card color</ion-card-title></ion-card-header>
+            <ion-list>
+              <ion-item lines="none">Uses the card color</ion-item>
+              <ion-item id="custom-item" lines="none" style="--background: #5f244f">Explicit item color</ion-item>
+            </ion-list>
+          </ion-card>
+          <ion-card id="custom-list-card" style="--ion-item-background: #5f244f">
+            <ion-card-header><ion-card-title>Explicit list color</ion-card-title></ion-card-header>
+            <ion-list><ion-item lines="none">Keeps the item token</ion-item></ion-list>
+          </ion-card>
+        </div>
+        <button id="open-modal" onclick="document.querySelector('ion-modal').present()">Open modal</button>
+        <ion-modal style="--width: 320px; --height: 380px">
+          <div class="ion-page">
+            <ion-content>
+              <ion-list id="modal-list"><ion-item lines="none">In the modal</ion-item></ion-list>
+              <ion-card id="modal-card">
+                <ion-card-header><ion-card-title>Card in the modal</ion-card-title></ion-card-header>
+                <ion-list><ion-item lines="none">Uses the card color</ion-item></ion-list>
+              </ion-card>
+              <ion-list
+                ><ion-item id="modal-custom-item" lines="none" style="--background: #5f244f"
+                  >Explicit item color</ion-item
+                ></ion-list
+              >
+            </ion-content>
+          </div>
+        </ion-modal>
+      </ion-content>
+    </ion-app>
+  </body>
+</html>
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts
new file mode 100644
index 00000000000..d3074be064c
--- /dev/null
+++ b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts
@@ -0,0 +1,29 @@
+import { expect } from '@playwright/test';
+import { configs, test } from '@utils/test/playwright';
+
+configs({ directions: ['ltr'], palettes: ['light', 'dark'] }).forEach(({ title, screenshot, config }) => {
+  test.describe(title('list surfaces'), () => {
+    test('should preserve card, outside-list, and custom backgrounds', async ({ page }) => {
+      await page.goto('/src/css/test/list-surfaces', config);
+      await expect(page.locator('#surfaces')).toHaveScreenshot(screenshot('list-surfaces-cards'));
+    });
+
+    for (const customBackground of [false, true]) {
+      test(`should preserve ${customBackground ? 'custom' : 'default'} modal and nested-card backgrounds`, async ({
+        page,
+      }) => {
+        await page.goto('/src/css/test/list-surfaces', config);
+        const modal = page.locator('ion-modal');
+        if (customBackground) {
+          await modal.evaluate((el: HTMLIonModalElement) => el.style.setProperty('--ion-background-color', '#243b53'));
+        }
+        const didPresent = await page.spyOnEvent('ionModalDidPresent');
+        await page.locator('#open-modal').click();
+        await didPresent.next();
+        await expect(modal).toHaveScreenshot(
+          screenshot(`list-surfaces-modal-${customBackground ? 'custom' : 'default'}`)
+        );
+      });
+    }
+  });
+});
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-ios-ltr-Mobile-Chrome-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..213b63daed1
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-ios-ltr-Mobile-Firefox-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..e063625a138
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-ios-ltr-Mobile-Safari-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..3a645b1f30c
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-ios-ltr-dark-Mobile-Chrome-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-ios-ltr-dark-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..dfb87cacb19
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-ios-ltr-dark-Mobile-Chrome-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-ios-ltr-dark-Mobile-Firefox-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-ios-ltr-dark-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..13b4776bd35
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-ios-ltr-dark-Mobile-Firefox-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-ios-ltr-dark-Mobile-Safari-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-ios-ltr-dark-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..7cafcfc2e12
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-ios-ltr-dark-Mobile-Safari-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-md-ltr-Mobile-Chrome-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..5ad0dcad97b
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-md-ltr-Mobile-Firefox-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-md-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..378b15dd36f
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-md-ltr-Mobile-Safari-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..e86df3593ea
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-md-ltr-dark-Mobile-Chrome-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-md-ltr-dark-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..282c6254acb
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-md-ltr-dark-Mobile-Chrome-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-md-ltr-dark-Mobile-Firefox-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-md-ltr-dark-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..362c00d3d5e
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-md-ltr-dark-Mobile-Firefox-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-md-ltr-dark-Mobile-Safari-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-md-ltr-dark-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..40e2735b4de
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-cards-md-ltr-dark-Mobile-Safari-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-ios-ltr-Mobile-Chrome-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..5847adb78a2
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-ios-ltr-Mobile-Firefox-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..ca9546c8a29
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-ios-ltr-Mobile-Safari-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..5b28022b907
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-ios-ltr-dark-Mobile-Chrome-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-ios-ltr-dark-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..a91c4bd2bd6
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-ios-ltr-dark-Mobile-Chrome-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-ios-ltr-dark-Mobile-Firefox-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-ios-ltr-dark-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..eb7d4ba3602
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-ios-ltr-dark-Mobile-Firefox-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-ios-ltr-dark-Mobile-Safari-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-ios-ltr-dark-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..7bed4364414
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-ios-ltr-dark-Mobile-Safari-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-md-ltr-Mobile-Chrome-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..429f22cb4ea
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-md-ltr-Mobile-Firefox-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-md-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..e011adb405b
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-md-ltr-Mobile-Safari-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..086be089d8f
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-md-ltr-dark-Mobile-Chrome-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-md-ltr-dark-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..b050a71580a
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-md-ltr-dark-Mobile-Chrome-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-md-ltr-dark-Mobile-Firefox-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-md-ltr-dark-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..4559d807c6f
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-md-ltr-dark-Mobile-Firefox-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-md-ltr-dark-Mobile-Safari-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-md-ltr-dark-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..649e6e2527a
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-custom-md-ltr-dark-Mobile-Safari-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-ios-ltr-Mobile-Chrome-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..8b5109e89e1
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-ios-ltr-Mobile-Firefox-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..f3741af3fe7
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-ios-ltr-Mobile-Safari-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..593a5ace2a6
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-ios-ltr-dark-Mobile-Chrome-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-ios-ltr-dark-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..85e6610c876
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-ios-ltr-dark-Mobile-Chrome-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-ios-ltr-dark-Mobile-Firefox-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-ios-ltr-dark-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..a2b9e50c34b
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-ios-ltr-dark-Mobile-Firefox-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-ios-ltr-dark-Mobile-Safari-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-ios-ltr-dark-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..0f343a6527c
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-ios-ltr-dark-Mobile-Safari-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-md-ltr-Mobile-Chrome-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..43fe60107cc
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-md-ltr-Mobile-Firefox-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-md-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..8bcad4bece8
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-md-ltr-Mobile-Safari-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..86ecccb1568
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-md-ltr-dark-Mobile-Chrome-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-md-ltr-dark-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..acc21a836be
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-md-ltr-dark-Mobile-Chrome-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-md-ltr-dark-Mobile-Firefox-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-md-ltr-dark-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..dc3b82dc513
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-md-ltr-dark-Mobile-Firefox-linux.png differ
diff --git a/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-md-ltr-dark-Mobile-Safari-linux.png b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-md-ltr-dark-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..246072abc30
Binary files /dev/null and b/core/src/css/test/list-surfaces/list-surfaces.e2e.ts-snapshots/list-surfaces-modal-default-md-ltr-dark-Mobile-Safari-linux.png differ