@extends('layouts.auth')

@section('title','Đăng nhập hệ thống')

@section('content')
  <div class="row">
    <div class="col-lg-4 col-md-6 col-sm-8 mx-auto">
      <div class="card card-body mt-4 shadow-lg">
        <h4 class="text-center mb-4">Đăng nhập</h4>
        <form method="POST" action="{{ route('login') }}">
          @csrf

          {{-- Email --}}
          <div class="mb-3">
            <label for="email" class="form-label">Email</label>
            <input id="email" type="email" name="email"
                   class="form-control @error('email') is-invalid @enderror"
                   value="{{ old('email') }}" required autofocus>
            @error('email')
              <div class="invalid-feedback">{{ $message }}</div>
            @enderror
          </div>

          {{-- Password --}}
          <div class="mb-3">
            <label for="password" class="form-label">Mật khẩu</label>
            <input id="password" type="password" name="password"
                   class="form-control @error('password') is-invalid @enderror"
                   required>
            @error('password')
              <div class="invalid-feedback">{{ $message }}</div>
            @enderror
          </div>

          {{-- Remember --}}
          <div class="form-check form-switch mb-3">
            <input class="form-check-input" type="checkbox" name="remember" id="remember">
            <label class="form-check-label" for="remember">Ghi nhớ đăng nhập</label>
          </div>

          {{-- Submit --}}
          <div class="d-grid">
            <button type="submit" class="btn btn-primary">
              Đăng nhập
            </button>
          </div>

          {{-- Forgot Password --}}
          @if(Route::has('password.request'))
            <p class="text-center text-sm mt-3">
              <a href="{{ route('password.request') }}">Quên mật khẩu?</a>
            </p>
          @endif
        </form>
      </div>
    </div>
  </div>
@endsection