<section class="verifier-ingredients">
  <header class="verifier-ingredients-header">
    <p><strong>{{recette}}</strong> — <em>{{personnage}}</em></p>
  </header>

  {{#if ingredients.length}}
  <table class="verifier-ingredients-table">
    <thead>
      <tr>
        <th>Ingrédient</th>
        <th>Requis</th>
        <th>Possédé</th>
        <th>Statut</th>
      </tr>
    </thead>
    <tbody>
      {{#each ingredients as |ing|}}
      <tr class="verifier-ingredient-row {{#if ing.suffisant}}suffisant{{else}}insuffisant{{/if}}">
        <td class="ingredient-nom">{{ing.nom}}</td>
        <td class="ingredient-qty">{{ing.quantiteRequise}} {{ing.unite}}</td>
        <td class="ingredient-found">
          {{#if ing.present}}
          <span class="found-qty">{{ing.quantiteTrouvee}} {{ing.unite}}</span>
          {{#if ing.items}}
          <ul class="found-sources">
            {{#each ing.items as |src|}}
            <li>{{src.name}} ({{src.qty}})</li>
            {{/each}}
          </ul>
          {{/if}}
          {{else}}
          <span class="found-none">—</span>
          {{/if}}
        </td>
        <td class="ingredient-status">
          {{#if ing.suffisant}}
          <i class="fas fa-check-circle status-ok"></i>
          {{else}}
          <i class="fas fa-times-circle status-missing"></i>
          {{/if}}
        </td>
      </tr>
      {{/each}}
    </tbody>
  </table>

  <footer class="verifier-ingredients-footer">
    {{#if allOk}}
    <p class="result-success"><i class="fas fa-check-circle"></i> Tous les ingrédients sont disponibles en quantité suffisante.</p>
    {{else}}
    <p class="result-failure"><i class="fas fa-exclamation-triangle"></i> Certains ingrédients manquent ou sont en quantité insuffisante.</p>
    {{/if}}
  </footer>
  {{else}}
  <p class="result-empty">Cette recette ne définit aucun ingrédient.</p>
  {{/if}}
</section>
