diff --git a/app/apps/users/models.py b/app/apps/users/models.py
index 83adb17..784a95d 100644
--- a/app/apps/users/models.py
+++ b/app/apps/users/models.py
@@ -23,8 +23,9 @@ class User(AbstractUser):
 
 class UserSettings(models.Model):
     class StartPage(models.TextChoices):
-        MONTHLY = "MONTHLY_OVERVIEW", _("Monthly Overview")
-        YEARLY = "YEARLY_OVERVIEW", _("Yearly Overview")
+        MONTHLY = "MONTHLY_OVERVIEW", _("Monthly")
+        YEARLY_CURRENCY = "YEARLY_OVERVIEW_CURRENCY", _("Yearly by currency")
+        YEARLY_ACCOUNT = "YEARLY_OVERVIEW_ACCOUNT", _("Yearly by account")
         NETWORTH = "NETWORTH", _("Net Worth")
         ALL_TRANSACTIONS = "ALL_TRANSACTIONS", _("All Transactions")
         CALENDAR = "CALENDAR", _("Calendar")
diff --git a/app/apps/yearly_overview/urls.py b/app/apps/yearly_overview/urls.py
index 64ad627..70b13c4 100644
--- a/app/apps/yearly_overview/urls.py
+++ b/app/apps/yearly_overview/urls.py
@@ -3,10 +3,16 @@ from django.urls import path
 from . import views
 
 urlpatterns = [
-    path("yearly/", views.index, name="yearly_index"),
+    path("yearly/currency/", views.index_by_currency, name="yearly_index_currency"),
+    path("yearly/account/", views.index_by_account, name="yearly_index_account"),
     path(
-        "yearly/<int:year>/",
-        views.yearly_overview,
-        name="yearly_overview",
+        "yearly/currency/<int:year>/",
+        views.yearly_overview_by_currency,
+        name="yearly_overview_currency",
+    ),
+    path(
+        "yearly/account/<int:year>/",
+        views.yearly_overview_by_account,
+        name="yearly_overview_account",
     ),
 ]
diff --git a/app/apps/yearly_overview/views.py b/app/apps/yearly_overview/views.py
index 8fade8d..bc39d25 100644
--- a/app/apps/yearly_overview/views.py
+++ b/app/apps/yearly_overview/views.py
@@ -13,17 +13,27 @@ from apps.transactions.models import Transaction
 
 
 @login_required
-def index(request):
+def index_by_currency(request):
     now = timezone.localdate(timezone.now())
 
-    return redirect(to="yearly_overview", year=now.year)
+    return redirect(to="yearly_overview_currency", year=now.year)
 
 
-def yearly_overview(request, year: int):
+@login_required
+def index_by_account(request):
+    now = timezone.localdate(timezone.now())
+
+    return redirect(to="yearly_overview_account", year=now.year)
+
+
+@login_required
+def yearly_overview_by_currency(request, year: int):
     next_year = year + 1
     previous_year = year - 1
 
