<?php ?>
<!DOCTYPE html>
<?php 
$db = \App\Core\Database::getInstance();
$settingsRaw = $db->query("SELECT * FROM site_settings")->fetchAll();
$siteSettings = [];
foreach ($settingsRaw as $s) $siteSettings[$s['key']] = $s['value'];
$siteName = $siteSettings['site_name'] ?? 'FreeCMS';
?>
<html lang="<?= \App\Helpers\Lang::get() === 'ua' ? 'uk' : \App\Helpers\Lang::get() ?>" data-theme="light">
<head>
    <script>
        // Critical: Apply theme before body renders to prevent flicker
        (function() {
            const savedTheme = localStorage.getItem('theme') || '<?= ($siteSettings['dark_mode_default'] ?? "0") == "1" ? "dark" : "light" ?>';
            document.documentElement.setAttribute('data-theme', savedTheme);
        })();
    </script>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
    <meta name="author" content="MAKATANGA">
    <meta name="generator" content="FreeCMS by MAKATANGA">
    <meta name="theme-color" content="#6366f1" media="(prefers-color-scheme: dark)">
    <meta name="theme-color" content="#6366f1" media="(prefers-color-scheme: light)">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
    <meta name="apple-mobile-web-app-title" content="FreeCMS">
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="csrf-token" content="<?= \App\Core\CSRF::generateToken() ?>">
    <title><?= $title ?? $siteName ?> | CMS Forum Platform For You</title>
    <link rel="stylesheet" href="/assets/css/style.css">
    <link rel="stylesheet" href="/assets/css/ui-new.css">
    <link rel="manifest" href="/manifest.json">
    <link rel="icon" type="image/png" sizes="32x32" href="/public/assets/images/favicon-32x32.png">
    <link rel="icon" type="image/png" sizes="16x16" href="/public/assets/images/favicon-16x16.png">
    <link rel="apple-touch-icon" href="/public/assets/images/apple-touch-icon.png">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
