import React, { useState, useMemo, useEffect, useCallback } from 'react';
import { useNavigate } from 'react-router-dom';
import { Search, Plus, Loader2, Archive, CreditCard, Building, Car, FileText, FileCheck, ShieldAlert, ExternalLink } from 'lucide-react';
import ExcelTable from '../components/ExcelTable';
import { GrKanbanBoard } from '../components/GrKanbanBoard';
import { CadastrosAbertosColumn } from '../components/CadastrosAbertosColumn';
import { useGrStore } from '../services/useGrStore';
import { toast } from 'sonner';
import { handleGrError } from '../utils/grErrorHandler';
import { GrFormSidebar } from '../components/GrFormSidebar';


import { Input } from '@/components/ui/input';
import { Label } from '@/components/ui/label';
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
import * as grService from '../services/grService';

const ContractsView = () => {
  const navigate = useNavigate();
  const { userData } = useGrStore();
  const [viewMode, setViewMode] = useState('painel'); // 'contrato', 'painel' (cadastros_abertos removido)
  const [contractMode, setContractMode] = useState('agregado'); // 'agregado' (rentals) ou 'frota-fixa'
  const [searchTerm, setSearchTerm] = useState('');
  const [isSidebarOpen, setIsSidebarOpen] = useState(false);
  const [loading, setLoading] = useState(false);
  const [selectedItem, setSelectedItem] = useState(null); // Registration or Contract
  
  const [formData, setFormData] = useState({
    iddrivers: '',
    idcontrato_drivers: '',
    tipo_contract: '',
    base_driver: '',
    status: 'Ativo',
    status_assinatura_form: '', // Novo campo para controle de formulário (Assinado/Não Assinado)
    data_admissao: '',
    data_demissao: ''
  });
  
  const [registrations, setRegistrations] = useState([]);
  const [contractsData, setContractsData] = useState([]);
  const [bases, setBases] = useState([]);
  const [archivedContracts, setArchivedContracts] = useState([]);

  const fetchData = useCallback(async () => {
    setLoading(true);
    try {
      // 1. Fetch registrations by modality (GET /cadastro/drivers/apresentar/modalidade/{modalidade})
      // Mapear modalidade do estado para formato da API
      const apiModalidade = contractMode === 'agregado' ? 'agregado_rentals' : 'frota_fixa';
      const regResp = await grService.getAllDriverRegistrations(apiModalidade);
      // Priorizar 'dados' que é o padrão do backend
      const regList = regResp.dados || regResp.Base_Dados_API || regResp || [];
      setRegistrations(Array.isArray(regList) ? regList : []);

      // 2. Fetch active contracts (GET /contrato/drivers/apresentar?modalidade=...)
      const [contractResp, basesResp] = await Promise.all([
        grService.getActiveContracts(contractMode),
        grService.getBases()
      ]);

      const basesList = basesResp.dados || basesResp.Base_Dados_API || basesResp || [];
      setBases(Array.isArray(basesList) ? basesList : []);

      // Priorizar 'dados' que é o padrão do backend
      const contractList = contractResp.dados || contractResp.Base_Dados_API || contractResp || [];
      
      // Enhance contracts with driver names and ensure nome_completo is available
      const enhancedContracts = (Array.isArray(contractList) ? contractList : []).map(contract => {
        const driver = (Array.isArray(regList) ? regList : []).find(d => d.iddrivers === contract.iddrivers);
        return {
          ...contract,
          nome: driver ? driver.nome_completo : contract.nome_completo || `ID: ${contract.iddrivers}`,
          nome_completo: contract.nome_completo || driver?.nome_completo || `ID: ${contract.iddrivers}`,
          cpf: driver?.cpf || contract.cpf || null, // Usar null para indicar ausência de CPF
          coordenador: driver?.coordenador || contract.coordenador || null // Adicionar coordenador para busca
        };
      });

      setContractsData(enhancedContracts);

      // 3. Fetch archived contracts (GET /contrato/drivers/arquivados) para regra de Cadastros Abertos
      try {
        const archivedResp = await grService.getArchivedContracts();
        // Priorizar 'dados' que é o padrão do backend
        const archivedList = archivedResp.dados ?? archivedResp.Base_Dados_API ?? archivedResp.data ?? archivedResp;
        setArchivedContracts(Array.isArray(archivedList) ? archivedList : []);
      } catch (archivedErr) {
        console.warn("Erro ao buscar contratos arquivados (Cadastros Abertos usará só ativos):", archivedErr);
        setArchivedContracts([]);
      }
    } catch (error) {
      handleGrError(error, "Erro ao carregar dados de contratos.");
    } finally {
      setLoading(false);
    }
  }, [contractMode]);

  useEffect(() => {
    fetchData();
  }, [fetchData]);
  
  const handleInputChange = (field, value) => {
    setFormData(prev => {
      const newData = { ...prev, [field]: value };
      
      // Se mudar status_assinatura para "Não Assinado", limpa a data de admissão
      if (field === 'status_assinatura_form' && value === 'Não Assinado') {
        newData.data_admissao = '';
      }
      
      return newData;
    });
  };

  const handleEditItem = (item) => {
    // Check if item is a registration card (from merged column)
    if (item.isRegistration) {
        setSelectedItem(item); // Keep item to access images
        setFormData({
            iddrivers: item.iddrivers || '',
            idcontrato_drivers: '',
            tipo_contract: item.modalidade || '',
            base_driver: item.base || '',
            status: 'Ativo',
            status_assinatura_form: contractMode === 'agregado' ? 'Não Assinado' : '',
            data_admissao: '',
            data_demissao: ''
        });
        setIsSidebarOpen(true);
        return;
    }

    setSelectedItem(item);
    setFormData({
      iddrivers: item.iddrivers || '',
      idcontrato_drivers: item.idcontrato_drivers ?? '',
      tipo_contract: (item.tipo_contract && item.tipo_contract !== 'undefined') ? item.tipo_contract : '',
      base_driver: (item.base_driver || item.base || '') !== 'undefined' ? (item.base_driver || item.base || '') : '',
      status: item.status || 'Ativo',
      status_assinatura_form: item.status_assinatura || '',
      data_admissao: item.data_admissao || '',
      data_demissao: item.data_demissao || ''
    });
    setIsSidebarOpen(true);
  };

  const handleAddNew = () => {
    setSelectedItem(null);
    setFormData({
      iddrivers: '',
      idcontrato_drivers: '',
      tipo_contract: '',
      base_driver: '',
      status: 'Ativo',
      status_assinatura_form: contractMode === 'agregado' ? 'Não Assinado' : '',
      data_admissao: '',
      data_demissao: ''
    });
    setIsSidebarOpen(true);
  };

  const handleSave = async (e) => {
    e.preventDefault();
    try {
      // Preparar payload com status_assinatura se preenchido
      const payload = {
        ...formData,
        status_assinatura: formData.status_assinatura_form || undefined
      };
      
      // Lógica de status inicial para NOVOS contratos (criação a partir de cadastro)
      if (!selectedItem?.tipo_contract) {
        if (contractMode === 'frota-fixa') {
          // Frota Fixa: inicia sempre como "Aguardando Checklist/Análise GR"
          payload.global_status = "Aguardando Análise GR";
          payload.status_assinatura = "Sem Assinatura";
        } else if (contractMode === 'agregado' && formData.status_assinatura_form) {
          // Agregados: define status baseado no seletor de assinatura
          payload.global_status = formData.status_assinatura_form === 'Assinado' ? 'Assinados' : 'Não Assinado';
        }
      }

      // Remover campo auxiliar do formulário antes de enviar
      delete payload.status_assinatura_form;

      if (selectedItem?.tipo_contract) {
        // Edit existing contract
        await grService.updateContract(payload);
        toast.success("Contrato atualizado!");
      } else {
        // Create new contract from registration
        await grService.createContract({
          ...payload,
          iddrivers: formData.iddrivers
        });

        // Garantir que os status sejam aplicados usando as rotas adequadas
        if (payload.global_status) {
          await grService.updateContractGlobalStatus({
            iddrivers: formData.iddrivers,
            global_status: payload.global_status
          });
        }
        
        if (payload.status_assinatura) {
          await grService.updateContractSignatureStatus({
            iddrivers: formData.iddrivers,
            status_assinatura: payload.status_assinatura
          });
        }

        toast.success("Contrato criado!");
      }
      setIsSidebarOpen(false);
      fetchData();
    } catch (error) {
      handleGrError(error, "Erro ao salvar contrato.");
    }
  };

  // "Cadastros Abertos" Logic: 
  // ATUALIZADO: O backend agora retorna dados já filtrados por modalidade
  // As rotas /cadastro/drivers/apresentar/modalidade/{modalidade} já fazem a filtragem
  // Não precisamos mais da lógica complexa de filtragem no frontend
  
  // ===== LÓGICA ANTIGA (COMENTADA) =====
  // const cadastrosAbertosData = useMemo(() => {
  //   const activeIds = contractsData.map(c => c.iddrivers).filter(id => id != null);
  //   const archivedIds = (archivedContracts || []).map(c => c.iddrivers).filter(id => id != null);
  //   const contractDriverIds = [...new Set([...activeIds, ...archivedIds])];
  //
  //   // Helper para normalizar modalidade
  //   const normalizeModalidade = (modalidade) => {
  //     if (!modalidade) return '';
  //     return String(modalidade).trim();
  //   };
  //   
  //   return registrations.filter(r => {
  //     // Verificar se este cadastro (por iddrivers) já possui um contrato criado
  //     const hasContract = r.iddrivers != null && contractDriverIds.includes(r.iddrivers);
  //     const isApproved = r.global_status === 'Aprovado';
  //
  //     // Detectar se é modalidade especial (Agregado / Rentals)
  //     const modalidade = normalizeModalidade(r.modalidade);
  //     const isAgregadoOrRentals = modalidade === 'Agregado' || modalidade === 'Rentals';
  //     const isEmAnalise =
  //       r.global_status === 'Aguardando Análise GR' ||
  //       r.global_status === 'Aguardando Análise';
  //     
  //     // Regra principal: Se tem contrato criado (em qualquer coluna), ocultar da lista de cadastros abertos
  //     if (hasContract) {
  //       return false; // Ocultar se tiver contrato criado
  //     }
  //     
  //     // Regra extra: para Agregado / Rentals, permitir aparecer se estiver Aprovado OU ainda em Aguardando Análise
  //     if (isAgregadoOrRentals) {
  //       return !hasContract && (isApproved || isEmAnalise);
  //     }
  //     
  //     // Regra padrão: mostrar apenas se estiver aprovado e não tiver contrato
  //     return isApproved && !hasContract;
  //   });
  // }, [registrations, contractsData, archivedContracts]);
  // ===== FIM LÓGICA ANTIGA =====

  // NOVA LÓGICA SIMPLIFICADA: Backend retorna dados já filtrados
  const cadastrosAbertosData = useMemo(() => {
    // Apenas retorna os registrations que já vêm filtrados do backend
    return registrations;
  }, [registrations]);

  const handleCardMove = async (cardId, columnId) => {
    // NOTA: Bloqueio de cards (Agregado/Rentals) é APENAS para a tela de cadastros, não para contratos
    // Na tela de contratos, todos os cards podem ser movidos livremente

    // Legacy mapping for Kanban move
    // NOTA: statusMap mantido com "Aguardando Análise GR" para compatibilidade com backend
    const statusMap = {
      'aguardando': 'Aguardando Análise GR', // Backend continua usando este valor
      'checklist': 'Aguardando Análise GR', // Mapear nova coluna Checklist para o status correto
      'analise': 'Em Análise',
      'andamento': 'Enviado', // Renomeado de "Em Andamento" para "Enviado"
      'assinados': 'Assinados',
      'recusado': 'Não Assinado'
    };

    const newStatus = statusMap[columnId] || columnId;

    try {
      // Localizar o contrato para obter os IDs necessários
      const contract = contractsData.find(c => (c.idcontrato_drivers || c.iddrivers) === cardId);
      const idDrivers = contract?.iddrivers || cardId;

      // 1. Atualiza o Status Global usando o endpoint especializado
      await grService.updateContractGlobalStatus({
        iddrivers: idDrivers,
        global_status: newStatus
      });

      // 2. Atualiza o Status de Assinatura usando o endpoint especializado
      // Mapeia o status da assinatura conforme a coluna de destino
      let sigStatus = "Em andamento";
      
      if (columnId === 'checklist' || columnId === 'aguardando') {
        sigStatus = "Sem Assinatura";
      } else if (columnId === 'andamento') {
        sigStatus = "Em andamento";
      } else if (columnId === 'assinados' || newStatus === "Assinados") {
        sigStatus = "Assinado";
      } else if (columnId === 'recusado' || newStatus === "Não Assinado") {
        sigStatus = "Não Assinado";
      }

      await grService.updateContractSignatureStatus({
        iddrivers: idDrivers,
        status_assinatura: sigStatus
      });

      toast.success("Movimentação processada com sucesso!");
      fetchData(); // Refresh para garantir paridade com o banco
    } catch (error) {
       handleGrError(error, "Erro ao atualizar status.");
    }
  };

  // Kanban Configuration aligned with Legacy Statuses
  // Colunas dinâmicas baseadas na modalidade (Agregado/Rentals vs Frota Fixa)
  // NOTA: Na tela de contratos, NÃO há bloqueio de cards (bloqueio é apenas na tela de cadastros)
  const kanbanColumns = useMemo(() => {
    const defaultCols = [
      { id: 'checklist', title: 'Aguardando Checklist', color: 'slate', statusKey: 'Checklist' },
      { id: 'andamento', title: 'Enviado', color: 'orange', statusKey: 'Enviado' },
      { id: 'assinados', title: 'Assinados', color: 'emerald', statusKey: 'Assinados' },
      { id: 'recusado', title: 'Não Assinado', color: 'red', statusKey: 'Não Assinado' }
    ];

    // Diferenciar colunas por modalidade
    const activeCols = contractMode === 'agregado' 
      ? defaultCols.filter(c => c.id !== 'andamento' && c.id !== 'checklist') // Ocultar Enviado e Checklist para Agregados
      : defaultCols;

    return activeCols.map(col => {
      // Base contracts for this column
      const colContracts = contractsData.filter(d => {
        // Primeiro filtrar por status
        let matchesStatus = false;
        if (col.id === 'andamento') {
          // Apenas status de envio inicial
          matchesStatus = d.global_status === 'Enviado' || d.global_status === 'Em Andamento';
        } else if (col.id === 'checklist') {
          // Status de análise/checklist que agora têm coluna própria
          matchesStatus = d.global_status === 'Aguardando Análise GR' || d.global_status === 'Aguardando Análise';
        } else if (col.statusKey === 'Assinados') {
          // Aceitar tanto singular quanto plural para Assinados
          matchesStatus = d.global_status === 'Assinados' || d.global_status === 'Assinado';
        } else {
          matchesStatus = d.global_status === col.statusKey;
        }

        // Se não passa pelo filtro de status, retornar false
        if (!matchesStatus) return false;

        // Aplicar filtro de busca (nome, CPF, coordenador)
        if (searchTerm) {
          const searchLower = searchTerm.toLowerCase();
          const matchesSearch = 
            (d.nome_completo || d.nome || '').toLowerCase().includes(searchLower) ||
            (d.cpf || '').includes(searchTerm) ||
            (d.coordenador || '').toLowerCase().includes(searchLower);
          
          if (!matchesSearch) return false;
        }

        return true;
      }).map(d => {
      const registration = registrations.find(r => r.iddrivers === d.iddrivers);
      
      // Formatar data de assinatura (remover hora se for apenas 00:00:00)
      const formatDate = (dateStr) => {
        if (!dateStr) return 'N/A';
        // Se tiver apenas 00:00:00, mostrar só a data
        if (dateStr.includes('00:00:00')) {
          return dateStr.split(' ')[0];
        }
        return dateStr;
      };
      
      // Formatar data de admissão
      const formatAdmissao = (dateStr) => {
        if (!dateStr) return 'Não informado';
        return dateStr;
      };
      
      // Buscar CPF do registration ou do contrato
      const cpfValue = registration?.cpf || d.cpf || null;
      
      // Normalização visual: Forçar o status exibido no card conforme á coluna
      let displayStatus = d.status_assinatura || "Pendente";
      if (col.id === 'assinados') displayStatus = "Assinado";
      else if (col.id === 'recusado') displayStatus = "Não Assinado";
      else if (col.id === 'checklist' || col.id === 'aguardando') displayStatus = "Sem Assinatura";
      else if (col.id === 'andamento') displayStatus = "Em andamento";

      return {
        ...d,
        // Usar idcontrato_drivers como ID único para cards de contrato (evita duplicidade para o mesmo motorista)
        id: d.idcontrato_drivers || d.iddrivers, 
        title: d.nome_completo || d.nome || `ID: ${d.iddrivers}`, 
        subtitle: cpfValue || 'N/A', 
        date: formatDate(d.data_assinatura), 
        base: d.base_driver || registration?.base || 'N/A',
        details: [ 
            { label: 'Base', value: d.base_driver || registration?.base || 'N/A' },
            { label: 'Tipo Contrato', value: d.tipo_contract || "Sem Contrato" },
            { label: 'Status Assinatura', value: displayStatus },
            { label: 'Admissão', value: formatAdmissao(d.data_admissao) }
        ],
        isBlocked: false,
        status: d.global_status
      };
    });

    // Special Logic: Merge "Cadastros Abertos" (registrations) into "Checklist" column for Frota Fixa
    // These cards are derived from registrations without contracts
    let finalCards = [...colContracts];

    if (contractMode === 'frota-fixa' && col.id === 'checklist') {
        const registrationCards = registrations.filter(reg => {
            // Apply search filter
            if (searchTerm) {
                const searchLower = searchTerm.toLowerCase();
                return (
                  (reg.nome_completo || '').toLowerCase().includes(searchLower) ||
                  (reg.cpf || '').includes(searchTerm) ||
                  (reg.coordenador || '').toLowerCase().includes(searchLower)
                );
            }
            return true;
        }).map(reg => ({
            ...reg,
            id: `reg-${reg.iddrivers}`, // Unique ID distinct from contracts
            isRegistration: true, // Flag to identify as registration card
            title: reg.nome_completo || `ID: ${reg.iddrivers}`,
            subtitle: reg.cpf || 'N/A',
            date: reg.data_cadastro || 'N/A',
            base: reg.base || 'N/A',
            details: [
                { label: 'Placa', value: reg.placa_veiculo || 'N/A' },
                { label: 'Modalidade', value: reg.modalidade || 'N/A' },
                { label: 'Tipo', value: reg.tipo_veiculo || 'N/A' }
            ],
            // Special properties for registration cards in Kanban
            isBlocked: true, // Prevent dragging
            statusColor: 'purple' // Distinguish visually
        }));

        finalCards = [...registrationCards, ...colContracts];
    }

    return {
      ...col,
      cards: finalCards
    };
  });
}, [contractsData, registrations, contractMode, searchTerm]);

  // Columns for "Contrato" (Table View - "Contrato_TAB")
  const contractTableColumns = [
    { field: 'nome', header: 'Nome', width: 220 },
    { field: 'cpf', header: 'CPF', width: 140 },
    { field: 'base_driver', header: 'Base', width: 130 },
    { field: 'data_admissao', header: 'Admissão', width: 120 },
    { field: 'status_assinatura', header: 'Assinatura', width: 130 },
    { field: 'global_status', header: 'Status Global', width: 180, render: (row) => (
      <span className={`px-3 py-1 rounded-full text-[10px] font-bold uppercase tracking-wider ${
        (row.global_status === 'Assinado' || row.global_status === 'Assinados') ? 'bg-emerald-100 text-emerald-700' :
        row.global_status === 'Não Assinado' ? 'bg-red-100 text-red-700' :
        'bg-slate-100 text-slate-700'
      }`}>
        {row.global_status}
      </span>
    )}
  ];

  // Columns for "Cadastros Abertos"
  const openRegTableColumns = [
    { field: 'nome_completo', header: 'Nome Completo', width: 220 },
    { field: 'cpf', header: 'CPF', width: 140 },
    { field: 'placa_veiculo', header: 'Placa', width: 120 },
    { field: 'email', header: 'E-mail', width: 200 },
    { field: 'global_status', header: 'Status', width: 120 }
  ];

  return (
    <div className="flex flex-col h-full gap-4 md:gap-8">
      {/* Header Section */}
      <div className="flex flex-col gap-6">
        <div className="flex flex-col xl:flex-row xl:items-end justify-between gap-8">
            <div className="space-y-1">
                <h1 className="text-3xl md:text-5xl font-bold text-slate-800 dark:text-white tracking-tighter leading-none">
                    Gestão de <span className="text-[var(--gr-primary)]">Contratos</span>
                </h1>
                <p className="text-slate-400 dark:text-slate-500 text-sm md:text-base font-medium italic opacity-80">
                    Monitore assinaturas e status contratuais
                </p>
            </div>

            <div className="flex flex-wrap items-center gap-4">
                {/* Contract Mode Selector (Agregados/Rentals vs Frota Fixa) */}
                <div className="flex bg-emerald-100/80 dark:bg-emerald-900/30 p-1.5 rounded-[24px] border border-emerald-200 dark:border-emerald-800/50 shadow-inner">
                    <button 
                        onClick={() => setContractMode('agregado')}
                        className={`px-6 py-2.5 rounded-[20px] text-[10px] font-bold uppercase tracking-wider transition-all duration-300 ${contractMode === 'agregado' ? 'bg-[var(--gr-primary)] shadow-lg text-white transform scale-[1.05]' : 'text-emerald-700 dark:text-emerald-300 hover:text-emerald-900 dark:hover:text-emerald-100'}`}
                    >
                        Agregados/Rentals
                    </button>
                    <button 
                        onClick={() => setContractMode('frota-fixa')}
                        className={`px-6 py-2.5 rounded-[20px] text-[10px] font-bold uppercase tracking-wider transition-all duration-300 ${contractMode === 'frota-fixa' ? 'bg-[var(--gr-primary)] shadow-lg text-white transform scale-[1.05]' : 'text-emerald-700 dark:text-emerald-300 hover:text-emerald-900 dark:hover:text-emerald-100'}`}
                    >
                        Frota Fixa
                    </button>
                </div>

                {/* Mode Selector */}
                <div className="flex bg-slate-100 dark:bg-slate-800/50 p-1.5 rounded-[24px] border border-slate-200 dark:border-white/5 shadow-inner">
                    {/* Botão Cadastros Abertos comentado conforme solicitado */}
                    {/* 
                    <button 
                        onClick={() => setViewMode('cadastros_abertos')}
                        className={`px-6 py-2.5 rounded-[20px] text-[10px] font-bold uppercase tracking-wider transition-all duration-300 ${viewMode === 'cadastros_abertos' ? 'bg-white dark:bg-slate-700 shadow-lg text-[var(--gr-primary)] dark:text-white transform scale-[1.05]' : 'text-slate-500 hover:text-slate-700 dark:hover:text-slate-300'}`}
                    >
                        Cadastros Abertos
                    </button>
                    */}
                    <button 
                        onClick={() => setViewMode('contrato')}
                        className={`px-6 py-2.5 rounded-[20px] text-[10px] font-bold uppercase tracking-wider transition-all duration-300 ${viewMode === 'contrato' ? 'bg-white dark:bg-slate-700 shadow-lg text-[var(--gr-primary)] dark:text-white transform scale-[1.05]' : 'text-slate-500 hover:text-slate-700 dark:hover:text-slate-300'}`}
                    >
                        Tabela
                    </button>
                    <button 
                        onClick={() => setViewMode('painel')}
                        className={`px-6 py-2.5 rounded-[20px] text-[10px] font-bold uppercase tracking-wider transition-all duration-300 ${viewMode === 'painel' ? 'bg-white dark:bg-slate-700 shadow-lg text-[var(--gr-primary)] dark:text-white transform scale-[1.05]' : 'text-slate-500 hover:text-slate-700 dark:hover:text-slate-300'}`}
                    >
                        Painel
                    </button>
                </div>

                {/* Search */}
                <div className="relative group flex-1 min-w-[260px] max-w-[400px]">
                    <Search size={16} className="absolute left-4 top-1/2 -translate-y-1/2 text-slate-400 group-focus-within:text-[var(--gr-primary)] transition-colors" />
                    <input 
                        type="text" 
                        placeholder="Buscar por nome, CPF ou coordenador..." 
                        value={searchTerm}
                        onChange={(e) => setSearchTerm(e.target.value)}
                        className="pl-12 pr-14 py-3.5 w-full bg-slate-50 dark:bg-slate-900/50 border border-slate-200 dark:border-white/5 rounded-[24px] text-xs focus:outline-none focus:ring-4 focus:ring-[var(--gr-primary)]/10 focus:border-[var(--gr-primary)] transition-all font-semibold shadow-sm"
                    />
                </div>

                {/* Arquivados */}
                <button 
                  type="button"
                  onClick={() => navigate('/plataforma/gr/contratos/arquivados')}
                  className="flex items-center gap-2 px-6 py-3 bg-slate-100 dark:bg-slate-800 hover:bg-slate-200 dark:hover:bg-slate-700 text-slate-700 dark:text-slate-200 rounded-[24px] font-bold text-[11px] uppercase tracking-widest transition-all"
                >
                  <Archive size={16} />
                  Arquivados
                </button>

                {/* Add Button - Commented out as requested */}
                {/* 
                <button 
                    onClick={handleAddNew}
                    className="flex items-center gap-2 px-8 py-3.5 bg-[var(--gr-primary)] hover:bg-[var(--gr-primary-dark)] text-white rounded-[24px] font-bold text-[11px] uppercase tracking-widest transition-all shadow-xl shadow-[var(--gr-primary)]/25 hover:scale-[1.02] active:scale-95 whitespace-nowrap"
                >
                    <Plus size={18} strokeWidth={3} />
                    Adicionar
                </button>
                */}
            </div>
        </div>
      </div>

      {/* Content Area */}
      <div className="flex-1 min-h-0 bg-white dark:bg-black/20 rounded-[32px] border border-slate-100 dark:border-white/5 overflow-hidden shadow-sm">
        {loading ? (
             <div className="flex h-full w-full items-center justify-center">
                <Loader2 className="animate-spin text-[var(--gr-primary)]" size={32} />
            </div>
        ) : (
            viewMode === 'painel' ? (
                <div className="flex gap-4 h-full w-full overflow-x-auto pb-4 custom-scrollbar min-h-0">
                  {/* Coluna de Cadastros Abertos/Checklist - Exibida apenas se NÃO for Frota Fixa (ois já está mergeada) */}
                  {contractMode !== 'frota-fixa' && (
                  <CadastrosAbertosColumn 
                    registrations={cadastrosAbertosData}
                    onContractCreate={async (cData) => {
                      try {
                        const payload = {
                          ...cData,
                          status_assinatura: cData.status_assinatura_form || undefined
                        };
                        
                        // Lógica de status inicial automatizado
                        if (contractMode === 'frota-fixa') {
                          // Inicia em "Aguardando Análise GR" para cair na coluna Checklist (que vem antes de Enviado)
                          payload.global_status = "Aguardando Análise GR";
                          payload.status_assinatura = "Sem Assinatura";
                        } else if (contractMode === 'agregado' && cData.status_assinatura_form) {
                          payload.global_status = cData.status_assinatura_form === 'Assinado' ? 'Assinados' : 'Não Assinado';
                        }

                        delete payload.status_assinatura_form;

                        await grService.createContract(payload);
                        
                        // Garantir que os status sejam aplicados usando as rotas adequadas
                        if (payload.global_status) {
                          await grService.updateContractGlobalStatus({
                            iddrivers: payload.iddrivers,
                            global_status: payload.global_status
                          });
                        }
                        
                        if (payload.status_assinatura) {
                          await grService.updateContractSignatureStatus({
                            iddrivers: payload.iddrivers,
                            status_assinatura: payload.status_assinatura
                          });
                        }

                        toast.success("Contrato criado com sucesso!");
                        fetchData();
                      } catch (error) {
                        handleGrError(error, "Erro ao criar contrato.");
                        throw error;
                      }
                    }}
                    searchTerm={searchTerm}
                    columnTitle={contractMode === 'agregado' ? 'Cadastros Abertos' : 'Aguardando Checklist'}
                    contractMode={contractMode}
                  />
                  )}
                  {/* Kanban Board com as outras colunas */}
                  <GrKanbanBoard 
                    columns={kanbanColumns} 
                    userRole={userData?.usuario?.grupo || 'Administrador'}
                    onCardMove={handleCardMove}
                    onCardClick={handleEditItem}
                    allowRoleMovement={true}
                  />
                </div>
              ) : viewMode === 'contrato' ? (
                <ExcelTable 
                  data={contractsData.filter(d => 
                    (d.nome || '').toLowerCase().includes(searchTerm.toLowerCase()) || 
                    (d.cpf || '').includes(searchTerm) ||
                    (d.coordenador || '').toLowerCase().includes(searchTerm.toLowerCase())
                  )} 
                  columns={contractTableColumns} 
                  pageSize={10}
                  loading={false}
                  onEdit={handleEditItem}
                  onRowClick={handleEditItem}
                  filterDefs={[
                    { field: 'base_driver', header: 'Base', type: 'select' },
                    { field: 'tipo_contract', header: 'Tipo', type: 'select' },
                    { field: 'global_status', header: 'Status', type: 'select' }
                  ]}
                  filterOptions={{
                    base_driver: bases.map(b => b.base || b.nome).filter(Boolean).sort()
                  }}
                />
              ) : (
                // View de cadastros abertos comentada conforme solicitado
                <div className="flex h-full w-full items-center justify-center">
                  <p className="text-slate-400 text-sm">Visualização de cadastros abertos movida para a coluna no painel.</p>
                </div>
              )
        )}
      </div>

      {/* Contract Form Sidebar */}
      <GrFormSidebar 
        isOpen={isSidebarOpen} 
        onClose={() => setIsSidebarOpen(false)}
        title={selectedItem?.tipo_contract ? "Editar Contrato" : "Novo Contrato"}
        footer={
          <div className="flex flex-col sm:flex-row gap-3 w-full">
            {selectedItem?.tipo_contract && (
              <button
                type="button"
                onClick={async () => {
                  try {
                    const contractId = selectedItem.idcontrato_drivers ?? formData.idcontrato_drivers;

                    if (!contractId) {
                      toast.error("ID do contrato (idcontrato_drivers) não encontrado para arquivar.");
                      return;
                    }
                    await grService.archiveContract(contractId);
                    toast.success("Contrato arquivado com sucesso!");
                    setIsSidebarOpen(false);
                    fetchData();
                  } catch (error) {
                    handleGrError(error, "Erro ao arquivar contrato.");
                  }
                }}
                className="w-full sm:w-auto sm:flex-1 py-4 bg-slate-200 hover:bg-slate-300 text-slate-800 rounded-2xl font-bold uppercase text-xs tracking-widest transition-all shadow-md shadow-slate-400/20 active:scale-95"
              >
                Arquivar Contrato
              </button>
            )}
            <button 
              type="submit"
              form="contract-form"
              className="w-full sm:w-auto sm:flex-[2] py-4 bg-[var(--gr-primary)] hover:bg-[var(--gr-primary-dark)] text-white rounded-2xl font-bold uppercase text-xs tracking-widest transition-all shadow-lg shadow-[var(--gr-primary)]/20 active:scale-95"
            >
              {selectedItem?.tipo_contract ? "Atualizar Contrato" : "Salvar Contrato"}
            </button>
          </div>
        }
      >
        <form id="contract-form" onSubmit={handleSave} className="space-y-8">
            {selectedItem && (
               <div className="space-y-4 p-4 bg-slate-50 dark:bg-white/5 rounded-2xl border border-slate-200 dark:border-white/10">
                  <div>
                    <Label className="text-[10px] font-bold uppercase tracking-widest text-[var(--gr-primary)]">Motorista Selecionado</Label>
                    <p className="text-sm font-bold text-slate-700 dark:text-white uppercase">{selectedItem.nome || selectedItem.nome_completo}</p>
                    <p className="text-[11px] text-slate-400 font-medium italic">CPF: {selectedItem.cpf}</p>
                  </div>

                  {/* Document Images Gallery */}
                  {(selectedItem.isRegistration || !selectedItem.tipo_contract) && (
                    <div className="space-y-3 pt-4 border-t border-slate-200 dark:border-white/10">
                        <Label className="text-[10px] font-bold uppercase tracking-widest text-slate-400">Documentos Disponíveis</Label>
                        <div className="flex flex-col gap-2">
                            {[
                                { key: 'cnh_frente', label: 'CNH (Frente)', icon: CreditCard },
                                { key: 'cnh_verso', label: 'CNH (Verso)', icon: CreditCard },
                                { key: 'crlv', label: 'Documentação do Veículo', icon: Car },
                                { key: 'comprovante_residencia', label: 'Comprovante de Residência', icon: Building },
                                { key: 'cartao_cnpj', label: 'Cartão CNPJ', icon: FileText },
                                { key: 'antt', label: 'ANTT', icon: FileText },
                                { key: 'direcao_defensiva', label: 'Direção Defensiva', icon: FileCheck },
                                { key: 'exame_toxico', label: 'Exame Toxicológico', icon: ShieldAlert },
                                { key: 'owner_cnh_file', label: 'CNH Responsável', icon: CreditCard }
                            ].map((doc) => {
                                const url = selectedItem[doc.key];
                                if (!url || typeof url !== 'string' || !url.startsWith('http')) return null;
                                
                                return (
                                    <a 
                                        key={doc.key} 
                                        href={url} 
                                        target="_blank" 
                                        rel="noopener noreferrer"
                                        className="flex items-center gap-3 p-3 rounded-xl bg-slate-50 dark:bg-white/5 border border-slate-100 dark:border-white/5 hover:bg-[var(--gr-primary)]/10 hover:border-[var(--gr-primary)]/20 hover:text-[var(--gr-primary)] transition-all group"
                                    >
                                        <div className="w-8 h-8 rounded-lg bg-white dark:bg-white/10 flex items-center justify-center text-slate-400 group-hover:bg-[var(--gr-primary)] group-hover:text-white transition-colors shadow-sm">
                                            <doc.icon size={16} />
                                        </div>
                                        <span className="text-[11px] font-bold uppercase tracking-wide text-slate-600 dark:text-slate-300 group-hover:text-[var(--gr-primary)] flex-1">{doc.label}</span>
                                        <ExternalLink size={14} className="opacity-0 group-hover:opacity-100 transition-opacity text-[var(--gr-primary)]" />
                                    </a>
                                );
                            })}
                        </div>
                    </div>
                  )}
               </div>
            )}

            <div className="space-y-2">
                <Label className="text-[10px] font-bold uppercase tracking-widest text-slate-400 ml-1">Tipo de Contrato</Label>
                <Input 
                  value={formData.tipo_contract}
                  onChange={(e) => handleInputChange('tipo_contract', e.target.value)}
                  placeholder="Ex: Frota Fixa Mensal" 
                  className="h-12 rounded-2xl bg-white dark:bg-white/5 border-slate-200 dark:border-white/10 shadow-sm" 
                />
            </div>

            <div className="space-y-2">
                <Label className="text-[10px] font-bold uppercase tracking-widest text-slate-400 ml-1">Base do Driver</Label>
                <Select 
                  value={formData.base_driver}
                  onValueChange={(val) => handleInputChange('base_driver', val)}
                >
                    <SelectTrigger className="h-12 rounded-2xl bg-white dark:bg-white/5 border-slate-200 dark:border-white/10 shadow-sm">
                        <SelectValue placeholder="Selecione a base..." />
                    </SelectTrigger>
                    <SelectContent className="rounded-2xl border-slate-200 dark:border-white/10">
                        {bases.map((b) => (
                           <SelectItem key={b.idbase || b.id} value={b.base || b.nome}>
                             {b.base || b.nome}
                           </SelectItem>
                        ))}
                    </SelectContent>
                </Select>
            </div>

            <div className="space-y-2">
                <Label className="text-[10px] font-bold uppercase tracking-widest text-slate-400 ml-1">Status</Label>
                <Select 
                  value={formData.status}
                  onValueChange={(val) => handleInputChange('status', val)}
                >
                    <SelectTrigger className="h-12 rounded-2xl bg-white dark:bg-white/5 border-slate-200 dark:border-white/10 shadow-sm">
                        <SelectValue placeholder="-- Escolha uma opção --" />
                    </SelectTrigger>
                    <SelectContent className="rounded-2xl border-slate-200 dark:border-white/10">
                        <SelectItem value="Ativo">Ativo</SelectItem>
                        <SelectItem value="Inativo">Inativo</SelectItem>
                    </SelectContent>
                </Select>
            </div>

            {/* Novo campo: Status de Assinatura (Exclusivo para Agregados/Rentals) */}
            {contractMode === 'agregado' && (
              <div className="space-y-2">
                <Label className="text-[10px] font-bold uppercase tracking-widest text-slate-400 ml-1">Status de Assinatura</Label>
                <Select 
                  value={formData.status_assinatura_form}
                  onValueChange={(val) => handleInputChange('status_assinatura_form', val)}
                >
                    <SelectTrigger className="h-12 rounded-2xl bg-white dark:bg-white/5 border-slate-200 dark:border-white/10 shadow-sm">
                        <SelectValue placeholder="-- Escolha uma opção --" />
                    </SelectTrigger>
                    <SelectContent className="rounded-2xl border-slate-200 dark:border-white/10">
                        <SelectItem value="Assinado">Assinado</SelectItem>
                        <SelectItem value="Não Assinado">Não Assinado</SelectItem>
                    </SelectContent>
                </Select>
              </div>
            )}

            {/* Data de Admissão - Visível em Frota Fixa OU se status de assinatura for "Assinado" */}
            {(contractMode === 'frota-fixa' || formData.status_assinatura_form === 'Assinado') && (
            <div className="space-y-2">
                <Label className="text-[10px] font-bold uppercase tracking-widest text-slate-400 ml-1">Data de Admissão</Label>
                <Input 
                  type="date" 
                  value={formData.data_admissao}
                  onChange={(e) => handleInputChange('data_admissao', e.target.value)}
                  className="h-12 rounded-2xl bg-white dark:bg-white/5 border-slate-200 dark:border-white/10 px-4 shadow-sm" 
                  required
                />
            </div>
            )}

            {selectedItem?.tipo_contract && (
            <div className="space-y-2">
                <Label className="text-[10px] font-bold uppercase tracking-widest text-slate-400 ml-1">Data de Demissão</Label>
                <Input 
                  type="date" 
                  value={formData.data_demissao}
                  onChange={(e) => handleInputChange('data_demissao', e.target.value)}
                  className="h-12 rounded-2xl bg-white dark:bg-white/5 border-slate-200 dark:border-white/10 px-4 shadow-sm" 
                />
            </div>
            )}
        </form>
      </GrFormSidebar>
    </div>
  );
};

export default ContractsView;
