<?php defined('BASEPATH') or exit('No direct script access allowed'); ?>

<?php
$recentCredits = array();
$recentDebits = array();
if (!empty($client_transactions)) {
    foreach ($client_transactions as $txn) {
        if ((float) ($txn->credit ?? 0) > 0) {
            $recentCredits[] = $txn;
        }
        if ((float) ($txn->debit ?? 0) > 0) {
            $recentDebits[] = $txn;
        }
    }
}
$recentCredits = array_slice($recentCredits, 0, 4);
$recentDebits = array_slice($recentDebits, 0, 5);

$projectStatusBadge = function ($status) {
    $status = (string) $status;
    $label = $status ? lang($status) : lang('not_paid');
    $map = array(
        'completed' => 'bg-emerald-500/15 text-emerald-400',
        'in_progress' => 'bg-sky-500/15 text-sky-400',
        'started' => 'bg-sky-500/15 text-sky-400',
        'cancel' => 'bg-rose-500/15 text-rose-400',
        'on_hold' => 'bg-amber-500/15 text-amber-400',
    );
    $classes = $map[$status] ?? 'bg-muted/40 text-muted-foreground';

    return array('label' => $label, 'classes' => $classes);
};
?>

<div class="space-y-6">
    <section class="grid grid-cols-1 gap-4 md:grid-cols-2 xl:grid-cols-4">
        <div class="rounded-2xl border border-border bg-card p-4 shadow-sm">
            <div class="flex items-center justify-between">
                <div>
                    <p class="text-xs font-medium uppercase tracking-wide text-muted-foreground"><?= lang('total') . ' ' . lang('income') ?></p>
                    <p class="mt-2 text-2xl font-semibold text-foreground"><?= display_money($total_income_amount ?? 0, default_currency(), true); ?></p>
                </div>
                <span class="inline-flex h-10 w-10 items-center justify-center rounded-full bg-emerald-500/15 text-emerald-400">I</span>
            </div>
        </div>
        <div class="rounded-2xl border border-border bg-card p-4 shadow-sm">
            <div class="flex items-center justify-between">
                <div>
                    <p class="text-xs font-medium uppercase tracking-wide text-muted-foreground"><?= lang('total') . ' ' . lang('expense') ?></p>
                    <p class="mt-2 text-2xl font-semibold text-foreground"><?= display_money($total_expense_amount ?? 0, default_currency(), true); ?></p>
                </div>
                <span class="inline-flex h-10 w-10 items-center justify-center rounded-full bg-rose-500/15 text-rose-400">E</span>
            </div>
        </div>
        <div class="rounded-2xl border border-border bg-card p-4 shadow-sm">
            <div class="flex items-center justify-between">
                <div>
                    <p class="text-xs font-medium uppercase tracking-wide text-muted-foreground"><?= lang('projects') ?></p>
                    <p class="mt-2 text-2xl font-semibold text-foreground"><?= (int) ($client_project_count ?? 0); ?></p>
                </div>
                <span class="inline-flex h-10 w-10 items-center justify-center rounded-full bg-sky-500/15 text-sky-400">P</span>
            </div>
        </div>
        <div class="rounded-2xl border border-border bg-card p-4 shadow-sm">
            <div class="flex items-center justify-between">
                <div>
                    <p class="text-xs font-medium uppercase tracking-wide text-muted-foreground"><?= lang('invoices') ?></p>
                    <p class="mt-2 text-2xl font-semibold text-foreground"><?= (int) ($client_invoice_count ?? 0); ?></p>
                </div>
                <span class="inline-flex h-10 w-10 items-center justify-center rounded-full bg-amber-500/15 text-amber-400">V</span>
            </div>
        </div>
    </section>

    <section class="grid grid-cols-1 gap-4 xl:grid-cols-3">
        <div class="rounded-2xl border border-border bg-card p-5 shadow-sm xl:col-span-2">
            <div class="flex items-center justify-between">
                <div>
                    <p class="text-xs font-semibold uppercase tracking-wide text-muted-foreground"><?= lang('income') ?></p>
                    <h3 class="text-lg font-semibold text-foreground"><?= lang('overview') ?></h3>
                </div>
                <span class="rounded-full border border-border bg-background px-3 py-1 text-xs font-semibold text-muted-foreground">Last 7 months</span>
            </div>
            <div class="mt-6 rounded-2xl bg-muted/20 p-4">
                <svg viewBox="0 0 600 220" class="h-52 w-full">
                    <defs>
                        <linearGradient id="incomeArea" x1="0" y1="0" x2="0" y2="1">
                            <stop offset="0%" stop-color="#38bdf8" stop-opacity="0.35" />
                            <stop offset="100%" stop-color="#38bdf8" stop-opacity="0" />
                        </linearGradient>
                    </defs>
                    <path d="M20 170 C 80 150, 120 140, 170 150 C 230 162, 270 185, 320 170 C 360 160, 410 110, 470 120 C 520 130, 560 150, 580 140" fill="none" stroke="#38bdf8" stroke-width="3" />
                    <path d="M20 220 L20 170 C 80 150, 120 140, 170 150 C 230 162, 270 185, 320 170 C 360 160, 410 110, 470 120 C 520 130, 560 150, 580 140 L580 220 Z" fill="url(#incomeArea)" />
                    <g fill="#94a3b8" font-size="12">
                        <text x="20" y="210">Jan</text>
                        <text x="120" y="210">Feb</text>
                        <text x="220" y="210">Mar</text>
                        <text x="320" y="210">Apr</text>
                        <text x="420" y="210">May</text>
                        <text x="520" y="210">Jun</text>
                    </g>
                </svg>
            </div>
        </div>

        <div class="rounded-2xl border border-border bg-card p-5 shadow-sm">
            <div class="flex items-center justify-between">
                <div>
                    <p class="text-xs font-semibold uppercase tracking-wide text-muted-foreground"><?= lang('income') ?></p>
                    <h3 class="text-lg font-semibold text-foreground"><?= lang('recent') . ' ' . lang('invoices') ?></h3>
                </div>
                <a href="<?= base_url('client/invoice/manage_invoice') ?>" class="text-xs font-semibold text-sky-400 hover:text-sky-300">
                    <?= lang('view_all') ?>
                </a>
            </div>
            <div class="mt-4 space-y-3">
                <?php if (!empty($recentCredits)) : ?>
                    <?php foreach ($recentCredits as $txn) : ?>
                        <?php $txnId = (int) ($txn->transactions_id ?? 0); ?>
                        <div class="flex items-center justify-between rounded-xl border border-border bg-muted/30 px-4 py-3">
                            <div>
                                <p class="text-sm font-semibold text-foreground">INV-<?= str_pad((string) $txnId, 6, '0', STR_PAD_LEFT); ?></p>
                                <p class="text-xs text-muted-foreground"><?= html_escape($txn->notes ?? lang('income')); ?></p>
                            </div>
                            <div class="text-right">
                                <p class="text-sm font-semibold text-foreground"><?= display_money($txn->credit ?? 0, default_currency(), true); ?></p>
                                <span class="text-xs text-emerald-400"><?= lang('paid') ?></span>
                            </div>
                        </div>
                    <?php endforeach; ?>
                <?php else : ?>
                    <div class="rounded-xl border border-dashed border-border px-4 py-6 text-center text-sm text-muted-foreground">
                        <?= lang('no_data') ?>
                    </div>
                <?php endif; ?>
            </div>
        </div>
    </section>

    <section class="grid grid-cols-1 gap-4 xl:grid-cols-3">
        <div class="rounded-2xl border border-border bg-card p-5 shadow-sm xl:col-span-2">
            <div class="flex items-center justify-between">
                <div>
                    <p class="text-xs font-semibold uppercase tracking-wide text-muted-foreground"><?= lang('project') ?></p>
                    <h3 class="text-lg font-semibold text-foreground"><?= lang('projects') ?></h3>
                </div>
                <a href="<?= base_url('client/projects') ?>" class="rounded-full border border-border bg-background px-3 py-1 text-xs font-semibold text-foreground hover:bg-muted">
                    <?= lang('view_all') ?>
                </a>
            </div>
            <div class="mt-4 grid grid-cols-1 gap-3 md:grid-cols-2">
                <?php if (!empty($client_projects)) : ?>
                    <?php foreach ($client_projects as $project) : ?>
                        <?php $badge = $projectStatusBadge($project->project_status ?? ''); ?>
                        <div class="rounded-xl border border-border bg-muted/30 p-4">
                            <div class="flex items-center justify-between">
                                <div class="flex items-center gap-2">
                                    <span class="inline-flex h-9 w-9 items-center justify-center rounded-full bg-indigo-500/15 text-indigo-300">
                                        <?= html_escape(strtoupper(substr((string) $project->project_name, 0, 2))); ?>
                                    </span>
                                    <div>
                                        <p class="text-sm font-semibold text-foreground"><?= html_escape($project->project_name); ?></p>
                                        <p class="text-xs text-muted-foreground">
                                            <?= lang('due_date') ?> <?= !empty($project->end_date) ? display_date($project->end_date) : '-'; ?>
                                        </p>
                                    </div>
                                </div>
                                <span class="rounded-full px-2 py-1 text-xs font-semibold <?= $badge['classes']; ?>">
                                    <?= html_escape($badge['label']); ?>
                                </span>
                            </div>
                            <?php if (!empty($project->description)) : ?>
                                <p class="mt-3 line-clamp-2 text-xs text-muted-foreground">
                                    <?= html_escape($project->description); ?>
                                </p>
                            <?php endif; ?>
                            <div class="mt-3 flex items-center justify-between text-xs text-muted-foreground">
                                <span><?= lang('priority') ?>: <?= lang('high') ?></span>
                                <span class="text-sm font-semibold text-foreground">
                                    <?= display_money($project->project_cost ?? 0, default_currency(), true); ?>
                                </span>
                            </div>
                        </div>
                    <?php endforeach; ?>
                <?php else : ?>
                    <div class="rounded-xl border border-dashed border-border p-4 text-center text-sm text-muted-foreground">
                        <?= lang('no_data') ?>
                    </div>
                <?php endif; ?>
            </div>
        </div>

        <div class="rounded-2xl border border-border bg-card p-5 shadow-sm">
            <div class="flex items-center justify-between">
                <div>
                    <p class="text-xs font-semibold uppercase tracking-wide text-muted-foreground"><?= lang('expense') ?></p>
                    <h3 class="text-lg font-semibold text-foreground"><?= lang('recent') . ' ' . lang('expense') ?></h3>
                </div>
                <span class="text-xs font-semibold text-muted-foreground"><?= lang('total') ?></span>
            </div>
            <div class="mt-4 space-y-3">
                <?php if (!empty($recentDebits)) : ?>
                    <?php foreach ($recentDebits as $txn) : ?>
                        <div class="flex items-center justify-between rounded-xl border border-border bg-muted/30 px-4 py-3">
                            <div>
                                <p class="text-sm font-semibold text-foreground"><?= html_escape($txn->notes ?? lang('expense')); ?></p>
                                <p class="text-xs text-muted-foreground"><?= display_date($txn->date); ?></p>
                            </div>
                            <div class="text-right">
                                <p class="text-sm font-semibold text-foreground"><?= display_money($txn->debit ?? 0, default_currency(), true); ?></p>
                                <span class="text-xs text-emerald-400"><?= lang('approved') ?></span>
                            </div>
                        </div>
                    <?php endforeach; ?>
                <?php else : ?>
                    <div class="rounded-xl border border-dashed border-border px-4 py-6 text-center text-sm text-muted-foreground">
                        <?= lang('no_data') ?>
                    </div>
                <?php endif; ?>
            </div>
        </div>
    </section>
</div>
