diff --git a/resources/views/khazanah/laporan/index.blade.php b/resources/views/khazanah/laporan/index.blade.php
index 97632aa..d324898 100644
--- a/resources/views/khazanah/laporan/index.blade.php
+++ b/resources/views/khazanah/laporan/index.blade.php
@@ -1,146 +1,194 @@
 @extends('layouts.app')
 
 <style>
-    <style>
-    .custom-btn {
-        width: 10px; 
+    <style>.custom-btn {
+        width: 10px;
     }
 </style>
-</style>
 
 @section('content')
-<div class="container-fluid">
-    <div class="row">
-        <div class="col-md-12">
-            <div class="card">
-                <nav aria-label="breadcrumb">
-                    <ol class="breadcrumb pb-3">
-                      <li class="breadcrumb-item"><a href="{{ route('home') }}">Home</a></li>
-                      <li class="breadcrumb-item active" aria-current="page">Laporan</li>
-                    </ol>
-                  </nav>
+    <div class="container-fluid">
+        <div class="row">
+            <div class="col-md-12">
+                <div class="card">
+                    <nav aria-label="breadcrumb">
+                        <ol class="breadcrumb pb-3">
+                            <li class="breadcrumb-item"><a href="{{ route('home') }}">Home</a></li>
+                            <li class="breadcrumb-item active" aria-current="page">Laporan</li>
+                        </ol>
+                    </nav>
 
-                @php
-                    $auth_user = Auth::user();
-                    $cawangan = Http::withOptions(['verify' => config('app.api_verify')])->get(config('api.url') . '/api/cawangan/'. $auth_user['cawangan'])->json();
-                    $version = $cawangan['version'];
-                @endphp
+                    @php
+                        $auth_user = Auth::user();
+                        $cawangan = Http::withOptions(['verify' => config('app.api_verify')])
+                            ->get(config('api.url') . '/api/cawangan/' . $auth_user['cawangan'])
+                            ->json();
+                        $version = $cawangan['version'];
+                    @endphp
 
-                <div class="card-body text-center">
-                    <div class="row form-group">
-                        <div class="col-md-2">
-                        </div>
-                        <div class="col-md-10">
-                        </div>
-                    </div>
+                    <div class="card-body text-center">
 
-                    <div class="row form-group justify-content-center col-12 mx-12 ">
-                        <div class="col-md-3 ">
-                            <div class="row">
-                                @if($version == 'v1')
-                                    <a href="{{ route('laporan.gadaian') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Pembiayaan</a>
-                                @else
-                                    <a href="{{ route('laporan.gadaianujrah') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Pembiayaan</a>
-                                @endif
-                            </div>
-                            <div class="row d-none">
-                                <a href="#" class="btn btn-danger btn-lg btn-block mb-3 custom-btn">Lelongan</a>
-                            </div>
-                            <div class="row">
-                                <a href="{{ route('laporan.pelangganbaru') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Pelanggan Baru</a>
-                            </div>
-                            <div class="row">
-                                <a href="{{ route('laporan.ringkasanterkumpul') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">
-                                    <span>Ringkasan Terkumpul</a></span>
-                            </div>
-                            <div class="row">
-                                <a href="{{route('laporan.agingbulanan')}}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Aging Bulan</a>
-                            </div>
-                            <div class="row">
-                                <a href="{{ route('laporan.pendserahan') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Laporan HQ</a>
-                            </div>
-                            <div class="row">
-                                <a href="{{route('laporan.tuntutbaki')}}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Tuntut Baki</a>
-                            </div>
-                            <div class="row">
-                                <a href="{{ route('laporan.hargaemas') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Harga Emas</a>
-                            </div>
-                            <div class="row">
-                                <a href="{{route('laporan.wakil')}}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Senarai Wakil</a>
-                            </div>
-                            <div class="row">
-                                <a href="{{route('laporan.stokauditbackdate')}}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Stok Audit Backdate</a>
-                            </div>
-                            <div class="row">
-                                <a href="{{ route('laporan.stokauditkhas') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">SA(Whatsapp & SMS)</a>
+                        <div class="row mb-3">
+                            <div class="col-md-12 d-flex justify-content-start align-items-center">
+                                <button id="toggle-search" class="btn btn-outline-secondary mr-2" type="button"
+                                    style="height: 38px;">
+                                    <i class="fa fa-search"></i>
+                                </button>
+                                <input type="text" id="search-laporan" class="form-control"
+                                    style="width: 300px; max-width: 100%; display: none; transition: all 0.3s;"
+                                    placeholder="Cari laporan apa ya ?">
                             </div>
                         </div>
-                        <div class="col-4 mx-1">
-                            <div class="row">
-                                @if($version == 'v1')
-                                    <a href="{{ route('laporan.tebus') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Penyelesaian Penuh</a>
-                                @else
-                                    <a href="{{ route('laporan.tebusujrah') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Penyelesaian Penuh</a>
-                                @endif
+
+                        <div class="row form-group">
+                            <div class="col-md-2">
                             </div>
-                            <div class="row">
-                                <a href="{{ route('laporan.kawalanstok') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Kawalan Stok Produk</a>
-                            </div>
-                            <div class="row">
-                                <a href="{{ route('laporan.ringkasanharianujrah') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Ringkasan Harian (Lain-lain Caj)</a>
-                            </div>
-                            <div class="row">
-                                <a href="{{ route('laporan.batalsuratgadai') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Batal Surat Pembiayaan</a>
-                            </div>
-                            <div class="row">
-                                <a href="{{ route('laporan.marhunharian') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Marhun Harian</a>
-                            </div>
-                            <div class="row">
-                                <a href="{{ route('laporan.senaraipetibesi') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Senarai Peti Besi</a>
-                            </div>
-                            <div class="row">
-                                <a href="{{ route('laporan.datalejer_am') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Lejer Am</a>
-                            </div>
-                            <div class="row">
-                                <a href="{{ route('laporan.denominasi') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Denominasi</a>
-                            </div>
-                            <div class="row">
-                                <a href="{{ route('laporan.saghilang') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">SAG Hilang</a>
-                            </div>
-                            <div class="row">
-                                <a href="{{ route('laporan.serahmarhuntebus') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Serah Marhun (Penyelesaian Pembiayaan)</a>
+                            <div class="col-md-10">
                             </div>
                         </div>
-                        <div class="col-3 mx-1">
-                            <div class="row">
-                                <a href="{{ route('laporan.ansuran') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Ansuran Pembiayaan</a>
+
+                        <div class="row form-group justify-content-center col-12 mx-12 ">
+                            <div class="col-md-3 ">
+                                <div class="row">
+                                    @if ($version == 'v1')
+                                        <a href="{{ route('laporan.gadaian') }}"
+                                            class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Pembiayaan</a>
+                                    @else
+                                        <a href="{{ route('laporan.gadaianujrah') }}"
+                                            class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Pembiayaan</a>
+                                    @endif
+                                </div>
+                                <div class="row d-none">
+                                    <a href="#" class="btn btn-danger btn-lg btn-block mb-3 custom-btn">Lelongan</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.pelangganbaru') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Pelanggan Baru</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.ringkasanterkumpul') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">
+                                        <span>Ringkasan Terkumpul</a></span>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.agingbulanan') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Aging Bulan</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.pendserahan') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Laporan HQ</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.tuntutbaki') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Tuntut Baki</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.hargaemas') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Harga Emas</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.wakil') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Senarai Wakil</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.stokauditbackdate') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Stok Audit Backdate</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.stokauditkhas') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">SA(Whatsapp & SMS)</a>
+                                </div>
                             </div>
