<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="~{fragments/layout :: head('Admin Login')}"></head>
<body class="admin-auth">

<div class="admin-auth-shell">

    <!-- Brand / info panel -->
    <aside class="admin-auth-aside" style="justify-content:center">
        <div>
            <a class="admin-brand" th:href="@{/}" style="display:flex;margin-bottom:24px">
                <img th:src="@{/images/logo.png}" alt="MV Rent"/>
            </a>
            <span class="admin-badge">&#128274; Restricted &middot; Staff only</span>
            <div class="admin-aside-body" style="margin-top:16px">
                <h1>Admin <span>Console</span></h1>
                <p>Manage your fleet, drivers, vendors, bookings, billing and reports — all in one command center.</p>
            </div>
        </div>
    </aside>

    <!-- Login form -->
    <main class="admin-auth-main">
        <h2>Sign in to Admin</h2>
        <p class="subtitle">Use your staff credentials to continue</p>

        <div th:if="${param.error}" class="alert alert-error">Invalid admin credentials or not authorised</div>
        <div th:if="${param.logout}" class="alert alert-success">You have been signed out</div>

        <form th:action="@{/admin/login}" method="post">
            <div class="form-group field">
                <label>Username</label>
                <input type="text" name="username" placeholder="admin" required autofocus/>
            </div>
            <div class="form-group field">
                <label>Password</label>
                <input type="password" name="password" placeholder="&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;" required/>
            </div>
            <button class="btn btn-primary" type="submit">Sign in to Admin</button>
        </form>

        <p class="admin-auth-foot">
            <a th:href="@{/}">&larr; Back to main site</a>
        </p>
    </main>

</div>

</body>
</html>
