<div class="invoice-modern">
    <div class="grid gap-5 lg:grid-cols-12">
        <div class="lg:col-span-4 xl:col-span-3">
            <?= isset($invoice_sidebar_html) ? $invoice_sidebar_html : '' ?>
        </div>

        <section class="lg:col-span-8 xl:col-span-9">
            <div class="rounded-2xl border border-slate-200 bg-white shadow-sm dark:border-slate-700 dark:bg-slate-900">
                <div class="border-b border-slate-200 px-5 py-4 dark:border-slate-700">
                    <h3 class="text-sm font-semibold text-slate-900 dark:text-slate-100"><?= lang('invoice_history') ?></h3>
                </div>
                <div class="p-5" id="chat-box">
                    <?php
                    $history_page = !empty($history_page) ? (int) $history_page : 1;
                    $history_pages = !empty($history_pages) ? (int) $history_pages : 1;
                    $history_query = $this->input->get();
                    unset($history_query['history_page']);
                    if (!empty($activities_info)) {
                        foreach ($activities_info as $v_activities) {
                    ?>
                            <div class="relative mb-4 pl-6">
                                <span class="absolute left-0 top-2 h-2.5 w-2.5 rounded-full bg-slate-400 dark:bg-slate-500"></span>
                                <span class="absolute left-[4px] top-5 bottom-[-16px] w-px bg-slate-200 dark:bg-slate-700"></span>

                                <small data-toggle="tooltip" data-placement="top"
                                    title="<?= display_datetime($v_activities->activity_date) ?>"
                                    class="text-xs text-slate-500 dark:text-slate-400"><?= time_ago($v_activities->activity_date); ?></small>

                                <p class="mt-1 text-sm text-slate-700 dark:text-slate-200">
                                    <?php if (!empty($v_activities->actor_name)) { ?>
                                        <strong>
                                            <a href="<?= base_url() ?>admin/user/user_details/<?= $v_activities->actor_user_id ?>"
                                                class="text-primary hover:underline"><?= html_escape($v_activities->actor_name) ?></a>
                                        </strong>
                                    <?php } ?>
                                    <?= sprintf(lang($v_activities->activity)) ?>
                                    <strong><?= html_escape($v_activities->value1) ?></strong>
                                </p>
                                <?php if (!empty($v_activities->value2)) { ?>
                                    <p class="text-sm font-semibold text-slate-700 dark:text-slate-200"><?= html_escape($v_activities->value2) ?></p>
                                <?php } ?>
                            </div>
                    <?php
                        }
                    } else {
                    ?>
                        <p class="text-sm text-slate-500 dark:text-slate-400"><?= lang('nothing_to_display') ?></p>
                    <?php } ?>
                    <?php if ($history_pages > 1) { ?>
                        <div class="mt-6 flex items-center justify-between gap-3 border-t border-slate-200 pt-4 dark:border-slate-700">
                            <?php if ($history_page > 1) { ?>
                                <a href="<?= base_url('admin/invoice/manage_invoice/invoice_history/' . $invoice_info->invoices_id) . '?' . http_build_query(array_merge($history_query, array('history_page' => $history_page - 1))) ?>" class="inline-flex items-center gap-2 rounded-lg border border-slate-300 bg-white px-4 py-2 text-sm font-medium text-slate-600 transition hover:bg-slate-50 dark:border-slate-600 dark:bg-slate-700 dark:text-slate-200">Prev</a>
                            <?php } else { ?>
                                <span class="inline-flex items-center gap-2 rounded-lg border border-slate-200 bg-slate-50 px-4 py-2 text-sm font-medium text-slate-400 dark:border-slate-700 dark:bg-slate-700 dark:text-slate-500">Prev</span>
                            <?php } ?>
                            <span class="text-sm font-medium text-slate-500 dark:text-slate-300"><?= $history_page ?> of <?= $history_pages ?></span>
                            <?php if ($history_page < $history_pages) { ?>
                                <a href="<?= base_url('admin/invoice/manage_invoice/invoice_history/' . $invoice_info->invoices_id) . '?' . http_build_query(array_merge($history_query, array('history_page' => $history_page + 1))) ?>" class="inline-flex items-center gap-2 rounded-lg border border-slate-300 bg-white px-4 py-2 text-sm font-medium text-slate-600 transition hover:bg-slate-50 dark:border-slate-600 dark:bg-slate-700 dark:text-slate-200">Next</a>
                            <?php } else { ?>
                                <span class="inline-flex items-center gap-2 rounded-lg border border-slate-200 bg-slate-50 px-4 py-2 text-sm font-medium text-slate-400 dark:border-slate-700 dark:bg-slate-700 dark:text-slate-500">Next</span>
                            <?php } ?>
                        </div>
                    <?php } ?>
                </div>
            </div>
        </section>
    </div>
</div>
