@extends('layouts.auth')

@section('title', 'Admin Login - ' . setting('brand.name', 'Grace Family Church'))

@section('content')
<div class="login-container">

    <div class="login-split-card">

        <!-- LEFT: Brand panel (large screens only) -->
        <div class="login-brand-panel d-none d-lg-flex">
            <div class="login-brand-logo">
                <img src="{{ asset('assets/images/gfc_logo_light.jpg') }}" alt="{{ setting('brand.name', 'Grace Family Church') }} logo">
            </div>
            <h2 class="login-brand-name">{{ setting('brand.name', 'Grace Family Church') }}</h2>
            <p class="login-brand-tagline">{{ setting('brand.tagline', 'A place to encounter God, grow in community, and walk boldly in your calling.') }}</p>
            <div class="login-brand-verse">
                "Whatever you do, work at it with all your heart, as working for the Lord."
                <br><strong>Colossians 3:23</strong>
            </div>
        </div>

        <!-- RIGHT: Login form -->
        <div class="login-form-panel">
          <div class="login-form-inner">

            <div class="text-center mb-4">
                <div class="login-icon mx-auto d-lg-none">
                    <i class="fas fa-church"></i>
                </div>
                <h3>Admin Login</h3>
                <p class="login-subtitle">Sign in to manage your church website.</p>
            </div>

            @include('partials.alerts')

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

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

                <div class="mb-2">
                    <label class="form-label">Password</label>
                    <input type="password" name="password" class="form-control @error('password') is-invalid @enderror" placeholder="Enter your password" required>
                    @error('password')
                        <div class="invalid-feedback">{{ $message }}</div>
                    @enderror
                </div>

                <div class="text-end mb-3">
                    <a href="{{ route('admin.forgot') }}" class="forgot-link">
                        Forgot your password?
                    </a>
                </div>

                <button type="submit" class="btn btn-login w-100">
                    <i class="fas fa-sign-in-alt me-1"></i> Login to Admin Panel
                </button>
            </form>

          </div>
        </div>

    </div>

</div>
@endsection