<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title><?= isset($title) ? htmlspecialchars($title) : 'EasyChair' ?></title>

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- Bootstrap -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">

    <!-- Cairo Font -->
    <link href="https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;600;700&display=swap" rel="stylesheet">

    <style>
        body {
            font-family: 'Cairo', sans-serif;
            background: #f5f7fb;
        }

        .navbar-brand {
            font-weight: 700;
        }

        .container-main {
            padding-top: 25px;
            padding-bottom: 40px;
        }
    </style>
</head>

<body>

<nav class="navbar navbar-expand-lg navbar-dark bg-primary">
    <div class="container">

        <a class="navbar-brand" href="/easychair">
            EasyChair
        </a>

        <div class="ms-auto">

            <?php if (!empty($_SESSION['user_id'])): ?>

                <a href="/easychair/dashboard" class="btn btn-light btn-sm me-2">
                    Dashboard
                </a>

                <a href="/easychair/logout" class="btn btn-danger btn-sm">
                    Logout
                </a>

            <?php else: ?>

                <a href="/easychair/login" class="btn btn-light btn-sm">
                    Login
                </a>

            <?php endif; ?>

        </div>

    </div>
</nav>

<div class="container container-main">

    <?= $content ?>

</div>

<footer class="text-center text-muted py-4">
    EasyChair Conference System
</footer>

</body>
</html>
