<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="<?=base_url('assets/css/login.css')?>">
    <!-- Global css  -->
    <link rel="stylesheet" href="<?=base_url('assets/css/global.css')?>">
    <!-- Google Font Roboto  -->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
    <title>Event Management System</title>
</head>
<body style="background-image: var(--login-pattern); background-position: right bottom !important;    background-size: 100% 100% !important;" >
    <!------------------- Login page ------------------>
    <div class="container">
        <div class="login-page">
            <div class="content">
                <div class="logo">
                    <img src="<?=base_url('logo.png')?>" alt="">
                </div>
                <div class="form">
                    <h2>Login</h2>
                    <form method='post' action="<?=base_url("user/login/auth")?>">
                        <input type="text" placeholder="Username" name="username" required>
                        <input type="password" placeholder="Password" name="password" required>
                        <input type="submit" value="Sign in">
                    </form>
                </div>
            </div>
        </div>
    </div>
    <!------------------- Login page ------------------>

</body>
</html>