<?php
$project_id = !empty($id) ? $id : (!empty($project_details->project_id) ? $project_details->project_id : null);
$all_milestones_info = !empty($project_id) ? get_result('tbl_milestones', array('project_id' => $project_id)) : array();
?>

<div class="space-y-4">
    <div class="flex flex-wrap items-center justify-between gap-2">
        <div>
            <h3 class="text-base font-semibold text-slate-900 dark:text-slate-100"><?= lang('milestones') ?></h3>
            <p class="text-sm text-slate-500"><?= lang('milestones') ?></p>
        </div>
    </div>

    <div class="overflow-hidden rounded-2xl border border-slate-200 bg-white shadow-sm dark:border-slate-700 dark:bg-slate-900/40">
        <div class="overflow-x-auto overflow-y-visible">
            <table class="min-w-full text-sm">
                <thead class="bg-slate-50 text-slate-500 dark:bg-slate-800 dark:text-slate-300">
                    <tr>
                        <th class="px-4 py-3 text-left"><?= lang('milestone_name') ?></th>
                        <th class="px-4 py-3 text-left"><?= lang('start_date') ?></th>
                        <th class="px-4 py-3 text-left"><?= lang('due_date') ?></th>
                        <th class="px-4 py-3 text-left"><?= lang('progress') ?></th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-slate-100 dark:divide-slate-800">
                    <?php if (!empty($all_milestones_info)) {
                        foreach ($all_milestones_info as $key => $v_milestones) {
                            $progress = $this->items_model->calculate_milestone_progress($v_milestones->milestones_id);
                    ?>
                            <tr class="text-slate-700 transition hover:bg-slate-50/70 dark:text-slate-200 dark:hover:bg-slate-800/50">
                                <td class="px-4 py-3">
                                    <button type="button" class="border-0 bg-transparent p-0 font-medium text-primary hover:underline dark:text-sky-300" data-tooltip="<?= html_escape($v_milestones->description) ?>">
                                        <?= html_escape($v_milestones->milestone_name) ?>
                                    </button>
                                </td>
                                <td class="px-4 py-3"><?= display_date($v_milestones->start_date) ?></td>
                                <td class="px-4 py-3">
                                    <?php
                                    $due_date = $v_milestones->end_date;
                                    $due_time = safe_strtotime($due_date);
                                    $current_time = safe_strtotime(date('Y-m-d'));
                                    ?>
                                    <?= display_date($due_date) ?>
                                    <?php if ($current_time > $due_time && $progress < 100) { ?>
                                        <span class="ml-2 inline-flex rounded-full bg-rose-50 px-2 py-0.5 text-xs text-rose-700 dark:bg-rose-900/30 dark:text-rose-200"><?= lang('overdue') ?></span>
                                    <?php } ?>
                                </td>
                                <td class="px-4 py-3">
                                    <div class="flex items-center gap-2">
                                        <div class="h-2 w-24 rounded-full bg-slate-100 dark:bg-slate-800">
                                            <div class="h-2 rounded-full <?= $progress >= 100 ? 'bg-emerald-500' : 'bg-rose-400' ?>" style="width: <?= $progress ?>%"></div>
                                        </div>
                                        <span class="text-xs text-slate-500 dark:text-slate-400"><?= $progress ?>%</span>
                                    </div>
                                </td>
                            </tr>
                    <?php
                        }
                    } else { ?>
                        <tr>
                            <td colspan="4" class="px-4 py-6 text-center text-sm text-slate-500 dark:text-slate-400"><?= lang('no_data_found') ?></td>
                        </tr>
                    <?php } ?>
                </tbody>
            </table>
        </div>
    </div>
</div>
