    <div class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <div class="img-profile ml-3 mt-3">

                    </div>
                    <h1 class="m-0 text-dark"><?php echo (isset($book)) ? 'Edit Book' : 'Add Book' ?>
                    </h1>

                </div>
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item"><a href="<?= base_url(); ?>dashboard/books">Books</a></li>
                        <li class="breadcrumb-item active"><?php echo (isset($book)) ? 'Edit Book' : 'Add Book' ?></li>
                    </ol>
                </div>
            </div>
        </div>
    </div>
    <?php
      if(isset($book)){
        $endpoint = 'updatebook';
      }else{
        $endpoint = 'insertbook';
      }
    ?>
    <form method="post" id="add_driver" class="card" action="<?php echo base_url() . 'dashboard/'.$endpoint; ?>" enctype="multipart/form-data">
        <section class="content">
            <div class="container-fluid">
                <div class="card-body">

                    <div class="row">
                        <input type="hidden" name="id" id="id" value="<?php echo $id; ?>">

                        <div class="col-sm-6 col-md-12">
                            <label class="form-label">Title<span class="form-required">*</span></label>
                            <div class="form-group">
                                <input type="text" name="title" id="title" class="form-control" placeholder="Title" required value="<?=$book['title']?>">
                            </div>
                        </div>
                        <div class="col-sm-12 col-md-12">
                            <div class="form-group">
                                <label class="form-label">Description<span class="form-required">*</span></label>
                                <textarea rows="5" name="description" id="description" placeholder="Description" class="form-control" required><?=$book['description']?></textarea>
                            </div>
                        </div>
                        <?php /* 

                        <div class="col-sm-12 col-md-12 ">
                            <div class="form-group">
                                <label class="form-label">Coaches<span class="form-required">*</span></label>
                                <select id="coachesId" name="coachesId" class="form-control"  required="">
                                  
                                 
                                    <?php
                                      foreach($coach as $key => $category){
                                    ?>
                        <option value="<?=$key?>"><?=$category['name']?></option>
                        <?php } ?>
                        </select>
                    </div>
                </div>
                */
                ?>
                <div class="col-sm-6 col-md-6">
                    <div class="form-group">
                        <label class="form-label">Category<span class="form-required">*</span></label>
                        <select id="categoryId" name="categoryId[]" class="form-control multiselect" multiple required="">


                            <?php
                                    foreach ($categories as $key => $category) {
                                    ?>
                            <option value="<?= $key ?>"><?= $category['title'] ?></option>
                            <?php } ?>
                        </select>
                    </div>
                </div>

                <div class="col-sm-6 col-md-6">
                    <div class="form-group">
                        <label class="form-label">Featured Image</label>

                        <input type="file" name="image" class="form-control" accept="image/*" required>
                    </div>
                </div>
                <div class="col-sm-12 col-md-12 mt-3" style="display: block;" id="teamsSec">

                    <div class="form-group">
                        <label class="form-label">Audio File Type<span class="form-required">*</span></label>
                        <input type="text" name="fileType" class="form-control" placeholder="File Type" required>
                    </div>

                    <div class="form-group">
                        <label class="form-label">Book Type<span class="form-required">*</span></label>
                        <input type="text" name="bookType" class="form-control" placeholder="Book Type" required>
                    </div>

                    <div class="form-group">
                        <label class="form-label">Authors<span class="form-required">*</span></label>
                        <select id="coauthors" name="coauthors[]" class="form-control multiselect" multiple>
                            <?php
                            foreach ($authors as $key => $author) {
                            ?>
                            <option value="<?= $author['name'] ?>"><?= $author['name'] ?></option>
                            <?php } ?>
                        </select>
                    </div>



                    <div class="form-group">
                        <label class="form-label">Narrators<span class="form-required">*</span></label>
                        <select id="narrators" name="narrators[]" class="form-control multiselect" multiple>
                            <?php
                            foreach ($narrators as $key => $narrator) {
                            ?>
                            <option value="<?= $narrator['name'] ?>"><?= $narrator['name'] ?></option>
                            <?php } ?>

                        </select>
                    </div>



                    <div class="form-group">
                        <label class="form-label">Publishers<span class="form-required">*</span></label>
                        <select id="publishers" name="publishers[]" class="form-control multiselect" multiple>
                            <?php
                            foreach ($publishers as $key => $publisher) {
                            ?>
                            <option value="<?= $publisher['name'] ?>"><?= $publisher['name'] ?></option>
                            <?php } ?>

                        </select>
                    </div>
                </div>

                <div class="col-sm-12 col-md-12 mt-3">
                    <p>Graphics and Art Work</p>
                    <div id="artworkSection">
                        <div class="artwork-entry row mb-3">
                            <div class="col-md-5">
                                <label class="form-label">Art Work Name</label>
                                <input type="text" name="artwork_name[]" class="form-control" placeholder="Enter Art Work Name" required>
                            </div>
                            <div class="col-md-5">
                                <label class="form-label">Art Work File</label>
                                <input type="file" name="artwork_file[]" class="form-control" accept="image/*" required>
                            </div>
                            <div class="col-md-2 d-flex align-items-end">
                                <button type="button" class="btn btn-success add-entry" data-target="#artworkSection"><i class="fas fa-plus"></i> Add</button>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-sm-12 col-md-12 mt-3">
                    <p>Front Matters</p>
                    <div id="frontMatterSection">
                        <div class="matter-entry row mb-3">
                            <div class="col-md-4">
                                <label class="form-label">Matter Name</label>
                                <input type="text" name="front_matter_name[]" class="form-control" placeholder="Enter Matter Name" required>
                            </div>
                            <div class="col-md-3">
                                <label class="form-label">Text File <small>(txt,pdf,docx)</small></label>
                                <input type="file" name="front_matter_text_file[]" class="form-control" accept=".txt,.docx,.pdf" required>
                            </div>
                            <div class="col-md-3">
                                <label class="form-label">Sound File <small>(mp3,mp4)</small></label>
                                <input type="file" name="front_matter_sound_file[]" class="form-control" accept="audio/*" required>
                            </div>
                            <div class="col-md-2 d-flex align-items-end">
                                <button type="button" class="btn btn-success add-entry" data-target="#frontMatterSection"><i class="fas fa-plus"></i> Add</button>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-sm-12 col-md-12 mt-3">
                    <p>Body Matters</p>
                    <div id="bodyMatterSection">
                        <div class="matter-entry row mb-3">
                            <div class="col-md-4">
                                <label class="form-label">Matter Name</label>
                                <input type="text" name="body_matter_name[]" class="form-control" placeholder="Enter Matter Name" required>
                            </div>
                            <div class="col-md-3">
                                <label class="form-label">Text File <small>(txt,pdf,docx)</small></label>
                                <input type="file" name="body_matter_text_file[]" class="form-control" accept=".txt,.docx,.pdf" required>
                            </div>
                            <div class="col-md-3">
                                <label class="form-label">Sound File <small>(mp3,mp4)</small></label>
                                <input type="file" name="body_matter_sound_file[]" class="form-control" accept="audio/*" required>
                            </div>
                            <div class="col-md-2 d-flex align-items-end">
                                <button type="button" class="btn btn-success add-entry" data-target="#bodyMatterSection"><i class="fas fa-plus"></i> Add</button>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-sm-12 col-md-12 mt-3">
                    <p>Back Matters</p>
                    <div id="backMatterSection">
                        <div class="matter-entry row mb-3">
                            <div class="col-md-4">
                                <label class="form-label">Matter Name</label>
                                <input type="text" name="back_matter_name[]" class="form-control" placeholder="Enter Matter Name" required>
                            </div>
                            <div class="col-md-3">
                                <label class="form-label">Text File <small>(txt,pdf,docx)</small></label>
                                <input type="file" name="back_matter_text_file[]" class="form-control" accept=".txt,.docx,.pdf" required>
                            </div>
                            <div class="col-md-3">
                                <label class="form-label">Sound File <small>(mp3,mp4)</small></label>
                                <input type="file" name="back_matter_sound_file[]" class="form-control" accept="audio/*" required>
                            </div>
                            <div class="col-md-2 d-flex align-items-end">
                                <button type="button" class="btn btn-success add-entry" data-target="#backMatterSection"><i class="fas fa-plus"></i> Add</button>
                            </div>
                        </div>
                    </div>
                </div>

            </div>








            </div>

            </div>

            </div>
        </section>
        <section class="content">
            <div class="container-fluid">
                <div class="card-footer text-right">
                    <button type="submit" id="submit" class="btn btn-primary"> <?php echo (isset($book) && isset($book)) ? 'Update Book' : 'Add Book' ?></button>
                </div>
            </div>
        </section>
    </form>

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">

    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>


    <script>
