@php
$title = 'Novo Lote';
@endphp

<div class="container-fluid pt-1" style="margin-top: -32px;">
    <nav aria-label="breadcrumb" class="mb-2" style="margin-top: -18px;">
        <ol class="breadcrumb bg-transparent px-0 py-1 mb-1" style="font-size: 0.98rem;">
            <li class="breadcrumb-item"><a href="/" class="text-decoration-none text-secondary">Início</a></li>
            <li class="breadcrumb-item"><a href="#" onclick="carregarConteudo(`{{ route('suprimentos.estoque') }}`)" class="text-decoration-none text-secondary">Suprimentos</a></li>
            <li class="breadcrumb-item"><a href="#" onclick="carregarConteudo(`{{ route('estoque.lotes.index') }}`)" class="text-decoration-none text-secondary">Lotes</a></li>
            <li class="breadcrumb-item active text-dark" aria-current="page">Novo Lote</li>
        </ol>
    </nav>
    
    <div class="d-flex justify-content-between align-items-center mb-4">
        <div>
            <h1 class="fw-bold mb-0" style="font-size:2.1rem; letter-spacing:1px;">
                <i class="bi bi-plus-circle me-2 text-primary"></i>Novo Lote
            </h1>
            <span class="text-muted small">Cadastre um novo lote de estoque manualmente</span>
        </div>
        <div>
            <button type="button" class="btn btn-sm btn-outline-secondary" onclick="carregarConteudo(`{{ route('estoque.lotes.index') }}`)">
                <i class="bi bi-arrow-left me-2"></i>Voltar
            </button>
        </div>
    </div>

    <form id="formNovoLote" class="needs-validation" novalidate>
        @csrf
        
        <div class="card shadow border-0 mb-3">
            <div class="card-header bg-white border-0 pb-1">
                <span class="fw-bold"><i class="bi bi-info-circle me-2"></i>Informações do Lote</span>
            </div>
            <div class="card-body">
                <div class="row mb-3">
                    <div class="col-md-3">
                        <label for="codigo_lote" class="form-label">Código do Lote</label>
                        <input type="text" class="form-control" id="codigo_lote" name="dados[codigo_lote]" 
                               value="{{ $proximoCodigo }}" readonly>
                        <small class="text-muted">Gerado automaticamente</small>
                    </div>
                    <div class="col-md-5">
                        <label for="produto_id" class="form-label">Produto <span class="text-danger">*</span></label>
                        <select class="form-select produto-select-lote" id="produto_id" name="dados[produto_id]" required>
                            <option value="">Selecione o produto...</option>
                            @foreach($produtos as $produto)
                                <option value="{{ $produto->id }}" data-unidade="{{ $produto->unidadeMedida->unidade ?? '' }}">
                                    {{ $produto->nome }}
                                </option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-md-4">
                        <label for="fornecedor_id" class="form-label">Fornecedor</label>
                        <select class="form-select" id="fornecedor_id" name="dados[fornecedor_id]">
                            <option value="">Selecione o fornecedor...</option>
                            @foreach($fornecedores as $fornecedor)
                                <option value="{{ $fornecedor->id }}">{{ $fornecedor->razao_social }}</option>
                            @endforeach
                        </select>
                    </div>
                </div>

                <div class="row mb-3">
                    <div class="col-md-3">
                        <label for="quantidade_inicial" class="form-label">Quantidade <span class="text-danger">*</span></label>
                        <input type="text" class="form-control quantidade-lote" id="quantidade_inicial" 
                               name="dados[quantidade_inicial]" value="" 
                               oninput="formatarQuantidade(this)" required>
                        <small class="text-muted" id="unidade_produto">Unidade</small>
                    </div>
                    <div class="col-md-3">
                        <label for="data_entrada" class="form-label">Data de Entrada <span class="text-danger">*</span></label>
                        <div class="input-group">
                            <input type="text" class="form-control datepicker" id="data_entrada"
                                   name="dados[data_entrada]" data-mask="date" readonly required>
                            <span class="input-group-text"><i class="bi bi-calendar3"></i></span>
                        </div>
                    </div>
                    <div class="col-md-3">
                        <label for="data_fabricacao" class="form-label">Data de Fabricação</label>
                        <div class="input-group">
                            <input type="text" class="form-control datepicker" id="data_fabricacao"
                                   name="dados[data_fabricacao]" data-mask="date" readonly>
                            <span class="input-group-text"><i class="bi bi-calendar3"></i></span>
                        </div>
                    </div>
                    <div class="col-md-3">
                        <label for="data_validade" class="form-label">Data de Validade</label>
                        <div class="input-group">
                            <input type="text" class="form-control datepicker" id="data_validade"
                                   name="dados[data_validade]" data-mask="date" readonly>
                            <span class="input-group-text"><i class="bi bi-calendar3"></i></span>
                        </div>
                    </div>
                </div>

                <div class="row mb-3">
                    <div class="col-md-6">
                        <label for="numero_certificado" class="form-label">Número do Certificado</label>
                        <input type="text" class="form-control" id="numero_certificado" 
                               name="dados[numero_certificado]" placeholder="Ex: CERT-2026-001">
                    </div>
                    <div class="col-md-6">
                        <label for="arquivo_certificado" class="form-label">Certificado (PDF)</label>
                        <input type="file" class="form-control" id="arquivo_certificado" 
                               name="arquivo_certificado" accept=".pdf">
                        <small class="text-muted">Arquivo PDF com no máximo 10MB</small>
                    </div>
                </div>

                <div class="row mb-3">
                    <div class="col-md-12">
                        <label for="observacoes" class="form-label">Observações</label>
                        <textarea class="form-control" id="observacoes" name="dados[observacoes]" 
                                  rows="3" placeholder="Informações adicionais sobre o lote"></textarea>
                    </div>
                </div>
            </div>
        </div>

        <div class="d-flex justify-content-end gap-2 mt-4 mb-4">
            <button type="button" class="btn btn-secondary" onclick="carregarConteudo(`{{ route('estoque.lotes.index') }}`)">
                <i class="bi bi-x-circle me-2"></i>Cancelar
            </button>
            <button type="button" class="btn btn-primary" onclick="prepararQuantidadeParaSalvar(); salvar(`{{ route('estoque.lotes.store') }}`, 'formNovoLote')">
                <i class="bi bi-check-circle me-2"></i>Salvar
            </button>
        </div>
    </form>
</div>

<script src="{{ asset('js/lotes.js') }}"></script>