// js/components/widgets/orcamentos/InsufficientStockConflictModal.jsx
// [Wave 4 KIMI 2026-05-15] Extraído de Orcamentos.jsx L1308-1362 — refactor zero-lógica.
// Padrão: IIFE + window.ZNX.widgets.orcamentos.X namespace + props injection explícita.
//
// Modal de estoque insuficiente — bloqueia conversão quote→sale quando estoque < solicitado.
// Mostra Solicitado / Disponível p/ você / Estoque físico + lista de reservas em outros orçamentos abertos.
// [BUG-FIX 20260504] 3 colunas (solicitado/disponível/físico) + reservas detail.
//
// Props (validadas FASE 1.5 = 5 props):
//   conflict: array | null — lista produtos com conflict
//   setConflict: setter (limpa)
//   pendingConvert: quote object | null — orçamento pendente conversão
//   setPendingConvert: setter (limpa)
//   openEdit: function(quote) — abre modal edição pra ajustar orçamento
(function() {
  'use strict';

  function InsufficientStockConflictModal({conflict, setConflict, pendingConvert, setPendingConvert, openEdit}){
    if(!conflict) return null;
    return (
      <div className="modal-overlay" style={{zIndex:1100}}>
        <div className="modal" style={{maxWidth:540,border:'1px solid #DC262666'}}>
          <div style={{display:'flex',alignItems:'center',gap:12,marginBottom:16}}>
            <span style={{fontSize:28}}>⚠️</span>
            <div>
              <div style={{fontSize:16,fontWeight:700,color:'#DC2626'}}>Estoque Insuficiente</div>
              <div style={{fontSize:13,color:'#9CA3AF'}}>Não foi possível converter o orçamento em venda</div>
            </div>
          </div>
          <div style={{background:'#FEF2F2',border:'1px solid #FECACA',borderRadius:8,padding:14,marginBottom:16}}>
            {conflict.map((c,i)=>(
              <div key={i} style={{marginBottom:i<conflict.length-1?16:0,paddingBottom:i<conflict.length-1?16:0,borderBottom:i<conflict.length-1?'1px solid #FECACA':'none'}}>
                <div style={{fontWeight:600,color:'#374151',marginBottom:8}}>{c.name}</div>
                {/* [BUG-FIX 20260504] Mostrar Solicitado / Disponível pra você / Estoque físico (3 colunas) */}
                <div style={{display:'grid',gridTemplateColumns:'repeat(3,1fr)',gap:8,fontSize:12,marginBottom:8}}>
                  <div style={{background:'#F9FAFB',borderRadius:6,padding:'6px 10px',textAlign:'center'}}>
                    <div style={{color:'#9CA3AF',marginBottom:2}}>Solicitado</div>
                    <div style={{fontWeight:700,color:'#374151'}}>{c.solicitado} un.</div>
                  </div>
                  <div style={{background:'#FEF2F2',border:'1px solid #FECACA',borderRadius:6,padding:'6px 10px',textAlign:'center'}}>
                    <div style={{color:'#9CA3AF',marginBottom:2}}>Disponível p/ você</div>
                    <div style={{fontWeight:700,color:'#DC2626'}}>{Math.max(0,c.disponivel||0)} un.</div>
                  </div>
                  <div style={{background:'#F9FAFB',borderRadius:6,padding:'6px 10px',textAlign:'center'}}>
                    <div style={{color:'#9CA3AF',marginBottom:2}}>Estoque físico</div>
                    <div style={{fontWeight:700,color:'#2563EB'}}>{c.estoque} un.</div>
                  </div>
                </div>
                {/* Lista de reservas em outros orçamentos */}
                {Array.isArray(c.reservations)&&c.reservations.length>0&&(
                  <div style={{background:'#FFFBEB',border:'1px solid #FCD34D',borderRadius:6,padding:'8px 12px',marginBottom:6}}>
                    <div style={{fontSize:11,fontWeight:700,color:'#92400E',marginBottom:6}}>📦 {c.reservado} un. reservadas em outros orçamentos abertos:</div>
                    <ul style={{margin:0,paddingLeft:18,fontSize:11,color:'#78350F'}}>
                      {c.reservations.map((r,ri)=>(
                        <li key={ri} style={{marginBottom:2}}>
                          <strong>{r.quoteNumber||'ORC-?'}</strong> — {r.sellerName||'—'}: <strong>{r.qty} un.</strong>
                        </li>
                      ))}
                    </ul>
                  </div>
                )}
                <div style={{fontSize:12,color:'#DC2626'}}>
                  ✕ Você precisa de {c.solicitado} un., mas só tem {Math.max(0,c.disponivel||0)} un. disponível pra você.
                </div>
              </div>
            ))}
          </div>
          <div style={{display:'flex',gap:10,justifyContent:'flex-end'}}>
            <button className="btn-outline" style={{borderColor:'#DC2626',color:'#DC2626'}} onClick={()=>{setConflict(null);setPendingConvert(null);}}>✕ Cancelar</button>
            <button className="btn-gold" onClick={()=>{setConflict(null);setPendingConvert(null);openEdit(pendingConvert);}}>🔄 Editar Orçamento</button>
          </div>
        </div>
      </div>
    );
  }

  window.ZNX = window.ZNX || {};
  window.ZNX.widgets = window.ZNX.widgets || {};
  window.ZNX.widgets.orcamentos = window.ZNX.widgets.orcamentos || {};
  window.ZNX.widgets.orcamentos.InsufficientStockConflictModal = InsufficientStockConflictModal;
})();