diff --git a/backend/resources/views/admin/fitur/index.blade.php b/backend/resources/views/admin/fitur/index.blade.php
index b12a6a6..8873881 100644
--- a/backend/resources/views/admin/fitur/index.blade.php
+++ b/backend/resources/views/admin/fitur/index.blade.php
@@ -18,7 +18,7 @@
                 <table class="w-full table-fixed border border-gray-300 text-left">
                     <thead class="bg-gray-100">
                         <tr>
-                            <th class="w-[10%] p-2 border border-gray-300 text-center">Nomor</th>
+                            <th class="w-[7%] p-2 border border-gray-300 text-center">Nomor</th>
                             <th class="w-[70%] p-2 border border-gray-300 text-center">Fitur</th>
                             <th class="w-[20%] p-2 border border-gray-300 text-center">Aksi</th>
                         </tr>
@@ -26,10 +26,10 @@
                     <tbody>
                         @forelse ($fitur as $key => $item)
                             <tr class="hover:bg-gray-50">
-                                <td class="p-2 border border-gray-300">{{ $key + 1 }}</td>
-                                <td class="p-2 border border-gray-300 truncate whitespace-nowrap">{{ $item->deskripsi }}
+                                <td class="py-5 px-2 border border-gray-300 text-center">{{ $key + 1 }}</td>
+                                <td class="py-5 px-2 border border-gray-300 truncate whitespace-nowrap">{{ $item->deskripsi }}
                                 </td>
-                                <td class="p-2 border border-gray-300 text-center">
+                                <td class="py-5 px-2 border border-gray-300 text-center">
                                     <div class="flex justify-center space-x-2">
                                         <button class="text-blue-600 flex items-center pr-4 openEditModalBtn"
                                             data-id="{{ $item->id }}">
diff --git a/backend/resources/views/admin/templates/index.blade.php b/backend/resources/views/admin/templates/index.blade.php
index 4842738..8e1a485 100644
--- a/backend/resources/views/admin/templates/index.blade.php
+++ b/backend/resources/views/admin/templates/index.blade.php
@@ -3,277 +3,293 @@
 @section('title', 'Manajemen Template')
 
 @section('content')
-<div class="container mx-auto py-4">
-    <!-- Header -->
-    <div class="flex justify-between items-center mb-4">
-        <h3 class="text-xl font-bold">
-            @isset($kategori)
-                Template Kategori: {{ $kategori->nama }}
-            @else
-                Semua Template
-            @endisset
-        </h3>
+    <div class="container mx-auto py-4">
+        <!-- Header -->
+        <div class="flex justify-between items-center mb-4">
+            <h3 class="text-xl font-bold">
+                @isset($kategori)
+                    Template Kategori: {{ $kategori->nama }}
+                @else
+                    Semua Template
+                @endisset
+            </h3>
 
-        @if (!isset($kategori))
-            <button id="openTambahModal" class="bg-blue-600 text-white px-3 py-2.5 rounded flex items-center">
-                <i class="bi bi-plus-lg mr-1"></i> Tambah Template
-            </button>
+            @if (!isset($kategori))
+                <button id="openTambahModal" class="bg-blue-600 text-white px-3 py-2.5 rounded flex items-center">
+                    <i class="bi bi-plus-lg mr-1"></i> Tambah Template
+                </button>
+            @endif
+        </div>
+
+        <!-- Flash Message -->
+        @if (session('success'))
+            <div id="toast-success" class="mb-4 p-3 rounded bg-green-100 text-green-800 border border-green-300 shadow">
+                {{ session('success') }}
+            </div>
+            <script>
+                setTimeout(() => document.getElementById('toast-success')?.remove(), 3000);
+            </script>
         @endif
-    </div>
 
