diff --git a/core/api.txt b/core/api.txt
index 0f16f5afa33..866f713e281 100644
--- a/core/api.txt
+++ b/core/api.txt
@@ -428,6 +428,9 @@ ion-datetime,css-prop,--background-rgb
 ion-datetime,css-prop,--title-color
 ion-datetime,css-prop,--wheel-fade-background-rgb
 ion-datetime,css-prop,--wheel-highlight-background
+ion-datetime,part,calendar-day
+ion-datetime,part,calendar-day active
+ion-datetime,part,calendar-day today
 ion-datetime,part,month-year-button
 ion-datetime,part,time-button
 ion-datetime,part,time-button active
diff --git a/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-modal-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-modal-ios-ltr-Mobile-Chrome-linux.png
index 789bbf66fa5..a5b053f102e 100644
Binary files a/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-modal-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-modal-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-modal-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-modal-ios-ltr-Mobile-Firefox-linux.png
index 7e3c89c5a22..7708af23296 100644
Binary files a/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-modal-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-modal-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-modal-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-modal-ios-ltr-Mobile-Safari-linux.png
index 07832cba844..cded8fecd75 100644
Binary files a/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-modal-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-modal-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-modal-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-modal-md-ltr-Mobile-Firefox-linux.png
index 4f62c36177e..0d52983532e 100644
Binary files a/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-modal-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-modal-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-popover-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-popover-ios-ltr-Mobile-Chrome-linux.png
index 01adecdfa4e..02797776be1 100644
Binary files a/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-popover-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-popover-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-popover-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-popover-ios-ltr-Mobile-Safari-linux.png
index 6ef67d13e37..c4d1d296ab9 100644
Binary files a/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-popover-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-popover-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/datetime.ios.scss b/core/src/components/datetime/datetime.ios.scss
index 155ab6d5f77..2e6b322bb06 100644
--- a/core/src/components/datetime/datetime.ios.scss
+++ b/core/src/components/datetime/datetime.ios.scss
@@ -20,7 +20,7 @@
   @include padding($datetime-ios-padding, $datetime-ios-padding, $datetime-ios-padding, $datetime-ios-padding);
 
   border-bottom: $datetime-ios-border-color;
-  
+
   font-size: 14px;
 }
 
@@ -85,27 +85,32 @@
    */
   @include padding($datetime-ios-padding * 0.5, $datetime-ios-padding * 0.5, $datetime-ios-padding * 0.5, $datetime-ios-padding * 0.5);
 
+  align-items: center;
+
   height: calc(100% - #{$datetime-ios-padding});
 }
 
