feat(datetime): add styles for adjacent days for ionic theme

core/src/components/datetime/datetime.ionic.scss

@@ -104,6 +104,7 @@
   --background-activated: #{globals.$ion-primitives-neutral-200};
   --background-hover: #{globals.$ion-primitives-neutral-200};
   --background-hover-opacity: 1;
+  min-height: globals.$ion-scale-1000;
 }
 
 // TODO(ROU-11119): Rewrite this when we replace the ion-button with a native button
@@ -153,7 +154,8 @@
 }
 
 // Selected Day
-.calendar-day.calendar-day-active {
+.calendar-day.calendar-day-active,
+.calendar-day.calendar-day-active.calendar-day-adjacent-day {
   background: globals.$ion-semantics-primary-100;
 }
 
@@ -170,8 +172,19 @@
 }
 
 // Pressed Day
-.calendar-day:active {
-  background: globals.$ion-semantics-primary-300;
+.calendar-day:active,
+.calendar-day.calendar-day-adjacent-day:active {
+  background: globals.$ion-bg-primary-subtle-press;
+}
+
+// Adjacent Day
+.calendar-day.calendar-day-adjacent-day {
+  color: globals.$ion-text-subtlest;
+}
+
+// Selected Adjacent Day
+.calendar-day.calendar-day-active.calendar-day-adjacent-day {
+  color: globals.$ion-text-default;
 }
 
 // Time / Header
@@ -203,7 +216,6 @@
 
 // Calendar / Footer / Action Buttons
 // -----------------------------------
-
 :host .datetime-buttons ion-buttons,
 .datetime-action-buttons .datetime-action-buttons-container {
   flex-flow: column;

core/src/components/datetime/test/show-adjacent-days/datetime.e2e.ts

@@ -4,7 +4,7 @@ import { configs, test } from '@utils/test/playwright';
 /**
  * This behavior does not vary across directions
  */
-configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
+configs({ modes: ['ios', 'md', 'ionic-md'], directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
   test.describe(title('datetime: show adjacent days'), () => {
     test('should not have visual regressions', async ({ page }) => {
       await page.goto('/src/components/datetime/test/show-adjacent-days', config);