diff --git a/config/app.php b/config/app.php
index 0392ab3..cf226be 100644
--- a/config/app.php
+++ b/config/app.php
@@ -124,4 +124,6 @@ return [
     ],
 
     'force_https' => env('FORCE_HTTPS', false),
+
+    'desc' => env('APP_DESC', 'Laravel'),
 ];
diff --git a/resources/views/auth/login.blade.php b/resources/views/auth/login.blade.php
index 27468cb..7f2e66d 100644
--- a/resources/views/auth/login.blade.php
+++ b/resources/views/auth/login.blade.php
@@ -5,6 +5,7 @@
         <!-- Logo -->
         <div class="app-brand justify-content-center mb-6">
         <a href="{{ route('home') }}" class="app-brand-link">
+            @if(config('app.name') == 'AgroMonev')
             <span class="app-brand-logo demo">
                 <span class="text-primary">
                     <svg width="32" height="24" viewBox="0 0 32 24" fill="none" xmlns="http://www.w3.org/2000/svg">
@@ -20,10 +21,34 @@
                 </span>
             </span>
             <span class="app-brand-text demo menu-text fw-bold ms-3" style="text-transform: capitalize;">AgroMonev</span>
+            @elseif(config('app.name') == 'AgroPro')
+            <span class="app-brand-logo demo">
+                <span class="text-primary">
+                    <svg width="32" height="24" viewBox="0 0 32 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+                        <path opacity="0.25" d="M16 2.5C16 2.5 5 6.5 5 15.5C5 20.5 11 23.5 16 23.5V2.5Z" fill="#28A745"/>
+                        <path opacity="0.5" d="M16 2.5C16 2.5 27 6.5 27 15.5C27 20.5 21 23.5 16 23.5V2.5Z" fill="#28A745"/>
+                        <rect x="5.5" y="5.5" width="21" height="15" rx="2.5" fill="white" stroke="#0054A6" stroke-width="1.5"/>
+                        <rect x="11" y="3.5" width="10" height="4" rx="2" fill="#0054A6"/>
+                        <circle cx="9.5" cy="10" r="1.7" fill="#28A745"/>
+                        <path d="M8.7 10L9.3 10.6L10.4 9.3" stroke="white" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/>
+                        <path d="M13 10H23" stroke="#D9E2EC" stroke-width="2" stroke-linecap="round"/>
+                        <path d="M13 10H22" stroke="#0054A6" stroke-width="2" stroke-linecap="round"/>
+                        <circle cx="9.5" cy="14" r="1.7" fill="#28A745"/>
+                        <path d="M8.7 14L9.3 14.6L10.4 13.3" stroke="white" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/>
+                        <path d="M13 14H23" stroke="#D9E2EC" stroke-width="2" stroke-linecap="round"/>
+                        <path d="M13 14H19.5" stroke="#F4B400" stroke-width="2" stroke-linecap="round"/>
+                        <circle cx="9.5" cy="18" r="1.7" fill="white" stroke="#ED1C24" stroke-width="1.3"/>
+                        <path d="M13 18H23" stroke="#D9E2EC" stroke-width="2" stroke-linecap="round"/>
+                        <path d="M13 18H17" stroke="#ED1C24" stroke-width="2" stroke-linecap="round"/>
+                    </svg>
+                </span>
+            </span>
+            <span class="app-brand-text demo menu-text fw-bold ms-3" style="text-transform: capitalize;">AgroPro</span>
+            @endif
         </a>
         </div>
         <!-- /Logo -->
-        <h4 class="mb-1">Selamat datang di AgroMonev!</h4>
+        <h4 class="mb-1">Selamat datang di {{ config('app.name') }}!</h4>
         <p class="mb-6">Silakan masuk ke akun Anda</p>
         @if ($errors->any())
             <div class="alert alert-danger">
diff --git a/resources/views/layout/header.blade.php b/resources/views/layout/header.blade.php
index b0f3656..23c0f75 100644
--- a/resources/views/layout/header.blade.php
+++ b/resources/views/layout/header.blade.php
@@ -15,7 +15,7 @@
       name="viewport"
       content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0" />
     <meta name="robots" content="noindex, nofollow" />
-    <title>AgroMonev | {{ $title ?? 'Database Petani' }}</title>
+    <title>{{ config('app.name') }} | {{ $title ?? config('app.desc') }}</title>
 
     <meta name="description" content="" />
 
diff --git a/resources/views/layout/main.blade.php b/resources/views/layout/main.blade.php
index 25c5a1e..a436578 100644
--- a/resources/views/layout/main.blade.php
+++ b/resources/views/layout/main.blade.php
@@ -4,7 +4,13 @@
     <div class="layout-wrapper layout-content-navbar  ">
       <div class="layout-container">
         <!-- Menu -->
+        @if(config('app.name') == 'AgroMonev')
+        @include('layout.sidebar_monev')
+        @elseif(config('app.name') == 'AgroPro')
+        @include('layout.sidebar_pro')
+        @else
         @include('layout.sidebar')
+        @endif
         <!-- / Menu -->
 
         <!-- Layout container -->
