diff --git a/src/components/CalendarEventsDialog.vue b/src/components/CalendarEventsDialog.vue
index 12c16cf1847..710bba50c7e 100644
--- a/src/components/CalendarEventsDialog.vue
+++ b/src/components/CalendarEventsDialog.vue
@@ -37,7 +37,7 @@ import TransitionWrapper from './UIShared/TransitionWrapper.vue'
 import { ATTENDEE, CONVERSATION } from '../constants.ts'
 import { hasTalkFeature } from '../services/CapabilitiesManager.ts'
 import { useGroupwareStore } from '../stores/groupware.ts'
-import { convertToUnix, ONE_HOUR_IN_MS } from '../utils/formattedTime.ts'
+import { convertToUnix, formatDateTime, getDiffInDays, ONE_HOUR_IN_MS } from '../utils/formattedTime.ts'
 import { getDisplayNameWithFallback } from '../utils/getDisplayName.ts'
 
 const props = defineProps<{
@@ -77,6 +77,28 @@ const upcomingEvents = computed(() => {
 		})
 })
 
+const upcomingEventTime = computed(() => {
+	const eventStart = upcomingEvents.value[0]!.start
+
+	if (typeof eventStart === 'string') {
+		// Now
+		return eventStart
+	}
+
+	const diffInDays = getDiffInDays(eventStart)
+
+	if (diffInDays === 0) {
+		// Today
+		return formatDateTime(eventStart, 'shortTime')
+	} else if (diffInDays < 7) {
+		// Within a week
+		return formatDateTime(eventStart, 'shortWeekdayWithTime')
+	}
+
+	const isSameYear = new Date(eventStart).getFullYear() === new Date().getFullYear()
+	return formatDateTime(eventStart, isSameYear ? 'shortDateSameYear' : 'shortDate')
+})
+
 type CalendarOption = { value: string, label: string, color: string }
 const calendarOptions = computed<CalendarOption[]>(() => groupwareStore.writeableCalendars.map((calendar) => ({
 	value: calendar.uri,
@@ -349,14 +371,14 @@ async function submitNewMeeting() {
 					class="upcoming-meeting"
 					:title="t('spreed', 'Upcoming meetings')"
 					:aria-label="t('spreed', 'Upcoming meetings')">
-					<template #icon>
-						<IconCalendarBlankOutline :size="20" />
-					</template>
 					<template v-if="upcomingEvents[0] && !isMobile" #default>
-						<span class="upcoming-meeting__header">
-							{{ t('spreed', 'Next meeting') }}
+						{{ t('spreed', 'Meeting') }}
+						<span class="upcoming-meeting__time">
+							{{ upcomingEventTime }}
 						</span>
-						<StaticDateTime :time="upcomingEvents[0].start" calendar />
+					</template>
+					<template v-else #icon>
+						<IconCalendarBlankOutline :size="20" />
 					</template>
 				</NcButton>
 			</template>
@@ -651,20 +673,9 @@ async function submitNewMeeting() {
 }
 
 .upcoming-meeting {
-	// Overwrite default NcButton styles
-	:deep(.button-vue__text) {
-		padding-block: 0;
-		margin: 0;
-		display: flex;
-		flex-direction: column;
-		align-items: flex-start;
-		line-height: 20px;
+	&__time {
 		font-weight: 400;
 	}
-
-	&__header {
-		font-weight: 500;
-	}
 }
 
 .calendar-badge {
diff --git a/src/components/TopBar/TopBar.vue b/src/components/TopBar/TopBar.vue
index 6e86aa7297e..aa1a81f6cb3 100644
--- a/src/components/TopBar/TopBar.vue
+++ b/src/components/TopBar/TopBar.vue
@@ -99,9 +99,6 @@
 
 			<TasksCounter v-if="conversation.type === CONVERSATION.TYPE.NOTE_TO_SELF" />
 
-			<!-- Upcoming meetings -->
-			<CalendarEventsDialog v-if="showCalendarEvents" :token="token" />
-
 			<!-- Call time -->
 			<CallTime
 				v-if="isInCall"
@@ -127,6 +124,11 @@
 				v-else-if="!isSidebar && canExtendOneToOneConversation"
 				:token="token" />
 
+			<!-- Upcoming meetings -->
+			<CalendarEventsDialog v-if="showCalendarEvents" :token="token" />
+
+			<CallButton v-if="!isInCall" shrink-on-mobile />
+
 			<!-- TopBar menu -->
 			<TopBarMenu
 				:token="token"
@@ -134,8 +136,6 @@
 				:is-sidebar="isSidebar"
 				@open-breakout-rooms-editor="showBreakoutRoomsEditor = true" />
 
-			<CallButton v-if="!isInCall" shrink-on-mobile />
-
 			<!-- Breakout rooms editor -->
 			<BreakoutRoomsEditor
 				v-if="showBreakoutRoomsEditor"
diff --git a/src/utils/formattedTime.ts b/src/utils/formattedTime.ts
index b2d505e50cd..28c4f00225e 100644
--- a/src/utils/formattedTime.ts
+++ b/src/utils/formattedTime.ts
@@ -16,6 +16,7 @@ const absoluteTimeFormat = {
 	longDate: new Intl.DateTimeFormat(locale, { year: 'numeric', month: 'long', day: 'numeric' }), // 'February 15, 2025'
 	longDateWithTime: new Intl.DateTimeFormat(locale, { year: 'numeric', month: 'long', day: 'numeric', hour: 'numeric', minute: 'numeric' }), // 'February 15, 2025 at 8:30 PM'
 	shortDate: new Intl.DateTimeFormat(locale, { year: 'numeric', month: 'short', day: 'numeric' }), // 'Feb 15, 2025'
+	shortDateSameYear: new Intl.DateTimeFormat(locale, { month: 'short', day: 'numeric' }), // 'Feb 15'
 	shortDateNumeric: new Intl.DateTimeFormat(locale, { year: 'numeric', month: '2-digit', day: '2-digit' }), // '02/15/2025'
 	shortDateWithTime: new Intl.DateTimeFormat(locale, { year: 'numeric', month: 'short', day: 'numeric', hour: 'numeric', minute: 'numeric' }), // 'Feb 15, 2025, 8:30 PM'
 	shortDateWithTimeSeconds: new Intl.DateTimeFormat(locale, { year: 'numeric', month: 'short', day: 'numeric', hour: 'numeric', minute: 'numeric', second: 'numeric' }), // 'Feb 15, 2025, 8:30:00 PM'