<div class="modal modal-blur fade" id="modalDewormingCatalog" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
        <form class="modal-content" method="post" action="/animal/add-deworming">
            <div class="modal-header">
                <h5 class="modal-title"><?= h(t('deworm.catalog_record')) ?></h5><button type="button" class="btn-close"
                    data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body"><input type="hidden" name="animal_id" value="<?= (int)$animal['id'] ?>">
                <div class="row g-3">
                    <div class="col-md-6"><label class="form-label"><?= h(t('common.date')) ?></label><input
                            class="form-control" type="date" name="administered_on" value="<?= date('Y-m-d') ?>"
                            required></div>
                    <div class="col-md-6"><label class="form-label"><?= h(t('deworm.product')) ?></label><select
                            class="form-select" name="dewormer_id">
                            <option value=""><?= h(t('common.not_provided')) ?></option>
                            <?php foreach (($dewormers ?? []) as $d): ?><option value="<?= (int)$d['id'] ?>">
                                <?= h($d['name']) ?></option><?php endforeach; ?>
                        </select></div>
                    <div class="col-12"><label class="form-check"><input class="form-check-input" type="checkbox"
                                name="create_dewormer" value="1" id="dewormerNewToggle"><span
                                class="form-check-label"><?= h(t('deworm.add_catalog')) ?></span></label></div>
                    <div class="col-12 d-none" id="dewormerNewFields">
                        <div class="row g-2">
                            <div class="col-md-5"><input class="form-control" name="new_dewormer_name"
                                    placeholder="<?= h(t('deworm.name')) ?>"></div>
                            <div class="col-md-4"><input class="form-control" name="new_dewormer_ingredient"
                                    placeholder="<?= h(t('deworm.ingredient')) ?>"></div>
                            <div class="col-md-3"><input class="form-control" name="new_dewormer_form"
                                    placeholder="<?= h(t('deworm.form')) ?>"></div>
                        </div>
                    </div>
                    <div class="col-md-6"><label class="form-label"><?= h(t('animal.dose')) ?></label><input
                            class="form-control" name="dose_text" placeholder="<?= h(t('deworm.dose_example')) ?>">
                    </div>
                    <div class="col-md-6"><label class="form-label"><?= h(t('common.weight')) ?></label>
                        <div class="input-group"><input class="form-control" type="number" min="0" step="0.01"
                                name="weight_kg"><span class="input-group-text">kg</span></div>
                    </div>
                    <div class="col-12"><label class="form-label"><?= h(t('deworm.next_due')) ?> <span
                                class="text-muted"><?= h(t('common.optional_parentheses')) ?></span></label><input
                            class="form-control" type="date" name="next_due_date">
                        <div class="form-hint"><?= h(t('deworm.auto_age')) ?></div>
                    </div>
                    <?php if (!empty($litters)): ?><div class="col-12"><label class="form-check"><input
                                class="form-check-input" type="checkbox" name="apply_litter" value="1"><span
                                class="form-check-label"><?= h(t('deworm.apply_litter')) ?></span></label></div>
                    <?php endif; ?>
                    <div class="col-12"><label class="form-label"><?= h(t('animal.comment')) ?></label><textarea
                            class="form-control" name="notes" rows="2"></textarea></div>
                </div>
            </div>
            <div class="modal-footer"><button class="btn me-auto" type="button"
                    data-bs-dismiss="modal"><?= h(t('common.cancel')) ?></button><button
                    class="btn btn-primary"><?= h(t('common.save')) ?></button></div>
        </form>
    </div>
</div>
<script>
    document.addEventListener('DOMContentLoaded', () => {
        document.querySelectorAll('[data-bs-target="#modalDeworming"]').forEach(b => b.setAttribute(
            'data-bs-target', '#modalDewormingCatalog'));
        const t = document.getElementById('dewormerNewToggle'),
            p = document.getElementById('dewormerNewFields');
        t?.addEventListener('change', () => p?.classList.toggle('d-none', !t.checked));
    });

</script>