diff --git a/resources/views/layout/sidebar_monev.blade.php b/resources/views/layout/sidebar_monev.blade.php
new file mode 100644
index 0000000..1f72d3d
--- /dev/null
+++ b/resources/views/layout/sidebar_monev.blade.php
@@ -0,0 +1,283 @@
+<aside id="layout-menu" class="layout-menu menu-vertical menu">
+    <div class="app-brand demo ">
+        <a href="{{ route('home') }}" class="app-brand-link">
+            <span class="app-brand-logo demo">
+                <span>
+                    <!-- AgroMonev -->
+                    <svg width="32" height="24" viewBox="0 0 32 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+                        <path opacity="0.3" d="M16 2.5C16 2.5 5 6.5 5 15.5C5 20.5 11 23.5 16 23.5V2.5Z" fill="#28a745" />
+                        <path opacity="0.6" d="M16 2.5C16 2.5 27 6.5 27 15.5C27 20.5 21 23.5 16 23.5V2.5Z" fill="#28a745" />
+                        <path d="M2 19L10 11L15 15" stroke="#0054A6" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" />
+                        <path d="M15 15L27 4" stroke="#ED1C24" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" />
+                        <circle cx="27" cy="4" r="2.5" fill="#ED1C24" />
+                    </svg>
+                    <!-- AgroPro -->
+                    <!-- <svg width="32" height="24" viewBox="0 0 32 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+                        <path opacity="0.25" d="M16 2.5C16 2.5 5 6.5 5 15.5C5 20.5 11 23.5 16 23.5V2.5Z" fill="#28A745"/>
+                        <path opacity="0.5" d="M16 2.5C16 2.5 27 6.5 27 15.5C27 20.5 21 23.5 16 23.5V2.5Z" fill="#28A745"/>
+                        <rect x="5.5" y="5.5" width="21" height="15" rx="2.5" fill="white" stroke="#0054A6" stroke-width="1.5"/>
+                        <rect x="11" y="3.5" width="10" height="4" rx="2" fill="#0054A6"/>
+                        <circle cx="9.5" cy="10" r="1.7" fill="#28A745"/>
+                        <path d="M8.7 10L9.3 10.6L10.4 9.3" stroke="white" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/>
+                        <path d="M13 10H23" stroke="#D9E2EC" stroke-width="2" stroke-linecap="round"/>
+                        <path d="M13 10H22" stroke="#0054A6" stroke-width="2" stroke-linecap="round"/>
+                        <circle cx="9.5" cy="14" r="1.7" fill="#28A745"/>
+                        <path d="M8.7 14L9.3 14.6L10.4 13.3" stroke="white" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/>
+                        <path d="M13 14H23" stroke="#D9E2EC" stroke-width="2" stroke-linecap="round"/>
+                        <path d="M13 14H19.5" stroke="#F4B400" stroke-width="2" stroke-linecap="round"/>
+                        <circle cx="9.5" cy="18" r="1.7" fill="white" stroke="#ED1C24" stroke-width="1.3"/>
+                        <path d="M13 18H23" stroke="#D9E2EC" stroke-width="2" stroke-linecap="round"/>
+                        <path d="M13 18H17" stroke="#ED1C24" stroke-width="2" stroke-linecap="round"/>
+                    </svg> -->
+                </span>
+            </span>
+
+            <span class="app-brand-text demo menu-text fw-bold ms-3" style="text-transform: capitalize;">
+                AgroMonev
+            </span>
+        </a>
+
+        <a href="javascript:void(0);" class="layout-menu-toggle menu-link text-large ms-auto">
+            <i class="icon-base ti menu-toggle-icon d-none d-xl-block"></i>
+            <i class="icon-base ti tabler-x d-block d-xl-none"></i>
+        </a>
+    </div>
+
+    <div class="menu-inner-shadow"></div>
+
+    <ul class="menu-inner py-1">
+        <!-- Dashboards -->
+        @php
+            $userRole = auth()->check() ? (auth()->user()->role instanceof \App\Enums\Role ? auth()->user()->role->value : auth()->user()->role) : null;
+        @endphp
+
+        @if(in_array($userRole, ['super_admin', 'admin', 'fasilitator']) )
+        <li class="menu-item active open">
+            <a href="javascript:void(0);" class="menu-link menu-toggle">
+                <i class="menu-icon icon-base ti tabler-smart-home"></i>
+                <div data-i18n="Dashboards">Dashboards</div>
+            </a>
+            
+            @if(in_array($userRole, ['super_admin', 'admin']) && env('APP_NAME') == 'AgroMonev')
+            <ul class="menu-sub">
+                <li class="menu-item {{ request()->routeIs('dashboard.produktivitas') ? 'active' : '' }}">
+                    <a href="{{ route('dashboard.produktivitas') }}" class="menu-link">
+                        <div data-i18n="Produktivitas">Produktivitas</div>
+                    </a>
+                </li>
+            </ul>
+            @endif
+
+            @if(in_array($userRole, ['super_admin', 'admin', 'fasilitator']) && env('APP_NAME') == 'AgroMonev')
+            <ul class="menu-sub">
+                <li class="menu-item {{ request()->routeIs('dashboard.survey-petani') ? 'active' : '' }}">
+                    <a href="{{ route('dashboard.survey-petani') }}" class="menu-link">
+                        <div data-i18n="Survey Petani">Survey Petani</div>
+                    </a>
+                </li>
+            </ul>
+            <ul class="menu-sub">
+                <li class="menu-item {{ request()->routeIs('dashboard.petani') ? 'active' : '' }}">
+                    <a href="{{ route('dashboard.petani') }}" class="menu-link">
+                        <div data-i18n="Profil Petani">Profil Petani</div>
+                    </a>
+                </li>
+            </ul>
+            @endif
+        </li>
+        @endif
+
+        @if(in_array($userRole, ['fasilitator', 'super_admin', 'admin']) && env('APP_NAME') == 'AgroMonev')
+        <li class="menu-header small">
+            <span class="menu-header-text" data-i18n="Data Pertanian">Data Pertanian</span>
+        </li>
+        <li class="menu-item {{ request()->routeIs('petani.*') ? 'active' : '' }}">
+            <a href="{{ route('petani.index') }}" class="menu-link">
+                <i class="menu-icon icon-base ti tabler-file-description"></i>
+                <div data-i18n="Profil Petani">Profil Petani</div>
+            </a>
+        </li>
+        @endif
+
+        @if(in_array($userRole, ['super_admin', 'admin']) && env('APP_NAME') == 'AgroPro')
+        <!-- Ekosistem -->
+        <li class="menu-header small">
+            <span class="menu-header-text" data-i18n="Ekosistem">Ekosistem</span>
+        </li>
+        <li class="menu-item {{ request()->routeIs(['profile.*', 'produksi.*', 'lahan.*', 'tanaman.*']) ? 'active open' : '' }}">
+            <a href="javascript:void(0);" class="menu-link menu-toggle">
+                <i class="menu-icon icon-base ti tabler-file-description"></i>
+                <div data-i18n="Data Pertanian">Data Pertanian</div>
+            </a>
+            <ul class="menu-sub">
+                <li class="menu-item {{ request()->routeIs('petani.*') ? 'active' : '' }}">
+                    <a href="{{ route('petani.index') }}" class="menu-link"><div data-i18n="Profil Petani">Profil Petani</div></a>
+                </li>
+                <li class="menu-item {{ request()->routeIs('produksi.*') ? 'active' : '' }}">
+                    <a href="{{ route('produksi.index') }}" class="menu-link"><div data-i18n="Hasil Panen">Hasil Panen</div></a>
+                </li>
+                <li class="menu-item {{ request()->routeIs('lahan.*') ? 'active' : '' }}">
+                    <a href="{{ route('lahan.index') }}" class="menu-link"><div data-i18n="Pemantauan Lahan">Pemantauan Lahan</div></a>
+                </li>
+                <li class="menu-item {{ request()->routeIs('tanaman.*') ? 'active' : '' }}">
+                    <a href="{{ route('tanaman.index') }}" class="menu-link"><div data-i18n="Pemantauan Tanaman">Pemantauan Tanaman</div></a>
+                </li>
+            </ul>
+        </li>
+        
+        <li class="menu-item {{ request()->routeIs(['petani-cpm.*', 'lahan-cpcl.*', 'tabel.data.*']) ? 'active open' : '' }}">
+            <a href="javascript:void(0);" class="menu-link menu-toggle">
+                <i class="menu-icon icon-base ti tabler-folder-root"></i>
+                <div data-i18n="Basis Data Ekosistem">Basis Data Ekosistem</div>
+            </a>
+            <ul class="menu-sub">
+                <li class="menu-item {{ request()->routeIs('petani-cpm.*') ? 'active' : '' }}">
+                    <a href="{{ route('petani-cpm.index') }}" class="menu-link"><div data-i18n="Petani CPM">Petani CPM</div></a>
+                </li>
+                <li class="menu-item {{ request()->routeIs('lahan-cpcl.*') ? 'active' : '' }}">
+                    <a href="{{ route('lahan-cpcl.index') }}" class="menu-link"><div data-i18n="Lahan CPCL">Lahan CPCL</div></a>
+                </li>
+            </ul>
+            @foreach ($tabel_menu ?? [] as $tbl)
+            <ul class="menu-sub">
+                <li class="menu-item {{ request()->routeIs('tabel.data.*') && request()->route('tabel') == $tbl->id  ? 'active' : '' }}">
+                    <a href="{{ route('tabel.data.index', $tbl->id) }}" class="menu-link">
+                        <div data-i18n="{{ $tbl->menu }}">{{ $tbl->menu }}</div>
+                    </a>
+                </li>
+            </ul>
+            @endforeach
+        </li>
+        <!-- <li class="menu-item">
+        <a href="javascript:void(0);" class="menu-link menu-toggle">
+            <i class="menu-icon icon-base ti tabler-line-scan"></i>
+            <div data-i18n="Tracebility">Tracebility</div>
+        </a>
+        <ul class="menu-sub">
+            <li class="menu-item">
+                <a href="#" class="menu-link">
+                <div data-i18n="Manajemen Batch & Kode">Manajemen Batch & Kode</div>
+                </a>
+            </li>
+        </ul>
+        <ul class="menu-sub">
+            <li class="menu-item">
+                <a href="#" class="menu-link">
+                <div data-i18n="Penelusuran Product">Penelusuran Product</div>
+                </a>
+            </li>
+        </ul>
+    </li> -->
+        <li class="menu-item {{ request()->routeIs(['realisasi.*', 'kelompok-belajar-tani.*', 'workshop.*']) ? 'active open' : '' }}">
+            <a href="javascript:void(0);" class="menu-link menu-toggle">
+                <i class="menu-icon icon-base ti tabler-webhook"></i>
+                <div data-i18n="Program & Komunitas">Program & Komunitas</div>
+            </a>
+            <ul class="menu-sub">
+                <li class="menu-item {{ request()->routeIs('realisasi.*') ? 'active' : '' }}">
+                    <a href="{{ route('realisasi.index') }}" class="menu-link"><div data-i18n="Capaian Program">Capaian Program</div></a>
+                </li>
+                <li class="menu-item {{ request()->routeIs('kelompok-belajar-tani.*') ? 'active' : '' }}">
+                    <a href="{{ route('kelompok-belajar-tani.index') }}" class="menu-link"><div data-i18n="Kelompok Belajar Petani">Kelompok Belajar Petani</div></a>
+                </li>
+                <li class="menu-item {{ request()->routeIs('workshop.*') ? 'active' : '' }}">
+                    <a href="{{ route('workshop.index') }}" class="menu-link"><div data-i18n="Workshop & Lokakarya">Workshop & Lokakarya</div></a>
+                </li>
+            </ul>
+        </li>
+        @endif
+
+        @if(in_array($userRole, ['super_admin']))
+        <!-- Master Data -->
+        <li class="menu-header small">
+            <span class="menu-header-text" data-i18n="Master Data">Master Data</span>
+        </li>
+        <li class="menu-item">
+            <a href="javascript:void(0);" class="menu-link menu-toggle">
+                <i class="menu-icon icon-base ti tabler-world"></i>
+                <div data-i18n="Wilayah">Wilayah</div>
+            </a>
+            <ul class="menu-sub">
+                <li class="menu-item"><a href="{{ route('provinsi.index') }}" class="menu-link"><div data-i18n="Provinsi">Provinsi</div></a></li>
+                <li class="menu-item"><a href="{{ route('kabupatenkota.index') }}" class="menu-link"><div data-i18n="Kabupaten Kota">Kabupaten Kota</div></a></li>
+                <li class="menu-item"><a href="{{ route('kecamatan.index') }}" class="menu-link"><div data-i18n="Kecamatan">Kecamatan</div></a></li>
+                <li class="menu-item"><a href="{{ route('desakelurahan.index') }}" class="menu-link"><div data-i18n="Desa Kelurahan">Desa Kelurahan</div></a></li>
+            </ul>
+        </li>
+        <li class="menu-item">
+            <a href="{{ route('adat.index') }}" class="menu-link"><i class="menu-icon icon-base ti tabler-matrix"></i><div data-i18n="Adat">Adat</div></a>
+        </li>
+        <li class="menu-item">
+            <a href="{{ route('keluarga.index') }}" class="menu-link"><i class="menu-icon icon-base ti tabler-sitemap"></i><div data-i18n="Keluarga">Keluarga</div></a>
+        </li>
+        <li class="menu-item">
+            <a href="javascript:void(0);" class="menu-link menu-toggle">
+                <i class="menu-icon icon-base ti tabler-plant"></i><div data-i18n="Tanaman">Tanaman</div>
+            </a>
+            <ul class="menu-sub">
+                <li class="menu-item"><a href="{{ route('komoditas.index') }}" class="menu-link"><div data-i18n="Komoditas">Komoditas</div></a></li>
+                <li class="menu-item"><a href="{{ route('jenis-komoditas.index') }}" class="menu-link"><div data-i18n="Jenis Komoditas">Jenis Komoditas</div></a></li>
+                <li class="menu-item"><a href="{{ route('varietas.index') }}" class="menu-link"><div data-i18n="Varietas">Varietas</div></a></li>
+            </ul>
+        </li>
+        @endif
+
+        @if(in_array($userRole, ['super_admin', 'admin']))
+        <li class="menu-header small">
+            <span class="menu-header-text" data-i18n="Konfigurasi">Konfigurasi</span>
+        </li>
+        <li class="menu-item {{ request()->routeIs('users.*') ? 'active' : '' }}">
+            <a href="{{ route('users.index') }}" class="menu-link">
+                <i class="menu-icon icon-base ti tabler-users"></i><div data-i18n="Daftar Pengguna">Daftar Pengguna</div>
+            </a>
+        </li>
+        @endif
+
+        @if(in_array($userRole, ['super_admin', 'admin']) && env('APP_NAME') == 'AgroPro')
+        <li class="menu-item {{ request()->routeIs(['program.*', 'framework.*']) ? 'active open' : '' }}">
+            <a href="javascript:void(0);" class="menu-link menu-toggle">
+                <i class="menu-icon icon-base ti tabler-transform"></i><div data-i18n="Program Transformasi">Program Transformasi</div>
+            </a>
+            <ul class="menu-sub">
+                <li class="menu-item {{ request()->routeIs('program.*') ? 'active' : '' }}">
+                    <a href="{{ route('program.index') }}" class="menu-link"><div data-i18n="Program Transformasi">Program Transformasi</div></a>
+                </li>
+                <li class="menu-item {{ request()->routeIs('framework.*') ? 'active' : '' }}">
+                    <a href="{{ route('framework.index') }}" class="menu-link"><div data-i18n="Framework">Framework</div></a>
+                </li>
+            </ul>
+        </li>
+        <li class="menu-item {{ request()->routeIs(['group.*', 'tabel.*']) && !request()->routeIs('tabel.data.*') ? 'active open' : '' }}">
+            <a href="javascript:void(0);" class="menu-link menu-toggle">
+                <i class="menu-icon icon-base ti tabler-database"></i><div data-i18n="Basis Data Ekosistem">Basis Data Ekosistem</div>
+            </a>
+            <ul class="menu-sub">
+                <li class="menu-item {{ request()->routeIs('group.*') ? 'active' : '' }}">
+                    <a href="{{ route('group.index') }}" class="menu-link"><div data-i18n="Kelompok">Kelompok</div></a>
+                </li>
+                <li class="menu-item {{ request()->routeIs('tabel.*') && !request()->routeIs('tabel.data.*') ? 'active' : '' }}">
+                    <a href="{{ route('tabel.index') }}" class="menu-link"><div data-i18n="Tabel">Tabel</div></a>
+                </li>
+            </ul>
+        </li>
+        @endif
+
+        <!-- Misc -->
+        <!-- <li class="menu-header small">
+            <span class="menu-header-text" data-i18n="Misc">Misc</span>
+        </li>
+        <li class="menu-item">
+            <a href="https://docs.google.com/spreadsheets/d/1nbh4xW-K_GwRW34-cD81p9B-LnLvkvro/edit?usp=sharing&ouid=103442063105125817060&rtpof=true&sd=true" target="_blank" class="menu-link">
+                <i class="menu-icon icon-base ti tabler-file-description"></i><div data-i18n="Documentation">Documentation</div>
+            </a>
+        </li> -->
+    
+    </ul>
+</aside>
+
+<div class="menu-mobile-toggler d-xl-none rounded-1">
+    <a href="javascript:void(0);" class="layout-menu-toggle menu-link text-large text-bg-secondary p-2 rounded-1">
+        <i class="ti tabler-menu icon-base"></i>
+        <i class="ti tabler-chevron-right icon-base"></i>
+    </a>
+</div>
diff --git a/resources/views/layout/sidebar_pro.blade.php b/resources/views/layout/sidebar_pro.blade.php
new file mode 100644
index 0000000..a9a3d93
--- /dev/null
+++ b/resources/views/layout/sidebar_pro.blade.php
@@ -0,0 +1,159 @@
+<aside id="layout-menu" class="layout-menu menu-vertical menu">
+    <div class="app-brand demo ">
+        <a href="{{ route('home') }}" class="app-brand-link">
+            <span class="app-brand-logo demo">
+                <span>
+                    <!-- AgroPro -->
+                    <svg width="32" height="24" viewBox="0 0 32 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+                        <path opacity="0.25" d="M16 2.5C16 2.5 5 6.5 5 15.5C5 20.5 11 23.5 16 23.5V2.5Z" fill="#28A745"/>
+                        <path opacity="0.5" d="M16 2.5C16 2.5 27 6.5 27 15.5C27 20.5 21 23.5 16 23.5V2.5Z" fill="#28A745"/>
+                        <rect x="5.5" y="5.5" width="21" height="15" rx="2.5" fill="white" stroke="#0054A6" stroke-width="1.5"/>
+                        <rect x="11" y="3.5" width="10" height="4" rx="2" fill="#0054A6"/>
+                        <circle cx="9.5" cy="10" r="1.7" fill="#28A745"/>
+                        <path d="M8.7 10L9.3 10.6L10.4 9.3" stroke="white" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/>
+                        <path d="M13 10H23" stroke="#D9E2EC" stroke-width="2" stroke-linecap="round"/>
+                        <path d="M13 10H22" stroke="#0054A6" stroke-width="2" stroke-linecap="round"/>
+                        <circle cx="9.5" cy="14" r="1.7" fill="#28A745"/>
+                        <path d="M8.7 14L9.3 14.6L10.4 13.3" stroke="white" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/>
+                        <path d="M13 14H23" stroke="#D9E2EC" stroke-width="2" stroke-linecap="round"/>
+                        <path d="M13 14H19.5" stroke="#F4B400" stroke-width="2" stroke-linecap="round"/>
+                        <circle cx="9.5" cy="18" r="1.7" fill="white" stroke="#ED1C24" stroke-width="1.3"/>
+                        <path d="M13 18H23" stroke="#D9E2EC" stroke-width="2" stroke-linecap="round"/>
+                        <path d="M13 18H17" stroke="#ED1C24" stroke-width="2" stroke-linecap="round"/>
+                    </svg>
+                </span>
+            </span>
+
+            <span class="app-brand-text demo menu-text fw-bold ms-3" style="text-transform: capitalize;">
+                {{ env('APP_NAME') }}
+            </span>
+        </a>
+
+        <a href="javascript:void(0);" class="layout-menu-toggle menu-link text-large ms-auto">
+            <i class="icon-base ti menu-toggle-icon d-none d-xl-block"></i>
+            <i class="icon-base ti tabler-x d-block d-xl-none"></i>
+        </a>
+    </div>
+
+    <div class="menu-inner-shadow"></div>
+
+    <ul class="menu-inner py-1">
+        <!-- Dashboards -->
+        
+        @canany(['fasilitator', 'super_admin', 'admin'])
+        <li class="menu-item active open">
+            <a href="javascript:void(0);" class="menu-link menu-toggle">
+                <i class="menu-icon icon-base ti tabler-smart-home"></i>
+                <div data-i18n="Dashboards">Dashboards</div>
+            </a>
+        </li>
+        @endcanany
+
+        @canany(['super_admin', 'admin'])
+        <!-- Ekosistem -->
+        <li class="menu-header small">
+            <span class="menu-header-text" data-i18n="Ekosistem">Ekosistem</span>
+        </li>
+        <li class="menu-item {{ request()->routeIs(['realisasi.*', 'kelompok-belajar-tani.*', 'workshop.*']) ? 'active open' : '' }}">
+            <a href="javascript:void(0);" class="menu-link menu-toggle">
+                <i class="menu-icon icon-base ti tabler-webhook"></i>
+                <div data-i18n="Program & Komunitas">Program & Komunitas</div>
+            </a>
+            <ul class="menu-sub">
+                <li class="menu-item {{ request()->routeIs('realisasi.*') ? 'active' : '' }}">
+                    <a href="{{ route('realisasi.index') }}" class="menu-link"><div data-i18n="Capaian Program">Capaian Program</div></a>
+                </li>
+                <li class="menu-item {{ request()->routeIs('kelompok-belajar-tani.*') ? 'active' : '' }}">
+                    <a href="{{ route('kelompok-belajar-tani.index') }}" class="menu-link"><div data-i18n="Kelompok Belajar Petani">Kelompok Belajar Petani</div></a>
+                </li>
+                <li class="menu-item {{ request()->routeIs('workshop.*') ? 'active' : '' }}">
+                    <a href="{{ route('workshop.index') }}" class="menu-link"><div data-i18n="Workshop & Lokakarya">Workshop & Lokakarya</div></a>
+                </li>
+            </ul>
+        </li>
+        @endcanany
+
+        @canany(['super_admin'])
+        <!-- Master Data -->
+        <li class="menu-header small">
+            <span class="menu-header-text" data-i18n="Master Data">Master Data</span>
+        </li>
+        <li class="menu-item">
+            <a href="javascript:void(0);" class="menu-link menu-toggle">
+                <i class="menu-icon icon-base ti tabler-world"></i>
+                <div data-i18n="Wilayah">Wilayah</div>
+            </a>
+            <ul class="menu-sub">
+                <li class="menu-item"><a href="{{ route('provinsi.index') }}" class="menu-link"><div data-i18n="Provinsi">Provinsi</div></a></li>
+                <li class="menu-item"><a href="{{ route('kabupatenkota.index') }}" class="menu-link"><div data-i18n="Kabupaten Kota">Kabupaten Kota</div></a></li>
+                <li class="menu-item"><a href="{{ route('kecamatan.index') }}" class="menu-link"><div data-i18n="Kecamatan">Kecamatan</div></a></li>
+                <li class="menu-item"><a href="{{ route('desakelurahan.index') }}" class="menu-link"><div data-i18n="Desa Kelurahan">Desa Kelurahan</div></a></li>
+            </ul>
+        </li>
+        <li class="menu-item">
+            <a href="{{ route('adat.index') }}" class="menu-link"><i class="menu-icon icon-base ti tabler-matrix"></i><div data-i18n="Adat">Adat</div></a>
+        </li>
+        <li class="menu-item">
+            <a href="{{ route('keluarga.index') }}" class="menu-link"><i class="menu-icon icon-base ti tabler-sitemap"></i><div data-i18n="Keluarga">Keluarga</div></a>
+        </li>
+        <li class="menu-item">
+            <a href="javascript:void(0);" class="menu-link menu-toggle">
+                <i class="menu-icon icon-base ti tabler-plant"></i><div data-i18n="Tanaman">Tanaman</div>
+            </a>
+            <ul class="menu-sub">
+                <li class="menu-item"><a href="{{ route('komoditas.index') }}" class="menu-link"><div data-i18n="Komoditas">Komoditas</div></a></li>
+                <li class="menu-item"><a href="{{ route('jenis-komoditas.index') }}" class="menu-link"><div data-i18n="Jenis Komoditas">Jenis Komoditas</div></a></li>
+                <li class="menu-item"><a href="{{ route('varietas.index') }}" class="menu-link"><div data-i18n="Varietas">Varietas</div></a></li>
+            </ul>
+        </li>
+        @endcanany
+
+        @canany(['super_admin', 'admin'])
+        <li class="menu-header small">
+            <span class="menu-header-text" data-i18n="Konfigurasi">Konfigurasi</span>
+        </li>
+        <li class="menu-item {{ request()->routeIs('users.*') ? 'active' : '' }}">
+            <a href="{{ route('users.index') }}" class="menu-link">
+                <i class="menu-icon icon-base ti tabler-users"></i><div data-i18n="Daftar Pengguna">Daftar Pengguna</div>
+            </a>
+        </li>
+        @endcanany
+
+        @canany(['super_admin', 'admin'])
+        <li class="menu-item {{ request()->routeIs(['program.*', 'framework.*']) ? 'active open' : '' }}">
+            <a href="javascript:void(0);" class="menu-link menu-toggle">
+                <i class="menu-icon icon-base ti tabler-transform"></i><div data-i18n="Program Transformasi">Program Transformasi</div>
+            </a>
+            <ul class="menu-sub">
+                <li class="menu-item {{ request()->routeIs('program.*') ? 'active' : '' }}">
+                    <a href="{{ route('program.index') }}" class="menu-link"><div data-i18n="Program Transformasi">Program Transformasi</div></a>
+                </li>
+                <li class="menu-item {{ request()->routeIs('framework.*') ? 'active' : '' }}">
+                    <a href="{{ route('framework.index') }}" class="menu-link"><div data-i18n="Framework">Framework</div></a>
+                </li>
+            </ul>
+        </li>
+        <li class="menu-item {{ request()->routeIs(['group.*', 'tabel.*']) && !request()->routeIs('tabel.data.*') ? 'active open' : '' }}">
+            <a href="javascript:void(0);" class="menu-link menu-toggle">
+                <i class="menu-icon icon-base ti tabler-database"></i><div data-i18n="Basis Data Ekosistem">Basis Data Ekosistem</div>
+            </a>
+            <ul class="menu-sub">
+                <li class="menu-item {{ request()->routeIs('group.*') ? 'active' : '' }}">
+                    <a href="{{ route('group.index') }}" class="menu-link"><div data-i18n="Kelompok">Kelompok</div></a>
+                </li>
+                <li class="menu-item {{ request()->routeIs('tabel.*') && !request()->routeIs('tabel.data.*') ? 'active' : '' }}">
+                    <a href="{{ route('tabel.index') }}" class="menu-link"><div data-i18n="Tabel">Tabel</div></a>
+                </li>
+            </ul>
+        </li>
+        @endcanany
+
+    </ul>
+</aside>
+
+<div class="menu-mobile-toggler d-xl-none rounded-1">
+    <a href="javascript:void(0);" class="layout-menu-toggle menu-link text-large text-bg-secondary p-2 rounded-1">
+        <i class="ti tabler-menu icon-base"></i>
+        <i class="ti tabler-chevron-right icon-base"></i>
+    </a>
+</div>
diff --git a/resources/views/program/framework/view-aktivitas.blade.php b/resources/views/program/framework/view-aktivitas.blade.php
index b8a952d..c5faea7 100644
--- a/resources/views/program/framework/view-aktivitas.blade.php
+++ b/resources/views/program/framework/view-aktivitas.blade.php
@@ -1,12 +1,21 @@
                                     @forelse($tujuan->aktivitas as $aktivitas)
