<x-layouts.app title="Nova empresa" subtitle="Cadastro manual, com o administrador da conta">
    <form method="POST" action="{{ route('master.empresas.store') }}" class="max-w-3xl space-y-6">
        @csrf

        <div class="card card-pad">
            <h2 class="text-sm font-semibold text-slate-900">Dados da empresa</h2>

            <div class="mt-5 grid gap-5 sm:grid-cols-2">
                <div class="sm:col-span-2">
                    <label for="razao_social" class="label">Razão social</label>
                    <input id="razao_social" name="razao_social" value="{{ old('razao_social') }}" required class="input">
                </div>

                <div class="sm:col-span-2">
                    <label for="nome_fantasia" class="label">Nome fantasia</label>
                    <input id="nome_fantasia" name="nome_fantasia" value="{{ old('nome_fantasia') }}" class="input">
                </div>

                <div>
                    <label for="cnpj" class="label">CNPJ</label>
                    <input id="cnpj" name="cnpj" value="{{ old('cnpj') }}" required class="input tabular" placeholder="00.000.000/0000-00">
                </div>

                <div>
                    <label for="ie" class="label">Inscrição estadual</label>
                    <input id="ie" name="ie" value="{{ old('ie') }}" class="input tabular">
                </div>

                <div>
                    <label for="uf" class="label">UF</label>
                    <select id="uf" name="uf" required class="input">
                        <option value="">Selecione</option>
                        @foreach ($ufs as $uf)
                            <option value="{{ $uf }}" @selected(old('uf') === $uf)>{{ $uf }}</option>
                        @endforeach
                    </select>
                </div>

                <div>
                    <label for="telefone" class="label">Telefone</label>
                    <input id="telefone" name="telefone" value="{{ old('telefone') }}" class="input tabular">
                </div>

                <div>
                    <label for="email" class="label">E-mail de contato</label>
                    <input id="email" name="email" type="email" value="{{ old('email') }}" required class="input">
                </div>

                <div>
                    <label for="plano" class="label">Plano</label>
                    <input id="plano" name="plano" value="{{ old('plano', 'mensal') }}" required class="input">
                </div>

                <div>
                    <label for="assinatura_expira_em" class="label">Assinatura válida até</label>
                    <input id="assinatura_expira_em" name="assinatura_expira_em" type="date"
                           value="{{ old('assinatura_expira_em') }}" class="input tabular">
                </div>
            </div>
        </div>

        <div class="card card-pad">
            <h2 class="text-sm font-semibold text-slate-900">Administrador da conta</h2>

            <div class="mt-5 grid gap-5 sm:grid-cols-2">
                <div>
                    <label for="admin_name" class="label">Nome</label>
                    <input id="admin_name" name="admin_name" value="{{ old('admin_name') }}" required class="input">
                </div>

                <div>
                    <label for="admin_email" class="label">E-mail de acesso</label>
                    <input id="admin_email" name="admin_email" type="email" value="{{ old('admin_email') }}" required class="input">
                </div>

                <div class="sm:col-span-2">
                    <label for="admin_password" class="label">Senha inicial</label>
                    <input id="admin_password" name="admin_password" type="password" required autocomplete="new-password" class="input">
                    <p class="mt-1.5 text-xs text-slate-500">Mínimo de 8 caracteres, com letras e números. Oriente o cliente a trocar no primeiro acesso.</p>
                </div>
            </div>
        </div>

        <div class="flex gap-3">
            <button class="btn-primary">Cadastrar empresa</button>
            <a href="{{ route('master.empresas.index') }}" class="btn-secondary">Cancelar</a>
        </div>
    </form>
</x-layouts.app>
