<?php
error_reporting(E_ALL);
ini_set('display_errors', 1);
session_start();
include "../include/config.php";

if (isset($_SESSION['email'])) {
    $news_id = isset($_GET['id']) ? intval($_GET['id']) : 0;

    $query = "SELECT id, image, title, message, date 
              FROM news 
              WHERE id = '$news_id' LIMIT 1";
    $result = mysqli_query($conn, $query);
    $news = mysqli_fetch_assoc($result);
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?php echo $news ? $news['title'] : "News"; ?></title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css">
    <meta name="theme-color" content="var(--primary)">
</head>
<style>
    body {
        background: #f9f9f9;
        font-family: "Source Sans Pro", sans-serif;
        font-size: 16px;
    }
    .content {
        margin-left: 210px;
        padding: 20px;
    }
    .news-card {
        background: white;
        padding: 25px;
        border-radius: 10px;
        box-shadow: 0 4px 15px rgba(0,0,0,0.08);
        max-width: 800px;
        margin: auto;
        transition: 0.3s;
    }
    .news-card:hover {
        box-shadow: 0 6px 20px rgba(0,0,0,0.12);
    }
    .news-title {
        color: var(--primary);
        font-size: 24px;
        font-weight: 700;
        margin-bottom: 10px;
    }
    .news-date {
        font-size: 14px;
        color: gray;
        margin-bottom: 20px;
        font-style: italic;
    }
    .news-message {
        font-size: 16px;
        color: #333;
        line-height: 1.6em;
        margin-top: 15px;
        text-align: justify;
    }
    .news-image {
        width: 100%;
        height: auto;
        border-radius: 8px;
        margin-bottom: 20px;
    }
    .back-btn {
        display: inline-block;
        margin-top: 20px;
        padding: 8px 16px;
        background: var(--primary);
        color: white;
        text-decoration: none;
        border-radius: 5px;
        transition: 0.3s;
        font-size: 14px;
    }
    .back-btn:hover {
        background: var(--primary);
        text-decoration: none;
    }
    .back-btn:hover{
    color: yellow;
    text-decoration:none;
    }
</style>
<body>
    <?php include "../include/nav.php"; ?>

    <div class="content">
        <br><br><br>
        <div class="news-card">
            <?php if ($news) { ?>
                <?php if (!empty($news['image'])) { ?>
                    <img src="../../students/img/<?php echo $news['image']; ?>" alt="News Image" class="news-image">
                <?php } ?>
                <div class="news-title"><?php echo $news['title']; ?></div>
                <div class="news-date">📅 <?php echo date("F j, Y", strtotime($news['date'])); ?></div>
                <div class="news-message"><?php echo nl2br($news['message']); ?></div>
                <a href="news.php" class="back-btn"><i class="fa fa-arrow-left"></i> Back to News</a>
            <?php } else { ?>
                <p style="color:red;">❌ News not found.</p>
            <?php } ?>
        </div>
    </div>
</body>
</html>
<?php
} else {
    header("location:../index.php");
}
?>