+                                    @php
+                                        $aktivitasRowspan = max($aktivitas->target->count(), 1);
+
+                                        $firstAktivitasRow = true;
+                                    @endphp
                                     @forelse($aktivitas->target as $targetAktivitas)
                                     <tr>
-                                        <td><span class="text-heading">{{ $transformasi->kode }} {{ $transformasi->nama }} (ID: {{ $transformasi->id }})</span></td>
-                                        <td><span class="{{ $aktivitas->jenis_aktivitas == 'tujuan' ? 'text-heading' : 'text-muted' }}">{{ $aktivitas->kode }} {{ $aktivitas->nama }} (ID: {{ $aktivitas->id }})</span></td>
-                                        <td><span class="text-muted">{{ $aktivitas->deskripsi }}</span></td>
-                                        <td><span class="text-muted">{{ $aktivitas->indikator }}</span></td>
-                                        <td><span class="text-muted">{{ $targetAktivitas->variabel }} (ID: {{ $targetAktivitas->id }}, Tipe: {{ $targetAktivitas->tipe }}, Realiasasi: {{ $targetAktivitas->tipe_realisasi }})</span></td>
-                                        <td>
+                                        @if($firstAktivitasRow)
+                                        <td rowspan="{{ $aktivitasRowspan }}" class="align-top"><span class="{{ $aktivitas->jenis_aktivitas == 'tujuan' ? 'text-heading' : 'text-muted' }}">{{ $aktivitas->kode }} {{ $aktivitas->nama }}</span></td>
+                                        <td rowspan="{{ $aktivitasRowspan }}" class="align-top"><span class="text-muted">{{ $aktivitas->deskripsi }}</span></td>
+                                        <td rowspan="{{ $aktivitasRowspan }}" class="align-top"><span class="text-muted">{{ $aktivitas->indikator }}</span></td>
+                                            @php
+                                                $firstAktivitasRow = false;
+                                            @endphp
+                                        @endif
+                                        <td class="align-top"><span class="text-muted">{{ $targetAktivitas->variabel }}</span></td>
+                                        <td class="align-top">
                                             @if($targetAktivitas->tipe === 'integer')
                                                 <span class="text-muted">{{ $targetAktivitas->target_integer }}</span>
                                             @elseif($targetAktivitas->tipe === 'float')
