<?php
/// file: app/View/layouts/base.php

declare(strict_types=1);

/** @var string $content */
/** @var array<string, string> $meta */
/** @var string|null $page */
/** @var \App\Core\App $app */

$brand = \App\Models\SiteSetting::get('brand_name') ?: (string) $app->config('app.name', 'SANEKSA');
$tagline = \App\Models\SiteSetting::get('tagline') ?: 'Creative digital experience studio';
$meta = $meta ?? [];
$title = $meta['title'] ?? $brand;
$desc = $meta['description'] ?? $tagline;
$ogTitle = $meta['og_title'] ?? $title;
$ogDesc = $meta['og_description'] ?? $desc;
$ogImage = $meta['og_image'] ?? '';
$baseUrl = rtrim((string) $app->config('app.url', ''), '/');
$fullOg = $ogImage !== '' ? $baseUrl . (str_starts_with($ogImage, '/') ? $ogImage : '/' . $ogImage) : '';
$canonical = $baseUrl . ($_SERVER['REQUEST_URI'] ?? '/');
$page = $page ?? '';
$pageJson = json_encode($page, JSON_THROW_ON_ERROR | JSON_HEX_TAG | JSON_HEX_AMP | JSON_HEX_APOS | JSON_HEX_QUOT);
$baseJson = json_encode(base_url(), JSON_THROW_ON_ERROR | JSON_HEX_TAG | JSON_HEX_AMP | JSON_HEX_APOS | JSON_HEX_QUOT);
?>
<!DOCTYPE html>
<html lang="<?= e(\App\Core\Session::get('locale') ?: 'en') ?>" class="dark">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
    <meta name="theme-color" content="#0a0a0b">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <title><?= e($title) ?></title>
    <meta name="description" content="<?= e($desc) ?>">
    <link rel="canonical" href="<?= e($canonical) ?>">
    <meta property="og:title" content="<?= e($ogTitle) ?>">
    <meta property="og:description" content="<?= e($ogDesc) ?>">
    <?php if ($fullOg !== ''): ?>
    <meta property="og:image" content="<?= e($fullOg) ?>">
    <?php endif; ?>
    <meta name="robots" content="<?= e($meta['robots'] ?? 'index,follow') ?>">
    <meta name="csrf-token" content="<?= e(\App\Core\Csrf::token()) ?>">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,400&family=Instrument+Serif:ital@0;1&family=Inter:wght@100;200&family=Outfit:wght@200;300;400&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="<?= e(asset('css/main.css')) ?>">
    <link rel="stylesheet" href="<?= e(asset('css/hero-menu.css')) ?>">
    <link rel="stylesheet" href="<?= e(asset('css/mobile.css')) ?>">
    <?php if (($page ?? '') === 'work'): ?>
    <link rel="stylesheet" href="<?= e(asset('css/work-page.css')) ?>">
    <?php endif; ?>
    <script>window.__SANEKSA__={page:<?= $pageJson ?>,baseUrl:<?= $baseJson ?>};</script>
</head>
<body class="min-h-screen bg-carbon text-smoke-100 antialiased selection:bg-electric-500/30 selection:text-white" data-page="<?= e($page) ?>">
<?php \App\Core\View::component('preloader'); ?>
<script>
try {
    if (sessionStorage.getItem('saneksa:skipPreloaderOnce')) {
        var __p = document.getElementById('preloader');
        if (__p) {
            __p.classList.add('is-done');
            var __b = __p.querySelector('.preloader__bar-fill');
            if (__b) __b.style.transform = 'scaleX(1)';
        }
    }
} catch (e) {}
</script>
<div class="grain-overlay" aria-hidden="true"></div>
<?php \App\Core\View::component('custom-cursor'); ?>
<?php \App\Core\View::component('transition-overlay'); ?>
<?php \App\Core\View::component('header', ['brand' => $brand, 'page' => $page]); ?>
<div id="site-root" class="relative">
    <main id="main">
        <?= $content ?>
    </main>
    <?php \App\Core\View::component('footer', ['brand' => $brand, 'variant' => in_array(($page ?? ''), ['work', 'home'], true) ? 'minimal' : 'full']); ?>
</div>
<?php \App\Core\View::component('discover-overlay', ['brand' => $brand]); ?>
<script type="module" src="<?= e(asset('js/app.js')) ?>"></script>
</body>
</html>
