Payment System - Copy this React, Tailwind Component to your project

Crie uma aplicação SaaS moderna com um sistema de checkout integrado ao Stripe para pagamentos recorrentes. A aplicação deve incluir as seguintes funcionalidades: Página de Pagamento: Integração com Stripe utilizando as seguintes chaves: Chave pública: NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=pk_test_51Q8BmCFVGrhesmf6MEouGSctSijFpqEnUwiGKodAa1Tyr6UBnXOEg93wmXBO82GPaqFFPKHAkSxvxkYkYVOnOUlv00Pg5z0P8B. Chave secreta: STRIPE_SECRET_KEY=sk_test_51Q8BmCFVGrhesmf6ALs0CKYqhKIlmFq3ZgQ9f0vsAul2TbS8BIyX2NhAqVN0N8s2wCk0pWIrTGU7hNzSb5xsRp80000JZH6RKg. Ofereça dois planos de assinatura: PRO: price_1QWUSPFVGrhesmf6TFeoggmT. TURBO: price_1QWUUSFVGrhesmf62swR4S5l. Exiba uma interface atraente e otimizada para alta conversão, criada com Tailwind CSS. Inclua um formulário seguro para informações de pagamento e dados dos clientes. Página de Confirmação de Pagamento: Crie uma página dedicada que exiba: O resumo do plano escolhido. Uma mensagem personalizada de agradecimento. O status do pagamento (sucesso ou falha). Melhorias de UI/UX: Use Tailwind CSS para criar um design limpo, moderno e responsivo. Adicione animações suaves e feedbacks em tempo real para o usuário (por exemplo: spinner durante o processamento do pagamento). Mostre uma barra de progresso para o processo de checkout. Integração Técnica: Utilize os webhooks do Stripe para gerenciar eventos de pagamento.