<?= $this->extend('admin/layout') ?>

<?= $this->section('styles') ?>
<link href="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-lite.min.css" rel="stylesheet">
<?= $this->endSection() ?>

<?= $this->section('content') ?>

<div class="d-flex justify-content-between align-items-center mb-4">
    <h2 class="h3 text-gray-800 mb-0">Edit Product: <?= esc($product['name']) ?></h2>
    <a href="<?= base_url('admin/products') ?>" class="btn btn-secondary btn-sm"><i class="bi bi-arrow-left"></i> Back</a>
</div>

<div class="card shadow mb-4">
    <div class="card-body">
        <form action="<?= base_url('admin/products/edit/' . $product['id']) ?>" method="post" enctype="multipart/form-data">
            <?= csrf_field() ?>
            
            <div class="row">
                <div class="col-md-6 mb-3">
                    <label class="form-label">Product Name *</label>
                    <input type="text" class="form-control" name="name" value="<?= esc($product['name']) ?>" required>
                </div>
                <div class="col-md-6 mb-3">
                    <label class="form-label">Category *</label>
                    <select class="form-select" name="category_id" required>
                        <option value="">Select Category</option>
                        <?php foreach($categories as $cat): ?>
                            <option value="<?= $cat['id'] ?>" <?= $product['category_id'] == $cat['id'] ? 'selected' : '' ?>><?= esc($cat['name']) ?></option>
                        <?php endforeach; ?>
                    </select>
                </div>
            </div>

            <div class="mb-3">
                <label class="form-label">Short Description</label>
                <textarea name="short_description" class="form-control summernote" rows="3"><?= esc($product['short_description']) ?></textarea>
            </div>

            <div class="mb-3">
                <label class="form-label">Specifications (Detailed)</label>
                <textarea id="summernote" class="summernote" name="specifications"><?= htmlspecialchars($product['specifications']) ?></textarea>
            </div>

            <div class="row align-items-center">
                <div class="col-md-4 mb-3">
                    <label class="form-label">Featured Image</label>
                    <input type="file" class="form-control" name="featured_image" accept="image/*">
                </div>
                <div class="col-md-2 mb-3">
                    <?php if($product['featured_image']): ?>
                        <img src="<?= base_url('uploads/products/' . $product['featured_image']) ?>" class="img-thumbnail mt-2" width="100">
                    <?php endif; ?>
                </div>
                <div class="col-md-3 mb-3">
                    <label class="form-label">Status</label>
                    <select class="form-select" name="status">
                        <option value="1" <?= $product['status'] == 1 ? 'selected' : '' ?>>Active</option>
                        <option value="0" <?= $product['status'] == 0 ? 'selected' : '' ?>>Inactive</option>
                    </select>
                </div>
                <div class="col-md-3 mb-3">
                    <label class="form-label">Is Featured?</label>
                    <select class="form-select" name="is_featured">
                        <option value="0" <?= $product['is_featured'] == 0 ? 'selected' : '' ?>>No</option>
                        <option value="1" <?= $product['is_featured'] == 1 ? 'selected' : '' ?>>Yes</option>
                    </select>
                </div>
            </div>

            <h5 class="mb-3 border-bottom pb-2 mt-4">SEO Settings</h5>
            <div class="row mb-3">
                <div class="col-md-12 mb-3">
                    <label class="form-label">Meta Title</label>
                    <input type="text" class="form-control" name="meta_title" value="<?= esc($product['meta_title']) ?>">
                </div>
                <div class="col-md-12 mb-3">
                    <label class="form-label">Meta Description</label>
                    <textarea class="form-control" name="meta_description" rows="2"><?= esc($product['meta_description']) ?></textarea>
                </div>
            </div>

            <button type="submit" class="btn btn-primary" style="background-color: var(--primary-green); border-color: var(--primary-green);">Update Product</button>
        </form>
    </div>
</div>

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

<?= $this->section('scripts') ?>
<script src="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-lite.min.js"></script>
<script>
    $(document).ready(function() {
        $('#summernote').summernote({
            placeholder: 'Enter product specifications here...',
            tabsize: 2,
            height: 200,
            toolbar: [
                ['style', ['style']],
                ['font', ['bold', 'underline', 'clear']],
                ['color', ['color']],
                ['para', ['ul', 'ol', 'paragraph']],
                ['table', ['table']]
            ]
        });
    });
</script>
<?= $this->endSection() ?>
