Colocação do Botão de esconder e mostra a barra

app/javascript/controllers/validacao_controller.js

@@ -7,6 +7,7 @@ import { Controller } from "@hotwired/stimulus"
 export default class extends Controller {
   static targets = [
     "linha", "checkbox", "selecionarTodos", "busca", "buscaVazia",
+    "resumo", "listaCol", "btnResumoLabel",
     "toggles", "barra", "barraManuais", "percentual", "chipVeiculo",
     "contadorClassificadas", "contadorTotal", "contadorManuais", "manuaisInfo",
     "qtdNormal", "qtdRetirada", "qtdBonus", "qtdDesconto", "qtdExtraordinaria",
@@ -64,6 +65,17 @@ export default class extends Controller {
     }
   }
 
+  // ── Oculta/mostra o resumo lateral (lista ocupa a largura toda) ──
+  toggleResumo() {
+    const escondido = this.resumoTarget.classList.toggle("hidden")
+    if (this.hasListaColTarget) {
+      this.listaColTarget.classList.toggle("lg:col-span-4", escondido)
+      this.listaColTarget.classList.toggle("lg:col-span-3", !escondido)
+    }
+    if (this.hasBtnResumoLabelTarget)
+      this.btnResumoLabelTarget.textContent = escondido ? "Mostrar resumo" : "Ocultar resumo"
+  }
+
   // ── Busca na listagem de notas (filtra os cards por NF/local/endereço/veículo) ──
   filtrarBusca(event) {
     const q = (event.currentTarget.value || "").trim().toLowerCase()

app/views/consolidacao_entregas/validar.html.erb

@@ -104,7 +104,12 @@
               class="bg-purple-600 text-white font-bold px-3 py-2 rounded-lg text-xs min-h-[44px]">Extra</button>
     </div>
 
-    <div class="ml-auto">
+    <div class="ml-auto flex items-center gap-2">
+      <%# Oculta/mostra o resumo lateral (mais largura para a lista) %>
+      <button type="button" data-action="validacao#toggleResumo"
+              class="text-gray-400 hover:text-white text-sm border border-[#2a2a2a] hover:border-orange-500 px-3 py-2 rounded-lg whitespace-nowrap">
+        📊 <span data-validacao-target="btnResumoLabel">Ocultar resumo</span>
+      </button>
       <%= link_to params[:apenas_pendentes] == '1' ? 'Mostrar todas' : 'Apenas não classificadas',
           validar_consolidacao_consolidacao_entregas_path(@consolidacao, motorista: @motorista, vehicle: @veiculos_sel.presence,
             apenas_pendentes: params[:apenas_pendentes] == '1' ? nil : '1'),
@@ -262,7 +267,7 @@
   <div class="grid grid-cols-1 lg:grid-cols-4 gap-3 lg:flex-1 lg:min-h-0">
 
     <%# ── Lista de entregas (3 colunas) — área rolável ──── %>
-    <div class="lg:col-span-3 space-y-2 lg:overflow-y-auto lg:pr-1">
+    <div class="lg:col-span-3 space-y-2 lg:overflow-y-auto lg:pr-1" data-validacao-target="listaCol">
       <%# 🔍 Busca na listagem — filtra os cards por NF, local, endereço ou veículo %>
       <div class="sticky top-0 z-20 bg-[#0a0a0a] pb-2">
         <div class="relative">
@@ -331,7 +336,7 @@
     </div>
 
     <%# ── Resumo lateral (1 coluna) — rola junto se precisar ─────── %>
-    <div class="lg:col-span-1 lg:overflow-y-auto">
+    <div class="lg:col-span-1 lg:overflow-y-auto" data-validacao-target="resumo">
       <div class="bg-[#1a1a1a] border border-[#2a2a2a] rounded-xl p-5 space-y-4">
         <h3 class="text-white font-bold">📊 Resumo</h3>