<?php
session_start();
include 'db.php';

$error = '';

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $login = trim($_POST['login']);
    $password = $_POST['password'];
    $login_type = $_POST['login_type'] ?? 'backoffice';

    $stmt = $conn->prepare("
        SELECT id, username, email, password, role_id 
        FROM users 
        WHERE username = ? OR email = ?
        LIMIT 1
    ");
    $stmt->bind_param("ss", $login, $login);
    $stmt->execute();
    $result = $stmt->get_result();

    if ($result->num_rows === 1) {
        $user = $result->fetch_assoc();

        if (password_verify($password, $user['password'])) {
            $_SESSION['user_id'] = $user['id'];
            $_SESSION['username'] = $user['username'];
            $_SESSION['email'] = $user['email'];
            $_SESSION['role_id'] = $user['role_id'];

            $redirect = ($login_type === 'pos') ? 'pos.php' : 'index.php';
            header("Location: $redirect");
            exit;
        } else {
            $error = "Invalid password.";
        }
    } else {
        $error = "User not found.";
    }
}
?>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Login - POS Admin</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="shortcut icon" type="image/x-icon" href="assets/img/favicon.png">
    <link rel="stylesheet" href="assets/css/bootstrap.min.css">
    <link rel="stylesheet" href="assets/plugins/fontawesome/css/fontawesome.min.css">
    <link rel="stylesheet" href="assets/plugins/fontawesome/css/all.min.css">
    <link rel="stylesheet" href="assets/css/style.css">
</head>
<body class="account-page">

<div id="global-loader"><div class="whirly-loader"></div></div>

<div class="main-wrapper">
    <div class="account-content">
        <div class="login-wrapper login-new">
            <div class="container">
                <div class="login-content user-login">
                    <div class="login-logo">
                        <img src="assets/img/logo.png" alt="Logo">
                    </div>

                    <form method="POST" action="login.php">
                        <div class="login-userset">
                            <div class="login-userheading">
                                <h3>Log In</h3>
                                <h4>Access the ITR POS panel using your credentials.</h4>
                            </div>

                            <?php if ($error): ?>
                                <div class="alert alert-danger"><?= htmlspecialchars($error) ?></div>
                            <?php endif; ?>

                            <div class="form-login">
                                <label class="form-label">Username or Email</label>
                                <div class="form-addons">
                                    <input type="text" name="login" class="form-control" required>
                                    <img src="assets/img/icons/mail.svg" alt="icon">
                                </div>
                            </div>

                            <div class="form-login">
                                <label>Password</label>
                                <div class="pass-group">
                                    <input type="password" name="password" class="form-control pass-input" required>
                                    <span class="fas toggle-password fa-eye-slash"></span>
                                </div>
                            </div>

                            <div class="form-login">
                                <label class="form-label">Login Type</label>
                                <div class="d-flex gap-3">
                                    <div class="form-check">
                                        <input class="form-check-input" type="radio" name="login_type" id="loginPos" value="pos" required>
                                        <label class="form-check-label" for="loginPos">POS</label>
                                    </div>
                                    <div class="form-check">
                                        <input class="form-check-input" type="radio" name="login_type" id="loginBack" value="backoffice" checked>
                                        <label class="form-check-label" for="loginBack">Backoffice</label>
                                    </div>
                                </div>
                            </div>

                            <div class="form-login authentication-check mt-2">
                                <div class="row">
                                    <div class="col-6">
                                        <label class="checkboxs ps-4 mb-0 pb-0 line-height-1">
                                            <input type="checkbox">
                                            <span class="checkmarks"></span>Remember me
                                        </label>
                                    </div>
                                    <div class="col-6 text-end">
                                        <a href="#" class="forgot-link" data-bs-toggle="modal" data-bs-target="#forgotModal">Forgot Password?</a>
                                    </div>
                                </div>
                            </div>

                            <div class="form-login">
                                <button class="btn btn-login" type="submit">Log In</button>
                            </div>
                        </div>
                    </form>

                    <div class="my-4 d-flex justify-content-center align-items-center copyright-text">
                        <p>&copy; IT Resources. All rights reserved</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- Forgot Password Modal -->
<div class="modal fade" id="forgotModal" tabindex="-1" aria-labelledby="forgotModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title text-danger" id="forgotModalLabel">Forgot Password?</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">
        Please contact <strong>IT Resources</strong> to reset your password. This helps ensure secure access management.
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>

<!-- Scripts -->
<script src="assets/js/jquery-3.7.1.min.js"></script>
<script src="assets/js/feather.min.js"></script>
<script src="assets/js/bootstrap.bundle.min.js"></script>
<script src="assets/js/theme-script.js"></script>
<script src="assets/js/script.js"></script>
</body>
</html>
