@extends('layouts.app')
@section('content')
<div class="max-w-md mx-auto mt-10 bg-white p-8 rounded-2xl shadow-sm border border-gray-100">
    <h2 class="text-2xl font-bold text-center text-gray-900 mb-6">Login to API<span class="text-red-600">Hub</span></h2>
    @if($errors->any()) <div class="text-red-500 text-sm mb-4">{{ $errors->first() }}</div> @endif
    <form action="{{ route('login') }}" method="POST" class="space-y-4">
        @csrf
        <div>
            <label class="block text-sm font-semibold text-gray-700">Email Address</label>
            <input type="email" name="email" class="w-full mt-1 p-3 border border-gray-200 rounded-lg focus:ring-red-500 focus:border-red-500" required>
        </div>
        <div>
            <label class="block text-sm font-semibold text-gray-700">Password</label>
            <input type="password" name="password" class="w-full mt-1 p-3 border border-gray-200 rounded-lg focus:ring-red-500 focus:border-red-500" required>
        </div>
        <button type="submit" class="w-full bg-red-600 text-white font-bold py-3 rounded-lg hover:bg-red-700">Login</button>
    </form>
    <p class="text-center mt-4 text-sm">Don't have an account? <a href="{{ route('register') }}" class="text-red-600 font-bold">Register</a></p>
</div>
@endsection