<?php
$mesa  = (int)($_GET["mesa"] ?? 0);
$token = $_GET["token"] ?? "";
?>
<!doctype html>
<html lang="pt-br">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover">
  <title>Conta encerrada</title>
  <style>
    :root{
      --bg:#0b1220;
      --card:#101f36;
      --text:#e9eefb;
      --muted:#a8b3cf;
      --line: rgba(255,255,255,.12);
      --shadow: 0 14px 30px rgba(0,0,0,.55);
      --radius: 18px;
      --primary:#3b82f6;
      --amber:#facc15;
    }
    *{ box-sizing:border-box; }
    body{
      margin:0;
      min-height:100vh;
      display:flex;
      align-items:center;
      justify-content:center;
      padding:20px;
      font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial;
      color:var(--text);
      background:
        radial-gradient(900px 600px at 20% -10%, rgba(59,130,246,.20), transparent 60%),
        radial-gradient(900px 600px at 90% 10%, rgba(250,204,21,.10), transparent 60%),
        var(--bg);
    }
    .card{
      width:min(520px, 92vw);
      background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.06));
      border:1px solid var(--line);
      border-radius: var(--radius);
      box-shadow: var(--shadow);
      padding: 18px;
    }
    .badge{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:8px 12px;
      border-radius:999px;
      border:1px solid rgba(250,204,21,.35);
      background: rgba(250,204,21,.10);
      color: var(--amber);
      font-weight:900;
      font-size:12px;
    }
    h1{ margin:14px 0 8px; font-size:18px; }
    .mesa{
      font-size:44px;
      font-weight:1000;
      letter-spacing:.5px;
      margin: 4px 0 10px;
    }
    p{ margin:0 0 12px; color:var(--muted); line-height:1.35; }
    .btn{
      width:100%;
      border:none;
      cursor:pointer;
      padding: 12px 14px;
      border-radius: 14px;
      font-weight:1000;
      background: linear-gradient(135deg, rgba(59,130,246,.95), rgba(59,130,246,.70));
      color:#fff;
    }
    .hint{
      margin-top:10px;
      font-size:12px;
      color: var(--muted);
      text-align:center;
    }
  </style>
</head>
<body>
  <div class="card">
    <div class="badge">✅ Conta encerrada</div>    
    <div class="mesa">Mesa <?= $mesa > 0 ? $mesa : "—" ?></div>

    <p>
      Se você quiser fazer <strong>novos pedidos</strong>, você precisa <br><strong>escanear o QR Code novamente</strong>.
    </p>
    
    <div class="hint">Obrigado, volte sempre.</div>
  </div>
</body>
</html>
