diff --git a/core/src/components/datetime/datetime.tsx b/core/src/components/datetime/datetime.tsx
index 5912d5452f0..0865b9546c5 100644
--- a/core/src/components/datetime/datetime.tsx
+++ b/core/src/components/datetime/datetime.tsx
@@ -11,8 +11,8 @@ import { getIonMode } from '../../global/ionic-global';
 import { Color, DatetimeChangeEventDetail, DatetimeParts, Mode, StyleEventDetail } from '../../interface';
 import { startFocusVisible } from '../../utils/focus-visible';
 import { getElementRoot, raf, renderHiddenInput } from '../../utils/helpers';
-import { createColorClasses } from '../../utils/theme';
 import { isRTL } from '../../utils/rtl';
+import { createColorClasses } from '../../utils/theme';
 import { PickerColumnItem } from '../picker-column-internal/picker-column-internal-interfaces';
 
 import {
diff --git a/core/src/utils/rtl/dir.ts b/core/src/utils/rtl/dir.ts
index 72deecdbcaf..fe982da6ae2 100644
--- a/core/src/utils/rtl/dir.ts
+++ b/core/src/utils/rtl/dir.ts
@@ -5,7 +5,7 @@
  * take priority over the root document value.
  */
 export const isRTL = (hostEl?: Pick<HTMLElement, 'dir'>) => {
-  if (hostEl && hostEl.dir) {
+  if (typeof hostEl?.dir !== 'undefined') {
     return hostEl.dir.toLowerCase() === 'rtl';
   }
   return document?.dir.toLowerCase() === 'rtl';