{% extends "base.html" %}
{% from '_featured_image.html' import featured_image_thumb %}
{% from '_archive.html' import show_archived_toggle %}
{% block content %}
<div class="actions">
  <a class="btn primary" href="/stations/new">+ Add station</a>
  {% if stations %}<span class="summary">{{ stations|length }} station{{ '' if stations|length == 1 else 's' }}</span>{% endif %}
  {{ show_archived_toggle(show_archived, '/stations') }}
</div>

{% if not stations %}
<p class="empty">No watering stations yet. Add a station and attach it to the areas it serves.</p>
{% endif %}

<ul class="station-list">
  {% for s in stations %}
  <li class="station-card{% if s.featured_image_path %} entity-card-with-thumb{% endif %}{% if s.is_archived %} is-archived{% endif %}">
    <a href="/stations/{{ s.id }}" class="station-card-link">
      {{ featured_image_thumb(s.featured_image_path, s.name) }}
      <div class="entity-card-body">
        <div class="station-card-header">
          <strong>{{ s.name }}</strong>
          <span class="chip">{{ counts.get(s.id, 0) }} area{{ '' if counts.get(s.id, 0) == 1 else 's' }}</span>
          {% if s.is_archived %}<span class="archived-chip">Archived</span>{% endif %}
        </div>
        {% if s.current_schedule %}<div class="station-card-schedule">{{ s.current_schedule }}</div>{% endif %}
        {% if s.notes %}<div class="note-preview">{{ s.notes[:160] }}{% if s.notes|length > 160 %}…{% endif %}</div>{% endif %}
      </div>
    </a>
  </li>
  {% endfor %}
</ul>
{% endblock %}