@@ -15,7 +24,7 @@
                                                 <span class="text-muted">{{ $targetAktivitas->target_boolean ? 'Ya' : 'Tidak' }}</span>
                                             @endif
                                         </td>
-                                        <td>
+                                        <td class="align-top">
                                             @if($targetAktivitas->tipe === 'integer')
                                                 <span class="text-muted">{{ $targetAktivitas->baseline_integer }}</span>
                                             @elseif($targetAktivitas->tipe === 'float')
@@ -24,7 +33,7 @@
                                                 <span class="text-muted">{{ $targetAktivitas->baseline_boolean ? 'Ya' : 'Tidak' }}</span>
                                             @endif
                                         </td>
-                                        <td>
+                                        <td class="align-top">
                                             <div class="dropdown">
                                                 <button type="button" class="btn p-0 dropdown-toggle hide-arrow" data-bs-toggle="dropdown">
                                                     <i class="icon-base ti tabler-dots-vertical"></i>
@@ -44,14 +53,13 @@
                                     </tr>
                                     @empty
                                     <tr>
-                                        <td><span class="text-heading">{{ $transformasi->kode }} {{ $transformasi->nama }} (ID: {{ $transformasi->id }})</span></td>
-                                        <td><span class="{{ $aktivitas->jenis_aktivitas == 'tujuan' ? 'text-heading' : 'text-muted' }}">{{ $aktivitas->kode }} {{ $aktivitas->nama }} (ID: {{ $aktivitas->id }})</span></td>
-                                        <td><span class="text-muted">{{ $aktivitas->deskripsi }}</span></td>
-                                        <td><span class="text-muted">{{ $aktivitas->indikator }}</span></td>
-                                        <td></td>
-                                        <td></td>
-                                        <td></td>
-                                        <td>
+                                        <td class="align-top"><span class="{{ $aktivitas->jenis_aktivitas == 'tujuan' ? 'text-heading' : 'text-muted' }}">{{ $aktivitas->kode }} {{ $aktivitas->nama }}</span></td>
+                                        <td class="align-top"><span class="text-muted">{{ $aktivitas->deskripsi }}</span></td>
+                                        <td class="align-top"><span class="text-muted">{{ $aktivitas->indikator }}</span></td>
+                                        <td class="align-top"></td>
+                                        <td class="align-top"></td>
+                                        <td class="align-top"></td>
+                                        <td class="align-top">
                                             <div class="dropdown">
                                                 <button type="button" class="btn p-0 dropdown-toggle hide-arrow" data-bs-toggle="dropdown">
                                                     <i class="icon-base ti tabler-dots-vertical"></i>
