@extends('installer.layout')

@section('content')
    <div>
        <p class="text-sm font-bold uppercase tracking-wide text-blue-600 dark:text-blue-300">App Setup</p>
        <h2 class="mt-2 text-2xl font-black text-slate-950 dark:text-white">Create your app and admin account.</h2>
        <p class="mt-3 text-sm text-slate-600 dark:text-slate-300">Use a strong admin password. This password is used to create the first admin user and is not saved inside `.env`.</p>
    </div>

    <form method="POST" action="{{ route('install.app.save') }}" class="mt-6 grid gap-5">
        @csrf

        <div class="grid gap-5 sm:grid-cols-2">
            <div>
                <label for="app_name" class="text-sm font-bold text-slate-700 dark:text-slate-200">App Name</label>
                <input id="app_name" name="app_name" value="{{ old('app_name', $setup['app_name'] ?? 'ViZuTrade') }}" required class="mt-1 block w-full rounded-lg border-blue-100 bg-white px-3 py-2 text-sm text-slate-900 shadow-sm focus:border-blue-500 focus:ring-blue-500 dark:border-blue-900 dark:bg-slate-950 dark:text-white">
            </div>

            <div>
                <label for="app_url" class="text-sm font-bold text-slate-700 dark:text-slate-200">App URL</label>
                <input id="app_url" name="app_url" value="{{ old('app_url', $setup['app_url'] ?? request()->getSchemeAndHttpHost()) }}" required class="mt-1 block w-full rounded-lg border-blue-100 bg-white px-3 py-2 text-sm text-slate-900 shadow-sm focus:border-blue-500 focus:ring-blue-500 dark:border-blue-900 dark:bg-slate-950 dark:text-white">
            </div>

            <div>
                <label for="admin_name" class="text-sm font-bold text-slate-700 dark:text-slate-200">Admin Name</label>
                <input id="admin_name" name="admin_name" value="{{ old('admin_name', $setup['admin_name'] ?? 'ViZuTrade Admin') }}" required class="mt-1 block w-full rounded-lg border-blue-100 bg-white px-3 py-2 text-sm text-slate-900 shadow-sm focus:border-blue-500 focus:ring-blue-500 dark:border-blue-900 dark:bg-slate-950 dark:text-white">
            </div>

            <div>
                <label for="admin_email" class="text-sm font-bold text-slate-700 dark:text-slate-200">Admin Email</label>
                <input id="admin_email" name="admin_email" type="email" value="{{ old('admin_email', $setup['admin_email'] ?? 'admin@vizutrade.test') }}" required class="mt-1 block w-full rounded-lg border-blue-100 bg-white px-3 py-2 text-sm text-slate-900 shadow-sm focus:border-blue-500 focus:ring-blue-500 dark:border-blue-900 dark:bg-slate-950 dark:text-white">
            </div>

            <div>
                <label for="admin_password" class="text-sm font-bold text-slate-700 dark:text-slate-200">Admin Password</label>
                <input id="admin_password" name="admin_password" type="password" required autocomplete="new-password" class="mt-1 block w-full rounded-lg border-blue-100 bg-white px-3 py-2 text-sm text-slate-900 shadow-sm focus:border-blue-500 focus:ring-blue-500 dark:border-blue-900 dark:bg-slate-950 dark:text-white">
            </div>

            <div>
                <label for="admin_password_confirmation" class="text-sm font-bold text-slate-700 dark:text-slate-200">Confirm Admin Password</label>
                <input id="admin_password_confirmation" name="admin_password_confirmation" type="password" required autocomplete="new-password" class="mt-1 block w-full rounded-lg border-blue-100 bg-white px-3 py-2 text-sm text-slate-900 shadow-sm focus:border-blue-500 focus:ring-blue-500 dark:border-blue-900 dark:bg-slate-950 dark:text-white">
            </div>
        </div>

        <div class="flex justify-between">
            <a href="{{ route('install.database') }}" class="rounded-lg border border-blue-100 px-5 py-2.5 text-sm font-bold text-blue-700 dark:border-blue-900 dark:text-blue-300">Back</a>
            <button type="submit" class="rounded-lg bg-blue-600 px-5 py-2.5 text-sm font-bold text-white hover:bg-blue-700">Save and Continue</button>
        </div>
    </form>
@endsection