-    <!-- Flash Message -->
-    @if (session('success'))
-        <div id="toast-success" class="mb-4 p-3 rounded bg-green-100 text-green-800 border border-green-300 shadow">
-            {{ session('success') }}
-        </div>
-        <script>setTimeout(() => document.getElementById('toast-success')?.remove(), 3000);</script>
-    @endif
-
-    @if ($errors->any())
-        <div id="toast-error" class="mb-4 p-3 rounded bg-red-100 text-red-800 border border-red-300 shadow">
-            <ul class="list-disc ml-5">
-                @foreach ($errors->all() as $error)
-                    <li>{{ $error }}</li>
-                @endforeach
-            </ul>
-        </div>
-        <script>setTimeout(() => document.getElementById('toast-error')?.remove(), 5000);</script>
-    @endif
-
-    <!-- Tabel Template -->
-    <div class="bg-white rounded-lg shadow-sm">
-        <div class="p-4 overflow-x-auto">
-            <table class="w-full table-fixed text-left border border-gray-300 border-collapse">
-                <thead class="bg-gray-100">
-                    <tr>
-                        <th class="p-2 border border-gray-300 w-[50px] text-center">Nomor</th>
-                        <th class="p-2 border border-gray-300 w-[200px] text-center">Nama Template</th>
-                        <th class="p-2 border border-gray-300 w-[150px] text-center">Kategori</th>
-                        <th class="p-2 border border-gray-300 w-[150px] text-center">Fitur</th>
-                        <th class="p-2 border border-gray-300 w-[90px] text-center">Foto</th>
-                        <th class="p-2 border border-gray-300 w-[100px] text-center">Harga</th>
-                        <th class="p-2 border border-gray-300 w-[130px] text-center">Aksi</th>
-                    </tr>
-                </thead>
-                <tbody>
-                    @forelse($templates as $key => $template)
-                        <tr>
-                            <td class="p-2 border border-gray-300 text-center">{{ $key + 1 }}</td>
-                            <td class="p-2 border border-gray-300 truncate">{{ $template->nama_template }}</td>
-                            <td class="p-2 border border-gray-300 truncate">{{ $template->kategori->nama ?? '-' }}</td>
-                            <td class="p-2 border border-gray-300 truncate">{{ $template->fitur->deskripsi ?? '-' }}</td>
-                            <td class="p-2 border border-gray-300 text-center">
-                                <div class="w-12 h-12 overflow-hidden rounded bg-gray-100 flex items-center justify-center mx-auto">
-                                    <img src="{{ $template->foto ? asset('storage/' . $template->foto) : asset('default-image.png') }}"
-                                         alt="foto" class="max-w-full max-h-full object-contain">
-                                </div>
-                            </td>
-                            <td class="p-2 border border-gray-300 text-right font-semibold">
-                                Rp {{ number_format($template->harga, 0, ',', '.') }}
-                            </td>
-                            <td class="p-2 border border-gray-300 text-center">
-                                <div class="flex justify-center space-x-2">
-                                    <button class="text-blue-600 hover:underline flex items-center openEditModalBtn"
-                                        data-id="{{ $template->id }}">
-                                        <i class="bi bi-pencil mr-1"></i> Edit
-                                    </button>
-                                    <form action="{{ route('templates.destroy', $template->id) }}" method="POST"
-                                        class="inline" onsubmit="return confirm('Hapus template ini?')">
-                                        @csrf
-                                        @method('DELETE')
-                                        <button class="text-red-600 hover:underline flex items-center">
-                                            <i class="bi bi-trash mr-1"></i> Hapus
-                                        </button>
-                                    </form>
-                                </div>
-                            </td>
-                        </tr>
-                    @empty
-                        <tr>
-                            <td colspan="7" class="p-2 text-center text-gray-500 border border-gray-300">Belum ada template</td>
-                        </tr>
-                    @endforelse
-                </tbody>
-            </table>
-        </div>
-    </div>
-
-    <!-- Modal Tambah Template -->
-    @if (!isset($kategori))
-        <div id="modalTambah" class="fixed inset-0 hidden items-center justify-center z-50">
-            <div class="absolute inset-0 bg-black opacity-50" id="closeTambahModal"></div>
-            <div class="bg-white rounded-lg shadow-lg w-full max-w-md z-50 overflow-hidden">
-                <form action="{{ route('templates.store') }}" method="POST" enctype="multipart/form-data">
-                    @csrf
-                    <div class="p-4 border-b">
-                        <h5 class="text-lg font-medium">Tambah Template</h5>
-                    </div>
-                    <div class="p-4 space-y-4">
-                        <div>
-                            <label class="block text-sm font-medium">Nama Template</label>
-                            <input type="text" name="nama_template" class="w-full p-2 border rounded" required>
-                        </div>
-                        <div>
-                            <label class="block text-sm font-medium">Kategori</label>
-                            <select name="kategori_id" class="w-full p-2 border rounded" required>
-                                @foreach ($kategoris as $kategori)
-                                    <option value="{{ $kategori->id }}">{{ $kategori->nama }}</option>
-                                @endforeach
-                            </select>
-                        </div>
-                        <div>
-                            <label class="block text-sm font-medium">Fitur</label>
-                            <select name="fitur_id" class="w-full p-2 border rounded" required>
-                                @foreach ($fiturs as $fitur)
-                                    <option value="{{ $fitur->id }}">{{ $fitur->deskripsi }}</option>
-                                @endforeach
-                            </select>
-                        </div>
-                        <div>
-                            <label class="block text-sm font-medium">Harga</label>
-                            <input type="number" name="harga" class="w-full p-2 border rounded" required min="0" step="1000">
-                        </div>
-                        <div>
-                            <label class="block text-sm font-medium">Foto (opsional)</label>
-                            <input type="file" name="foto" class="w-full p-2 border rounded" accept="image/*">
-                            <small class="text-gray-500">Format yang didukung: JPG, PNG, GIF. Maksimal 5MB.</small>
-                        </div>
-                    </div>
-                    <div class="p-4 border-t flex justify-end space-x-2">
-                        <button type="button" id="closeTambahBtn" class="bg-gray-300 text-black px-3 py-1 rounded">Batal</button>
-                        <button class="bg-blue-600 text-white px-3 py-1 rounded">Simpan</button>
-                    </div>
-                </form>
+        @if ($errors->any())
+            <div id="toast-error" class="mb-4 p-3 rounded bg-red-100 text-red-800 border border-red-300 shadow">
+                <ul class="list-disc ml-5">
+                    @foreach ($errors->all() as $error)
+                        <li>{{ $error }}</li>
+                    @endforeach
+                </ul>
             </div>
