<div class="main-sidebar sidebar-style-2">
   <aside id="sidebar-wrapper">
      <!-- Logo Branding -->
      <div class="sidebar-brand" style="padding: 25px 0; margin-bottom: 10px;">
         <a href="<?= user_url(); ?>"> 
            <img alt="image" src="<?= get_logo() ?>" class="header-logo" style="height: 45px; filter: drop-shadow(0 4px 6px rgba(0,0,0,0.1));" />
         </a>
      </div>

      <!-- Premium Profile Card -->
      <div class="sidebar-user-card" style="margin: 10px 15px 25px 15px; padding: 20px 15px; border-radius: 20px; background: linear-gradient(145deg, #ffffff, #f0f4f8); box-shadow: 8px 8px 16px #d1d9e6, -8px -8px 16px #ffffff; border: 1px solid rgba(255,255,255,0.8); text-align: center;">
         <div class="sidebar-user-picture" style="position: relative; display: inline-block;">
            <img alt="image" src="<?= get_avatar('user') ?>" style="width: 70px; height: 70px; border-radius: 50%; border: 3px solid #6777ef; box-shadow: 0 4px 10px rgba(103, 119, 239, 0.3); object-fit: cover;">
            <span style="position: absolute; bottom: 5px; right: 5px; width: 14px; height: 14px; background: #47c363; border: 2px solid #fff; border-radius: 50%;"></span>
         </div>
         <div class="sidebar-user-details" style="margin-top: 12px;">
            <div class="user-name" style="font-weight: 800; color: #191d21; font-size: 15px; line-height: 1.2;"><?= current_user('first_name') ?></div>
            <div class="user-role" style="font-size: 11px; color: #6777ef; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; margin-top: 4px;">Premium Member</div>
            
            <!-- Profile Quick Actions -->
            <div class="user-actions" style="display: flex; justify-content: center; gap: 10px; margin-top: 15px;">
               <a href="<?= user_url('profile') ?>" style="background: #6777ef; color: #fff; width: 32px; height: 32px; border-radius: 10px; display: flex; align-items: center; justify-content: center; transition: 0.3s;" data-bs-toggle="tooltip" title="Settings">
                  <i data-feather="settings" style="width: 14px;"></i>
               </a>
               <a href="<?= user_url('tickets') ?>" style="background: #e3eaef; color: #34395e; width: 32px; height: 32px; border-radius: 10px; display: flex; align-items: center; justify-content: center; transition: 0.3s;" data-bs-toggle="tooltip" title="Messages">
                  <i data-feather="mail" style="width: 14px;"></i>
               </a>
               <a href="<?= user_url('logout') ?>" style="background: #ffe5e5; color: #fb160a; width: 32px; height: 32px; border-radius: 10px; display: flex; align-items: center; justify-content: center; transition: 0.3s;" data-bs-toggle="tooltip" title="Logout">
                  <i data-feather="power" style="width: 14px;"></i>
               </a>
            </div>
         </div>
      </div>

      <ul class="sidebar-menu">
         <li class="menu-header" style="padding-left: 25px; opacity: 0.4; font-weight: 700;">NAVIGATION</li>
         
         <li class="dropdown">
            <a href="<?= user_url('dashboard') ?>" class="nav-link"><i data-feather="grid" style="color: #6777ef;"></i><span>Dashboard</span></a>
         </li>

         <li class="dropdown">
            <a href="<?= user_url('add_funds') ?>" class="nav-link ajaxModal"><i data-feather="plus-circle" style="color: #47c363;"></i><span>Add Funds</span></a>
         </li>

         <li class="dropdown">
            <a href="#" class="menu-toggle nav-link has-dropdown"><i data-feather="activity" style="color: #ffa426;"></i><span>Transactions</span></a>
            <ul class="dropdown-menu">
               <li><a class="nav-link" href="<?= user_url('transactions') ?>">Financial History</a></li>
               <li><a class="nav-link" href="<?= user_url('bank_transactions') ?>">Bank Logs</a></li>
            </ul>
         </li>

         <li class="dropdown">
            <a href="#" class="menu-toggle nav-link has-dropdown"><i data-feather="file-text" style="color: #191d21;"></i><span>Billing Center</span></a>
            <ul class="dropdown-menu">
               <li><a class="nav-link" href="<?= user_url('invoice') ?>">My Invoices</a></li>
               <li><a class="nav-link ajaxModal" href="<?= user_url('invoice/update') ?>">Create New</a></li>
            </ul>
         </li>

         <li class="dropdown">
            <a href="#" class="menu-toggle nav-link has-dropdown"><i data-feather="database" style="color: #3abaf4;"></i><span>Data Manager</span></a>
            <ul class="dropdown-menu">
               <li><a class="nav-link" href="<?= user_url('stored-data') ?>">Cloud Storage</a></li>
               <li><a class="nav-link ajaxModal" href="<?= user_url('transactions/add-data') ?>">Import Data</a></li>
            </ul>
         </li>

         <li class="dropdown">
            <a href="#" class="menu-toggle nav-link has-dropdown"><i data-feather="sliders" style="color: #98a6ad;"></i><span>Configurations</span></a>
            <ul class="dropdown-menu">
               <li><a class="nav-link" href="<?= user_url('brands') ?>">Brand Profile</a></li>
               <li><a class="nav-link" href="<?= user_url('devices') ?>">My Devices</a></li>
               <li><a class="nav-link" href="<?= user_url('user-settings/wallets') ?>">Payment Methods</a></li>
            </ul>
         </li>

         <li class="menu-header" style="padding-left: 25px; opacity: 0.4; font-weight: 700;">GROWTH & TOOLS</li>

         <li class="dropdown">
            <a href="<?= user_url('affiliates') ?>" class="nav-link"><i data-feather="share-2" style="color: #fc544b;"></i><span>Affiliate Program</span></a>
         </li>

         <li class="dropdown">
            <a href="<?= user_url('plans') ?>" class="nav-link"><i data-feather="zap" style="color: #6777ef;"></i><span>Upgrade Plan</span></a>
         </li>

         <li class="dropdown">
            <a href="<?= base_url('public/assets/downloads/zappay.apk') ?>" class="nav-link"><i data-feather="smartphone" style="color: #2dce89;"></i><span>Get Mobile App</span></a>
         </li>

         <li>
            <a href="<?=base_url()?>" target="_blank" class="nav-link"><i data-feather="globe" style="color: #444;"></i><span>Public Website</span></a>
         </li>

         <li class="dropdown mb-5">
            <a href="<?= base_url('developers/docs#section-1') ?>" class="nav-link"><i data-feather="layers" style="color: #63ed7a;"></i><span>Developer API</span></a>
         </li>
      </ul>
   </aside>
</div>