{% extends "base.html" %}

{% block content %}
<div class="bg-slate-900 px-6 py-4 shadow-sm border-b border-slate-800 flex items-center gap-4">
    <a href="{{ url_for('settings') }}" class="p-1 -ml-1 text-slate-400 hover:text-white"><i data-lucide="chevron-left"></i></a>
    <h1 class="font-bold text-slate-200 text-lg">Archived Tours</h1>
</div>

<div class="flex-1 overflow-y-auto p-6 space-y-4">
    {% if not tours %}
      <div class="text-center text-slate-500 py-10">
        No previous tours found.
      </div>
    {% else %}
      {% for item in tours %}
      <a href="{{ url_for('view_archive', tour_id=item.tour.id) }}" class="block bg-slate-900 p-5 rounded-2xl border border-slate-800 hover:bg-slate-800 transition-colors flex justify-between items-center">
        <div>
          <h3 class="font-bold text-white text-lg">{{ item.tour.name }}</h3>
          <div class="text-slate-400 text-sm mt-1 flex items-center gap-3">
            <span class="flex items-center gap-1"><i data-lucide="calendar" width="14"></i> {{ item.tour.start_date }}</span>
            <span class="flex items-center gap-1"><i data-lucide="dollar-sign" width="14"></i> {{ item.tour.currency }}{{ item.total_spent }}</span>
          </div>
        </div>
        <i data-lucide="chevron-right" class="text-slate-600"></i>
      </a>
      {% endfor %}
    {% endif %}
</div>
{% endblock %}