<?php require_once __DIR__ . '/_sidebar.php'; ?>
<main class="flex-1 py-16 md:py-0 md:pl-64">
    <div class="max-w-3xl mx-auto px-4 sm:px-6 lg:px-8 py-8 md:py-16">
        <div class="mb-8">
            <h1 class="text-2xl font-bold text-slate-900"><?= htmlspecialchars($pageTitle) ?></h1>
            <p class="text-sm text-slate-500 mt-1">Update project details for the portfolio.</p>
        </div>

        <div class="bg-white rounded-3xl border border-slate-200 shadow-sm p-8">
            <form method="post" action="<?= htmlspecialchars($baseUrl) ?><?= htmlspecialchars($formAction) ?>" class="space-y-6">
                <?= CSRF::input() ?>
                <?php if (!empty($project['id'])): ?>
                    <input type="hidden" name="id" value="<?= (int)$project['id'] ?>">
                <?php endif; ?>

                <div>
                    <label class="block text-sm font-semibold text-slate-900 mb-2">Project Name *</label>
                    <input type="text" name="name" required value="<?= htmlspecialchars($project['name'] ?? '') ?>" class="w-full rounded-2xl border border-slate-200 bg-slate-50/50 px-4 py-3 text-slate-900 focus:border-[#FF007A] focus:ring-2 focus:ring-[#FF007A]/20 focus:bg-white transition-all" placeholder="Project name">
                </div>

                <div>
                    <label class="block text-sm font-semibold text-slate-900 mb-2">Client Name</label>
                    <input type="text" name="client_name" value="<?= htmlspecialchars($project['client_name'] ?? '') ?>" class="w-full rounded-2xl border border-slate-200 bg-slate-50/50 px-4 py-3 text-slate-900 focus:border-[#FF007A] focus:ring-2 focus:ring-[#FF007A]/20 focus:bg-white transition-all" placeholder="Client or project name">
                </div>

                <div class="grid grid-cols-2 gap-5">
                    <div>
                        <label class="block text-sm font-semibold text-slate-900 mb-2">Status</label>
                        <select name="status" class="w-full rounded-2xl border border-slate-200 bg-slate-50/50 px-4 py-3 text-slate-900 focus:border-[#FF007A] focus:ring-2 focus:ring-[#FF007A]/20 focus:bg-white transition-all">
                            <?php foreach (['Planning','Procurement','Execution','Inspection','Completed'] as $opt): ?>
                                <option value="<?= $opt ?>" <?= (($project['status'] ?? 'Planning') === $opt) ? 'selected' : '' ?>><?= $opt ?></option>
                            <?php endforeach; ?>
                        </select>
                    </div>
                    <div>
                        <label class="block text-sm font-semibold text-slate-900 mb-2">Progress %</label>
                        <input type="number" name="progress" min="0" max="100" value="<?= (int)($project['progress'] ?? 0) ?>" class="w-full rounded-2xl border border-slate-200 bg-slate-50/50 px-4 py-3 text-slate-900 focus:border-[#FF007A] focus:ring-2 focus:ring-[#FF007A]/20 focus:bg-white transition-all">
                    </div>
                </div>

                <div class="grid grid-cols-2 gap-5">
                    <div>
                        <label class="block text-sm font-semibold text-slate-900 mb-2">Start Date</label>
                        <input type="date" name="start_date" value="<?= htmlspecialchars($project['start_date'] ?? '') ?>" class="w-full rounded-2xl border border-slate-200 bg-slate-50/50 px-4 py-3 text-slate-900 focus:border-[#FF007A] focus:ring-2 focus:ring-[#FF007A]/20 focus:bg-white transition-all">
                    </div>
                    <div>
                        <label class="block text-sm font-semibold text-slate-900 mb-2">End Date</label>
                        <input type="date" name="end_date" value="<?= htmlspecialchars($project['end_date'] ?? '') ?>" class="w-full rounded-2xl border border-slate-200 bg-slate-50/50 px-4 py-3 text-slate-900 focus:border-[#FF007A] focus:ring-2 focus:ring-[#FF007A]/20 focus:bg-white transition-all">
                    </div>
                </div>

                <div>
                    <label class="block text-sm font-semibold text-slate-900 mb-2">Notes</label>
                    <textarea name="notes" rows="3" class="w-full rounded-2xl border border-slate-200 bg-slate-50/50 px-4 py-3 text-slate-900 focus:border-[#FF007A] focus:ring-2 focus:ring-[#FF007A]/20 focus:bg-white transition-all resize-none" placeholder="Project notes..."><?= htmlspecialchars($project['notes'] ?? '') ?></textarea>
                </div>

                <div class="flex items-center gap-3 pt-2">
                    <a href="<?= htmlspecialchars($baseUrl) ?>/admin/projects" class="inline-flex items-center gap-2 px-6 py-3 rounded-full border border-slate-200 text-slate-700 font-semibold text-sm hover:bg-slate-50 transition">
                        Cancel
                    </a>
                    <button type="submit" class="inline-flex items-center gap-2 px-8 py-3 rounded-full bg-gradient-to-r from-[#FF007A] to-[#D87AA8] text-white font-semibold text-sm shadow-xl shadow-[#FF007A]/25 hover:shadow-2xl hover:shadow-[#FF007A]/40 hover:-translate-y-0.5 transition-all duration-300">
                        <span class="material-symbols-outlined text-base">save</span>
                        Save Project
                    </button>
                </div>
            </form>
        </div>
    </div>
</main>
</div>
