diff --git a/db.sqlite b/db.sqlite
index 15d38a38..9e3f045e 100644
Binary files a/db.sqlite and b/db.sqlite differ
diff --git a/inventory/__pycache__/admin.cpython-311.pyc b/inventory/__pycache__/admin.cpython-311.pyc
index 4b7818bc..1fa44382 100644
Binary files a/inventory/__pycache__/admin.cpython-311.pyc and b/inventory/__pycache__/admin.cpython-311.pyc differ
diff --git a/inventory/__pycache__/urls.cpython-311.pyc b/inventory/__pycache__/urls.cpython-311.pyc
index 8080971d..f063eeeb 100644
Binary files a/inventory/__pycache__/urls.cpython-311.pyc and b/inventory/__pycache__/urls.cpython-311.pyc differ
diff --git a/inventory/__pycache__/views.cpython-311.pyc b/inventory/__pycache__/views.cpython-311.pyc
index 78691ac4..9f3abbc3 100644
Binary files a/inventory/__pycache__/views.cpython-311.pyc and b/inventory/__pycache__/views.cpython-311.pyc differ
diff --git a/inventory/admin.py b/inventory/admin.py
index 285dc267..01027fb0 100644
--- a/inventory/admin.py
+++ b/inventory/admin.py
@@ -27,6 +27,7 @@ admin.site.register(models.Representative)
 admin.site.register(models.CarTrim)
 admin.site.register(models.AdditionalServices)
 admin.site.register(models.Payment)
+admin.site.register(models.VatRate)
 
 @admin.register(models.CarMake)
 class CarMakeAdmin(admin.ModelAdmin):
diff --git a/inventory/migrations/0016_alter_staff_staff_type.py b/inventory/migrations/0016_alter_staff_staff_type.py
new file mode 100644
index 00000000..229113a1
--- /dev/null
+++ b/inventory/migrations/0016_alter_staff_staff_type.py
@@ -0,0 +1,18 @@
+# Generated by Django 5.1.4 on 2024-12-30 15:13
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('inventory', '0015_merge_0008_vatrate_0014_useractivitylog'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='staff',
+            name='staff_type',
+            field=models.CharField(choices=[('manager', 'Manager'), ('inventory', 'Inventory'), ('accountant', 'Accountant'), ('sales', 'Sales')], max_length=255, verbose_name='Staff Type'),
+        ),
+    ]
diff --git a/inventory/views.py b/inventory/views.py
index 4a2e8aeb..f90fa7e1 100644
--- a/inventory/views.py
+++ b/inventory/views.py
@@ -1687,7 +1687,8 @@ class EstimateDetailView(LoginRequiredMixin, DetailView):
         if estimate.get_itemtxs_data():
             total = sum(x.ce_cost_estimate for x in estimate.get_itemtxs_data()[0].all())
             vat =  models.VatRate.objects.filter(is_active=True).first()
-            kwargs["vate_amount"] = (total * vat.vat_rate)
+            # vat = settings.VAT_RATE
+            kwargs["vat_amount"] = (total * vat.vat_rate)
             kwargs["total"] = (total * vat.vat_rate) + total
             kwargs["vat"] = vat.rate
         return super().get_context_data(**kwargs)
@@ -1715,7 +1716,7 @@ class InvoiceDetailView(LoginRequiredMixin, DetailView):
             total = sum(x.unit_cost for x in invoice.get_itemtxs_data()[0].all())
             total = int(total)
             vat =  models.VatRate.objects.filter(is_active=True).first()
-            kwargs["vate_amount"] = (total  * int(vat.vat_rate))
+            kwargs["vat_amount"] = (total  * int(vat.vat_rate))
             kwargs["total"] = (total * int(vat.vat_rate)) + total
             kwargs["vat"] = vat.rate
         return super().get_context_data(**kwargs)
@@ -1840,7 +1841,7 @@ class EstimatePreviewView(LoginRequiredMixin, DetailView):
         if estimate.get_itemtxs_data():
             total = sum(x.ce_cost_estimate for x in estimate.get_itemtxs_data()[0].all())
             vat =  models.VatRate.objects.filter(is_active=True).first()