$(document).ready(function() {
    // Add new entry (Artwork or Matter)
    $(".add-entry").click(function() {
        let target = $(this).data("target"); // Get target section
        let fileName = '';
        if (target == '#frontMatterSection') {
            fileName = 'front_matter';
        } else if (target == '#bodyMatterSection') {
            fileName = 'body_matter';

        } else if (target == '#backMatterSection') {
            fileName = 'back_matter';

        }

        // Define HTML structure based on section type
        let newEntry = "";
        if (target === "#artworkSection") {
            newEntry = `
                <div class="artwork-entry row mb-3">
                    <div class="col-md-5">
                        <input type="text" name="artwork_name[]" class="form-control" placeholder="Enter Art Work Name" required>
                    </div>
                    <div class="col-md-5">
                        <input type="file" name="artwork_file[]" class="form-control" accept="image/*" required>
                    </div>
                    <div class="col-md-2 d-flex align-items-end">
                        <button type="button" class="btn btn-danger remove-entry"><i class="fas fa-trash"></i> Remove</button>
                    </div>
                </div>`;
        } else {
            newEntry = `
                <div class="matter-entry row mb-3">
                    <div class="col-md-4">
                        <input type="text" name="${fileName}_name[]" class="form-control" placeholder="Enter Matter Name" required>
                    </div>
                    <div class="col-md-3">
                        <input type="file" name="${fileName}_text_file[]" class="form-control" accept=".txt,.docx,.pdf" required>
                    </div>
                    <div class="col-md-3">
                        <input type="file" name="${fileName}_sound_file[]" class="form-control" accept="audio/*" required>
                    </div>
                    <div class="col-md-2 d-flex align-items-end">
                        <button type="button" class="btn btn-danger remove-entry"><i class="fas fa-trash"></i> Remove</button>
                    </div>
                </div>`;
        }

        $(target).append(newEntry);
    });

    // Remove entry
    $(document).on("click", ".remove-entry", function() {
        $(this).closest(".row").remove();
    });
});

function showRadios() {

    $("#teamsSec").hide();
    if (document.getElementById('isPro').checked) {
        $("#radiosSec").show();
        $("#specificTeams").prop('checked', false);
        $("#allTeams").prop('checked', true);
    } else {
        $("#radiosSec").hide();
    }
}

function showTeams() {

    if (document.getElementById('specificTeams').checked) {
        $("#teamsSec").show();
    } else {
        $("#teamsSec").hide();
    }
}
    </script>