diff --git a/app/BulkActions/Settings/Categories.php b/app/BulkActions/Settings/Categories.php
index ed63dd003..77afe39c0 100644
--- a/app/BulkActions/Settings/Categories.php
+++ b/app/BulkActions/Settings/Categories.php
@@ -39,6 +39,19 @@ class Categories extends BulkAction
         ],
     ];
 
+    public function getSelectedRecords($request, $relationships = null)
+    {
+        if (empty($relationships)) {
+            $model = $this->model::query();
+        } else {
+            $relationships = Arr::wrap($relationships);
+
+            $model = $this->model::with($relationships);
+        }
+
+        return $model->getWithoutChildren()->find($this->getSelectedInput($request));
+    }
+
     public function disable($request)
     {
         $categories = $this->getSelectedRecords($request);
diff --git a/app/Http/Livewire/Menu/Notifications.php b/app/Http/Livewire/Menu/Notifications.php
index 6b11c30dc..12b1df15b 100644
--- a/app/Http/Livewire/Menu/Notifications.php
+++ b/app/Http/Livewire/Menu/Notifications.php
@@ -91,7 +91,7 @@ class Notifications extends Component
     public function getNotifications(): array
     {
         $notifications = new \stdClass();
-        $notifications->notifications = [];
+        $notifications->notifications = collect();
         $notifications->keyword = $this->keyword;
 
         event(new NotificationsCreated($notifications));
diff --git a/app/Models/Common/Item.php b/app/Models/Common/Item.php
index 2599e5e33..77091aac6 100644
--- a/app/Models/Common/Item.php
+++ b/app/Models/Common/Item.php
@@ -4,6 +4,7 @@ namespace App\Models\Common;
 
 use App\Abstracts\Model;
 use App\Models\Document\Document;
+use App\Utilities\Str;
 use App\Traits\Currencies;
 use App\Traits\Media;
 use Bkwld\Cloner\Cloneable;
@@ -138,6 +139,11 @@ class Item extends Model
             ->select('items.*');
     }
 
+    public function getInitialsAttribute($value)
+    {
+        return Str::getInitials($this->name);
+    }
+
     /**
      * Get the current balance.
      *
diff --git a/app/View/Components/Layouts/Admin/Menu.php b/app/View/Components/Layouts/Admin/Menu.php
index ff4a91b49..97c4ba382 100644
--- a/app/View/Components/Layouts/Admin/Menu.php
+++ b/app/View/Components/Layouts/Admin/Menu.php
@@ -41,7 +41,7 @@ class Menu extends Component
     {
         // Get nofitications
         $notifications = new \stdClass();
-        $notifications->notifications = [];
+        $notifications->notifications = collect();
         $notifications->keyword = '';
 
         event(new NotificationsCreated($notifications));
diff --git a/resources/assets/js/components/AkauntingSearch.vue b/resources/assets/js/components/AkauntingSearch.vue
index 2c27fe295..ebf00d8bd 100644
--- a/resources/assets/js/components/AkauntingSearch.vue
+++ b/resources/assets/js/components/AkauntingSearch.vue
@@ -385,12 +385,11 @@ export default {
         },
 
         onOptionSelected(value) {
-            this.show_icon = false;
             this.current_value = value;
             this.range = false;
-            
-            this.dynamicPlaceholder = this.selectPlaceholder;
 
+            this.onChangeSearchAndFilterText(this.selectPlaceholder, false);
+            
             let option = false;
             let option_url = false;
 
@@ -522,7 +521,7 @@ export default {
             this.show_close_icon = true;
             let select_value = false;
 
-            this.dynamicPlaceholder = this.enterPlaceholder;
+            this.onChangeSearchAndFilterText(this.enterPlaceholder, false);
 
             for (let i = 0; i < this.values.length; i++) {
                 if (this.values[i].key == value) {
@@ -582,7 +581,7 @@ export default {
             this.show_date = false;
             
             if (this.filter_index == 0) {
-                this.dynamicPlaceholder = this.defaultPlaceholder;
+                this.onChangeSearchAndFilterText(this.defaultPlaceholder, true);
             }
 
             this.filter_last_step = 'options';
@@ -597,6 +596,11 @@ export default {
             this.onInputConfirm();
         },
 
+        onChangeSearchAndFilterText(arg, param) {
+            this.dynamicPlaceholder = arg;
+            this.show_icon = param;
+        },
+
         convertOption(options) {
             let values = [];
 
@@ -765,6 +769,9 @@ export default {
     },
 
     mounted() {
+        if (this.filter_index > 0) {
+            this.onChangeSearchAndFilterText(this.enterPlaceholder, false);
+        }
     },
 
     computed: {
diff --git a/resources/assets/js/components/CreditCard/CardForm.vue b/resources/assets/js/components/CreditCard/CardForm.vue
index fc9ab38ef..ca079669e 100644
--- a/resources/assets/js/components/CreditCard/CardForm.vue
+++ b/resources/assets/js/components/CreditCard/CardForm.vue
@@ -260,7 +260,7 @@
                                 v-for="n in 12"
                                 v-bind:disabled="n < minCardMonth"
                                 v-bind:key="n"
-                            >{{generateMonthValue(n)}}</option>
+                            >{{ generateMonthValue(n) }}</option>
                         </select>
                     </div>
                 </div>
@@ -278,7 +278,7 @@
                             v-bind:value="$index + minCardYear"
                             v-for="(n, $index) in 12"
                             v-bind:key="n"
-                        >{{$index + minCardYear}}</option>
+                        >{{ $index + minCardYear }}</option>
                     </select>
                 </div>
 
@@ -312,7 +312,7 @@
                         </label>
                     </div>
 
-                    <button class="relative flex items-center justify-center px-6 py-1.5 bg-green hover:bg-green-700 text-white rounded-lg" v-on:click="invaildCard" :disabled="loading">
+                    <button v-if="! hideButton" class="relative flex items-center justify-center px-6 py-1.5 bg-green hover:bg-green-700 text-white rounded-lg" v-on:click="invaildCard" :disabled="loading">
                         <i
                             v-if="loading"
                             class="animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto before:absolute before:w-2 before:h-2 before:rounded-full before:animate-submit before:delay-[0.14s] after:absolute after:w-2 after:h-2 after:rounded-full after:animate-submit before:-left-3.5 after:-right-3.5 after:delay-[0.42s]"
@@ -371,7 +371,9 @@ export default {
     props: {
         cards: {
             type: [Array, Object],
-            default: [],
+            default: function () {
+                return [];
+            },
             description: "Add Card Style"
         },
 
@@ -454,6 +456,12 @@ export default {
             description: "Placeholder Card CVV Text"
         },
 
+        hideButton: {
+            type: Boolean,
+            default: false,
+            description: "Confirm button"
+        },
+
         textButton: {
             type: String,
             default: 'Confirm',
@@ -554,7 +562,6 @@ export default {
             this.register_card = null;
         },
 
-
         onSelectedCard(card_id) {
             this.card_id = card_id;
             this.formData.card_id = card_id;
@@ -623,7 +630,8 @@ export default {
 
             this.unMaskCardNumber();
 
-            /*for (let i = number.length - 1; i >= 0; i--) {
+            /*
+            for (let i = number.length - 1; i >= 0; i--) {
                 let num = number.charAt(i);
 
                 if (isOdd) {
@@ -639,7 +647,8 @@ export default {
                 }
 
                 isOdd = !isOdd;
-            }*/
+            }
+            */
 
             this.formData.card_id = this.card_id;
 
