fix: financial reports.

src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummaryTable.js

@@ -1,5 +1,6 @@
 import React from 'react';
 import intl from 'react-intl-universal';
+import styled from 'styled-components';
 
 import { DataTable, FinancialSheet } from 'components';
 
@@ -23,19 +24,42 @@ export default function VendorsBalanceSummaryTable({
   const columns = useVendorsBalanceColumns();
 
   return (
-    <FinancialSheet
+    <VendorBalanceFinancialSheet
       companyName={organizationName}
-      name={'vendors-balance-summary'}
       sheetType={intl.get('vendors_balance_summary')}
       asDate={new Date()}
     >
-      <DataTable
-        className={'bigcapital-datatable--financial-report'}
+      <VendorBalanceDataTable
         columns={columns}
-        data={table?.data}
+        data={table.data}
         rowClassNames={tableRowTypesToClassnames}
         noInitialFetch={true}
       />
-    </FinancialSheet>
+    </VendorBalanceFinancialSheet>
   );
 }
+
+const VendorBalanceFinancialSheet = styled(FinancialSheet)``;
+
+const VendorBalanceDataTable = styled(DataTable)`
+  .table {
+    .tbody {
+      .tr:not(.no-results) {
+        .td {
+          border-bottom: 0;
+          padding-top: 0.4rem;
+          padding-bottom: 0.4rem;
+        }
+
+        &.row-type--TOTAL {
+          font-weight: 500;
+
+          .td {
+            border-top: 1px solid #bbb;
+            border-bottom: 3px double #333;
+          }
+        }
+      }
+    }
+  }
+`;