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">