<?php
$metaTitle       = isset($title) ? $title : 'Framex Engine';
$metaDescription = isset($metaDescription) ? $metaDescription : 'Framex Engine — A lightweight, high-performance PHP engine for building static sites and modern web applications.';
$metaImage       = isset($metaImage) ? $metaImage : image(1200, 630);
$metaUrl         = SITE_URI;
?>
<!DOCTYPE html>
<html lang="en" class="scroll-smooth">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title><?= $metaTitle ?></title>
  <meta name="description" content="<?= e($metaDescription) ?>">

  <!-- Open Graph -->
  <meta property="og:type" content="website">
  <meta property="og:url" content="<?= $metaUrl ?>">
  <meta property="og:title" content="<?= e($metaTitle) ?>">
  <meta property="og:description" content="<?= e($metaDescription) ?>">
  <meta property="og:image" content="<?= $metaImage ?>">

  <!-- Twitter Card -->
  <meta name="twitter:card" content="summary_large_image">
  <meta name="twitter:url" content="<?= $metaUrl ?>">
  <meta name="twitter:title" content="<?= e($metaTitle) ?>">
  <meta name="twitter:description" content="<?= e($metaDescription) ?>">
  <meta name="twitter:image" content="<?= $metaImage ?>">

  <script>
    (function () {
      var theme = null;
      try {
        theme = localStorage.getItem('framex-theme');
      } catch (error) {}
      var prefersDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
      if (theme === 'dark' || (!theme && prefersDark)) {
        document.documentElement.classList.add('dark');
      }
    })();
  </script>
  <link rel="stylesheet" href="<?= asset('css/style.css') ?>">


</head>

<body class="<?php echo (isset($bodyClass) && $bodyClass !== '' ? $bodyClass : 'bg-slate-50 text-slate-950 dark:bg-slate-950 dark:text-slate-100') ?>">
  <div class="wrap">
    <?= partial('topmenu') ?>
    <?= $view ?>
  </div>
  <?= partial('footer') ?>
  <script src="<?= asset('js/init.js', ['prefix' => 'framex', 'hash' => true]) ?>"></script>

</body>

</html>
