<?php
$uploaded_file = [];
if (!empty($warning_details->attachment)) {
	$uploaded_file = json_decode($warning_details->attachment);
}

$show_custom_fields = custom_form_label(16, $warning_details->id);
?>

	<div class="mx-auto max-w-5xl space-y-4">
		<div class="rounded-2xl bg-gradient-to-r from-rose-500 via-orange-500 to-amber-500 p-[1px] shadow-lg">
			<div class="rounded-2xl bg-white p-4 dark:bg-gray-800">
				<div class="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
					<div>
						<p class="text-xs font-semibold uppercase tracking-[0.2em] text-rose-600 dark:text-rose-300"><?= lang('warning_type') ?></p>
						<p class="mt-1 text-lg font-semibold text-gray-900 dark:text-white">
							<?php if (!empty($warning_details->warning_type)) echo $warning_details->customer_group; ?>
						</p>
					</div>
					<div class="rounded-lg bg-rose-50 px-3 py-2 text-sm text-rose-700 dark:bg-rose-900/40 dark:text-rose-200">
						<?= lang('warning_date') ?>: <?= display_date($warning_details->warning_date) ?>
					</div>
				</div>
			</div>
		</div>

		<div class="grid grid-cols-1 gap-4 lg:grid-cols-12">
			<div class="space-y-4 lg:col-span-4">
				<div class="rounded-xl border border-gray-200 bg-white p-4 shadow-sm dark:border-gray-700 dark:bg-gray-800">
					<p class="text-xs font-semibold uppercase tracking-wide text-gray-500 dark:text-gray-400"><?= lang('warning_by') ?></p>
					<p class="mt-1 text-sm font-medium text-gray-800 dark:text-gray-100">
						<?php if (!empty($warning_details->warning_by)) echo $warning_details->fullname; ?>
					</p>
				</div>

				<div class="rounded-xl border border-gray-200 bg-white p-4 shadow-sm dark:border-gray-700 dark:bg-gray-800">
					<p class="text-xs font-semibold uppercase tracking-wide text-gray-500 dark:text-gray-400"><?= lang('warning_to') ?></p>
					<p class="mt-1 text-sm font-medium text-gray-800 dark:text-gray-100">
						<?php if (!empty($warning_details->warning_to)) echo fullname($warning_details->warning_to); ?>
					</p>
				</div>

				<div class="rounded-xl border border-gray-200 bg-white p-4 shadow-sm dark:border-gray-700 dark:bg-gray-800">
					<p class="text-xs font-semibold uppercase tracking-wide text-gray-500 dark:text-gray-400"><?= lang('subject') ?></p>
					<p class="mt-1 text-sm text-gray-700 dark:text-gray-200"><?= $warning_details->subject ?? '' ?></p>
				</div>
			</div>

			<div class="space-y-4 lg:col-span-8">
				<div class="rounded-xl border border-gray-200 bg-white p-4 shadow-sm dark:border-gray-700 dark:bg-gray-800">
					<p class="text-xs font-semibold uppercase tracking-wide text-gray-500 dark:text-gray-400"><?= lang('attachment') ?></p>
					<?php if (!empty($uploaded_file)) : ?>
						<ul class="mt-3 grid grid-cols-1 gap-3 sm:grid-cols-2">
							<?php foreach ($uploaded_file as $fKey => $v_files) :
								if (!empty($v_files)) :
							?>
									<li class="rounded-lg border border-gray-200 bg-gray-50 p-3 dark:border-gray-700 dark:bg-gray-900">
										<div class="flex items-center gap-3">
											<?php if ($v_files->is_image == 1) : ?>
												<img src="<?= base_url() . $v_files->path ?>" class="h-12 w-12 rounded-md object-cover ring-1 ring-gray-200 dark:ring-gray-600">
											<?php else : ?>
												<div class="flex h-12 w-12 items-center justify-center rounded-md bg-gray-200 text-xs font-semibold text-gray-700 dark:bg-gray-700 dark:text-gray-100">FILE</div>
											<?php endif; ?>

											<div class="min-w-0 flex-1">
												<a href="<?= base_url() ?>admin/warning/download_files/<?= $warning_details->id . '/' . $fKey ?>" class="block truncate text-sm font-semibold text-indigo-600 hover:underline dark:text-indigo-300">
													<?= $v_files->fileName ?>
												</a>
												<div class="mt-1 flex items-center justify-between text-xs text-gray-500 dark:text-gray-400">
													<span><?= $v_files->size ?> <?= lang('kb') ?></span>
													<a href="<?= base_url() ?>admin/warning/download_files/<?= $warning_details->id . '/' . $fKey ?>" class="font-semibold text-indigo-600 dark:text-indigo-300">Download</a>
												</div>
											</div>
										</div>
									</li>
							<?php endif;
							endforeach; ?>
						</ul>
					<?php else : ?>
						<p class="mt-3 text-sm text-gray-500 dark:text-gray-400">No attachments available.</p>
					<?php endif; ?>
				</div>

				<?php if (!empty($show_custom_fields)) : ?>
					<div class="rounded-xl border border-gray-200 bg-white p-4 shadow-sm dark:border-gray-700 dark:bg-gray-800">
						<p class="text-xs font-semibold uppercase tracking-wide text-gray-500 dark:text-gray-400">Custom Fields</p>
						<div class="mt-3 divide-y divide-gray-200 dark:divide-gray-700">
							<?php foreach ($show_custom_fields as $c_label => $v_fields) :
								if (!empty($v_fields)) :
							?>
									<div class="grid grid-cols-12 gap-2 py-2">
										<div class="col-span-5 text-sm font-medium text-gray-700 dark:text-gray-300"><?= $c_label ?></div>
										<div class="col-span-7 text-sm text-gray-700 dark:text-gray-100"><?= $v_fields ?></div>
									</div>
							<?php endif;
							endforeach; ?>
						</div>
					</div>
				<?php endif; ?>

				<div class="rounded-xl border border-gray-200 bg-white p-4 shadow-sm dark:border-gray-700 dark:bg-gray-800">
					<p class="text-xs font-semibold uppercase tracking-wide text-gray-500 dark:text-gray-400"><?= lang('description') ?></p>
					<div class="mt-3 rounded-lg border-l-4 border-orange-500 bg-orange-50 p-3 text-sm leading-6 text-gray-700 dark:border-orange-400 dark:bg-orange-900/20 dark:text-gray-200">
						<?= $warning_details->description ?>
					</div>
				</div>
			</div>
		</div>
	</div>