-                            <div class="row">
-                                <a href="{{ route('laporan.stokauditcombine') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Stok Audit</a>
+                            <div class="col-4 mx-1">
+                                <div class="row">
+                                    @if ($version == 'v1')
+                                        <a href="{{ route('laporan.tebus') }}"
+                                            class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Penyelesaian Penuh</a>
+                                    @else
+                                        <a href="{{ route('laporan.tebusujrah') }}"
+                                            class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Penyelesaian Penuh</a>
+                                    @endif
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.kawalanstok') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Kawalan Stok Produk</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.ringkasanharianujrah') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Ringkasan Harian (Lain-lain
+                                        Caj)</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.batalsuratgadai') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Batal Surat Pembiayaan</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.marhunharian') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Marhun Harian</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.senaraipetibesi') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Senarai Peti Besi</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.datalejer_am') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Lejer Am</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.denominasi') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Denominasi</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.saghilang') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">SAG Hilang</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.serahmarhuntebus') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Serah Marhun (Penyelesaian
+                                        Pembiayaan)</a>
+                                </div>
                             </div>
-                            <div class="row">
-                                <a href="{{ route('laporan.ringkasanharian') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Ringkasan Harian</a>
-                            </div>
-                            <div class="row">
-                                <a href="{{ route('laporan.marhunterkumpul') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Marhun Terkumpul</a>
-                            </div>
-                            <div class="row">
-                                <a href="{{ route('laporan.audittrail') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Audit Trail</a>
-                            </div>
-                            <div class="row">
-                                <a href="{{ route('laporan.serahmarhungadai') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Serah Marhun Pembiayaan</a>
-                            </div>
-                            <div class="row">
-                                <a href="{{route('laporan.petibesi')}}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Peti Besi</a>
-                            </div>
-                            <div class="row">
-                                <a href="{{ route('laporan.perbelanjaan') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Perbelanjaan</a>
-                            </div>
-                            <div class="row">
-                                <a href="{{ route('laporan.imbangdugaakru') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Imbang Duga Akru</a>
-                            </div>
-                            <div class="row">
-                                <a href="{{ route('laporan.notisperingatan') }}" class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Notis Peringatan</a>
+                            <div class="col-3 mx-1">
+                                <div class="row">
+                                    <a href="{{ route('laporan.ansuran') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Ansuran Pembiayaan</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.stokauditcombine') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Stok Audit</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.ringkasanharian') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Ringkasan Harian</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.marhunterkumpul') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Marhun Terkumpul</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.audittrail') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Audit Trail</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.serahmarhungadai') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Serah Marhun Pembiayaan</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.petibesi') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Peti Besi</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.perbelanjaan') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Perbelanjaan</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.imbangdugaakru') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Imbang Duga Akru</a>
+                                </div>
+                                <div class="row">
+                                    <a href="{{ route('laporan.notisperingatan') }}"
+                                        class="btn btn-dark btn-lg btn-block mb-3 custom-btn">Notis Peringatan</a>
+                                </div>
                             </div>
                         </div>
                     </div>
