@extends('layouts.app')

@section('title', 'Login - '.config('app.name', 'Movex Canadian Accounts'))

@section('auth')
<div class="auth-wrap">
    <div class="auth-card">
        @include('layouts.flash')
        <h1>Login</h1>
        <p class="muted">Access the Canada monitoring dashboard or account payout dashboard.</p>

        <form method="POST" action="{{ route('login.store') }}" class="grid" style="margin-top:22px;">
            @csrf
            <div>
                <label for="login">Email or Username</label>
                <input id="login" name="login" value="{{ old('login') }}" required autofocus>
            </div>
            <div>
                <label for="password">Password</label>
                <input id="password" type="password" name="password" required>
            </div>
            <label style="display:flex; align-items:center; gap:8px; font-weight:700;">
                <input type="checkbox" name="remember" value="1" style="width:auto;"> Remember me
            </label>
            <button class="btn" type="submit">Login</button>
        </form>

        <p class="muted" style="margin-top:18px;">No account yet? <a href="{{ route('register') }}" style="color:var(--brand); font-weight:800;">Register here</a></p>
    </div>
</div>
@endsection