diff --git a/src/servala/frontend/templates/frontend/organizations/service_instance_delete_form.html b/src/servala/frontend/templates/frontend/organizations/service_instance_delete_form.html
index e69de29..08d4167 100644
--- a/src/servala/frontend/templates/frontend/organizations/service_instance_delete_form.html
+++ b/src/servala/frontend/templates/frontend/organizations/service_instance_delete_form.html
@@ -0,0 +1,18 @@
+{% load i18n %}
+<form method="post" action="{{ view.request.path }}" hx-post="{{ view.request.path }}" hx-target="this" hx-swap="outerHTML">
+    {% csrf_token %}
+    <div class="modal-header">
+        <h5 class="modal-title" id="deleteInstanceModalLabel">
+            {% blocktranslate with instance_name=instance.name %}Confirm Deletion of {{ instance_name }}{% endblocktranslate %}
+        </h5>
+        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+    </div>
+    <div class="modal-body hide-form-errors">
+        <p>{% translate "Do you really want to delete this service instance? This action cannot be undone." %}</p>
+        {{ form }}
+    </div>
+    <div class="modal-footer">
+        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">{% translate "Cancel" %}</button>
+        <button type="submit" class="btn btn-danger">{% translate "Confirm and Delete Instance" %}</button>
+    </div>
+</form>
diff --git a/src/servala/frontend/templates/frontend/organizations/service_instance_detail.html b/src/servala/frontend/templates/frontend/organizations/service_instance_detail.html
index f0867c5..5d6779c 100644
--- a/src/servala/frontend/templates/frontend/organizations/service_instance_detail.html
+++ b/src/servala/frontend/templates/frontend/organizations/service_instance_detail.html
@@ -218,4 +218,27 @@
             {% endif %}
         </div>
     </section>
+
+    <!-- Delete Confirmation Modal -->
+    <div class="modal fade" id="deleteInstanceModal" tabindex="-1" aria-labelledby="deleteInstanceModalLabel" aria-hidden="true">
+        <div class="modal-dialog modal-dialog-centered">
+            <div class="modal-content" id="deleteInstanceModalContent">
+                {# Content will be loaded here by HTMX #}
+                <div class="modal-header">
+                    <h5 class="modal-title" id="deleteInstanceModalLabel">{% translate "Confirm Deletion" %}</h5>
+                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+                </div>
+                <div class="modal-body">
+                    <div class="d-flex justify-content-center">
+                        <div class="spinner-border" role="status">
+                            <span class="visually-hidden">{% translate "Loading..." %}</span>
+                        </div>
+                    </div>
+                </div>
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">{% translate "Cancel" %}</button>
+                </div>
+            </div>
+        </div>
+    </div>
 {% endblock content %}