diff --git a/apps/web/src/lib/components/BookingModal.svelte b/apps/web/src/lib/components/BookingModal.svelte
index 1c153a4..33e41e1 100644
--- a/apps/web/src/lib/components/BookingModal.svelte
+++ b/apps/web/src/lib/components/BookingModal.svelte
@@ -41,7 +41,7 @@
   let confirmDelete = false;
   let error = "";
 
-  $: isOwner = status.reservation?.userId === $user?.id;
+  $: isOwner = status.reservation?.userId === $user?.id || status.reservation?.user?.id === $user?.id;
   $: isAdmin = $user?.role === 'ADMIN';
 
   const timeOptions = [];
@@ -195,14 +195,16 @@
             </div>
             
             {#if isOwner || isAdmin}
-              <button 
-                on:click={() => handleDelete(status.reservation.id)}
-                disabled={deleting}
-                class="p-2 text-red-600 hover:bg-red-100 rounded-lg transition-colors"
-                title="Delete Booking"
-              >
-                <Trash2 size={20} />
-              </button>
+              <div class="flex flex-col gap-2">
+                <button 
+                  on:click={() => handleDelete(status.reservation.id)}
+                  disabled={deleting}
+                  class="flex items-center gap-2 px-4 py-2 bg-red-50 text-red-600 hover:bg-red-100 rounded-xl transition-colors font-bold text-sm border border-red-100 shadow-sm"
+                >
+                  <Trash2 size={18} />
+                  Delete Booking
+                </button>
+              </div>
             {/if}
           </div>
           
@@ -271,7 +273,7 @@
                       <button 
                         type="button"
                         on:click={() => selectSlot(time)}
-                        disabled={!!reservation && reservation.userId !== $user?.id && $user?.role !== 'ADMIN'}
+                        disabled={!!reservation && reservation.userId !== $user?.id && reservation.user?.id !== $user?.id && $user?.role !== 'ADMIN'}
                         class="w-full py-2 text-[10px] font-bold rounded-md transition-all border
                           {reservation ? 'bg-red-100 text-red-700 border-red-200' : 
                            startTime === time ? 'bg-indigo-600 text-white border-indigo-700 ring-2 ring-indigo-200' : 
@@ -281,7 +283,7 @@
                         {time}
                       </button>
                       
-                      {#if reservation && (reservation.userId === $user?.id || $user?.role === 'ADMIN')}
+                      {#if reservation && (reservation.userId === $user?.id || reservation.user?.id === $user?.id || $user?.role === 'ADMIN')}
                         <button 
                           on:click|stopPropagation={() => handleDelete(reservation.id)}
                           class="absolute -top-1 -right-1 p-0.5 bg-red-600 text-white rounded-full shadow-sm opacity-0 group-hover:opacity-100 transition-opacity"