<?php echo message_box('success'); ?>
<?php echo message_box('error'); ?>

<?php
$created = can_action('81', 'created');
$edited = can_action('81', 'edited');
$deleted = can_action('81', 'deleted');
?>

<div class="space-y-4">

		<?php if (!empty($all_stock_info)) : ?>
			<div class="flex flex-wrap items-start gap-4">
				<?php foreach ($all_stock_info as $category => $v_stock_info) :
					$category_name = !empty($category) ? $category : lang('undefined_category');
				?>
					<div class="w-full overflow-hidden rounded-2xl border border-border bg-card shadow-sm sm:w-1/2 xl:w-1/3">
						<details class="group">
							<summary class="flex cursor-pointer list-none items-center justify-between gap-4 border-b border-border px-5 py-4 transition hover:bg-muted/30">
								<div class="min-w-0">
									<h3 class="truncate text-lg font-semibold text-foreground"><?= html_escape($category_name) ?></h3>
									<p class="text-xs text-muted-foreground"><?= count($v_stock_info) ?> <?= lang('sub_category') ?></p>
								</div>
								<span class="inline-flex h-8 w-8 shrink-0 items-center justify-center rounded-lg border border-border bg-background text-muted-foreground transition group-open:rotate-180">
									<i data-lucide="chevron-down" class="h-4 w-4"></i>
								</span>
							</summary>
							<div class="space-y-4 px-5 py-5">
								<?php if (!empty($v_stock_info)) : ?>
									<?php foreach ($v_stock_info as $sub_category => $v_stock) : ?>
										<div class="overflow-hidden rounded-xl border border-border bg-background">
											<div class="flex flex-wrap items-center justify-between gap-3 border-b border-border bg-muted/30 px-4 py-3">
												<div class="min-w-0">
													<h4 class="truncate text-sm font-semibold text-foreground"><?= html_escape($sub_category) ?></h4>
													<p class="mt-1 text-xs text-muted-foreground"><?= count($v_stock) ?> <?= lang('items') ?></p>
												</div>
											</div>
											<div class="overflow-x-auto">
												<table class="min-w-full table-fixed divide-y divide-border">
													<thead class="bg-muted/20">
														<tr class="text-left text-xs font-semibold uppercase tracking-wide text-muted-foreground">
															<th class="px-3 py-3"><?= lang('item_name') ?></th>
															<th class="w-20 px-3 py-3 text-right"><?= lang('total_stock') ?></th>
															<?php if (!empty($deleted) || !empty($edited)) { ?>
																<th class="w-24 px-3 py-3 text-right"><?= lang('action') ?></th>
															<?php } ?>
														</tr>
													</thead>
													<tbody class="divide-y divide-border">
														<?php foreach ($v_stock as $stock) : ?>
															<tr class="text-sm text-foreground transition hover:bg-muted/25">
																<td class="truncate px-3 py-3 align-middle font-medium" title="<?= html_escape($stock->item_name); ?>"><?= html_escape($stock->item_name); ?></td>
																<td class="whitespace-nowrap px-3 py-3 text-right align-middle font-semibold tabular-nums"><?= html_escape($stock->total_stock); ?></td>
																<?php if (!empty($deleted) || !empty($edited)) { ?>
																	<td class="px-3 py-3 align-middle">
																		<div class="flex items-center justify-end gap-1.5">
																			<?php if (!empty($edited)) { ?>
																				<a href="<?= base_url('admin/stock/create_stocklist/' . $stock->stock_id) ?>" class="inline-flex h-8 w-8 items-center justify-center rounded-lg border border-indigo-200 bg-indigo-50 text-indigo-600 transition hover:bg-indigo-100 dark:border-indigo-900/60 dark:bg-indigo-950/30 dark:text-indigo-300 dark:hover:bg-indigo-900/40" title="<?= lang('edit') ?>">
																					<i data-lucide="pencil" class="h-4 w-4"></i>
																				</a>
																			<?php } ?>
																			<?php if (!empty($deleted)) { ?>
																				<a href="<?= base_url('admin/stock/delete_stock/' . $stock->stock_id) ?>" class="inline-flex h-8 w-8 items-center justify-center rounded-lg border border-rose-200 bg-rose-50 text-rose-600 transition hover:bg-rose-100 dark:border-rose-900/60 dark:bg-rose-950/30 dark:text-rose-300 dark:hover:bg-rose-900/40" title="<?= lang('delete') ?>">
																					<i data-lucide="trash-2" class="h-4 w-4"></i>
																				</a>
																			<?php } ?>
																		</div>
																	</td>
																<?php } ?>
															</tr>
													<?php endforeach; ?>
												</tbody>
											</table>
										</div>
									</div>
								<?php endforeach; ?>
							<?php else : ?>
								<p class="text-sm text-muted-foreground"><?= lang('nothing_to_display') ?></p>
							<?php endif; ?>
						</div>
					</details>
				</div>
			<?php endforeach; ?>
		</div>
	<?php else : ?>
		<div class="rounded-2xl border border-border bg-card p-6 text-sm text-muted-foreground">
			<?= lang('nothing_to_display') ?>
		</div>
	<?php endif; ?>
</div>
