@php
  use Illuminate\Support\Facades\Route as R;
@endphp

<div style="position:relative; padding:14px 14px 6px; display:flex; align-items:center; gap:10px; border-bottom:1px solid var(--bb-border)">
  @php $logo = asset('images/bluebando-logo.svg'); @endphp
  <img src="{{ $logo }}" alt="BlueBando" width="28" height="28" onerror="this.style.display='none'">
  <div class="brand-title" style="font-weight:800; letter-spacing:.3px; font-size:15px">BlueBando v3</div>

  {{-- collapse / expand --}}
  <button type="button" class="collapse-btn" onclick="bbToggleCollapse()" title="Collapse / Expand">
    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
      <path d="M8 5l8 7-8 7"/>
    </svg>
  </button>
</div>

<nav class="nav">
  <!-- MAIN -->
  <div class="section">Main</div>

  <a data-tip="Dashboard"
     href="{{ R::has('dashboard') ? route('dashboard') : url('/dashboard') }}"
     class="{{ request()->routeIs('dashboard') ? 'active' : '' }}">
    <x-ico name="home" :size="20" /> <span class="label">Dashboard</span>
  </a>

  <a data-tip="Routers"
     href="{{ R::has('routers.index') ? route('routers.index') : url('/routers') }}"
     class="{{ request()->is('routers*') ? 'active' : '' }}">
    <x-ico name="server" :size="20" /> <span class="label">Routers</span>
  </a>

  <a data-tip="Plans"
     href="{{ R::has('plans.index') ? route('plans.index') : url('/plans') }}"
     class="{{ request()->is('plans*') ? 'active' : '' }}">
    <x-ico name="tag" :size="20" /> <span class="label">Plans</span>
  </a>

  <!-- HOTSPOT MODULES -->
  <div class="section">Hotspot</div>

  <a data-tip="Hotspot Profiles"
     href="{{ R::has('hotspot.profiles.index') ? route('hotspot.profiles.index') : url('/hotspot/profiles') }}"
     class="{{ request()->routeIs('hotspot.profiles.*') ? 'active' : '' }}">
    <x-ico name="wifi" :size="20" /> <span class="label">Profiles</span>
  </a>

  <a data-tip="Hotspot Vouchers"
     href="{{ R::has('hotspot.vouchers.index') ? route('hotspot.vouchers.index') : url('/hotspot/vouchers') }}"
     class="{{ request()->routeIs('hotspot.vouchers.*') ? 'active' : '' }}">
    <x-ico name="ticket" :size="20" /> <span class="label">Vouchers</span>
  </a>

  <a data-tip="Active Users"
     href="{{ R::has('hotspot.active') ? route('hotspot.active') : url('/hotspot/active') }}"
     class="{{ request()->routeIs('hotspot.active') ? 'active' : '' }}">
    <x-ico name="bolt" :size="20" /> <span class="label">Active Users</span>
  </a>

  <a data-tip="Hotspot Logs"
     href="{{ R::has('hotspot.logs.index') ? route('hotspot.logs.index') : url('/hotspot/logs') }}"
     class="{{ request()->routeIs('hotspot.logs.*') ? 'active' : '' }}">
    <x-ico name="document-text" :size="20" /> <span class="label">Hotspot Logs</span>

  <a data-tip="User Log" href="{{ route('hotspot.userlog.index') }}"
     class="{{ request()->routeIs('hotspot.userlog.*') ? 'active' : '' }}">
    <x-ico name="clock" :size="20" /> <span class="label">User Log</span>
  </a>

  <!-- PAYMENTS -->
  <div class="section">Payments</div>

  <a data-tip="Checkout"
     href="{{ R::has('checkout.form') ? route('checkout.form') : url('/checkout') }}"
     class="{{ request()->is('checkout*') ? 'active' : '' }}">
    <x-ico name="credit-card" :size="20" /> <span class="label">Checkout</span>
  </a>

  <a data-tip="Orders"
     href="{{ R::has('payments.orders') ? route('payments.orders') : url('/orders') }}"
     class="{{ request()->is('orders*') ? 'active' : '' }}">
    <x-ico name="receipt-percent" :size="20" /> <span class="label">Orders</span>
  </a>

  <a data-tip="Payment Status"
     href="{{ R::has('payments.success') ? route('payments.success') : url('/payments/success') }}"
     class="{{ request()->routeIs('payments.*') ? 'active' : '' }}">
    <x-ico name="banknotes" :size="20" /> <span class="label">Payment Status</span>
  </a>

  <!-- REPORTS -->
  <div class="section">Reports</div>

  <a data-tip="Sales Reports"
     href="{{ R::has('reports.sales') ? route('reports.sales') : url('/reports/sales') }}"
     class="{{ request()->routeIs('reports.sales') ? 'active' : '' }}">
    <x-ico name="chart-bar" :size="20" /> <span class="label">Sales</span>
  </a>

  <a data-tip="Voucher Reports"
     href="{{ R::has('reports.vouchers') ? route('reports.vouchers') : url('/reports/vouchers') }}"
     class="{{ request()->routeIs('reports.vouchers') ? 'active' : '' }}">
    <x-ico name="ticket" :size="20" /> <span class="label">Voucher Report</span>
  </a>

  <a data-tip="SMS Logs"
     href="{{ R::has('reports.sms') ? route('reports.sms') : url('/reports/sms') }}"
     class="{{ request()->routeIs('reports.sms') ? 'active' : '' }}">
    <x-ico name="chat" :size="20" /> <span class="label">SMS Logs</span>
  </a>

  <a data-tip="Profit & Loss"
     href="{{ R::has('reports.profit-loss') ? route('reports.profit-loss') : url('/reports/profit-loss') }}"
     class="{{ request()->routeIs('reports.profit-loss') ? 'active' : '' }}">
    <x-ico name="currency-dollar" :size="20" /> <span class="label">Profit / Loss</span>
  </a>


  <li class="nav-item">
    <a href="{{ route('reports.payments') }}" class="nav-link">
        Payments Reports
    </a>
