<?php
$role = $_SESSION['role'] ?? 'officer';
?>

<style>
  #sidebar-wrapper {
    width: 220px;
    transition: all 0.3s;
  }
  #sidebar-wrapper.collapsed {
    width: 60px;
  }
  #sidebar-wrapper .list-group-item {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  #mainContent {
    margin-left: 220px;
    transition: margin-left 0.3s;
  }
  #sidebar-wrapper.collapsed ~ #mainContent {
    margin-left: 60px;
  }
</style>

<div class="d-flex">
  <div id="sidebar-wrapper" class="bg-light border-end position-fixed h-100">
    <div class="text-center p-3">
      <button class="btn btn-outline-secondary btn-sm" id="toggleSidebar" title="Toggle Sidebar">☰</button>
    </div>
    <div class="list-group list-group-flush">
      <a href="../officers/dashboard.php" class="list-group-item list-group-item-action">🏠 Dashboard</a>
      <a href="../officers/attendance.php" class="list-group-item list-group-item-action">🕒 Attendance</a>
      <a href="../officers/leave.php" class="list-group-item list-group-item-action">📝 Leave</a>
      <a href="../officers/payslips.php" class="list-group-item list-group-item-action">💼 Payslips</a>
      <a href="../officers/employment_terms.php" class="list-group-item list-group-item-action">📑 Employment</a>

      <?php if ($role === 'admin'): ?>
        <a href="../admin/command_center.php" class="list-group-item list-group-item-action text-danger">⚙ Admin Panel</a>
      <?php endif; ?>
    </div>
  </div>

 