@@ -148,6 +196,39 @@
             </div>
         </div>
     </div>
-</div>
 
+    <script>
+        document.addEventListener("DOMContentLoaded", function() {
+            const searchInput = document.getElementById('search-laporan');
+            const toggleBtn = document.getElementById('toggle-search');
+            if (toggleBtn && searchInput) {
+                toggleBtn.addEventListener('click', function() {
+                    if (searchInput.style.display === 'none' || searchInput.style.display === '') {
+                        searchInput.style.display = 'block';
+                        searchInput.focus();
+                    } else {
+                        searchInput.value = '';
+                        searchInput.style.display = 'none';
+                        // Show all rows when hiding search
+                        document.querySelectorAll('.custom-btn').forEach(function(btn) {
+                            const row = btn.closest('.row');
+                            row.style.display = '';
+                        });
+                    }
+                });
+                searchInput.addEventListener('keyup', function() {
+                    const searchTerm = this.value.toLowerCase();
+                    document.querySelectorAll('.custom-btn').forEach(function(btn) {
+                        const text = btn.textContent.toLowerCase();
+                        const row = btn.closest('.row');
+                        if (text.includes(searchTerm)) {
+                            row.style.display = '';
+                        } else {
+                            row.style.display = 'none';
+                        }
+                    });
+                });
+            }
+        });
+    </script>
 @endsection