-            kwargs["vate_amount"] = (total * vat.vat_rate)
+            kwargs["vat_amount"] = (total * vat.vat_rate)
             kwargs["total"] = (total * vat.vat_rate) + total
             kwargs["vat"] = vat.rate
         return super().get_context_data(**kwargs)
@@ -1856,7 +1857,7 @@ class InvoicePreviewView(LoginRequiredMixin, DetailView):
             total = sum(x.unit_cost for x in invoice.get_itemtxs_data()[0].all())
             total = int(total)
             vat =  models.VatRate.objects.filter(is_active=True).first()
-            kwargs["vate_amount"] = (total * vat.vat_rate)
+            kwargs["vat_amount"] = (total * vat.vat_rate)
             kwargs["total"] = (total * vat.vat_rate) + total
             kwargs["vat"] = vat.rate
         return super().get_context_data(**kwargs)
diff --git a/static/js/travel-agency-dashboard.js b/static/js/travel-agency-dashboard.js
index ae622bfe..b7c234ef 100644
--- a/static/js/travel-agency-dashboard.js
+++ b/static/js/travel-agency-dashboard.js
@@ -654,7 +654,7 @@
     );
 
     const profitData = [
-      [350000, 390000, 410700, 450000, 390000, 410700],
+      [9, 8678, 2122, 99898998, 767, 1],
       [245000, 310000, 420000, 480000, 530000, 580000],
       [278450, 513220, 359890, 444567, 201345, 589000]
     ];
diff --git a/templates/base.html b/templates/base.html
index 67ee5def..0a305b3d 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -193,7 +193,7 @@ const url = "{% url 'estimate_create' %}"
     <script src="{% static 'vendors/dayjs/dayjs.min.js' %}"></script>
     <script src="{% static 'js/phoenix.js' %}"></script>
     <script src="{% static 'vendors/echarts/echarts.min.js' %}"></script>
-    <script src="{% static 'js/travel-agency-dashboard.js' %}"></script>
+
     <script src="{% static 'js/main.js' %}"></script>
     <script src="{% static 'vendors/mapbox-gl/mapbox-gl.js' %}"></script>
     <script src="https://unpkg.com/@turf/turf@6/turf.min.js"></script>
diff --git a/templates/dashboards/accounting.html b/templates/dashboards/accounting.html
index 9dd42880..51a6f5a3 100644
--- a/templates/dashboards/accounting.html
+++ b/templates/dashboards/accounting.html
@@ -290,5 +290,272 @@
 
 
       </div>
