<%# app/views/motorista/dashboard/index.html.erb — Painel do Motorista %>
<% content_for :title, 'Meu Painel' %>

<div class="max-w-2xl mx-auto">

  <h1 class="text-3xl font-bold text-white mb-1">Olá, <%= current_user.nome.split.first %>!</h1>
  <p class="text-gray-300 text-lg mb-6">Aqui estão seus valores de entregas.</p>

  <%# ── Aviso de pagamento recém-confirmado ───────────────── %>
  <% if @pagamentos_recentes.any? %>
    <div class="bg-green-600/15 border border-green-600/40 rounded-2xl p-5 mb-6">
      <p class="text-green-400 font-bold uppercase tracking-wide mb-3 flex items-center gap-2"><%= icone :sucesso, cor: nil, espaco: false %> Pagamento confirmado!</p>
      <div class="space-y-3">
        <% @pagamentos_recentes.each do |cm| %>
          <div class="flex flex-col gap-0.5">
            <p class="text-white text-base">
              Você recebeu <span class="font-black text-green-400"><%= moeda(cm.valor_total) %></span>
              pela consolidação <span class="font-semibold"><%= cm.consolidacao.nome %></span>
            </p>
            <p class="text-gray-300 text-sm">
              <%= icone :dinheiro %> <%= l cm.pago_em.to_date, format: :short %>
              <% if cm.forma_pagamento.present? %>· <%= cm.forma_pagamento.humanize %><% end %>
              <% if cm.nota_fiscal.present? %>· <%= icone :nota_fiscal %> NF <%= cm.nota_fiscal %><% end %>
            </p>
          </div>
        <% end %>
      </div>
    </div>
  <% end %>

  <%# ── 2 Cards grandes ─────────────────────────────────── %>
  <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-8">

    <%# Card 1 — Valor Estimado (LARANJA) %>
    <div class="bg-orange-500 rounded-2xl p-6">
      <p class="text-black/80 font-bold uppercase tracking-wide flex items-center gap-2"><%= icone :dinheiro, cor: nil, espaco: false %> Valor estimado deste mês</p>
      <p class="text-black/70 text-sm mt-1"><%= icone :calendario, cor: nil %> <%= l @estimado_inicio, format: :short %> a <%= l @estimado_fim, format: :short %></p>
      <p class="text-black font-black text-4xl sm:text-5xl 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 sai quando a empresa fechar o pagamento.
      </p>
    </div>

    <%# Card 2 — Valor Consolidado (BRANCO) %>
    <div class="bg-white rounded-2xl p-6">
      <p class="text-gray-600 font-bold uppercase tracking-wide flex items-center gap-2"><%= icone :sucesso, cor: 'text-green-600', espaco: false %> Valor fechado para pagamento</p>
      <p class="text-black font-black text-4xl sm:text-5xl mt-2 leading-tight whitespace-nowrap"><%= moeda(@valor_consolidado) %></p>
      <p class="text-gray-600 text-base mt-2">
        Soma dos pagamentos já confirmados pela empresa
      </p>
    </div>
  </div>

  <%# ── Lista de consolidações ──────────────────────────── %>
  <h2 class="text-white font-bold text-xl mb-3 flex items-center gap-2"><%= icone :planilha, espaco: false %> Meus pagamentos</h2>

  <% if @minhas_consolidacoes.any? %>
    <div class="space-y-3">
      <% @minhas_consolidacoes.each do |c| %>
        <% cm = c.consolidacao_motoristas.find_by(motorista_nome: current_user.nome) %>
        <div 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>
              <div class="flex items-center gap-2 flex-wrap">
                <p class="text-white font-bold text-lg"><%= c.nome %></p>
                <%= badge_status(c.status) %>
                <% if c.finalizada? %>
                  <%= badge_pagamento(cm&.pago? ? :pago : :pendente) %>
                <% end %>
              </div>
              <p class="text-gray-300 text-base mt-1">
                <%= icone :calendario %> <%= l c.data_inicio, format: :short %> a <%= l c.data_fim, format: :short %>
              </p>
              <p class="text-orange-500 font-black text-3xl mt-1 whitespace-nowrap"><%= moeda(cm&.valor_total || 0) %></p>
              <% if cm&.pago? %>
                <p class="text-green-400 text-sm mt-1">
                  <%= 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 %>
                </p>
                <% if cm.nota_fiscal.present? %>
                  <p class="text-gray-300 text-sm mt-0.5"><%= icone :nota_fiscal %> Nota Fiscal: <%= cm.nota_fiscal %></p>
                <% end %>
              <% end %>
            </div>
            <% if c.finalizada? %>
              <%= link_to rotulo(:baixar, 'Baixar meu extrato', cor: nil),
                  gerar_pdf_extrato_consolidacao_path(c, motorista: current_user.nome),
                  data: { turbo: false },
                  class: 'w-full md:w-auto bg-orange-500 hover:bg-orange-600 text-black font-bold text-base px-6 py-4 rounded-xl min-h-[52px] flex items-center justify-center text-center' %>
            <% else %>
              <span class="w-full md:w-auto text-gray-300 text-base px-5 py-4 border border-[#2a2a2a] rounded-xl text-center">
                <%= icone :parcial, cor: 'text-amber-400' %> Aguardando fechamento
              </span>
            <% end %>
          </div>
        </div>
      <% end %>
    </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>
      <p class="text-gray-200 text-lg">Você ainda não aparece em nenhum pagamento.</p>
      <p class="text-gray-400 text-base mt-1">Quando a empresa fechar um período com suas entregas, ele aparece aqui.</p>
    </div>
  <% end %>
</div>
