<div class="d-flex justify-content-between align-items-center mb-4">
    <div>
        <h1 class="darlink-title mb-1">
            <i class="bi bi-people me-2"></i>Clients
        </h1>
        <p class="text-muted mb-0"><?= (int) $totalClients ?> client(s) actif(s)</p>
    </div>
    <div class="d-flex gap-2">

        <a href="index.php?page=clients_create" class="btn darlink-btn-primary">
            <i class="bi bi-plus-lg me-1"></i> Nouveau client
        </a>
    </div>
</div>

<div class="darlink-card darlink-table-card">
    <div class="darlink-table-toolbar">
<div class="darlink-table-toolbar-left">
    <div class="darlink-table-search">
        <i class="bi bi-search"></i>
        <input type="text" id="clientSearch" placeholder="Rechercher un client...">
    </div>

    <select class="darlink-table-filter">
        <option>Type</option>
        <option>Hôtel</option>
        <option>Restaurant</option>
        <option>Standard</option>
    </select>

    <select class="darlink-table-filter">
        <option>Ville</option>
        <option>Marrakech</option>
        <option>Rabat</option>
    </select>
</div>

<div class="darlink-table-toolbar-right">
    <button type="button" class="darlink-toolbar-btn" onclick="location.reload();">
        <i class="bi bi-arrow-clockwise"></i> Actualiser
    </button>

    <a href="index.php?page=clients_import" class="darlink-toolbar-btn">
        <i class="bi bi-file-earmark-excel"></i> Importer
    </a>
</div>
    </div>

    <div class="table-responsive darlink-table-wrapper">
        <table class="table align-middle darlink-table darlink-table-modern" id="clientsTable">
            <thead>
            <tr>
				<th class="darlink-sortable" data-column="0">Code <span class="sort-indicator">↕</span></th>
				<th class="darlink-sortable" data-column="1">Type <span class="sort-indicator">↕</span></th>
				<th class="darlink-sortable" data-column="2">Raison sociale <span class="sort-indicator">↕</span></th>
				<th class="darlink-sortable" data-column="3">Contact <span class="sort-indicator">↕</span></th>
				<th class="darlink-sortable" data-column="4">Ville <span class="sort-indicator">↕</span></th>
				<th class="darlink-sortable" data-column="5">Téléphone <span class="sort-indicator">↕</span></th>
				<th class="darlink-sortable" data-column="6">Mobile <span class="sort-indicator">↕</span></th>
                <th class="text-end">Actions</th>
            </tr>
            </thead>
            <tbody>
            <?php if (empty($clients)): ?>
                <tr>
                    <td colspan="8" class="text-center text-muted py-5">
                        Aucun client enregistré pour le moment.
                    </td>
                </tr>
            <?php endif; ?>

            <?php foreach ($clients as $client): ?>
                <tr data-edit-url="index.php?page=clients_edit&id=<?= (int)$client['id'] ?>">
                    <td>
                        <strong class="darlink-table-code">
                            <?= htmlspecialchars($client['code_client']) ?>
                        </strong>
                    </td>
                    <td>
                        <span class="darlink-badge darlink-badge-light">
                            <?= htmlspecialchars(($client['type_client'] ?? '-') === '-' || empty($client['type_client']) ? 'Standard' : $client['type_client']) ?>
                        </span>
                    </td>
                    <td class="fw-semibold">
                        <?= htmlspecialchars($client['raison_sociale']) ?>
                    </td>
                    <td><?= htmlspecialchars($client['contact'] ?: '-') ?></td>
                    <td><?= htmlspecialchars($client['ville'] ?: '-') ?></td>
                    <td><?= htmlspecialchars($client['telephone'] ?: '-') ?></td>
                    <td><?= htmlspecialchars($client['mobile'] ?: '-') ?></td>
                    <td class="text-end darlink-actions">
                        <a class="darlink-icon-btn darlink-icon-btn-view"
                           href="index.php?page=clients_show&id=<?= (int) $client['id'] ?>"
                           title="Voir">
                            <i class="bi bi-eye"></i>
                        </a>

                        <a class="darlink-icon-btn darlink-icon-btn-edit"
                           href="index.php?page=clients_edit&id=<?= (int) $client['id'] ?>"
                           title="Modifier">
                            <i class="bi bi-pencil"></i>
                        </a>

                        <form method="post"
                              action="index.php?page=clients_deactivate"
                              class="d-inline"
                              onsubmit="return confirm('Désactiver ce client ?');">
                            <input type="hidden" name="id" value="<?= (int) $client['id'] ?>">
                            <button class="darlink-icon-btn darlink-icon-btn-delete"
                                    type="submit"
                                    title="Désactiver">
                                <i class="bi bi-person-x"></i>
                            </button>
                        </form>
                    </td>
                </tr>
            <?php endforeach; ?>
            </tbody>
        </table>
    </div>
</div>