Modificação na area do motorista

app/views/motorista/dashboard/index.html.erb

@@ -103,35 +103,57 @@
     <% end %>
   </div>
 
-  <%# ── Card secundário: estimativa (ainda não fechada) ──── %>
-  <div class="bg-orange-500 rounded-2xl p-6 mb-6">
-    <div class="flex items-center justify-between gap-3">
-      <p class="text-black/80 font-bold uppercase tracking-wide flex items-center gap-2"><%= icone :dinheiro, cor: nil, espaco: false %> Estimativa das entregas</p>
-      <span class="text-black/60 text-sm whitespace-nowrap"><%= l @estimado_inicio, format: :short %> a <%= l @estimado_fim, format: :short %></span>
+  <%# ── Card secundário: entregas do período ──────────────
+      REGRA: valor estimado e valor fechado NUNCA aparecem juntos.
+      Quando a empresa já fechou o período, o número certo é o de cima; mostrar
+      ao lado uma estimativa (entregas × preço, sem descontos/bônus e sem as
+      regras de classificação) fazia o motorista ver dois valores diferentes para
+      o mesmo mês — e o estimado costuma ser MAIOR, o que vira cobrança.
+      Com fechamento: só a CONTAGEM de entregas (o trabalho, sem prometer valor).
+      Sem fechamento: a prévia em R$, que é a única informação que ele tem. %>
+  <% if @consolidacoes.any? %>
+    <div class="bg-[#1a1a1a] border border-[#2a2a2a] rounded-2xl p-6 mb-6">
+      <div class="flex items-center justify-between gap-3">
+        <p class="text-gray-400 font-bold uppercase tracking-wide flex items-center gap-2"><%= icone :caminhao, espaco: false %> Suas entregas no período</p>
+        <span class="text-gray-500 text-sm whitespace-nowrap"><%= l @estimado_inicio, format: :short %> a <%= l @estimado_fim, format: :short %></span>
+      </div>
+      <p class="text-white font-black text-4xl mt-2 leading-tight"><%= @entregas_mes %></p>
+      <%# "Atendidas" = concluídas + sem sucesso: a empresa paga as duas, porque
+          em ambas o motorista foi até o local. %>
+      <p class="text-gray-300 text-base mt-1">
+        <%= @entregas_concluidas %> entregues · <%= @entregas_falhadas %> sem sucesso (pagas também)
+      </p>
+      <p class="text-gray-500 text-sm mt-3">
+        <%= icone :sucesso, cor: 'text-green-500' %> O valor deste período já foi fechado pela empresa — é o do card branco acima.
+      </p>
     </div>
-    <p class="text-black font-black text-4xl mt-2 leading-tight whitespace-nowrap"><%= moeda(@valor_estimado) %></p>
-    <%# "Atendidas" = concluídas + sem sucesso. O rótulo NÃO pode voltar a dizer
-        "feitas e confirmadas": o valor acima inclui as visitas sem sucesso, que
-        a empresa também paga (o motorista foi ao local). Sem a segunda linha o
-        motorista não consegue conferir a conta. %>
-    <p class="text-black/80 text-base mt-2"><%= @entregas_mes %> entregas atendidas</p>
-    <p class="text-black/70 text-sm mt-1">
-      <%= @entregas_concluidas %> entregues · <%= @entregas_falhadas %> sem sucesso (pagas também)
-    </p>
-    <p class="text-black/60 text-sm mt-3">
-      <%= icone :alerta, cor: nil %> Valor aproximado. O valor certo é o de cima, quando a empresa fecha o pagamento.
-    </p>
-  </div>
+  <% else %>
+    <div class="bg-orange-500 rounded-2xl p-6 mb-6">
+      <div class="flex items-center justify-between gap-3">
+        <p class="text-black/80 font-bold uppercase tracking-wide flex items-center gap-2"><%= icone :dinheiro, cor: nil, espaco: false %> Prévia (ainda não fechado)</p>
+        <span class="text-black/60 text-sm whitespace-nowrap"><%= l @estimado_inicio, format: :short %> a <%= l @estimado_fim, format: :short %></span>
+      </div>
+      <p class="text-black font-black text-4xl mt-2 leading-tight whitespace-nowrap"><%= moeda(@valor_estimado) %></p>
+      <p class="text-black/80 text-base mt-2"><%= @entregas_mes %> entregas atendidas</p>
+      <p class="text-black/70 text-sm mt-1">
+        <%= @entregas_concluidas %> entregues · <%= @entregas_falhadas %> sem sucesso (pagas também)
+      </p>
+      <p class="text-black/60 text-sm mt-3">
+        <%= icone :alerta, cor: nil %> Conta simples (entregas × valor da entrega). O valor certo sai quando a empresa fechar o período — bônus, retiradas e descontos entram só no fechamento.
+      </p>
+    </div>
+  <% end %>
 
   <%# ── Composição: de onde vem o valor fechado ──────────── %>
   <h2 class="text-white font-bold text-xl mb-1 flex items-center gap-2"><%= icone :composicao, espaco: false %> De onde vem esse valor</h2>
   <p class="text-gray-400 text-base mb-3">Cada fechamento abaixo entra na soma do card branco.</p>
 
   <% if @consolidacoes.any? %>
+    <div data-controller="carrossel" data-carrossel-tamanho-value="10">
     <div class="space-y-3">
       <% @consolidacoes.each do |cm| %>
         <% c = cm.consolidacao %>
-        <div class="bg-[#1a1a1a] border border-[#2a2a2a] rounded-2xl p-5">
+        <div data-carrossel-target="item" class="bg-[#1a1a1a] border border-[#2a2a2a] rounded-2xl p-5">
           <div class="flex flex-col md:flex-row md:items-center md:justify-between gap-4">
             <div class="min-w-0">
               <div class="flex items-center gap-2 flex-wrap">
@@ -162,6 +184,23 @@
         </div>
       <% end %>
     </div>
+
+      <%# Setas: alvos grandes (56px) porque a tela é usada de luva/no trânsito.
+          Somem sozinhas quando há uma página só (ver carrossel_controller.js). %>
+      <div data-carrossel-target="controles" class="hidden flex items-center justify-between gap-3 mt-4">
+        <button type="button" data-action="carrossel#anterior" data-carrossel-target="anterior"
+                class="bg-[#1a1a1a] border border-[#2a2a2a] hover:border-orange-500 text-white rounded-2xl w-14 h-14 flex items-center justify-center"
+                aria-label="Fechamentos anteriores">
+          <%= icone :voltar, cor: nil, tamanho: 'w-6 h-6', espaco: false %>
+        </button>
+        <span data-carrossel-target="indicador" class="text-gray-300 text-base font-semibold"></span>
+        <button type="button" data-action="carrossel#proxima" data-carrossel-target="proximo"
+                class="bg-orange-500 hover:bg-orange-600 text-black rounded-2xl w-14 h-14 flex items-center justify-center"
+                aria-label="Próximos fechamentos">
+          <%= icone :avancar, cor: nil, tamanho: 'w-6 h-6', espaco: false %>
+        </button>
+      </div>
+    </div>
   <% else %>
     <div class="bg-[#1a1a1a] border border-[#2a2a2a] rounded-2xl p-10 text-center">
       <p class="mb-3"><%= icone :vazio, tamanho: 'w-12 h-12', cor: 'text-gray-600', espaco: false %></p>