diff --git a/public/akaunting-js/generalAction.js b/public/akaunting-js/generalAction.js
index d3580a8ed..c6b29a79a 100644
--- a/public/akaunting-js/generalAction.js
+++ b/public/akaunting-js/generalAction.js
@@ -54,15 +54,17 @@ document.querySelectorAll("[data-table-body]").forEach((table) => {
 
     if (document.body.clientWidth <= 768) {
         table.querySelectorAll('[data-table-list]').forEach((actions) => {
-            actions.querySelector('[data-mobile-actions]').addEventListener('click', function() {
-                this.closest('td').querySelector('[data-mobile-actions-modal]').classList.add('show');
-                this.closest('td').querySelector('[data-mobile-actions-modal]').classList.remove('opacity-0', 'invisible');
-      
-                this.closest('td').querySelector('[data-mobile-actions-modal]').addEventListener('click', function() {
-                    this.classList.add('opacity-0', 'invisible');
-                    this.classList.remove('show');
+            if (actions.querySelector('[data-mobile-actions]')) {
+                actions.querySelector('[data-mobile-actions]').addEventListener('click', function() {
+                    this.closest('td').querySelector('[data-mobile-actions-modal]').classList.add('show');
+                    this.closest('td').querySelector('[data-mobile-actions-modal]').classList.remove('opacity-0', 'invisible');
+          
+                    this.closest('td').querySelector('[data-mobile-actions-modal]').addEventListener('click', function() {
+                        this.classList.add('opacity-0', 'invisible');
+                        this.classList.remove('show');
+                    });
                 });
-            });
+            }
         });
     }
 });
@@ -451,7 +453,7 @@ document.querySelectorAll('[data-truncate-marquee]').forEach((truncate) => {
 
 //disable/enable icons ejected from data-truncate-marquee, HTML of icons ejected from parent element (data-truncate-marquee)
 document.querySelectorAll('[data-index-icon]').forEach((defaultText) => {
-    if (defaultText.closest('tr')) {
+    if (defaultText.closest('[data-table-list]')) {
         let icon_parents_element = defaultText.parentElement.parentElement.parentElement;
     
         if (icon_parents_element.classList.contains('flex')) {
diff --git a/resources/assets/js/components/AkauntingConnectTransactions.vue b/resources/assets/js/components/AkauntingConnectTransactions.vue
index 0978c75a8..c0d4df1b1 100644
--- a/resources/assets/js/components/AkauntingConnectTransactions.vue
+++ b/resources/assets/js/components/AkauntingConnectTransactions.vue
@@ -8,8 +8,8 @@
             :aria-hidden="!show">
             <div class="w-full my-10 m-auto flex flex-col" :class="modalDialogClass ? modalDialogClass : 'max-w-screen-sm'">
                 <slot name="modal-content">
-                    <div class="modal-content">
-                        <div class="p-5 bg-body rounded-tl-lg rounded-tr-lg">
+                    <div class="bg-body rounded-lg modal-content">
+                        <div class="p-5">
                             <div class="flex items-center justify-between border-b pb-5">
                                 <slot name="card-header">
                                     <h4 class="text-base font-medium">
@@ -24,7 +24,7 @@
                         </div>
 
                         <slot name="modal-body">
-                            <div class="px-5 bg-body">
+                            <div class="px-5">
                                 <template v-if="transaction">
                                     <div class="flex flex-col items-start gap-y-3">
                                         <div class="text-left text-sm">
@@ -247,7 +247,7 @@
                             </div>
                         </slot>
 
-                        <div class="p-5 bg-body rounded-bl-lg rounded-br-lg border-gray-300">
+                        <div class="p-5 border-gray-300">
                             <slot name="card-footer">
                                 <div class="flex items-center justify-end">
                                     <button type="button" class="px-6 py-1.5 mr-2 hover:bg-gray-200 rounded-lg" @click="onCancel">
diff --git a/resources/assets/js/components/AkauntingModal.vue b/resources/assets/js/components/AkauntingModal.vue
index bcd5b1085..ef056234c 100644
--- a/resources/assets/js/components/AkauntingModal.vue
+++ b/resources/assets/js/components/AkauntingModal.vue
@@ -10,8 +10,8 @@
             :aria-hidden="!show">
             <div class="w-full my-10 m-auto flex flex-col px-2 sm:px-0" :class="modalDialogClass ? modalDialogClass : 'max-w-md'">
                 <slot name="modal-content">
-                    <div class="modal-content">
-                        <div class="p-5 bg-body rounded-tl-lg rounded-tr-lg">
+                    <div class="bg-body rounded-lg modal-content">
+                        <div class="p-5">
                             <div class="flex items-center justify-between border-b pb-5">
                                 <slot name="card-header">
                                     <h4 class="text-base font-medium">
@@ -26,10 +26,10 @@
                         </div>
 
                         <slot name="modal-body">
-                            <div class="py-1 px-5 bg-body" v-html="message"></div>
+                            <div class="py-1 px-5" v-html="message"></div>
                         </slot>
 
-                        <div class="p-5 bg-body rounded-bl-lg rounded-br-lg border-gray-300">
+                        <div class="p-5 border-gray-300">
                             <slot name="card-footer">
                                 <div class="flex items-center justify-end">
                                     <button type="button" class="px-6 py-1.5 ltr:mr-2 rtl:ml-2 hover:bg-gray-200 rounded-lg" @click="onCancel">
diff --git a/resources/assets/js/components/AkauntingModalAddNew.vue b/resources/assets/js/components/AkauntingModalAddNew.vue
index ff6a23706..d24cd8c27 100644
--- a/resources/assets/js/components/AkauntingModalAddNew.vue
+++ b/resources/assets/js/components/AkauntingModalAddNew.vue
@@ -10,8 +10,8 @@
             :aria-hidden="!show">
             <div class="w-full my-10 m-auto flex flex-col px-2 sm:px-0" :class="modalDialogClass ? modalDialogClass : 'max-w-md'">
                 <slot name="modal-content">
-                    <div class="modal-content">
-                        <div class="p-5 bg-body rounded-tl-lg rounded-tr-lg">
+                    <div class="bg-body rounded-lg modal-content">
+                        <div class="p-5">
                             <div class="flex items-center justify-between border-b pb-5">
                                 <slot name="card-header">
                                     <h4 class="text-base font-medium">
@@ -26,15 +26,15 @@
                         </div>
 
                         <slot name="modal-body">
-                            <div class="py-1 px-5 bg-body" v-if="!is_component" v-html="message"></div>
-                            <div class="py-1 px-5 bg-body" v-else>
+                            <div class="py-1 px-5" v-if="!is_component" v-html="message"></div>
+                            <div class="py-1 px-5" v-else>
                                 <form id="form-create" method="POST" action="#"/>
 
                                 <component v-bind:is="component"></component>
                             </div>
                         </slot>
 
-                        <div class="p-5 bg-body rounded-bl-lg rounded-br-lg border-gray-300">
+                        <div class="p-5 border-gray-300">
                             <slot name="card-footer">
                                 <div class="flex items-center justify-end">
                                     <button type="button" class="px-6 py-1.5 mr-2 hover:bg-gray-200 rounded-lg" :class="buttons.cancel.class" @click="onCancel">