</li>
<li class="nav-item">
    <a href="{{ route('reports.vouchers') }}" class="nav-link">
        Vouchers Reports
    </a>
</li>


  <a data-tip="ATM Sales"
     href="{{ R::has('atm.sales.index') ? route('atm.sales.index') : url('/atm/sales') }}"
     class="{{ request()->routeIs('atm.sales.*') ? 'active' : '' }}">
    <x-ico name="banknotes" :size="20" /> <span class="label">ATM Sales</span>
  </a>

  <!-- CHANNELS -->
  <div class="section">Channels</div>

  <a data-tip="SMS Gateway"
     href="{{ R::has('sms.index') ? route('sms.index') : url('/sms') }}"
     class="{{ request()->is('sms*') ? 'active' : '' }}">
    <x-ico name="chat" :size="20" /> <span class="label">SMS Gateway</span>
  </a>

  <a data-tip="Freelancers"
     href="{{ R::has('freelancer.index') ? route('freelancer.index') : url('/freelancers') }}"
     class="{{ request()->is('freelancer*') ? 'active' : '' }}">
    <x-ico name="user-group" :size="20" /> <span class="label">Freelancers</span>
  </a>

  <!-- SYSTEM -->
  <div class="section">System</div>

  <a data-tip="Users & Roles"
     href="{{ R::has('users.index') ? route('users.index') : url('/users') }}"
     class="{{ request()->is('users*') ? 'active' : '' }}">
    <x-ico name="users" :size="20" /> <span class="label">Users & Roles</span>
  </a>

  <a data-tip="Settings"
     href="{{ R::has('settings.index') ? route('settings.index') : url('/settings') }}"
     class="{{ request()->is('settings*') ? 'active' : '' }}">
    <x-ico name="cog" :size="20" /> <span class="label">Settings</span>
  </a>

  <div class="section">Account</div>
  <form method="POST" action="{{ route('logout') }}">
    @csrf
    <button type="submit"
      style="background:none;border:0;color:var(--bb-red);padding:10px 12px;border-radius:12px;cursor:pointer;width:100%;text-align:left;display:flex;align-items:center;gap:10px">
      <x-ico name="logout" :size="20" /> <span class="label">Logout</span>
    </button>
  </form>
</nav>