<?php
// متغيرات: $customers, $stats, $filters, $page, $pages, $total
$tags = ['vip', 'returning', 'new'];
$tagColors = ['vip'=>'warning','returning'=>'success','new'=>'info'];
$tagLabels = [
    'vip'       => __('customers.tag.vip',       'VIP'),
    'returning' => __('customers.tag.returning',  'Returning'),
    'new'       => __('customers.tag.new',        'New'),
];
?>

<div class="content-wrapper">
<section class="content pt-3">
<div class="container-fluid pb-5">

    <!-- Header -->
    <div class="d-flex flex-wrap justify-content-between align-items-start gap-3 mb-4">
        <div>
            <h3 class="mb-1 fw-bold">
                <i class="bi bi-people-fill me-2 text-primary"></i>
                <?= __('customers.title', 'Customers') ?>
            </h3>
            <p class="text-muted mb-0 small"><?= __('customers.subtitle', 'Manage your confirmed customers base') ?></p>
        </div>
        <a href="/admin/customers/marketing" class="btn btn-success">
            <i class="bi bi-whatsapp me-2"></i>
            <?= __('customers.send_campaign', 'Send Campaign') ?>
        </a>
    </div>

    <!-- Stats -->
    <div class="row g-3 mb-4">
        <?php
        $statCards = [
            ['key'=>'total',        'label'=>__('customers.stat.total',     'Total Customers'), 'icon'=>'bi-people',       'color'=>'primary', 'border'=>'#0d6efd'],
            ['key'=>'new_customers','label'=>__('customers.stat.new',       'New Customers'),   'icon'=>'bi-person-plus',  'color'=>'info',    'border'=>'#0dcaf0'],
            ['key'=>'returning',    'label'=>__('customers.stat.returning', 'Returning'),       'icon'=>'bi-arrow-repeat', 'color'=>'success', 'border'=>'#198754'],
            ['key'=>'vip',          'label'=>__('customers.stat.vip',       'VIP (10+ orders)'),'icon'=>'bi-star-fill',    'color'=>'warning', 'border'=>'#ffc107'],
        ];
        foreach ($statCards as $sc):
        ?>
        <div class="col-6 col-lg-3">
            <div class="card border-0 shadow-sm h-100" style="border-top:3px solid <?= $sc['border'] ?> !important">
                <div class="card-body px-4 py-3">
                    <div class="d-flex justify-content-between align-items-start mb-2">
                        <div class="rounded-circle d-flex align-items-center justify-content-center bg-<?= $sc['color'] ?>-subtle"
                             style="width:42px;height:42px">
                            <i class="bi <?= $sc['icon'] ?> fs-5 text-<?= $sc['color'] ?>"></i>
                        </div>
                    </div>
                    <div class="fw-bold fs-2 lh-1 mb-1"><?= number_format((int)($stats[$sc['key']] ?? 0)) ?></div>
                    <div class="text-muted small"><?= $sc['label'] ?></div>
                </div>
            </div>
        </div>
        <?php endforeach; ?>
    </div>

    <!-- Filters -->
    <div class="card border-0 shadow-sm mb-3">
        <div class="card-body py-3">
            <form method="GET" action="/admin/customers" class="row g-2 align-items-end">
                <div class="col-md-4">
                    <input type="text" name="search" class="form-control form-control-sm"
                           placeholder="<?= __('customers.search_placeholder', 'Search by name or phone...') ?>"
                           value="<?= htmlspecialchars($filters['search'] ?? '') ?>">
                </div>
                <div class="col-md-2">
                    <select name="tag" class="form-select form-select-sm">
                        <option value=""><?= __('customers.all_tags', 'All tags') ?></option>
                        <option value="vip"       <?= ($filters['tag']??'') === 'vip'       ? 'selected':'' ?>><?= __('customers.tag.vip',      'VIP') ?></option>
                        <option value="returning" <?= ($filters['tag']??'') === 'returning' ? 'selected':'' ?>><?= __('customers.tag.returning', 'Returning') ?></option>
                        <option value="new"       <?= ($filters['tag']??'') === 'new'       ? 'selected':'' ?>><?= __('customers.tag.new',       'New') ?></option>
                    </select>
                </div>
                <div class="col-md-2">
                    <input type="number" name="min_orders" class="form-control form-control-sm"
                           placeholder="<?= __('customers.min_orders','Min orders') ?>"
                           value="<?= htmlspecialchars($filters['min_orders'] ?? '') ?>" min="0">
                </div>
                <div class="col-md-2">
                    <button type="submit" class="btn btn-sm btn-primary w-100">
                        <i class="bi bi-funnel me-1"></i><?= __('actions.filter','Filter') ?>
                    </button>
                </div>
                <?php if (array_filter($filters)): ?>
                <div class="col-md-2">
                    <a href="/admin/customers" class="btn btn-sm btn-outline-secondary w-100">
                        <i class="bi bi-x me-1"></i><?= __('actions.clear','Clear') ?>
                    </a>
                </div>
                <?php endif; ?>
            </form>
        </div>
    </div>

    <!-- Table -->
    <div class="card border-0 shadow-sm">
        <div class="card-header bg-white border-bottom d-flex justify-content-between align-items-center py-3">
            <h6 class="mb-0 fw-semibold">
                <i class="bi bi-list-ul me-2 text-muted"></i>
                <?= __('customers.list', 'Customer List') ?>
            </h6>
            <span class="badge bg-secondary rounded-pill"><?= number_format($total) ?></span>
        </div>
        <div class="card-body p-0">
            <div class="table-responsive">
                <table class="table table-hover align-middle mb-0">
                    <thead class="table-light">
                        <tr>
                            <th class="ps-3"><?= __('customers.col.name',       'Customer') ?></th>
                            <th><?= __('customers.col.phone',      'Phone') ?></th>
                            <th class="text-center"><?= __('customers.col.orders', 'Orders') ?></th>
                            <th class="text-end"><?= __('customers.col.spent',  'Total Spent') ?></th>
                            <th><?= __('customers.col.city',       'City') ?></th>
                            <th><?= __('customers.col.tags',       'Tags') ?></th>
                            <th><?= __('customers.col.last_order', 'Last Order') ?></th>
                            <th class="text-center"><?= __('actions.view', 'View') ?></th>
                        </tr>
                    </thead>
                    <tbody>
                    <?php if (empty($customers)): ?>
                        <tr>
                            <td colspan="8" class="text-center text-muted py-5">
                                <i class="bi bi-inbox display-4 d-block mb-2"></i>
                                <?= __('customers.empty', 'No customers found') ?>
                            </td>
                        </tr>
                    <?php else: ?>
                        <?php foreach ($customers as $c):
                            $custTags = array_filter(explode(',', $c['tags'] ?? ''));
                        ?>
                        <tr class="customer-row" style="cursor:pointer" onclick="window.location='/admin/customers/view/<?= (int)$c['id'] ?>'">
                            <td class="ps-3">
                                <a href="/admin/customers/view/<?= (int)$c['id'] ?>" class="fw-semibold text-decoration-none" onclick="event.stopPropagation()">
                                    <?= htmlspecialchars($c['full_name']) ?>
                                </a>
                                <div class="text-muted smaller">
                                    <?= __('customers.orders_since','since') ?>
                                    <?= date('d/m/Y', strtotime($c['first_order_at'])) ?>
                                </div>
                            </td>
                            <td>
                                <a href="https://wa.me/<?= ltrim($c['phone_normalized'],'+') ?>"
                                   target="_blank" class="text-decoration-none">
                                    <i class="bi bi-whatsapp text-success me-1"></i>
                                    <code class="small"><?= htmlspecialchars($c['phone']) ?></code>
                                </a>
                            </td>
                            <td class="text-center">
                                <span class="fw-bold <?= $c['orders_count'] >= 10 ? 'text-warning' : ($c['orders_count'] >= 2 ? 'text-success' : '') ?>">
                                    <?= (int)$c['orders_count'] ?>
                                </span>
                            </td>
                            <td class="text-end fw-semibold">
                                <?= number_format((float)$c['total_spent'], 0) ?>
                                <small class="text-muted"><?= __('finance.currency','DZD') ?></small>
                            </td>
                            <td class="text-muted small"><?= htmlspecialchars($c['city'] ?? '-') ?></td>
                            <td>
                                <?php foreach ($custTags as $tag): ?>
                                    <span class="badge bg-<?= $tagColors[$tag] ?? 'secondary' ?>-subtle
                                                 text-<?= $tagColors[$tag] ?? 'secondary' ?>
                                                 border border-<?= $tagColors[$tag] ?? 'secondary' ?>-subtle small">
                                        <?= $tagLabels[$tag] ?? htmlspecialchars($tag) ?>
                                    </span>
                                <?php endforeach; ?>
                            </td>
                            <td class="text-muted small"><?= date('d/m/Y', strtotime($c['last_order_at'])) ?></td>
                            <td class="text-center">
                                <a href="/admin/customers/view/<?= (int)$c['id'] ?>" class="btn btn-sm btn-outline-primary" onclick="event.stopPropagation()">
                                    <i class="bi bi-eye"></i>
                                </a>
                            </td>
                        </tr>
                        <?php endforeach; ?>
                    <?php endif; ?>
                    </tbody>
                </table>
            </div>
        </div>

        <!-- Pagination -->
        <?php if ($pages > 1): ?>
        <div class="card-footer bg-white border-top py-2 d-flex justify-content-center">
            <nav>
                <ul class="pagination pagination-sm mb-0">
                    <?php for ($i = 1; $i <= min($pages, 10); $i++): ?>
                    <li class="page-item <?= $i === $page ? 'active' : '' ?>">
                        <a class="page-link" href="?<?= http_build_query(array_merge($filters, ['page'=>$i])) ?>"><?= $i ?></a>
                    </li>
                    <?php endfor; ?>
                </ul>
            </nav>
        </div>
        <?php endif; ?>
    </div>

</div>
</section>
</div>