{% extends 'base.html' %}
{% block title %}Accounts{% endblock %}

{% block content %}
<div class="flex justify-between items-center mb-6">
  <h1 class="text-2xl font-bold">Accounts</h1>
  <a href="{% url 'finance:account_create' %}" class="btn btn-primary btn-sm">➕ Add Account</a>
</div>

<div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6">
  {% for account in accounts %}
  <a href="{% url 'finance:account_detail' account.pk %}" class="card bg-base-100 shadow hover:shadow-md transition-shadow">
    <div class="card-body">
      <div class="flex justify-between items-start">
        <div>
          <div class="font-bold">{{ account.name }}</div>
          <div class="badge badge-ghost badge-sm">{{ account.get_account_type_display }}</div>
        </div>
        <div class="text-right">
          <div class="text-xl font-bold text-primary">{{ business.currency }} {{ account.balance|floatformat:0 }}</div>
        </div>
      </div>
    </div>
  </a>
  {% endfor %}
</div>

<div class="text-base-content/60 text-sm">
  Total across all accounts: <strong>{{ business.currency }} {{ total_balance|floatformat:0 }}</strong>
</div>
{% endblock %}