+<script>
+const financialActivitiesChartInit = () => {
+    const { getColor, getData, getItemFromStore } = window.phoenix.utils;
+    const $financialActivitiesChartEl = document.querySelector(
+      '.echart-financial-Activities'
+    );
 
+    const profitData = [
+      [9, 8678, 2122, 99898998, 767, 1],
+      [245000, 310000, 420000, 480000, 530000, 580000],
+      [278450, 513220, 359890, 444567, 201345, 589000]
+    ];
+    const revenueData = [
+      [-810000, -640000, -630000, -590000, -620000, -780000],
+      [-482310, -726590, -589120, -674832, -811245, -455678],
+      [-432567, -688921, -517389, -759234, -601876, -485112]
+    ];
+    const expansesData = [
+      [-450000, -250000, -200000, -120000, -230000, -270000],
+      [-243567, -156789, -398234, -120456, -321890, -465678],
+      [-235678, -142345, -398765, -287456, -173890, -451234]
+    ];
+
+    if ($financialActivitiesChartEl) {
+      const userOptions = getData($financialActivitiesChartEl, 'options');
+      const chart = window.echarts.init($financialActivitiesChartEl);
+      const profitLagend = document.querySelector(`#${userOptions.optionOne}`);
+      const revenueLagend = document.querySelector(`#${userOptions.optionTwo}`);
+      const expansesLagend = document.querySelector(
+        `#${userOptions.optionThree}`
+      );
+
+      const getDefaultOptions = () => ({
+        color: [getColor('primary'), getColor('tertiary-bg')],
+        tooltip: {
+          trigger: 'axis',
+          padding: [7, 10],
+          backgroundColor: getColor('body-highlight-bg'),
+          borderColor: getColor('border-color'),
+          textStyle: { color: getColor('light-text-emphasis') },
+          borderWidth: 1,
+          transitionDuration: 0,
+          axisPointer: {
+            type: 'none'
+          },
+          position: (...params) => handleTooltipPosition(params),
+          formatter: params => tooltipFormatter(params),
+          extraCssText: 'z-index: 1000'
+        },
+        legend: {
+          data: ['Profit', 'Revenue', 'Expanses'],
+          show: false
+        },
+        xAxis: {
+          axisLabel: {
+            show: true,
+            margin: 12,
+            color: getColor('secondary-text-emphasis'),
+            formatter: value =>
+              `${Math.abs(Math.round((value / 1000) * 10) / 10)}k`,
+            fontFamily: 'Nunito Sans',
+            fontWeight: 700
+          },
+          splitLine: {
+            lineStyle: {
+              color: getColor('border-color-translucent')
+            }
+          }
+        },
+        yAxis: {
+          axisTick: {
+            show: false
+          },
+          data: [
+            'NOV-DEC',
+            'SEP-OCT',
+            'JUL-AUG',
+            'MAY-JUN',
+            'MAR-APR',
+            'JAN-FEB'
+          ],
+          axisLabel: {
+            color: getColor('secondary-text-emphasis'),
+            margin: 8,
+            fontFamily: 'Nunito Sans',
+            fontWeight: 700
+          },
+          axisLine: {
+            lineStyle: {
+              color: getColor('border-color-translucent')
+            }
+          }
+        },
+        series: [
+          {
+            name: 'Profit',
+            stack: 'Total',
+            type: 'bar',
+            barWidth: 8,
+            roundCap: true,
+            emphasis: {
+              focus: 'series'
+            },
+            itemStyle: {
+              borderRadius: [0, 4, 4, 0],
+              color:
+                getItemFromStore('phoenixTheme') === 'dark'
+                  ? getColor('primary')
+                  : getColor('primary-light')
+            },
+            data: profitData[0]
+          },
+          {
+            name: 'Revenue',
+            type: 'bar',
+            barWidth: 8,
+            barGap: '100%',
+            stack: 'Total',
+            emphasis: {
+              focus: 'series'
+            },
+            itemStyle: {
+              borderRadius: [4, 0, 0, 4],
+              color:
+                getItemFromStore('phoenixTheme') === 'dark'
+                  ? getColor('success')
+                  : getColor('success-light')
+            },
+            data: revenueData[0]
+          },
+          {
+            name: 'Expanses',
+            type: 'bar',
+            barWidth: 8,
+            emphasis: {
+              focus: 'series'
+            },
+            itemStyle: {
+              borderRadius: [4, 0, 0, 4],
+              color:
+                getItemFromStore('phoenixTheme') === 'dark'
+                  ? getColor('info')
+                  : getColor('info-light')
+            },
+            data: expansesData[0]
+          }
+        ],
+        grid: {
+          right: 20,
+          left: 3,
+          bottom: 0,
+          top: 16,
+          containLabel: true
+        },
+        animation: false
+      });
+
+      const responsiveOptions = {
+        xs: {
+          yAxis: {
+            axisLabel: {
+              show: false
+            }
+          },
+          grid: {
+            left: 15
+          }
+        },
+        sm: {
+          yAxis: {
+            axisLabel: {
+              margin: 32,
+              show: true
+            }
+          },
+          grid: {
+            left: 3
+          }
+        },
+        xl: {
+          yAxis: {
+            axisLabel: {
+              show: false
+            }
+          },
+          grid: {
+            left: 15
+          }
+        },
+        xxl: {
+          yAxis: {
+            axisLabel: {
+              show: true
+            }
+          },
+          grid: {
+            left: 3
+          }
+        }
+      };
+
+      echartSetOption(chart, userOptions, getDefaultOptions, responsiveOptions);
+
+      profitLagend.addEventListener('click', () => {
+        profitLagend.classList.toggle('opacity-50');
+        chart.dispatchAction({
+          type: 'legendToggleSelect',
+          name: 'Profit'
+        });
+      });
+
+      revenueLagend.addEventListener('click', () => {
+        revenueLagend.classList.toggle('opacity-50');
+        chart.dispatchAction({
+          type: 'legendToggleSelect',
+          name: 'Revenue'
+        });
+      });
+
+      expansesLagend.addEventListener('click', () => {
+        expansesLagend.classList.toggle('opacity-50');
+        chart.dispatchAction({
+          type: 'legendToggleSelect',
+          name: 'Expanses'
+        });
+      });
+
+      const cetegorySelect = document.querySelector('[data-activities-options]');
+      if (cetegorySelect) {
+        cetegorySelect.addEventListener('change', e => {
+          const { value } = e.currentTarget;
+          const data1 = profitData[value];
+          const data2 = revenueData[value];
+          const data3 = expansesData[value];
+          chart.setOption({
+            series: [
+              {
+                data: data1
+              },
+              {
+                data: data2
+              },
+              {
+                data: data3
+              }
+            ]
+          });
+        });
+      }
+    }
+  };
+
+  const { docReady } = window.phoenix.utils;
+
+  docReady(bookingValueChartInit);
+  docReady(commissionChartInit);
+  docReady(cancelBookingChartInit);
+  docReady(countryWiseVisitorsChartInit);
+  docReady(financialActivitiesChartInit);
+  docReady(holidaysNextMonthChartInit);
+  docReady(bookingsChartInit);
+  docReady(grossProfitInit);
+
+}));
+
+
+
+</script>
 {% endblock %}
