diff --git a/src/components/Datetime.astro b/src/components/Datetime.astro
index ce44952b89..f2243f7430 100644
--- a/src/components/Datetime.astro
+++ b/src/components/Datetime.astro
@@ -25,15 +25,16 @@ const {
 } = Astro.props;
 
 /* ========== Formatted Datetime ========== */
-const latestDatetime =
-  modDatetime && modDatetime > pubDatetime ? modDatetime : pubDatetime;
-const datetime = dayjs(latestDatetime).tz(postTimezone || SITE.timezone);
+const isModified = modDatetime && modDatetime > pubDatetime;
+
+const datetime = dayjs(isModified ? modDatetime : pubDatetime).tz(
+  postTimezone || SITE.timezone
+);
 
 const date = datetime.format("D MMM, YYYY"); // e.g., '22 Mar, 2025'
-const time = datetime.format("hh:mm A"); // e.g., '08:30 PM'
 ---
 
-<div class:list={["flex items-end space-x-2 opacity-80", className]}>
+<div class:list={["flex items-end gap-x-2 opacity-80", className]}>
   <IconCalendar
     class:list={[
       "inline-block size-6 min-w-[1.375rem]",
@@ -41,18 +42,14 @@ const time = datetime.format("hh:mm A"); // e.g., '08:30 PM'
     ]}
   />
   {
-    modDatetime && modDatetime > pubDatetime ? (
-      <span class:list={["text-sm italic", { "sm:text-base": size === "lg" }]}>
+    isModified && (
+      <span class:list={["text-sm", { "sm:text-base": size === "lg" }]}>
         Updated:
       </span>
-    ) : (
-      <span class="sr-only">Published:</span>
     )
   }
-  <span class:list={["text-sm italic", { "sm:text-base": size === "lg" }]}>
-    <time datetime={datetime.toISOString()}>{date}</time>
-    <span aria-hidden="true"> | </span>
-    <span class="sr-only">&nbsp;at&nbsp;</span>
-    <span class="text-nowrap">{time}</span>
-  </span>
+  <time
+    class:list={["text-sm", { "sm:text-base": size === "lg" }]}
+    datetime={datetime.toISOString()}>{date}</time
+  >
 </div>
diff --git a/src/layouts/PostDetails.astro b/src/layouts/PostDetails.astro
index e6b0cc6778..722810a598 100644
--- a/src/layouts/PostDetails.astro
+++ b/src/layouts/PostDetails.astro
@@ -99,9 +99,10 @@ const nextPost =
     >
       {title}
     </h1>
-    <div class="flex items-center gap-4">
-      <Datetime {pubDatetime} {modDatetime} {timezone} size="lg" class="my-2" />
-      <EditPost class="max-sm:hidden" {hideEditPost} {post} />
+    <div class="my-2 flex items-center gap-2">
+      <Datetime {pubDatetime} {modDatetime} {timezone} size="lg" />
+      <span aria-hidden="true" class="max-sm:hidden">|</span>
+      <EditPost {hideEditPost} {post} class="max-sm:hidden" />
     </div>
     <article
       id="article"