@extends('layouts.site')

@section('title', 'Login - Auctions Ontario')

@section('content')
  @include('partials.page-banner', ['title' => 'Login'])

  <section class="et_auth_wrap">
    <div class="container">
      <div class="row">
        <div class="col-md-5 mx-auto">
          <div class="et_auth_inner">
            <ul class="nav et_auth_tabs justify-content-between border-0 mb-4 pb-3">
              <li class="nav-item">
                <a href="{{ route('login') }}" class="nav-link active">LOGIN</a>
              </li>
              <li class="nav-item">
                <a href="{{ route('register') }}" class="nav-link">SIGN UP</a>
              </li>
            </ul>

            <x-auth-session-status class="mb-3" :status="session('status')" />

            <form method="POST" action="{{ route('login') }}">
              @csrf

              <div class="mb-3">
                <input
                  id="email"
                  type="email"
                  name="email"
                  class="et_form-control form-control"
                  placeholder="Email"
                  value="{{ old('email') }}"
                  autocomplete="username"
                  required
                  autofocus
                />
                <x-input-error :messages="$errors->get('email')" class="mt-2" />
              </div>

              <div class="mb-2 position-relative">
                <input
                  id="password"
                  type="password"
                  name="password"
                  class="et_form-control form-control"
                  placeholder="Password"
                  autocomplete="current-password"
                  required
                />
                <x-input-error :messages="$errors->get('password')" class="mt-2" />
              </div>

              <div class="form-check mb-3">
                <input class="form-check-input" type="checkbox" name="remember" id="remember_me" />
                <label class="form-check-label" for="remember_me">Remember me</label>
              </div>

              @if (Route::has('password.request'))
                <div class="text-end mb-4">
                  <a href="{{ route('password.request') }}" class="et_forgot_link">
                    Forgot Password?
                  </a>
                </div>
              @endif

              <button type="submit" class="ct_orange_btn w-100 justify-content-center">
                LOGIN
              </button>

              <p class="et_bottom_text">
                Don't Have an account?
                <a href="{{ route('register') }}">Sign Up</a>
              </p>
            </form>
          </div>
        </div>
      </div>
    </div>
  </section>
@endsection