{% extends "base.html" %}

{% block title %}{% if venda %}Pedido #{{ venda.numero_pedido }}{% else %}Novo Pedido de Venda{% endif %}{% endblock %}

{% block head %}
<style>
    .info-bar {
        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
        color: white;
        padding: 8px 15px;
        border-radius: 8px;
        font-size: 0.9rem;
    }
    .cliente-box {
        border: 2px solid #e9ecef;
        border-radius: 10px;
        padding: 15px;
        background: #f8f9fa;
        transition: all 0.3s;
    }
    .cliente-box.selecionado {
        border-color: #28a745;
        background: #e8f5e9;
    }
    .cliente-selecionado-info {
        display: none;
    }
    .cliente-selecionado-info.ativo {
        display: block;
    }
    .item-row {
        transition: all 0.3s;
    }
    .item-row:hover {
        background-color: #f8f9fa;
    }
    .btn-add-item {
        border: 2px dashed #dee2e6;
        background: #f8f9fa;
        color: #6c757d;
        transition: all 0.3s;
    }
    .btn-add-item:hover {
        border-color: #0d6efd;
        color: #0d6efd;
        background: #e7f1ff;
    }
    .totais-card {
        position: sticky;
        top: 80px;
    }
    .produto-input {
        font-size: 1.1rem;
    }
    .qtd-input {
        width: 80px !important;
        text-align: center;
    }
    .valor-input {
        width: 120px !important;
        text-align: right;
    }
    .autocomplete-dropdown {
        position: absolute;
        z-index: 1000;
        width: 100%;
        max-height: 420px;
        overflow-y: auto;
        background: #f5f7fb;
        border: 1px solid #d8e0ee;
        border-radius: 14px;
        box-shadow: 0 10px 28px rgba(15, 23, 42, 0.14);
        padding: 10px;
        display: none;
    }
    #produtoDropdown {
        width: min(760px, calc(100vw - 60px));
        right: 0;
        left: auto;
    }
    .autocomplete-dropdown.show {
        display: block;
    }
    .autocomplete-item {
        padding: 9px 12px;
        cursor: pointer;
        border: 1px solid #dce4f2;
        border-radius: 12px;
        background: #ffffff;
        margin-bottom: 8px;
        display: flex;
        flex-direction: column;
        gap: 6px;
        transition: all 0.18s ease;
    }
    .autocomplete-item:last-child {
        margin-bottom: 0;
    }
    .autocomplete-item:hover {
        background: #eef4ff;
        border-color: #9bb8f0;
        transform: translateY(-1px);
    }
    .autocomplete-item.active {
        background: #e8f1ff;
        border-color: #3b82f6;
        box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.16);
    }
    .autocomplete-item .produto-nome {
        font-weight: 600;
        color: #1f2937;
        white-space: normal;
        overflow-wrap: anywhere;
        line-height: 1.3;
    }
    .autocomplete-item .produto-topo {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        gap: 10px;
    }
    .autocomplete-item .produto-info {
        font-size: 0.85rem;
        color: #6c757d;
    }
    .autocomplete-item .produto-meta-grid {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
    }
    .autocomplete-item .produto-meta-pill {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        padding: 3px 7px;
        border-radius: 999px;
        background: #f1f5f9;
        color: #475569;
        font-size: 0.75rem;
        line-height: 1.2;
    }
    .autocomplete-item .produto-preco-box {
        flex: 0 0 auto;
        text-align: right;
    }
    .autocomplete-item .produto-preco {
        display: inline-block;
        font-size: 0.98rem;
        font-weight: 700;
        color: #198754;
        white-space: nowrap;
    }
    .autocomplete-item .produto-acao {
        font-size: 0.72rem;
        color: #64748b;
    }
    .linha-lancamento {
        background: #f8f9fa;
        border-radius: 10px;
        padding: 15px;
        margin-bottom: 10px;
    }
    @media (max-width: 991px) {
        #produtoDropdown {
            width: 100%;
            left: 0;
            right: auto;
        }
    }
</style>
{% endblock %}

