<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <title>@yield('title', 'AI Vision Attendance — Setup')</title>
    <link rel="stylesheet" href="{{ asset('css/install.css') }}">
</head>
<body class="installer-body">
    <div class="installer-shell">
        <div class="installer-card">
            <div class="installer-header">
                <div class="installer-logo" aria-hidden="true">AV</div>
                <div>
                    <h1 class="installer-title">AI Vision Attendance</h1>
                    <p class="installer-tagline">@yield('tagline', 'Setup wizard')</p>
                </div>
            </div>

            @yield('content')
        </div>
        <p class="installer-footnote">@yield('footnote', 'Browser-based installer — no SSH, Composer, or command line required.')</p>
    </div>
    <script src="{{ asset('js/install.js') }}" defer></script>
</body>
</html>
