@extends('layouts.app')
@section('title','Fatura')
@section('content')
<div class="topbar"><h2>Fatura #{{ $invoice->id }}</h2></div>
<div class="card">
  <p><strong>Plano:</strong> {{ $invoice->plan_id }}</p>
  <p><strong>Valor:</strong> R$ {{ number_format((float)$invoice->amount,2,',','.') }}</p>
  <p><strong>Status:</strong> <span class="badge badge-{{ $invoice->status==='paid'?'paid':'pending' }}">{{ $invoice->status }}</span></p>
  @if($invoice->status === 'pending' && $invoice->pix_qr_code_base64)
    <div class="qr">
      <h3>Pague com PIX</h3>
      <img src="data:image/png;base64,{{ $invoice->pix_qr_code_base64 }}" alt="QR PIX">
      <p class="muted" style="margin-top:10px">Ou copie o código:</p>
      <div class="copy-box" id="pix">{{ $invoice->pix_qr_code }}</div>
      <button onclick="navigator.clipboard.writeText(document.getElementById('pix').innerText)" class="btn btn-secondary" style="margin-top:10px">Copiar</button>
    </div>
  @elseif($invoice->status === 'paid')
    <div class="alert alert-success">✅ Fatura paga em {{ $invoice->paid_at?->format('d/m/Y H:i') }}</div>
  @endif
  <a href="{{ route('billing.index') }}" class="btn btn-secondary">Voltar</a>
</div>
@endsection