{% block content %}
{% set imprimir_a4_disponivel = has_endpoint('imprimir_venda') %}
{% set imprimir_80mm_disponivel = has_endpoint('imprimir_venda_termica') %}
{% set nota_fiscal_detalhe_disponivel = has_endpoint('fiscal_nota_fiscal') %}
{% set notas_fiscais_lista_disponivel = has_endpoint('fiscal_notas') %}
{% set emitir_nfe_disponivel = has_endpoint('fiscal_emitir_nfe') %}
{% set devolucao_disponivel = has_endpoint('devolucao_selecionar_itens') %}
<div class="container-fluid">
    {# Barra de Navegação e Ações #}
    <div class="d-flex justify-content-between align-items-center mb-3">
        <div class="d-flex align-items-center gap-2">
            <a href="{{ url_for('vendas') }}" class="btn btn-outline-secondary">
                <i class="bi bi-arrow-left"></i> Voltar
            </a>
            {% if venda %}
            <div class="btn-group">
                <a href="{{ url_for('editar_venda', id=venda.id - 1) if venda.id > 1 else '#' }}" 
                   class="btn btn-outline-secondary btn-sm {{ 'disabled' if venda.id <= 1 else '' }}">
                    <i class="bi bi-chevron-bar-left"></i>
                </a>
                <a href="{{ url_for('editar_venda', id=venda.id - 1) if venda.id > 1 else '#' }}" 
                   class="btn btn-outline-secondary btn-sm {{ 'disabled' if venda.id <= 1 else '' }}">
                    <i class="bi bi-chevron-left"></i>
                </a>
                <a href="{{ url_for('editar_venda', id=venda.id + 1) }}" 
                   class="btn btn-outline-secondary btn-sm">
                    <i class="bi bi-chevron-right"></i>
                </a>
                <a href="#" class="btn btn-outline-secondary btn-sm" onclick="irParaUltimo()">
                    <i class="bi bi-chevron-bar-right"></i>
                </a>
            </div>
            <button type="button" class="btn btn-outline-primary btn-sm" data-bs-toggle="modal" data-bs-target="#modalLocalizar">
                <i class="bi bi-search"></i> Localizar
            </button>
            {% endif %}
        </div>
        <div class="d-flex align-items-center gap-2">
            {% if venda and venda.status == 'aberto' %}
            <button type="button" class="btn btn-outline-danger" onclick="cancelarPedido()">
                <i class="bi bi-x-circle"></i> Cancelar
            </button>
            {% endif %}
            {% if not venda_bloqueada %}
            <button type="submit" form="formVenda" class="btn btn-success">
                <i class="bi bi-check-lg"></i> Salvar
            </button>
            {% endif %}
        </div>
    </div>

    {# Barra de Informações #}
    <div class="info-bar d-flex justify-content-between align-items-center mb-3">
        <div class="d-flex align-items-center gap-2">
            <i class="bi bi-receipt"></i>
            <strong>{% if venda %}Pedido #{{ venda.numero_pedido }}{% else %}Novo Pedido{% endif %}</strong>
            {# Badge de Status com cores específicas #}
            {% if venda %}
                {% if venda.status == 'aberto' %}
                <span class="badge bg-primary ms-2" title="Em edição, não pode ser recebida no PDV">
                    <i class="bi bi-pencil"></i> ABERTO
                </span>
                {% elif venda.status == 'fechado' %}
                <span class="badge bg-success ms-2" title="Pronto para recebimento no PDV">
                    <i class="bi bi-check-circle"></i> FECHADO
                </span>
                {% elif venda.status == 'recebido' %}
                <span class="badge bg-info ms-2" title="Pagamento recebido, sem documento fiscal">
                    <i class="bi bi-cash-coin"></i> RECEBIDO
                </span>
                {% elif venda.status == 'faturado' %}
                <span class="badge bg-dark ms-2" title="Documento fiscal emitido">
                    <i class="bi bi-file-earmark-check"></i> FATURADO
                </span>
                {% elif venda.status == 'cancelado' %}
                <span class="badge bg-danger ms-2">
                    <i class="bi bi-x-octagon"></i> CANCELADO
                </span>
                {% else %}
                <span class="badge bg-secondary ms-2">{{ venda.status|upper }}</span>
                {% endif %}
            {% else %}
            <span class="badge bg-light text-dark ms-2">RASCUNHO</span>
            {% endif %}
        </div>
        <div class="d-flex align-items-center gap-3">
            <span><i class="bi bi-calendar3"></i> {{ now.strftime('%d/%m/%Y') }}</span>
            <span><i class="bi bi-clock"></i> {{ now.strftime('%H:%M') }}</span>
            <span><i class="bi bi-person"></i> {{ current_user.username }}</span>
        </div>
    </div>

    {# Barra de Ações do Pedido #}
    {% if venda %}
    <div class="card mb-3 border-0 shadow-sm">
        <div class="card-body py-2 d-flex justify-content-between align-items-center flex-wrap gap-2">
            <div class="d-flex gap-2 flex-wrap">
                {# Botões de acordo com o status #}
                {% if venda.status in ['aberto', 'digitacao'] %}
                    <button type="button" class="btn btn-success btn-sm" onclick="fecharPedido()" title="Finalizar pedido para recebimento no PDV">
                        <i class="bi bi-lock"></i> Fechar Pedido
                    </button>
                {% elif venda.status == 'fechado' %}
                    <button type="button" class="btn btn-warning btn-sm" onclick="reabrirPedido()" title="Reabrir para edição">
                        <i class="bi bi-unlock"></i> Reabrir
                    </button>
                {% endif %}
                
                {# Copiar pedido - disponível para qualquer status exceto aberto #}
                {% if venda.status not in ['aberto', 'digitacao'] %}
                <button type="button" class="btn btn-outline-primary btn-sm" onclick="copiarPedido()" title="Criar novo pedido com os mesmos itens">
                    <i class="bi bi-copy"></i> Copiar Pedido
                </button>
                {% endif %}
                
                {# Cancelar - disponível para status aberto, digitacao, fechado e recebido #}
                {% if venda.status in ['aberto', 'digitacao', 'fechado', 'recebido'] %}
                <button type="button" class="btn btn-outline-danger btn-sm" onclick="cancelarPedido()">
                    <i class="bi bi-x-circle"></i> Cancelar
                </button>
                {% endif %}

                {% if imprimir_a4_disponivel %}
                <a href="{{ safe_url_for('imprimir_venda', fallback='#', id=venda.id) }}" target="_blank" rel="noopener" class="btn btn-outline-info btn-sm">
                    <i class="bi bi-printer"></i> Imprimir A4
                </a>
                {% endif %}

                {% if imprimir_80mm_disponivel %}
                <a href="{{ safe_url_for('imprimir_venda_termica', fallback='#', id=venda.id) }}" target="_blank" rel="noopener" class="btn btn-outline-info btn-sm">
                    <i class="bi bi-receipt"></i> Imprimir 80mm
                </a>
                {% endif %}

                {% if venda.status != 'cancelado' and not tem_nota_fiscal %}
                    {% if venda.caixa_pdv_id and venda.status == 'recebido' %}
                    <button type="button" class="btn btn-outline-success btn-sm" onclick="emitirNFCeVenda({{ venda.id }})">
                        <i class="bi bi-receipt-cutoff"></i> Gerar NFC-e
                    </button>
                    {% endif %}

                    {% if emitir_nfe_disponivel %}
                    <a href="{{ safe_url_for('fiscal_emitir_nfe', fallback='#', venda_id=venda.id) }}" class="btn btn-outline-success btn-sm">
                        <i class="bi bi-file-earmark-text"></i> Gerar NF-e
                    </a>
                    {% endif %}
                {% endif %}

                {% if devolucao_disponivel and venda.status not in ['aberto', 'digitacao', 'cancelado'] and venda.itens|length > 0 %}
                <a href="{{ safe_url_for('devolucao_selecionar_itens', fallback='#', venda_id=venda.id) }}" class="btn btn-outline-warning btn-sm">
                    <i class="bi bi-arrow-counterclockwise"></i> Gerar Devolução
                </a>
                {% endif %}
            </div>
            
            {# Informações adicionais #}
            <div class="text-muted small">
                {% if venda.status == 'aberto' %}
                <i class="bi bi-info-circle"></i> Pedido novo - adicione produtos e cliente para continuar
                {% elif venda.status == 'digitacao' %}
                <i class="bi bi-info-circle"></i> Pedido em digitação - clique em "Fechar Pedido" quando finalizar
                {% elif venda.status == 'fechado' %}
                <i class="bi bi-info-circle"></i> Pronto para recebimento no PDV (F10 > D{{ venda.id }})
                {% if venda.data_fechamento %}
                <br><small class="text-success">✓ Fechado em {{ venda.data_fechamento.strftime('%d/%m/%Y às %H:%M') }}</small>
                {% endif %}
                {% elif venda.status == 'recebido' %}
                <i class="bi bi-check-circle text-success"></i> Pagamento recebido - pode emitir NF-e
                {% if venda.data_recebimento %}
                <br><small class="text-success">✓ Recebido em {{ venda.data_recebimento.strftime('%d/%m/%Y às %H:%M') }}</small>
                {% endif %}
                {% elif venda.status == 'faturado' %}
                <i class="bi bi-info-circle"></i> Documento fiscal vinculado: {{ venda.chave_documento or 'NF-e' }}
                {% if venda.data_fechamento %}
                <br><small class="text-success">✓ Faturado em {{ venda.data_fechamento.strftime('%d/%m/%Y às %H:%M') }}</small>
                {% endif %}
                {% endif %}
            </div>
        </div>
    </div>
    {% endif %}

    {# Alerta de Bloqueio para Vendas Finalizadas #}
    {% if venda_bloqueada %}
    <div class="alert alert-warning d-flex align-items-center mb-3" role="alert">
        <i class="bi bi-lock-fill fs-4 me-3"></i>
        <div>
            <h5 class="alert-heading mb-1"><i class="bi bi-shield-lock"></i> Venda Bloqueada para Edição</h5>
            <p class="mb-0">{{ motivo_bloqueio }}</p>
            {% if venda and venda.status == 'cancelado' %}
            <small class="text-muted">Se precisar refazer o pedido, use <strong>Copiar Pedido</strong> para criar um novo pedido ativo e sem marca de cancelamento.</small>
            {% elif tem_nota_fiscal %}
            <small class="text-muted">Para alterações, utilize os módulos de Cancelamento ou Devolução.</small>
            {% endif %}
        </div>
    </div>
    {% endif %}

    <form method="POST" id="formVenda" class="no-lock">
        <div class="row">
            {# Coluna Principal #}
            <div class="col-lg-9">
                {# Card Cabeçalho do Pedido #}
                <div class="card mb-3">
                    <div class="card-body py-3">
                        <div class="row g-2">
                            {# Empresa (hidden) #}
                            <input type="hidden" name="empresa_id" id="empresaSelect" value="{{ empresa_padrao.id if empresa_padrao else (empresas[0].id if empresas else '') }}">
                            
                            {# Data da Venda (Bloqueada) #}
                            <div class="col-md-2">
                                <label class="form-label mb-1 small"><i class="bi bi-calendar"></i> Data Criação</label>
                                <input type="text" class="form-control form-control-sm" 
                                       value="{{ venda.data_venda.strftime('%d/%m/%Y') if venda and venda.data_venda else now.strftime('%d/%m/%Y') }}" 
                                       readonly style="background-color: #e9ecef;">
                            </div>
                            
                            {# Status (Bloqueado - controlado pelo sistema) #}
                            <div class="col-md-2">
                                <label class="form-label mb-1 small"><i class="bi bi-info-circle"></i> Status</label>
                                <input type="text" class="form-control form-control-sm text-uppercase fw-bold" 
                                       value="{{ venda.status if venda else 'ABERTO' }}" 
                                       readonly style="background-color: #e9ecef;">
                            </div>
                            
                            {# Vendedor #}
                            <div class="col-md-2">
                                <label class="form-label mb-1 small"><i class="bi bi-person-badge"></i> Vendedor</label>
                                <select class="form-select form-select-sm" name="vendedor_id" id="vendedorSelect">
                                    <option value="">Nenhum</option>
                                    {% for vendedor in vendedores %}
                                    <option value="{{ vendedor.id }}" 
                                            {% if venda and venda.vendedor_id == vendedor.id %}selected{% endif %}>
                                        {{ vendedor.nome }}
                                    </option>
                                    {% endfor %}
                                </select>
                            </div>
                            
                            {# Forma de Pagamento #}
                            <div class="col-md-3">
                                <label class="form-label mb-1 small"><i class="bi bi-credit-card"></i> Forma Pagamento</label>
                                <select class="form-select form-select-sm" name="forma_pagamento" id="formaPagamentoSelect">
                                    <option value="">-- Selecione --</option>
                                    {% if formas_pagamento %}
                                        {% for forma in formas_pagamento %}
                                        <option value="{{ forma.id }}" data-nome="{{ forma.nome }}"
                                                {% if venda and venda.forma_pagamento == forma.nome %}selected{% endif %}>
                                            {{ forma.nome }}
                                        </option>
                                        {% endfor %}
                                    {% else %}
                                        <option value="" disabled class="text-warning">⚠ Nenhuma forma cadastrada - cadastre em Financeiro</option>
                                    {% endif %}
                                </select>
                            </div>
                            
                            {# Tabela de Preço #}
                            <div class="col-md-2">
                                <label class="form-label mb-1 small"><i class="bi bi-tags"></i> Tabela de Preço</label>
                                <select class="form-select form-select-sm" name="tabela_preco_id" id="tabelaPrecoSelect">
                                    <option value="">Preço Padrão</option>
                                    {% if tabelas_preco and tabelas_preco|length > 0 %}
                                        {% for tabela in tabelas_preco %}
                                        <option value="{{ tabela.id }}" 
                                                data-tipo-calculo="{{ tabela.tipo_calculo }}"
                                                data-percentual="{{ tabela.percentual_ajuste or 0 }}"
                                                {% if venda and venda.tabela_preco_id == tabela.id %}selected{% endif %}>
                                            {{ tabela.nome }}
                                        </option>
                                        {% endfor %}
                                    {% endif %}
                                </select>
                            </div>
                            
                            {# Venda Funcionário #}
                            <div class="col-md-1">
                                <label class="form-label mb-1 small d-block">&nbsp;</label>
                                <div class="form-check form-switch">
                                    <input class="form-check-input" type="checkbox" name="venda_funcionario" id="vendaFuncionarioCheck"
                                           {% if venda and venda.venda_funcionario %}checked{% endif %}
                                           title="Marque se esta venda é para um funcionário">
                                    <label class="form-check-label small" for="vendaFuncionarioCheck" title="Venda para funcionário com desconto/benefício">
                                        <i class="bi bi-person-badge"></i> Func.
                                    </label>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                {# Card Cliente #}
                <div class="card mb-3">
                    <div class="card-body py-3">
                        <div class="row">
                            <div class="col-md-6">
                                <label class="form-label mb-1"><i class="bi bi-person"></i> Cliente</label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="bi bi-search"></i></span>
                                    <input type="text" class="form-control" id="buscaCliente" 
                                           placeholder="Buscar por nome, CPF/CNPJ ou código..."
                                           autocomplete="off">
                                </div>
                                <input type="hidden" name="cliente_id" id="clienteIdInput" 
                                       value="{% if venda %}{% if venda.pessoa_id %}pessoa_{{ venda.pessoa_id }}{% else %}cliente_{{ venda.cliente_id }}{% endif %}{% endif %}">
                                
                                {# Dropdown de sugestões #}
                                <div id="clienteDropdown" class="autocomplete-dropdown"></div>
                            </div>
                            <div class="col-md-6">
                                <div id="clienteInfo" class="cliente-box {% if venda and (venda.cliente_id or venda.pessoa_id) %}selecionado{% endif %}">
                                    {% if venda and (venda.cliente or venda.pessoa) %}
                                        {% set cli = venda.cliente or venda.pessoa %}
                                        <div class="d-flex justify-content-between">
                                            <div>
                                                <strong id="clienteNome">{{ cli.nome }}</strong><br>
                                                <small class="text-muted" id="clienteDocumento">
                                                    {% if cli.cpf_cnpj %}{{ cli.cpf_cnpj }}{% endif %}
                                                </small>
                                            </div>
                                            <button type="button" class="btn btn-sm btn-outline-secondary" onclick="limparCliente()">
                                                <i class="bi bi-x-lg"></i>
                                            </button>
                                        </div>
                                    {% else %}
                                        <div class="text-center text-muted py-2" id="clientePlaceholder">
                                            <i class="bi bi-person-plus fs-4"></i><br>
                                            <small>Busque um cliente acima</small>
                                        </div>
                                        <div id="clienteSelecionadoInfo" class="d-none">
                                            <div class="d-flex justify-content-between">
                                                <div>
                                                    <strong id="clienteNome"></strong><br>
                                                    <small class="text-muted" id="clienteDocumento"></small>
                                                </div>
                                                <button type="button" class="btn btn-sm btn-outline-secondary" onclick="limparCliente()">
                                                    <i class="bi bi-x-lg"></i>
                                                </button>
                                            </div>
                                        </div>
                                    {% endif %}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                {# Card Itens #}
                <div class="card">
                    <div class="card-header bg-white d-flex justify-content-between align-items-center">
                        <h6 class="mb-0"><i class="bi bi-cart3"></i> Itens do Pedido</h6>
                        <span class="badge bg-primary" id="qtdItens">{{ venda.itens|length if venda else 0 }} itens</span>
                    </div>
                    <div class="card-body">
                        {# Linha de Lançamento Rápido #}
                        <div class="linha-lancamento">
                            <div class="row g-2 align-items-end mb-2">
                                <div class="col-md-2">
                                    <label class="form-label mb-1">Código</label>
                                    <input type="text" class="form-control" id="buscaProdutoCodigo"
                                           placeholder="Ex: 1"
                                           autocomplete="off">
                                </div>
                                <div class="col-md-4 position-relative">
                                    <label class="form-label mb-1">Produto</label>
                                    <input type="text" class="form-control produto-input" id="buscaProduto" 
                                           placeholder="Buscar por nome / descrição..."
                                           autocomplete="off">
                                    <input type="hidden" id="produtoIdInput">
                                    <div id="produtoDropdown" class="autocomplete-dropdown"></div>
                                </div>
                                <div class="col-md-3">
                                    <label class="form-label mb-1">Código de barras</label>
                                    <input type="text" class="form-control" id="buscaProdutoCodigoBarras"
                                           placeholder="EAN / GTIN"
                                           autocomplete="off">
                                </div>
                                <div class="col-md-3">
                                    <label class="form-label mb-1">Referência</label>
                                    <input type="text" class="form-control" id="buscaProdutoReferencia"
                                           placeholder="Cód. fornecedor / fabricante"
                                           autocomplete="off">
                                </div>
                            </div>

                            <div class="row g-2 align-items-end">
                                <div class="col-md-2">
                                    <label class="form-label mb-1">Embalagem</label>
                                    <select class="form-select" id="embalagemInput">
                                        <option value="">UN (Padrão)</option>
                                    </select>
                                </div>
                                <div class="col-md-1">
                                    <label class="form-label mb-1">Qtd</label>
                                    <input type="number" class="form-control qtd-input" id="quantidadeInput" 
                                           value="1" min="0.01" step="0.01">
                                </div>
                                <div class="col-md-2">
                                    <label class="form-label mb-1">Valor Unit.</label>
                                    <input type="number" class="form-control valor-input" id="valorUnitarioInput" 
                                           step="0.01" min="0">
                                </div>
                                <div class="col-md-2">
                                    <label class="form-label mb-1">Total</label>
                                    <input type="text" class="form-control" id="valorTotalItem" readonly 
                                           style="background: #e9ecef; font-weight: bold;">
                                </div>
                                <div class="col-md-1">
                                    <button type="button" class="btn btn-success w-100" id="btnAdicionarItem" 
                                            onclick="adicionarItem()" disabled>
                                        <i class="bi bi-plus-lg"></i>
                                    </button>
                                </div>
                            </div>
                            <div class="row mt-2">
                                <div class="col-12">
                                    <small class="text-muted" id="produtoBuscaStatus">
                                        Digite o <strong>código</strong>, a <strong>referência</strong>, o <strong>código de barras</strong> ou use a busca por <strong>produto</strong>. Nos campos diretos, pressione Enter para localizar mais rápido.
                                    </small>
                                </div>
                            </div>
                        </div>

                        {# Tabela de Itens #}
                        <div class="table-responsive mt-3">
                            <table class="table table-hover mb-0" id="tabelaItens">
                                <thead class="table-light">
                                    <tr>
                                        <th style="width: 50px">#</th>
                                        <th>Produto</th>
                                        <th style="width: 100px">Embalagem</th>
                                        <th style="width: 90px" class="text-center">Qtd</th>
                                        <th style="width: 100px" class="text-end">Valor Unit.</th>
                                        <th style="width: 90px" class="text-end">Desc.</th>
                                        <th style="width: 110px" class="text-end">Total</th>
                                        <th style="width: 80px" class="text-center">Ações</th>
                                    </tr>
                                </thead>
                                <tbody id="itensBody">
                                    {% if venda and venda.itens %}
                                        {% for item in venda.itens %}
                                        <tr class="item-row" data-id="{{ item.id }}">
                                            <td>{{ loop.index }}</td>
                                            <td>
                                                <strong>{{ item.descricao or (item.produto.nome if item.produto else ('Produto #' ~ item.produto_id if item.produto_id else 'Produto')) }}</strong>
                                                {% if item.produto and item.produto.codigo_produto %}
                                                <br><small class="text-muted">Cód: {{ item.produto.codigo_produto }}</small>
                                                {% endif %}
                                            </td>
                                            <td>
                                                {% if item.embalagem %}
                                                    <span class="badge bg-secondary">{{ item.embalagem.nome }}</span>
                                                {% elif item.produto and item.produto.embalagem %}
                                                    <span class="badge bg-secondary">{{ item.produto.embalagem.nome or item.produto.embalagem.sigla or item.produto.unidade_comercial or 'UN' }}</span>
                                                {% elif item.produto and item.produto.unidade_comercial %}
                                                    <span class="badge bg-secondary">{{ item.produto.unidade_comercial }}</span>
                                                {% else %}
                                                    <span class="text-muted">UN</span>
                                                {% endif %}
                                            </td>
                                            <td class="text-center">{{ "%.2f"|format(item.quantidade) }}</td>
                                            <td class="text-end">R$ {{ "%.2f"|format(item.valor_unitario) }}</td>
                                            <td class="text-end">R$ {{ "%.2f"|format(item.desconto_item) }}</td>
                                            <td class="text-end"><strong>R$ {{ "%.2f"|format(item.valor_total) }}</strong></td>
                                            <td class="text-center">
                                                {% if not venda_bloqueada %}
                                                <button type="button" class="btn btn-sm btn-outline-primary btn-editar-item" 
                                                        onclick="editarItem({{ item.id }})">
                                                    <i class="bi bi-pencil"></i>
                                                </button>
                                                <button type="button" class="btn btn-sm btn-outline-danger btn-remover-item" 
                                                        onclick="removerItem({{ item.id }})">
                                                    <i class="bi bi-trash"></i>
                                                </button>
                                                {% else %}
                                                <span class="text-muted small">--</span>
                                                {% endif %}
                                            </td>
                                        </tr>
                                        {% endfor %}
                                    {% endif %}
                                </tbody>
                            </table>
                            
                            {% if not venda or not venda.itens %}
                            <div class="text-center py-4 text-muted" id="semItens">
                                <i class="bi bi-cart-x fs-1"></i>
                                <p class="mb-0 mt-2">Nenhum item adicionado</p>
                                <small>Use o campo acima para buscar e adicionar produtos</small>
                            </div>
                            {% endif %}
                        </div>
                    </div>
                </div>

                {# Observações #}
                <div class="card mt-3">
                    <div class="card-body py-3">
                        <div class="row">
                            <div class="col-md-6">
                                <label class="form-label mb-1"><i class="bi bi-chat-text"></i> Observações</label>
                                <textarea class="form-control form-control-sm" name="observacoes" rows="2" 
                                          placeholder="Observações que aparecerão no pedido...">{{ venda.observacoes if venda else '' }}</textarea>
                            </div>
                            <div class="col-md-6">
                                <label class="form-label mb-1"><i class="bi bi-lock"></i> Obs. Internas</label>
                                <textarea class="form-control form-control-sm" name="observacoes_internas" rows="2"
                                          placeholder="Observações internas (não aparecem no pedido)...">{{ venda.observacoes_internas if venda else '' }}</textarea>
                            </div>
                        </div>
                    </div>
                </div>
                
                {# Informações de Transporte #}
                <div class="card mt-3">
                    <div class="card-header bg-light py-2">
                        <h6 class="mb-0"><i class="bi bi-box-seam"></i> Informações de Transporte</h6>
                    </div>
                    <div class="card-body py-3">
                        <div class="row g-2">
                            <div class="col-md-3">
                                <label class="form-label mb-1 small">Qtd. Volumes</label>
                                <input type="number" class="form-control form-control-sm" name="volume_qtd" 
                                       value="{{ venda.volume_qtd if venda and venda.volume_qtd else 0 }}" min="0">
                            </div>
                            <div class="col-md-3">
                                <label class="form-label mb-1 small">Espécie</label>
                                <input type="text" class="form-control form-control-sm" name="volume_especie" 
                                       value="{{ venda.volume_especie if venda else '' }}" placeholder="Caixa, Saco...">
                            </div>
                            <div class="col-md-3">
                                <label class="form-label mb-1 small">Marca</label>
                                <input type="text" class="form-control form-control-sm" name="volume_marca" 
                                       value="{{ venda.volume_marca if venda else '' }}" placeholder="Marca dos volumes">
                            </div>
                            <div class="col-md-3">
                                <label class="form-label mb-1 small">Numeração</label>
                                <input type="text" class="form-control form-control-sm" name="volume_numeracao" 
                                       value="{{ venda.volume_numeracao if venda else '' }}" placeholder="1/10, etc">
                            </div>
                        </div>
                        <div class="row g-2 mt-1">
                            <div class="col-md-6">
                                <label class="form-label mb-1 small">Peso Bruto (Kg)</label>
                                <input type="number" class="form-control form-control-sm" name="volume_peso_bruto" 
                                       value="{{ venda.volume_peso_bruto if venda and venda.volume_peso_bruto else 0 }}" 
                                       step="0.001" min="0" placeholder="0.000">
                            </div>
                            <div class="col-md-6">
                                <label class="form-label mb-1 small">Peso Líquido (Kg)</label>
                                <input type="number" class="form-control form-control-sm" name="volume_peso_liquido" 
                                       value="{{ venda.volume_peso_liquido if venda and venda.volume_peso_liquido else 0 }}" 
                                       step="0.001" min="0" placeholder="0.000">
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            {# Coluna Lateral - Totais #}
            <div class="col-lg-3">
                <div class="card totais-card">
                    <div class="card-header bg-primary text-white">
                        <h6 class="mb-0"><i class="bi bi-calculator"></i> Resumo do Pedido</h6>
                    </div>
                    <div class="card-body">
                        <div class="d-flex justify-content-between mb-2">
                            <span>Subtotal:</span>
                            <strong id="subtotalValor">R$ {{ "%.2f"|format(venda.subtotal) if venda else '0.00' }}</strong>
                        </div>
                        
                        <div class="mb-2">
                            <div class="d-flex justify-content-between align-items-center">
                                <span>Desconto:</span>
                                <div class="input-group input-group-sm" style="width: 130px;">
                                    <span class="input-group-text">R$</span>
                                    <input type="number" class="form-control text-end" name="desconto" 
                                           id="descontoInput" step="0.01" min="0" 
                                           value="{{ venda.desconto if venda else 0 }}" onchange="recalcularTotal()">
                                </div>
                            </div>
                        </div>
                        
                        <div class="mb-3">
                            <div class="d-flex justify-content-between align-items-center">
                                <span>Acréscimo:</span>
                                <div class="input-group input-group-sm" style="width: 130px;">
                                    <span class="input-group-text">R$</span>
                                    <input type="number" class="form-control text-end" name="acrescimo" 
                                           id="acrescimoInput" step="0.01" min="0" 
                                           value="{{ venda.acrescimo if venda else 0 }}" onchange="recalcularTotal()">
                                </div>
                            </div>
                        </div>
                        
                        <div class="mb-2">
                            <div class="d-flex justify-content-between align-items-center">
                                <span>Frete:</span>
                                <div class="input-group input-group-sm" style="width: 130px;">
                                    <span class="input-group-text">R$</span>
                                    <input type="number" class="form-control text-end" name="valor_frete" 
                                           id="freteInput" step="0.01" min="0" 
                                           value="{{ venda.valor_frete if venda and venda.valor_frete else 0 }}" onchange="recalcularTotal()">
                                </div>
                            </div>
                        </div>
                        
                        <div class="mb-3">
                            <div class="d-flex justify-content-between align-items-center">
                                <span>Outras Despesas:</span>
                                <div class="input-group input-group-sm" style="width: 130px;">
                                    <span class="input-group-text">R$</span>
                                    <input type="number" class="form-control text-end" name="outras_despesas" 
                                           id="outrasDespesasInput" step="0.01" min="0" 
                                           value="{{ venda.outras_despesas if venda and venda.outras_despesas else 0 }}" onchange="recalcularTotal()">
                                </div>
                            </div>
                        </div>
                        
                        <hr>
                        
                        <div class="d-flex justify-content-between align-items-center">
                            <h5 class="mb-0">TOTAL:</h5>
                            <h4 class="mb-0 text-success" id="totalValor">
                                R$ {{ "%.2f"|format(venda.valor_total) if venda else '0.00' }}
                            </h4>
                        </div>
                    </div>
                    <div class="card-footer bg-white">
                        <div class="d-grid gap-2">
                            {% if not venda_bloqueada %}
                            <button type="submit" class="btn btn-primary btn-lg">
                                <i class="bi bi-check-lg"></i> Salvar Pedido
                            </button>
                            {% if venda and venda.itens|length > 0 and venda.status == 'aberto' %}
                            <button type="button" class="btn btn-success" onclick="fecharPedido()">
                                <i class="bi bi-check-circle"></i> Fechar Pedido
                            </button>
                            {% endif %}
                            {% else %}
                            <div class="alert alert-info py-2 mb-2">
                                <i class="bi bi-info-circle"></i> Apenas visualização
                            </div>
                            {% if tem_nota_fiscal and nota_fiscal_detalhe_disponivel %}
                            <a href="{{ safe_url_for('fiscal_nota_fiscal', fallback='#', nota_id=venda.id) }}" class="btn btn-outline-primary">
                                <i class="bi bi-file-text"></i> Ver Nota Fiscal
                            </a>
                            {% elif tem_nota_fiscal and notas_fiscais_lista_disponivel %}
                            <a href="{{ safe_url_for('fiscal_notas', fallback='#') }}" class="btn btn-outline-primary">
                                <i class="bi bi-file-text"></i> Abrir Notas Fiscais
                            </a>
                            {% elif tem_nota_fiscal %}
                            <button type="button" class="btn btn-outline-secondary" disabled>
                                <i class="bi bi-file-text"></i> Nota fiscal indisponível neste runtime
                            </button>
                            {% endif %}
                            {% endif %}
                            <a href="{{ url_for('vendas') }}" class="btn btn-outline-secondary">
                                <i class="bi bi-arrow-left"></i> Voltar
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </form>
</div>

{# Modal Editar Item #}
<div class="modal fade cape-modal-standard cape-modal-detail" id="modalEditarItem" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title"><i class="bi bi-pencil"></i> Editar Item</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                <input type="hidden" id="editItemId">
                <div class="mb-3">
                    <label class="form-label">Produto</label>
                    <input type="text" class="form-control" id="editProdutoNome" readonly>
                </div>
                <div class="row">
                    <div class="col-md-4 mb-3">
                        <label class="form-label">Quantidade</label>
                        <input type="number" class="form-control" id="editQuantidade" step="0.01" min="0.01">
                    </div>
                    <div class="col-md-4 mb-3">
                        <label class="form-label">Valor Unit.</label>
                        <input type="number" class="form-control" id="editValorUnit" step="0.01" min="0">
                    </div>
                    <div class="col-md-4 mb-3">
                        <label class="form-label">Desconto</label>
                        <input type="number" class="form-control" id="editDesconto" step="0.01" min="0">
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancelar</button>
                <button type="button" class="btn btn-primary" onclick="salvarEdicaoItem()">
                    <i class="bi bi-check"></i> Salvar
                </button>
            </div>
        </div>
    </div>
</div>

{# Modal Localizar Pedido #}
<div class="modal fade cape-modal-standard" id="modalLocalizar" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title"><i class="bi bi-search"></i> Localizar Pedido</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                <div class="mb-3">
                    <label class="form-label">Número do Pedido</label>
                    <input type="number" class="form-control" id="localizarNumeroPedido" placeholder="Ex: 89">
                </div>
                <div class="mb-3">
                    <label class="form-label">Número do Documento</label>
                    <input type="text" class="form-control" id="localizarNumeroDocumento" placeholder="Ex: NF-000123">
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Fechar</button>
                <button type="button" class="btn btn-primary" onclick="localizarPedido()">
                    <i class="bi bi-search"></i> Localizar
                </button>
            </div>
        </div>
    </div>
</div>

{# Modal Cancelar Pedido #}
<div class="modal fade cape-modal-standard" id="modalCancelar" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header bg-danger text-white">
                <h5 class="modal-title"><i class="bi bi-x-circle"></i> Cancelar Pedido</h5>
                <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                <div class="alert alert-warning">
                    <i class="bi bi-exclamation-triangle"></i> 
                    <strong>Atenção!</strong> Esta ação não pode ser desfeita.
                </div>
                <div class="mb-3">
                    <label class="form-label">Motivo do Cancelamento</label>
                    <textarea class="form-control" id="motivoCancelamento" rows="3" 
                              placeholder="Informe o motivo do cancelamento..." required></textarea>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Voltar</button>
                <button type="button" class="btn btn-danger" onclick="confirmarCancelamento()">
                    <i class="bi bi-x-circle"></i> Confirmar Cancelamento
                </button>
            </div>
        </div>
    </div>
</div>
{% endblock %}

{% block extra_js %}
<script>
// Variáveis globais
let clientesSugestoes = {{ clientes|tojson|safe if clientes else '[]' }};
// Produtos: não carregamos mais a lista inteira na página (performance).
// A busca é feita via /api/produtos/buscar.
let produtosSugestoes = [];
let vendaId = {{ venda.id if venda else 'null' }};
let itensTemp = [];
let vendaBloqueada = {{ 'true' if venda_bloqueada else 'false' }};
let resultadosDropdownProdutos = [];
let indiceDropdownProdutoAtivo = -1;

const CAMPOS_BUSCA_PRODUTO = {
    codigo: 'buscaProdutoCodigo',
    referencia: 'buscaProdutoReferencia',
    codigo_barras: 'buscaProdutoCodigoBarras',
    produto: 'buscaProduto',
};

// Função de debounce para limitar chamadas
function debounce(func, wait) {
    let timeout;
    return function(...args) {
        clearTimeout(timeout);
        timeout = setTimeout(() => func.apply(this, args), wait);
    };
}

// Inicialização
document.addEventListener('DOMContentLoaded', function() {
    // Se venda está bloqueada, desabilitar todos os campos de edição
    if (vendaBloqueada) {
        desabilitarCamposEdicao();
    }
    
    // Busca de cliente
    const buscaCliente = document.getElementById('buscaCliente');
    if (buscaCliente) {
        buscaCliente.addEventListener('input', debounce(buscarClientes, 300));
        buscaCliente.addEventListener('focus', function() {
            if (this.value.length >= 2) buscarClientes();
        });
    }
    
    // Busca de produto
    const buscaProduto = document.getElementById('buscaProduto');
    if (buscaProduto) {
        buscaProduto.addEventListener('input', debounce(function() {
            prepararNovaBuscaProduto('produto');
            buscarProdutos();
        }, 300));
        buscaProduto.addEventListener('focus', function() {
            if (this.value.length >= 2) buscarProdutos();
        });

        buscaProduto.addEventListener('keydown', function(e) {
            if (tratarTecladoDropdownProduto(e)) {
                return;
            }

            if (e.key === 'Enter') {
                e.preventDefault();
                if (document.getElementById('produtoIdInput').value) {
                    adicionarItem();
                }
            }
        });
    }

    configurarBuscaDiretaProduto('codigo', 1);
    configurarBuscaDiretaProduto('referencia', 2);
    configurarBuscaDiretaProduto('codigo_barras', 3);
    
    // Cálculo de total do item
    const quantidadeInput = document.getElementById('quantidadeInput');
    const valorUnitarioInput = document.getElementById('valorUnitarioInput');
    if (quantidadeInput) quantidadeInput.addEventListener('input', calcularTotalItem);
    if (valorUnitarioInput) valorUnitarioInput.addEventListener('input', calcularTotalItem);
    configurarQuantidadeProduto({ fracionado: false, quantidade: 1 });

    if (quantidadeInput) {
        quantidadeInput.addEventListener('keydown', function(e) {
            if (e.key === 'Enter') {
                e.preventDefault();
                if (document.getElementById('produtoIdInput')?.value) {
                    adicionarItem();
                }
            }
        });
    }
    
    // Fechar dropdowns ao clicar fora
    document.addEventListener('click', function(e) {
        if (!e.target.closest('#buscaCliente') && !e.target.closest('#clienteDropdown')) {
            document.getElementById('clienteDropdown').classList.remove('show');
        }
        if (!e.target.closest('#buscaProduto') && !e.target.closest('#produtoDropdown')) {
            limparDropdownProduto();
        }
    });
    
});

function buscarClientes() {
    const termo = document.getElementById('buscaCliente').value.trim();
    if (termo.length < 2) {
        document.getElementById('clienteDropdown').classList.remove('show');
        return;
    }
    
    const dropdown = document.getElementById('clienteDropdown');
    dropdown.innerHTML = '<div class="p-3 text-muted text-center"><i class="bi bi-hourglass-split"></i> Buscando...</div>';
    dropdown.classList.add('show');
    
    // Primeiro tentar busca local (clientesSugestoes carregado na página)
    const termoLower = termo.toLowerCase();
    // Busca local (lista carregada na página)
    let resultados = clientesSugestoes.filter(c => {
        const nome = (c.nome || '').toLowerCase();
        const nomeCompleto = (c.nome_completo || '').toLowerCase();  // Razão social
        const doc = (c.cpf_cnpj || '').toLowerCase();
        const fantasia = (c.nome_fantasia || '').toLowerCase();
        return nome.includes(termoLower) || nomeCompleto.includes(termoLower) || doc.includes(termoLower) || fantasia.includes(termoLower);
    }).slice(0, 10);
    
    if (resultados.length > 0) {
        dropdown.innerHTML = resultados.map(c => {
            // Mostrar nome_completo (razão social) se diferente do nome (fantasia)
            const nomeExibir = c.nome_completo && c.nome_completo !== c.nome ? c.nome_completo : c.nome;
            const fantasiaExibir = c.nome_fantasia && c.nome_fantasia !== nomeExibir ? ` (${c.nome_fantasia})` : '';
            return `
            <div class="autocomplete-item" onclick="selecionarCliente('${c.id}', '${(nomeExibir || '').replace(/'/g, "\\'")}', '${c.cpf_cnpj || ''}')">
                <div class="produto-nome">${nomeExibir}${fantasiaExibir}</div>
                <div class="produto-info">${c.cpf_cnpj || ''}</div>
            </div>
        `}).join('');
    } else {
        // Fallback: busca via AJAX (caso lista local esteja vazia)
        fetch(`/api/pessoas/buscar?q=${encodeURIComponent(termo)}&limite=10&somente_clientes=1`, {
            credentials: 'same-origin'
        })
            .then(response => {
                if (!response.ok) throw new Error('Erro na requisição');
                return response.json();
            })
            .then(data => {
                const pessoas = Array.isArray(data) ? data : (data.pessoas || []);
                if (pessoas.length > 0) {
                    dropdown.innerHTML = pessoas.map(c => {
                        const doc = c.documento || c.cpf_cnpj || c.cnpj || c.cpf || '';
                        const nomeEscape = (c.nome || '').replace(/'/g, "\\'");
                        const idCompleto = c.tipo === 'pessoa' ? `pessoa_${c.id}` : `cliente_${c.id}`;
                        return `
                            <div class="autocomplete-item" onclick="selecionarCliente('${idCompleto}', '${nomeEscape}', '${doc}')">
                                <div class="produto-nome">${c.nome}</div>
                                <div class="produto-info">${doc} ${c.cidade ? '- ' + c.cidade : ''}</div>
                            </div>
                        `;
                    }).join('');
                } else {
                    dropdown.innerHTML = '<div class="p-3 text-muted text-center">Nenhum cliente encontrado</div>';
                }
            })
            .catch(err => {
                console.error('Erro ao buscar clientes:', err);
                dropdown.innerHTML = '<div class="p-3 text-muted text-center">Nenhum cliente encontrado</div>';
            });
    }
}

function selecionarCliente(id, nome, documento) {
    document.getElementById('clienteIdInput').value = id;
    document.getElementById('buscaCliente').value = '';
    document.getElementById('clienteDropdown').classList.remove('show');
    
    const infoBox = document.getElementById('clienteInfo');
    infoBox.classList.add('selecionado');
    infoBox.innerHTML = `
        <div class="d-flex justify-content-between">
            <div>
                <strong>${nome}</strong><br>
                <small class="text-muted">${documento}</small>
            </div>
            <button type="button" class="btn btn-sm btn-outline-secondary" onclick="limparCliente()">
                <i class="bi bi-x-lg"></i>
            </button>
        </div>
    `;
}

function limparCliente() {
    document.getElementById('clienteIdInput').value = '';
    document.getElementById('clienteInfo').classList.remove('selecionado');
    document.getElementById('clienteInfo').innerHTML = `
        <div class="text-center text-muted py-2">
            <i class="bi bi-person-plus fs-4"></i><br>
            <small>Busque um cliente acima</small>
        </div>
    `;
}

function configurarBuscaDiretaProduto(tipoBusca, minLength = 1) {
    const input = document.getElementById(CAMPOS_BUSCA_PRODUTO[tipoBusca]);
    if (!input) return;

    input.addEventListener('input', function() {
        prepararNovaBuscaProduto(tipoBusca);
        limparMensagemBuscaProduto();
    });

    input.addEventListener('keydown', function(e) {
        if (tratarTecladoDropdownProduto(e)) {
            return;
        }

        if (e.key === 'Enter') {
            e.preventDefault();
            buscarProdutoDireto(tipoBusca, { minLength });
        }
    });

    input.addEventListener('blur', function() {
        const termo = (this.value || '').trim();
        if (termo.length >= minLength && !document.getElementById('produtoIdInput')?.value) {
            buscarProdutoDireto(tipoBusca, { minLength, silencioso: true });
        }
    });
}

function obterInputBuscaProduto(tipoBusca) {
    return document.getElementById(CAMPOS_BUSCA_PRODUTO[tipoBusca]);
}

function atualizarMensagemBuscaProduto(texto, nivel = 'muted') {
    const el = document.getElementById('produtoBuscaStatus');
    if (!el) return;

    el.className = `text-${nivel}`;
    el.innerHTML = texto;
}

function limparMensagemBuscaProduto() {
    atualizarMensagemBuscaProduto('Digite o <strong>código</strong>, a <strong>referência</strong>, o <strong>código de barras</strong> ou use a busca por <strong>produto</strong>. Nos campos diretos, pressione Enter para localizar mais rápido.', 'muted');
}

function normalizarSiglaUnidade(unidade) {
    return String(unidade || '')
        .trim()
        .toUpperCase()
        .normalize('NFD')
        .replace(/[\u0300-\u036f]/g, '');
}

function produtoPermiteFracionado(produto = {}, unidadeBase = '') {
    if (produto && typeof produto.fracionado === 'boolean') {
        return produto.fracionado;
    }

    const unidade = normalizarSiglaUnidade(unidadeBase || produto.unidade || produto.unidade_comercial || '');
    const unidadesFracionadas = new Set(['KG', 'G', 'MG', 'L', 'LT', 'ML', 'M', 'MT', 'M2', 'M3', 'CM', 'MM']);
    return unidadesFracionadas.has(unidade);
}

function configurarQuantidadeProduto({ fracionado = false, quantidade = null } = {}) {
    const quantidadeInput = document.getElementById('quantidadeInput');
    if (!quantidadeInput) return;

    const quantidadeAtual = parseFloat(quantidadeInput.value);
    const valorBase = Number.isFinite(quantidade)
        ? quantidade
        : (Number.isFinite(quantidadeAtual) && quantidadeAtual > 0 ? quantidadeAtual : 1);

    if (fracionado) {
        quantidadeInput.step = '0.01';
        quantidadeInput.min = '0.01';
        quantidadeInput.value = (Math.round(valorBase * 100) / 100).toFixed(2).replace(/\.00$/, '');
        return;
    }

    const inteiro = Math.max(1, Math.round(valorBase));
    quantidadeInput.step = '1';
    quantidadeInput.min = '1';
    quantidadeInput.value = String(inteiro);
}

function obterItensDropdownProduto() {
    return Array.from(document.querySelectorAll('#produtoDropdown .autocomplete-item'));
}

function atualizarItemDropdownProdutoAtivo(indice, { rolar = true } = {}) {
    const itens = obterItensDropdownProduto();
    if (!itens.length) {
        indiceDropdownProdutoAtivo = -1;
        return false;
    }

    const indiceNormalizado = Math.max(0, Math.min(indice, itens.length - 1));
    indiceDropdownProdutoAtivo = indiceNormalizado;

    itens.forEach((item, idx) => {
        const ativo = idx === indiceNormalizado;
        item.classList.toggle('active', ativo);
        item.setAttribute('aria-selected', ativo ? 'true' : 'false');
        if (ativo && rolar) {
            item.scrollIntoView({ block: 'nearest' });
        }
    });

    return true;
}

function moverSelecaoDropdownProduto(direcao) {
    const itens = obterItensDropdownProduto();
    if (!itens.length) return false;

    if (indiceDropdownProdutoAtivo < 0) {
        return atualizarItemDropdownProdutoAtivo(direcao > 0 ? 0 : itens.length - 1);
    }

    const proximoIndice = (indiceDropdownProdutoAtivo + direcao + itens.length) % itens.length;
    return atualizarItemDropdownProdutoAtivo(proximoIndice);
}

function selecionarDropdownProdutoAtivo() {
    if (!Array.isArray(resultadosDropdownProdutos) || !resultadosDropdownProdutos.length) {
        return false;
    }

    const indiceSelecionado = indiceDropdownProdutoAtivo >= 0 ? indiceDropdownProdutoAtivo : 0;
    const produto = resultadosDropdownProdutos[indiceSelecionado];
    if (!produto) return false;

    selecionarProdutoResultado(
        produto.id,
        produto.nome || '',
        Number(produto.preco || 0),
        produto.codigo || '',
        produto.unidade || 'UN',
        produto.referencia || '',
        produto.ean || produto.codigo_barras || '',
        typeof produto.fracionado === 'boolean' ? produto.fracionado : null
    );
    preencherCamposBuscaProduto(produto);
    atualizarMensagemBuscaProduto('Produto selecionado. Pressione Enter novamente para lançar o item.', 'success');
    return true;
}

function tratarTecladoDropdownProduto(event) {
    const dropdown = document.getElementById('produtoDropdown');
    const dropdownVisivel = dropdown && dropdown.classList.contains('show') && getComputedStyle(dropdown).display !== 'none';

    if (!dropdownVisivel) {
        return false;
    }

    if (event.key === 'ArrowDown') {
        event.preventDefault();
        moverSelecaoDropdownProduto(1);
        return true;
    }

    if (event.key === 'ArrowUp') {
        event.preventDefault();
        moverSelecaoDropdownProduto(-1);
        return true;
    }

    if (event.key === 'Enter') {
        event.preventDefault();
        return selecionarDropdownProdutoAtivo();
    }

    if (event.key === 'Escape') {
        event.preventDefault();
        limparDropdownProduto();
        atualizarMensagemBuscaProduto('Listagem de produtos fechada.', 'muted');
        return true;
    }

    return false;
}

function normalizarCodigoBusca(valor) {
    const texto = String(valor || '').trim();
    const semZeros = texto.replace(/^0+/, '');
    return semZeros || (texto ? '0' : '');
}

function normalizarCodigoBarras(valor) {
    const apenasDigitos = String(valor || '').replace(/\D+/g, '');
    return apenasDigitos || String(valor || '').trim();
}

function prepararNovaBuscaProduto(origem = '') {
    const produtoIdInput = document.getElementById('produtoIdInput');
    if (produtoIdInput) produtoIdInput.value = '';

    const btnAdicionarItem = document.getElementById('btnAdicionarItem');
    if (btnAdicionarItem) btnAdicionarItem.disabled = true;

    const selectEmb = document.getElementById('embalagemInput');
    if (selectEmb) definirOpcaoPadraoEmbalagem(selectEmb, 'UN');
    configurarQuantidadeProduto({ fracionado: false, quantidade: 1 });

    if (origem && origem !== 'produto') {
        const campoProduto = document.getElementById('buscaProduto');
        if (campoProduto) campoProduto.value = '';
    }
}

async function consultarProdutosApi(termo, limite = 10) {
    const empresaSelect = document.getElementById('empresaSelect');
    const tabelaPrecoSelect = document.getElementById('tabelaPrecoSelect');

    const url = new URL('/api/produtos/buscar', window.location.origin);
    url.searchParams.set('q', termo);
    url.searchParams.set('limite', String(limite));

    const empresaId = empresaSelect ? (empresaSelect.value || '') : '';
    const tabelaPrecoId = tabelaPrecoSelect ? (tabelaPrecoSelect.value || '') : '';

    if (empresaId) url.searchParams.set('empresa_id', empresaId);
    if (tabelaPrecoId) url.searchParams.set('tabela_preco_id', tabelaPrecoId);

    const response = await fetch(url.toString(), { credentials: 'same-origin' });
    if (!response.ok) throw new Error('Erro na requisição');

    const data = await response.json();
    return Array.isArray(data) ? data : [];
}

function unificarResultadosProdutos(listas) {
    const mapa = new Map();
    (listas || []).flat().forEach(produto => {
        if (!produto || !produto.id) return;
        if (!mapa.has(produto.id)) {
            mapa.set(produto.id, produto);
        }
    });
    return Array.from(mapa.values());
}

function gerarTermosBuscaDireta(tipoBusca, termo) {
    const base = String(termo || '').trim();
    if (!base) return [];

    const termos = [base];
    if (tipoBusca === 'codigo') {
        const codigoNormalizado = normalizarCodigoBusca(base);
        [2, 3, 4].forEach(tamanho => {
            const preenchido = codigoNormalizado.padStart(tamanho, '0');
            if (preenchido && !termos.includes(preenchido)) {
                termos.push(preenchido);
            }
        });
    }

    return termos;
}

function encontrarProdutoExato(produtos, tipoBusca, termo) {
    if (!Array.isArray(produtos) || !produtos.length) return null;

    if (tipoBusca === 'codigo') {
        const codigoBusca = normalizarCodigoBusca(termo);
        return produtos.find(produto => normalizarCodigoBusca(produto.codigo) === codigoBusca) || null;
    }

    if (tipoBusca === 'codigo_barras') {
        const codigoBarrasBusca = normalizarCodigoBarras(termo);
        return produtos.find(produto => normalizarCodigoBarras(produto.ean || produto.codigo_barras) === codigoBarrasBusca) || null;
    }

    if (tipoBusca === 'referencia') {
        const termoNormalizado = String(termo || '').trim().toLowerCase();
        return produtos.find(produto => String(produto.referencia || '').trim().toLowerCase() === termoNormalizado) || null;
    }

    return null;
}

function preencherCamposBuscaProduto(produto, contexto = {}) {
    const campoCodigo = obterInputBuscaProduto('codigo');
    const campoReferencia = obterInputBuscaProduto('referencia');
    const campoCodigoBarras = obterInputBuscaProduto('codigo_barras');

    if (campoCodigo) {
        campoCodigo.value = produto.codigo || (contexto.tipoBusca === 'codigo' ? (contexto.termoOriginal || '') : campoCodigo.value);
    }
    if (campoReferencia) {
        campoReferencia.value = produto.referencia || (contexto.tipoBusca === 'referencia' ? (contexto.termoOriginal || '') : campoReferencia.value);
    }
    if (campoCodigoBarras) {
        campoCodigoBarras.value = produto.ean || produto.codigo_barras || (contexto.tipoBusca === 'codigo_barras' ? (contexto.termoOriginal || '') : campoCodigoBarras.value);
    }
}

function selecionarProdutoResultado(id, nome, valor, codigo, unidadeBase = 'UN', referencia = '', ean = '', fracionado = null) {
    selecionarProduto(id, nome, valor, codigo, unidadeBase, referencia, ean, fracionado);
}

async function buscarProdutoDireto(tipoBusca, { minLength = 1, silencioso = false } = {}) {
    const input = obterInputBuscaProduto(tipoBusca);
    if (!input) return;

    const termo = String(input.value || '').trim();
    if (termo.length < minLength) {
        if (!silencioso) {
            atualizarMensagemBuscaProduto(`Informe pelo menos ${minLength} caractere(s) no campo selecionado.`, 'warning');
        }
        return;
    }

    try {
        atualizarMensagemBuscaProduto('Buscando produto...', 'muted');
        const termosConsulta = gerarTermosBuscaDireta(tipoBusca, termo);
        const respostas = [];

        for (const termoConsulta of termosConsulta) {
            const resultados = await consultarProdutosApi(termoConsulta, 50);
            respostas.push(resultados);

            const exato = encontrarProdutoExato(resultados, tipoBusca, termo);
            if (exato) {
                selecionarProdutoResultado(
                    exato.id,
                    exato.nome || '',
                    Number(exato.preco || 0),
                    exato.codigo || '',
                    exato.unidade || 'UN',
                    exato.referencia || '',
                    exato.ean || exato.codigo_barras || '',
                    produtoPermiteFracionado(exato, exato.unidade || exato.unidade_comercial || '')
                );
                preencherCamposBuscaProduto(exato, { tipoBusca, termoOriginal: termo });
                atualizarMensagemBuscaProduto(`Produto localizado por ${tipoBusca.replace('_', ' ')}.`, 'success');
                return;
            }
        }

        const produtos = unificarResultadosProdutos(respostas);
        if (produtos.length === 1) {
            const unico = produtos[0];
            selecionarProdutoResultado(
                unico.id,
                unico.nome || '',
                Number(unico.preco || 0),
                unico.codigo || '',
                unico.unidade || 'UN',
                unico.referencia || '',
                unico.ean || unico.codigo_barras || '',
                produtoPermiteFracionado(unico, unico.unidade || unico.unidade_comercial || '')
            );
            preencherCamposBuscaProduto(unico, { tipoBusca, termoOriginal: termo });
            atualizarMensagemBuscaProduto(`Produto localizado por ${tipoBusca.replace('_', ' ')}.`, 'success');
            return;
        }

        if (produtos.length > 1) {
            renderizarResultadosProdutos(produtos);
            atualizarMensagemBuscaProduto('Foram encontrados vários produtos. Escolha um item na lista de resultados.', 'warning');
            return;
        }

        atualizarMensagemBuscaProduto('Nenhum produto encontrado com os dados informados.', 'danger');
        limparDropdownProduto();
    } catch (err) {
        console.error('Erro ao buscar produto direto:', err);
        atualizarMensagemBuscaProduto('Erro ao buscar produto. Tente novamente.', 'danger');
    }
}

function limparDropdownProduto() {
    const dropdown = document.getElementById('produtoDropdown');
    if (!dropdown) return;

    resultadosDropdownProdutos = [];
    indiceDropdownProdutoAtivo = -1;
    dropdown.classList.remove('show');
    dropdown.innerHTML = '';
    dropdown.style.display = 'none';
    dropdown.setAttribute('aria-hidden', 'true');
}

function mostrarDropdownProduto() {
    const dropdown = document.getElementById('produtoDropdown');
    if (!dropdown) return;

    dropdown.classList.add('show');
    dropdown.style.display = 'block';
    dropdown.setAttribute('aria-hidden', 'false');
}

function aplicarEstiloDropdownProduto(dropdown) {
    if (!dropdown) return;

    const larguraJanela = Math.max(window.innerWidth || 0, 320);
    const ancora = dropdown.parentElement;
    const ancoraRect = ancora && typeof ancora.getBoundingClientRect === 'function'
        ? ancora.getBoundingClientRect()
        : null;

    let larguraDropdown = '100%';
    let alinhamentoEsquerda = '0';
    let alinhamentoDireita = 'auto';

    if (larguraJanela > 991 && ancoraRect) {
        const margemViewport = 24;
        const larguraMinima = Math.max(ancoraRect.width, 360);
        const espacoDisponivelDireita = Math.max(ancoraRect.width, larguraJanela - ancoraRect.left - margemViewport);
        const larguraCalculada = Math.min(Math.max(larguraMinima, 560), espacoDisponivelDireita, 760);

        larguraDropdown = `${Math.max(ancoraRect.width, Math.floor(larguraCalculada))}px`;
    }

    dropdown.style.position = 'absolute';
    dropdown.style.zIndex = '1106';
    dropdown.style.width = larguraDropdown;
    dropdown.style.maxHeight = '420px';
    dropdown.style.overflowY = 'auto';
    dropdown.style.background = '#f5f7fb';
    dropdown.style.border = '1px solid #d8e0ee';
    dropdown.style.borderRadius = '14px';
    dropdown.style.boxShadow = '0 10px 28px rgba(15, 23, 42, 0.14)';
    dropdown.style.padding = '10px';
    dropdown.style.display = dropdown.classList.contains('show') ? 'block' : 'none';
    dropdown.style.left = alinhamentoEsquerda;
    dropdown.style.right = alinhamentoDireita;
}

function renderizarResultadosProdutos(produtos) {
    const dropdown = document.getElementById('produtoDropdown');
    if (!dropdown) return;

    aplicarEstiloDropdownProduto(dropdown);
    resultadosDropdownProdutos = Array.isArray(produtos) ? produtos.slice() : [];
    indiceDropdownProdutoAtivo = -1;

    if (!Array.isArray(produtos) || produtos.length === 0) {
        dropdown.innerHTML = '<div class="p-3 text-muted text-center">Nenhum produto encontrado</div>';
        mostrarDropdownProduto();
        return;
    }

    dropdown.innerHTML = produtos.map((p, indice) => {
        const id = p.id;
        const nome = p.nome || '';
        const codigo = p.codigo || '';
        const ean = p.ean || p.codigo_barras || '';
        const referencia = p.referencia || '';
        const unidade = p.unidade || '';
        const preco = Number(p.preco || 0);
        const embalagens = p.embalagens || [];
        const fracionado = produtoPermiteFracionado(p, unidade);

        const nomeEsc = String(nome).replace(/'/g, "\\'");
        const codigoEsc = String(codigo).replace(/'/g, "\\'");
        const unidadeEsc = String(unidade).replace(/'/g, "\\'");
        const referenciaEsc = String(referencia).replace(/'/g, "\\'");
        const eanEsc = String(ean).replace(/'/g, "\\'");

        let embalagemHtml = '';
        if (embalagens.length > 1) {
            embalagemHtml = '<div class="mt-1">' + embalagens.map(emb => {
                const embNome = emb.sigla || emb.nome || '';
                const embPreco = Number(emb.preco || preco);
                const embMult = emb.multiplicador || 1;
                const embId = emb.id || 0;
                const embEan = emb.ean || '';
                const embNomeEsc = String(embNome).replace(/'/g, "\\'");
                const embEanEsc = String(embEan).replace(/'/g, "\\'");
                const multLabel = embMult > 1 ? ` x${embMult}` : '';
                return `<span class="badge bg-secondary me-1" style="cursor:pointer" 
                    onclick="event.stopPropagation(); selecionarProdutoEmbalagem(${id}, '${nomeEsc}', ${embPreco}, '${codigoEsc}', ${embId}, '${embNomeEsc}', ${embMult}, '${embEanEsc}', ${fracionado ? 'true' : 'false'})">
                    ${embNome}${multLabel} R$${embPreco.toFixed(2)}
                </span>`;
            }).join('') + '</div>';
        }

        const linha1 = `${nome}${unidade ? ' (' + unidade + ')' : ''}`;
        const metaPartes = [];
        if (codigo) metaPartes.push(`<span class="produto-meta-pill" style="display:inline-flex; align-items:center; gap:4px; padding:4px 8px; border-radius:999px; background:#f1f5f9; color:#475569; font-size:.78rem; line-height:1.2;"><strong>Cód:</strong> ${codigo}</span>`);
        if (referencia) metaPartes.push(`<span class="produto-meta-pill" style="display:inline-flex; align-items:center; gap:4px; padding:4px 8px; border-radius:999px; background:#f1f5f9; color:#475569; font-size:.78rem; line-height:1.2;"><strong>Ref:</strong> ${referencia}</span>`);
        if (ean) metaPartes.push(`<span class="produto-meta-pill" style="display:inline-flex; align-items:center; gap:4px; padding:4px 8px; border-radius:999px; background:#f1f5f9; color:#475569; font-size:.78rem; line-height:1.2;"><strong>EAN:</strong> ${ean}</span>`);
        if (unidade) metaPartes.push(`<span class="produto-meta-pill" style="display:inline-flex; align-items:center; gap:4px; padding:4px 8px; border-radius:999px; background:#f1f5f9; color:#475569; font-size:.78rem; line-height:1.2;"><strong>Un.:</strong> ${unidade}</span>`);

        return `
            <div class="autocomplete-item" data-produto-indice="${indice}" role="option" aria-selected="false" style="padding:9px 12px; cursor:pointer; border:1px solid #dce4f2; border-radius:12px; background:#ffffff; margin-bottom:8px; display:flex; flex-direction:column; gap:6px; transition:all .18s ease;" onclick="selecionarProdutoResultado(${id}, '${nomeEsc}', ${preco}, '${codigoEsc}', '${unidadeEsc}', '${referenciaEsc}', '${eanEsc}', ${fracionado ? 'true' : 'false'})">
                <div class="produto-topo" style="display:flex; justify-content:space-between; align-items:flex-start; gap:10px;">
                    <div class="produto-nome" style="font-weight:600; color:#1f2937; white-space:normal; overflow-wrap:anywhere; line-height:1.3; flex:1 1 auto; min-width:0;">${linha1}</div>
                    <div class="produto-preco-box" style="flex:0 0 auto; text-align:right;">
                        <span class="produto-preco" style="display:inline-block; font-size:.98rem; font-weight:700; color:#198754; white-space:nowrap;">R$ ${preco.toFixed(2)}</span>
                    </div>
                </div>
                <div class="produto-meta-grid" style="display:flex; flex-wrap:wrap; gap:6px;">${metaPartes.join('')}</div>
                ${embalagemHtml}
            </div>
        `;
    }).join('');

    mostrarDropdownProduto();
    atualizarItemDropdownProdutoAtivo(0, { rolar: false });
}

function buscarProdutos() {
    const input = document.getElementById('buscaProduto');
    const dropdown = document.getElementById('produtoDropdown');

    if (!input || !dropdown) return;

    aplicarEstiloDropdownProduto(dropdown);

    const termo = (input.value || '').trim();
    if (termo.length < 2) {
        limparDropdownProduto();
        return;
    }

    dropdown.innerHTML = '<div class="p-3 text-muted text-center"><i class="bi bi-hourglass-split"></i> Buscando...</div>';
    mostrarDropdownProduto();

    consultarProdutosApi(termo, 10)
        .then(produtos => {
            if (produtos.length === 0) {
                dropdown.innerHTML = '<div class="p-3 text-muted text-center">Nenhum produto encontrado</div>';
                return;
            }

            renderizarResultadosProdutos(produtos);
        })
        .catch(err => {
            console.error('Erro ao buscar produtos:', err);
            dropdown.innerHTML = '<div class="p-3 text-muted text-center">Erro ao buscar produtos</div>';
        });
}

function obterRotuloEmbalagemPadrao(unidadeBase) {
    const unidade = String(unidadeBase || '').trim();
    return unidade ? `${unidade} (Padrão)` : 'UN (Padrão)';
}

function definirOpcaoPadraoEmbalagem(selectEmb, unidadeBase) {
    if (!selectEmb) return;

    selectEmb.innerHTML = '';
    const option = document.createElement('option');
    option.value = '';
    option.textContent = obterRotuloEmbalagemPadrao(unidadeBase);
    selectEmb.appendChild(option);
}

function selecionarProduto(id, nome, valor, codigo, unidadeBase = 'UN', referencia = '', ean = '', fracionado = null) {
    document.getElementById('produtoIdInput').value = id;
    document.getElementById('buscaProduto').value = nome;
    document.getElementById('valorUnitarioInput').value = valor.toFixed(2);
    limparDropdownProduto();
    document.getElementById('btnAdicionarItem').disabled = false;

    const produtoEhFracionado = fracionado === null
        ? produtoPermiteFracionado({ fracionado: null }, unidadeBase)
        : Boolean(fracionado);

    configurarQuantidadeProduto({ fracionado: produtoEhFracionado, quantidade: 1 });

    preencherCamposBuscaProduto({
        codigo: codigo,
        referencia: referencia,
        ean: ean,
        codigo_barras: ean,
        fracionado: produtoEhFracionado,
    });
    
    // Carregar embalagens do produto
    carregarEmbalagensParaProduto(id, valor, unidadeBase, produtoEhFracionado);
    
    calcularTotalItem();
    document.getElementById('quantidadeInput').focus();
    document.getElementById('quantidadeInput').select();
    limparMensagemBuscaProduto();
}

function carregarEmbalagensParaProduto(produtoId, precoBase, unidadeBase = 'UN', fracionado = null) {
    const selectEmb = document.getElementById('embalagemInput');
    definirOpcaoPadraoEmbalagem(selectEmb, unidadeBase);
    const produtoEhFracionado = fracionado === null
        ? produtoPermiteFracionado({ fracionado: null }, unidadeBase)
        : Boolean(fracionado);
    
    // Buscar embalagens do produto
    fetch(`/api/produto/${produtoId}/embalagens`)
        .then(r => r.json())
        .then(data => {
            if (data.embalagens && data.embalagens.length > 0) {
                data.embalagens.forEach(emb => {
                    const option = document.createElement('option');
                    option.value = emb.id;
                    option.textContent = `${emb.nome} - R$ ${emb.preco_venda.toFixed(2)}`;
                    option.dataset.preco = emb.preco_venda;
                    selectEmb.appendChild(option);
                });
            }
        })
        .catch(err => console.log('Produto sem embalagens adicionais'));
    
    // Atualizar preço quando mudar embalagem
    selectEmb.onchange = function() {
        const selected = this.options[this.selectedIndex];
        if (selected.dataset.preco) {
            document.getElementById('valorUnitarioInput').value = parseFloat(selected.dataset.preco).toFixed(2);
        } else {
            document.getElementById('valorUnitarioInput').value = precoBase.toFixed(2);
        }
        configurarQuantidadeProduto({ fracionado: produtoEhFracionado });
        calcularTotalItem();
    };
}

function selecionarProdutoEmbalagem(produtoId, nome, preco, codigo, embalagemId, embalagemNome, multiplicador, ean, fracionado = null) {
    // Seleciona o produto com uma embalagem específica
    const nomeCompleto = multiplicador > 1 ? `${nome} (${embalagemNome} x${multiplicador})` : `${nome} (${embalagemNome})`;
    const produtoEhFracionado = fracionado === null
        ? produtoPermiteFracionado({ fracionado: null }, embalagemNome)
        : Boolean(fracionado);
    
    document.getElementById('produtoIdInput').value = produtoId;
    document.getElementById('buscaProduto').value = nomeCompleto;
    document.getElementById('valorUnitarioInput').value = preco.toFixed(2);
    limparDropdownProduto();
    document.getElementById('btnAdicionarItem').disabled = false;
    configurarQuantidadeProduto({ fracionado: produtoEhFracionado, quantidade: 1 });
    preencherCamposBuscaProduto({ codigo: codigo, ean: ean, codigo_barras: ean, fracionado: produtoEhFracionado });
    
    // Salvar embalagem selecionada (será enviada junto com o item)
    if (!document.getElementById('embalagemIdInput')) {
        // Criar hidden input se não existe
        const hiddenEmb = document.createElement('input');
        hiddenEmb.type = 'hidden';
        hiddenEmb.id = 'embalagemIdInput';
        document.getElementById('produtoIdInput').parentNode.appendChild(hiddenEmb);
    }
    document.getElementById('embalagemIdInput').value = embalagemId;
    
    calcularTotalItem();
    document.getElementById('quantidadeInput').focus();
    document.getElementById('quantidadeInput').select();
    limparMensagemBuscaProduto();
}

function calcularTotalItem() {
    const qtd = parseFloat(document.getElementById('quantidadeInput').value) || 0;
    const valor = parseFloat(document.getElementById('valorUnitarioInput').value) || 0;
    const total = qtd * valor;
    document.getElementById('valorTotalItem').value = 'R$ ' + total.toFixed(2);
}

function adicionarItem() {
    const produtoId = document.getElementById('produtoIdInput').value;
    const produtoNome = document.getElementById('buscaProduto').value;
    const quantidade = parseFloat(document.getElementById('quantidadeInput').value) || 1;
    const valorUnitario = parseFloat(document.getElementById('valorUnitarioInput').value) || 0;
    const clienteId = (document.getElementById('clienteIdInput')?.value || '').trim();
    const empresaId = (document.getElementById('empresaSelect')?.value || '').trim();
    const embalagemId = (document.getElementById('embalagemInput')?.value || '').trim();
    const tabelaPrecoId = (document.getElementById('tabelaPrecoSelect')?.value || '').trim();
    
    if (!produtoId || !produtoNome || quantidade <= 0) {
        alert('Selecione um produto e informe a quantidade!');
        return;
    }
    
    // Enviar via AJAX
    const formData = new FormData();
    formData.append('produto_id', produtoId);
    formData.append('quantidade', quantidade);
    formData.append('valor_unitario', valorUnitario);
    formData.append('desconto_item', 0);
    // Persistir cabeçalho junto com o item (evita perder cliente ao recarregar)
    if (clienteId) formData.append('cliente_id', clienteId);
    if (empresaId) formData.append('empresa_id', empresaId);
    // Enviar embalagem e tabela de preço selecionadas
    if (embalagemId) formData.append('embalagem_id', embalagemId);
    if (tabelaPrecoId) formData.append('tabela_preco_id', tabelaPrecoId);
    
    fetch(`/venda/${vendaId}/item/adicionar`, {
        method: 'POST',
        body: formData
    })
    .then(response => response.json())
    .then(data => {
        if (data.success) {
            // Recarregar página para atualizar itens
            location.reload();
        } else {
            alert('Erro ao adicionar item: ' + data.error);
        }
    })
    .catch(err => {
        console.error('Erro:', err);
        // Fallback: submeter formulário
        location.reload();
    });
}

function removerItem(itemId) {
    if (!confirm('Confirma a remoção deste item?')) return;
    
    fetch(`/venda/item/${itemId}/excluir`, {
        method: 'POST'
    })
    .then(response => response.json())
    .then(data => {
        if (data.success) {
            location.reload();
        } else {
            alert('Erro ao remover item: ' + data.error);
        }
    })
    .catch(err => {
        console.error('Erro:', err);
        location.reload();
    });
}

function editarItem(itemId) {
    // Abrir modal com dados do item
    const modal = new bootstrap.Modal(document.getElementById('modalEditarItem'));
    // Carregar dados via AJAX ou do DOM
    document.getElementById('editItemId').value = itemId;
    modal.show();
}

function salvarEdicaoItem() {
    const itemId = document.getElementById('editItemId').value;
    const formData = new FormData();
    formData.append('quantidade', document.getElementById('editQuantidade').value);
    formData.append('valor_unitario', document.getElementById('editValorUnit').value);
    formData.append('desconto_item', document.getElementById('editDesconto').value);
    
    fetch(`/venda/item/${itemId}/editar`, {
        method: 'POST',
        body: formData
    })
    .then(response => response.json())
    .then(data => {
        if (data.success) {
            location.reload();
        } else {
            alert('Erro: ' + data.error);
        }
    });
}

function recalcularTotal() {
    const subtotal = parseFloat(document.getElementById('subtotalValor').textContent.replace('R$ ', '').replace(',', '.')) || 0;
    const desconto = parseFloat(document.getElementById('descontoInput').value) || 0;
    const acrescimo = parseFloat(document.getElementById('acrescimoInput').value) || 0;
    const frete = parseFloat(document.getElementById('freteInput').value) || 0;
    const outrasDespesas = parseFloat(document.getElementById('outrasDespesasInput').value) || 0;
    const total = subtotal - desconto + acrescimo + frete + outrasDespesas;
    document.getElementById('totalValor').textContent = 'R$ ' + total.toFixed(2);
}

function fecharPedido() {
    if (confirm('Confirma o fechamento deste pedido?')) {
        window.location.href = `/venda/${vendaId}/fechar`;
    }
}

// Função para desabilitar campos quando venda está bloqueada
function desabilitarCamposEdicao() {
    // Desabilitar campos de busca
    const buscaCliente = document.getElementById('buscaCliente');
    const buscaProduto = document.getElementById('buscaProduto');
    if (buscaCliente) buscaCliente.disabled = true;
    if (buscaProduto) buscaProduto.disabled = true;
    
    // Desabilitar todos os inputs do formulário
    const formVenda = document.getElementById('formVenda');
    if (formVenda) {
        formVenda.querySelectorAll('input, select, textarea').forEach(el => {
            el.disabled = true;
        });
    }
    
    // Desabilitar botões de adicionar/remover itens
    const btnAdicionarItem = document.getElementById('btnAdicionarItem');
    if (btnAdicionarItem) btnAdicionarItem.disabled = true;
    
    // Ocultar botões de exclusão nos itens
    document.querySelectorAll('.btn-remover-item, .btn-editar-item').forEach(btn => {
        btn.style.display = 'none';
    });
    
    // Desabilitar campos de desconto/acréscimo
    const descontoInput = document.getElementById('descontoInput');
    const acrescimoInput = document.getElementById('acrescimoInput');
    if (descontoInput) descontoInput.disabled = true;
    if (acrescimoInput) acrescimoInput.disabled = true;
    
    console.log('Venda bloqueada: campos de edição desabilitados');
}

// Função para localizar pedido
function localizarPedido() {
    const numeroPedido = document.getElementById('localizarNumeroPedido').value.trim();
    const numeroDocumento = document.getElementById('localizarNumeroDocumento').value.trim();
    
    if (numeroPedido) {
        // Buscar por número do pedido
        fetch(`/api/venda/buscar?numero_pedido=${encodeURIComponent(numeroPedido)}`)
            .then(response => response.json())
            .then(data => {
                if (data.success && data.venda_id) {
                    window.location.href = `/venda/${data.venda_id}`;
                } else {
                    alert('Pedido não encontrado');
                }
            })
            .catch(err => {
                console.error('Erro:', err);
                alert('Erro ao buscar pedido');
            });
    } else if (numeroDocumento) {
        // Buscar por número do documento
        fetch(`/api/venda/buscar?numero_documento=${encodeURIComponent(numeroDocumento)}`)
            .then(response => response.json())
            .then(data => {
                if (data.success && data.venda_id) {
                    window.location.href = `/venda/${data.venda_id}`;
                } else {
                    alert('Documento não encontrado');
                }
            })
            .catch(err => {
                console.error('Erro:', err);
                alert('Erro ao buscar documento');
            });
    } else {
        alert('Informe o número do pedido ou documento');
    }
}

// Função para ir para o último pedido
function irParaUltimo() {
    fetch('/api/venda/ultimo')
        .then(response => response.json())
        .then(data => {
            if (data.success && data.venda_id) {
                window.location.href = `/venda/${data.venda_id}`;
            }
        })
        .catch(err => console.error('Erro:', err));
}

// ============================================================
// GERENCIAMENTO DE STATUS DO PEDIDO
// ============================================================

// Função para FECHAR pedido (liberar para recebimento no PDV)
function fecharPedido() {
    if (!vendaId) {
        alert('Salve o pedido primeiro antes de fechar.');
        return;
    }
    
    if (!confirm('Deseja FECHAR este pedido?\n\nAo fechar:\n✓ Pedido ficará disponível para recebimento no PDV\n✓ Não poderá mais ser editado (a menos que seja reaberto)\n\nContinuar?')) {
        return;
    }
    
    fetch(`/venda/${vendaId}/fechar`, {
        method: 'POST',
        headers: { 
            'Content-Type': 'application/json',
            'Accept': 'application/json',
            'X-Requested-With': 'XMLHttpRequest'
        },
        credentials: 'same-origin'
    })
    .then(response => {
        // Sessão expirada
        if (response.status === 401) {
            return response.json().then(data => {
                alert(data.message || 'Sessão expirada. Faça login novamente.');
                window.location.href = data.redirect || '/login';
                throw new Error('Sessão expirada');
            });
        }
        if (!response.ok) {
            return response.json().then(data => {
                throw new Error(data.message || 'Erro ao fechar pedido');
            });
        }
        return response.json();
    })
    .then(data => {
        if (data.success) {
            alert(data.message);
            if (data.redirect) {
                window.location.href = data.redirect;
            } else {
                location.reload();
            }
        } else {
            alert('Erro ao fechar pedido: ' + (data.message || 'Erro desconhecido'));
        }
    })
    .catch(err => {
        console.error('Erro:', err);
        alert('Erro de comunicação ao fechar pedido: ' + err.message);
    });
}

// Função para REABRIR pedido (voltar para edição)
function reabrirPedido() {
    if (!vendaId) return;
    
    if (!confirm('Deseja REABRIR este pedido para edição?\n\nO pedido não poderá ser recebido no PDV enquanto estiver aberto.')) {
        return;
    }
    
    fetch(`/venda/${vendaId}/reabrir`, {
        method: 'POST',
        headers: { 
            'Content-Type': 'application/json',
            'Accept': 'application/json',
            'X-Requested-With': 'XMLHttpRequest'
        },
        credentials: 'same-origin'
    })
    .then(response => {
        if (response.status === 401) {
            return response.json().then(data => {
                alert(data.message || 'Sessão expirada. Faça login novamente.');
                window.location.href = data.redirect || '/login';
                throw new Error('Sessão expirada');
            });
        }
        if (!response.ok) {
            return response.json().then(data => {
                throw new Error(data.message || 'Erro ao reabrir pedido');
            });
        }
        return response.json();
    })
    .then(data => {
        if (data.success) {
            alert(data.message);
            location.reload();
        } else {
            alert('Erro ao reabrir pedido: ' + (data.message || 'Erro desconhecido'));
        }
    })
    .catch(err => {
        console.error('Erro:', err);
        alert('Erro de comunicação ao reabrir pedido: ' + err.message);
    });
}

// Função para COPIAR pedido (criar novo com mesmos itens)
function copiarPedido() {
    if (!vendaId) return;
    
    if (!confirm('Deseja COPIAR este pedido?\n\nUm novo pedido será criado com os mesmos itens, cliente e condições.\nO novo pedido ficará com status ABERTO para edição.')) {
        return;
    }
    
    fetch(`/venda/${vendaId}/copiar`, {
        method: 'POST',
        headers: { 
            'Content-Type': 'application/json',
            'Accept': 'application/json',
            'X-Requested-With': 'XMLHttpRequest'
        },
        credentials: 'same-origin'
    })
    .then(async response => {
        const contentType = response.headers.get('content-type') || '';
        let data = null;

        if (contentType.includes('application/json')) {
            try {
                data = await response.json();
            } catch (e) {
                data = null;
            }
        } else {
            const texto = await response.text();
            data = {
                message: texto && !texto.trim().startsWith('<') ? texto.trim() : null
            };
        }

        if (response.status === 401) {
            alert((data && data.message) || 'Sessão expirada. Faça login novamente.');
            window.location.href = (data && data.redirect) || '/login';
            throw new Error('Sessão expirada');
        }

        if (!response.ok) {
            throw new Error((data && data.message) || `Erro ao copiar pedido (HTTP ${response.status})`);
        }

        if (!data) {
            throw new Error('Resposta inválida do servidor ao copiar pedido');
        }

        return data;
    })
    .then(data => {
        if (data.success) {
            alert(data.message);
            // Redirecionar para o novo pedido
            if (data.redirect_url) {
                window.location.href = data.redirect_url;
            } else {
                window.location.href = `/venda/${data.nova_venda_id}`;
            }
        } else {
            alert('Erro ao copiar pedido: ' + (data.message || 'Erro desconhecido'));
        }
    })
    .catch(err => {
        console.error('Erro:', err);
        alert('Erro de comunicação ao copiar pedido: ' + err.message);
    });
}

// Função para cancelar pedido
function cancelarPedido() {
    const modal = new bootstrap.Modal(document.getElementById('modalCancelar'));
    modal.show();
}

async function solicitarCredenciaisAutorizacao(mensagem) {
    const usuario = window.prompt((mensagem || 'Operação requer autorização adicional.') + '\n\nUsuário autorizador:');
    if (!usuario) {
        return null;
    }
    const senha = window.prompt('Senha do autorizador:');
    if (!senha) {
        return null;
    }
    const pin = window.prompt('PIN do autorizador (se cadastrado):') || '';
    return {
        autorizador_usuario: usuario,
        autorizador_senha: senha,
        pin_autorizacao: pin,
    };
}

async function enviarCancelamentoPedido(payload) {
    const response = await fetch(`/venda/${vendaId}/cancelar`, {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
            'Accept': 'application/json',
            'X-Requested-With': 'XMLHttpRequest'
        },
        credentials: 'same-origin',
        body: JSON.stringify(payload)
    });
    const data = await response.json().catch(() => ({ success: false, message: 'Falha ao processar a resposta do servidor.' }));
    return { response, data };
}

async function emitirNFCeVenda(vendaId) {
    if (!vendaId) return;
    if (!confirm('Deseja emitir a NFC-e para esta venda?')) return;

    try {
        const respProcessar = await fetch(`/fiscal/processar-nfe/${vendaId}`, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                'Accept': 'application/json',
                'X-Requested-With': 'XMLHttpRequest'
            },
            credentials: 'same-origin'
        });
        const dataProcessar = await respProcessar.json();
        if (!respProcessar.ok || !dataProcessar.success) {
            throw new Error(dataProcessar.message || 'Erro ao processar NFC-e');
        }

        const notaId = dataProcessar.nota_id;

        const respTransmitir = await fetch(`/fiscal/transmitir-nfe/${notaId}`, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                'Accept': 'application/json',
                'X-Requested-With': 'XMLHttpRequest'
            },
            credentials: 'same-origin'
        });
        const dataTransmitir = await respTransmitir.json();
        if (!respTransmitir.ok || !dataTransmitir.success) {
            throw new Error(dataTransmitir.message || 'Erro na transmissão SEFAZ');
        }

        alert(`NFC-e emitida com sucesso!\nProtocolo: ${dataTransmitir.protocolo || 'N/A'}`);
        window.open(`/fiscal/imprimir-danfe-nfce-auto/${notaId}`, '_blank', 'noopener');
        location.reload();
    } catch (error) {
        alert(`Erro ao emitir NFC-e: ${error.message}`);
    }
}

// Função para confirmar cancelamento
async function confirmarCancelamento() {
    const motivo = document.getElementById('motivoCancelamento').value.trim();
    
    if (!motivo) {
        alert('Informe o motivo do cancelamento');
        return;
    }
    
    if (!vendaId) {
        alert('Nenhum pedido para cancelar');
        return;
    }
    
    try {
        let payload = { motivo: motivo };
        let { response, data } = await enviarCancelamentoPedido(payload);

        if (response.status === 403 && data.requer_autorizacao) {
            const credenciais = await solicitarCredenciaisAutorizacao(data.message || 'Cancelamento de venda finalizada requer gerente/admin.');
            if (!credenciais) {
                return;
            }
            payload = { ...payload, ...credenciais };
            ({ response, data } = await enviarCancelamentoPedido(payload));
        }

        if (response.ok && data.success) {
            alert(data.message || 'Pedido cancelado com sucesso!');
            window.location.href = data.redirect || '/vendas';
            return;
        }

        alert('Erro ao cancelar: ' + (data.message || 'Erro desconhecido'));
    } catch (err) {
        console.error('Erro:', err);
        alert('Erro ao cancelar pedido');
    }
}
</script>
{% endblock %}