{% extends 'base.html' %}
{% block content %}
<section class="section">
  <div class="container section-head split-head">
    <div>
      <h1>Partners and service providers</h1>
      <p>Bike vendors, bike repair, health support, guide services, and souvenir shops can participate in the platform.</p>
    </div>
    <a class="btn primary" href="{{ url_for('register_partner') }}">Register partner</a>
  </div>
</section>

<section class="section muted-bg">
  <div class="container">
    <div class="card-grid three">
      {% for service in services %}
      <article class="card compact">
        <span class="tag">{{ service.type }}</span>
        <h3>{{ service.name }}</h3>
        <p>{{ service.description }}</p>
        <small>{{ service.lat }}, {{ service.lng }}</small>
      </article>
      {% endfor %}
    </div>
  </div>
</section>

<section class="section">
  <div class="container two-col">
    <div class="card">
      <h2>Registered demo partners</h2>
      {% if partners %}
      <div class="table-wrap">
        <table>
          <thead>
            <tr><th>Business</th><th>Type</th><th>Plan</th><th>Location</th></tr>
          </thead>
          <tbody>
            {% for p in partners %}
            <tr>
              <td>{{ p.business_name }}</td>
              <td>{{ p.partner_type }}</td>
              <td>{{ p.fee_plan }}</td>
              <td>{{ p.lat }}, {{ p.lng }}</td>
            </tr>
            {% endfor %}
          </tbody>
        </table>
      </div>
      {% else %}
      <p>No custom partners submitted yet in this demo.</p>
      {% endif %}
    </div>
    <div class="card">
      <h2>Suggested partner locations</h2>
      <p>These are simple AI-style location suggestions based on service clustering and accessibility in the demo.</p>
      <button id="loadSuggestions" class="btn secondary" type="button">Load location suggestions</button>
      <div id="suggestionsResult" class="result-list"></div>
    </div>
  </div>
</section>
{% endblock %}