<?php
/**
 * Fichier  : views/kits.php
 * Version  : 2.4.2
 * Description : Vue — Kits / Produits composés — titre dans appHeader uniquement
 */
?>
<div class="page-body" id="kitsPage">

  <div class="filters-bar" style="margin-bottom:var(--sp-4)">
    <div class="filters-section" style="flex:1">
      <div class="search-box">
        <svg class="search-box-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
          <circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/>
        </svg>
        <input class="form-input" id="kitSearch" placeholder="Rechercher (nom / SKU)…" />
      </div>
    </div>
    <div class="filters-section ml-auto">
      <button class="btn btn-ghost btn-sm" id="btnKitReload">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="14" height="14"><path d="M23 4v6h-6"/><path d="M1 20v-6h6"/><path d="M3.51 9a9 9 0 0114.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0020.49 15"/></svg>
        Rafraîchir
      </button>
      <button class="btn btn-primary" id="btnKitCreate">+ Nouveau kit</button>
    </div>
  </div>

  <div class="card">
    <div class="table-container">
      <table class="data-table" id="kitsTable">
        <thead>
          <tr>
            <th>Kit</th>
            <th>SKU</th>
            <th>Composants</th>
            <th style="width:120px">Statut</th>
            <th style="width:190px;text-align:right">Actions</th>
          </tr>
        </thead>
        <tbody></tbody>
      </table>
    </div>
  </div>

</div>
