diff --git a/public/css/custom.css b/public/css/custom.css
index 622105dbf..56769238c 100644
--- a/public/css/custom.css
+++ b/public/css/custom.css
@@ -969,6 +969,15 @@ table .align-items-center td span.badge {
     padding-bottom: 0.5rem;
 }
 
+.difference-money .disabled-money {
+    background-color: transparent !important;
+    border: none;
+}
+
+.banking-price-text {
+    color: #525f7f;
+}
+
 .disabled-money,
 .disabled-money input {
     border:none !important;
diff --git a/resources/views/banking/reconciliations/create.blade.php b/resources/views/banking/reconciliations/create.blade.php
index 7b148a1ff..2c85004cc 100644
--- a/resources/views/banking/reconciliations/create.blade.php
+++ b/resources/views/banking/reconciliations/create.blade.php
@@ -109,26 +109,26 @@
                             </tr>
                             <tr class="row">
                                 <th class="col-md-9 col-lg-11 text-right d-none d-md-block">{{ trans('reconciliations.closing_balance') }}:</th>
-                                <td id="closing-balance" class="col-md-3 col-lg-1 text-right d-none d-md-block">
-                                    {{ Form::moneyGroup('closing_balance_total', '', '', ['disabled' => true, 'required' => 'required', 'v-model' => 'totals.closing_balance', 'currency' => $currency, 'masked' => 'true'], 0.00, 'text-right d-none') }}
-                                    <span id="closing-balance-total" v-if="totals.closing_balance" v-html="totals.closing_balance"></span>
-                                    <span v-else>@money(0, $account->currency_code, true)</span>
+                                <td id="closing-balance" class="col-md-3 col-lg-1 text-right d-none d-md-block pt-0">
+                                    <div class="mt-1">
+                                        {{ Form::moneyGroup('closing_balance_total', '', '', ['disabled' => true, 'row-input' => 'true', 'v-model' => 'totals.closing_balance', 'currency' => $currency, 'dynamic-currency' => 'currency', 'money-class' => 'text-right disabled-money banking-price-text'], 0.00, 'text-right disabled-money') }}
+                                    </div>
                                 </td>
                             </tr>
                             <tr class="row">
                                 <th class="col-md-9 col-lg-11 text-right d-none d-md-block">{{ trans('reconciliations.cleared_amount') }}:</th>
-                                <td id="cleared-amount" class="col-md-3 col-lg-1 text-right d-none d-md-block">
-                                    {{ Form::moneyGroup('cleared_amount_total', '', '', ['disabled' => true, 'required' => 'required', 'v-model' => 'totals.cleared_amount', 'currency' => $currency, 'masked' => 'true'], 0.00, 'text-right d-none') }}
-                                    <span id="cleared-amount-total" v-if="totals.cleared_amount" v-html="totals.cleared_amount"></span>
-                                    <span v-else>@money(0, $account->currency_code, true)</span>
+                                <td id="cleared-amount" class="col-md-3 col-lg-1 text-right d-none d-md-block pt-0">
+                                    <div class="mt-1">
+                                        {{ Form::moneyGroup('cleared_amount_total', '', '', ['disabled' => true, 'row-input' => 'true', 'v-model' => 'totals.cleared_amount', 'currency' => $currency, 'dynamic-currency' => 'currency', 'money-class' => 'text-right disabled-money banking-price-text'], 0.00, 'text-right disabled-money') }}
+                                    </div>
                                 </td>
                             </tr>
                             <tr :class="difference" class="row">
                                 <th class="col-md-9 col-lg-11 text-right d-none d-md-block">{{ trans('general.difference') }}:</th>
-                                <td id="difference" class="col-md-3 col-lg-1 text-right d-none d-md-block">
-                                    {{ Form::moneyGroup('difference_total', '', '', ['disabled' => true, 'required' => 'required', 'v-model' => 'totals.difference', 'currency' => $currency, 'masked' => 'true'], 0.00, 'text-right d-none') }}
-                                    <span id="difference-total" v-if="totals.difference" v-html="totals.difference"></span>
-                                    <span v-else>@money(0, $account->currency_code, true)</span>
+                                <td id="difference" class="col-md-3 col-lg-1 text-right d-none d-md-block pt-0">
+                                    <div class="mt-1 difference-money">
+                                        {{ Form::moneyGroup('difference_total', '', '', ['disabled' => true, 'row-input' => 'true', 'v-model' => 'totals.difference', 'currency' => $currency, 'dynamic-currency' => 'currency', 'money-class' => 'text-right disabled-money banking-price-text'], 0.00, 'text-right disabled-money') }}
+                                    </div>
                                 </td>
                             </tr>
                         </tbody>
diff --git a/resources/views/banking/reconciliations/edit.blade.php b/resources/views/banking/reconciliations/edit.blade.php
index 5bbb351a1..7c909ffd0 100644
--- a/resources/views/banking/reconciliations/edit.blade.php
+++ b/resources/views/banking/reconciliations/edit.blade.php
@@ -81,26 +81,26 @@
                             </tr>
                             <tr class="row">
                                 <th class="col-md-9 col-lg-11 text-right d-none d-md-block">{{ trans('reconciliations.closing_balance') }}:</th>
-                                <td id="closing-balance" class="col-md-3 col-lg-1 text-right d-none d-md-block">
-                                    {{ Form::moneyGroup('closing_balance_total', '', '', ['disabled' => true, 'required' => 'required', 'v-model' => 'totals.closing_balance', 'currency' => $currency, 'masked' => 'true'], $reconciliation->closing_balance, 'text-right d-none') }}
-                                    <span id="closing-balance-total" v-if="totals.closing_balance" v-html="totals.closing_balance"></span>
-                                    <span v-else>@money($reconciliation->closing_balance, $account->currency_code, true)</span>
+                                <td id="closing-balance" class="col-md-3 col-lg-1 text-right d-none d-md-block pt-0">
+                                    <div class="mt-1">
+                                        {{ Form::moneyGroup('closing_balance_total', '', '', ['disabled' => true, 'row-input' => 'true', 'v-model' => 'totals.closing_balance', 'currency' => $currency, 'dynamic-currency' => 'currency', 'money-class' => 'text-right disabled-money banking-price-text'], 0.00, 'text-right disabled-money') }}
+                                    </div>
                                 </td>
                             </tr>
                             <tr class="row">
                                 <th class="col-md-9 col-lg-11 text-right d-none d-md-block">{{ trans('reconciliations.cleared_amount') }}:</th>
-                                <td id="cleared-amount" class="col-md-3 col-lg-1 text-right d-none d-md-block">
-                                    {{ Form::moneyGroup('cleared_amount_total', '', '', ['disabled' => true, 'required' => 'required', 'v-model' => 'totals.cleared_amount', 'currency' => $currency, 'masked' => 'true'], 0.00, 'text-right d-none') }}
-                                    <span id="cleared-amount-total" v-if="totals.cleared_amount" v-html="totals.cleared_amount"></span>
-                                    <span v-else>@money(0, $account->currency_code, true)</span>
+                                <td id="cleared-amount" class="col-md-3 col-lg-1 text-right d-none d-md-block pt-0">
+                                    <div class="mt-1">
+                                        {{ Form::moneyGroup('cleared_amount_total', '', '', ['disabled' => true, 'row-input' => 'true', 'v-model' => 'totals.cleared_amount', 'currency' => $currency, 'dynamic-currency' => 'currency', 'money-class' => 'text-right disabled-money banking-price-text'], 0.00, 'text-right disabled-money') }}
+                                    </div>
                                 </td>
                             </tr>
                             <tr :class="difference" class="row">
                                 <th class="col-md-9 col-lg-11 text-right d-none d-md-block">{{ trans('general.difference') }}:</th>
-                                <td id="difference" class="col-md-3 col-lg-1 text-right d-none d-md-block">
-                                    {{ Form::moneyGroup('difference_total', '', '', ['disabled' => true, 'required' => 'required', 'v-model' => 'totals.difference', 'currency' => $currency, 'masked' => 'true'], 0.00, 'text-right d-none') }}
-                                    <span id="difference-total" v-if="totals.difference" v-html="totals.difference"></span>
-                                    <span v-else>@money(0, $account->currency_code, true)</span>
+                                <td id="difference" class="col-md-3 col-lg-1 text-right d-none d-md-block pt-0">
+                                    <div class="mt-1 difference-money">
+                                        {{ Form::moneyGroup('difference_total', '', '', ['disabled' => true, 'row-input' => 'true', 'v-model' => 'totals.difference', 'currency' => $currency, 'dynamic-currency' => 'currency', 'money-class' => 'text-right disabled-money banking-price-text'], 0.00, 'text-right disabled-money') }}
+                                    </div>
                                 </td>
                             </tr>
                         </tbody>