diff --git a/resources/views/program/framework/view-tujuan.blade.php b/resources/views/program/framework/view-tujuan.blade.php
index 4c0f0c5..8e11971 100644
--- a/resources/views/program/framework/view-tujuan.blade.php
+++ b/resources/views/program/framework/view-tujuan.blade.php
@@ -1,12 +1,40 @@
+                                    @php
+                                        $transformasiRowspan = 0;
+
+                                        foreach ($transformasi->tujuan as $tujuan) {
+                                            $transformasiRowspan += max($tujuan->target->count(), 1);
+
+                                            foreach ($tujuan->aktivitas as $aktivitas) {
+                                                $transformasiRowspan += max($aktivitas->target->count(), 1);
+                                            }
+                                        }
+
+                                        $firstTransformasiRow = true;
+                                    @endphp
                                     @forelse($transformasi->tujuan as $tujuan)
+                                    @php
+                                        $tujuanRowspan = max($tujuan->target->count(), 1);
+
+                                        $firstTujuanRow = true;
+                                    @endphp
                                     @forelse($tujuan->target as $target)
                                     <tr>
-                                        <td><span class="text-heading">{{ $transformasi->kode }} {{ $transformasi->nama }} (ID: {{ $transformasi->id }})</span></td>
-                                        <td><span class="{{ $tujuan->jenis_aktivitas == 'tujuan' ? 'text-heading' : 'text-muted' }}">{{ $tujuan->kode }} {{ $tujuan->nama }} (ID: {{ $tujuan->id }})</span></td>
-                                        <td><span class="text-muted">{{ $tujuan->deskripsi }}</span></td>
-                                        <td><span class="text-muted">{{ $tujuan->indikator }}</span></td>
-                                        <td><span class="text-muted">{{ $target->variabel }} (ID: {{ $target->id }}, Tipe: {{ $target->tipe }}, Realiasasi: {{ $target->tipe_realisasi }})</span></td>
-                                        <td>
+                                        @if($firstTransformasiRow)
+                                        <td rowspan="{{ $transformasiRowspan }}" class="align-top">{{ $transformasi->kode }} {{ $transformasi->nama }}</td>
+                                            @php
+                                                $firstTransformasiRow = false;
+                                            @endphp
+                                        @endif
+                                        @if($firstTujuanRow)
+                                        <td rowspan="{{ $tujuanRowspan }}" class="align-top"><span class="{{ $tujuan->jenis_aktivitas == 'tujuan' ? 'text-heading' : 'text-muted' }}">{{ $tujuan->kode }} {{ $tujuan->nama }}</span></td>
+                                        <td rowspan="{{ $tujuanRowspan }}" class="align-top"><span class="text-muted">{{ $tujuan->deskripsi }}</span></td>
+                                        <td rowspan="{{ $tujuanRowspan }}" class="align-top"><span class="text-muted">{{ $tujuan->indikator }}</span></td>
+                                            @php
+                                                $firstTujuanRow = false;
+                                            @endphp
+                                        @endif
+                                        <td class="align-top"><span class="text-muted">{{ $target->variabel }}</span></td>
+                                        <td class="align-top">
                                             @if($target->tipe === 'integer')
                                                 <span class="text-muted">{{ $target->target_integer }}</span>
                                             @elseif($target->tipe === 'float')
