@extends('layouts.portal')

@section('title', __('Sign in'))

@section('content')
    <main class="portal-shell">
        <section class="brand-panel" aria-label="ERP POS">
            <a class="brand-lockup" href="{{ route('login') }}">
                <span class="brand-mark" aria-hidden="true">EP</span>
                <span class="brand-name">ERP <span>/ POS</span></span>
            </a>

            <div class="brand-copy">
                <p class="eyebrow">{{ __('LOS ANGELES | OPERATIONS') }}</p>
                <h1>{{ __('One place for') }}<br>{{ __('the work') }} <span>{{ __('ahead.') }}</span></h1>
            </div>

            <div class="brand-foot">
                <span>{{ __('PRIVATE WORKSPACE') }}</span>
                <span>{{ __('EST. 2026') }}</span>
            </div>
        </section>

        <section class="auth-panel">
            <div class="auth-top">{{ __('ERP / POS | ACCOUNT ACCESS') }}</div>

            <div class="auth-content">
                <p class="eyebrow">{{ __('WELCOME BACK') }}</p>
                <h2>{{ __('Sign in') }}</h2>
                <p class="auth-note">{{ __('Use your username.') }}</p>

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

                    @error('login')
                        <p class="form-error" role="alert">{{ $message }}</p>
                    @enderror

                    <div class="field">
                        <label for="login">{{ __('Username') }}</label>
                        <input id="login" name="login" type="text" value="{{ old('login') }}" autocomplete="username" required autofocus>
                    </div>

                    <div class="field">
                        <label for="password">{{ __('Password') }}</label>
                        <input id="password" name="password" type="password" autocomplete="current-password" required>
                    </div>

                    <div class="remember-row">
                        <label for="remember">
                            <input id="remember" name="remember" type="checkbox" value="1">
                            <span>{{ __('Keep me signed in') }}</span>
                        </label>
                    </div>

                    <button class="login-button" type="submit">
                        <span>{{ __('Continue') }}</span>
                        <span aria-hidden="true">&rarr;</span>
                    </button>
                </form>
            </div>

            <footer class="auth-foot">{{ __('Authorized accounts only') }}</footer>
        </section>
    </main>
@endsection