<div class="modal fade" id="childItemModal" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" >
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header  border-0 alert-info p-2">
                <h5 class="modal-title fw-bold fs-6">Manage Item</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form id="child-item-form" method="POST" enctype="multipart/form-data">
                <?= csrf_field() ?>
                    <input type="hidden" name="id">
                    <input type="hidden" name="block_id">
                    <input type="hidden" name="item_type">
                    <div class="mb-2 cards-stats-field">
                        <label class="form-label">Title</label>
                        <input type="text" class="form-control" name="title">
                    </div>
                    <div class="mb-2 stats-field">
                        <label class="form-label">Value</label>
                        <input type="text" class="form-control" name="value" placeholder="E.g 50">
                    </div>
                    <div class="mb-2 cards-stats-field">
                        <label class="form-label">Icon</label>
                        <input type="text" class="form-control" name="icon" placeholder="bi bi-star">
                    </div>
                    <div class="mb-2 cards-gallery-field">
                        <label class="form-label">Photo</label>
                        <input type="file" class="form-control" name="photo">
                        <div id="display-image"></div>
                    </div>
                    <div class="mb-2 gallery-field">
                        <label class="form-label">Caption</label>
                        <input type="text" class="form-control" name="caption">
                    </div>
                    <div class="mb-2 cards-stats-field">
                        <label class="form-label">Description</label>
                        <textarea class="form-control" name="description" rows="3"></textarea>
                    </div>
                    <div class="mb-2 cards-field">
                        <label class="form-label">Link</label>
                        <input type="text" class="form-control" name="link">
                    </div>
                </div>

                <div class="modal-footer">
                    <button type="button" class="btn btn-light" data-bs-dismiss="modal">Close</button>
                    <button type="submit" class="btn btn-danger sbtn">Save Item</button>
                </div>
            </form>
        </div>
    </div>
</div>
