{% extends 'base.html' %}
{% load i18n %}

{% block content %}
<div class="container-fluid py-4">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <h2 class="mb-0">{% trans "Accounting Dashboard" %}</h2>
        <div>
            <span class="badge bg-primary">{% trans "Financial Summary" %}</span>
        </div>
    </div>

    <!-- Summary Cards -->
    <div class="row g-3 mb-4">
        <div class="col-md-3">
            <div class="card border-0 shadow-sm h-100">
                <div class="card-body">
                    <h6 class="text-muted mb-2">{% trans "Total Assets" %}</h6>
                    <h3 class="mb-0 text-primary">{{ total_assets|floatformat:global_settings.decimal_places }} {{ global_settings.currency_symbol }}</h3>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card border-0 shadow-sm h-100">
                <div class="card-body">
                    <h6 class="text-muted mb-2">{% trans "Total Liabilities" %}</h6>
                    <h3 class="mb-0 text-danger">{{ total_liabilities|floatformat:global_settings.decimal_places }} {{ global_settings.currency_symbol }}</h3>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card border-0 shadow-sm h-100">
                <div class="card-body">
                    <h6 class="text-muted mb-2">{% trans "Monthly Revenue" %}</h6>
                    <h3 class="mb-0 text-success">{{ monthly_revenue|floatformat:global_settings.decimal_places }} {{ global_settings.currency_symbol }}</h3>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card border-0 shadow-sm h-100">
                <div class="card-body">
                    <h6 class="text-muted mb-2">{% trans "Monthly Net Profit" %}</h6>
                    <h3 class="mb-0 {% if net_profit >= 0 %}text-success{% else %}text-danger{% endif %}">
                        {{ net_profit|floatformat:global_settings.decimal_places }} {{ global_settings.currency_symbol }}
                    </h3>
                </div>
            </div>
        </div>
    </div>

    <!-- Quick Links -->
    <div class="row g-3 mb-4">
        <div class="col-md-12">
            <div class="card border-0 shadow-sm">
                <div class="card-body d-flex gap-2">
                    <a href="{% url 'chart_of_accounts' %}" class="btn btn-outline-primary">{% trans "Chart of Accounts" %}</a>
                    <a href="{% url 'journal_entries' %}" class="btn btn-outline-primary">{% trans "Journal Entries" %}</a>
                    <a href="{% url 'trial_balance' %}" class="btn btn-outline-info">{% trans "Trial Balance" %}</a>
                    <a href="{% url 'balance_sheet' %}" class="btn btn-outline-info">{% trans "Balance Sheet" %}</a>
                    <a href="{% url 'profit_loss' %}" class="btn btn-outline-info">{% trans "Profit & Loss" %}</a>
                </div>
            </div>
        </div>
    </div>

    <!-- Recent Journal Entries -->
    <div class="card border-0 shadow-sm">
        <div class="card-header bg-white py-3">
            <h5 class="card-title mb-0">{% trans "Recent Journal Entries" %}</h5>
        </div>
        <div class="table-responsive">
            <table class="table table-hover align-middle mb-0">
                <thead class="bg-light">
                    <tr>
                        <th>{% trans "Date" %}</th>
                        <th>{% trans "Reference" %}</th>
                        <th>{% trans "Description" %}</th>
                        <th>{% trans "Amount" %}</th>
                    </tr>
                </thead>
                <tbody>
                    {% for entry in recent_entries %}
                    <tr>
                        <td>{{ entry.date }}</td>
                        <td><code>{{ entry.reference }}</code></td>
                        <td>{{ entry.description }}</td>
                        <td>
                            {% with items=entry.items.all %}
                                {% for item in items %}
                                    {% if item.type == 'debit' %}
                                        <div class="text-nowrap">{{ item.amount|floatformat:global_settings.decimal_places }}</div>
                                    {% endif %}
                                {% endfor %}
                            {% endwith %}
                        </td>
                    </tr>
                    {% empty %}
                    <tr>
                        <td colspan="4" class="text-center py-4 text-muted">{% trans "No recent entries found." %}</td>
                    </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
</div>
{% endblock %}