-    transactions = Transaction.objects.filter(reference_date__year=year)
+    transactions = Transaction.objects.filter(
+        reference_date__year=year, account__is_archived=False
+    )
 
     monthly_data = (
         transactions.annotate(month=TruncMonth("reference_date"))
@@ -165,7 +175,7 @@ def yearly_overview(request, year: int):
 
     return render(
         request,
-        "yearly_overview/pages/overview.html",
+        "yearly_overview/pages/overview_by_currency.html",
         context={
             "year": year,
             "next_year": next_year,
@@ -173,3 +183,166 @@ def yearly_overview(request, year: int):
             "totals": result,
         },
     )
+
+
+@login_required
+def yearly_overview_by_account(request, year: int):
+    next_year = year + 1
+    previous_year = year - 1
+
+    transactions = Transaction.objects.filter(
+        reference_date__year=year, account__is_archived=False
+    )
+
+    monthly_data = (
+        transactions.annotate(month=TruncMonth("reference_date"))
+        .values(
+            "month",
+            "account__id",
+            "account__name",
+            "account__currency__code",
+            "account__currency__prefix",
+            "account__currency__suffix",
+            "account__currency__decimal_places",
+        )
+        .annotate(
+            income_paid=Coalesce(
+                Sum(
+                    Case(
+                        When(
+                            type=Transaction.Type.INCOME, is_paid=True, then=F("amount")
+                        ),
+                        default=Value(Decimal("0")),
+                        output_field=DecimalField(),
+                    )
+                ),
+                Value(Decimal("0")),
+                output_field=DecimalField(),
+            ),
+            expense_paid=Coalesce(
+                Sum(
+                    Case(
+                        When(
+                            type=Transaction.Type.EXPENSE,
+                            is_paid=True,
+                            then=F("amount"),
+                        ),
+                        default=Value(Decimal("0")),
+                        output_field=DecimalField(),
+                    )
+                ),
+                Value(Decimal("0")),
+                output_field=DecimalField(),
+            ),
+            income_unpaid=Coalesce(
+                Sum(
+                    Case(
+                        When(
+                            type=Transaction.Type.INCOME,
+                            is_paid=False,
+                            then=F("amount"),
+                        ),
+                        default=Value(Decimal("0")),
+                        output_field=DecimalField(),
+                    )
+                ),
+                Value(Decimal("0")),
+                output_field=DecimalField(),
+            ),
+            expense_unpaid=Coalesce(
+                Sum(
+                    Case(
+                        When(
+                            type=Transaction.Type.EXPENSE,
+                            is_paid=False,
+                            then=F("amount"),
+                        ),
+                        default=Value(Decimal("0")),
+                        output_field=DecimalField(),
+                    )
+                ),
+                Value(Decimal("0")),
+                output_field=DecimalField(),
+            ),
+        )
+        .annotate(
+            balance_unpaid=F("income_unpaid") - F("expense_unpaid"),
+            balance_paid=F("income_paid") - F("expense_paid"),
+            balance_total=F("income_paid")
+            + F("income_unpaid")
+            - F("expense_paid")
+            - F("expense_unpaid"),
+        )
+        .order_by("month", "account__name")
+    )
+
+    # Create a list of all months in the year
+    all_months = [date(year, month, 1) for month in range(1, 13)]
+
+    # Get all accounts that had transactions in this year
+    accounts = (
+        transactions.values(
+            "account__id",
+            "account__name",
+            "account__group__name",
+            "account__currency__code",
+            "account__currency__prefix",
+            "account__currency__suffix",
+            "account__currency__decimal_places",
+        )
+        .distinct()
+        .order_by("account__name")
+    )
+
+    # Create a dictionary to store the final result
+    result = {
+        month: {
+            account["account__id"]: {
+                "name": account["account__name"],
+                "group": account["account__group__name"],
+                "currency": {
+                    "code": account["account__currency__code"],
+                    "prefix": account["account__currency__prefix"],
+                    "suffix": account["account__currency__suffix"],
+                    "decimal_places": account["account__currency__decimal_places"],
+                },
+                "income_paid": Decimal("0"),
+                "expense_paid": Decimal("0"),
+                "income_unpaid": Decimal("0"),
+                "expense_unpaid": Decimal("0"),
+                "balance_unpaid": Decimal("0"),
+                "balance_paid": Decimal("0"),
+                "balance_total": Decimal("0"),
+            }
+            for account in accounts
+        }
+        for month in all_months
+    }
+
+    # Fill in the data
+    for entry in monthly_data:
+        month = entry["month"]
+        account_id = entry["account__id"]
+
+        for field in [
+            "income_paid",
+            "expense_paid",
+            "income_unpaid",
+            "expense_unpaid",
+            "balance_unpaid",
+            "balance_paid",
+            "balance_total",
+        ]:
+            result[month][account_id][field] = entry[field]
+
+    return render(
+        request,
+        "yearly_overview/pages/overview_by_account.html",
+        context={
+            "year": year,
+            "next_year": next_year,
+            "previous_year": previous_year,
+            "totals": result,
+            "accounts": accounts,
+        },
+    )
diff --git a/app/templates/accounts/fragments/account_reconciliation.html b/app/templates/accounts/fragments/account_reconciliation.html
index 2361ec4..102696a 100644
--- a/app/templates/accounts/fragments/account_reconciliation.html
+++ b/app/templates/accounts/fragments/account_reconciliation.html
@@ -16,7 +16,7 @@
               <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
                       data-bs-target="#flush-collapse-{{ forloop.counter0 }}" aria-expanded="false"
                       aria-controls="flush-collapseOne">
-                {% if form.account_group %}<span class="badge !tw-bg-blue-300 !tw-text-blue-800 me-2">{{ form.account_group.name }}</span>{% endif %}{{ form.account_name }}
+                {% if form.account_group %}<span class="badge text-bg-primary me-2">{{ form.account_group.name }}</span>{% endif %}{{ form.account_name }}
               </button>
             </h2>
             <div id="flush-collapse-{{ forloop.counter0 }}" class="accordion-collapse collapse">
diff --git a/app/templates/cotton/msg/empty.html b/app/templates/cotton/msg/empty.html
index d1e3057..3073a1f 100644
--- a/app/templates/cotton/msg/empty.html
+++ b/app/templates/cotton/msg/empty.html
@@ -1,5 +1,5 @@
-<div class="row p-5">
-  <div class="col p-5">
+<div class="row {% if not remove_padding %}p-5{% endif %}">
+  <div class="col {% if not remove_padding %}p-5{% endif %}">
     <div class="text-center">
       <i class="fa-solid fa-circle-xmark tw-text-6xl"></i>
       <p class="lead mt-4 mb-0">{{ title }}</p>
diff --git a/app/templates/includes/navbar.html b/app/templates/includes/navbar.html
index b7bb617..435584a 100644
--- a/app/templates/includes/navbar.html
+++ b/app/templates/includes/navbar.html
@@ -13,7 +13,7 @@
     <div class="collapse navbar-collapse" id="navbarContent">
       <ul class="navbar-nav me-auto mb-2 mb-lg-0 nav-underline" hx-push-url="true">
         <li class="nav-item dropdown">
-          <a class="nav-link dropdown-toggle {% active_link views='monthly_overview||yearly_overview||calendar' %}"
+          <a class="nav-link dropdown-toggle {% active_link views='monthly_overview||yearly_overview_currency||yearly_overview_account||calendar' %}"
              href="#"
              role="button"
              data-bs-toggle="dropdown"
@@ -23,8 +23,10 @@
           <ul class="dropdown-menu">
             <li><a class="dropdown-item {% active_link views='monthly_overview' %}"
                    href="{% url 'monthly_index' %}">{% translate 'Monthly' %}</a></li>
-            <li><a class="dropdown-item {% active_link views='yearly_overview' %}"
-                   href="{% url 'yearly_index' %}">{% translate 'Yearly' %}</a></li>
+            <li><a class="dropdown-item {% active_link views='yearly_overview_currency' %}"
+                   href="{% url 'yearly_index_currency' %}">{% translate 'Yearly by currency' %}</a></li>
+            <li><a class="dropdown-item {% active_link views='yearly_overview_account' %}"
+                   href="{% url 'yearly_index_account' %}">{% translate 'Yearly by account' %}</a></li>
             <li><a class="dropdown-item {% active_link views='calendar' %}"
                    href="{% url 'calendar_index' %}">{% translate 'Calendar' %}</a></li>
           </ul>
diff --git a/app/templates/net_worth/net_worth.html b/app/templates/net_worth/net_worth.html
index ad19272..c5543d1 100644
--- a/app/templates/net_worth/net_worth.html
+++ b/app/templates/net_worth/net_worth.html
@@ -50,8 +50,7 @@
               {% if group_id %}
                 <div class="d-flex justify-content-between mt-2">
                   <div class="d-flex align-items-baseline w-100">
-                      <div class="text-start font-monospace tw-text-gray-300"><span class="badge !tw-bg-blue-300
-                      !tw-text-blue-800">
+                      <div class="text-start font-monospace tw-text-gray-300"><span class="badge text-bg-primary">
                         {{ group_data.name }}</span></div>
                   </div>
                 </div>
diff --git a/app/templates/yearly_overview/pages/overview_by_account.html b/app/templates/yearly_overview/pages/overview_by_account.html
new file mode 100644
index 0000000..95b6a83
--- /dev/null
+++ b/app/templates/yearly_overview/pages/overview_by_account.html
@@ -0,0 +1,225 @@
+{% extends "layouts/base.html" %}
+{% load currency_display %}
+{% load crispy_forms_tags %}
+{% load i18n %}
+{% load month_name %}
+{% load static %}
+{% load webpack_loader %}
+
+{% block title %}{% translate 'Yearly Overview' %} :: {% translate "By account" %} :: {{ year }}{% endblock %}
+
+{% block body_hyperscript %}
+  on keyup[code is 'ArrowLeft' and target.nodeName is 'BODY'] from body trigger 'previous_year' end
+  on keyup[code is 'ArrowRight' and target.nodeName is 'BODY'] from body trigger 'next_year' end
+{% endblock %}
+
+{% block content %}
+<div class="container px-md-3 py-3 column-gap-5">
+  <div class="row mb-3 gx-xl-4 gy-3 mb-4">
+{#    Date picker#}
+    <div class="col-12 col-xl-2 flex-row align-items-center d-flex">
+      <div class="tw-text-base h-100 align-items-center d-flex">
+        <a role="button"
+           class="pe-4 py-2"
+           hx-boost="true"
+           hx-trigger="click, previous_year from:window"
+           href="{% url 'yearly_overview_account' year=previous_year %}">
+          <i class="fa-solid fa-chevron-left"></i></a>
+      </div>
+      <div class="tw-text-3xl fw-bold font-monospace tw-w-full text-center">
+        {{ year }}
+      </div>
+      <div class="tw-text-base mx-2 h-100 align-items-center d-flex">
+        <a role="button"
+           class="ps-3 py-2"
+           hx-boost="true"
+           hx-trigger="click, next_year from:window"
+           href="{% url 'yearly_overview_account' year=next_year %}">
+          <i class="fa-solid fa-chevron-right"></i>
+        </a>
+      </div>
+    </div>
+{#    Action buttons#}
+    <div class="col-12 col-xl-10">
+      <div class="d-grid gap-2 d-xl-flex justify-content-xl-end">
+        <button class="btn btn-sm btn-outline-success"
+                      hx-get="{% url 'transaction_add' %}"
+                      hx-target="#generic-offcanvas"
+                      hx-trigger="click, add_income from:window"
+                      hx-vals='{"year": {{ year }}, "type": "IN"}'>
+                <i class="fa-solid fa-arrow-right-to-bracket me-2"></i>
+                {% translate "Income" %}
+        </button>
+        <button class="btn btn-sm btn-outline-danger"
+                      hx-get="{% url 'transaction_add' %}"
+                      hx-target="#generic-offcanvas"
+                      hx-trigger="click, add_expense from:window"
+                      hx-vals='{"year": {{ year }}, "type": "EX"}'>
+                <i class="fa-solid fa-arrow-right-from-bracket me-2"></i>
+                {% translate "Expense" %}
+        </button>
+        <button class="btn btn-sm btn-outline-warning"
+                hx-get="{% url 'installment_plan_add' %}"
+                hx-trigger="click, installment from:window"
+                hx-target="#generic-offcanvas">
+          <i class="fa-solid fa-divide me-2"></i>
+          {% translate "Installment" %}
+        </button>
+        <button class="btn btn-sm btn-outline-warning"
+                hx-get="{% url 'recurring_transaction_add' %}"
+                hx-trigger="click, balance from:window"
+                hx-target="#generic-offcanvas">
+          <i class="fa-solid fa-repeat me-2"></i>
+          {% translate "Recurring" %}
+        </button>
+        <button class="btn btn-sm btn-outline-info"
+                hx-get="{% url 'transactions_transfer' %}"
+                hx-target="#generic-offcanvas"
+                hx-trigger="click, add_transfer from:window"
+                hx-vals='{"year": {{ year }}}'>
+          <i class="fa-solid fa-money-bill-transfer me-2"></i>
+          {% translate "Transfer" %}
+        </button>
+        <button class="btn btn-sm btn-outline-info"
+                hx-get="{% url 'account_reconciliation' %}"
+                hx-trigger="click, balance from:window"
+                hx-target="#generic-offcanvas">
+          <i class="fa-solid fa-scale-balanced me-2"></i>
+          {% translate "Balance" %}
+        </button>
+      </div>
+    </div>
+  </div>
+  <div class="row row-cols-1 g-4 mb-3">
+    {% for date, x in totals.items %}
+    <div class="col">
+      <div class="card tw-relative h-100 shadow">
+        <div class="tw-absolute tw-h-8 tw-w-8 tw-right-2 tw-top-2 tw-bg-yellow-300 tw-text-yellow-800 text-center
+        align-items-center d-flex justify-content-center rounded-2 tw-font-bold">
+          {{ forloop.counter }}
+        </div>
+        <div class="card-body">
+          <h5 class="tw-text-yellow-400 fw-bold mb-3">{{ date.month|month_name }}</h5>
+          <div class="accordion accordion-flush" id="a-{{ forloop.counter }}-control">
+            {% for id, account in x.items %}
+            <div class="accordion-item">
+              <h2 class="accordion-header">
+                <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#{{ account.name|slugify }}-{{ forloop.parentloop.counter }}" aria-expanded="false" aria-controls="{{ account.name|slugify }}-{{ forloop.counter }}">
+                  <span class="badge text-bg-primary me-2">{{ account.group }}</span>{{ account.name }}
+                </button>
+              </h2>
+              <div id="{{ account.name|slugify }}-{{ forloop.parentloop.counter }}" class="accordion-collapse collapse">
+                <div class="accordion-body">
+                  <div class="row">
+                    <div class="col-12 col-lg-6">
+                      <div class="d-flex justify-content-between align-items-baseline mt-2">
+                        <div class="text-end font-monospace">
+                          <div class="tw-text-gray-400">{% translate 'projected income' %}</div>
+                        </div>
+                        <div class="dotted-line flex-grow-1"></div>
+                        <div class="text-end font-monospace tw-text-green-300">
+                          <c-amount.display
+                                      :amount="account.income_unpaid"
+                                      :prefix="account.currency.prefix"
+                                      :suffix="account.currency.suffix"
+                                      :decimal_places="account.currency.decimal_places"></c-amount.display>
+                        </div>
+                      </div>
+                      <div class="d-flex justify-content-between align-items-baseline mt-2">
+                        <div class="text-end font-monospace">
+                          <div class="tw-text-gray-400">{% translate 'projected expenses' %}</div>
+                        </div>
+                        <div class="dotted-line flex-grow-1"></div>
+                        <div class="text-end font-monospace tw-text-red-300">
+                          <c-amount.display
+                                      :amount="account.expense_unpaid"
+                                      :prefix="account.currency.prefix"
+                                      :suffix="account.currency.suffix"
+                                      :decimal_places="account.currency.decimal_places"></c-amount.display>
+                        </div>
+                      </div>
+                      <div class="d-flex justify-content-between align-items-baseline mt-2">
+                        <div class="text-end font-monospace">
+                          <div class="tw-text-gray-400">{% translate 'projected total' %}</div>
+                        </div>
+                        <div class="dotted-line flex-grow-1"></div>
+                        <div class="text-end font-monospace tw-text-yellow-300">
+                          <c-amount.display
+                                      :amount="account.balance_unpaid"
+                                      :prefix="account.currency.prefix"
+                                      :suffix="account.currency.suffix"
+                                      :decimal_places="account.currency.decimal_places"></c-amount.display>
+                        </div>
+                      </div>
+                    </div>
+                    <hr class="my-3 d-block d-lg-none">
+                    <div class="col-12 col-lg-6">
+                      <div class="d-flex justify-content-between align-items-baseline mt-2">
+                        <div class="text-end font-monospace">
+                          <div class="tw-text-gray-400">{% translate 'current income' %}</div>
+                        </div>
+                        <div class="dotted-line flex-grow-1"></div>
+                        <div class="text-end font-monospace tw-text-green-400">
+                          <c-amount.display
+                                      :amount="account.income_paid"
+                                      :prefix="account.currency.prefix"
+                                      :suffix="account.currency.suffix"
+                                      :decimal_places="account.currency.decimal_places"></c-amount.display>
+                        </div>
+                      </div>
+                      <div class="d-flex justify-content-between align-items-baseline mt-2">
+                        <div class="text-end font-monospace">
+                          <div class="tw-text-gray-400">{% translate 'current expenses' %}</div>
+                        </div>
+                        <div class="dotted-line flex-grow-1"></div>
+                        <div class="text-end font-monospace tw-text-red-400">
+                          <c-amount.display
+                                      :amount="account.expense_paid"
+                                      :prefix="account.currency.prefix"
+                                      :suffix="account.currency.suffix"
+                                      :decimal_places="account.currency.decimal_places"></c-amount.display>
+                        </div>
+                      </div>
+                      <div class="d-flex justify-content-between align-items-baseline mt-2">
+                        <div class="text-end font-monospace">
+                          <div class="tw-text-gray-400">{% translate 'current total' %}</div>
+                        </div>
+                        <div class="dotted-line flex-grow-1"></div>
+                        <div class="text-end font-monospace tw-text-yellow-400">
+                          <c-amount.display
+                                      :amount="account.balance_paid"
+                                      :prefix="account.currency.prefix"
+                                      :suffix="account.currency.suffix"
+                                      :decimal_places="account.currency.decimal_places"></c-amount.display>
+                        </div>
+                      </div>
+                    </div>
+                    <hr class="my-3">
+                    <div>
+                      <div class="d-flex justify-content-between align-items-baseline">
+                        <div class="text-end font-monospace">
+                          <div class="tw-text-gray-400">{% translate 'final total' %}</div>
+                        </div>
+                        <div class="dotted-line flex-grow-1"></div>
+                        <div class="text-end font-monospace tw-text-green-300">
+                          <c-amount.display
+                                      :amount="account.balance_total"
+                                      :prefix="account.currency.prefix"
+                                      :suffix="account.currency.suffix"
+                                      :decimal_places="account.currency.decimal_places"></c-amount.display>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            {% endfor %}
+          </div>
+        </div>
+      </div>
+    </div>
+    {% endfor %}
+  </div>
+</div>
+{% endblock %}
diff --git a/app/templates/yearly_overview/pages/overview.html b/app/templates/yearly_overview/pages/overview_by_currency.html
similarity index 67%
rename from app/templates/yearly_overview/pages/overview.html
rename to app/templates/yearly_overview/pages/overview_by_currency.html
index 1286228..70e4250 100644
--- a/app/templates/yearly_overview/pages/overview.html
+++ b/app/templates/yearly_overview/pages/overview_by_currency.html
@@ -6,7 +6,7 @@
 {% load static %}
 {% load webpack_loader %}
 
-{% block title %}{% translate 'Yearly Overview' %} :: {{ year }}{% endblock %}
+{% block title %}{% translate 'Yearly Overview' %} :: {% translate 'By currency' %} :: {{ year }}{% endblock %}
 
 {% block body_hyperscript %}
   on keyup[code is 'ArrowLeft' and target.nodeName is 'BODY'] from body trigger 'previous_year' end
@@ -23,7 +23,7 @@
            class="pe-4 py-2"
            hx-boost="true"
            hx-trigger="click, previous_year from:window"
-           href="{% url 'yearly_overview' year=previous_year %}">
+           href="{% url 'yearly_overview_currency' year=previous_year %}">
           <i class="fa-solid fa-chevron-left"></i></a>
       </div>
       <div class="tw-text-3xl fw-bold font-monospace tw-w-full text-center">
@@ -34,7 +34,7 @@
            class="ps-3 py-2"
            hx-boost="true"
            hx-trigger="click, next_year from:window"
-           href="{% url 'yearly_overview' year=next_year %}">
+           href="{% url 'yearly_overview_currency' year=next_year %}">
           <i class="fa-solid fa-chevron-right"></i>
         </a>
       </div>
@@ -90,84 +90,6 @@
       </div>
     </div>
   </div>
-{#  <div class="row gx-xl-4 gy-3">#}
-{#    <div class="col-12">#}
-{#      <div class="row">#}
-{#        <div class="no-more-tables">#}
-{#        <table class="table table-hover text-nowrap">#}
-{#          <thead>#}
-{#            <tr>#}
-{#              <th scope="col">{% translate 'Month' %}</th>#}
-{#              <td>{% translate 'Projected Income' %}</td>#}
-{#              <td>{% translate 'Projected Expenses' %}</td>#}
-{#              <td>{% translate 'Projected Total' %}</td>#}
-{#              <td>{% translate 'Current Income' %}</td>#}
-{#              <td>{% translate 'Current Expenses' %}</td>#}
-{#              <td>{% translate 'Current Total' %}</td>#}
-{#              <td>{% translate 'Final Total' %}</td>#}
-{#            </tr>#}
-{#          </thead>#}
-{#          <tbody>#}
-{#            {% for date, x in totals.items %}#}
-{#            <tr>#}
-{#              <th scope="row">{{ date.month|month_name }}</th>#}
-{#              <td class="!tw-text-green-400" data-title="{% translate 'Projected Income' %}">#}
-{#                {% for data in x.income_unpaid %}#}
-{#                  <div class="amount" data-original-value="{% currency_display amount=data.amount prefix=data.prefix suffix=data.suffix decimal_places=data.decimal_places %}"></div>#}
-{#                {% empty %}#}
-{#                  <div>-</div>#}
-{#                {% endfor %}#}
-{#              </td>#}
-{#              <td class="!tw-text-red-400" data-title="{% translate 'Projected Expenses' %}">#}
-{#                {% for data in x.expense_unpaid %}#}
-{#                  <div class="amount" data-original-value="{% currency_display amount=data.amount prefix=data.prefix suffix=data.suffix decimal_places=data.decimal_places %}"></div>#}
-{#                {% empty %}#}
-{#                  <div>-</div>#}
-{#                {% endfor %}#}
-{#              </td>#}
-{#              <td data-title="{% translate 'Projected Total' %}">#}
-{#                {% for data in x.balance_unpaid %}#}
-{#                  <div class="amount" data-original-value="{% currency_display amount=data.amount prefix=data.prefix suffix=data.suffix decimal_places=data.decimal_places %}"></div>#}
-{#                {% empty %}#}
-{#                  <div>-</div>#}
-{#                {% endfor %}#}
-{#              </td>#}
-{#              <td class="!tw-text-green-400" data-title="{% translate 'Current Income' %}">#}
-{#                {% for data in x.income_paid %}#}
-{#                  <div class="amount" data-original-value="{% currency_display amount=data.amount prefix=data.prefix suffix=data.suffix decimal_places=data.decimal_places %}"></div>#}
-{#                {% empty %}#}
-{#                  <div>-</div>#}
-{#                {% endfor %}#}
-{#              </td>#}
-{#              <td class="!tw-text-red-400" data-title="{% translate 'Current Expenses' %}">#}
-{#                {% for data in x.expense_paid %}#}
-{#                  <div class="amount" data-original-value="{% currency_display amount=data.amount prefix=data.prefix suffix=data.suffix decimal_places=data.decimal_places %}"></div>#}
-{#                {% empty %}#}
-{#                  <div>-</div>#}
-{#                {% endfor %}#}
-{#              </td>#}
-{#              <td data-title="{% translate 'Current Total' %}">#}
-{#                {% for data in x.balance_paid %}#}
-{#                  <div class="amount" data-original-value="{% currency_display amount=data.amount prefix=data.prefix suffix=data.suffix decimal_places=data.decimal_places %}"></div>#}
-{#                {% empty %}#}
-{#                  <div>-</div>#}
-{#                {% endfor %}#}
-{#              </td>#}
-{#              <td data-title="{% translate 'Final Total' %}">#}
-{#                {% for data in x.balance_total %}#}
-{#                  <div class="amount" data-original-value="{% currency_display amount=data.amount prefix=data.prefix suffix=data.suffix decimal_places=data.decimal_places %}"></div>#}
-{#                {% empty %}#}
-{#                  <div>-</div>#}
-{#                {% endfor %}#}
-{#              </td>#}
-{#            </tr>#}
-{#            {% endfor %}#}
-{#          </tbody>#}
-{#        </table>#}
-{#        </div>#}
-{#      </div>#}
-{#    </div>#}
-{#  </div>#}
   <div class="row row-cols-1 row-cols-xl-3 g-4 mb-3">
     {% for date, x in totals.items %}
     <div class="col">