<%# app/views/consolidacoes/_por_motorista.html.erb — visão por MOTORISTA
    Mesmo recorte da lista, somado por quem recebe. Clicar num motorista abre,
    ali mesmo (sem sair da tela), as consolidações que compõem o valor dele. %>

<%# Link desta mesma tela preservando filtros — usado pelas linhas e pelos PDFs. %>
<% ctx = { nome: params[:nome], motorista: params[:motorista], status: @status_totais,
           inicio: @inicio.strftime('%Y-%m-%d'), fim: @fim.strftime('%Y-%m-%d'),
           visao: 'motoristas' }.compact_blank %>

<%# ── Resumo do período ────────────────────────────────── %>
<div class="grid grid-cols-2 xl:grid-cols-4 gap-3 mb-5">
  <div class="bg-[#1a1a1a] border border-[#2a2a2a] rounded-xl p-4">
    <p class="text-gray-400 text-xs uppercase tracking-wide">
      <%= icone :dinheiro %> <%= @status_totais == 'finalizada' ? 'Consolidado no período' : 'Total do período' %>
    </p>
    <p class="text-orange-500 font-black text-2xl sm:text-3xl mt-1 whitespace-nowrap"><%= moeda(@totais.total_geral) %></p>
    <p class="text-gray-500 text-xs mt-1"><%= @totais.total_consolidacoes %> consolidação(ões) · <%= @totais.linhas.size %> motorista(s)</p>
  </div>
  <div class="bg-[#1a1a1a] border border-[#2a2a2a] rounded-xl p-4">
    <p class="text-gray-400 text-xs uppercase tracking-wide"><%= icone :sucesso, cor: 'text-green-400' %> Pago</p>
    <p class="text-green-400 font-black text-2xl sm:text-3xl mt-1 whitespace-nowrap"><%= moeda(@totais.total_pago) %></p>
  </div>
  <div class="bg-[#1a1a1a] border border-[#2a2a2a] rounded-xl p-4">
    <p class="text-gray-400 text-xs uppercase tracking-wide"><%= icone :parcial, cor: 'text-amber-400' %> A pagar</p>
    <p class="text-amber-400 font-black text-2xl sm:text-3xl mt-1 whitespace-nowrap"><%= moeda(@totais.total_pendente) %></p>
  </div>
  <div class="bg-[#1a1a1a] border border-[#2a2a2a] rounded-xl p-4 flex flex-col justify-between">
    <p class="text-gray-400 text-xs uppercase tracking-wide"><%= icone :documento %> Relatório</p>
    <div class="flex flex-col gap-1.5 mt-2">
      <%= link_to rotulo(:baixar, 'PDF completo', cor: nil),
          totais_pdf_consolidacoes_path(ctx.except(:visao)),
          data: { turbo: false },
          class: 'bg-orange-500 hover:bg-orange-600 text-black font-bold text-sm px-3 py-2 rounded-lg flex items-center justify-center' %>
      <%= link_to 'Só o resumo',
          totais_pdf_consolidacoes_path(ctx.except(:visao).merge(detalhar: '0')),
          data: { turbo: false },
          class: 'text-gray-400 hover:text-orange-500 text-xs underline text-center' %>
    </div>
  </div>
</div>

<% if @totais.vazio? %>
  <div class="bg-[#1a1a1a] border border-[#2a2a2a] rounded-xl p-12 text-center">
    <p class="mb-4"><%= icone :vazio, tamanho: 'w-12 h-12', cor: 'text-gray-600', espaco: false %></p>
    <p class="text-gray-400">Nenhuma consolidação com período dentro de <%= l @inicio, format: :short %> → <%= l @fim, format: :short %>.</p>
    <p class="text-gray-500 text-sm mt-1">Ajuste as datas acima — o recorte pega a consolidação inteira dentro da faixa.</p>
  </div>
