<?php
/**
 * Blog Post Page
 * Digital Marketplace
 */

require_once __DIR__ . '/config/database.php';

$slug = sanitize($_GET['slug'] ?? '');

if (empty($slug)) {
    header('Location: ' . BASE_URL . '/blog.php');
    exit;
}

// Get blog post
$post = get_blog_post_by_slug($slug);

if (!$post) {
    header('Location: ' . BASE_URL . '/blog.php');
    exit;
}

$page_title = $post['title'];

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

<section class="section">
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-lg-10" data-aos="fade-up">
                <!-- Post Header -->
                <div class="text-center mb-5">
                    <h1 class="mb-3"><?php echo sanitize($post['title']); ?></h1>
                    <div class="blog-post-meta">
                        <span><i class="far fa-calendar me-1"></i><?php echo format_date($post['published_at']); ?></span>
                        <?php if ($post['author_name']): ?>
                        <span class="ms-3"><i class="far fa-user me-1"></i><?php echo sanitize($post['author_name']); ?></span>
                        <?php endif; ?>
                    </div>
                </div>
                
                <!-- Featured Image -->
                <?php if ($post['featured_image']): ?>
                <div class="blog-post-image mb-5">
                    <img src="<?php echo UPLOAD_URL . '/' . $post['featured_image']; ?>" 
                         alt="<?php echo sanitize($post['title']); ?>"
                         class="img-fluid rounded">
                </div>
                <?php endif; ?>
                
                <!-- Post Content -->
                <div class="blog-post-content">
                    <?php echo $post['content']; ?>
                </div>
                
                <!-- Post Footer -->
                <div class="blog-post-footer mt-5 pt-4 border-top border-secondary">
                    <div class="d-flex justify-content-between align-items-center">
                        <a href="<?php echo BASE_URL; ?>/blog.php" class="btn btn-outline-light">
                            <i class="fas fa-arrow-left me-2"></i>Back to Blog
                        </a>
                        
                        <!-- Social Share -->
                        <div class="social-share">
                            <span class="text-muted me-2">Share:</span>
                            <a href="https://www.facebook.com/sharer/sharer.php?u=<?php echo urlencode(get_current_url()); ?>" 
                               target="_blank" class="social-share-link">
                                <i class="fab fa-facebook-f"></i>
                            </a>
                            <a href="https://twitter.com/intent/tweet?url=<?php echo urlencode(get_current_url()); ?>&text=<?php echo urlencode($post['title']); ?>" 
                               target="_blank" class="social-share-link">
                                <i class="fab fa-twitter"></i>
                            </a>
                            <a href="https://www.linkedin.com/shareArticle?mini=true&url=<?php echo urlencode(get_current_url()); ?>" 
                               target="_blank" class="social-share-link">
                                <i class="fab fa-linkedin-in"></i>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

<style>
.blog-post-meta {
    color: var(--gray-500);
    font-size: 0.875rem;
}

.blog-post-image {
    border-radius: var(--radius);
    overflow: hidden;
}

.blog-post-image img {
    width: 100%;
    max-height: 500px;
    object-fit: cover;
}

.blog-post-content {
    color: var(--gray-300);
    line-height: 1.8;
    font-size: 1.125rem;
}

.blog-post-content h2,
.blog-post-content h3,
.blog-post-content h4 {
    color: var(--white);
    margin-top: 2rem;
    margin-bottom: 1rem;
}

.blog-post-content p {
    margin-bottom: 1.5rem;
}

.blog-post-content img {
    max-width: 100%;
    height: auto;
    border-radius: var(--radius);
    margin: 1.5rem 0;
}

.blog-post-content blockquote {
    border-left: 4px solid var(--primary);
    padding-left: 1.5rem;
    margin: 2rem 0;
    color: var(--gray-400);
    font-style: italic;
}

.social-share-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: var(--dark-lighter);
    border: 1px solid var(--gray-700);
    border-radius: var(--radius);
    color: var(--gray-400);
    margin-left: 0.5rem;
    transition: var(--transition);
}

.social-share-link:hover {
    background: var(--primary);
    border-color: var(--primary);
    color: var(--white);
}
</style>

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