<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><?= e($printTitle ?? 'Document') ?> - <?= APP_NAME ?></title>
<script src="https://cdn.tailwindcss.com"></script>
<style>
  body { font-family: 'Helvetica Neue', Arial, sans-serif; color: #1e293b; }
  @media print {
    .no-print { display: none !important; }
    body { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
    .print-page { box-shadow: none !important; margin: 0 !important; max-width: 100% !important; }
  }
</style>
</head>
<body class="bg-slate-200">
<div class="no-print bg-slate-900 text-white px-6 py-3 flex items-center justify-between sticky top-0 z-10">
  <span class="text-sm">Print preview</span>
  <div class="flex gap-2">
    <button onclick="window.print()" class="bg-blue-600 hover:bg-blue-700 text-white text-sm font-medium px-4 py-1.5 rounded-lg">🖨️ Print / Save as PDF</button>
    <button onclick="window.close()" class="bg-slate-700 hover:bg-slate-600 text-white text-sm font-medium px-4 py-1.5 rounded-lg">Close</button>
  </div>
</div>
<div class="print-page max-w-3xl mx-auto bg-white shadow-lg my-4 md:my-8 p-5 md:p-10">
  <div class="flex flex-col sm:flex-row items-start sm:items-start justify-between gap-3 border-b-2 border-slate-800 pb-4 mb-6">
    <div>
      <h1 class="text-xl font-bold">Best Western Plus Yenagoa</h1>
      <p class="text-xs text-slate-500">Inventory Management System</p>
    </div>
    <div class="sm:text-right">
      <p class="text-lg font-bold uppercase tracking-wide"><?= e($printTitle ?? '') ?></p>
      <?php if (!empty($printSubtitle)): ?><p class="text-sm text-slate-500"><?= e($printSubtitle) ?></p><?php endif; ?>
    </div>
  </div>
