<?= $this->extend('layouts/dashboard') ?>

<?= $this->section('content') ?>
    <div class="space-y-6">
        <section class="page-header">
            <div>
                <p class="page-kicker">Children Master</p>
                <h2 class="section-title text-2xl"><?= esc($pageTitle) ?></h2>
                <p class="section-copy mt-2 max-w-3xl"><?= esc($pageDescription) ?></p>
            </div>
            <?php if ($canManage) : ?>
                <a href="<?= url_to('children.new') ?>" class="btn-primary">Adauga copil</a>
            <?php endif; ?>
        </section>

        <form method="get" class="surface-card p-5">
            <div class="grid gap-4 xl:grid-cols-[1.2fr_repeat(4,minmax(0,1fr))_auto]">
                <div>
                    <label class="mb-2 block text-xs font-semibold uppercase tracking-[0.16em] text-slate-500">Cautare</label>
                    <input type="text" name="q" value="<?= esc($filters['query']) ?>" class="form-input" placeholder="Copil, parinte sau grupa">
                </div>
                <?php if (! $filters['coach_locked']) : ?>
                    <div>
                        <label class="mb-2 block text-xs font-semibold uppercase tracking-[0.16em] text-slate-500">Trainer</label>
                        <select name="coach_id" class="form-select">
                            <option value="0">Toti trainerii</option>
                            <?php foreach ($filters['coach_options'] as $coach) : ?>
                                <option value="<?= esc((string) $coach['id']) ?>" <?= (int) $filters['selected_coach_id'] === (int) $coach['id'] ? 'selected' : '' ?>>
                                    <?= esc($coach['full_name']) ?>
                                </option>
                            <?php endforeach; ?>
                        </select>
                    </div>
                <?php endif; ?>
                <div>
                    <label class="mb-2 block text-xs font-semibold uppercase tracking-[0.16em] text-slate-500">Nivel</label>
                    <select name="level_id" class="form-select">
                        <option value="0">Toate nivelele</option>
                        <?php foreach ($filters['level_options'] as $level) : ?>
                            <option value="<?= esc((string) $level['id']) ?>" <?= (int) $filters['selected_level_id'] === (int) $level['id'] ? 'selected' : '' ?>>
                                <?= esc($level['name']) ?>
                            </option>
                        <?php endforeach; ?>
                    </select>
                </div>
                <div>
                    <label class="mb-2 block text-xs font-semibold uppercase tracking-[0.16em] text-slate-500">Grupa</label>
                    <select name="group_id" class="form-select">
                        <option value="0">Toate grupele</option>
                        <?php foreach ($filters['group_options'] as $group) : ?>
                            <option value="<?= esc((string) $group['id']) ?>" <?= (int) $filters['selected_group_id'] === (int) $group['id'] ? 'selected' : '' ?>>
                                <?= esc($group['name']) ?>
                            </option>
                        <?php endforeach; ?>
                    </select>
                </div>
                <div>
                    <label class="mb-2 block text-xs font-semibold uppercase tracking-[0.16em] text-slate-500">Status</label>
                    <select name="status" class="form-select">
                        <?php foreach ($filters['status_options'] as $key => $label) : ?>
                            <option value="<?= esc($key) ?>" <?= $filters['selected_status'] === $key ? 'selected' : '' ?>><?= esc($label) ?></option>
                        <?php endforeach; ?>
                    </select>
                </div>
                <div class="flex items-end gap-3">
                    <button type="submit" class="btn-primary w-full xl:w-auto">Filtreaza</button>
                    <a href="<?= url_to('children.index') ?>" class="btn-secondary w-full xl:w-auto">Reset</a>
                </div>
            </div>
            <?php if ($filters['coach_locked']) : ?>
                <div class="mt-4 rounded-2xl bg-slate-100 px-4 py-3 text-sm text-slate-500">
                    Vizualizarea este limitata la copiii asignati trainerului curent.
                </div>
            <?php endif; ?>
        </form>

        <section class="surface-card p-6">
            <div class="mb-4 flex items-start justify-between gap-4">
                <div>
                    <h3 class="section-title">Lista copii</h3>
                    <p class="section-copy">Scorul mediu si prezenta sunt calculate din evaluarile si sedintele existente in baza de date.</p>
                </div>
                <span class="rounded-full bg-slate-100 px-3 py-1 text-xs font-semibold uppercase tracking-[0.16em] text-slate-500">
                    <?= esc((string) count($children)) ?> rezultate
                </span>
            </div>

            <?php if ($children === []) : ?>
                <?= view('components/empty_state', [
                    'title' => 'Nu exista copii pentru filtrul curent',
                    'description' => 'Schimba filtrele sau adauga un copil nou pentru a popula lista.',
                ]) ?>
            <?php else : ?>
                <div class="table-shell">
                    <table>
                        <thead>
                            <tr>
                                <th>Nume complet</th>
                                <th>Data nasterii</th>
                                <th>Gen</th>
                                <th>Nivel</th>
                                <th>Grupa</th>
                                <th>Trainer</th>
                                <th>Status</th>
                                <th>Scor mediu</th>
                                <th>Prezenta</th>
                                <th>Actiuni</th>
                            </tr>
                        </thead>
                        <tbody>
                            <?php foreach ($children as $child) : ?>
                                <tr>
                                    <td>
                                        <a href="<?= url_to('children.show', $child['id']) ?>" class="font-semibold text-slate-900 hover:text-indigo-600">
                                            <?= esc($child['full_name']) ?>
                                        </a>
                                        <p class="mt-1 text-xs text-slate-400"><?= esc($child['guardian_name'] ?: 'Fara tutore principal') ?></p>
                                    </td>
                                    <td><?= esc($child['birth_date'] ?: '—') ?></td>
                                    <td><?= esc(gender_label($child['gender'])) ?></td>
                                    <td>
                                        <?php if (! empty($child['level_name'])) : ?>
                                            <span class="inline-flex rounded-full border px-3 py-1 text-xs font-semibold" style="<?= esc(level_chip_style($child['color_hex']), 'attr') ?>">
                                                <?= esc($child['level_name']) ?>
                                            </span>
                                        <?php else : ?>
                                            —
                                        <?php endif; ?>
                                    </td>
                                    <td><?= esc($child['group_name'] ?: '—') ?></td>
                                    <td><?= esc($child['coach_name'] ?: '—') ?></td>
                                    <td><?= view('components/status_badge', ['status' => strtoupper((string) $child['status'])]) ?></td>
                                    <td><?= esc($child['avg_score_label']) ?></td>
                                    <td><?= esc($child['attendance_label']) ?></td>
                                    <td>
                                        <div class="flex gap-2">
                                            <a href="<?= url_to('children.show', $child['id']) ?>" class="btn-ghost">Profil</a>
                                            <?php if ($canManage) : ?>
                                                <a href="<?= url_to('children.edit', $child['id']) ?>" class="btn-ghost">Edit</a>
                                            <?php endif; ?>
                                        </div>
                                    </td>
                                </tr>
                            <?php endforeach; ?>
                        </tbody>
                    </table>
                </div>
            <?php endif; ?>
        </section>
    </div>
<?= $this->endSection() ?>
