<?php
declare(strict_types=1);
require_once __DIR__ . '/includes/functions.php';
require_once __DIR__ . '/includes/middleware.php';
$pdo = require __DIR__ . '/config/database.php';

$slug = $_GET['slug'] ?? '';
if (empty($slug)) {
    redirect('/blog');
}

$stmt = $pdo->prepare("
    SELECT p.*, s.seo_title, s.meta_description, s.focus_keyword, s.meta_keywords, s.og_title, s.og_description, s.twitter_title, s.twitter_description, s.canonical_url, s.robots_index 
    FROM blog_posts p 
    LEFT JOIN blog_seo s ON p.id = s.post_id 
    WHERE p.slug = ? AND p.status = 'published'
");
$stmt->execute([$slug]);
$post = $stmt->fetch();

if (!$post) {
    include __DIR__ . '/includes/header.php';
    echo '<section class="section" style="text-align:center; padding: 100px 20px;"><h1>Article Not Found</h1><p>The blog post you are looking for does not exist or has been removed.</p><a href="'.url('blog').'" class="btn primary">Back to Blog</a></section>';
    include __DIR__ . '/includes/footer.php';
    exit;
}

$meta = [
    'title' => $post['seo_title'] ?: $post['title'] . ' | Go Legal Blog',
    'description' => $post['meta_description'] ?: $post['excerpt'],
    'canonical' => $post['canonical_url'] ?: url('blog/' . $post['slug'])
];

include __DIR__ . '/includes/header.php';
?>

<article class="section" style="padding-top: 48px;">
    <div style="max-width: 800px; margin: 0 auto;">
        <header style="margin-bottom: 48px;">
            <div style="margin-bottom: 16px;">
                <a href="<?=url('blog')?>" style="text-decoration: none; color: var(--primary); font-weight: 600; font-size: 14px; display: flex; align-items: center; gap: 8px;">
                    <?=ui_icon('dashboard', 16)?> Back to Blog
                </a>
            </div>
            <h1 style="font-size: 42px; font-weight: 800; line-height: 1.1; margin: 0 0 24px; letter-spacing: -0.03em;"><?=e($post['title'])?></h1>
            <div style="display: flex; align-items: center; gap: 16px; color: var(--muted); font-size: 14px;">
                <div style="display: flex; align-items: center; gap: 6px;">
                    <span class="tavatar" style="width: 32px; height: 32px; font-size: 12px; background: var(--primary-tint); color: var(--primary);">GL</span>
                    <strong>Go Legal Team</strong>
                </div>
                <div style="width: 4px; height: 4px; border-radius: 50%; background: var(--border);"></div>
                <div><?=date('M j, Y', strtotime($post['published_at'] ?? $post['created_at']))?></div>
                <div style="width: 4px; height: 4px; border-radius: 50%; background: var(--border);"></div>
                <div><?=ceil(str_word_count((string)$post['content']) / 200)?> min read</div>
            </div>
        </header>

        <?php if ($post['featured_image']): ?>
            <div style="margin-bottom: 48px; border-radius: 24px; overflow: hidden; box-shadow: var(--shadow-lg);">
                <img src="<?=url($post['featured_image'])?>" alt="<?=e($post['title'])?>" style="width: 100%; height: auto; display: block;">
            </div>
        <?php endif; ?>

        <div class="blog-content" style="font-size: 18px; line-height: 1.8; color: #334155;">
            <?= nl2br((string)$post['content']) ?>
        </div>

        <footer style="margin-top: 64px; padding-top: 40px; border-top: 1px solid var(--border);">
            <div class="card" style="background: var(--hairline); border: none; display: flex; gap: 24px; align-items: center; padding: 32px;">
                <div style="width: 64px; height: 64px; border-radius: 50%; background: var(--primary); color: white; display: flex; align-items: center; justify-content: center; font-size: 24px; font-weight: 800; flex-shrink: 0;">GL</div>
                <div>
                    <h4 style="margin: 0 0 8px;">About Go Legal</h4>
                    <p class="muted" style="margin: 0; font-size: 15px;">Go Legal is Nigeria's most trusted platform for business registration, company incorporation, and legal compliance. We help founders build their dreams on a solid legal foundation.</p>
                </div>
            </div>
        </footer>
    </div>
</article>

<style>
.blog-content h2 { font-size: 28px; margin: 40px 0 20px; color: var(--text); font-weight: 700; }
.blog-content h3 { font-size: 22px; margin: 32px 0 16px; color: var(--text); font-weight: 700; }
.blog-content p { margin-bottom: 24px; }
.blog-content ul, .blog-content ol { margin-bottom: 24px; padding-left: 24px; }
.blog-content li { margin-bottom: 12px; }
.blog-content blockquote { border-left: 4px solid var(--primary); padding-left: 24px; font-style: italic; color: var(--muted); margin: 32px 0; }
</style>

<?php include __DIR__ . '/includes/footer.php'; ?>
