diff --git a/app/components/app/encounter/history-button-menu.vue b/app/components/app/encounter/history-button-menu.vue
index 9d6f3726..d503e392 100644
--- a/app/components/app/encounter/history-button-menu.vue
+++ b/app/components/app/encounter/history-button-menu.vue
@@ -54,9 +54,9 @@ const itemsOne: ButtonItems[] = [
   },
   {
     label: 'I-Care BPJS',
-    icon: 'i-lucide-file',
+    icon: '/bpjs.png',
     value: 'bpjs',
-    type: 'icon',
+    type: 'image',
   },
   {
     label: 'Fil SEP',
@@ -96,15 +96,16 @@ function handleClick(value: string) {
       :class="[
         'flex items-center gap-2 rounded-lg border px-3 py-1 text-sm font-medium transition-colors',
         activeMenu === item.value
-          ? 'border-orange-500 bg-orange-500 text-white'
+          ? 'border-orange-300 bg-orange-400 text-white'
           : 'border-orange-300 bg-white text-orange-500 hover:bg-orange-400 hover:text-white'
       ]"
       @click="handleClick(item.value)"
     >
-      <Icon
+      <Icon v-if="item.type === 'icon'"
         :name="item.icon"
         class="h-4 w-4"
       />
+      <img v-else-if="item.type === 'image'" :src="item.icon" class="h-[24px] w-[24px] object-contain" />
       {{ item.label }}
     </Button>
   </div>
@@ -116,7 +117,7 @@ function handleClick(value: string) {
       :class="[
         'flex items-center gap-2 rounded-lg border px-3 py-1 text-sm font-medium transition-colors',
         activeMenu === item.value
-          ? 'border-orange-500 bg-orange-500 text-white'
+          ? 'border-orange-300 bg-orange-400 text-white'
           : 'border-orange-300 bg-white text-orange-500 hover:bg-orange-400 hover:text-white'
       ]"
       @click="handleClick(item.value)"
diff --git a/app/pages/(features)/emergency/encounter/[id]/process.vue b/app/pages/(features)/emergency/encounter/[id]/process.vue
new file mode 100644
index 00000000..78d7ad9a
--- /dev/null
+++ b/app/pages/(features)/emergency/encounter/[id]/process.vue
@@ -0,0 +1,44 @@
+<script setup lang="ts">
+import type { PagePermission } from '~/models/role'
+import Error from '~/components/pub/my-ui/error/error.vue'
+import { PAGE_PERMISSIONS } from '~/lib/page-permission'
+
+definePageMeta({
+  middleware: ['rbac'],
+  roles: ['doctor', 'nurse', 'admisi', 'pharmacy', 'billing', 'management'],
+  title: 'Kunjungan',
+  contentFrame: 'cf-full-width',
+})
+
+const route = useRoute()
+
+useHead({
+  title: () => `${route.meta.title}`, // backtick to avoid the ts-plugin(2322) warning
+})
+
+const roleAccess: PagePermission = PAGE_PERMISSIONS['/emergency/encounter']
+
+const { checkRole, hasCreateAccess } = useRBAC()
+
+// Check if user has access to this page
+const hasAccess = checkRole(roleAccess)
+if (!hasAccess) {
+  throw createError({
+    statusCode: 403,
+    statusMessage: 'Access denied',
+  })
+}
+
+// Define permission-based computed properties
+const canCreate = hasCreateAccess(roleAccess)
+</script>
+
+<template>
+  <div v-if="canCreate">
+    <ContentEncounterHome display="menu" class-code="emergency" sub-class-code="emg" />
+  </div>
+  <Error
+    v-else
+    :status-code="403"
+  />
+</template>
diff --git a/app/pages/(features)/inpatient/encounter/[id]/process.vue b/app/pages/(features)/inpatient/encounter/[id]/process.vue
new file mode 100644
index 00000000..15367e44
--- /dev/null
+++ b/app/pages/(features)/inpatient/encounter/[id]/process.vue
@@ -0,0 +1,44 @@
+<script setup lang="ts">
+import type { PagePermission } from '~/models/role'
+import Error from '~/components/pub/my-ui/error/error.vue'
+import { PAGE_PERMISSIONS } from '~/lib/page-permission'
+
+definePageMeta({
+  middleware: ['rbac'],
+  roles: ['doctor', 'nurse', 'admisi', 'pharmacy', 'billing', 'management'],
+  title: 'Kunjungan',
+  contentFrame: 'cf-full-width',
+})
+
+const route = useRoute()
+
+useHead({
+  title: () => `${route.meta.title}`, // backtick to avoid the ts-plugin(2322) warning
+})
+
+const roleAccess: PagePermission = PAGE_PERMISSIONS['/inpatient/encounter']
+
+const { checkRole, hasCreateAccess } = useRBAC()
+
+// Check if user has access to this page
+const hasAccess = checkRole(roleAccess)
+if (!hasAccess) {
+  throw createError({
+    statusCode: 403,
+    statusMessage: 'Access denied',
+  })
+}
+
+// Define permission-based computed properties
+const canCreate = hasCreateAccess(roleAccess)
+</script>
+
+<template>
+  <div v-if="canCreate">
+    <ContentEncounterHome display="menu" class-code="inpatient" sub-class-code="vk" />
+  </div>
+  <Error
+    v-else
+    :status-code="403"
+  />
+</template>
diff --git a/app/pages/(features)/outpatient/encounter/[id]/process.vue b/app/pages/(features)/outpatient/encounter/[id]/process.vue
index c268543a..0b048ec5 100644
--- a/app/pages/(features)/outpatient/encounter/[id]/process.vue
+++ b/app/pages/(features)/outpatient/encounter/[id]/process.vue
@@ -6,7 +6,7 @@ import { PAGE_PERMISSIONS } from '~/lib/page-permission'
 definePageMeta({
   middleware: ['rbac'],
   roles: ['doctor', 'nurse', 'admisi', 'pharmacy', 'billing', 'management'],
-  title: 'Tambah Kunjungan',
+  title: 'Kunjungan',
   contentFrame: 'cf-full-width',
 })
 
diff --git a/public/bpjs.png b/public/bpjs.png
index 6ed2a90c..781e19b0 100644
Binary files a/public/bpjs.png and b/public/bpjs.png differ