diff --git a/components/CreateEventDialog.vue b/components/CreateEventDialog.vue
index 0e31470..efd1316 100644
--- a/components/CreateEventDialog.vue
+++ b/components/CreateEventDialog.vue
@@ -533,6 +533,7 @@ const handleSubmit = async () => {
   border: 1px solid rgba(var(--v-border-color), var(--v-border-opacity));
   border-radius: 4px;
   padding: 16px 12px;
+  padding-right: 48px; /* Make room for calendar icon */
   font-size: 16px;
   line-height: 1.5;
   background: rgb(var(--v-theme-surface));
diff --git a/components/EventCalendar.vue b/components/EventCalendar.vue
index 6f5925a..70f59db 100644
--- a/components/EventCalendar.vue
+++ b/components/EventCalendar.vue
@@ -130,6 +130,8 @@ const currentView = computed(() => {
 
 const transformedEvents = computed((): FullCalendarEvent[] => {
   console.log('[EventCalendar] Raw events received:', props.events.length);
+  console.log('[EventCalendar] Raw events array:', props.events);
+  
   props.events.forEach((event, index) => {
     console.log(`[EventCalendar] Event ${index + 1}:`, {
       id: event.id,
@@ -143,6 +145,8 @@ const transformedEvents = computed((): FullCalendarEvent[] => {
   const transformed = props.events.map((event: Event) => transformEventForCalendar(event));
   
   console.log('[EventCalendar] Transformed events for FullCalendar:', transformed.length);
+  console.log('[EventCalendar] Transformed events array:', transformed);
+  
   transformed.forEach((event, index) => {
     console.log(`[EventCalendar] Transformed Event ${index + 1}:`, {
       id: event.id,
diff --git a/composables/useEvents.ts b/composables/useEvents.ts
index 7e045b4..8ac3c6c 100644
--- a/composables/useEvents.ts
+++ b/composables/useEvents.ts
@@ -296,10 +296,10 @@ export const useEvents = () => {
 
   return {
     // Reactive state
-    events: readonly(events),
-    loading: readonly(loading),
-    error: readonly(error),
-    upcomingEvent: readonly(upcomingEvent),
+    events,
+    loading,
+    error,
+    upcomingEvent,
 
     // Methods
     fetchEvents,