<?= $this->extend('layouts/main') ?>
<?= $this->section('content') ?>

<?php $lookups = new \Config\Lookups(); $roleMeta = $lookups->staffRoles[$user->role] ?? ['label' => ucfirst($user->role), 'badge' => 'secondary']; ?>

<div class="mb-3">
    <h1 class="h3 mb-1">My Profile</h1>
    <p class="text-muted mb-0">Your own account details — visible only to you. A manager can see your Staff Profile under Staff, but this page is where you keep your own info current.</p>
</div>

<div class="row g-3">
    <div class="col-lg-4">
        <div class="card shadow-sm">
            <div class="card-body text-center">
                <?php if ($user->photo_path): ?>
                    <img src="<?= site_url('uploads/' . $user->photo_path) ?>" alt="" class="rounded-circle mb-3" style="width: 96px; height: 96px; object-fit: cover;">
                <?php else: ?>
                    <?php
                        $words = preg_split('/\s+/', trim($user->full_name));
                        $initials = strtoupper(($words[0][0] ?? '') . ($words[count($words) - 1][0] ?? ''));
                    ?>
                    <div class="rounded-circle mx-auto mb-3 d-flex align-items-center justify-content-center" style="width: 96px; height: 96px; background: var(--brand); color: #fff; font-weight: 700; font-size: 1.6rem;"><?= esc($initials) ?></div>
                <?php endif; ?>
                <h2 class="h5 mb-1"><?= esc($user->full_name) ?></h2>
                <span class="badge bg-<?= esc($roleMeta['badge']) ?>"><?= esc($roleMeta['label']) ?></span>
                <p class="text-muted small mt-2 mb-3">Staff since <?= esc(date('d M Y', strtotime($user->created_at))) ?></p>

                <form action="<?= site_url('profile/photo') ?>" method="post" enctype="multipart/form-data">
                    <?= csrf_field() ?>
                    <input type="file" class="form-control form-control-sm mb-2" name="photo" accept="image/png,image/jpeg,image/webp">
                    <button type="submit" class="btn btn-sm btn-outline-primary w-100"><i class="bi bi-camera me-1"></i>Update Photo</button>
                </form>
            </div>
        </div>
    </div>

    <div class="col-lg-8">
        <div class="card shadow-sm mb-3">
            <div class="card-body">
                <h2 class="h6 mb-3">Personal Information</h2>
                <form action="<?= site_url('profile') ?>" method="post">
                    <?= csrf_field() ?>
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label class="form-label small">Full Name</label>
                            <input type="text" class="form-control" name="full_name" value="<?= esc($user->full_name) ?>" required>
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label small">Role</label>
                            <input type="text" class="form-control" value="<?= esc($roleMeta['label']) ?>" disabled>
                            <div class="form-text">Only a manager can change your role, under Staff.</div>
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label small">Email</label>
                            <input type="email" class="form-control" name="email" value="<?= esc($user->email) ?>" required>
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label small">Phone</label>
                            <input type="text" class="form-control" name="phone" value="<?= esc($user->phone) ?>" placeholder="e.g. 024 123 4567">
                        </div>
                    </div>
                    <button type="submit" class="btn btn-primary">Save Changes</button>
                </form>
            </div>
        </div>

        <div class="card shadow-sm">
            <div class="card-body">
                <h2 class="h6 mb-1">Change Password</h2>
                <p class="text-muted small">Choose a password you don't use anywhere else — at least 8 characters.</p>
                <form action="<?= site_url('profile/change-password') ?>" method="post">
                    <?= csrf_field() ?>
                    <div class="row">
                        <div class="col-md-4 mb-3">
                            <label class="form-label small">Current Password</label>
                            <input type="password" class="form-control" name="current_password" required>
                        </div>
                        <div class="col-md-4 mb-3">
                            <label class="form-label small">New Password</label>
                            <input type="password" class="form-control" name="new_password" minlength="8" required>
                        </div>
                        <div class="col-md-4 mb-3">
                            <label class="form-label small">Confirm New Password</label>
                            <input type="password" class="form-control" name="confirm_password" minlength="8" required>
                        </div>
                    </div>
                    <button type="submit" class="btn btn-outline-primary">Change Password</button>
                </form>
            </div>
        </div>
    </div>
</div>

<?= $this->endSection() ?>