-:host .calendar-day {
-  font-size: 20px;
-}
+:host .calendar-day-wrapper {
+  @include padding(4px);
+
+  // This is required so that the calendar day wrapper
+  // will collapse instead of expanding to fill the button
+  height: 0;
 
-.calendar-day:focus .calendar-day-highlight,
-.calendar-day.calendar-day-active .calendar-day-highlight {
-  opacity: 0.2;
+  min-height: 16px;
 }
 
-.calendar-day.calendar-day-active .calendar-day-highlight {
-  background: current-color(base);
+:host .calendar-day {
+  width: $datetime-ios-day-width;
+  min-width: $datetime-ios-day-width;
+
+  height: $datetime-ios-day-height;
+
+  font-size: 20px;
 }
 
-// !important is needed here to overwrite custom highlight background, which is inline.
-// Does not apply to the active state because highlights aren't applied at all there.
-.calendar-day:focus .calendar-day-highlight {
-  /* stylelint-disable-next-line declaration-no-important */
-  background: current-color(base) !important;
+.calendar-day.calendar-day-active {
+  background: current-color(base, 0.2);
 }
 
 /**
@@ -135,12 +140,6 @@
   color: current-color(contrast);
 }
 
-.calendar-day.calendar-day-today.calendar-day-active .calendar-day-highlight {
-  background: current-color(base);
-
-  opacity: 1;
-}
-
 // Time / Header
 // -----------------------------------
 :host .datetime-time {
diff --git a/core/src/components/datetime/datetime.ios.vars.scss b/core/src/components/datetime/datetime.ios.vars.scss
index c96495bd56a..256cce4b6e9 100644
--- a/core/src/components/datetime/datetime.ios.vars.scss
+++ b/core/src/components/datetime/datetime.ios.vars.scss
@@ -15,3 +15,9 @@ $datetime-ios-time-width:           68px !default;
 
 /// @prop - Border radius of the time picker
 $datetime-ios-time-border-radius:   8px !default;
+
+/// @prop - Width of the calendar day
+$datetime-ios-day-width: 40px !default;
+
+/// @prop - Height of the calendar day
+$datetime-ios-day-height: $datetime-ios-day-width !default;
diff --git a/core/src/components/datetime/datetime.md.scss b/core/src/components/datetime/datetime.md.scss
index 97bb2e3fc20..751213eab4b 100644
--- a/core/src/components/datetime/datetime.md.scss
+++ b/core/src/components/datetime/datetime.md.scss
@@ -69,15 +69,12 @@
 
 // Individual day button in month
 :host .calendar-day {
-  @include padding(13px, 0, 13px, 0px);
+  width: $datetime-md-day-width;
+  min-width: $datetime-md-day-width;
 
-  font-size: $datetime-md-calendar-item-font-size;
-}
-
-.calendar-day:focus .calendar-day-highlight {
-  background: current-color(base, 0.2);
+  height: $datetime-md-day-height;
 
-  box-shadow: 0px 0px 0px 4px current-color(base, 0.2);
+  font-size: $datetime-md-calendar-item-font-size;
 }
 
 /**
@@ -85,11 +82,9 @@
  * should have ion-color for text color.
  */
 :host .calendar-day.calendar-day-today {
-  color: current-color(base);
-}
-
-.calendar-day.calendar-day-today .calendar-day-highlight {
   border: 1px solid current-color(base);
+
+  color: current-color(base);
 }
 
 /**
@@ -101,7 +96,7 @@
   color: current-color(contrast);
 }
 
-.calendar-day.calendar-day-active .calendar-day-highlight {
+.calendar-day.calendar-day-active {
   border: 1px solid current-color(base);
 
   background: current-color(base);
diff --git a/core/src/components/datetime/datetime.md.vars.scss b/core/src/components/datetime/datetime.md.vars.scss
index ee1b2bfe82a..db1cab9888a 100644
--- a/core/src/components/datetime/datetime.md.vars.scss
+++ b/core/src/components/datetime/datetime.md.vars.scss
@@ -15,3 +15,9 @@ $datetime-md-header-padding:           20px !default;
 
 /// @prop - Padding for content
 $datetime-md-padding:                  16px !default;
+
+/// @prop - Width of the calendar day
+$datetime-md-day-width: 42px !default;
+
+/// @prop - Height of the calendar day
+$datetime-md-day-height: $datetime-md-day-width !default;
diff --git a/core/src/components/datetime/datetime.scss b/core/src/components/datetime/datetime.scss
index 34eca2603cc..c9382f8f495 100644
--- a/core/src/components/datetime/datetime.scss
+++ b/core/src/components/datetime/datetime.scss
@@ -290,6 +290,10 @@ ion-picker-column-internal {
 }
 
 :host .calendar-body .calendar-month {
+  display: flex;
+
+  flex-flow: column;
+
   /**
    * Swiping should snap to at
    * most one month at a time.
@@ -325,13 +329,31 @@ ion-picker-column-internal {
   grid-template-columns: repeat(7, 1fr);
 }
 
+:host .calendar-day-wrapper {
+  display: flex;
+
+  align-items: center;
+  justify-content: center;
+
+  // Adding a min width and min height allows
+  // it to shrink smaller than its content
+  // which keeps the calendar day highlight
+  // larger while letting the grid items shrink
+  min-width: 0;
+
+  min-height: 0;
+
+  overflow: visible;
+}
+
 /**
  * Center the day text vertically
  * and horizontally within its grid cell.
  */
 :host .calendar-day {
-  @include padding(0px, 0px, 0px, 0px);
-  @include margin(0px, 0px, 0px, 0px);
+  @include border-radius(50%);
+  @include padding(0px);
+  @include margin(0px);
 
   display: flex;
 
@@ -362,16 +384,10 @@ ion-picker-column-internal {
   opacity: 0.4;
 }
 
-.calendar-day-highlight {
-  @include border-radius(32px, 32px, 32px, 32px);
-  @include padding(4px, 4px, 4px, 4px);
-
-  position: absolute;
-
-  width: 32px;
-  height: 32px;
+.calendar-day:focus {
+  background: current-color(base, 0.2);
 
-  z-index: -1;
+  box-shadow: 0px 0px 0px 4px current-color(base, 0.2);
 }
 
 // Time / Header
diff --git a/core/src/components/datetime/datetime.tsx b/core/src/components/datetime/datetime.tsx
index 2a4a6cb8c9e..acbd124e9d9 100644
--- a/core/src/components/datetime/datetime.tsx
+++ b/core/src/components/datetime/datetime.tsx
@@ -85,6 +85,11 @@ import {
  *
  * @part month-year-button - The button that opens the month/year picker when
  * using a grid style layout.
+ *
+ * @part calendar-day - The individual buttons that display a day inside of the datetime
+ * calendar.
+ * @part calendar-day active - The currently selected calendar day.
+ * @part calendar-day today - The calendar day that contains the current day.
  */
 @Component({
   tag: 'ion-datetime',
@@ -756,7 +761,7 @@ export class Datetime implements ComponentInterface {
     /**
      * Get the number of padding days so
      * we know how much to offset our next selector by
-     * to grab the correct calenday-day element.
+     * to grab the correct calendar-day element.
      */
     const padding = currentMonth.querySelectorAll('.calendar-day-padding');
     const { day } = this.workingParts;
@@ -770,7 +775,7 @@ export class Datetime implements ComponentInterface {
      * and focus it.
      */
     const dayEl = currentMonth.querySelector(
-      `.calendar-day:nth-of-type(${padding.length + day})`
+      `.calendar-day-wrapper:nth-of-type(${padding.length + day}) .calendar-day`
     ) as HTMLElement | null;
     if (dayEl) {
       dayEl.focus();
@@ -2116,69 +2121,85 @@ export class Datetime implements ComponentInterface {
               dateStyle = getHighlightStyles(highlightedDates, dateIsoString, el);
             }
 
-            return (
-              <button
-                tabindex="-1"
-                data-day={day}
-                data-month={month}
-                data-year={year}
-                data-index={index}
-                data-day-of-week={dayOfWeek}
-                disabled={isCalDayDisabled}
-                class={{
-                  'calendar-day-padding': isCalendarPadding,
-                  'calendar-day': true,
-                  'calendar-day-active': isActive,
-                  'calendar-day-today': isToday,
-                }}
-                style={
-                  dateStyle && {
-                    color: dateStyle.textColor,
-                  }
-                }
-                aria-hidden={isCalendarPadding ? 'true' : null}
-                aria-selected={ariaSelected}
-                aria-label={ariaLabel}
-                onClick={() => {
-                  if (isCalendarPadding) {
-                    return;
-                  }
+            let dateParts = undefined;
 
-                  this.setWorkingParts({
-                    ...this.workingParts,
-                    month,
-                    day,
-                    year,
-                  });
-
-                  // multiple only needs date info, so we can wipe out other fields like time
-                  if (multiple) {
-                    this.setActiveParts(
-                      {
-                        month,
-                        day,
-                        year,
-                      },
-                      isActive
-                    );
-                  } else {
-                    this.setActiveParts({
-                      ...activePart,
+            // "Filler days" at the beginning of the grid should not get the calendar day
+            // CSS parts added to them
+            if (!isCalendarPadding) {
+              dateParts = `calendar-day${isActive ? ' active' : ''}${isToday ? ' today' : ''}`;
+            }
+
+            return (
+              <div class="calendar-day-wrapper">
+                <button
+                  // We need to use !important for the inline styles here because
+                  // otherwise the CSS shadow parts will override these styles.
+                  // See https://github.com/WICG/webcomponents/issues/847
+                  // Both the CSS shadow parts and highlightedDates styles are
+                  // provided by the developer, but highlightedDates styles should
+                  // always take priority.
+                  ref={(el) => {
+                    if (el) {
+                      el.style.setProperty('color', `${dateStyle ? dateStyle.textColor : ''}`, 'important');
+                      el.style.setProperty(
+                        'background-color',
+                        `${dateStyle ? dateStyle.backgroundColor : ''}`,
+                        'important'
+                      );
+                    }
+                  }}
+                  tabindex="-1"
+                  data-day={day}
+                  data-month={month}
+                  data-year={year}
+                  data-index={index}
+                  data-day-of-week={dayOfWeek}
+                  disabled={isCalDayDisabled}
+                  class={{
+                    'calendar-day-padding': isCalendarPadding,
+                    'calendar-day': true,
+                    'calendar-day-active': isActive,
+                    'calendar-day-today': isToday,
+                  }}
+                  part={dateParts}
+                  aria-hidden={isCalendarPadding ? 'true' : null}
+                  aria-selected={ariaSelected}
+                  aria-label={ariaLabel}
+                  onClick={() => {
+                    if (isCalendarPadding) {
+                      return;
+                    }
+
+                    this.setWorkingParts({
+                      ...this.workingParts,
                       month,
                       day,
                       year,
                     });
-                  }
-                }}
-              >
-                <div
-                  class="calendar-day-highlight"
-                  style={{
-                    backgroundColor: dateStyle?.backgroundColor,
+
+                    // multiple only needs date info, so we can wipe out other fields like time
+                    if (multiple) {
+                      this.setActiveParts(
+                        {
+                          month,
+                          day,
+                          year,
+                        },
+                        isActive
+                      );
+                    } else {
+                      this.setActiveParts({
+                        ...activePart,
+                        month,
+                        day,
+                        year,
+                      });
+                    }
                   }}
-                ></div>
-                {text}
-              </button>
+                >
+                  {text}
+                </button>
+              </div>
             );
           })}
         </div>
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts b/core/src/components/datetime/test/basic/datetime.e2e.ts
index f42afe91df3..c0ef49adf64 100644
--- a/core/src/components/datetime/test/basic/datetime.e2e.ts
+++ b/core/src/components/datetime/test/basic/datetime.e2e.ts
@@ -490,3 +490,40 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, screenshot, co
     });
   });
 });
+
+/**
+ * This behavior does not differ across
+ * directions.
+ */
+configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
+  test.describe(title('datetime: focus'), () => {
+    test('should focus the selected day and then the day after', async ({ page }) => {
+      await page.setContent(
+        `
+        <ion-datetime value="2023-08-01"></ion-datetime>
+      `,
+        config
+      );
+
+      await page.waitForSelector('.datetime-ready');
+
+      const datetime = page.locator('ion-datetime');
+
+      const day = datetime.locator(`.calendar-day[data-day='1'][data-month='8']`);
+
+      await day.focus();
+      await page.waitForChanges();
+
+      await expect(day).toBeFocused();
+      await expect(datetime).toHaveScreenshot(screenshot(`datetime-focus-selected-calendar-day`));
+
+      await page.keyboard.press('ArrowRight');
+      await page.waitForChanges();
+
+      const nextDay = datetime.locator(`.calendar-day[data-day='2'][data-month='8']`);
+
+      await expect(nextDay).toBeFocused();
+      await expect(datetime).toHaveScreenshot(screenshot(`datetime-focus-calendar-day`));
+    });
+  });
+});
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/date-highlight-end-of-month-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/date-highlight-end-of-month-md-ltr-Mobile-Firefox-linux.png
index 3f6a77c1b20..19a48b0a4de 100644
Binary files a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/date-highlight-end-of-month-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/date-highlight-end-of-month-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/date-highlight-start-of-month-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/date-highlight-start-of-month-md-ltr-Mobile-Firefox-linux.png
index 8292c5aa2c5..ffff346f7e3 100644
Binary files a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/date-highlight-start-of-month-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/date-highlight-start-of-month-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-calendar-day-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-calendar-day-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..ec01822053a
Binary files /dev/null and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-calendar-day-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-calendar-day-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-calendar-day-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..e97caadbc93
Binary files /dev/null and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-calendar-day-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-calendar-day-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-calendar-day-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..f03ac307176
Binary files /dev/null and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-calendar-day-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-calendar-day-md-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-calendar-day-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..2f8609f25c1
Binary files /dev/null and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-calendar-day-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-calendar-day-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-calendar-day-md-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..d0677392f1c
Binary files /dev/null and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-calendar-day-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-calendar-day-md-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-calendar-day-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..2ac29ca13ff
Binary files /dev/null and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-calendar-day-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-selected-calendar-day-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-selected-calendar-day-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..cf043cdc076
Binary files /dev/null and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-selected-calendar-day-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-selected-calendar-day-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-selected-calendar-day-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..3bbdaecac83
Binary files /dev/null and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-selected-calendar-day-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-selected-calendar-day-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-selected-calendar-day-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..24483a3aefb
Binary files /dev/null and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-selected-calendar-day-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-selected-calendar-day-md-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-selected-calendar-day-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..56ff403a941
Binary files /dev/null and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-selected-calendar-day-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-selected-calendar-day-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-selected-calendar-day-md-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..68463c5669f
Binary files /dev/null and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-selected-calendar-day-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-selected-calendar-day-md-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-selected-calendar-day-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..1df1d974ff1
Binary files /dev/null and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-focus-selected-calendar-day-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-clear-button-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-clear-button-ios-ltr-Mobile-Chrome-linux.png
index 512bdf40817..43ea20e62ea 100644
Binary files a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-clear-button-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-clear-button-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-clear-button-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-clear-button-ios-ltr-Mobile-Safari-linux.png
index db6da9ce336..dc4f9c7a9bd 100644
Binary files a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-clear-button-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-clear-button-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-clear-button-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-clear-button-ios-rtl-Mobile-Firefox-linux.png
index a4266434743..0910aa28868 100644
Binary files a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-clear-button-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-clear-button-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-clear-button-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-clear-button-md-ltr-Mobile-Firefox-linux.png
index f13d07b779a..28d6dfe9e43 100644
Binary files a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-clear-button-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-clear-button-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-clear-button-md-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-clear-button-md-rtl-Mobile-Firefox-linux.png
index e762ed69917..11e08333e78 100644
Binary files a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-clear-button-md-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-clear-button-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-custom-buttons-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-custom-buttons-ios-ltr-Mobile-Chrome-linux.png
index 531db8364b6..6db63cc3fd3 100644
Binary files a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-custom-buttons-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-custom-buttons-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-custom-buttons-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-custom-buttons-ios-ltr-Mobile-Safari-linux.png
index 023233b00d5..d23e8097b42 100644
Binary files a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-custom-buttons-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-custom-buttons-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-custom-buttons-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-custom-buttons-ios-rtl-Mobile-Firefox-linux.png
index 74dd7c415da..6cf8e18ebba 100644
Binary files a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-custom-buttons-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-custom-buttons-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-custom-buttons-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-custom-buttons-md-ltr-Mobile-Firefox-linux.png
index f874a315c1c..c6277448301 100644
Binary files a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-custom-buttons-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-custom-buttons-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-custom-buttons-md-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-custom-buttons-md-rtl-Mobile-Firefox-linux.png
index 6f3e2bcd718..e469c431c83 100644
Binary files a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-custom-buttons-md-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-custom-buttons-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-buttons-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-buttons-ios-ltr-Mobile-Chrome-linux.png
index 6806f6a0504..fdb4a0e7150 100644
Binary files a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-buttons-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-buttons-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-buttons-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-buttons-ios-ltr-Mobile-Safari-linux.png
index c7d75879014..70f34e0847d 100644
Binary files a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-buttons-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-buttons-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-buttons-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-buttons-ios-rtl-Mobile-Firefox-linux.png
index 941dec1d533..a6d24beb095 100644
Binary files a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-buttons-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-buttons-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-buttons-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-buttons-md-ltr-Mobile-Firefox-linux.png
index e143d591d71..d7c32033612 100644
Binary files a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-buttons-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-buttons-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-buttons-md-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-buttons-md-rtl-Mobile-Firefox-linux.png
index 541520ead34..7a17536761f 100644
Binary files a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-buttons-md-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-buttons-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-clear-buttons-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-clear-buttons-ios-ltr-Mobile-Chrome-linux.png
index c7e1f7b1c0c..ef9e15aab40 100644
Binary files a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-clear-buttons-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-clear-buttons-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-clear-buttons-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-clear-buttons-ios-ltr-Mobile-Safari-linux.png
index 490c3790085..e209115fd6a 100644
Binary files a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-clear-buttons-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-clear-buttons-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-clear-buttons-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-clear-buttons-ios-rtl-Mobile-Firefox-linux.png
index b2527536ee6..de5fa5d2f31 100644
Binary files a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-clear-buttons-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-clear-buttons-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-clear-buttons-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-clear-buttons-md-ltr-Mobile-Firefox-linux.png
index 85b04ac8b9e..d16209459d5 100644
Binary files a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-clear-buttons-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-clear-buttons-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-clear-buttons-md-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-clear-buttons-md-rtl-Mobile-Firefox-linux.png
index 44226ab7c17..a1bdaed61c5 100644
Binary files a/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-clear-buttons-md-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/basic/datetime.e2e.ts-snapshots/datetime-footer-default-clear-buttons-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/color/datetime.e2e.ts b/core/src/components/datetime/test/color/datetime.e2e.ts
index c100f72480e..da29b5e6401 100644
--- a/core/src/components/datetime/test/color/datetime.e2e.ts
+++ b/core/src/components/datetime/test/color/datetime.e2e.ts
@@ -9,7 +9,7 @@ configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
     test('should not have visual regressions', async ({ page }) => {
       await page.goto('/src/components/datetime/test/color', config);
 
-      const datetime = page.locator('ion-datetime');
+      const datetime = page.locator('#color-datetime');
 
       await expect(datetime).toHaveScreenshot(screenshot(`datetime-color`));
 
diff --git a/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-dark-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-dark-ios-ltr-Mobile-Chrome-linux.png
index e94e4e575c8..bfb7515336e 100644
Binary files a/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-dark-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-dark-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-dark-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-dark-ios-ltr-Mobile-Firefox-linux.png
index 15deace6616..68bdfaf1291 100644
Binary files a/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-dark-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-dark-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-dark-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-dark-ios-ltr-Mobile-Safari-linux.png
index bf06764888c..e29fa0d392a 100644
Binary files a/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-dark-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-dark-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-dark-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-dark-md-ltr-Mobile-Firefox-linux.png
index eb19f2b9b5f..8ea8177ccf2 100644
Binary files a/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-dark-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-dark-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-ios-ltr-Mobile-Chrome-linux.png
index 84ef70a9156..06da7d2c2c8 100644
Binary files a/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-ios-ltr-Mobile-Firefox-linux.png
index 728424ca2e0..dfd494f270b 100644
Binary files a/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-ios-ltr-Mobile-Safari-linux.png
index ba3153d9b6a..c304cc9285a 100644
Binary files a/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-md-ltr-Mobile-Firefox-linux.png
index 9ab7ef198db..b59ad44ba00 100644
Binary files a/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/color/datetime.e2e.ts-snapshots/datetime-color-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/color/index.html b/core/src/components/datetime/test/color/index.html
index 5889d5d7cae..6ce98356886 100644
--- a/core/src/components/datetime/test/color/index.html
+++ b/core/src/components/datetime/test/color/index.html
@@ -9,11 +9,18 @@
     <script src="../../../../../scripts/testing/scripts.js"></script>
     <script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script>
     <style>
+      ion-checkbox,
+      ion-select {
+        margin-inline-start: 10px;
+        margin-inline-end: 10px;
+      }
+
       .grid {
         display: grid;
-        grid-template-columns: repeat(2, minmax(250px, 1fr));
+        grid-template-columns: repeat(auto-fill, 250px);
         grid-gap: 20px;
       }
+
       h2 {
         font-size: 12px;
         font-weight: normal;
@@ -29,10 +36,14 @@
         border-radius: 8px;
       }
 
+      #color-name::first-letter {
+        text-transform: capitalize;
+      }
+
       /*
-       * Dark Colors
-       * -------------------------------------------
-       */
+      * Dark Theme
+      * -------------------------------------------
+      */
 
       body.dark {
         --ion-color-primary: #428cff;
@@ -100,9 +111,9 @@
       }
 
       /*
-       * iOS Dark Theme
-       * -------------------------------------------
-       */
+      * iOS Dark Theme
+      * -------------------------------------------
+      */
 
       .ios body.dark {
         --ion-background-color: #000000;
@@ -144,9 +155,9 @@
       }
 
       /*
-       * Material Design Dark Theme
-       * -------------------------------------------
-       */
+      * Material Design Dark Theme
+      * -------------------------------------------
+      */
 
       .md body.dark {
         --ion-background-color: #121212;
@@ -191,30 +202,23 @@
     <ion-app>
       <ion-header translucent="true">
         <ion-toolbar>
-          <ion-title>Datetime - Color</ion-title>
-          <ion-item lines="none" slot="end">
-            <ion-label>Dark Mode</ion-label>
-            <ion-checkbox slot="end"></ion-checkbox>
-          </ion-item>
-
-          <ion-item lines="none" slot="end">
-            <ion-label>Color</ion-label>
-            <ion-select value="danger">
-              <ion-select-option value="primary">Primary</ion-select-option>
-              <ion-select-option value="secondary">Secondary</ion-select-option>
-              <ion-select-option value="tertiary">Tertiary</ion-select-option>
-              <ion-select-option value="success">Success</ion-select-option>
-              <ion-select-option value="warning">Warning</ion-select-option>
-              <ion-select-option value="danger">Danger</ion-select-option>
-            </ion-select>
-          </ion-item>
+          <ion-checkbox>Dark Mode</ion-checkbox>
+          <ion-select label="Color" justify="end" slot="end" value="danger">
+            <ion-select-option value="primary">Primary</ion-select-option>
+            <ion-select-option value="secondary">Secondary</ion-select-option>
+            <ion-select-option value="tertiary">Tertiary</ion-select-option>
+            <ion-select-option value="success">Success</ion-select-option>
+            <ion-select-option value="warning">Warning</ion-select-option>
+            <ion-select-option value="danger">Danger</ion-select-option>
+          </ion-select>
         </ion-toolbar>
       </ion-header>
       <ion-content class="ion-padding">
         <div class="grid">
           <div class="grid-item">
-            <h2>Default</h2>
+            <h2 id="color-name">Danger</h2>
             <ion-datetime
+              id="color-datetime"
               color="danger"
               value="2022-05-03"
               show-default-title="true"
@@ -224,14 +228,14 @@ <h2>Default</h2>
         </div>
       </ion-content>
       <script>
+        const colorDatetime = document.querySelector('#color-datetime');
+        const colorName = document.querySelector('#color-name');
         const colorSelect = document.querySelector('ion-select');
         const darkModeToggle = document.querySelector('ion-checkbox');
-        const datetimes = document.querySelectorAll('ion-datetime');
 
         colorSelect.addEventListener('ionChange', (ev) => {
-          datetimes.forEach((datetime) => {
-            datetime.color = ev.detail.value;
-          });
+          colorDatetime.color = ev.detail.value;
+          colorName.innerHTML = ev.detail.value;
         });
 
         darkModeToggle.addEventListener('ionChange', (ev) => {
diff --git a/core/src/components/datetime/test/custom/datetime.e2e.ts b/core/src/components/datetime/test/custom/datetime.e2e.ts
index 93164c63f48..5563bc6c107 100644
--- a/core/src/components/datetime/test/custom/datetime.e2e.ts
+++ b/core/src/components/datetime/test/custom/datetime.e2e.ts
@@ -14,7 +14,7 @@ configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
     });
 
     test('should allow styling time picker in grid style datetimes', async ({ page }) => {
-      const timeButton = page.locator('ion-datetime .time-body');
+      const timeButton = page.locator('#custom-grid .time-body');
       const popover = page.locator('.popover-viewport');
       const ionPopoverDidPresent = await page.spyOnEvent('ionPopoverDidPresent');
 
@@ -26,5 +26,41 @@ configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
       await expect(popover).toHaveScreenshot(screenshot(`datetime-custom-time-picker`));
       await expect(timeButton).toHaveScreenshot(screenshot(`datetime-custom-time-button-active`));
     });
+
+    test('should allow styling calendar days in grid style datetimes', async ({ page }) => {
+      const datetime = page.locator('#custom-calendar-days');
+
+      await expect(datetime).toHaveScreenshot(screenshot(`datetime-custom-calendar-days`));
+    });
+  });
+});
+
+/**
+ * This behavior does not differ across
+ * directions.
+ */
+configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
+  test.describe(title('datetime: custom focus'), () => {
+    test('should focus the selected day and then the day after', async ({ page }) => {
+      await page.goto(`/src/components/datetime/test/custom`, config);
+
+      const datetime = page.locator('#custom-calendar-days');
+
+      const day = datetime.locator(`.calendar-day[data-day='15'][data-month='6']`);
+
+      await day.focus();
+      await page.waitForChanges();
+
+      await expect(day).toBeFocused();
+      await expect(datetime).toHaveScreenshot(screenshot(`datetime-custom-focus-selected-calendar-day`));
+
+      await page.keyboard.press('ArrowRight');
+      await page.waitForChanges();
+
+      const nextDay = datetime.locator(`.calendar-day[data-day='16'][data-month='6']`);
+
+      await expect(nextDay).toBeFocused();
+      await expect(datetime).toHaveScreenshot(screenshot(`datetime-custom-focus-calendar-day`));
+    });
   });
 });
diff --git a/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-calendar-days-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-calendar-days-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..8468868363c
Binary files /dev/null and b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-calendar-days-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-calendar-days-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-calendar-days-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..c489c8cc285
Binary files /dev/null and b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-calendar-days-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-calendar-days-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-calendar-days-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..5a6b7753e77
Binary files /dev/null and b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-calendar-days-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-calendar-days-md-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-calendar-days-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..a76d6f3ec25
Binary files /dev/null and b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-calendar-days-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-calendar-days-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-calendar-days-md-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..53a74c74bfc
Binary files /dev/null and b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-calendar-days-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-calendar-days-md-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-calendar-days-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..d9b6664e937
Binary files /dev/null and b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-calendar-days-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-calendar-day-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-calendar-day-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..a218889e2f5
Binary files /dev/null and b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-calendar-day-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-calendar-day-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-calendar-day-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..f50d4b34d30
Binary files /dev/null and b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-calendar-day-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-calendar-day-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-calendar-day-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..ca087afff98
Binary files /dev/null and b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-calendar-day-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-calendar-day-md-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-calendar-day-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..08ce6a48b7a
Binary files /dev/null and b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-calendar-day-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-calendar-day-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-calendar-day-md-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..2fcb1ca12b8
Binary files /dev/null and b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-calendar-day-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-calendar-day-md-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-calendar-day-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..740bf512d47
Binary files /dev/null and b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-calendar-day-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-selected-calendar-day-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-selected-calendar-day-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..062446e6eb5
Binary files /dev/null and b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-selected-calendar-day-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-selected-calendar-day-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-selected-calendar-day-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..1729a0d34af
Binary files /dev/null and b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-selected-calendar-day-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-selected-calendar-day-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-selected-calendar-day-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..39a6c581dbd
Binary files /dev/null and b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-selected-calendar-day-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-selected-calendar-day-md-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-selected-calendar-day-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..b8a8824184d
Binary files /dev/null and b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-selected-calendar-day-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-selected-calendar-day-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-selected-calendar-day-md-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..5116f506ab3
Binary files /dev/null and b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-selected-calendar-day-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-selected-calendar-day-md-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-selected-calendar-day-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..35ae2875de2
Binary files /dev/null and b/core/src/components/datetime/test/custom/datetime.e2e.ts-snapshots/datetime-custom-focus-selected-calendar-day-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/custom/index.html b/core/src/components/datetime/test/custom/index.html
index 722a026dc56..f90cb604bbe 100644
--- a/core/src/components/datetime/test/custom/index.html
+++ b/core/src/components/datetime/test/custom/index.html
@@ -33,43 +33,97 @@
         }
       }
 