-        </div>
-    @endif
+            <script>
+                setTimeout(() => document.getElementById('toast-error')?.remove(), 5000);
+            </script>
+        @endif
 
-    <!-- Modal Edit Template -->
-    @foreach ($templates as $template)
-        <div id="modalEdit{{ $template->id }}" class="fixed inset-0 hidden items-center justify-center z-50">
-            <div class="absolute inset-0 bg-black opacity-50 closeEditOverlay" data-id="{{ $template->id }}"></div>
-            <div class="bg-white rounded-lg shadow-lg w-full max-w-md z-50 overflow-hidden">
-                <form action="{{ route('templates.update', $template->id) }}" method="POST" enctype="multipart/form-data">
-                    @csrf @method('PUT')
-                    <div class="p-4 border-b">
-                        <h5 class="text-lg font-medium">Edit Template</h5>
-                    </div>
-                    <div class="p-4 space-y-4">
-                        <div>
-                            <label class="block text-sm font-medium">Nama Template</label>
-                            <input type="text" name="nama_template" value="{{ $template->nama_template }}"
-                                class="w-full p-2 border rounded" required>
-                        </div>
-                        <div>
-                            <label class="block text-sm font-medium">Kategori</label>
-                            <select name="kategori_id" class="w-full p-2 border rounded" required>
-                                @foreach ($kategoris as $kategori)
-                                    <option value="{{ $kategori->id }}" @selected($kategori->id == $template->kategori_id)>{{ $kategori->nama }}</option>
-                                @endforeach
-                            </select>
-                        </div>
-                        <div>
-                            <label class="block text-sm font-medium">Fitur</label>
-                            <select name="fitur_id" class="w-full p-2 border rounded" required>
-                                @foreach ($fiturs as $fitur)
-                                    <option value="{{ $fitur->id }}" @selected($fitur->id == $template->fitur_id)>{{ $fitur->deskripsi }}</option>
-                                @endforeach
-                            </select>
-                        </div>
-                        <div>
-                            <label class="block text-sm font-medium">Harga</label>
-                            <input type="number" name="harga" value="{{ $template->harga }}"
-                                class="w-full p-2 border rounded" required min="0" step="1000">
-                        </div>
-                        <div>
-                            <label class="block text-sm font-medium">Foto (opsional)</label>
-                            @if ($template->foto)
-                                <div class="mb-2">
-                                    <small class="text-gray-500">Foto saat ini:</small>
-                                    <div class="w-20 h-20 mt-1 overflow-hidden rounded bg-gray-100 flex items-center justify-center border">
-                                        <img src="{{ asset('storage/' . $template->foto) }}" alt="foto"
-                                            class="max-w-full max-h-full object-contain">
+        <!-- Tabel Template -->
+        <div class="bg-white rounded-lg shadow-sm">
+            <div class="p-4 overflow-x-auto">
+                <table class="w-full table-fixed text-left border border-gray-300 border-collapse">
+                    <thead class="bg-gray-100">
+                        <tr>
+                            <th class="p-2 border border-gray-300 w-[50px] text-center">Nomor</th>
+                            <th class="p-2 border border-gray-300 w-[200px] text-center">Nama Template</th>
+                            <th class="p-2 border border-gray-300 w-[150px] text-center">Kategori</th>
+                            <th class="p-2 border border-gray-300 w-[150px] text-center">Fitur</th>
+                            <th class="p-2 border border-gray-300 w-[90px] text-center">Foto</th>
+                            <th class="p-2 border border-gray-300 w-[100px] text-center">Harga</th>
+                            <th class="p-2 border border-gray-300 w-[130px] text-center">Aksi</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        @forelse($templates as $key => $template)
+                            <tr>
+                                <td class="p-2 border border-gray-300 text-center">{{ $key + 1 }}</td>
+                                <td class="p-2 border border-gray-300 truncate">{{ $template->nama_template }}</td>
+                                <td class="p-2 border border-gray-300 truncate">{{ $template->kategori->nama ?? '-' }}</td>
+                                <td class="p-2 border border-gray-300 truncate">{{ $template->fitur->deskripsi ?? '-' }}
+                                </td>
+                                <td class="p-2 border border-gray-300 text-center">
+                                    <div
+                                        class="w-12 h-12 overflow-hidden rounded bg-gray-100 flex items-center justify-center mx-auto">
+                                        <img src="{{ $template->foto ? asset('storage/' . $template->foto) : asset('default-image.png') }}"
+                                            alt="foto" class="max-w-full max-h-full object-contain">
                                     </div>