diff --git a/resources/assets/js/mixins/global.js b/resources/assets/js/mixins/global.js
index 6d7a29814..6a6d1e46f 100644
--- a/resources/assets/js/mixins/global.js
+++ b/resources/assets/js/mixins/global.js
@@ -24,6 +24,7 @@ import AkauntingConnectTransactions from './../components/AkauntingConnectTransa
 import AkauntingSwitch from './../components/AkauntingSwitch';
 import AkauntingSlider from './../components/AkauntingSlider';
 import AkauntingColor from './../components/AkauntingColor';
+import CardForm from './../components/CreditCard/CardForm';
 
 import NProgress from 'nprogress';
 import 'nprogress/nprogress.css';
@@ -61,6 +62,7 @@ export default {
         AkauntingSwitch,
         AkauntingSlider,
         AkauntingColor,
+        CardForm,
         [Select.name]: Select,
         [Option.name]: Option,
         [Steps.name]: Steps,
@@ -91,6 +93,16 @@ export default {
                 currency: {},
                 documents: [],
             },
+
+            cardData: {
+                cardName: '',
+                cardNumber: '',
+                cardMonth: '',
+                cardYear: '',
+                cardCvv: '',
+                storeCard: false,
+                card_id: 0,
+            },
         }
     },
 
diff --git a/resources/lang/en-GB/transactions.php b/resources/lang/en-GB/transactions.php
index a1dbd1b07..6a45cfa8d 100644
--- a/resources/lang/en-GB/transactions.php
+++ b/resources/lang/en-GB/transactions.php
@@ -15,7 +15,7 @@ return [
         'general'           => 'Here you can enter the general information of transaction such as date, amount, account, description, etc.',
         'assign_income'     => 'Select a category and customer to make your reports more detailed.',
         'assign_expense'    => 'Select a category and vendor to make your reports more detailed.',
-        'other'             => 'Enter a reference to keep the transaction linked to your records.',
+        'other'             => 'Enter a number and reference to keep the transaction linked to your records.',
     ],
 
     'slider' => [
diff --git a/resources/views/components/documents/form/items.blade.php b/resources/views/components/documents/form/items.blade.php
index 9df614518..00f6497a1 100644
--- a/resources/views/components/documents/form/items.blade.php
+++ b/resources/views/components/documents/form/items.blade.php
@@ -77,7 +77,7 @@
 
                         @stack('remove_th_start')
 
-                        <th class="border-t-0 border-r-0 border-b-0" style="vertical-align:bottom;">
+                        <th class="border-t-0 border-r-0 border-b-0 align-bottom" style="width:24px; display:block;">
                             <div></div>
                         </th>
 
diff --git a/resources/views/components/index/bulkaction/index.blade.php b/resources/views/components/index/bulkaction/index.blade.php
index c4544fee6..9ea8f8261 100644
--- a/resources/views/components/index/bulkaction/index.blade.php
+++ b/resources/views/components/index/bulkaction/index.blade.php
@@ -22,20 +22,20 @@
         <div class="relative flex items-center ltr:mr-4 rtl:ml-4" v-if="bulk_action.count">
             @foreach ($actions as $key => $action)
                 @if (! empty($action['icon']))
-                <div>
-                    <x-tooltip id="{{ $key }}" placement="top" message="{{ trans($action['name']) }}">
-                        <x-button @click="onChangeBulkAction('{{ $key }}')"
-                            id="button-bulk-action-{{ $key }}"
-                            class="relative w-8 h-8 flex items-center px-2 mr-2 rounded-lg hover:bg-gray-200"
-                            override="class"
-                            data-message="{{ ! empty($action['message']) ? trans_choice($action['message'], 2, ['type' => strtolower(trans_choice($text, 2))]) : '' }}"
-                            data-path="{{ (isset($path) && ! empty($path)) ? $path : '' }}"
-                            data-type="{{ (isset($action['type']) && ! empty($action['type'])) ? $action['type'] : '' }}"
-                        >
-                            <x-icon class="text-lg" :icon="$action['icon']" />
-                        </x-button>
-                    </x-tooltip>
-                </div>
+                    <div>
+                        <x-tooltip id="{{ $key }}" placement="top" message="{{ trans($action['name']) }}">
+                            <x-button @click="onChangeBulkAction('{{ $key }}')"
+                                id="button-bulk-action-{{ $key }}"
+                                class="relative w-8 h-8 flex items-center px-2 mr-2 rounded-lg hover:bg-gray-200"
+                                override="class"
+                                data-message="{{ ! empty($action['message']) ? trans_choice($action['message'], 2, ['type' => strtolower(trans_choice($text, 2))]) : '' }}"
+                                data-path="{{ (isset($path) && ! empty($path)) ? $path : '' }}"
+                                data-type="{{ (isset($action['type']) && ! empty($action['type'])) ? $action['type'] : '' }}"
+                            >
+                                <x-icon class="text-lg" :icon="$action['icon']" />
+                            </x-button>
+                        </x-tooltip>
+                    </div>
                 @else
                     <div>
                         <x-tooltip id="{{ $key }}" placement="top" message="{{ trans($action['name']) }}">
diff --git a/resources/views/components/payment_method/hosted.blade.php b/resources/views/components/payment_method/hosted.blade.php
index c95c732e2..938e2a90b 100644
--- a/resources/views/components/payment_method/hosted.blade.php
+++ b/resources/views/components/payment_method/hosted.blade.php
@@ -12,7 +12,7 @@
     textButton="{{ trans('general.confirm') }}"
     textCard="{{ trans_choice('general.card.cards', 2) }}"
     textNewCard="{{  trans('general.form.add_new', ['field' => trans_choice('general.card.cards', 1)]) }}"
-    textStoreCard="{{ trans('general.card.save') }} "
+    textStoreCard="{{ trans('general.card.save') }}"
     :store-card="{{ !empty($store_card) ? 'true' : 'false' }}"
     :cards="{{ !empty($cards) ? json_encode($cards) : json_encode([]) }}"
     :form-data="formData"
diff --git a/resources/views/components/tabs/nav-link.blade.php b/resources/views/components/tabs/nav-link.blade.php
index b8393a500..3c205becf 100644
--- a/resources/views/components/tabs/nav-link.blade.php
+++ b/resources/views/components/tabs/nav-link.blade.php
@@ -8,6 +8,7 @@
     data-id="tab-{{ $id }}"
     data-tabs="{{ $id }}"
     x-bind:class="active != '{{ $id }}' ? '' : 'active-tabs text-purple border-purple transition-all after:absolute after:w-full after:h-0.5 after:left-0 after:right-0 after:bottom-0 after:bg-purple after:rounded-tl-md after:rounded-tr-md'"
+    {{ $attributes }}
 >
     @if ($slot->isNotEmpty())
         {!! $slot !!}
diff --git a/resources/views/components/tabs/nav.blade.php b/resources/views/components/tabs/nav.blade.php
index 619bdb7dc..d9e55dee3 100644
--- a/resources/views/components/tabs/nav.blade.php
+++ b/resources/views/components/tabs/nav.blade.php
@@ -9,6 +9,7 @@
     data-tabs="{{ $id }}"
     x-on:click="active = '{{ $id }}'"
     x-bind:class="active != '{{ $id }}' ? '' : 'active-tabs text-purple border-purple transition-all after:absolute after:w-full after:h-0.5 after:left-0 after:right-0 after:bottom-0 after:bg-purple after:rounded-tl-md after:rounded-tr-md'"
+    {{ $attributes }}
 >
     @if ($slot->isNotEmpty())
         {!! $slot !!}
diff --git a/resources/views/components/tabs/tab.blade.php b/resources/views/components/tabs/tab.blade.php
index 7038b70aa..4427fd2e0 100644
--- a/resources/views/components/tabs/tab.blade.php
+++ b/resources/views/components/tabs/tab.blade.php
@@ -1,5 +1,10 @@
 @props(['id'])
 
-<div id="tab-{{ $id }}" data-tabs-content="{{ $id }}" x-show="active === '{{ $id }}'">
+<div
+    id="tab-{{ $id }}"
+    data-tabs-content="{{ $id }}"
+    x-show="active === '{{ $id }}'"
+    {{ $attributes }}
+>
     {{ $slot }}
 </div>
diff --git a/resources/views/portal/invoices/show.blade.php b/resources/views/portal/invoices/show.blade.php
index 0c554bd8e..27e738642 100644
--- a/resources/views/portal/invoices/show.blade.php
+++ b/resources/views/portal/invoices/show.blade.php
@@ -24,33 +24,37 @@
                     <div class="tabs w-full" x-data="{ active: '{{ reset($payment_methods) }}' }">
                         <div role="tablist" class="flex flex-wrap gap-y-4">
                             @php $is_active = true; @endphp
-                            
+
                             <div class="swiper swiper-links">
                                 <div class="swiper-wrapper">
-                            @foreach ($payment_methods as $key => $name)
-                                @stack('invoice_{{ $key }}_tab_start')
-                                <div class="swiper-slide">
-                                    <div
-                                    x-on:click="active = '{{ $name }}'"
-                                    @click="onChangePaymentMethod('{{ $key }}')"
-                                    id="tabs-payment-method-{{ $key }}-tab"
-                                    x-bind:class="active != '{{ $name }}' ? '' : 'active-tabs text-purple border-purple transition-all after:absolute after:w-full after:h-0.5 after:left-0 after:right-0 after:bottom-0 after:bg-purple after:rounded-tl-md after:rounded-tr-md'"
-                                    class="text-sm text-black text-center pb-2 border-b cursor-pointer transition-all tabs-link"
-                                >
-                                    {{ $name }}
-                                </div>
-                                </div>
-                                @stack('invoice_{{ $key }}_tab_end')
+                                    @foreach ($payment_methods as $key => $name)
+                                        @stack('invoice_{{ $key }}_tab_start')
 
-                                @php $is_active = false; @endphp
-                            @endforeach
+                                        <div class="swiper-slide">
+                                            <div
+                                                x-on:click="active = '{{ $name }}'"
+                                                @click="onChangePaymentMethod('{{ $key }}')"
+                                                id="tabs-payment-method-{{ $key }}-tab"
+                                                x-bind:class="active != '{{ $name }}' ? '' : 'active-tabs text-purple border-purple transition-all after:absolute after:w-full after:h-0.5 after:left-0 after:right-0 after:bottom-0 after:bg-purple after:rounded-tl-md after:rounded-tr-md'"
+                                                class="text-sm text-black text-center pb-2 border-b cursor-pointer transition-all tabs-link"
+                                            >
+                                                {{ $name }}
+                                            </div>
+                                        </div>
+
+                                        @stack('invoice_{{ $key }}_tab_end')
+
+                                        @php $is_active = false; @endphp
+                                    @endforeach
                                 </div>
                             </div>
                         </div>
+
                         @php $is_active = true; @endphp
 
                         @foreach ($payment_methods as $key => $name)
                             @stack('invoice_{{ $key }}_content_start')
+
                             <div
                                 x-bind:class="active != '{{ $name }}' ? 'hidden': 'block'"
                                 class="my-3"
@@ -58,6 +62,7 @@
                             >
                                 <component v-bind:is="method_show_html" @interface="onRedirectConfirm"></component>
                             </div>
+
                             @stack('invoice_{{ $key }}_content_end')
 
                             @php $is_active = false; @endphp
diff --git a/resources/views/settings/categories/index.blade.php b/resources/views/settings/categories/index.blade.php
index 614e466bf..b280bd9e1 100644
--- a/resources/views/settings/categories/index.blade.php
+++ b/resources/views/settings/categories/index.blade.php
@@ -64,51 +64,58 @@
                 </x-table.thead>
 
                 <x-table.tbody>
-                    @foreach($categories as $category)
-                        <x-table.tr href="{{ route('categories.edit', $category->id) }}" class="relative flex items-center border-b hover:bg-gray-100 px-1 group transition-all">
+                    @foreach($categories as $item)
+                        <x-table.tr href="{{ route('categories.edit', $item->id) }}" class="relative flex items-center border-b hover:bg-gray-100 px-1 group transition-all">
                             <x-table.td class="ltr:pr-6 rtl:pl-6 hidden sm:table-cell" override="class">
-                                <x-index.bulkaction.single id="{{ $category->id }}" name="{{ $category->name }}" />
+                                <x-index.bulkaction.single id="{{ $item->id }}" name="{{ $item->name }}" />
                             </x-table.td>
 
                             <x-table.td class="w-5/12 truncate">
-                                @if ($category->sub_categories->count())
+                                @if ($item->sub_categories->count())
                                     <div class="flex items-center font-bold">
-                                        {{ $category->name }}
-                                        <x-tooltip id="tooltip-category-{{ $category->id }}" placement="bottom" message="{{ trans('categories.collapse') }}">
+                                        {{ $item->name }}
+
+                                        <x-tooltip id="tooltip-category-{{ $item->id }}" placement="bottom" message="{{ trans('categories.collapse') }}">
                                             <button
                                                 type="button"
                                                 class="w-4 h-4 flex items-center justify-center mx-2 leading-none align-text-top rounded-lg bg-gray-500 hover:bg-gray-700"
-                                                node="child-{{ $category->id }}"
-                                                onClick="toggleSub('child-{{ $category->id }}', event)"
+                                                node="child-{{ $item->id }}"
+                                                onClick="toggleSub('child-{{ $item->id }}', event)"
                                             >
                                                 <span class="material-icons transform rotate-90 transition-all text-lg leading-none align-middle text-white">chevron_right</span>
                                             </button>
                                         </x-tooltip>
                                     </div>
                                 @else
-                                    <span class="font-bold">{{ $category->name }}</span>
+                                    <span class="font-bold">
+                                        {{ $item->name }}
+                                    </span>
+                                @endif
+
+                                @if (! $item->enabled)
+                                    <x-index.disable text="{{ trans_choice('general.categories', 1) }}" />
                                 @endif
                             </x-table.td>
 
                             <x-table.td class="w-5/12 truncate">
-                                @if (! empty($types[$category->type]))
-                                    {{ $types[$category->type] }}
+                                @if (! empty($types[$item->type]))
+                                    {{ $types[$item->type] }}
                                 @else
                                     <x-empty-data />
                                 @endif
                             </x-table.td>
 
                             <x-table.td class="w-2/12 relative">
-                                <span class="material-icons text-{{ $category->color }}" class="text-3xl" style="color:{{ $category->color }};">circle</span>
+                                <span class="material-icons text-{{ $item->color }}" class="text-3xl" style="color:{{ $item->color }};">circle</span>
                             </x-table.td>
 
                             <x-table.td kind="action">
-                                <x-table.actions :model="$category" />
+                                <x-table.actions :model="$item" />
                             </x-table.td>
                         </x-table.tr>
 
-                        @foreach($category->sub_categories as $sub_category)
-                            @include('settings.categories.sub_category', ['parent_category' => $category, 'sub_category' => $sub_category, 'tree_level' => 1])
+                        @foreach($item->sub_categories as $sub_category)
+                            @include('settings.categories.sub_category', ['parent_category' => $item, 'sub_category' => $sub_category, 'tree_level' => 1])
                         @endforeach
                     @endforeach
                 </x-table.tbody>
diff --git a/resources/views/settings/categories/sub_category.blade.php b/resources/views/settings/categories/sub_category.blade.php
index be9afa002..4523c724e 100644
--- a/resources/views/settings/categories/sub_category.blade.php
+++ b/resources/views/settings/categories/sub_category.blade.php
@@ -28,18 +28,22 @@
                     {{ $sub_category->name }}
                 </div>
             @endif
+
+            @if (! $sub_category->enabled)
+                <x-index.disable text="{{ trans_choice('general.categories', 1) }}" />
+            @endif
         </x-table.td>
 
         <x-table.td class="w-5/12 ltr:pr-6 rtl:pl-6 py-4 ltr:text-left rtl:text-right whitespace-nowrap text-sm font-normal text-black cursor-pointer truncate">
-            @if (! empty($types[$category->type]))
-                {{ $types[$category->type] }}
+            @if (! empty($types[$item->type]))
+                {{ $types[$item->type] }}
             @else
                 <x-empty-data />
             @endif
         </x-table.td>
 
         <x-table.td class="ltr:pr-6 rtl:pl-6 py-4 ltr:text-left rtl:text-right whitespace-nowrap text-sm font-normal text-black cursor-pointer w-2/12 relative">
-            <span class="material-icons text-3xl text-{{ $category->color }}" style="color:{{ $sub_category->color }};">circle</span>
+            <span class="material-icons text-3xl text-{{ $item->color }}" style="color:{{ $sub_category->color }};">circle</span>
         </x-table.td>
 
         <x-table.td kind="action">