@@ -15,7 +43,7 @@
                                                 <span class="text-muted">{{ $target->target_boolean ? 'Ya' : 'Tidak' }}</span>
                                             @endif
                                         </td>
-                                        <td>
+                                        <td class="align-top">
                                             @if($target->tipe === 'integer')
                                                 <span class="text-muted">{{ $target->baseline_integer }}</span>
                                             @elseif($target->tipe === 'float')
@@ -24,7 +52,7 @@
                                                 <span class="text-muted">{{ $target->baseline_boolean ? 'Ya' : 'Tidak' }}</span>
                                             @endif
                                         </td>
-                                        <td>
+                                        <td class="align-top"> 
                                             <div class="dropdown">
                                                 <button type="button" class="btn p-0 dropdown-toggle hide-arrow" data-bs-toggle="dropdown">
                                                     <i class="icon-base ti tabler-dots-vertical"></i>
@@ -50,14 +78,14 @@
                                     </tr>
                                     @empty
                                     <tr>
-                                        <td><span class="text-heading">{{ $transformasi->kode }} {{ $transformasi->nama }} (ID: {{ $transformasi->id }})</span></td>
-                                        <td><span class="{{ $tujuan->jenis_aktivitas == 'tujuan' ? 'text-heading' : 'text-muted' }}">{{ $tujuan->kode }} {{ $tujuan->nama }} (ID: {{ $tujuan->id }})</span></td>
-                                        <td><span class="text-muted">{{ $tujuan->deskripsi }}</span></td>
-                                        <td><span class="text-muted">{{ $tujuan->indikator }}</span></td>
-                                        <td></td>
-                                        <td></td>
-                                        <td></td>
-                                        <td>
+                                        <td class="align-top"><span class="text-heading">{{ $transformasi->kode }} {{ $transformasi->nama }}</span></td>
+                                        <td class="align-top"><span class="{{ $tujuan->jenis_aktivitas == 'tujuan' ? 'text-heading' : 'text-muted' }}">{{ $tujuan->kode }} {{ $tujuan->nama }} (ID: {{ $tujuan->id }})</span></td>
+                                        <td class="align-top"><span class="text-muted">{{ $tujuan->deskripsi }}</span></td>
+                                        <td class="align-top"><span class="text-muted">{{ $tujuan->indikator }}</span></td>
+                                        <td class="align-top"></td>
+                                        <td class="align-top"></td>
+                                        <td class="align-top"></td>
+                                        <td class="align-top">
                                             <div class="dropdown">
                                                 <button type="button" class="btn p-0 dropdown-toggle hide-arrow" data-bs-toggle="dropdown">
                                                     <i class="icon-base ti tabler-dots-vertical"></i>