-                                </div>
-                            @endif
-                            <input type="file" name="foto" class="w-full p-2 border rounded" accept="image/*">
-                        </div>
-                    </div>
-                    <div class="p-4 border-t flex justify-end space-x-2">
-                        <button type="button" class="bg-gray-300 text-black px-3 py-1 rounded closeEditBtn"
-                            data-id="{{ $template->id }}">Batal</button>
-                        <button class="bg-blue-600 text-white px-3 py-1 rounded">Simpan Perubahan</button>
-                    </div>
-                </form>
+                                </td>
+                                <td class="p-2 border border-gray-300 text-left font-semibold">
+                                    Rp {{ number_format($template->harga, 0, ',', '.') }}
+                                </td>
+                                <td class="p-2 border border-gray-300 text-center">
+                                    <div class="flex justify-center space-x-2">
+                                        <button class="text-blue-600 hover:underline flex items-center openEditModalBtn"
+                                            data-id="{{ $template->id }}">
+                                            <i class="bi bi-pencil mr-1"></i> Edit
+                                        </button>
+                                        <form action="{{ route('templates.destroy', $template->id) }}" method="POST"
+                                            class="inline" onsubmit="return confirm('Hapus template ini?')">
+                                            @csrf
+                                            @method('DELETE')
+                                            <button class="text-red-600 hover:underline flex items-center">
+                                                <i class="bi bi-trash mr-1"></i> Hapus
+                                            </button>
+                                        </form>
+                                    </div>
+                                </td>
+                            </tr>
+                        @empty
+                            <tr>
+                                <td colspan="7" class="p-2 text-center text-gray-500 border border-gray-300">Belum ada
+                                    template</td>
+                            </tr>
+                        @endforelse
+                    </tbody>
+                </table>
             </div>
         </div>
