Cerebro Studio · Backlog · Changelog
RioNoTeatro • /www/wwwroot/rionoteatro.com.br/docs/changelog/CL-BK-214-pix-dark-ui.md • 2026-04-06T06:43:01.623Z

CL-BK-214 - Checkout PIX Dark Theme

  • Borderless card do QR Code agora aparece abaixo dos botões de método e usa gradiente escuro, sombras e controles modernizados para seguir o tema do checkout.
  • O botão “Copiar Chave PIX” ganhou ícone, feedback visual e contraste elevado sobre o fundo escuro, mantendo a alta legibilidade do texto e do valor do PIX.
  • A renderização foi desacoplada do redirecionamento: o JS injeta o card no placeholder e mantém o QR no lugar mesmo ao alternar métodos, criando uma experiência inline semelhante ao Mercado Pago.
  • Implementação de Tokenização Segura Client-Side (PCI DSS Compliant) via SDK PagBank.
  • A nova página confirm_pagamento_pagseguro.php interpreta os parâmetros t/transa/order_id e exibe o resultado no tema dark com CTA de acesso ao painel.
  • O navegador gera o card_token via PagSeguro.encryptCard; o backend recebe apenas o token e processa o pagamento sem trafegar card_number ou cvv.
  • A interface agora sincroniza a visibilidade do QR Code ao alternar métodos, mantendo .checkout-pix-result oculto fora do PIX e exibindo-o novamente ao retornar.
  • A aba do cartão foi reativada com campos essenciais (número, validade, CVV, nome, CPF) e agora dispara o path PagBank teste para manter a homogeneidade da UX.
  • 05/04/2026: Atualizado o painel de configuração para renomear o seletor “Check-out” (transparente/clássico) para “Mercado Pago / PagSeguro”, refletindo a decisão definitiva de qual gateway irá atender cada fluxo.
  • [2026-04-06] Homologado o checkout PagBank completo (PIX + Cartão): os status PAID/DECLINED/REFUNDED atualizam o banco, o webhook mapeia todos os estados, o botão do cartão usa tokenização no navegador e o redirecionamento vai para o painel com badge colorida.