<% else %>
  <%# Em celular/monitor pequeno vira carrossel de 10 em 10; em tela grande sai a
      lista inteira. O motorista com a composição aberta define a página inicial
      (data-carrossel-inicial) — senão o clique dele cairia numa página escondida. %>
  <div data-controller="carrossel" data-carrossel-tamanho-value="10" class="relative sm:px-16">
  <div class="space-y-3">
    <% @totais.linhas.each do |linha| %>
      <% aberto = @detalhe_motorista == linha[:motorista] %>
      <div data-carrossel-target="item" data-carrossel-inicial="<%= aberto %>"
           class="bg-[#1a1a1a] border rounded-xl overflow-hidden transition-colors <%= aberto ? 'border-orange-500' : 'border-[#2a2a2a] hover:border-orange-500/60' %>">

        <%# Cabeçalho do motorista — o clique abre/fecha a composição %>
        <%= link_to consolidacoes_path(ctx.merge(detalhe: (aberto ? nil : linha[:motorista])).compact_blank),
            class: 'block p-5' do %>
          <div class="flex flex-col md:flex-row md:items-center md:justify-between gap-3">
            <div class="min-w-0">
              <div class="flex items-center gap-2">
                <%= icone(aberto ? :expandir : :avancar, cor: 'text-gray-500', espaco: false) %>
                <h3 class="text-white font-bold text-lg truncate"><%= linha[:motorista] %></h3>
              </div>
              <p class="text-gray-400 text-sm mt-1 ml-6">
                <%= icone :consolidacoes %> <%= linha[:consolidacoes] %> consolidação(ões)
                · <%= icone :caminhao %> <%= linha[:lancamentos] %> lançamentos
                <% if linha[:pagas].positive? %>· <span class="text-green-400"><%= linha[:pagas] %> paga(s)</span><% end %>
                <% if linha[:pendentes].positive? %>· <span class="text-amber-400"><%= linha[:pendentes] %> a pagar</span><% end %>
              </p>
            </div>
            <div class="text-right shrink-0">
              <p class="text-orange-500 font-black text-2xl whitespace-nowrap"><%= moeda(linha[:valor_total]) %></p>
              <p class="text-xs mt-0.5 whitespace-nowrap">
                <span class="text-green-400"><%= moeda(linha[:valor_pago]) %> pago</span>
                <span class="text-gray-600">·</span>
                <span class="text-amber-400"><%= moeda(linha[:valor_pendente]) %> a pagar</span>
              </p>
            </div>
          </div>
        <% end %>

        <%# Composição — o que forma o valor daquele motorista %>
        <% if aberto %>
          <div class="border-t border-[#2a2a2a] bg-[#0f0f0f] p-5">
            <div class="flex flex-wrap items-center justify-between gap-2 mb-3">
              <p class="text-gray-300 text-sm font-semibold flex items-center gap-2">
                <%= icone :composicao, espaco: false %> O que forma esse valor
              </p>
              <%= link_to rotulo(:baixar, 'PDF deste motorista', cor: nil),
                  totais_pdf_consolidacoes_path(ctx.except(:visao).merge(detalhe: linha[:motorista])),
                  data: { turbo: false },
                  class: 'text-gray-300 hover:text-orange-500 text-xs border border-[#2a2a2a] hover:border-orange-500 rounded-lg px-3 py-2 flex items-center' %>
            </div>

            <div class="space-y-2">
              <% @detalhe.each do |cm| %>
                <% c = cm.consolidacao %>
                <%= link_to consolidacao_path(c),
                    class: 'flex flex-col md:flex-row md:items-center md:justify-between gap-2 bg-[#1a1a1a] border border-[#2a2a2a] hover:border-orange-500 rounded-lg px-4 py-3 transition-colors' do %>
                  <div class="min-w-0">
                    <div class="flex items-center gap-2 flex-wrap">
                      <span class="text-white font-semibold truncate"><%= c.nome %></span>
                      <%= badge_status(c.status) %>
                      <%= badge_pagamento(cm.pago? ? :pago : :pendente) %>
                    </div>
                    <p class="text-gray-400 text-xs mt-1">
                      <%= icone :calendario %> <%= l c.data_inicio, format: :short %> → <%= l c.data_fim, format: :short %>
                      <% if cm.pago? %>
                        · <%= icone :dinheiro, cor: 'text-green-400' %> Pago em <%= l cm.pago_em.to_date, format: :short %>
                        <% if cm.forma_pagamento.present? %>via <%= cm.forma_pagamento.humanize %><% end %>
                        <% if cm.nota_fiscal.present? %>· NF <%= cm.nota_fiscal %><% end %>
                      <% end %>
                    </p>
                  </div>
                  <p class="text-orange-500 font-black text-lg whitespace-nowrap"><%= moeda(cm.valor_total) %></p>
                <% end %>
              <% end %>
            </div>
          </div>
        <% end %>
      </div>
    <% end %>
  </div>

    <%= render 'shared/carrossel_controles',
            anterior: 'Motoristas anteriores', proximo: 'Próximos motoristas' %>
  </div>

  <p class="text-gray-500 text-xs mt-4">
    <%= icone :dica %>
    <% if @status_totais == 'finalizada' %>
      <span class="text-gray-400">Consolidado</span> = só consolidações <strong>finalizadas</strong> —
      é o mesmo número do card "Consolidado / Pago" do Dashboard no mesmo período.
      Troque para <span class="text-gray-400">Geral</span> para somar também os rascunhos em andamento.
    <% elsif @status_totais == 'rascunho' %>
      Mostrando <span class="text-gray-400">só rascunhos</span> — valores ainda em aberto, que mudam até o fechamento.
    <% else %>
      <span class="text-gray-400">Geral</span> = finalizadas <strong>+ rascunhos</strong>, por isso fica acima do
      "Consolidado / Pago" do Dashboard. Troque para <span class="text-gray-400">Consolidado</span> para comparar com ele.
    <% end %>
    Entram as consolidações que cruzam <%= l @inicio, format: :short %> → <%= l @fim, format: :short %> e as pagas dentro do período;
    motoristas arquivados não entram no total.
  </p>
<% end %>