diff --git a/templates/header.html b/templates/header.html
index cf56937b..1bd65144 100644
--- a/templates/header.html
+++ b/templates/header.html
@@ -127,7 +127,7 @@
                           </a>
                           <!-- more inner pages-->
                       </li>
-                        <li class="nav-item"><a class="nav-link" href="#">
+                        <li class="nav-item"><a class="nav-link" href="{% url 'invoice_list' %}">
                             <div class="d-flex align-items-center"><span class="nav-link-icon"><span class="fas fa-file-invoice"></span></span><span class="nav-link-text">{% trans "invoices"|capfirst %}</span>
                             </div>
                           </a>
diff --git a/templates/inventory/car_detail.html b/templates/inventory/car_detail.html
index 2d3b094d..7415c3a7 100644
--- a/templates/inventory/car_detail.html
+++ b/templates/inventory/car_detail.html
@@ -13,7 +13,7 @@
     border-color: #000;
 }
 </style>
-<div class="content">
+<div class="container">
 <div class="pb-5">
   <!-- Custom Card Modal -->
   <div class="modal fade" id="customCardModal" tabindex="-1" aria-labelledby="customCardModalLabel" aria-hidden="true">
@@ -85,8 +85,8 @@
 
 
           <div class="card rounded shadow d-flex align-content-center">
-          <div class="card overflow-hidden m-3 " style="max-width:35rem;">
-                      <img class="card-img-top shadow-info" src="{% static 'images/generic/4.jpg' %}" alt="...">
+          <div class="card overflow-hidden m-3 " style="max-width:25rem;">
+                      <img class="card-img-top shadow-info" src="{% static 'images/generic/2022-lincoln-corsair.jpg' %}" alt="...">
                       <div class="card-img-overlay d-flex align-items-end">
                         <div>
                           <h4 class="card-title">{{ car.year }} - {{ car.id_car_make.get_local_name }}</h4>
diff --git a/templates/sales/invoices/invoice_detail.html b/templates/sales/invoices/invoice_detail.html
index 9d28d86a..9a852599 100644
--- a/templates/sales/invoices/invoice_detail.html
+++ b/templates/sales/invoices/invoice_detail.html
@@ -30,7 +30,8 @@
   </div>
      <!-- ============================================-->
       <!-- <section> begin ============================-->
-        <section class="pt-5 pb-9 bg-body-emphasis dark__bg-gray-1200 border-top">
+
+        <div class="pt-5 pb-9 bg-body-emphasis dark__bg-gray-1200">
             <div class="container-small mt-3">              
               <div class="d-flex justify-content-between align-items-end mb-4">
                 <h2 class="mb-0">Invoice</h2>
@@ -138,13 +139,8 @@
                 </div>                
                  
                 </div>
-              </div>
             </div>
-            <!-- end of .container-->
-    
-          </section>
-          <!-- <section> close ============================-->
-          <!-- ============================================-->
+        </div>
 {% endblock %}
 
 {% block extra_js %}
@@ -176,5 +172,5 @@
     // Run the function on page load
     window.onload = calculateTotals;          
     </script>
- 
+
 {% endblock %}
\ No newline at end of file