<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><?= isset($pageTitle) ? e($pageTitle) . ' - ' : '' ?><?= APP_NAME ?></title>
<script src="https://cdn.tailwindcss.com"></script>
<script>
  tailwind.config = {
    theme: {
      extend: {
        colors: {
          brand: {
            50:'#eef7ff',100:'#d9edff',500:'#0f6fde',600:'#0b57b5',700:'#0a4890',900:'#0a2540'
          }
        }
      }
    }
  }
</script>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
<style>
body{font-family:'Inter',sans-serif;}
html, body { overflow-x: hidden; max-width: 100%; }
/* iOS Safari auto-zooms the page when focusing a form field smaller than
   16px - forcing 16px on mobile only (larger screens keep the tighter
   Tailwind text-sm sizing) kills that entirely. */
@media (max-width: 640px) {
  input, select, textarea { font-size: 16px !important; }
}
/* Long unbroken strings (emails, item names, account descriptions) should
   wrap instead of forcing their container wider than the viewport. */
td, th, p, h1, h2, h3 { overflow-wrap: anywhere; }
</style>
<?php include __DIR__ . '/toast_ajax.php'; ?>
<script>
// Legacy helper kept for any form not yet converted to class="ajax-form".
// Prefer ajax-form + toast_ajax.php for new forms - it avoids native-form
// submit timing issues entirely (see toast_ajax.php's comment for why).
function preventDoubleSubmit(form) {
  if (form.dataset.submitted === '1') return false;
  form.dataset.submitted = '1';
  setTimeout(function () {
    form.querySelectorAll('button[type="submit"], button:not([type])').forEach(function (btn) {
      btn.disabled = true;
      btn.dataset.originalText = btn.innerHTML;
      btn.innerHTML = '<span style="display:inline-block;width:14px;height:14px;border:2px solid rgba(255,255,255,.5);border-top-color:#fff;border-radius:50%;vertical-align:-2px;margin-right:6px;animation:ivmspin .6s linear infinite;"></span>Please wait...';
    });
  }, 0);
  return true;
}
</script>
</head>
<body class="bg-slate-100 text-slate-800">
<div class="min-h-screen">