+      /*
+      * Custom Datetime Time / Wheel Parts
+      * -------------------------------------------
+      */
+
+      .custom-grid-wheel {
+        --background: rgb(245, 235, 247);
+        --background-rgb: 245, 235, 247;
+      }
+
+      .custom-grid-wheel::part(time-button) {
+        color: rgb(128, 30, 171);
+      }
+
+      .custom-grid-wheel::part(time-button active) {
+        background-color: rgb(248, 215, 255);
+      }
+
       /*
         The second selectors that target ion-picker(-column)-internal
         directly are for styling the time picker. This is currently
         undocumented usage.
       */
 
-      ion-datetime,
+      .custom-grid-wheel,
       ion-picker-internal {
         --wheel-highlight-background: rgb(218, 216, 255);
         --wheel-fade-background-rgb: 245, 235, 247;
       }
 
-      ion-datetime {
-        --background: rgb(245, 235, 247);
-        --background-rgb: 245, 235, 247;
-      }
-
       ion-picker-internal {
         background-color: rgb(245, 235, 247);
       }
 
-      ion-datetime::part(wheel-item),
+      .custom-grid-wheel::part(wheel-item),
       ion-picker-column-internal::part(wheel-item) {
         color: rgb(255, 134, 154);
       }
 
-      ion-datetime::part(wheel-item active),
+      .custom-grid-wheel::part(wheel-item active),
       ion-picker-column-internal::part(wheel-item active) {
         color: rgb(128, 30, 171);
       }
 