@@ -84,14 +112,14 @@
                                     @include('program.framework.view-aktivitas')
                                     @empty 
                                     <tr>
-                                        <td><span class="text-heading">{{ $transformasi->kode }} {{ $transformasi->nama }}</span></td>
-                                        <td></td>
-                                        <td></td>
-                                        <td></td>
-                                        <td></td>
-                                        <td></td>
-                                        <td></td>
-                                        <td>
+                                        <td class="align-top"><span class="text-heading">{{ $transformasi->kode }} {{ $transformasi->nama }}</span></td>
+                                        <td class="align-top"></td>
+                                        <td class="align-top"></td>
+                                        <td class="align-top"></td>
+                                        <td class="align-top"></td>
+                                        <td class="align-top"></td>
+                                        <td class="align-top"></td>
+                                        <td class="align-top">
                                             <div class="dropdown">
                                                 <button type="button" class="btn p-0 dropdown-toggle hide-arrow" data-bs-toggle="dropdown">
                                                     <i class="icon-base ti tabler-dots-vertical"></i>
diff --git a/resources/views/program/framework/view.blade.php b/resources/views/program/framework/view.blade.php
index b5445a1..4397b1b 100644
--- a/resources/views/program/framework/view.blade.php
+++ b/resources/views/program/framework/view.blade.php
@@ -13,7 +13,7 @@
                 
                 <h6 class="mb-3">Informasi Kerangka Kerja</h6>
                 <div class="row">
