<div class="d-flex justify-content-between align-items-center mb-4">
    <div>
        <h3 class="mb-1"><?= e($event['title_en']) ?> <small class="text-muted">(<?= e($event['event_code']) ?>)</small></h3>
        <?php if ($event['title_ar']): ?><p class="text-muted mb-0" dir="rtl"><?= e($event['title_ar']) ?></p><?php endif; ?>
    </div>
    <div class="d-flex gap-2">
        <?= status_badge($event['status']) ?>
        <?php if (auth_can('events.manage')): ?>
        <a href="/events/<?= $event['id'] ?>/edit" class="btn btn-warning btn-sm"><i class="fas fa-edit me-1"></i>Edit</a>
        <?php endif; ?>
    </div>
</div>

<div class="row g-3">
    <div class="col-md-8">
        <div class="card mb-3">
            <div class="card-header"><h6 class="mb-0">Event Details</h6></div>
            <div class="card-body">
                <div class="row g-2">
                    <div class="col-md-4"><strong>Type:</strong> <span class="badge bg-secondary"><?= e(ucfirst($event['event_type'])) ?></span></div>
                    <div class="col-md-4"><strong>Venue:</strong> <?= e($event['facility_name_en'] ?? $event['location'] ?? '-') ?></div>
                    <div class="col-md-4"><strong>Attendees:</strong> <?= $event['current_attendees'] ?><?= $event['max_attendees'] ? '/' . $event['max_attendees'] : '' ?></div>
                    <div class="col-md-6"><strong>Start:</strong> <?= format_datetime($event['start_datetime']) ?></div>
                    <div class="col-md-6"><strong>End:</strong> <?= $event['end_datetime'] ? format_datetime($event['end_datetime']) : '-' ?></div>
                    <div class="col-md-4"><strong>Member Fee:</strong> <?= format_money($event['member_fee']) ?></div>
                    <div class="col-md-4"><strong>Guest Fee:</strong> <?= format_money($event['guest_fee']) ?></div>
                    <div class="col-md-4"><strong>Guests Allowed:</strong> <?= $event['allow_guests'] ? 'Yes' : 'No' ?></div>
                    <?php if ($event['description_en']): ?><div class="col-12 mt-2"><strong>Description:</strong><p><?= nl2br(e($event['description_en'])) ?></p></div><?php endif; ?>
                </div>
            </div>
        </div>

        <div class="card">
            <div class="card-header d-flex justify-content-between align-items-center">
                <h6 class="mb-0">Registrations (<?= count($registrations) ?>)</h6>
                <?php if (auth_can('events.manage') && in_array($event['status'], ['planned', 'registration_open'])): ?>
                <button class="btn btn-sm btn-primary" data-bs-toggle="modal" data-bs-target="#registerModal"><i class="fas fa-user-plus me-1"></i>Register Member</button>
                <?php endif; ?>
            </div>
            <div class="card-body p-0">
                <?php if (empty($registrations)): ?>
                <div class="text-center text-muted py-4">No registrations yet.</div>
                <?php else: ?>
                <div class="table-responsive">
                    <table class="table table-sm table-hover mb-0">
                        <thead><tr><th>Member</th><th>Attendees</th><th>Fee</th><th>Date</th><th>Status</th><th>Actions</th></tr></thead>
                        <tbody>
                        <?php foreach ($registrations as $r): ?>
                        <tr>
                            <td><?= e($r['member_name'] ?? '-') ?> <small class="text-muted"><?= e($r['membership_number'] ?? '') ?></small></td>
                            <td><?= $r['total_attendees'] ?></td>
                            <td><?= format_money($r['total_fee']) ?></td>
                            <td><?= format_datetime($r['registration_date']) ?></td>
                            <td><?= status_badge($r['status']) ?></td>
                            <td>
                                <?php if ($r['status'] !== 'attended' && auth_can('events.manage')): ?>
                                <form method="POST" action="/events/<?= $event['id'] ?>/checkin" class="d-inline" data-ajax="true">
                                    <?= csrf_field() ?>
                                    <input type="hidden" name="registration_id" value="<?= $r['id'] ?>">
                                    <button type="submit" class="btn btn-sm btn-success" title="Check In"><i class="fas fa-check"></i></button>
                                </form>
                                <?php endif; ?>
                            </td>
                        </tr>
                        <?php endforeach; ?>
                        </tbody>
                    </table>
                </div>
                <?php endif; ?>
            </div>
        </div>
    </div>
    <div class="col-md-4">
        <div class="card"><div class="card-body text-center">
            <i class="fas fa-calendar-alt fa-3x text-primary mb-2"></i>
            <h5><?= date('M d', strtotime($event['start_datetime'])) ?></h5>
            <p class="text-muted"><?= date('l, Y', strtotime($event['start_datetime'])) ?></p>
            <?php if ($event['start_datetime']): ?>
            <p><i class="fas fa-clock me-1"></i><?= date('H:i', strtotime($event['start_datetime'])) ?><?= $event['end_datetime'] ? ' - ' . date('H:i', strtotime($event['end_datetime'])) : '' ?></p>
            <?php endif; ?>
        </div></div>
    </div>
</div>

<!-- Register Modal -->
<div class="modal fade" id="registerModal" tabindex="-1"><div class="modal-dialog"><div class="modal-content">
    <div class="modal-header"><h5 class="modal-title">Register Member</h5><button type="button" class="btn-close" data-bs-dismiss="modal"></button></div>
    <div class="modal-body">
        <form method="POST" action="/events/<?= $event['id'] ?>/register" data-ajax="true" id="register-form">
            <?= csrf_field() ?>
            <div class="mb-3">
                <label class="form-label">Member <span class="text-danger">*</span></label>
                <select name="member_id" class="form-select select2" data-placeholder="Search member..." required></select>
            </div>
            <?php if ($event['allow_guests']): ?>
            <div class="mb-3">
                <label class="form-label">Number of Guests</label>
                <input type="number" name="guest_count" class="form-control" value="0" min="0" max="<?= $event['max_guests_per_member'] ?? 10 ?>">
            </div>
            <?php endif; ?>
            <div class="mb-3"><label class="form-label">Notes</label><textarea name="notes" class="form-control" rows="2"></textarea></div>
            <button type="submit" class="btn btn-primary"><i class="fas fa-user-plus me-1"></i>Register</button>
        </form>
    </div>
</div></div></div>

<?php $__view->push('scripts') ?>
<script>
document.addEventListener('DOMContentLoaded', function() {
    $('#registerModal select.select2').select2({
        theme: 'bootstrap-5', width: '100%', dropdownParent: $('#registerModal'), minimumInputLength: 2,
        ajax: {
            url: '/api/members/search', dataType: 'json', delay: 300,
            data: function(p) { return { q: p.term }; },
            processResults: function(d) { return { results: d.map(m => ({ id: m.id, text: m.membership_number + ' - ' + m.text })) }; }
        }
    });
});
</script>
<?php $__view->endPush() ?>