-      ion-datetime::part(time-button) {
-        color: rgb(128, 30, 171);
+      /*
+      * Custom Datetime Day Parts
+      * -------------------------------------------
+      */
+
+      #custom-calendar-days::part(calendar-day) {
+        background-color: #ffe2e6;
+
+        color: #da5296;
+
+        margin: 2px 0;
       }
 
-      ion-datetime::part(time-button active) {
-        background-color: rgb(248, 215, 255);
+      #custom-calendar-days::part(calendar-day today) {
+        color: #8462d1;
+      }
+
+      #custom-calendar-days::part(calendar-day):focus {
+        background-color: rgb(154 209 98 / 0.2);
+        box-shadow: 0px 0px 0px 4px rgb(154 209 98 / 0.2);
+      }
+
+      /*
+      * Custom Material Design Datetime Day Parts
+      * -------------------------------------------
+      */
+
+      #custom-calendar-days.md::part(calendar-day active),
+      #custom-calendar-days.md::part(calendar-day active):focus {
+        background-color: #9ad162;
+        border-color: #9ad162;
+        color: #fff;
+      }
+
+      #custom-calendar-days.md::part(calendar-day today) {
+        border-color: #8462d1;
+      }
+
+      /*
+      * Custom iOS Datetime Day Parts
+      * -------------------------------------------
+      */
+
+      #custom-calendar-days.ios::part(calendar-day active),
+      #custom-calendar-days.ios::part(calendar-day active):focus {
+        background-color: rgb(154 209 98 / 0.2);
+        color: #9ad162;
       }
     </style>
   </head>