-                    <div class="col-md-3 mb-4 form-control-validation">
+                    <div class="col-md-6 mb-4 form-control-validation">
                         <label class="form-label" for="update-framework-nama">Nama Kerangka Kerja<span class="text-danger">*</span></label>
                         <input type="text" class="form-control" id="update" name="nama" placeholder="Cth: Tabel Pertanian" value="{{ old('nama', $framework->nama) }}"  readonly/>
                     </div>
@@ -21,7 +21,9 @@
                         <label class="form-label" for="update-framework-tahun">Tahun Implementasi<span class="text-danger">*</span></label>
                         <input type="number" step="1" min="2026" class="form-control" id="update-framework-tahun" name="tahun" placeholder="Cth: 2023" value="{{ old('tahun', $framework->tahun) ?? now()->year }}" readonly/>
                     </div>
-                    <div class="col-md-6 mb-4 form-control-validation">
+                </div>
+                <div class="row">
+                    <div class="col-md-12 mb-4 form-control-validation">
                         <label class="form-label" for="update-framework-program">Untuk Program<span class="text-danger">*</span></label>
                         <input type="text" class="form-control" id="update-framework-tahun" name="tahun" placeholder="Cth: 2023" value="{{ old('program_id', $framework->program->nama) }}" readonly/>
                     </div>
@@ -41,8 +43,18 @@
                 <div class="row mb-4">
                     <div class="col-md-12 mb-4 form-control-validation">
                         
-                        <div class="table-responsive text-nowrap mb-4">
+                        <div class="table-responsive mb-4">
                             <table class="table table-hover">
+                                <colgroup>
+                                    <col style="width: 200px">
+                                    <col style="width: 300px">
+                                    <col style="width: 600px">
+                                    <col style="width: 300px">
+                                    <col style="width: 200px">
+                                    <col style="width: 25px; text-align: right">
+                                    <col style="width: 25px; text-align: right">
+                                    <col style="width: 10px'>
+                                </colgroup>
                                 <thead class="border-top">
                                     <tr>
                                         <th>Transformasi</th>