@extends('layouts.site')
@section('meta_title', _trans('Core::page.login.meta_title', 'Sign In to Your Account'))
@php
    $contactPageUrl = _menu_item_url('/contact');
@endphp
@section('content')
    <section class="site-main-section">
        <div class="container-centered">
            <div class="site-card overflow-hidden">
                <div class="bg-primary-strong text-primary-content px-8 py-8 text-center">
                    <span class="mb-4 inline-flex h-16 w-16 items-center justify-center rounded-full border border-brand-border bg-brand-border/50">
                        <i class="fa-solid fa-lock leading-none text-2xl" aria-hidden="true"></i>
                    </span>
                    <h1 class="text-primary-content text-3xl font-bold">{{ _trans('Core::page.login.panel_title', 'Welcome back') }}</h1>
                    <p class="mt-3 text-sm">{{ _trans('Core::page.login.introduction', 'Sign in to view your rewards dashboard, orders, training, and redemption activity.') }}</p>
                </div>
                <div class="px-6 py-8 md:px-8">
                    <form class="form-classic" role="form" method="POST" action="{{ route('login') }}">
                        {{ csrf_field() }}
                        <div class="form-group">
                            <label for="login-username" class="form-label">{{ _trans('Core::page.login.username', 'Login') }}</label>
                            <input type="username" id="login-username" name="username" class="form-control form-control-has-validation" value="{{ old('username') }}" maxlength="255" required autofocus />
                            @if ($errors->has('username'))
                                <span class="help-block"><strong>{{ $errors->first('username') }}</strong></span>
                            @endif
                        </div>
                        <div class="form-group">
                            <label for="login-password" class="form-label">{{ _trans('Core::page.login.password', 'Password') }}</label>
                            <input type="password" id="login-password" name="password" class="form-control form-control-has-validation" required />
                            @if ($errors->has('password'))
                                <span class="help-block"><strong>{{ $errors->first('password') }}</strong></span>
                            @endif
                        </div>
                        <div class="form-group flex items-center justify-between">
                            <label for="login-remember" class="mb-0 flex items-center gap-3 text-sm font-medium">
                                <input type="checkbox" name="remember" id="login-remember" class="h-4 w-4 rounded p-0" />
                                {{ _trans('Core::page.login.remember_me', 'Remember Me') }}
                            </label>
                            <a href="{{ route('password.request') }}" class="text-sm font-medium hover:text-primary">{{ _trans('Core::page.login.forgot_password_cta', 'Forgot password?') }}</a>
                        </div>
                        <div class="form-group space-y-3">
                            <button type="submit" class="btn btn-primary btn-block">{{ _trans('Core::page.login.submit', 'Sign In') }}</button>
                            @unless (empty($drivers = array_filter(config('core.auth.drivers', []))))
                                <p class="text-center text-sm font-medium uppercase tracking-[0.25em]">{{ _trans('Core::page.login.sso_or', 'or') }}</p>
                                @foreach ($drivers as $driver)
                                    <a href="{{ route('sso.redirect', $driver) }}" class="btn btn-default btn-block">
                                        {{ _trans('Core::page.login.sso_prefix', 'Sign in with') }} {{ ucfirst($driver) }}
                                    </a>
                                @endforeach
                            @endunless
                        </div>
                    </form>
                    <div class="mt-3 grid gap-3 pt-3">
                        <a href="{{ route('participant.enroll.create') }}" class="btn btn-default btn-block">
                            {{ _trans('Core::page.login.enroll_cta', 'Not enrolled yet? Enroll now.') }}
                        </a>
                        @if ($contactPageUrl)
                            <a href="{{ $contactPageUrl }}" class="btn btn-default btn-block">
                                {{ _trans('Core::page.login.contact_us', 'Need Help? Contact Us.') }}
                            </a>
                        @endif
                    </div>
                </div>
            </div>
        </div>
    </section>
@endsection
