<?php
/** Ön yüz ana şablonu. $content ve $title dışarıdan gelir. */
$s = settings();
$biz = $s['business_name'] ?? 'QR Menü';
$logo = !empty($s['logo']) ? media_url($s['logo']) : '';
$mapLink = safe_url($s['map_url'] ?? '');
$igUser = !empty($s['instagram']) ? ltrim($s['instagram'], '@') : '';
?>
<!DOCTYPE html>
<html lang="tr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
<meta name="theme-color" content="<?= e($s['theme_bg'] ?? '#241104') ?>">
<meta name="description" content="<?= e($s['business_slogan'] ?? '') ?>">
<title><?= e($title ?? $biz) ?></title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="preload" href="<?= e(asset('assets/css/style.css')) ?>" as="style">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600&family=Nunito:wght@700;800;900&family=Playfair+Display:wght@700&display=swap" media="print" onload="this.media='all'">
<noscript><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600&family=Nunito:wght@700;800;900&family=Playfair+Display:wght@700&display=swap"></noscript>
<link rel="stylesheet" href="<?= e(asset('assets/css/style.css')) ?>">
<style>
:root{
    --p:<?= e($s['theme_primary'] ?? '#b9793a') ?>;
    --p2:<?= e($s['theme_secondary'] ?? '#e8b985') ?>;
    --bg:<?= e($s['theme_bg'] ?? '#241104') ?>;
    --surface:<?= e($s['theme_surface'] ?? '#2a1404') ?>;
    --text:<?= e($s['theme_text'] ?? '#fff2d8') ?>;
    --muted:<?= e($s['theme_muted'] ?? '#e8b985') ?>;
    --cream:<?= e($s['theme_text'] ?? '#fff2d8') ?>;
}
</style>
</head>
<body class="laos-front" oncontextmenu="return false">
<script>
(function(){document.addEventListener('contextmenu',function(e){e.preventDefault();},false);document.addEventListener('keydown',function(e){var k=e.keyCode||e.which,c=e.ctrlKey||e.metaKey;if(k===123||(c&&e.shiftKey&&(k===73||k===74||k===67))||(c&&k===85)||(c&&k===83))e.preventDefault();},false);})();
</script>

<div class="laos-desktop-wrap">
    <!-- PC sol panel — örnek site (laoscekmekoy.framer.ai) -->
    <aside class="laos-desktop-side" aria-label="Tanıtım">
        <div class="laos-desktop-side-inner">
            <span class="laos-badge"><?= e($s['hero_badge'] ?? "LAOS'A HOŞ GELDİNİZ") ?></span>
            <h1 class="laos-desktop-title"><?= e($s['business_slogan'] ?? 'Menüyü açın, kahvenizi seçin.') ?></h1>
            <p class="laos-desktop-sub"><?= e($s['hero_subtitle'] ?? 'Kategorilere dokunarak içecekleri, tatlıları ve atıştırmalıkları görebilir; fiyatları hızlıca inceleyebilirsiniz. Konum için yol tarifi alın, Instagram\'dan bizi takip edin.') ?></p>
            <div class="laos-chips laos-desktop-chips">
                <?php if ($mapLink): ?>
                    <a href="<?= e($mapLink) ?>" target="_blank" rel="noopener" class="laos-chip laos-chip-icon">
                        <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 21s7-4.5 7-11a7 7 0 1 0-14 0c0 6.5 7 11 7 11z"/><circle cx="12" cy="10" r="2.5"/></svg>
                        Konum
                    </a>
                <?php endif; ?>
                <?php if ($igUser): ?>
                    <a href="https://instagram.com/<?= e($igUser) ?>" target="_blank" rel="noopener" class="laos-chip laos-chip-icon">
                        <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="18" height="18" rx="5"/><circle cx="12" cy="12" r="4"/><circle cx="17.5" cy="6.5" r="1" fill="currentColor" stroke="none"/></svg>
                        Instagram
                    </a>
                <?php endif; ?>
            </div>
            <p class="laos-desktop-hint">Sağdaki telefondan menüyü inceleyin — mobil deneyimin aynısı.</p>
        </div>
    </aside>

    <!-- Telefon çerçevesi — menü burada mobil gibi -->
    <div class="laos-phone-col">
        <div class="laos-phone-frame">
            <div class="laos-phone-notch" aria-hidden="true"></div>
            <div class="laos-phone-screen" id="phoneScreen">
                <?= $content ?? '' ?>

                <footer class="site-footer">
                    <div class="container">
                        <?php if ($logo): ?>
                            <img class="foot-logo" src="<?= e($logo) ?>" alt="<?= e($biz) ?>">
                        <?php endif; ?>
                        <div class="foot-brand"><?= e($biz) ?></div>
                        <?php if (!empty($s['address'])): ?>
                            <p class="foot-address"><?= e($s['address']) ?></p>
                        <?php endif; ?>
                        <div class="foot-links">
                            <a href="<?= e(url('/')) ?>">Anasayfa</a>
                            <a href="<?= e(url('menu')) ?>">Menü</a>
                            <?php if (($s['show_events'] ?? '1') === '1'): ?>
                                <a href="<?= e(url('etkinlikler')) ?>">Etkinlikler</a>
                            <?php endif; ?>
                        </div>
                        <div class="foot-social">
                            <?php if ($mapLink): ?><a href="<?= e($mapLink) ?>" target="_blank" rel="noopener">Konum</a><?php endif; ?>
                            <?php if ($igUser): ?><a href="https://instagram.com/<?= e($igUser) ?>" target="_blank" rel="noopener">Instagram</a><?php endif; ?>
                            <?php if (!empty($s['phone'])): ?><a href="tel:<?= e(preg_replace('/\s+/','',$s['phone'])) ?>">Telefon</a><?php endif; ?>
                        </div>
                        <p class="foot-copy">© <?= date('Y') ?> <?= e($biz) ?> · QR Menü</p>
                    </div>
                </footer>
            </div>
            <div class="laos-phone-home" aria-hidden="true"></div>
        </div>
    </div>
</div>

<a class="admin-fab" href="<?= e(url('admin')) ?>" title="Yönetim" aria-label="Yönetim Paneli">⚙</a>
<script src="<?= e(asset('assets/js/app.js')) ?>" defer></script>
</body>
</html>