-    @endforeach
 
-    <script>
-        document.addEventListener('DOMContentLoaded', () => {
-            // Modal Tambah
-            const openTambahModal = document.getElementById('openTambahModal');
-            const modalTambah = document.getElementById('modalTambah');
-            const closeTambahBtn = document.getElementById('closeTambahBtn');
-            const closeTambahOverlay = document.getElementById('closeTambahModal');
+        <!-- Modal Tambah Template -->
+        @if (!isset($kategori))
+            <div id="modalTambah" class="fixed inset-0 hidden items-center justify-center z-50">
+                <div class="absolute inset-0 bg-black opacity-50" id="closeTambahModal"></div>
+                <div class="bg-white rounded-lg shadow-lg w-full max-w-md z-50 overflow-hidden">
+                    <form action="{{ route('templates.store') }}" method="POST" enctype="multipart/form-data">
+                        @csrf
+                        <div class="p-4 border-b">
+                            <h5 class="text-lg font-medium">Tambah Template</h5>
+                        </div>
+                        <div class="p-4 space-y-4">
+                            <div>
+                                <label class="block text-sm font-medium">Nama Template</label>
+                                <input type="text" name="nama_template" class="w-full p-2 border rounded" required>
+                            </div>
+                            <div>
+                                <label class="block text-sm font-medium">Kategori</label>
+                                <select name="kategori_id" class="w-full p-2 border rounded" required>
+                                    @foreach ($kategoris as $kategori)
+                                        <option value="{{ $kategori->id }}">{{ $kategori->nama }}</option>
+                                    @endforeach
+                                </select>
+                            </div>
+                            <div>
+                                <label class="block text-sm font-medium">Fitur</label>
+                                <select name="fitur_id" class="w-full p-2 border rounded" required>
+                                    @foreach ($fiturs as $fitur)
+                                        <option value="{{ $fitur->id }}">
+                                            {{ \Illuminate\Support\Str::limit($fitur->deskripsi, 50) }}
+                                        </option>
+                                    @endforeach
+                                </select>
 
-            if (openTambahModal) {
-                openTambahModal.addEventListener('click', () => {
-                    modalTambah.classList.remove('hidden');
-                    modalTambah.classList.add('flex');
+                            </div>
+                            <div>
+                                <label class="block text-sm font-medium">Harga</label>
+                                <input type="number" name="harga" class="w-full p-2 border rounded" required
+                                    min="0" step="1000">
+                            </div>
+                            <div>
+                                <label class="block text-sm font-medium">Foto (opsional)</label>
+                                <input type="file" name="foto" class="w-full p-2 border rounded" accept="image/*">
+                                <small class="text-gray-500">Format yang didukung: JPG, PNG, GIF. Maksimal 5MB.</small>
+                            </div>
+                        </div>
+                        <div class="p-4 border-t flex justify-end space-x-2">
+                            <button type="button" id="closeTambahBtn"
+                                class="bg-gray-300 text-black px-3 py-1 rounded">Batal</button>
+                            <button class="bg-blue-600 text-white px-3 py-1 rounded">Simpan</button>
+                        </div>
+                    </form>
+                </div>
+            </div>
+        @endif
+
+        <!-- Modal Edit Template -->
+        @foreach ($templates as $template)
+            <div id="modalEdit{{ $template->id }}" class="fixed inset-0 hidden items-center justify-center z-50">
+                <div class="absolute inset-0 bg-black opacity-50 closeEditOverlay" data-id="{{ $template->id }}"></div>
+                <div class="bg-white rounded-lg shadow-lg w-full max-w-md z-50 overflow-hidden">
+                    <form action="{{ route('templates.update', $template->id) }}" method="POST"
+                        enctype="multipart/form-data">
+                        @csrf @method('PUT')
+                        <div class="p-4 border-b">
+                            <h5 class="text-lg font-medium">Edit Template</h5>
+                        </div>
+                        <div class="p-4 space-y-4">
+                            <div>
+                                <label class="block text-sm font-medium">Nama Template</label>
+                                <input type="text" name="nama_template" value="{{ $template->nama_template }}"
+                                    class="w-full p-2 border rounded" required>
+                            </div>
+                            <div>
+                                <label class="block text-sm font-medium">Kategori</label>
+                                <select name="kategori_id" class="w-full p-2 border rounded" required>
+                                    @foreach ($kategoris as $kategori)
+                                        <option value="{{ $kategori->id }}" @selected($kategori->id == $template->kategori_id)>
+                                            {{ $kategori->nama }}</option>
+                                    @endforeach
+                                </select>
+                            </div>
+                            <div>
+                                <label class="block text-sm font-medium">Fitur</label>
+                                <select name="fitur_id" class="w-full p-2 border rounded" required>
+                                    @foreach ($fiturs as $fitur)
+                                        <option value="{{ $fitur->id }}" @selected($fitur->id == $template->fitur_id)>
+                                            {{ $fitur->deskripsi }}</option>
+                                    @endforeach
+                                </select>
+                            </div>
+                            <div>
+                                <label class="block text-sm font-medium">Harga</label>
+                                <input type="number" name="harga" value="{{ $template->harga }}"
+                                    class="w-full p-2 border rounded" required min="0" step="1000">
+                            </div>
+                            <div>
+                                <label class="block text-sm font-medium">Foto (opsional)</label>
+                                @if ($template->foto)
+                                    <div class="mb-2">
+                                        <small class="text-gray-500">Foto saat ini:</small>
+                                        <div
+                                            class="w-20 h-20 mt-1 overflow-hidden rounded bg-gray-100 flex items-center justify-center border">
+                                            <img src="{{ asset('storage/' . $template->foto) }}" alt="foto"
+                                                class="max-w-full max-h-full object-contain">
+                                        </div>
+                                    </div>
+                                @endif
+                                <input type="file" name="foto" class="w-full p-2 border rounded" accept="image/*">
+                            </div>
+                        </div>
+                        <div class="p-4 border-t flex justify-end space-x-2">
+                            <button type="button" class="bg-gray-300 text-black px-3 py-1 rounded closeEditBtn"
+                                data-id="{{ $template->id }}">Batal</button>
+                            <button class="bg-blue-600 text-white px-3 py-1 rounded">Simpan Perubahan</button>
+                        </div>
+                    </form>
+                </div>
+            </div>
+        @endforeach
+
+        <script>
+            document.addEventListener('DOMContentLoaded', () => {
+                // Modal Tambah
+                const openTambahModal = document.getElementById('openTambahModal');
+                const modalTambah = document.getElementById('modalTambah');
+                const closeTambahBtn = document.getElementById('closeTambahBtn');
+                const closeTambahOverlay = document.getElementById('closeTambahModal');
+
+                if (openTambahModal) {
+                    openTambahModal.addEventListener('click', () => {
+                        modalTambah.classList.remove('hidden');
+                        modalTambah.classList.add('flex');
+                    });
+                }
+                if (closeTambahBtn) {
+                    closeTambahBtn.addEventListener('click', () => {
+                        modalTambah.classList.add('hidden');
+                        modalTambah.classList.remove('flex');
+                    });
+                }
+                if (closeTambahOverlay) {
+                    closeTambahOverlay.addEventListener('click', () => {
+                        modalTambah.classList.add('hidden');
+                        modalTambah.classList.remove('flex');
+                    });
+                }
+
+                // Modal Edit
+                const openEditBtns = document.querySelectorAll('.openEditModalBtn');
+                const closeEditBtns = document.querySelectorAll('.closeEditBtn');
+                const closeEditOverlays = document.querySelectorAll('.closeEditOverlay');
+
+                openEditBtns.forEach(btn => {
+                    btn.addEventListener('click', () => {
+                        const id = btn.dataset.id;
+                        const modal = document.getElementById('modalEdit' + id);
+                        if (modal) {
+                            modal.classList.remove('hidden');
+                            modal.classList.add('flex');
+                        }
+                    });
                 });
-            }
-            if (closeTambahBtn) {
-                closeTambahBtn.addEventListener('click', () => {
-                    modalTambah.classList.add('hidden');
-                    modalTambah.classList.remove('flex');
-                });
-            }
-            if (closeTambahOverlay) {
-                closeTambahOverlay.addEventListener('click', () => {
-                    modalTambah.classList.add('hidden');
-                    modalTambah.classList.remove('flex');
-                });
-            }
 
-            // Modal Edit
-            const openEditBtns = document.querySelectorAll('.openEditModalBtn');
-            const closeEditBtns = document.querySelectorAll('.closeEditBtn');
-            const closeEditOverlays = document.querySelectorAll('.closeEditOverlay');
+                closeEditBtns.forEach(btn => {
+                    btn.addEventListener('click', () => {
+                        const id = btn.dataset.id;
+                        const modal = document.getElementById('modalEdit' + id);
+                        if (modal) {
+                            modal.classList.add('hidden');
+                            modal.classList.remove('flex');
+                        }
+                    });
+                });
 
-            openEditBtns.forEach(btn => {
-                btn.addEventListener('click', () => {
-                    const id = btn.dataset.id;
-                    const modal = document.getElementById('modalEdit' + id);
-                    if (modal) {
-                        modal.classList.remove('hidden');
-                        modal.classList.add('flex');
-                    }
+                closeEditOverlays.forEach(overlay => {
+                    overlay.addEventListener('click', () => {
+                        const id = overlay.dataset.id;
+                        const modal = document.getElementById('modalEdit' + id);
+                        if (modal) {
+                            modal.classList.add('hidden');
+                            modal.classList.remove('flex');
+                        }
+                    });
                 });
             });
-
-            closeEditBtns.forEach(btn => {
-                btn.addEventListener('click', () => {
-                    const id = btn.dataset.id;
-                    const modal = document.getElementById('modalEdit' + id);
-                    if (modal) {
-                        modal.classList.add('hidden');
-                        modal.classList.remove('flex');
-                    }
-                });
-            });
-
-            closeEditOverlays.forEach(overlay => {
-                overlay.addEventListener('click', () => {
-                    const id = overlay.dataset.id;
-                    const modal = document.getElementById('modalEdit' + id);
-                    if (modal) {
-                        modal.classList.add('hidden');
-                        modal.classList.remove('flex');
-                    }
-                });
-            });
-        });
-    </script>
-</div>
+        </script>
+    </div>
 @endsection