{% load i18n daisy_theme %}
<div class="daisy-stat-card stats stats-vertical lg:stats-horizontal shadow-sm bg-base-100 border border-base-200 w-full mb-8">
  <!-- Stat 1: Applications -->
  <div class="stat">
    <div class="stat-figure text-primary">
      {% daisy_icon "folder" "w-8 h-8 opacity-80" %}
    </div>
    <div class="stat-title text-xs font-medium uppercase tracking-wider text-base-content/60">{% translate 'Applications' %}</div>
    <div class="stat-value text-primary text-2xl md:text-3xl font-extrabold">{{ app_list|length }}</div>
    <div class="stat-desc text-xs mt-0.5">{% translate 'Installed apps with admin access' %}</div>
  </div>

  <!-- Stat 2: Models -->
  <div class="stat">
    <div class="stat-figure text-secondary">
      {% daisy_icon "layers" "w-8 h-8 opacity-80" %}
    </div>
    <div class="stat-title text-xs font-medium uppercase tracking-wider text-base-content/60">{% translate 'Registered Models' %}</div>
    <div class="stat-value text-secondary text-2xl md:text-3xl font-extrabold">
      {% with model_count=0 %}
        {% for app in app_list %}
          {% if forloop.first %}{{ app.models|length }}{% endif %}
        {% empty %}
          0
        {% endfor %}
      {% endwith %}
    </div>
    <div class="stat-desc text-xs mt-0.5">{% translate 'Data models manageable here' %}</div>
  </div>

  <!-- Stat 3: User Status -->
  <div class="stat">
    <div class="stat-figure text-success">
      {% daisy_icon "user" "w-8 h-8 opacity-80" %}
    </div>
    <div class="stat-title text-xs font-medium uppercase tracking-wider text-base-content/60">{% translate 'Current Session' %}</div>
    <div class="stat-value text-success text-2xl md:text-3xl font-extrabold capitalize">{{ user.username }}</div>
    <div class="stat-desc text-xs mt-0.5">
      {% if user.is_superuser %}
        <span class="badge badge-xs badge-success text-[10px]">{% translate 'Superuser' %}</span>
      {% else %}
        <span class="badge badge-xs badge-info text-[10px]">{% translate 'Staff Member' %}</span>
      {% endif %}
    </div>
  </div>
</div>