@extends('layouts.app')

@section('content')
<div class="max-w-md mx-auto">
    <div class="p-6 rounded-2xl bg-black/70 text-white border border-black/20 shadow-xl">
        <h1 class="text-xl font-semibold tracking-wide">LOGIN</h1>

        <form method="POST" action="{{ route('login.attempt') }}" class="mt-6 space-y-4">
            @csrf

            <div>
                <label class="text-sm text-white/80">User</label>
                <input name="user" type="text" value="{{ old('user') }}" placeholder=""
                    class="mt-1 w-full rounded-xl bg-black/30 border border-white/10 px-3 py-2 text-white placeholder:text-white/50 focus:outline-none focus:ring-2 focus:ring-yellow-300"
                    required>
            </div>

            <div>
                <label class="text-sm text-white/80">Password</label>
                <input name="password" type="password"
                    class="mt-1 w-full rounded-xl bg-black/30 border border-white/10 px-3 py-2 text-white placeholder:text-white/50 focus:outline-none focus:ring-2 focus:ring-yellow-300"
                    required>
            </div>

            <div class="flex items-center justify-between">
                <label class="inline-flex items-center gap-2 text-sm text-white/80">
                    <input type="checkbox" name="remember" class="rounded bg-black/30 border-white/20">
                    Remember me
                </label>
            </div>

            <button class="w-full py-2.5 rounded-xl bg-yellow-400 hover:bg-yellow-300 text-black font-bold">
                Login
            </button>
        </form>

        <a href="{{ route('public.upload') }}"
           class="mt-5 inline-flex items-center justify-center w-full py-2.5 rounded-xl bg-cyan-400 hover:bg-cyan-300 text-slate-950 font-extrabold">
            UPLOAD PUBLIK
        </a>
    </div>
</div>
@endsection