@extends('installer.layout')

@section('step_content')
    <div class="border-b border-slate-800 pb-4">
        <h2 class="text-lg sm:text-xl font-extrabold text-white flex items-center gap-2">
            <i class="fa-solid fa-list-check text-amber-400"></i>
            <span>Step 3: Run Database Migrations & Seeders</span>
        </h2>
        <p class="text-xs text-slate-400 mt-1">Initialize the database schema tables and seed platform settings and defaults.</p>
    </div>

    <div class="p-5 sm:p-6 rounded-3xl bg-slate-950 border border-slate-800 space-y-4 text-center">
        <div class="w-14 h-14 sm:w-16 sm:h-16 rounded-2xl bg-amber-500/10 text-amber-400 font-bold flex items-center justify-center text-xl sm:text-2xl mx-auto border border-amber-500/20">
            ⚙️
        </div>
        <div class="space-y-1">
            <h3 class="font-extrabold text-sm sm:text-base text-white">Ready to Initialize Database</h3>
            <p class="text-xs text-slate-400 max-w-md mx-auto leading-relaxed">
                Clicking the button below will run database migration scripts and seed default platform configuration records.
            </p>
        </div>
    </div>

    <form action="{{ route('install.migrate.submit') }}" method="POST" class="pt-4 border-t border-slate-800 flex flex-col-reverse sm:flex-row items-center justify-between gap-3">
        @csrf
        <a href="{{ route('install.database') }}" class="w-full sm:w-auto text-center py-2.5 text-xs font-bold text-slate-400 hover:text-white transition-colors">
            <i class="fa-solid fa-arrow-left mr-1"></i> Back
        </a>

        <button type="submit" class="w-full sm:w-auto px-8 py-3.5 rounded-2xl bg-amber-400 hover:bg-amber-300 text-slate-950 font-black text-xs shadow-xl shadow-amber-500/20 transition-all flex items-center justify-center gap-2">
            <span>Run Migrations & Seeders</span>
            <i class="fa-solid fa-arrow-right"></i>
        </button>
    </form>
@endsection