{% extends 'admin/layout.html.twig' %}
{% block page_title %}Boutiques secondaires{% endblock %}
{% block breadcrumb %}
  <span class="sep">/</span>
  <a href="{{ path('admin_csiwo_index') }}" class="breadcrumb-link">CSIWO</a>
  <span class="sep">/</span>
  <span class="breadcrumb-text">Boutiques secondaires</span>
{% endblock %}
{% block header_action %}
  <a href="{{ path('admin_csiwo_secondary_shop_new') }}" class="btn btn-primary btn-sm">+ Ajouter un article</a>
{% endblock %}

{% block content %}
<style>
  .sshop-section-title {
    font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
    color: var(--muted); margin: 24px 0 10px;
  }
  .sshop-section-title:first-child { margin-top: 0; }
  .currency-badge {
    display: inline-block; font-size: .68rem; font-weight: 700; padding: 2px 8px;
    border-radius: 20px; letter-spacing: .04em; text-transform: uppercase;
  }
  .currency-badge.eloges  { background: rgba(227,179,65,.18); color: #e3b341; border: 1px solid rgba(227,179,65,.35); }
  .currency-badge.premium { background: rgba(163,113,247,.18); color: #a371f7; border: 1px solid rgba(163,113,247,.35); }
  .stock-badge { font-size: .78rem; color: var(--muted); }
  .stock-badge.out { color: #f85149; }
</style>

{% macro itemTable(items) %}
  {% if items is empty %}
    <p style="color:var(--muted);font-size:.84rem;font-style:italic">Aucun article.</p>
  {% else %}
    <table class="data-table">
      <thead>
        <tr>
          <th>Nom</th>
          <th>Monnaie</th>
          <th>Prix</th>
          <th>Objet lié</th>
          <th>Stock</th>
          <th>Actif</th>
          <th></th>
        </tr>
      </thead>
      <tbody>
        {% for s in items %}
          <tr>
            <td><strong>{{ s.name }}</strong></td>
            <td>
              <span class="currency-badge {{ s.currency }}">
                {{ s.currency == 'eloges' ? 'Éloges' : 'Crédits MM' }}
              </span>
            </td>
            <td>{{ s.price }}</td>
            <td>{{ s.item ? s.item.name : '—' }}</td>
            <td>
              {% if s.stock is null %}
                <span class="stock-badge">∞ illimité</span>
              {% elseif s.stock == 0 %}
                <span class="stock-badge out">Épuisé</span>
              {% else %}
                <span class="stock-badge">{{ s.stock }}</span>
              {% endif %}
            </td>
            <td>{{ s.active ? '✓' : '✗' }}</td>
            <td style="display:flex;gap:6px">
              <a href="{{ path('admin_csiwo_secondary_shop_edit', {id: s.id}) }}" class="btn btn-outline btn-sm">Modifier</a>
              <form method="POST" action="{{ path('admin_csiwo_secondary_shop_delete', {id: s.id}) }}" onsubmit="return confirm('Supprimer cet article ?')">
                <button type="submit" class="btn btn-danger btn-sm">Supprimer</button>
              </form>
            </td>
          </tr>
        {% endfor %}
      </tbody>
    </table>
  {% endif %}
{% endmacro %}

<div class="section">
  <div class="sshop-section-title">Boutique PVP (Éloges)</div>
  {{ _self.itemTable(elogesItems) }}
</div>

<div class="section" style="margin-top:24px">
  <div class="sshop-section-title">MasterBoutique (Crédits MasterMoney)</div>
  {{ _self.itemTable(premiumItems) }}
</div>

{% endblock %}