diff --git a/src/app/DRE/analitico.tsx b/src/app/DRE/analitico.tsx
index 7cfe582..9cebc5e 100644
--- a/src/app/DRE/analitico.tsx
+++ b/src/app/DRE/analitico.tsx
@@ -1,50 +1,63 @@
-"use client";
+'use client';
 
-import * as React from "react";
-import { DataGridPremium, GridToolbar, GridColDef, GridFilterModel } from "@mui/x-data-grid-premium";
+import { Button } from '@/components/ui/button';
+import { Card, CardContent } from '@/components/ui/card';
+import { Checkbox } from '@/components/ui/checkbox';
+import {
+  Dialog,
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from '@/components/ui/dialog';
+import {
+  Drawer,
+  DrawerClose,
+  DrawerContent,
+  DrawerDescription,
+  DrawerHeader,
+  DrawerTitle,
+  DrawerTrigger,
+} from '@/components/ui/drawer';
+import { Input } from '@/components/ui/input';
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from '@/components/ui/select';
+import {
+  DataGridPremium,
+  GridColDef,
+  GridToolbar,
+} from '@mui/x-data-grid-premium';
 import { LicenseInfo } from '@mui/x-license-pro';
+import {
+  ArrowDown,
+  ArrowUp,
+  ArrowUpDown,
+  Download,
+  Maximize2,
+  Minimize2,
+  Search,
+  X,
+} from 'lucide-react';
+import * as React from 'react';
+import * as XLSX from 'xlsx';
 
 // Garantir que a licença seja aplicada no componente
 if (typeof window !== 'undefined') {
   try {
-    const PERPETUAL_LICENSE_KEY = 'e0d9bb8070ce0054c9d9ecb6e82cb58fTz0wLEU9MzI0NzIxNDQwMDAwMDAsUz1wcmVtaXVtLExNPXBlcnBldHVhbCxLVj0y';
+    const PERPETUAL_LICENSE_KEY =
+      'e0d9bb8070ce0054c9d9ecb6e82cb58fTz0wLEU9MzI0NzIxNDQwMDAwMDAsUz1wcmVtaXVtLExNPXBlcnBldHVhbCxLVj0y';
     LicenseInfo.setLicenseKey(PERPETUAL_LICENSE_KEY);
     console.log('✅ Licença MUI X aplicada no componente Analítico');
   } catch (error) {
     console.warn('⚠️ Erro ao aplicar licença no componente:', error);
   }
 }
-import { Card, CardContent } from "@/components/ui/card";
-import { Button } from "@/components/ui/button";
-import { Input } from "@/components/ui/input";
-import {
-  Dialog,
-  DialogContent,
-  DialogHeader,
-  DialogTitle,
-  DialogFooter,
-  DialogTrigger,
-} from "@/components/ui/dialog";
-import {
-  Select,
-  SelectTrigger,
-  SelectValue,
-  SelectContent,
-  SelectItem,
-} from "@/components/ui/select";
-import { Checkbox } from "@/components/ui/checkbox";
-import {
-  Drawer,
-  DrawerClose,
-  DrawerContent,
-  DrawerDescription,
-  DrawerFooter,
-  DrawerHeader,
-  DrawerTitle,
-  DrawerTrigger,
-} from "@/components/ui/drawer";
-import { Download, Filter, X, Search, ArrowUpDown, ArrowUp, ArrowDown, Maximize2, Minimize2 } from "lucide-react";
-import * as XLSX from "xlsx";
 
 interface AnaliticoItem {
   codigo_grupo: string;
@@ -119,8 +132,9 @@ const ExcelFilter: React.FC<ExcelFilterProps> = ({
   currentSort = null,
 }) => {
   const [isOpen, setIsOpen] = React.useState(false);
-  const [searchTerm, setSearchTerm] = React.useState("");
-  const [selectedValues, setSelectedValues] = React.useState<string[]>(currentFilter);
+  const [searchTerm, setSearchTerm] = React.useState('');
+  const [selectedValues, setSelectedValues] =
+    React.useState<string[]>(currentFilter);
   const [selectAll, setSelectAll] = React.useState(false);
 
   // Sincronizar selectedValues com currentFilter quando ele mudar
@@ -133,10 +147,12 @@ const ExcelFilter: React.FC<ExcelFilterProps> = ({
     const values = filteredData
       .map((row) => {
         const value = row[column.field];
-        if (value === null || value === undefined) return "";
+        if (value === null || value === undefined) return '';
         return String(value);
       })
-      .filter((value, index, self) => self.indexOf(value) === index && value !== "")
+      .filter(
+        (value, index, self) => self.indexOf(value) === index && value !== ''
+      )
       .sort();
 
     return values;
@@ -168,7 +184,9 @@ const ExcelFilter: React.FC<ExcelFilterProps> = ({
       newValues = selectedValues.filter((v) => v !== value);
     }
     setSelectedValues(newValues);
-    setSelectAll(newValues.length === filteredValues.length && filteredValues.length > 0);
+    setSelectAll(
+      newValues.length === filteredValues.length && filteredValues.length > 0
+    );
   };
 
   const handleApply = () => {
@@ -206,7 +224,7 @@ const ExcelFilter: React.FC<ExcelFilterProps> = ({
             Filtrar por "{column.headerName}"
           </DialogTitle>
         </DialogHeader>
-        
+
         <div className="space-y-4">
           {/* Opções de ordenação */}
           <div className="space-y-2">
@@ -218,8 +236,7 @@ const ExcelFilter: React.FC<ExcelFilterProps> = ({
                 className="h-8 text-xs"
                 onClick={() => handleSort('asc')}
               >
-                <ArrowUp className="h-3 w-3 mr-1" />
-                A a Z
+                <ArrowUp className="h-3 w-3 mr-1" />A a Z
               </Button>
               <Button
                 variant="ghost"
@@ -227,8 +244,7 @@ const ExcelFilter: React.FC<ExcelFilterProps> = ({
                 className="h-8 text-xs"
                 onClick={() => handleSort('desc')}
               >
-                <ArrowDown className="h-3 w-3 mr-1" />
-                Z a A
+                <ArrowDown className="h-3 w-3 mr-1" />Z a A
               </Button>
             </div>
           </div>
@@ -269,13 +285,15 @@ const ExcelFilter: React.FC<ExcelFilterProps> = ({
                   (Selecionar Tudo)
                 </label>
               </div>
-              
+
               {filteredValues.map((value) => (
                 <div key={value} className="flex items-center space-x-2 py-1">
                   <Checkbox
                     id={`value-${value}`}
                     checked={selectedValues.includes(value)}
-                    onCheckedChange={(checked: boolean) => handleValueToggle(value, checked)}
+                    onCheckedChange={(checked: boolean) =>
+                      handleValueToggle(value, checked)
+                    }
                   />
                   <label htmlFor={`value-${value}`} className="text-sm">
                     {value}
@@ -287,7 +305,11 @@ const ExcelFilter: React.FC<ExcelFilterProps> = ({
 
           {/* Botões de ação */}
           <DialogFooter className="flex space-x-2">
-            <Button variant="outline" size="sm" onClick={() => setIsOpen(false)}>
+            <Button
+              variant="outline"
+              size="sm"
+              onClick={() => setIsOpen(false)}
+            >
               Cancelar
             </Button>
             <Button size="sm" onClick={handleApply}>
@@ -303,48 +325,55 @@ const ExcelFilter: React.FC<ExcelFilterProps> = ({
 export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
   const [data, setData] = React.useState<AnaliticoItem[]>([]);
   const [loading, setLoading] = React.useState(false);
-  const [globalFilter, setGlobalFilter] = React.useState("");
+  const [globalFilter, setGlobalFilter] = React.useState('');
   const [open, setOpen] = React.useState(false);
   const [drawerOpen, setDrawerOpen] = React.useState(false);
-  const [columnFilters, setColumnFilters] = React.useState<Record<string, string[]>>({});
-  const [columnSorts, setColumnSorts] = React.useState<Record<string, 'asc' | 'desc' | null>>({});
+  const [columnFilters, setColumnFilters] = React.useState<
+    Record<string, string[]>
+  >({});
+  const [columnSorts, setColumnSorts] = React.useState<
+    Record<string, 'asc' | 'desc' | null>
+  >({});
   const [conditions, setConditions] = React.useState([
-    { column: "", operator: "contains", value: "" },
+    { column: '', operator: 'contains', value: '' },
   ]);
-  
-  // Estados para o card de agregação customizado (simplificado)
-  const [aggregationCardRef, setAggregationCardRef] = React.useState<HTMLDivElement | null>(null);
-  
+
   // Estado para armazenar filtros externos (vindos do teste.tsx)
   const [filtrosExternos, setFiltrosExternos] = React.useState(filtros);
 
   // Funções para gerenciar filtros customizados
-  const handleColumnFilterChange = React.useCallback((field: string, values: string[]) => {
-    setColumnFilters(prev => ({
-      ...prev,
-      [field]: values
-    }));
-  }, []);
+  const handleColumnFilterChange = React.useCallback(
+    (field: string, values: string[]) => {
+      setColumnFilters((prev) => ({
+        ...prev,
+        [field]: values,
+      }));
+    },
+    []
+  );
 
-  const handleColumnSortChange = React.useCallback((field: string, direction: 'asc' | 'desc' | null) => {
-    setColumnSorts(prev => ({
-      ...prev,
-      [field]: direction
-    }));
-  }, []);
+  const handleColumnSortChange = React.useCallback(
+    (field: string, direction: 'asc' | 'desc' | null) => {
+      setColumnSorts((prev) => ({
+        ...prev,
+        [field]: direction,
+      }));
+    },
+    []
+  );
 
   // Função para contar filtros aplicados (apenas filtros internos do modal customizado)
   const getFilterCount = React.useCallback(() => {
     let count = 0;
-    
+
     // Contar filtros de coluna (filtros do modal customizado)
     count += Object.keys(columnFilters).length;
-    
+
     // Contar filtro global (se aplicável)
-    if (globalFilter && globalFilter.trim() !== "") {
+    if (globalFilter && globalFilter.trim() !== '') {
       count += 1;
     }
-    
+
     return count;
   }, [columnFilters, globalFilter]);
 
@@ -352,7 +381,7 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
   const clearAllFilters = React.useCallback(() => {
     setColumnFilters({});
     setColumnSorts({});
-    setGlobalFilter("");
+    setGlobalFilter('');
   }, []);
 
   // Atualizar filtros externos quando os props mudarem
@@ -365,7 +394,7 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
   const fetchData = React.useCallback(async () => {
     console.log('🔄 Analítico - fetchData chamado');
     console.log('📋 Filtros externos recebidos:', filtrosExternos);
-    
+
     if (!filtrosExternos.dataInicio || !filtrosExternos.dataFim) {
       console.log('⚠️ Sem dataInicio ou dataFim, limpando dados');
       setData([]);
@@ -375,7 +404,7 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
     setLoading(true);
     try {
       const params = new URLSearchParams();
-      
+
       if (filtrosExternos.dataInicio) {
         params.append('dataInicio', filtrosExternos.dataInicio);
       }
@@ -398,15 +427,21 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
         params.append('excluirCodigoConta', filtrosExternos.excluirCodigoConta);
       }
       if (filtrosExternos.codigosCentrosCustoSelecionados) {
-        params.append('codigosCentrosCustoSelecionados', filtrosExternos.codigosCentrosCustoSelecionados);
+        params.append(
+          'codigosCentrosCustoSelecionados',
+          filtrosExternos.codigosCentrosCustoSelecionados
+        );
       }
       if (filtrosExternos.codigosContasSelecionadas) {
-        params.append('codigosContasSelecionadas', filtrosExternos.codigosContasSelecionadas);
+        params.append(
+          'codigosContasSelecionadas',
+          filtrosExternos.codigosContasSelecionadas
+        );
       }
 
       const url = `/api/analitico-oracle?${params.toString()}`;
       console.log('🌐 Fazendo requisição para:', url);
-      
+
       const response = await fetch(url);
       if (response.ok) {
         const result = await response.json();
@@ -422,14 +457,14 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
           tipo_parceiro: result[0]?.tipo_parceiro,
           centro_custo: result[0]?.centro_custo,
           valor: result[0]?.valor,
-          tipo_valor: typeof result[0]?.valor
+          tipo_valor: typeof result[0]?.valor,
         });
         setData(result as AnaliticoItem[]);
       } else {
-        console.error("❌ Erro ao buscar dados:", await response.text());
+        console.error('❌ Erro ao buscar dados:', await response.text());
       }
     } catch (error) {
-      console.error("❌ Erro ao buscar dados:", error);
+      console.error('❌ Erro ao buscar dados:', error);
     } finally {
       setLoading(false);
     }
@@ -443,64 +478,84 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
   const filteredData = React.useMemo(() => {
     if (!data || data.length === 0) return data;
 
-    return data.filter((row) => {
-      return Object.entries(columnFilters).every(([field, filterValues]) => {
-        if (!filterValues || filterValues.length === 0) return true;
-        
-        const cellValue = (row as any)[field];
-        const stringValue = cellValue === null || cellValue === undefined ? "" : String(cellValue);
-        
-        return filterValues.includes(stringValue);
-      });
-    }).map((row, index) => ({
-      ...row,
-      id: `filtered-${row.id || row.recnum || index}` // Garantir ID único e estável
-    }));
+    return data
+      .filter((row) => {
+        return Object.entries(columnFilters).every(([field, filterValues]) => {
+          if (!filterValues || filterValues.length === 0) return true;
+
+          const cellValue = (row as any)[field];
+          const stringValue =
+            cellValue === null || cellValue === undefined
+              ? ''
+              : String(cellValue);
+
+          return filterValues.includes(stringValue);
+        });
+      })
+      .map((row, index) => ({
+        ...row,
+        id: `filtered-${row.id || row.recnum || index}`, // Garantir ID único e estável
+      }));
   }, [data, columnFilters]);
 
   // Função para renderizar header com filtro Excel
-  const renderHeaderWithFilter = React.useCallback((column: GridColDef) => {
-    return (params: any) => (
-      <div className="flex items-center justify-between w-full">
-        <span className="text-sm font-medium">{column.headerName}</span>
-        <div className="flex items-center">
-          <ExcelFilter
-            column={column}
-            data={data}
-            filteredData={filteredData}
-            onFilterChange={handleColumnFilterChange}
-            onSortChange={handleColumnSortChange}
-            currentFilter={columnFilters[column.field] || []}
-            currentSort={columnSorts[column.field] || null}
-          />
+  const renderHeaderWithFilter = React.useCallback(
+    (column: GridColDef) => {
+      return (params: any) => (
+        <div className="flex items-center justify-between w-full">
+          <span className="text-sm font-medium">{column.headerName}</span>
+          <div className="flex items-center">
+            <ExcelFilter
+              column={column}
+              data={data}
+              filteredData={filteredData}
+              onFilterChange={handleColumnFilterChange}
+              onSortChange={handleColumnSortChange}
+              currentFilter={columnFilters[column.field] || []}
+              currentSort={columnSorts[column.field] || null}
+            />
+          </div>
         </div>
-      </div>
-    );
-  }, [data, filteredData, columnFilters, columnSorts, handleColumnFilterChange, handleColumnSortChange]);
+      );
+    },
+    [
+      data,
+      filteredData,
+      columnFilters,
+      columnSorts,
+      handleColumnFilterChange,
+      handleColumnSortChange,
+    ]
+  );
 
   // Definir colunas do DataGridPro na ordem solicitada
   const columns = React.useMemo(() => {
     const dateCellRenderer = (params: any) => {
-          if (!params.value) return "-";
-          try {
-            return new Date(params.value).toLocaleDateString("pt-BR");
-          } catch (error) {
-            return params.value;
-          }
+      if (!params.value) return '-';
+      try {
+        return new Date(params.value).toLocaleDateString('pt-BR');
+      } catch (error) {
+        return params.value;
+      }
     };
 
     const currencyCellRenderer = (params: any, showZero: boolean = false) => {
       const value = params.value;
-      if (value === null || value === undefined || value === "") return "-";
-      if (!showZero && value === 0) return "-";
-      const numValue = typeof value === "string" ? parseFloat(value) : Number(value);
-      if (isNaN(numValue)) return "-";
-      const formatted = new Intl.NumberFormat("pt-BR", {
-        style: "currency",
-        currency: "BRL",
+      if (value === null || value === undefined || value === '') return '-';
+      if (!showZero && value === 0) return '-';
+      const numValue =
+        typeof value === 'string' ? parseFloat(value) : Number(value);
+      if (isNaN(numValue)) return '-';
+      const formatted = new Intl.NumberFormat('pt-BR', {
+        style: 'currency',
+        currency: 'BRL',
       }).format(numValue);
       return (
-        <span className={`text-sm font-semibold ${numValue < 0 ? "text-red-600" : "text-gray-900"}`}>
+        <span
+          className={`text-sm font-semibold ${
+            numValue < 0 ? 'text-red-600' : 'text-gray-900'
+          }`}
+        >
           {formatted}
         </span>
       );
@@ -508,174 +563,153 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
 
     const baseColumns = [
       {
-        field: "data_lancamento",
-        headerName: "Dt Lanc",
-        width: 120,
-        sortable: true,
-        resizable: true,
-        renderCell: dateCellRenderer,
-      },
-      {
-        field: "data_compensacao",
-        headerName: "Dt Comp",
-        width: 120,
-        sortable: true,
-        resizable: true,
-        renderCell: dateCellRenderer,
-      },
-      {
-        field: "data_vencimento",
-        headerName: "Dt Venc",
-        width: 120,
-        sortable: true,
-        resizable: true,
-        renderCell: dateCellRenderer,
-      },
-      {
-        field: "data_caixa",
-        headerName: "Dt Caixa",
-        width: 120,
-        sortable: true,
-        resizable: true,
-        renderCell: dateCellRenderer,
-      },
-      {
-        field: "data_pagto",
-        headerName: "Dt Pagto",
-        width: 120,
-        sortable: true,
-        resizable: true,
-        renderCell: dateCellRenderer,
-      },
-      {
-        field: "ano_mes_comp",
-        headerName: "Ano/Mês Comp",
+        field: 'ano_mes_comp',
+        headerName: 'Ano/Mês Comp',
         width: 110,
         sortable: true,
         resizable: true,
-        renderCell: (params: any) => params.value || "-",
+        renderCell: (params: any) => params.value || '-',
       },
       {
-        field: "entidade",
-        headerName: "Entidade",
+        field: 'numero_lancamento',
+        headerName: 'NumLanc',
         width: 100,
         sortable: true,
         resizable: true,
-        renderCell: (params: any) => params.value || "-",
+        renderCell: (params: any) => params.value || '-',
       },
       {
-        field: "tipo_parceiro",
-        headerName: "Tipo Parc",
-        width: 120,
+        field: 'data_lancamento',
+        headerName: 'Dt Lanc',
+        width: 95,
         sortable: true,
         resizable: true,
-        renderCell: (params: any) => params.value || "-",
+        renderCell: dateCellRenderer,
       },
       {
-        field: "codigo_fornecedor",
-        headerName: "Cod.Fornec",
-        width: 120,
+        field: 'data_vencimento',
+        headerName: 'Dt Venc',
+        width: 95,
         sortable: true,
         resizable: true,
+        renderCell: dateCellRenderer,
       },
       {
-        field: "nome_fornecedor",
-        headerName: "Fornecedor",
-        flex: 1,
-        minWidth: 200,
+        field: 'data_pagto',
+        headerName: 'Dt Pagto',
+        width: 95,
         sortable: true,
         resizable: true,
+        renderCell: dateCellRenderer,
       },
       {
-        field: "codigo_centrocusto",
-        headerName: "Cod.CC",
+        field: 'tipo_parceiro',
+        headerName: 'Tipo Parc',
+        width: 95,
+        sortable: true,
+        resizable: true,
+        renderCell: (params: any) => params.value || '-',
+      },
+      {
+        field: 'codigo_fornecedor',
+        headerName: 'Cod. Fornec',
         width: 100,
         sortable: true,
         resizable: true,
       },
       {
-        field: "centro_custo",
-        headerName: "Centro Custo",
-        flex: 1,
-        minWidth: 200,
+        field: 'nome_fornecedor',
+        headerName: 'Fornecedor',
+        width: 200,
         sortable: true,
         resizable: true,
-        renderCell: (params: any) => params.value || "-",
       },
       {
-        field: "codigo_conta",
-        headerName: "Cod.Conta",
+        field: 'valor',
+        headerName: 'Vl.Realizado',
+        type: 'number' as const,
         width: 120,
         sortable: true,
         resizable: true,
-      },
-      {
-        field: "conta",
-        headerName: "Conta",
-        flex: 1,
-        minWidth: 180,
-        sortable: true,
-        resizable: true,
-      },
-        {
-          field: "valor",
-          headerName: "Vl.Realizado",
-          type: "number" as const,
-          width: 140,
-          sortable: true,
-          resizable: true,
         renderCell: (params: any) => currencyCellRenderer(params, true),
-      },
-        {
-          field: "valor_previsto",
-          headerName: "Vl.Previsto",
-          type: "number" as const,
-          width: 130,
-          sortable: true,
-          resizable: true,
-        renderCell: (params: any) => currencyCellRenderer(params, false),
-      },
-        {
-          field: "valor_confirmado",
-          headerName: "Vl.Confirmado",
-          type: "number" as const,
-          width: 140,
-          sortable: true,
-          resizable: true,
-        renderCell: (params: any) => currencyCellRenderer(params, false),
-      },
-        {
-          field: "valor_pago",
-          headerName: "Vl.Pago",
-          type: "number" as const,
-        width: 120,
-          sortable: true,
-          resizable: true,
-        renderCell: (params: any) => currencyCellRenderer(params, false),
       },
       {
-        field: "historico",
-        headerName: "Historico",
-        flex: 1,
-        minWidth: 250,
-        sortable: true,
-        resizable: true,
-      },
-      {
-        field: "historico2",
-        headerName: "Historico 2",
-        flex: 1,
-        minWidth: 300,
-        sortable: true,
-        resizable: true,
-      },
-      {
-        field: "numero_lancamento",
-        headerName: "Num.Lanc",
+        field: 'valor_pago',
+        headerName: 'Vl.Pago',
+        type: 'number' as const,
         width: 100,
         sortable: true,
         resizable: true,
-        renderCell: (params: any) => params.value || "-",
+        renderCell: (params: any) => currencyCellRenderer(params, false),
+      },
+      {
+        field: 'valor_previsto',
+        headerName: 'Vl.Pr',
+        type: 'number' as const,
+        width: 85,
+        sortable: true,
+        resizable: true,
+        renderCell: (params: any) => currencyCellRenderer(params, false),
+      },
+      {
+        field: 'valor_confirmado',
+        headerName: 'Vl.Confirmado',
+        type: 'number' as const,
+        width: 125,
+        sortable: true,
+        resizable: true,
+        renderCell: (params: any) => currencyCellRenderer(params, false),
+      },
+      {
+        field: 'entidade',
+        headerName: 'Entidade',
+        width: 90,
+        sortable: true,
+        resizable: true,
+        renderCell: (params: any) => params.value || '-',
+      },
+      {
+        field: 'codigo_conta',
+        headerName: 'Cod.Conta',
+        width: 100,
+        sortable: true,
+        resizable: true,
+      },
+      {
+        field: 'conta',
+        headerName: 'Conta',
+        width: 200,
+        sortable: true,
+        resizable: true,
+      },
+      {
+        field: 'codigo_centrocusto',
+        headerName: 'Cod.CC',
+        width: 90,
+        sortable: true,
+        resizable: true,
+      },
+      {
+        field: 'centro_custo',
+        headerName: 'Centro Custo',
+        width: 180,
+        sortable: true,
+        resizable: true,
+        renderCell: (params: any) => params.value || '-',
+      },
+      {
+        field: 'historico',
+        headerName: 'Histórico',
+        width: 250,
+        sortable: true,
+        resizable: true,
+      },
+      {
+        field: 'historico2',
+        headerName: 'Histórico 2',
+        width: 250,
+        sortable: true,
+        resizable: true,
       },
     ];
 
@@ -690,17 +724,21 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
   const sortedAndFilteredData = React.useMemo(() => {
     if (!filteredData || filteredData.length === 0) return filteredData;
 
-    const sortField = Object.keys(columnSorts).find(field => columnSorts[field] !== null);
+    const sortField = Object.keys(columnSorts).find(
+      (field) => columnSorts[field] !== null
+    );
     if (!sortField || !columnSorts[sortField]) return filteredData;
 
     return [...filteredData].sort((a, b) => {
       const aValue = (a as any)[sortField];
       const bValue = (b as any)[sortField];
-      
+
       // Converter para string para comparação
-      const aString = aValue === null || aValue === undefined ? "" : String(aValue);
-      const bString = bValue === null || bValue === undefined ? "" : String(bValue);
-      
+      const aString =
+        aValue === null || aValue === undefined ? '' : String(aValue);
+      const bString =
+        bValue === null || bValue === undefined ? '' : String(bValue);
+
       if (columnSorts[sortField] === 'asc') {
         return aString.localeCompare(bString);
       } else {
@@ -711,17 +749,10 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
 
   // Calcular valor total dos dados filtrados
   const valorTotal = React.useMemo(() => {
-    return sortedAndFilteredData.reduce((sum, item) => sum + (Number(item.valor) || 0), 0);
-  }, [sortedAndFilteredData]);
-
-  // Calcular totais das colunas de valor para o card de agregação
-  const columnTotals = React.useMemo(() => {
-    return {
-      valor: sortedAndFilteredData.reduce((sum, item) => sum + (Number(item.valor) || 0), 0),
-      valor_previsto: sortedAndFilteredData.reduce((sum, item) => sum + (Number(item.valor_previsto) || 0), 0),
-      valor_confirmado: sortedAndFilteredData.reduce((sum, item) => sum + (Number(item.valor_confirmado) || 0), 0),
-      valor_pago: sortedAndFilteredData.reduce((sum, item) => sum + (Number(item.valor_pago) || 0), 0),
-    };
+    return sortedAndFilteredData.reduce(
+      (sum, item) => sum + (Number(item.valor) || 0),
+      0
+    );
   }, [sortedAndFilteredData]);
 
   // Limpar filtros de colunas que não têm mais valores disponíveis
@@ -729,20 +760,22 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
     const updatedFilters = { ...columnFilters };
     let hasChanges = false;
 
-    Object.keys(columnFilters).forEach(field => {
+    Object.keys(columnFilters).forEach((field) => {
       const currentFilterValues = columnFilters[field] || [];
       if (currentFilterValues.length === 0) return;
 
       // Obter valores únicos disponíveis para esta coluna nos dados filtrados
       const availableValues = filteredData
-        .map(row => {
+        .map((row) => {
           const value = (row as any)[field];
-          return value === null || value === undefined ? "" : String(value);
+          return value === null || value === undefined ? '' : String(value);
         })
-        .filter((value, index, self) => self.indexOf(value) === index && value !== "");
+        .filter(
+          (value, index, self) => self.indexOf(value) === index && value !== ''
+        );
 
       // Filtrar apenas os valores que ainda estão disponíveis
-      const validFilterValues = currentFilterValues.filter(value => 
+      const validFilterValues = currentFilterValues.filter((value) =>
         availableValues.includes(value)
       );
 
@@ -761,59 +794,176 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
     }
   }, [filteredData, columnFilters]);
 
-  // Exportação XLSX
+  // Exportação XLSX - Exporta exatamente as colunas e valores da grid
   const exportToExcel = () => {
     if (sortedAndFilteredData.length === 0) return;
 
-    const exportData = sortedAndFilteredData.map((item) => ({
-      "DTLANC": item.data_lancamento
-        ? new Date(item.data_lancamento).toLocaleDateString("pt-BR")
-        : "-",
-      "DTCOMPENSACAO": item.data_compensacao
-        ? new Date(item.data_compensacao).toLocaleDateString("pt-BR")
-        : "-",
-      "DTVENC": item.data_vencimento
-        ? new Date(item.data_vencimento).toLocaleDateString("pt-BR")
-        : "-",
-      "DTCAIXA": item.data_caixa
-        ? new Date(item.data_caixa).toLocaleDateString("pt-BR")
-        : "-",
-      "DTPAGTO": item.data_pagto
-        ? new Date(item.data_pagto).toLocaleDateString("pt-BR")
-        : "-",
-      "ANOMESCOMP": item.ano_mes_comp || "-",
-      "ENTIDADE": item.entidade || "-",
-      "TIPOPARCEIRO": item.tipo_parceiro || "-",
-      "CODFORNEC": item.codigo_fornecedor || "-",
-      "FORNECEDOR": item.nome_fornecedor || "-",
-      "CODIGOCENTROCUSTO": item.codigo_centrocusto || "-",
-      "CENTROCUSTO": item.centro_custo || "-",
-      "CODCONTA": item.codigo_conta || "-",
-      "CONTA": item.conta || "-",
-      "VLREALIZADO": typeof item.valor === "string" ? parseFloat(item.valor) : (item.valor || 0),
-      "VLPREVISTO": typeof item.valor_previsto === "string" ? parseFloat(item.valor_previsto) : (item.valor_previsto || 0),
-      "VLCONFIRMADO": typeof item.valor_confirmado === "string" ? parseFloat(item.valor_confirmado) : (item.valor_confirmado || 0),
-      "VLPAGO": typeof item.valor_pago === "string" ? parseFloat(item.valor_pago) : (item.valor_pago || 0),
-      "HISTORICO": item.historico || "-",
-      "HISTORICO2": item.historico2 || "-",
-      "NUMLANC": item.numero_lancamento || "-",
-    }));
+    // Funções auxiliares para formatar valores exatamente como na grid
+    const formatDateValue = (value: any): string => {
+      if (!value) return '-';
+      try {
+        return new Date(value).toLocaleDateString('pt-BR');
+      } catch (error) {
+        return value;
+      }
+    };
+
+    const formatCurrencyValue = (
+      value: any,
+      showZero: boolean = false
+    ): string | number => {
+      if (value === null || value === undefined || value === '') return '-';
+      const numValue =
+        typeof value === 'string' ? parseFloat(value) : Number(value);
+      if (isNaN(numValue)) return '-';
+      if (!showZero && numValue === 0) return '-';
+      // Para Excel, retornar o número formatado como string (mantém o formato de moeda)
+      return new Intl.NumberFormat('pt-BR', {
+        style: 'currency',
+        currency: 'BRL',
+      }).format(numValue);
+    };
+
+    const formatCellValue = (column: GridColDef, item: any): any => {
+      const value = item[column.field];
+
+      // Se a coluna tem renderCell, aplicar a mesma lógica
+      if (column.renderCell) {
+        // Para datas
+        if (column.field.includes('data_')) {
+          return formatDateValue(value);
+        }
+
+        // Para valores monetários
+        if (column.field === 'valor') {
+          return formatCurrencyValue(value, true);
+        }
+        if (
+          column.field === 'valor_previsto' ||
+          column.field === 'valor_confirmado' ||
+          column.field === 'valor_pago'
+        ) {
+          return formatCurrencyValue(value, false);
+        }
+
+        // Para campos que retornam "-" se vazios
+        if (
+          column.field === 'centro_custo' ||
+          column.field === 'entidade' ||
+          column.field === 'tipo_parceiro' ||
+          column.field === 'ano_mes_comp' ||
+          column.field === 'numero_lancamento'
+        ) {
+          return value || '-';
+        }
+      }
+
+      // Para datas sem renderCell explícito (mas que são datas)
+      if (column.field.includes('data_')) {
+        return formatDateValue(value);
+      }
+
+      // Valor padrão
+      return value ?? '';
+    };
+
+    // Criar dados de exportação usando as colunas da grid na ordem exata
+    // e depois adicionar os campos faltantes da interface
+    const exportData = sortedAndFilteredData.map((item) => {
+      const row: Record<string, any> = {};
+
+      // Primeiro: adicionar as colunas da grid na ordem exata
+      columns.forEach((column) => {
+        const headerName = column.headerName || column.field;
+        row[headerName] = formatCellValue(column, item);
+      });
+
+      // Segundo: adicionar colunas que devem ser exportadas mas não exibidas na grid
+      const colunasOcultas: Array<{
+        field: string;
+        label: string;
+        format?: (value: any) => any;
+      }> = [
+        {
+          field: 'data_compensacao',
+          label: 'Dt Comp',
+          format: formatDateValue,
+        },
+        {
+          field: 'data_caixa',
+          label: 'Dt Caixa',
+          format: formatDateValue,
+        },
+      ];
+
+      colunasOcultas.forEach(({ field, label, format }) => {
+        const value = (item as any)[field];
+        if (value !== undefined && value !== null) {
+          row[label] = format ? format(value) : value;
+        } else {
+          row[label] = '-';
+        }
+      });
+
+      // Terceiro: adicionar campos faltantes da interface que não estão na grid
+      const camposFaltantes: Array<{
+        field: string;
+        label: string;
+        format?: (value: any) => any;
+      }> = [
+        { field: 'codigo_grupo', label: 'Código Grupo' },
+        { field: 'codigo_subgrupo', label: 'Código Subgrupo' },
+        { field: 'codfilial', label: 'Código Filial' },
+        { field: 'recnum', label: 'Recnum' },
+        {
+          field: 'data_competencia',
+          label: 'Data Competência',
+          format: formatDateValue,
+        },
+        {
+          field: 'data_pagamento',
+          label: 'Data Pagamento',
+          format: formatDateValue,
+        },
+        { field: 'created_at', label: 'Criado Em', format: formatDateValue },
+        {
+          field: 'updated_at',
+          label: 'Atualizado Em',
+          format: formatDateValue,
+        },
+        { field: 'codgrupo', label: 'Cod Grupo' },
+      ];
+
+      camposFaltantes.forEach(({ field, label, format }) => {
+        const value = (item as any)[field];
+        if (value !== undefined && value !== null) {
+          row[label] = format ? format(value) : value;
+        } else {
+          row[label] = '';
+        }
+      });
+
+      return row;
+    });
 
     const wb = XLSX.utils.book_new();
     const ws = XLSX.utils.json_to_sheet(exportData);
 
     const resumoData = [
-      { Métrica: "Total de Registros", Valor: sortedAndFilteredData.length },
-      { Métrica: "Valor Total", Valor: valorTotal },
-      { Métrica: "Filtros Aplicados", Valor: Object.keys(columnFilters).length > 0 ? "Sim" : "Não" },
+      { Métrica: 'Total de Registros', Valor: sortedAndFilteredData.length },
+      { Métrica: 'Valor Total', Valor: valorTotal },
+      {
+        Métrica: 'Filtros Aplicados',
+        Valor: Object.keys(columnFilters).length > 0 ? 'Sim' : 'Não',
+      },
     ];
     const wsResumo = XLSX.utils.json_to_sheet(resumoData);
 
-    XLSX.utils.book_append_sheet(wb, ws, "Dados Analíticos");
-    XLSX.utils.book_append_sheet(wb, wsResumo, "Resumo");
+    XLSX.utils.book_append_sheet(wb, ws, 'Dados Analíticos');
+    XLSX.utils.book_append_sheet(wb, wsResumo, 'Resumo');
 
     const now = new Date();
-    const timestamp = now.toISOString().slice(0, 19).replace(/:/g, "-");
+    const timestamp = now.toISOString().slice(0, 19).replace(/:/g, '-');
     const fileName = `analitico_${timestamp}.xlsx`;
 
     XLSX.writeFile(wb, fileName);
@@ -826,44 +976,51 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
   };
 
   const clearFilters = () => {
-    setConditions([{ column: "", operator: "contains", value: "" }]);
-    setGlobalFilter("");
+    setConditions([{ column: '', operator: 'contains', value: '' }]);
+    setGlobalFilter('');
   };
 
   // Função para renderizar o conteúdo principal do componente (reutilizável)
   const renderAnaliticoContent = (isMaximized: boolean = false) => {
-  return (
+    return (
       <>
         {/* Filtros Externos Ativos - Apenas quando maximizado */}
-        {isMaximized && (filtrosExternos.dataInicio || filtrosExternos.centroCusto || filtrosExternos.codigoGrupo || filtrosExternos.codigoConta) && (
-          <div className="flex items-center gap-2 mb-4">
-            <div className="w-2 h-2 bg-blue-500 rounded-full"></div>
-            <span className="text-sm font-medium text-blue-900">Filtros aplicados pela tabela DRE Gerencial:</span>
-            <div className="flex flex-wrap gap-2 text-xs text-blue-800">
-              {filtrosExternos.dataInicio && filtrosExternos.dataFim && (
-                <span className="px-2 py-1 bg-blue-100 rounded">
-                  Período: {filtrosExternos.dataInicio} a {filtrosExternos.dataFim}
-                </span>
-              )}
-              {filtrosExternos.centroCusto && (
-                <span className="px-2 py-1 bg-blue-100 rounded">
-                  Centro: {filtrosExternos.centroCusto}
-                </span>
-              )}
-              {filtrosExternos.codigoGrupo && (
-                <span className="px-2 py-1 bg-blue-100 rounded">
-                  Grupo: {filtrosExternos.codigoGrupo}
-                </span>
-              )}
-              {filtrosExternos.codigoConta && (
-                <span className="px-2 py-1 bg-blue-100 rounded">
-                  Conta: {filtrosExternos.codigoConta}
-                </span>
-              )}
+        {isMaximized &&
+          (filtrosExternos.dataInicio ||
+            filtrosExternos.centroCusto ||
+            filtrosExternos.codigoGrupo ||
+            filtrosExternos.codigoConta) && (
+            <div className="flex items-center gap-2 mb-4">
+              <div className="w-2 h-2 bg-blue-500 rounded-full"></div>
+              <span className="text-sm font-medium text-blue-900">
+                Filtros aplicados pela tabela DRE Gerencial:
+              </span>
+              <div className="flex flex-wrap gap-2 text-xs text-blue-800">
+                {filtrosExternos.dataInicio && filtrosExternos.dataFim && (
+                  <span className="px-2 py-1 bg-blue-100 rounded">
+                    Período: {filtrosExternos.dataInicio} a{' '}
+                    {filtrosExternos.dataFim}
+                  </span>
+                )}
+                {filtrosExternos.centroCusto && (
+                  <span className="px-2 py-1 bg-blue-100 rounded">
+                    Centro: {filtrosExternos.centroCusto}
+                  </span>
+                )}
+                {filtrosExternos.codigoGrupo && (
+                  <span className="px-2 py-1 bg-blue-100 rounded">
+                    Grupo: {filtrosExternos.codigoGrupo}
+                  </span>
+                )}
+                {filtrosExternos.codigoConta && (
+                  <span className="px-2 py-1 bg-blue-100 rounded">
+                    Conta: {filtrosExternos.codigoConta}
+                  </span>
+                )}
+              </div>
             </div>
-          </div>
-        )}
-          
+          )}
+
         {/* Controls - Apenas quando maximizado */}
         {isMaximized && (
           <div className="flex gap-2 flex-wrap mb-4">
@@ -896,304 +1053,185 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
           </div>
         )}
 
-      {/* DataGridPro */}
-        <Card className={`w-full shadow-lg rounded-2xl ${isMaximized ? 'h-[calc(96vh-280px)]' : 'h-[40vh]'}`} style={{ overflowAnchor: 'none' }}>
-        <CardContent className="p-4 h-full" style={{ overflowAnchor: 'none' }}>
-          <div className="flex items-center justify-between mb-3">
-            <div className="flex items-center gap-4">
-              <h2 className="text-lg font-semibold">
-                Total de Registros: <span className="text-blue-600">{sortedAndFilteredData.length}</span>
-              </h2>
-              <div className="text-sm text-gray-600">
-                Valor Total: <span className={`font-bold ${valorTotal < 0 ? 'text-red-600' : 'text-green-600'}`}>
-                  {new Intl.NumberFormat("pt-BR", {
-                    style: "currency",
-                    currency: "BRL",
+        {/* DataGridPro */}
+        <Card
+          className={`w-full shadow-lg rounded-2xl ${
+            isMaximized ? 'h-[calc(96vh-280px)]' : 'h-[40vh]'
+          }`}
+          style={{ overflowAnchor: 'none' }}
+        >
+          <CardContent
+            className="p-4 h-full"
+            style={{ overflowAnchor: 'none' }}
+          >
+            <div className="flex items-center gap-6 mb-3 pb-3 border-b border-gray-200">
+              <div className="text-sm font-medium text-gray-700">
+                <span className="font-semibold">Total de Registros:</span>{' '}
+                <span className="text-blue-600 font-bold">
+                  {sortedAndFilteredData.length}
+                </span>
+              </div>
+              <div className="text-sm font-medium text-gray-700">
+                <span className="font-semibold">Valor Total:</span>{' '}
+                <span
+                  className={`font-bold ${
+                    valorTotal < 0 ? 'text-red-600' : 'text-gray-900'
+                  }`}
+                >
+                  {new Intl.NumberFormat('pt-BR', {
+                    style: 'currency',
+                    currency: 'BRL',
                   }).format(valorTotal)}
                 </span>
+              </div>
             </div>
-          </div>
-        </div>
 
-            <div style={{ height: "calc(100% - 2rem)", width: "100%", position: "relative", display: "flex", flexDirection: "column" }}>
-            <DataGridPremium
-              key={`datagrid-${sortedAndFilteredData.length}-${Object.keys(columnFilters).length}`}
-              rows={sortedAndFilteredData}
-              columns={columns}
-              loading={loading}
-              disableRowSelectionOnClick
-              density="compact"
-              slots={{ toolbar: GridToolbar }}
-              disableColumnMenu={true}
-              disableColumnSorting={true}
-              pagination={false}
-              disableVirtualization={false}
-              getRowId={(row: any) => row.id || `row-${row.recnum || Math.random()}`}
-              sx={{
-                overflowAnchor: 'none',
-                  height: "100%",
-                  display: "flex",
-                  flexDirection: "column",
-                  "& .MuiDataGrid-root": {
-                    display: "flex",
-                    flexDirection: "column",
-                    height: "100%",
-                    flex: 1,
-                    overflow: "hidden",
-                  },
-                  "& .MuiDataGrid-main": {
-                    overflow: "hidden !important",
-                    position: "relative",
-                    height: "100%",
-                    display: "flex",
-                    flexDirection: "column",
-                    flex: 1,
-                  },
-                  // Container dos headers - DEVE FICAR FIXO (não rola)
-                  "& .MuiDataGrid-container--top": {
-                    overflow: "hidden !important",
-                    position: "relative",
-                    zIndex: 100,
-                  backgroundColor: "#f9fafb",
-                    flexShrink: 0,
-                    flexGrow: 0,
-                  },
-                  "& .MuiDataGrid-columnHeaders": {
-                    position: "relative !important",
-                    backgroundColor: "#f9fafb !important",
-                    zIndex: 100,
-                  borderBottom: "1px solid #e5e7eb",
-                },
-                  "& .MuiDataGrid-columnHeader": {
-                    backgroundColor: "#f9fafb !important",
-                  },
-                  "& .MuiDataGrid-columnHeaderRow": {
-                    backgroundColor: "#f9fafb !important",
-                  },
-                  "& .MuiDataGrid-columnHeadersInner": {
-                    backgroundColor: "#f9fafb !important",
-                  },
-                "& .MuiDataGrid-cell": { 
-                  borderBottom: "1px solid #f0f0f0",
-                  fontSize: "0.875rem",
-                },
-                  // Container do virtualScroller - deve ter scroll e ocupar espaço restante
-                  "& .MuiDataGrid-container--bottom": {
-                    flex: 1,
-                    overflow: "hidden !important",
-                    position: "relative",
-                    minHeight: 0,
-                    display: "flex",
-                    flexDirection: "column",
-                  },
-                  // Apenas o virtualScroller deve ter scroll
-                "& .MuiDataGrid-virtualScroller": { 
-                    overflowY: "auto !important",
-                    overflowX: "auto !important",
-                    height: "100% !important",
-                    flex: 1,
-                    overflowAnchor: 'none',
-                    // Garantir que a barra de scroll seja visível
-                    scrollbarWidth: "thin",
-                    "&::-webkit-scrollbar": {
-                      height: "8px",
-                      width: "8px",
-                    },
-                    "&::-webkit-scrollbar-track": {
-                      background: "#f1f1f1",
-                    },
-                    "&::-webkit-scrollbar-thumb": {
-                      background: "#888",
-                      borderRadius: "4px",
-                    },
-                    "&::-webkit-scrollbar-thumb:hover": {
-                      background: "#555",
-                    },
-                  },
-                  "& .MuiDataGrid-virtualScrollerContent": {
-                    minWidth: "max-content",
-                  },
-                  "& .MuiDataGrid-row": {
-                    minWidth: "max-content",
-                },
-                "& .MuiDataGrid-toolbarContainer": {
-                  backgroundColor: "#f8fafc",
-                  borderBottom: "1px solid #e5e7eb",
-                  padding: "8px 16px",
-                },
-                  "& .MuiDataGrid-scrollbar": {
-                    display: "none",
-                  },
-                // Ocultar todos os ícones nativos das colunas
-                "& .MuiDataGrid-columnHeaderMenuContainer": {
-                  display: "none !important",
-                },
-                "& .MuiDataGrid-columnHeaderMenuButton": {
-                  display: "none !important",
-                },
-                "& .MuiDataGrid-columnHeaderSortIcon": {
-                  display: "none !important",
-                },
-                "& .MuiDataGrid-columnHeaderSortIconContainer": {
-                  display: "none !important",
-                },
-                "& .MuiDataGrid-iconButtonContainer": {
-                  display: "none !important",
-                },
-                "& .MuiDataGrid-columnHeaderSeparator": {
-                  display: "none !important",
-                },
-                "& .MuiDataGrid-columnHeaderSortButton": {
-                  display: "none !important",
-                },
-                // Ocultar qualquer ícone de menu adicional
-                "& .MuiDataGrid-menuIcon": {
-                  display: "none !important",
-                },
-                "& .MuiDataGrid-menuIconButton": {
-                  display: "none !important",
-                },
-                "& .MuiDataGrid-columnHeaderMenuIcon": {
-                  display: "none !important",
-                },
-                "& .MuiDataGrid-columnHeaderMenuIconButton": {
-                  display: "none !important",
-                },
-                "& .MuiDataGrid-menuContainer": {
-                  display: "none !important",
-                },
-                "& .MuiDataGrid-menu": {
-                  display: "none !important",
-                },
-                // Ocultar footer de paginação
-                "& .MuiDataGrid-footerContainer": {
-                  display: "none !important",
-                },
-                "& .MuiDataGrid-pagination": {
-                  display: "none !important",
-                },
-                "& .MuiTablePagination-root": {
-                  display: "none !important",
-                },
-                // Garantir que nosso botão customizado apareça
-                "& .MuiDataGrid-columnHeaderTitleContainer": {
-                  width: "100%",
-                  display: "flex",
-                  alignItems: "center",
-                  justifyContent: "space-between",
-                },
+            <div
+              style={{
+                height: 'calc(100% - 2rem)',
+                width: '100%',
+                position: 'relative',
               }}
-            />
-            
-              {/* Card de Agregação Customizado */}
-            {sortedAndFilteredData.length > 0 && (
-              <div
-                ref={setAggregationCardRef}
-                className="w-full bg-gray-50 border-t border-gray-200 sticky bottom-0 z-50 shadow-lg"
-                style={{ overflowAnchor: 'none' }}
-              >
-                <div className="px-4 py-3">
-                  <div className="flex items-center justify-between">
-                    <div className="flex items-center gap-6">
-                      <div className="text-sm font-medium text-gray-700">
-                        Vl.Realizado: 
-                        <span className={`ml-2 font-semibold ${columnTotals.valor < 0 ? 'text-red-600' : 'text-gray-900'}`}>
-                          {new Intl.NumberFormat("pt-BR", {
-                            style: "currency",
-                            currency: "BRL",
-                          }).format(columnTotals.valor)}
-                        </span>
+            >
+              <DataGridPremium
+                key={`datagrid-${sortedAndFilteredData.length}-${
+                  Object.keys(columnFilters).length
+                }`}
+                rows={sortedAndFilteredData}
+                columns={columns}
+                loading={loading}
+                disableRowSelectionOnClick
+                density="compact"
+                slots={{ toolbar: GridToolbar }}
+                disableColumnMenu={true}
+                disableColumnSorting={true}
+                pagination={false}
+                disableVirtualization={false}
+                getRowId={(row: any) =>
+                  row.id || `row-${row.recnum || Math.random()}`
+                }
+                sx={{
+                  height: '100%',
+                  width: '100%',
+                  '& .MuiDataGrid-root': {
+                    border: 'none',
+                  },
+                  '& .MuiDataGrid-columnHeaders': {
+                    backgroundColor: '#f9fafb',
+                    borderBottom: '1px solid #e5e7eb',
+                  },
+                  '& .MuiDataGrid-columnHeader': {
+                    backgroundColor: '#f9fafb !important',
+                    fontWeight: 600,
+                    fontSize: '0.875rem',
+                  },
+                  '& .MuiDataGrid-cell': {
+                    borderBottom: '1px solid #f0f0f0',
+                    fontSize: '0.875rem',
+                  },
+                  '& .MuiDataGrid-virtualScroller': {
+                    scrollbarWidth: 'thin',
+                    '&::-webkit-scrollbar': {
+                      width: '8px',
+                      height: '8px',
+                    },
+                    '&::-webkit-scrollbar-track': {
+                      background: '#f1f1f1',
+                    },
+                    '&::-webkit-scrollbar-thumb': {
+                      background: '#888',
+                      borderRadius: '4px',
+                    },
+                    '&::-webkit-scrollbar-thumb:hover': {
+                      background: '#555',
+                    },
+                  },
+                  '& .MuiDataGrid-toolbarContainer': {
+                    backgroundColor: '#f8fafc',
+                    borderBottom: '1px solid #e5e7eb',
+                    padding: '8px 16px',
+                  },
+                  '& .MuiDataGrid-columnHeaderMenuContainer': {
+                    display: 'none !important',
+                  },
+                  '& .MuiDataGrid-columnHeaderMenuButton': {
+                    display: 'none !important',
+                  },
+                  '& .MuiDataGrid-columnHeaderSortIcon': {
+                    display: 'none !important',
+                  },
+                  '& .MuiDataGrid-footerContainer': {
+                    display: 'none !important',
+                  },
+                  '& .MuiDataGrid-columnHeaderTitleContainer': {
+                    width: '100%',
+                    display: 'flex',
+                    alignItems: 'center',
+                    justifyContent: 'space-between',
+                  },
+                }}
+              />
             </div>
-                      
-                      <div className="text-sm font-medium text-gray-700">
-                        Vl.Previsto: 
-                        <span className={`ml-2 font-semibold ${columnTotals.valor_previsto < 0 ? 'text-red-600' : 'text-gray-900'}`}>
-                          {new Intl.NumberFormat("pt-BR", {
-                            style: "currency",
-                            currency: "BRL",
-                          }).format(columnTotals.valor_previsto)}
-                        </span>
-            </div>
-                      
-                      <div className="text-sm font-medium text-gray-700">
-                        Vl.Confirmado: 
-                        <span className={`ml-2 font-semibold ${columnTotals.valor_confirmado < 0 ? 'text-red-600' : 'text-gray-900'}`}>
-                          {new Intl.NumberFormat("pt-BR", {
-                            style: "currency",
-                            currency: "BRL",
-                          }).format(columnTotals.valor_confirmado)}
-                        </span>
-                </div>
-                      
-                      <div className="text-sm font-medium text-gray-700">
-                        Vl.Pago: 
-                        <span className={`ml-2 font-semibold ${columnTotals.valor_pago < 0 ? 'text-red-600' : 'text-gray-900'}`}>
-                          {new Intl.NumberFormat("pt-BR", {
-                            style: "currency",
-                            currency: "BRL",
-                          }).format(columnTotals.valor_pago)}
-                        </span>
-                </div>
-                </div>
-                    
-                    <div className="text-sm text-gray-500">
-                      Total de Registros: <span className="font-semibold text-blue-600">{sortedAndFilteredData.length}</span>
-                </div>
-                </div>
-                </div>
-                </div>
-            )}
-                </div>
-        </CardContent>
-      </Card>
+          </CardContent>
+        </Card>
       </>
     );
   };
 
   return (
-    <div className="w-full max-w-none mx-auto p-2" style={{ overflowAnchor: 'none' }}>
+    <div
+      className="w-full max-w-none mx-auto p-2"
+      style={{ overflowAnchor: 'none' }}
+    >
       {/* Header Section */}
       <div className="mb-2">
         <div className="flex items-center justify-between mb-1">
           <div>
             <h1 className="text-2xl font-bold text-gray-900">
-              Análise Analítica{filtros.linhaSelecionada ? ` - ${filtros.linhaSelecionada}` : ""}
+              Análise Analítica
+              {filtros.linhaSelecionada ? ` - ${filtros.linhaSelecionada}` : ''}
             </h1>
             <p className="text-sm text-gray-500">
               Relatório detalhado de transações
             </p>
-      </div>
+          </div>
 
           {/* Filtros Externos Ativos - Centralizado */}
-          {(filtrosExternos.dataInicio || filtrosExternos.centroCusto || filtrosExternos.codigoGrupo || filtrosExternos.codigoConta) && (
+          {(filtrosExternos.dataInicio ||
+            filtrosExternos.centroCusto ||
+            filtrosExternos.codigoGrupo ||
+            filtrosExternos.codigoConta) && (
             <div className="flex items-center gap-2">
               <div className="w-2 h-2 bg-blue-500 rounded-full"></div>
-              <span className="text-sm font-medium text-blue-900">Filtros aplicados pela tabela DRE Gerencial:</span>
+              <span className="text-sm font-medium text-blue-900">
+                Filtros aplicados pela tabela DRE Gerencial:
+              </span>
               <div className="flex flex-wrap gap-2 text-xs text-blue-800">
                 {filtrosExternos.dataInicio && filtrosExternos.dataFim && (
                   <span className="px-2 py-1 bg-blue-100 rounded">
-                    Período: {filtrosExternos.dataInicio} a {filtrosExternos.dataFim}
-              </span>
-            )}
+                    Período: {filtrosExternos.dataInicio} a{' '}
+                    {filtrosExternos.dataFim}
+                  </span>
+                )}
                 {filtrosExternos.centroCusto && (
                   <span className="px-2 py-1 bg-blue-100 rounded">
                     Centro: {filtrosExternos.centroCusto}
-              </span>
-            )}
+                  </span>
+                )}
                 {filtrosExternos.codigoGrupo && (
                   <span className="px-2 py-1 bg-blue-100 rounded">
                     Grupo: {filtrosExternos.codigoGrupo}
-              </span>
-            )}
+                  </span>
+                )}
                 {filtrosExternos.codigoConta && (
                   <span className="px-2 py-1 bg-blue-100 rounded">
                     Conta: {filtrosExternos.codigoConta}
-              </span>
-            )}
-          </div>
-        </div>
+                  </span>
+                )}
+              </div>
+            </div>
           )}
-          
+
           {/* Controls */}
           <div className="flex gap-2 flex-wrap">
             {/* <Input
@@ -1227,80 +1265,82 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
                 )}
               </Button>
             )}
-        <div className="flex items-center gap-2">
-          {data.length > 0 && (
-            <Button
-              onClick={clearAllFilters}
-              variant="outline"
-              size="sm"
-              className="flex items-center gap-2 bg-white border-gray-300 hover:bg-red-50 hover:border-red-300 text-gray-700"
-            >
-              <X className="h-4 w-4" />
-              Limpar Filtros
-              {getFilterCount() > 0 && (
-                <span className="bg-red-500 text-white text-xs rounded-full h-4 w-4 flex items-center justify-center font-semibold">
-                  {getFilterCount()}
-                </span>
+            <div className="flex items-center gap-2">
+              {data.length > 0 && (
+                <Button
+                  onClick={clearAllFilters}
+                  variant="outline"
+                  size="sm"
+                  className="flex items-center gap-2 bg-white border-gray-300 hover:bg-red-50 hover:border-red-300 text-gray-700"
+                >
+                  <X className="h-4 w-4" />
+                  Limpar Filtros
+                  {getFilterCount() > 0 && (
+                    <span className="bg-red-500 text-white text-xs rounded-full h-4 w-4 flex items-center justify-center font-semibold">
+                      {getFilterCount()}
+                    </span>
+                  )}
+                </Button>
               )}
-            </Button>
-          )}
-          <Button
-            onClick={exportToExcel}
-            variant="outline"
-            size="sm"
-            disabled={sortedAndFilteredData.length === 0}
-            className="flex items-center gap-2 bg-white border-gray-300 hover:bg-green-50 hover:border-green-300 text-gray-700 disabled:opacity-50 disabled:cursor-not-allowed"
-          >
-            <Download className="h-4 w-4" />
-            Exportar XLSX
-          </Button>
-          <Drawer open={drawerOpen} onOpenChange={setDrawerOpen}>
-            <DrawerTrigger asChild>
               <Button
+                onClick={exportToExcel}
                 variant="outline"
                 size="sm"
-                className="flex items-center gap-2 bg-white border-gray-300 hover:bg-blue-50 hover:border-blue-300 text-gray-700"
+                disabled={sortedAndFilteredData.length === 0}
+                className="flex items-center gap-2 bg-white border-gray-300 hover:bg-green-50 hover:border-green-300 text-gray-700 disabled:opacity-50 disabled:cursor-not-allowed"
               >
-                <Maximize2 className="h-4 w-4" />
-                Maximizar
+                <Download className="h-4 w-4" />
+                Exportar XLSX
               </Button>
-            </DrawerTrigger>
-            <DrawerContent className="max-h-[96vh] h-[96vh]">
-              <DrawerHeader className="flex-shrink-0">
-                <div className="flex items-center justify-between">
-                  <div className="flex-1">
-                    <DrawerTitle className="text-2xl font-bold text-gray-900">
-                      Análise Analítica{filtros.linhaSelecionada ? ` - ${filtros.linhaSelecionada}` : ""}
-                    </DrawerTitle>
-                    <DrawerDescription>
-                      Relatório detalhado de transações - Versão Maximizada
-                    </DrawerDescription>
+              <Drawer open={drawerOpen} onOpenChange={setDrawerOpen}>
+                <DrawerTrigger asChild>
+                  <Button
+                    variant="outline"
+                    size="sm"
+                    className="flex items-center gap-2 bg-white border-gray-300 hover:bg-blue-50 hover:border-blue-300 text-gray-700"
+                  >
+                    <Maximize2 className="h-4 w-4" />
+                    Maximizar
+                  </Button>
+                </DrawerTrigger>
+                <DrawerContent className="max-h-[96vh] h-[96vh]">
+                  <DrawerHeader className="flex-shrink-0">
+                    <div className="flex items-center justify-between">
+                      <div className="flex-1">
+                        <DrawerTitle className="text-2xl font-bold text-gray-900">
+                          Análise Analítica
+                          {filtros.linhaSelecionada
+                            ? ` - ${filtros.linhaSelecionada}`
+                            : ''}
+                        </DrawerTitle>
+                        <DrawerDescription>
+                          Relatório detalhado de transações - Versão Maximizada
+                        </DrawerDescription>
+                      </div>
+                      <DrawerClose asChild>
+                        <Button
+                          variant="outline"
+                          size="sm"
+                          className="flex items-center gap-2 bg-white border-gray-300 hover:bg-red-50 hover:border-red-300 text-gray-700"
+                        >
+                          <Minimize2 className="h-4 w-4" />
+                          Minimizar
+                        </Button>
+                      </DrawerClose>
+                    </div>
+                  </DrawerHeader>
+                  <div className="flex-1 overflow-y-auto px-4 pb-4">
+                    {renderAnaliticoContent(true)}
                   </div>
-                  <DrawerClose asChild>
-                    <Button
-                      variant="outline"
-                      size="sm"
-                      className="flex items-center gap-2 bg-white border-gray-300 hover:bg-red-50 hover:border-red-300 text-gray-700"
-                    >
-                      <Minimize2 className="h-4 w-4" />
-                      Minimizar
-                    </Button>
-                  </DrawerClose>
-                </div>
-              </DrawerHeader>
-              <div className="flex-1 overflow-y-auto px-4 pb-4">
-                {renderAnaliticoContent(true)}
-              </div>
-            </DrawerContent>
-          </Drawer>
+                </DrawerContent>
+              </Drawer>
+            </div>
+          </div>
         </div>
-            </div>
-            </div>
+      </div>
 
-            </div>
-
-        {/* Conteúdo Principal - Versão Normal */}
-        {renderAnaliticoContent(false)}
+      {/* Conteúdo Principal - Versão Normal */}
+      {renderAnaliticoContent(false)}
 
       {/* Advanced Filters Dialog */}
       <Dialog open={open} onOpenChange={setOpen}>
@@ -1310,7 +1350,8 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
               Filtros Avançados
             </DialogTitle>
             <p className="text-sm text-gray-600">
-              Estes filtros são aplicados sobre os dados já filtrados pela tabela DRE Gerencial.
+              Estes filtros são aplicados sobre os dados já filtrados pela
+              tabela DRE Gerencial.
             </p>
           </DialogHeader>
 
@@ -1337,10 +1378,7 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
                     </SelectTrigger>
                     <SelectContent>
                       {columns.map((col: any) => (
-                        <SelectItem
-                          key={col.field}
-                          value={col.field}
-                        >
+                        <SelectItem key={col.field} value={col.field}>
                           {col.headerName}
                         </SelectItem>
                       ))}
@@ -1357,8 +1395,8 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
                     onValueChange={(v: string) => {
                       const next = [...conditions];
                       next[idx].operator = v;
-                      if (v === "empty" || v === "notEmpty")
-                        next[idx].value = "";
+                      if (v === 'empty' || v === 'notEmpty')
+                        next[idx].value = '';
                       setConditions(next);
                     }}
                   >
@@ -1376,7 +1414,9 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
                   </Select>
                 </div>
 
-                {!(cond.operator === "empty" || cond.operator === "notEmpty") && (
+                {!(
+                  cond.operator === 'empty' || cond.operator === 'notEmpty'
+                ) && (
                   <div className="flex-1">
                     <label className="block text-sm font-medium text-gray-700 mb-1">
                       Valor
@@ -1391,12 +1431,12 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
                       placeholder="Digite o valor"
                       className="w-full bg-white border-gray-300"
                     />
-                </div>
+                  </div>
                 )}
 
                 {conditions.length > 1 && (
                   <div className="flex items-end">
-              <Button
+                    <Button
                       variant="outline"
                       size="sm"
                       onClick={() => {
@@ -1406,10 +1446,10 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
                       className="mt-6 text-red-600 hover:text-red-700 hover:bg-red-50 border-red-200"
                     >
                       ✕
-              </Button>
+                    </Button>
+                  </div>
+                )}
               </div>
-          )}
-        </div>
             ))}
 
             <div className="flex justify-center pt-2">
@@ -1418,7 +1458,7 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
                 onClick={() =>
                   setConditions((prev) => [
                     ...prev,
-                    { column: "", operator: "contains", value: "" },
+                    { column: '', operator: 'contains', value: '' },
                   ])
                 }
                 className="flex items-center gap-2 text-blue-600 hover:text-blue-700 hover:bg-blue-50 border-blue-200"
@@ -1430,7 +1470,7 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
           </div>
 
           <DialogFooter className="flex gap-2 pt-3 border-t border-gray-200">
-              <Button
+            <Button
               variant="outline"
               onClick={clearFilters}
               className="flex-1 border-gray-300 text-gray-700 hover:bg-gray-50 flex items-center justify-center gap-2"
@@ -1439,15 +1479,15 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
               {getFilterCount() > 0 && (
                 <span className="bg-red-500 text-white text-xs rounded-full h-4 w-4 flex items-center justify-center font-semibold">
                   {getFilterCount()}
-                    </span>
+                </span>
               )}
-              </Button>
-              <Button
+            </Button>
+            <Button
               onClick={applyFilters}
               className="flex-1 bg-blue-600 hover:bg-blue-700 text-white"
-              >
+            >
               Aplicar filtros
-              </Button>
+            </Button>
           </DialogFooter>
         </DialogContent>
       </Dialog>