</head>
<body>
    <div id="scroll-progress"></div>
    <nav>
        <div class="container nav-content">
            <a href="/" class="logo"><?= htmlspecialchars($siteName) ?></a>

            <!-- Hamburger (mobile only) -->
            <button id="mobile-menu-btn" onclick="toggleMobileMenu()" aria-label="Menu">
                <span></span><span></span><span></span>
            </button>
            
            <div class="search-wrapper">
                <form action="/search" method="GET" style="display: flex;">
                    <i class="fas fa-search" style="position: absolute; left: 1rem; top: 50%; transform: translateY(-50%); color: var(--text-muted); pointer-events: none;"></i>
                    <input id="global-search-input" type="text" name="q" class="form-control" placeholder="<?= \App\Helpers\Lang::t('search') ?>..." style="padding-left: 2.75rem;">
                </form>
            </div>

            <div class="nav-desktop-actions" style="display: flex; gap: 0.75rem; align-items: center;">
                <div style="position: relative; display: inline-block;">
                    <select id="lang-select" onchange="setLang(this.value)" class="form-control" style="width: auto; padding: 0.25rem 0.5rem; background: transparent; border: 1px solid var(--border); cursor: pointer;">
                        <option value="en" <?= (\App\Helpers\Lang::get() == 'en') ? 'selected' : '' ?>>EN</option>
                        <option value="ua" <?= (\App\Helpers\Lang::get() == 'ua') ? 'selected' : '' ?>>UA</option>
                        <option value="ru" <?= (\App\Helpers\Lang::get() == 'ru') ? 'selected' : '' ?>>RU</option>
                        <option value="pl" <?= (\App\Helpers\Lang::get() == 'pl') ? 'selected' : '' ?>>PL</option>
                    </select>
                </div>

                <button id="theme-toggle" onclick="toggleTheme()" class="btn" style="background: var(--bg); border: 1px solid var(--border); color: var(--text); padding: 0.5rem 0.75rem; border-radius: 50%; width: 40px; height: 40px; justify-content: center;">
                    <i class="fas fa-moon"></i>
                </button>
                
                <?php if (\App\Core\Session::has('user_id')): 
                    $currUser = (new \App\Models\User())->find(\App\Core\Session::get('user_id'));
                ?>
                    <?php if (\App\Core\Session::get('role') == 3): ?>
                        <a href="/admin" class="btn" style="background: rgba(234, 179, 8, 0.1); color: #eab308; border: 1px solid rgba(234, 179, 8, 0.2); font-weight: 700; font-size: 0.9rem; margin-right: 0.5rem; display: flex; align-items: center; gap: 0.5rem;">
                            <i class="fas fa-shield-alt"></i> <?= \App\Helpers\Lang::t('admin') ?>
                        </a>
                    <?php endif; ?>

                    <a href="/post/create" class="btn btn-primary" style="padding: 0.5rem 1rem; font-size: 0.9rem; margin-right: 0.5rem;">
                        <i class="fas fa-plus"></i> <?= \App\Helpers\Lang::t('new_topic') ?>
                    </a>
                    
                    <div style="position: relative;">
                <a id="bookmarks-btn" href="#" class="btn" title="<?= \App\Helpers\Lang::t('bookmarks') ?>" style="background: var(--bg); border: 1px solid var(--border); color: var(--text); padding: 0.5rem 0.75rem; border-radius: 50%; width: 40px; height: 40px; justify-content: center; position: relative; margin-right:0.5rem;">
                            <i class="fas fa-bookmark"></i>
                        </a>
                <a id="multi-col-btn" href="#" class="btn" title="<?= \App\Helpers\Lang::t('multi_column') ?>" style="background: var(--bg); border: 1px solid var(--border); color: var(--text); padding: 0.5rem 0.75rem; border-radius: 50%; width: 40px; height: 40px; justify-content: center; position: relative; margin-right:0.5rem;">
                            <i class="fas fa-columns"></i>
                        </a>
                <a id="notification-bell" href="/notifications" class="btn notification-bell" style="background: var(--bg); border: 1px solid var(--border); color: var(--text); padding: 0.5rem 0.75rem; border-radius: 50%; width: 40px; height: 40px; justify-content: center; position: relative;">
                            <i class="fas fa-bell"></i>
                        </a>
                        <div id="notification-dropdown" class="notification-dropdown hidden"></div>
                    </div>
                    <a id="message-icon" href="/messages" class="btn" style="background: var(--bg); border: 1px solid var(--border); color: var(--text); padding: 0.5rem 0.75rem; border-radius: 50%; width: 40px; height: 40px; justify-content: center;">
                        <i class="fas fa-envelope"></i>
                    </a>
                    
                    <div style="height: 32px; width: 1px; background: var(--border); margin: 0 0.5rem;"></div>
                    
                    <a href="/u/current" style="display: flex; align-items: center; gap: 0.75rem; text-decoration: none; color: var(--text); font-weight: 600;">
                        <img src="<?= \App\Helpers\Asset::avatar($currUser['avatar'] ?? null, $currUser['username'] ?? 'User', 36) ?>" style="width: 36px; height: 36px; border-radius: 50%; border: 2px solid var(--primary); object-fit: cover;">
                    </a>
                    <a href="/logout" class="btn btn-primary" style="padding: 0.5rem 1rem; font-size: 0.9rem;"><?= \App\Helpers\Lang::t('logout') ?></a>
                <?php else: ?>
                    <a href="/login" style="font-weight: 600; margin-right: 0.5rem;"><?= \App\Helpers\Lang::t('login') ?></a>
                    <a href="/register" class="btn btn-primary" style="padding: 0.5rem 1.25rem; font-size: 0.9rem;"><?= \App\Helpers\Lang::t('register') ?></a>
                <?php endif; ?>
            </div>
        </div>
    </nav>

    <!-- Mobile Nav Drawer -->
    <div id="mobile-nav-drawer">
        <a href="/" onclick="closeMobileMenu()"><i class="fas fa-home"></i> <?= \App\Helpers\Lang::t('home') ?></a>
        <?php if (\App\Core\Session::has('user_id')): ?>
            <a href="/post/create" onclick="closeMobileMenu()"><i class="fas fa-plus-circle"></i> <?= \App\Helpers\Lang::t('new_topic') ?></a>
            <a href="/u/current" onclick="closeMobileMenu()"><i class="fas fa-user"></i> <?= \App\Helpers\Lang::t('profile') ?></a>
            <a href="/messages" onclick="closeMobileMenu()"><i class="fas fa-envelope"></i> <?= \App\Helpers\Lang::t('messages') ?></a>
            <a href="/notifications" onclick="closeMobileMenu()"><i class="fas fa-bell"></i> <?= \App\Helpers\Lang::t('notifications') ?></a>
            <?php if (\App\Core\Session::get('role') == 3): ?>
                <a href="/admin" onclick="closeMobileMenu()"><i class="fas fa-shield-alt"></i> <?= \App\Helpers\Lang::t('admin') ?></a>
            <?php endif; ?>
            <a href="/search" onclick="closeMobileMenu()"><i class="fas fa-search"></i> <?= \App\Helpers\Lang::t('search') ?></a>
            <a href="/logout" style="color: #ef4444; border-color: rgba(239,68,68,0.3);"><i class="fas fa-sign-out-alt"></i> <?= \App\Helpers\Lang::t('logout') ?></a>
        <?php else: ?>
            <a href="/login" onclick="closeMobileMenu()"><i class="fas fa-sign-in-alt"></i> <?= \App\Helpers\Lang::t('login') ?></a>
            <a href="/register" onclick="closeMobileMenu()" style="background: var(--primary); color: white; border-color: var(--primary);"><i class="fas fa-user-plus"></i> <?= \App\Helpers\Lang::t('register') ?></a>
        <?php endif; ?>
        <div style="padding: 0.5rem 0; border-top: 1px solid var(--border); display: flex; gap: 0.5rem; flex-wrap: wrap;">
            <?php foreach(['en'=>'EN','ua'=>'UA','ru'=>'RU','pl'=>'PL'] as $code => $label): ?>
                <button onclick="setLang('<?= $code ?>'); closeMobileMenu();" style="flex: 1; min-width: 60px; border: 1px solid <?= \App\Helpers\Lang::get()==$code ? 'var(--primary)' : 'var(--border)' ?>; background: <?= \App\Helpers\Lang::get()==$code ? 'var(--primary-light)' : 'var(--bg)' ?>; color: <?= \App\Helpers\Lang::get()==$code ? 'var(--primary)' : 'var(--text-muted)' ?>; border-radius: 0.75rem; padding: 0.5rem; font-weight: 700; cursor: pointer;"><?= $label ?></button>
            <?php endforeach; ?>
        </div>
    </div>

    <!-- Bottom Nav Bar (mobile) -->
    <nav id="bottom-nav">
        <a href="/" class="bottom-nav-item <?= ($_SERVER['REQUEST_URI'] === '/' ? 'active' : '') ?>">
            <i class="fas fa-home"></i>
            <span><?= \App\Helpers\Lang::t('home') ?></span>
        </a>
        <a href="/search" class="bottom-nav-item">
            <i class="fas fa-search"></i>
            <span><?= \App\Helpers\Lang::t('search') ?></span>
        </a>
        <?php if (\App\Core\Session::has('user_id')): ?>
            <a href="/post/create" class="bottom-nav-item primary-action" title="<?= \App\Helpers\Lang::t('new_topic') ?>">
                <i class="fas fa-plus"></i>
            </a>
            <a href="/notifications" class="bottom-nav-item" style="position: relative;">
                <i class="fas fa-bell"></i>
                <span><?= \App\Helpers\Lang::t('notifications') ?></span>
            </a>
            <a href="/u/current" class="bottom-nav-item">
                <i class="fas fa-user"></i>
                <span><?= \App\Helpers\Lang::t('profile') ?></span>
            </a>
        <?php else: ?>
            <a href="/login" class="bottom-nav-item primary-action" title="<?= \App\Helpers\Lang::t('login') ?>">
                <i class="fas fa-sign-in-alt"></i>
            </a>
            <a href="/register" class="bottom-nav-item">
                <i class="fas fa-user-plus"></i>
                <span><?= \App\Helpers\Lang::t('register') ?></span>
            </a>
        <?php endif; ?>
    </nav>

    <?php 
    $browserLang = \App\Helpers\Lang::detected();
    $currentLang = \App\Helpers\Lang::get();
    
    if ($browserLang !== $currentLang && !isset($_COOKIE['skip_lang_suggest'])): ?>
        <div id="lang-suggestion" class="fade-in" style="background: var(--primary); color: white; padding: 0.6rem 1rem; position: relative; z-index: 900;">
            <div style="display: flex; justify-content: center; align-items: center; gap: 0.75rem; flex-wrap: wrap; max-width: 1280px; margin: 0 auto;">
                <span style="font-size: 0.85rem; text-align: center;">
                    <?= sprintf(\App\Helpers\Lang::t('suggest_lang'), strtoupper($browserLang)) ?>
                </span>
                <div style="display: flex; gap: 0.5rem; flex-shrink: 0;">
                    <a href="/language?lang=<?= $browserLang ?>" class="btn" style="background: white; color: var(--primary); padding: 0.35rem 0.9rem; font-size: 0.8rem; border-radius: 2rem; min-height: auto;">
                        <?= sprintf(\App\Helpers\Lang::t('switch_to'), strtoupper($browserLang)) ?>
                    </a>
                    <button onclick="closeLangSuggest()" class="btn" style="background: rgba(255,255,255,0.2); color: white; padding: 0.35rem 0.75rem; font-size: 0.8rem; border-radius: 2rem; min-height: auto;">
                        <i class="fas fa-times"></i>
                    </button>
                </div>
            </div>
        </div>
        <script>
            function closeLangSuggest() {
                document.getElementById('lang-suggestion').style.display = 'none';
                document.cookie = "skip_lang_suggest=1; path=/; max-age=" + (30 * 24 * 60 * 60);
            }
        </script>
    <?php endif; ?>

    <main class="container" style="margin-top: 2rem; padding-bottom: 5rem;">
        <?php if ($success = \App\Core\Session::flash('success')): ?>
            <div class="card fade-in" style="background: rgba(16, 185, 129, 0.1); color: #10b981; border: 1px solid rgba(16, 185, 129, 0.2); margin-bottom: 2rem;">
                <i class="fas fa-check-circle" style="margin-right: 0.5rem;"></i> <?= $success ?>
            </div>
        <?php endif; ?>

        <?php if ($error = \App\Core\Session::flash('error')): ?>
            <div class="card fade-in" style="background: rgba(239, 68, 68, 0.1); color: #ef4444; border: 1px solid rgba(239, 68, 68, 0.2); margin-bottom: 2rem;">
                <i class="fas fa-exclamation-circle" style="margin-right: 0.5rem;"></i> <?= $error ?>
            </div>
        <?php endif; ?>

        <?= $content ?>
    </main>

    <footer style="background: var(--bg); border-top: 1px solid var(--border); padding: 5rem 0 2rem 0; margin-top: 5rem;">
        <div class="container" style="display: grid; grid-template-columns: 2fr 1fr 1fr 1.5fr; gap: 4rem;">
            <div>
                <a href="/" class="logo" style="display: inline-block; margin-bottom: 1.5rem;"><?= htmlspecialchars($siteName) ?></a>
                <p style="color: var(--text-muted); line-height: 1.8;">
                    <?= htmlspecialchars($siteSettings['meta_description'] ?? \App\Helpers\Lang::t('footer_desc')) ?>
                </p>
                <div style="display: flex; gap: 1rem; margin-top: 2rem;">
                    <a href="#" class="btn" style="width: 40px; height: 40px; border-radius: 50%; padding: 0; justify-content: center; background: var(--card);"><i class="fab fa-twitter"></i></a>
                    <a href="#" class="btn" style="width: 40px; height: 40px; border-radius: 50%; padding: 0; justify-content: center; background: var(--card);"><i class="fab fa-github"></i></a>
                    <a href="#" class="btn" style="width: 40px; height: 40px; border-radius: 50%; padding: 0; justify-content: center; background: var(--card);"><i class="fab fa-discord"></i></a>
                </div>
            </div>
            <div>
                <h4 style="margin-bottom: 1.5rem;"><?= \App\Helpers\Lang::t('categories') ?></h4>
                <ul style="list-style: none; display: flex; flex-direction: column; gap: 0.75rem;">
                    <?php 
                    $footerCats = (new \App\Models\Category())->all();
                    foreach ($footerCats as $fCat): ?>
                        <li><a href="/c/<?= $fCat['slug'] ?>" style="color: var(--text-muted); text-decoration: none;"><?= htmlspecialchars($fCat['name']) ?></a></li>
                    <?php endforeach; ?>
                </ul>
            </div>
            <div>
                <h4 style="margin-bottom: 1.5rem;"><?= \App\Helpers\Lang::t('footer_platform') ?></h4>
                <ul style="list-style: none; display: flex; flex-direction: column; gap: 0.75rem;">
                    <?php 
                    $footerPages = (new \App\Models\Page())->all();
                    foreach ($footerPages as $fPage): 
                        if (!$fPage['is_active']) continue;
                    ?>
                        <li><a href="/p/<?= $fPage['slug'] ?>" style="color: var(--text-muted); text-decoration: none;"><?= htmlspecialchars($fPage['title']) ?></a></li>
                    <?php endforeach; ?>
                </ul>
            </div>
            <div>
                <h4 style="margin-bottom: 1.5rem;"><?= \App\Helpers\Lang::t('footer_newsletter') ?></h4>
                <p style="color: var(--text-muted); font-size: 0.9rem; margin-bottom: 1rem;"><?= \App\Helpers\Lang::t('footer_newsletter_desc') ?></p>
                <div style="display: flex; gap: 0.5rem;">
                    <input type="email" placeholder="Email" class="form-control" style="flex: 1;">
                    <button class="btn btn-primary" style="padding: 0.5rem 1rem;"><?= \App\Helpers\Lang::t('footer_join') ?></button>
                </div>
            </div>
        </div>
        <div class="container" style="margin-top: 4rem; padding-top: 2rem; border-top: 1px solid var(--border); display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 0.75rem;">
            <span style="color: var(--text-muted); font-size: 0.85rem;">
                &copy; <?= date('Y') ?> <?= htmlspecialchars($siteName) ?>. <?= htmlspecialchars($siteSettings['footer_text'] ?? \App\Helpers\Lang::t('footer_rights')) ?>
            </span>

        </div>
    </footer>
    
    <!-- Floating Actions (PC Only) -->
    <button id="scroll-top" style="display: none; position: fixed; bottom: 2rem; right: 2rem; width: 50px; height: 50px; border-radius: 50%; background: var(--primary); color: white; border: none; cursor: pointer; box-shadow: 0 4px 12px rgba(0,0,0,0.3); z-index: 1000; transition: var(--transition);"><i class="fas fa-arrow-up"></i></button>

    <!-- User Hover Card (PC Only) -->
    <div id="user-hover-card" style="display: none; position: absolute; z-index: 1500; width: 300px; pointer-events: none; transition: opacity 0.2s;">
        <div class="card" style="padding: 0; overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,0.3); border: 1px solid var(--primary);">
            <div id="hover-card-cover" style="height: 80px; background: var(--primary); background-size: cover; background-position: center;"></div>
            <div style="padding: 1.5rem; margin-top: -40px;">
                <img id="hover-card-avatar" src="" style="width: 80px; height: 80px; border-radius: 50%; border: 4px solid var(--card); background: var(--card); object-fit: cover; margin-bottom: 1rem;">
                <h3 id="hover-card-username" style="margin: 0;"></h3>
                <div style="display: flex; gap: 1rem; margin: 0.5rem 0; font-size: 0.85rem; color: var(--text-muted);">
                    <span><i class="fas fa-star" style="color: #eab308;"></i> <span id="hover-card-reputation"></span> Rep</span>
                    <span><i class="fas fa-calendar"></i> <span id="hover-card-joined"></span></span>
                </div>
                <p id="hover-card-bio" style="font-size: 0.9rem; line-height: 1.4; margin-bottom: 0;"></p>
            </div>
        </div>
    </div>
    
    <!-- Command Palette Overlay -->
    <div id="cmd-palette" style="display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.8); z-index: 2000; backdrop-filter: blur(8px); padding-top: 15vh; transition: var(--transition);">
        <div class="container" style="max-width: 600px;">
            <div class="card" style="padding: 0; overflow: hidden; border: 1px solid var(--primary); box-shadow: 0 0 40px var(--primary-light);">
                <div style="padding: 1.5rem; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 1rem;">
                    <i class="fas fa-terminal" style="color: var(--primary);"></i>
                    <input type="text" id="cmd-input" placeholder="Type a command or jump to..." style="flex: 1; background: transparent; border: none; color: var(--text); font-size: 1.25rem; outline: none; font-family: inherit;">
                    <kbd style="background: var(--bg); padding: 0.2rem 0.5rem; border-radius: 4px; font-size: 0.8rem; border: 1px solid var(--border);">ESC</kbd>
                </div>
                <div id="cmd-results" style="max-height: 350px; overflow-y: auto; padding: 0.5rem;">
                    <div class="cmd-item" data-url="/" style="padding: 1rem; border-radius: 0.75rem; display: flex; align-items: center; gap: 1rem; cursor: pointer; transition: var(--transition);">
                        <i class="fas fa-home"></i> <span><?= \App\Helpers\Lang::t('home') ?></span> <kbd style="margin-left: auto; opacity: 0.5;">G H</kbd>
                    </div>
                    <div class="cmd-item" data-url="/notifications" style="padding: 1rem; border-radius: 0.75rem; display: flex; align-items: center; gap: 1rem; cursor: pointer; transition: var(--transition);">
                        <i class="fas fa-bell"></i> <span><?= \App\Helpers\Lang::t('notifications') ?></span> <kbd style="margin-left: auto; opacity: 0.5;">N</kbd>
                    </div>
                    <div class="cmd-item" data-url="/messages" style="padding: 1rem; border-radius: 0.75rem; display: flex; align-items: center; gap: 1rem; cursor: pointer; transition: var(--transition);">
                        <i class="fas fa-envelope"></i> <span><?= \App\Helpers\Lang::t('private_messages') ?></span> <kbd style="margin-left: auto; opacity: 0.5;">M</kbd>
                    </div>
                    <div class="cmd-item" data-action="theme" style="padding: 1rem; border-radius: 0.75rem; display: flex; align-items: center; gap: 1rem; cursor: pointer; transition: var(--transition);">
                        <i class="fas fa-adjust"></i> <span><?= \App\Helpers\Lang::t('toggle_theme') ?></span> <kbd style="margin-left: auto; opacity: 0.5;">T</kbd>
                    </div>
                    <div class="cmd-item" data-url="/post/create" style="padding: 1rem; border-radius: 0.75rem; display: flex; align-items: center; gap: 1rem; cursor: pointer; transition: var(--transition);">
                        <i class="fas fa-plus"></i> <span><?= \App\Helpers\Lang::t('create_discussion') ?></span> <kbd style="margin-left: auto; opacity: 0.5;">C</kbd>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <style>
    .cmd-item:hover, .cmd-item.selected {
        background: var(--primary-light);
        color: var(--primary);
    }
    .cmd-item i { width: 20px; text-align: center; }
    </style>

    <script>
    document.addEventListener('keydown', (e) => {
        const palette = document.getElementById('cmd-palette');
        const input = document.getElementById('cmd-input');

        if ((e.ctrlKey || e.metaKey) && e.key === 'k') {
            e.preventDefault();
            palette.style.display = 'block';
            input.focus();
        }

        if (e.key === 'Escape' && palette.style.display === 'block') {
            palette.style.display = 'none';
        }
    });

    document.querySelectorAll('.cmd-item').forEach(item => {
        item.addEventListener('click', () => {
            if (item.dataset.url) window.location.href = item.dataset.url;
            if (item.dataset.action === 'theme') {
                toggleTheme();
                document.getElementById('cmd-palette').style.display = 'none';
            }
        });
    });

    document.getElementById('cmd-palette').addEventListener('click', (e) => {
        if (e.target.id === 'cmd-palette') {
            e.target.style.display = 'none';
        }
    });
    </script>

    <script>
        window.translations = {
            bookmarks: "<?= \App\Helpers\Lang::t('bookmarks') ?>",
            history: "<?= \App\Helpers\Lang::t('history') ?>",
            add_current_page: "<?= \App\Helpers\Lang::t('add_current_page') ?>",
            empty: "<?= \App\Helpers\Lang::t('empty') ?>",
            saved: "<?= \App\Helpers\Lang::t('saved') ?>",
            clear_all: "<?= \App\Helpers\Lang::t('clear_all') ?>",
            loading: "<?= \App\Helpers\Lang::t('loading') ?>",
            new_post: "<?= \App\Helpers\Lang::t('new_topic') ?>",
            what_is_on_your_mind: "<?= \App\Helpers\Lang::t('what_is_on_your_mind') ?>",
            editor: "<?= \App\Helpers\Lang::t('editor_label') ?>",
            new_version_available: "<?= \App\Helpers\Lang::t('new_version_available') ?>",
            update: "<?= \App\Helpers\Lang::t('update') ?>",
            stop: "<?= \App\Helpers\Lang::t('stop_reading') ?>",
            translate: "<?= \App\Helpers\Lang::t('translate') ?>",
            original: "<?= \App\Helpers\Lang::t('show_original') ?>",
            error_translation: "<?= \App\Helpers\Lang::t('error_wrong') ?>",
            error_file_size: "<?= \App\Helpers\Lang::t('error_file_large') ?>",
            feature_change_email: "<?= \App\Helpers\Lang::t('feature_change_email') ?>",
            feature_change_password: "<?= \App\Helpers\Lang::t('feature_change_password') ?>",
            feature_enable_2fa: "<?= \App\Helpers\Lang::t('feature_enable_2fa') ?>",
            confirm_logout_all: "<?= \App\Helpers\Lang::t('confirm_logout_all') ?>",
            logout_all_success: "<?= \App\Helpers\Lang::t('logout_all_success') ?>",
            feature_view_blocked: "<?= \App\Helpers\Lang::t('feature_view_blocked') ?>",
            downloading_data: "<?= \App\Helpers\Lang::t('downloading_data') ?>",
            confirm_delete_all_data: "<?= \App\Helpers\Lang::t('confirm_delete_all_data') ?>",
            data_delete_notice: "<?= \App\Helpers\Lang::t('data_delete_notice') ?>",
            confirm_delete_account_final: "<?= \App\Helpers\Lang::t('confirm_delete_account_final') ?>",
            enter_password_confirm: "<?= \App\Helpers\Lang::t('enter_password_confirm') ?>",
            account_will_be_deleted: "<?= \App\Helpers\Lang::t('account_will_be_deleted') ?>",
            privacy_settings_saved: "<?= \App\Helpers\Lang::t('privacy_settings_saved') ?>",
            general: "<?= \App\Helpers\Lang::t('general') ?>",
            appearance: "<?= \App\Helpers\Lang::t('appearance') ?>",
            notifications: "<?= \App\Helpers\Lang::t('notifications') ?>",
            shortcuts: "<?= \App\Helpers\Lang::t('shortcuts') ?>",
            privacy: "<?= \App\Helpers\Lang::t('privacy') ?>",
            accessibility: "<?= \App\Helpers\Lang::t('accessibility') ?>",
            settings_saved_section: "<?= \App\Helpers\Lang::t('settings_saved_section') ?>"
        };
    </script>
    <script src="/assets/js/app.js"></script>
    <script src="/assets/js/desktop-features.js"></script>
    <script src="/assets/js/main.js"></script>
</body>
</html>
