<!DOCTYPE html>
<html lang="en" data-theme="corporate">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Login - CMOD</title>
	<link href="<?= base_url('css/daisyui.min.css'); ?>" rel="stylesheet" type="text/css" />
	<script src="<?= base_url('css/tailwind.min.js'); ?>"></script>
	<link href="<?= base_url('css/themes.min.css'); ?>" rel="stylesheet" type="text/css" />
	<script src="<?= base_url('js/fontawesome.min.js'); ?>"></script>
</head>

<body class="min-h-screen flex items-center justify-center bg-base-200">
	<div class="w-full max-w-sm mx-auto">
		<div class="card bg-base-100 shadow-xl">
			<div class="card-body items-center text-center">
				<div class="mb-4">
					<div class="w-16 h-16 rounded-full bg-primary/10 flex items-center justify-center mx-auto text-primary">
						<i class="fa fa-user-shield text-3xl"></i>
					</div>
				</div>
				<h2 class="card-title text-2xl font-semibold text-base-content mb-1">CMOD</h2>
				<p class="mb-6 text-sm text-base-content/70">Sign in to continue</p>
				<?php if (session()->getFlashdata('error')): ?>
					<div class="alert alert-error text-sm">
						<i class="fa fa-exclamation-circle"></i>
						<?= esc(session()->getFlashdata('error')) ?>
					</div>
				<?php endif; ?>
				<form method="post" action="<?= base_url('login') ?>" class="w-full flex flex-col gap-4">
					<div class="form-control">
						<label class="input input-bordered flex items-center gap-2 w-full">
							<i class="fa fa-user text-base-content/50"></i>
							<input type="text" name="userid" placeholder="User ID" class="grow" required />
						</label>
					</div>
					<div class="form-control">
						<label class="input input-bordered flex items-center gap-2 w-full">
							<i class="fa fa-lock text-base-content/50"></i>
							<input type="password" name="password" placeholder="Password" class="grow" required />
						</label>
					</div>
					<button type="submit" class="btn btn-primary btn-block mt-2 w-full font-medium">
						Login
					</button>
				</form>
				<div class="mt-6 text-center">
					<a href="#" class="link link-hover text-sm text-base-content/60">Forgot password?</a>
				</div>
			</div>
		</div>
		<div class="text-center mt-6 text-xs text-base-content/40">&copy; 2025 - 5Panda. All rights reserved.</div>
	</div>
</body>

</html>