diff --git a/UI/src/app/attachphoto/photolist.html b/UI/src/app/attachphoto/photolist.html
index 6acbf52..2db15d8 100644
--- a/UI/src/app/attachphoto/photolist.html
+++ b/UI/src/app/attachphoto/photolist.html
@@ -27,7 +27,7 @@
                     <td >{{item.photo}}</td>
                     <td>
                         
-                        <button pButton type="button" icon="pi pi-times" class="p-button-rounded p-button-text p-button-raised"
+                        <button pButton type="button" icon="pi pi-times" class="p-button-rounded text-red-500 p-button-text p-button-raised mr-2"
                             (click)="remove(item.id)"></button>
                         
                         @if (item.id > 0) {
diff --git a/UI/src/app/attachphoto/photolist.ts b/UI/src/app/attachphoto/photolist.ts
index 4f6d21e..817b4fa 100644
--- a/UI/src/app/attachphoto/photolist.ts
+++ b/UI/src/app/attachphoto/photolist.ts
@@ -3,7 +3,7 @@ import { Component, OnInit, OnDestroy, inject, ChangeDetectorRef, signal, output
 import { catchError, EMPTY, finalize, Subscription } from 'rxjs';
 import { CommonUtilities, HttpUtility, LookupService } from '../shares';
 import { DialogService ,DynamicDialogConfig,DynamicDialogModule, DynamicDialogRef} from 'primeng/dynamicdialog';
-import { MessageService } from 'primeng/api';
+import { ConfirmationService, MessageService } from 'primeng/api';
 import { AddPhoto } from './add.photo';
 import { LookupEdit, PersonPhotoDto } from '../models';
 
@@ -30,6 +30,7 @@ export class PhotoList implements OnInit, OnDestroy {
   deletePersonPhoto: number[] = [];
   private authenticationService = inject(AuthenticationService);
   private cdr = inject(ChangeDetectorRef);
+  private confirmationService = inject(ConfirmationService);
   private messageService = inject(MessageService);
   private subscription: Subscription = new Subscription();
   downloadFile = signal(false);
@@ -95,8 +96,29 @@ onClose(event: Event): void {
 newSupportDoc(event: Event): void {
   this.showEdit(this._id--);
 }
-
 remove(id: number): void {
+   this.confirmationService.confirm({
+            
+            message: 'Do you want to delete this record?',
+            header: 'Confirmation Delete',
+            icon: 'pi pi-info-circle',
+            rejectLabel: 'Cancel',
+            rejectButtonProps: {
+                label: 'Cancel',
+                severity: 'secondary',
+                outlined: true,
+            },
+            acceptButtonProps: {
+                label: 'Delete',
+                severity: 'danger',
+            },
+
+            accept: () => {
+                this.doRemove(id);
+            }
+          });
+}
+doRemove(id: number): void {
   if (id < 0)
   {
     const nlist = this.FileList.filter(x => x.id != id);