@php
    $c = config('theme.colors');
    $breadcrumbs = [
        ['label' => __('common.home'), 'url' => route('dashboard.index')],
        ['label' => __('onboarding.title')],
    ];
@endphp

<x-ui.layout.page
    :title="__('onboarding.title')"
    :subtitle="__('onboarding.subtitle')"
    page-icon="fe fe-flag"
    :breadcrumbs="$breadcrumbs"
>
    @if ($tenant->onboarding_completed_at)
        <p class="text-muted">{{ __('onboarding.already_done') }}</p>
        <x-ui.buttons.primary :href="route('dashboard.index')">{{ __('nav.item.dashboard') }}</x-ui.buttons.primary>
    @else
        <div class="row row-cards">
            <div class="col-12 col-lg-6">
                <div class="card mb-3">
                    <div class="card-header"><h3 class="card-title" style="color: {{ $c['text'] }}">{{ __('onboarding.company') }}</h3></div>
                    <div class="card-body">
                        <form method="post" action="{{ route('onboarding.company') }}" class="d-grid gap-2">
                            @csrf
                            <input class="form-control" name="legal_name" required placeholder="Legal name" value="{{ data_get($tenant->company_profile, 'legal_name') }}">
                            <input class="form-control" name="trade_name" placeholder="Trade name" value="{{ data_get($tenant->company_profile, 'trade_name') }}">
                            <input class="form-control" name="phone" placeholder="Phone" value="{{ data_get($tenant->company_profile, 'phone') }}">
                            <input class="form-control" name="country" placeholder="Country" value="{{ data_get($tenant->company_profile, 'country') }}">
                            <x-ui.buttons.primary type="submit">{{ __('common.save') }}</x-ui.buttons.primary>
                        </form>
                    </div>
                </div>
                <div class="card mb-3">
                    <div class="card-header"><h3 class="card-title" style="color: {{ $c['text'] }}">{{ __('onboarding.locale') }}</h3></div>
                    <div class="card-body">
                        <form method="post" action="{{ route('onboarding.locale') }}" class="d-grid gap-2">
                            @csrf
                            <select class="form-select" name="locale" required>
                                @foreach ($languages as $lang)
                                    <option value="{{ $lang->code }}" @selected($tenant->locale === $lang->code)>{{ $lang->name }} ({{ $lang->code }})</option>
                                @endforeach
                            </select>
                            <x-ui.buttons.primary type="submit">{{ __('common.save') }}</x-ui.buttons.primary>
                        </form>
                    </div>
                </div>
            </div>
            <div class="col-12 col-lg-6">
                <div class="card mb-3">
                    <div class="card-header"><h3 class="card-title" style="color: {{ $c['text'] }}">{{ __('onboarding.timezone') }}</h3></div>
                    <div class="card-body">
                        <form method="post" action="{{ route('onboarding.timezone') }}" class="d-grid gap-2">
                            @csrf
                            <select class="form-select" name="timezone" required>
                                @foreach ($timezones as $tz)
                                    <option value="{{ $tz }}" @selected($tenant->timezone === $tz)>{{ $tz }}</option>
                                @endforeach
                            </select>
                            <x-ui.buttons.primary type="submit">{{ __('common.save') }}</x-ui.buttons.primary>
                        </form>
                    </div>
                </div>
                <div class="card mb-3">
                    <div class="card-header"><h3 class="card-title" style="color: {{ $c['text'] }}">{{ __('onboarding.modules') }}</h3></div>
                    <div class="card-body">
                        <ul class="mb-3">
                            @forelse ($moduleSlugs as $slug)
                                <li><code>{{ $slug }}</code></li>
                            @empty
                                <li class="text-muted">—</li>
                            @endforelse
                        </ul>
                        <form method="post" action="{{ route('onboarding.modules') }}" class="d-grid gap-2">
                            @csrf
                            <label class="form-check">
                                <input class="form-check-input" type="checkbox" name="acknowledge" value="1" required>
                                <span class="form-check-label">{{ __('onboarding.modules') }}</span>
                            </label>
                            <x-ui.buttons.primary type="submit">{{ __('common.save') }}</x-ui.buttons.primary>
                        </form>
                    </div>
                </div>
                <form method="post" action="{{ route('onboarding.complete') }}">
                    @csrf
                    <x-ui.buttons.primary type="submit">{{ __('onboarding.complete') }}</x-ui.buttons.primary>
                </form>
            </div>
        </div>
    @endif
</x-ui.layout.page>
