@extends('layouts.app')

@section('title', 'Cadastrar NF-e - Documentos de Saida')
@section('page_title', 'Cadastrar NF-e (55)')
@section('page_subtitle', 'Envie o XML da NF-e para cadastro automatico')
@section('page_actions')
    <a class="button" href="{{ route('outgoing-xml.nfe.index') }}">Voltar</a>
@endsection

@push('styles')
<style>
    .upload-zone { padding: 32px 16px; display: grid; gap: 14px; justify-items: center; text-align: center; }
    .upload-zone input[type="file"] { max-width: 360px; }
    .form-field { display: grid; gap: 6px; }
    .form-field label { font-size: 11px; font-weight: 700; text-transform: uppercase; color: var(--muted); }
    .form-field select, .form-field input[type="file"] { min-height: 38px; border: 1px solid var(--border); border-radius: 6px; padding: 8px 10px; font: inherit; background: #fff; color: var(--text); }
    .form-actions { display: flex; gap: 10px; padding: 16px; border-top: 1px solid var(--border); justify-content: center; }
</style>
@endpush

@section('content')
<div class="panel">
    <div class="panel-header">
        <div>
            <h2>Envio de XML NF-e</h2>
            <span>Selecione a empresa e o arquivo XML. Os dados serao extraidos automaticamente.</span>
        </div>
    </div>

    <form method="POST" action="{{ route('outgoing-xml.nfe.store') }}" enctype="multipart/form-data">
        @csrf

        <div class="upload-zone">
            <div class="form-field" style="width:100%;max-width:400px">
                <label for="company_id">Empresa *</label>
                <select id="company_id" name="company_id" required>
                    <option value="">Selecione...</option>
                    @foreach ($companies as $company)
                        <option value="{{ $company->id }}" @selected(old('company_id') == $company->id)>{{ $company->name }}</option>
                    @endforeach
                </select>
                @error('company_id') <div class="error" style="font-size:12px;color:var(--danger)">{{ $message }}</div> @enderror
            </div>

            <div class="form-field" style="width:100%;max-width:400px">
                <label for="xml_file">Arquivo XML da NF-e *</label>
                <input id="xml_file" type="file" name="xml_file" accept=".xml,text/xml" required>
                @error('xml_file') <div class="error" style="font-size:12px;color:var(--danger)">{{ $message }}</div> @enderror
                @error('xml_content') <div class="error" style="font-size:12px;color:var(--danger)">{{ $message }}</div> @enderror
            </div>
        </div>

        <div class="form-actions">
            <button class="button primary" type="submit">Enviar e cadastrar</button>
            <a class="button" href="{{ route('outgoing-xml.nfe.index') }}">Cancelar</a>
        </div>
    </form>
</div>

<div class="panel">
    <div class="panel-header">
        <div>
            <h2>Ou envie via API</h2>
            <span>Envie o conteudo do XML diretamente via POST.</span>
        </div>
    </div>
    <div style="padding:16px;font-size:13px;font-family:monospace;background:var(--surface-2);border-radius:6px;margin:16px;word-break:break-all">
        POST /documentos-saida/nfe/api<br>
        Content-Type: application/xml<br><br>
        &lt;nfeProc&gt;<br>
        &nbsp;&nbsp;...<br>
        &lt;/nfeProc&gt;
    </div>
</div>
@endsection