@extends('layouts.account')

@section('title', __('Become a seller'))
@section('heading', __('Become a seller'))
@section('subheading', __('Open a seller profile. Your buying side is unaffected.'))

@section('account')
    <div class="max-w-2xl rounded-xl border border-border bg-surface p-6">
        <form action="{{ route('account.seller.store') }}" method="POST" class="space-y-5"
              x-data="submitGuard" @submit="submit()">
            @csrf

            <x-form.select name="type" :label="__('You are a')" :options="$sellerTypes" :placeholder="false" required />

            <x-form.input name="display_name" :label="__('Name to list under')" :value="auth()->user()->name" required
                          :hint="__('Shown on every listing and on your public profile.')" />

            <x-form.input name="headline" :label="__('One-line introduction')"
                          :hint="__('Optional. For example, the areas or property types you focus on.')" />

            <x-form.input name="contact_phone" type="tel" :label="__('Contact number for buyers')"
                          :value="auth()->user()->phone"
                          :hint="__('Optional. Leave blank to use the number on your account.')" />

            <div class="flex flex-wrap justify-end gap-3 border-t border-border pt-5">
                <x-button variant="outline" :href="route('account.dashboard')">{{ __('Cancel') }}</x-button>

                <button type="submit" class="btn btn-primary" :disabled="submitting">
                    <span x-show="!submitting">{{ __('Open seller profile') }}</span>
                    <span x-show="submitting" x-cloak>{{ __('Opening…') }}</span>
                </button>
            </div>
        </form>
    </div>
@endsection