@@ -85,14 +139,57 @@
         <div class="grid">
           <div class="grid-item">
             <h2>Grid Style</h2>
-            <ion-datetime id="custom-grid" value="2020-03-14T14:23:00.000Z"></ion-datetime>
+            <ion-datetime id="custom-grid" value="2020-03-14T14:23:00.000Z" class="custom-grid-wheel"></ion-datetime>
           </div>
           <div class="grid-item">
             <h2>Wheel Style</h2>
-            <ion-datetime id="custom-wheel" prefer-wheel="true" value="2020-03-14T14:23:00.000Z"></ion-datetime>
+            <ion-datetime
+              id="custom-wheel"
+              prefer-wheel="true"
+              value="2020-03-14T14:23:00.000Z"
+              class="custom-grid-wheel"
+            ></ion-datetime>
+          </div>
+          <div class="grid-item">
+            <h2>Grid Style</h2>
+            <ion-datetime id="custom-calendar-days" value="2023-06-15" presentation="date"></ion-datetime>
           </div>
         </div>
       </ion-content>
     </ion-app>
+
+    <script>
+      const customDatetime = document.querySelector('#custom-calendar-days');
+
+      // Mock the current day to always have the same screenshots
+      const mockToday = '2023-06-10T16:22';
+      Date = class extends Date {
+        constructor(...args) {
+          if (args.length === 0) {
+            super(mockToday);
+          } else {
+            super(...args);
+          }
+        }
+      };
+
+      customDatetime.highlightedDates = [
+        {
+          date: '2023-06-02',
+          textColor: 'purple',
+          backgroundColor: 'pink',
+        },
+        {
+          date: '2023-06-04',
+          textColor: 'firebrick',
+          backgroundColor: 'salmon',
+        },
+        {
+          date: '2023-06-06',
+          textColor: 'blue',
+          backgroundColor: 'lightblue',
+        },
+      ];
+    </script>
   </body>
 </html>
