<?php
$activities_count = !empty($activities_info) ? count($activities_info) : 0;
?>

<div class="space-y-6">
	<div class="rounded-2xl border border-border bg-card p-5 shadow-sm">
		<div class="flex flex-wrap items-center justify-between gap-4">
			<div>
				<p class="text-xs font-semibold uppercase tracking-wide text-muted-foreground"><?= lang('settings'); ?></p>
				<h2 class="mt-1 text-xl font-semibold text-foreground"><?= lang('all_activities'); ?></h2>
			</div>
			<div class="flex flex-wrap items-center gap-3">
				<div class="rounded-xl border border-border bg-muted/40 px-4 py-2 text-right">
					<p class="text-xs uppercase tracking-wide text-muted-foreground"><?= lang('activities'); ?></p>
					<p class="text-lg font-semibold text-foreground"><?= (int) $activities_count; ?></p>
				</div>
				<?php if (!empty($activities_info)) { ?>
					<a onclick="return confirm('<?= lang('delete_alert') ?>')"
						href="<?= base_url('client/settings/clear_activities'); ?>"
						class="inline-flex items-center gap-2 rounded-lg border border-border px-4 py-2 text-sm font-medium text-foreground transition hover:bg-muted">
						<i data-lucide="trash-2" class="h-4 w-4"></i>
						<span><?= lang('clear'); ?></span>
					</a>
				<?php } ?>
			</div>
		</div>
	</div>

	<div class="rounded-2xl border border-border bg-card shadow-sm">
		<div class="border-b border-border px-5 py-4">
			<h3 class="text-sm font-semibold text-foreground"><?= lang('activities'); ?></h3>
		</div>
		<div class="space-y-4 p-5">
			<?php if (!empty($activities_info)) {
				foreach ($activities_info as $v_activity) {
					$profile_info = $this->db->where('user_id', $v_activity->user)->get('tbl_account_details')->row();
					$user_name = !empty($profile_info->fullname) ? $profile_info->fullname : lang('user');
					$module = !empty($v_activity->module) ? $v_activity->module : '-';
					$activity_text = lang($v_activity->activity);
					if (empty($activity_text)) {
						$activity_text = $v_activity->activity;
					}
					?>
					<div class="rounded-xl border border-border bg-muted/30 p-4 transition hover:border-slate-300 hover:bg-muted/50 dark:hover:border-slate-600">
						<div class="flex flex-wrap items-start justify-between gap-3">
							<div class="flex min-w-0 items-start gap-3">
								<div class="mt-0.5 flex h-9 w-9 shrink-0 items-center justify-center rounded-lg bg-primary/10 text-primary">
									<i data-lucide="activity" class="h-4 w-4"></i>
								</div>
								<div class="min-w-0">
									<div class="flex flex-wrap items-center gap-2">
										<span class="font-medium text-primary"><?= html_escape($user_name); ?></span>
										<span class="rounded-full bg-background px-2 py-0.5 text-[11px] font-semibold uppercase tracking-wide text-muted-foreground">
											<?= html_escape($module); ?>
										</span>
									</div>
									<p class="mt-1 text-sm text-foreground">
										<?= html_escape($activity_text); ?>
										<?php if (!empty($v_activity->value1) || !empty($v_activity->value2)) { ?>
											<strong><?= html_escape(trim($v_activity->value1 . ' ' . $v_activity->value2)); ?></strong>
										<?php } ?>
									</p>
								</div>
							</div>
							<time title="<?= display_datetime($v_activity->activity_date); ?>" class="shrink-0 text-xs text-muted-foreground">
								<?= time_ago($v_activity->activity_date); ?>
							</time>
						</div>
					</div>
				<?php }
			} else { ?>
				<div class="rounded-xl border border-dashed border-border px-4 py-10 text-center">
					<div class="mx-auto flex h-10 w-10 items-center justify-center rounded-full bg-muted text-muted-foreground">
						<i data-lucide="activity" class="h-5 w-5"></i>
					</div>
					<p class="mt-3 text-sm text-muted-foreground"><?= lang('no_data_found'); ?></p>
				</div>
			<?php } ?>
		</div>
	</div>
</div>
