@extends('vendor.installer.layouts.master')

@section('template_title', 'Administrator')

@section('title')
    <span class="inline-flex items-center gap-3"><i class="fa-solid fa-user-shield text-brand-600"></i> Create Administrator</span>
@endsection

@section('subtitle', 'Replace the default seeded admin with the real account you’ll log in with.')

@section('container')
    <form method="POST" action="{{ route('LaravelInstaller::admin.store') }}" class="space-y-5">
        @csrf
        <div class="grid sm:grid-cols-2 gap-4">
            <div>
                <label class="lbl" for="first_name">First name</label>
                <input id="first_name" name="first_name" type="text" required value="{{ old('first_name') }}" placeholder="John" class="inp">
            </div>
            <div>
                <label class="lbl" for="last_name">Last name</label>
                <input id="last_name" name="last_name" type="text" required value="{{ old('last_name') }}" placeholder="Doe" class="inp">
            </div>
        </div>
        <div>
            <label class="lbl" for="email">Email address</label>
            <input id="email" name="email" type="email" required value="{{ old('email') }}" placeholder="you@company.com" class="inp">
        </div>
        <div class="grid sm:grid-cols-2 gap-4">
            <div>
                <label class="lbl" for="password">Password <span class="normal-case text-gray-400">(min 8 characters)</span></label>
                <input id="password" name="password" type="password" required minlength="8" class="inp">
            </div>
            <div>
                <label class="lbl" for="password_confirmation">Confirm password</label>
                <input id="password_confirmation" name="password_confirmation" type="password" required minlength="8" class="inp">
            </div>
        </div>

        <div class="rounded-lg bg-brand-50 dark:bg-brand-900/20 border border-brand-100 dark:border-brand-800/40 p-3.5 text-xs text-brand-800 dark:text-brand-200 flex items-start gap-2.5">
            <i class="fa-solid fa-shield-halved mt-0.5"></i>
            <div>
                The default seeded <code class="font-mono">admin@example.com</code> account will be replaced with the details above. You can change them again later from the admin profile.
            </div>
        </div>

        <div class="flex flex-wrap items-center justify-end gap-2 pt-2">
            <button type="submit" class="btn-primary">
                <i class="fa-solid fa-floppy-disk"></i> Save &amp; continue
            </button>
        </div>
    </form>
@endsection