<aside class="sidebar">
  <header class="sidebar-header">
    <a href="#" class="header-logo">
      <img src="../images/logo.png" alt="">
    </a>
    <button class="toggler sidebar-toggler">
      <span class="material-symbols-rounded">chevron_left</span>
    </button>
    <button class="toggler menu-toggler">
      <span class="material-symbols-rounded">menu</span>
    </button>
  </header>

  <nav class="sidebar-nav">
    <ul class="nav-list primary-nav">
      <li class="nav-item">
        <a href="../studentpanel/Student_Dashboard.php" class="nav-link">
          <span class="nav-icon material-symbols-rounded">dashboard</span>
          <span class="nav-label">Dashboard</span>
        </a>
        <span class="nav-tooltip">Dashboard</span>
      </li>
      <li class="nav-item">
        <a href="../studentpanel/soa.php" class="nav-link">
          <span class="nav-icon material-symbols-rounded">checkbook</span>
          <span class="nav-label">Statement of Account</span>
        </a>
        <span class="nav-tooltip">Statement of Account</span>
      </li>
      <li class="nav-item">
        <a href="../studentpanel/grades.php" class="nav-link">
          <span class="nav-icon material-symbols-rounded">star</span>
          <span class="nav-label">Grades</span>
        </a>
        <span class="nav-tooltip">Grades</span>
      </li>
      <li class="nav-item dropdown-container">
        <a href="#" class="nav-link dropdown-toggle">
          <span class="nav-icon material-symbols-rounded">credit_card</span>
          <span class="nav-label">Payment</span>
          <span class="dropdown-icon material-symbols-rounded">keyboard_arrow_down</span>
        </a>
        <ul class="dropdown-menu">
          <li class="nav-item">
            <a href="../studentpanel/payment_acc.php" class="nav-link dropdown-link">Payment Account</a>
          </li>
          <li class="nav-item">
            <a href="../studentpanel/settle_payment.php" class="nav-link dropdown-link">Settle Payment</a>
          </li>
        </ul>
        </li>
        <li class="nav-item">
          <a href="../studentpanel/trans_history.php" class="nav-link">
            <span class="nav-icon material-symbols-rounded">receipt_long</span>
            <span class="nav-label">Transaction History</span>      
          </a>
            <span class="nav-tooltip">Transaction History</span>
        </li>
      </ul>
      <ul class="nav-list secondary-nav">
        <li class="nav-item">
          <a href="../login/slogout.php" class="nav-link">
            <span class="nav-icon material-symbols-rounded">logout</span>
            <span class="nav-label">Logout</span>
          </a>
        </li>
      </ul>
    </nav>
  </aside>

  <script src="../Jscript/snavscript.js"></script>