diff --git a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-date-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-date-ios-ltr-Mobile-Firefox-linux.png
index 6b536c54a66..8b3e5cee7be 100644
Binary files a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-date-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-date-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-date-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-date-md-ltr-Mobile-Firefox-linux.png
index d99dc2f632b..0868d2d7792 100644
Binary files a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-date-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-date-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-date-time-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-date-time-ios-ltr-Mobile-Firefox-linux.png
index 4961c096c56..f24ba3d5123 100644
Binary files a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-date-time-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-date-time-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-date-time-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-date-time-md-ltr-Mobile-Firefox-linux.png
index eb0c6da9c03..44848c8f7b0 100644
Binary files a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-date-time-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-date-time-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-time-date-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-time-date-ios-ltr-Mobile-Firefox-linux.png
index 05a574ff555..1b8603dfec7 100644
Binary files a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-time-date-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-time-date-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-time-date-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-time-date-md-ltr-Mobile-Firefox-linux.png
index d91ea9b613c..f6d4d67169e 100644
Binary files a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-time-date-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-cover-time-date-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-ios-ltr-Mobile-Chrome-linux.png
index 50329c2e8fd..137b4236a01 100644
Binary files a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-ios-ltr-Mobile-Firefox-linux.png
index ba6952fdf52..d64fc2461ef 100644
Binary files a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-ios-ltr-Mobile-Safari-linux.png
index 9b783b92c98..363a6f90541 100644
Binary files a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-md-ltr-Mobile-Firefox-linux.png
index d8469eb846d..e6975240e34 100644
Binary files a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-time-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-time-ios-ltr-Mobile-Chrome-linux.png
index abe57b598c7..ccfc902b38e 100644
Binary files a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-time-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-time-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-time-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-time-ios-ltr-Mobile-Firefox-linux.png
index f029a3546d6..149a7bd8b91 100644
Binary files a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-time-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-time-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-time-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-time-ios-ltr-Mobile-Safari-linux.png
index 1263eab72ce..710af09a963 100644
Binary files a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-time-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-time-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-time-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-time-md-ltr-Mobile-Firefox-linux.png
index 918fbc88f84..75ddc1d09f9 100644
Binary files a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-time-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-date-time-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-time-date-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-time-date-ios-ltr-Mobile-Chrome-linux.png
index 3224391e350..7611ceec564 100644
Binary files a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-time-date-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-time-date-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-time-date-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-time-date-ios-ltr-Mobile-Firefox-linux.png
index d05907f6bbf..7a71705fe06 100644
Binary files a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-time-date-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-time-date-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-time-date-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-time-date-ios-ltr-Mobile-Safari-linux.png
index c157dc94803..430503c520b 100644
Binary files a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-time-date-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-time-date-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-time-date-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-time-date-md-ltr-Mobile-Firefox-linux.png
index 14e1f188d19..050c41dea22 100644
Binary files a/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-time-date-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/display/datetime.e2e.ts-snapshots/datetime-display-time-date-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-ios-ltr-Mobile-Chrome-linux.png
index 38c3f264562..4a81c15c9a3 100644
Binary files a/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-ios-ltr-Mobile-Firefox-linux.png
index 998047a81a8..3d627ed9882 100644
Binary files a/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-ios-ltr-Mobile-Safari-linux.png
index ea8025bd285..339d65f1401 100644
Binary files a/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-ios-rtl-Mobile-Firefox-linux.png
index c27c96ae0db..6e5ab0cde1e 100644
Binary files a/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-md-ltr-Mobile-Firefox-linux.png
index 5e3ad747d53..d2cdd081ce7 100644
Binary files a/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-md-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-md-rtl-Mobile-Firefox-linux.png
index 81d7218d3f0..91cf937eae7 100644
Binary files a/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-md-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/first-day-of-week/datetime.e2e.ts-snapshots/datetime-day-of-week-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-array-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-array-ios-ltr-Mobile-Chrome-linux.png
index de635679a1c..4b9b55ab569 100644
Binary files a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-array-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-array-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-array-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-array-ios-ltr-Mobile-Safari-linux.png
index cbac770a763..ca14330823a 100644
Binary files a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-array-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-array-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-array-md-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-array-md-ltr-Mobile-Chrome-linux.png
index 2283fe0091d..29b96daeff3 100644
Binary files a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-array-md-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-array-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-array-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-array-md-ltr-Mobile-Firefox-linux.png
index 7d98d74a71e..6abfaa253d9 100644
Binary files a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-array-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-array-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-array-md-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-array-md-ltr-Mobile-Safari-linux.png
index a0702cf11cb..c4fba115ce5 100644
Binary files a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-array-md-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-array-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-callback-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-callback-ios-ltr-Mobile-Chrome-linux.png
index f61f6356501..a32bdc551cf 100644
Binary files a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-callback-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-callback-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-callback-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-callback-ios-ltr-Mobile-Safari-linux.png
index 5842d73b554..7f862c54b10 100644
Binary files a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-callback-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-callback-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-callback-md-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-callback-md-ltr-Mobile-Chrome-linux.png
index 1cbca725797..6c71a3c268b 100644
Binary files a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-callback-md-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-callback-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-callback-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-callback-md-ltr-Mobile-Firefox-linux.png
index b8646fde35b..7d79ea355fe 100644
Binary files a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-callback-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-callback-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-callback-md-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-callback-md-ltr-Mobile-Safari-linux.png
index 1dadf935632..bc7f695dec1 100644
Binary files a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-callback-md-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-callback-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-single-color-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-single-color-ios-ltr-Mobile-Chrome-linux.png
index 8dd0e4a386f..c9ed05ecc70 100644
Binary files a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-single-color-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-single-color-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-single-color-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-single-color-ios-ltr-Mobile-Safari-linux.png
index c723ad5c66b..8b7cb2c7bab 100644
Binary files a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-single-color-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-single-color-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-single-color-md-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-single-color-md-ltr-Mobile-Chrome-linux.png
index e7ff086a132..b2da50554c6 100644
Binary files a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-single-color-md-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-single-color-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-single-color-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-single-color-md-ltr-Mobile-Firefox-linux.png
index c32b0135b73..ce64281f8f2 100644
Binary files a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-single-color-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-single-color-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-single-color-md-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-single-color-md-ltr-Mobile-Safari-linux.png
index 72ece2a4242..d890c874559 100644
Binary files a/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-single-color-md-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/highlighted-dates/datetime.e2e.ts-snapshots/datetime-highlightedDates-single-color-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-en-US-diff-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-en-US-diff-ios-ltr-Mobile-Chrome-linux.png
index c113943094c..b3f49564e6c 100644
Binary files a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-en-US-diff-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-en-US-diff-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-en-US-diff-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-en-US-diff-ios-ltr-Mobile-Firefox-linux.png
index 2a2c8f542ea..80a3b6a060c 100644
Binary files a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-en-US-diff-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-en-US-diff-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-en-US-diff-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-en-US-diff-ios-ltr-Mobile-Safari-linux.png
index 5b34fff216c..a66b0f07622 100644
Binary files a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-en-US-diff-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-en-US-diff-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-en-US-diff-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-en-US-diff-md-ltr-Mobile-Firefox-linux.png
index e61a09d6c72..7def8680daf 100644
Binary files a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-en-US-diff-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-en-US-diff-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-es-ES-diff-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-es-ES-diff-ios-ltr-Mobile-Chrome-linux.png
index 0f5b67fa3a0..eeb3e1028df 100644
Binary files a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-es-ES-diff-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-es-ES-diff-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-es-ES-diff-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-es-ES-diff-ios-ltr-Mobile-Firefox-linux.png
index a8d9280bec5..565cc099e77 100644
Binary files a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-es-ES-diff-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-es-ES-diff-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-es-ES-diff-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-es-ES-diff-ios-ltr-Mobile-Safari-linux.png
index 8ce66651ded..155f715a0f2 100644
Binary files a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-es-ES-diff-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-es-ES-diff-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-es-ES-diff-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-es-ES-diff-md-ltr-Mobile-Firefox-linux.png
index 91957f28dd1..cfdc7d190d5 100644
Binary files a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-es-ES-diff-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-es-ES-diff-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-ja-JP-diff-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-ja-JP-diff-ios-ltr-Mobile-Chrome-linux.png
index b2b8b01686c..923eefebbf0 100644
Binary files a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-ja-JP-diff-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-ja-JP-diff-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-ja-JP-diff-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-ja-JP-diff-ios-ltr-Mobile-Firefox-linux.png
index 497498a1e7c..447b9b43f32 100644
Binary files a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-ja-JP-diff-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-ja-JP-diff-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-ja-JP-diff-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-ja-JP-diff-ios-ltr-Mobile-Safari-linux.png
index ec128727b47..29ba3a39b6d 100644
Binary files a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-ja-JP-diff-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-ja-JP-diff-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-ja-JP-diff-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-ja-JP-diff-md-ltr-Mobile-Firefox-linux.png
index 44ebff05e55..a127cd280d3 100644
Binary files a/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-ja-JP-diff-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/locale/datetime.e2e.ts-snapshots/datetime-locale-ja-JP-diff-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-ios-ltr-Mobile-Chrome-linux.png
index 6beb12f44d4..b92d9ee2a6c 100644
Binary files a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-ios-ltr-Mobile-Firefox-linux.png
index 259bb30e910..ed1639c7b77 100644
Binary files a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-ios-ltr-Mobile-Safari-linux.png
index 402c122cfe8..14b45e539ad 100644
Binary files a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-ios-rtl-Mobile-Firefox-linux.png
index c2501119cb0..95e0ca3c93e 100644
Binary files a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-md-ltr-Mobile-Firefox-linux.png
index 8bb2499070d..5a161363da4 100644
Binary files a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-md-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-md-rtl-Mobile-Firefox-linux.png
index 75966c627d4..696886e10c5 100644
Binary files a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-md-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-multipleDefaultValues-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-ios-ltr-Mobile-Chrome-linux.png
index ed2b3060187..c6080c69c8a 100644
Binary files a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-ios-ltr-Mobile-Firefox-linux.png
index 97c50b77895..2f98ab06ee9 100644
Binary files a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-ios-ltr-Mobile-Safari-linux.png
index fd777e05bfa..03a7e37cd6f 100644
Binary files a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-ios-rtl-Mobile-Firefox-linux.png
index b92d2ea89cf..0452a29c502 100644
Binary files a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-md-ltr-Mobile-Firefox-linux.png
index d8539c0df03..bb55b20a64e 100644
Binary files a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-md-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-md-rtl-Mobile-Firefox-linux.png
index b593fb41990..72b3b9cc673 100644
Binary files a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-md-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-singleDefaultValue-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-ios-ltr-Mobile-Chrome-linux.png
index 3796845a930..69ca7a2b28b 100644
Binary files a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-ios-ltr-Mobile-Firefox-linux.png
index a894cbb1019..5ae833c01c2 100644
Binary files a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-ios-ltr-Mobile-Safari-linux.png
index c933a8eea25..8737e59732d 100644
Binary files a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-ios-rtl-Mobile-Firefox-linux.png
index 34b7405b3b4..1e49a358b75 100644
Binary files a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-md-ltr-Mobile-Firefox-linux.png
index dd39d8302d8..70c22657d0e 100644
Binary files a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-md-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-md-rtl-Mobile-Firefox-linux.png
index 36adc2f3590..d0642ba6f90 100644
Binary files a/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-md-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/multiple/datetime.e2e.ts-snapshots/datetime-multiple-withHeader-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-base-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-base-ios-ltr-Mobile-Chrome-linux.png
index 6cf5a63516f..56375e49c24 100644
Binary files a/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-base-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-base-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-base-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-base-ios-ltr-Mobile-Safari-linux.png
index 64b216ede52..5e5aca9604a 100644
Binary files a/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-base-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-base-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-base-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-base-md-ltr-Mobile-Firefox-linux.png
index 9a78713f2e6..f2773c86bb2 100644
Binary files a/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-base-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-base-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-base-md-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-base-md-rtl-Mobile-Firefox-linux.png
index c8fba2b1b67..adbc9d1c1f0 100644
Binary files a/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-base-md-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-base-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-ios-ltr-Mobile-Chrome-linux.png
index 00e4b048bb9..fb65b78b420 100644
Binary files a/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-ios-ltr-Mobile-Safari-linux.png
index 37fa0940c84..1caa240c295 100644
Binary files a/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-md-ltr-Mobile-Firefox-linux.png
index 629e256a690..1f0bd6cc9cf 100644
Binary files a/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-md-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-md-rtl-Mobile-Firefox-linux.png
index df5f816b515..16c4c82ce04 100644
Binary files a/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-md-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-ltr-Mobile-Chrome-linux.png
index 05b6a60fded..b7399cac8b7 100644
Binary files a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-ltr-Mobile-Safari-linux.png
index deb27547dea..b24381c80bd 100644
Binary files a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-rtl-Mobile-Firefox-linux.png
index ae0ca525251..479521e98ec 100644
Binary files a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-ltr-Mobile-Firefox-linux.png
index 4020120c0e7..b0af34c9962 100644
Binary files a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-rtl-Mobile-Firefox-linux.png
index 848a5c7327c..ecbec929057 100644
Binary files a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-ltr-Mobile-Chrome-linux.png
index 2a7841a5c64..84912381d11 100644
Binary files a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-ltr-Mobile-Safari-linux.png
index f8fdd1083c8..954bdbc82f0 100644
Binary files a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-rtl-Mobile-Firefox-linux.png
index c0ea3339a45..7e785d93295 100644
Binary files a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-ltr-Mobile-Firefox-linux.png
index 5025780830a..42bf187dc89 100644
Binary files a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-rtl-Mobile-Firefox-linux.png
index ec559ab35ec..8ff0d0301e4 100644
Binary files a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-ltr-Mobile-Chrome-linux.png
index 2ca9211d750..afed4049841 100644
Binary files a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-ltr-Mobile-Safari-linux.png
index 29e7c6713dd..3691b28ae02 100644
Binary files a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-rtl-Mobile-Firefox-linux.png
index 190f6cacf8d..1eaf8fcaecf 100644
Binary files a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-ltr-Mobile-Firefox-linux.png
index 1f140fb386e..89970a27b9f 100644
Binary files a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-rtl-Mobile-Firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-rtl-Mobile-Firefox-linux.png
index fb7b65b4ddc..12439e77cda 100644
Binary files a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-rtl-Mobile-Firefox-linux.png and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-ios-ltr-Mobile-Chrome-linux.png
index e09bb8165f5..16fde476d93 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-ios-ltr-Mobile-Safari-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-ios-ltr-Mobile-Safari-linux.png
index 67dc173537b..e536ff2645e 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-md-ltr-Mobile-Firefox-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-md-ltr-Mobile-Firefox-linux.png
index 5e97bc9aad5..c3146ad9afe 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Chrome-linux.png
index 52165b458e3..2c7ff81cf5d 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Firefox-linux.png
index 0649bc097d3..21350c51b29 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Safari-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Safari-linux.png
index b28ae6d1503..f0761cbf214 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-rtl-Mobile-Firefox-linux.png
index 720345e4cc3..6bc4b4a14ee 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-rtl-Mobile-Safari-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-rtl-Mobile-Safari-linux.png
index 7a6bf9890ba..2f1a7f6454d 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-rtl-Mobile-Safari-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-ltr-Mobile-Firefox-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-ltr-Mobile-Firefox-linux.png
index 31de1dbda4d..240bbeb6053 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-rtl-Mobile-Firefox-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-rtl-Mobile-Firefox-linux.png
index 13e533fe7e1..f9c4cd274e6 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-rtl-Mobile-Firefox-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-rtl-Mobile-Firefox-linux.png differ