<?php
// Detect current page for active highlighting
$current = basename($_SERVER['PHP_SELF']);
?>
<style>
    .menu-bar {
        background: #111;
        padding: 10px;
        border-bottom: 1px solid #333;
        display: flex;
        gap: 20px;
        align-items: center;
    }

    .menu-link {
        color: #ccc;
        text-decoration: none;
        display: flex;
        align-items: center;
        gap: 6px;
        padding: 6px 10px;
        border-radius: 4px;
        border: 1px solid transparent;
    }

    .menu-link:hover {
        background: #222;
        border-color: #444;
    }

    .menu-active {
        background: #ffcc66;
        color: #000 !important;
        border-color: #ffcc66;
    }

    .menu-icon {
        width: 18px;
        height: 18px;
    }
</style>

<div class="menu-bar">

    <a class="menu-link <?= $current=='dashboard.php'?'menu-active':'' ?>" href="../pages/dashboard.php">
        <img src="../assets/images/icons/home.svg" class="menu-icon"> Dashboard
    </a>

    <a class="menu-link <?= $current=='calendar.php'?'menu-active':'' ?>" href="../pages/calendar.php">
        <img src="../assets/images/icons/calendar.svg" class="menu-icon"> Calendar
    </a>

    <a class="menu-link <?= $current=='ladder.php'?'menu-active':'' ?>" href="../pages/ladder.php">
        <img src="../assets/images/icons/trophy.svg" class="menu-icon"> Ladder
    </a>

    <a class="menu-link <?= $current=='inventory_view.php'?'menu-active':'' ?>" href="../pages/inventory_view.php">
        <img src="../assets/images/icons/bag.svg" class="menu-icon"> Inventory
    </a>

    <a class="menu-link <?= $current=='inventory.php'?'menu-active':'' ?>" href="../pages/inventory.php">
        <img src="../assets/images/icons/upload.svg" class="menu-icon"> Upload Item
    </a>

    <a class="menu-link <?= $current=='habits.php'?'menu-active':'' ?>" href="../pages/habits.php">
        <img src="../assets/images/icons/scroll.svg" class="menu-icon"> Upload Habit
    </a>

    <a class="menu-link <?= $current=='bounty_board.php'?'menu-active':'' ?>" href="../pages/bounty_board.php">
        <img src="../assets/images/icons/sword.svg" class="menu-icon"> Bounty Board
    </a>

</div>