<!-- Main Sidebar Container -->
<aside class="main-sidebar sidebar-light-primary elevation-2 modern-sidebar">
    <!-- Sidebar -->
    <div class="sidebar">
        <div class="user-panel">
            @if (!empty(siteinfo()))
                @if (siteinfo()->img_url)
                    <div class="image">
                        <img src="{{ asset('storage/company/' . siteinfo()->img_url) }}"
                            alt="{{ siteinfo()->name ?? 'Logo' }}">
                    </div>
                @else
                    <div class="image">
                        <div
                            style="width: 40px; height: 40px; background: linear-gradient(135deg, #475569, #64748b); border-radius: 10px; display: flex; align-items: center; justify-content: center; color: white; font-weight: 600; font-size: 13px; text-transform: uppercase;">
                            {{ Str::substr(siteinfo()->name ?? 'RC', 0, 2) }}</div>
                    </div>
                @endif
                <div class="info">
                    <a href="{{ route('dashboard') }}">{{ Str::limit(siteinfo()->name, 18) ?? 'Dashboard' }}</a>
                    <small>Admin Panel</small>
                </div>
            @endif
        </div>

        <!-- Sidebar Menu -->
        <nav class="mt-2 sidebar-nav-scroll" style="overflow-y: auto; overflow-x: hidden;">
            <ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu"
                data-accordion="false">
                @if (Auth::user()->hasRole('Admin'))
                    @can('portal-invoice')
                        <li
                            class="nav-item {{ request()->routeIs(['portal-invoice*', 'portal-invoice/new']) ? 'menu-open' : '' }}">
                            <a href="{{ route('portal-invoice') }}" class="nav-link"><i
                                    class="fas fa-dollar-sign nav-icon"></i>
                                <p>Billing Fix Bill</p>
                            </a>
                        </li>
                    @endcan
                @endif



                @cannot('specific_management_services')
                    <li class="nav-item {{ request()->routeIs(['dashboard*', 'dashboard/new']) ? 'menu-open' : '' }}">
                        <a href="{{ route('dashboard') }}" class="nav-link"><i class="fas fa-border-all nav-icon"></i>
                            <p>Dashboard</p>
                        </a>
                    </li>
                @endcannot

                @can('network-manage')
                    @if (globalPermission('manage-map'))
                        <li class="nav-item">
                            <a href="{{ route('map') }}" class="nav-link"><i class="fas fa-border-all nav-icon"></i>
                                <p>Network Map</p>
                            </a>
                        </li>
                    @endif
                @endcan

                @if (
                    (checkSettings('olt_information_add') == 'enable' && Auth::user()->can('information_add')) ||
                        (globalPermission('onu_information_laser') && Auth::user()->can('onu_information_laser')))
                    <li
                        class="nav-item {{ request()->routeIs(['oltinfo.*', 'onu-information']) || request()->path() == 'admin/onu-information' ? 'menu-open' : '' }}">
                        <a href="#" class="nav-link">
                            <i class="fas fa-network-wired nav-icon"></i>
                            <p>
                                OLT Management
                                <i class="fas fa-angle-left right"></i>
                            </p>
                        </a>

                        <ul class="nav nav-treeview">
                            @if (checkSettings('olt_information_add') == 'enable')
                                @can('information_add')
                                    <li class="nav-item">
                                        <a href="{{ route('oltinfo.index') }}"
                                            class="nav-link {{ request()->routeIs(['oltinfo.*']) ? 'active' : '' }}">
                                            <i class="ml-3 fa fa-circle nav-icon" style="font-size: 6px !important"></i>
                                            <p>OLT Info</p>
                                        </a>
                                    </li>
                                @endcan
                            @endif

                            @if (globalPermission('onu_information_laser'))
                                @can('onu_information_laser')
                                    <li class="nav-item">
                                        <a href="{{ route('onu-information') }}"
                                            class="nav-link {{ request()->path() == 'admin/onu-information' ? 'active' : '' }}">
                                            <i class="ml-3 fa fa-circle nav-icon" style="font-size: 6px !important"></i>
                                            <p>ONU Info</p>
                                        </a>
                                    </li>
                                @endcan
                            @endif
                        </ul>
                    </li>
                @endif

                @if (checkSettings('Bank') == 'enable' && Auth::user()->can('bank'))
                    @include('layout.leftsidebar.bank')
                @endif


                @can('notification-setting')
                    @if (checkSettings('notification') == 'enable')
                        <li class="nav-item {{ request()->routeIs(['notification*']) ? 'menu-open' : '' }}">
                            <a href="#" class="nav-link">
                                <i class="fas fa-bell nav-icon"></i>
                                <p>
                                    Notifications
                                    <i class="fas fa-angle-left right"></i>
                                </p>
                            </a>

                            <ul class="nav nav-treeview">
                                <li class="nav-item">
                                    <a href="#" {{-- class="nav-link {{ request()->routeIs(['sms-gateway.index']) ? 'active' : '' }}" --}} class="nav-link ">
                                        <i class="ml-3 far fa-circle nav-icon" style="font-size: 10px"></i>
                                        <p>Notification Settings</p>
                                    </a>
                                </li>
                            </ul>

                        </li>
                    @endif
                @endcan

                @include('layout.leftsidebar.sms_setting')
                @include('layout.leftsidebar.email_setting')

                @if (checksettings('voice_message_send') == 'enable')
                    @include('layout.leftsidebar.voice_broadcast')
                @endif

                @hasanyrole('Admin|Billing Man')
                    <li class="nav-item">
                        <a href="{{ route('view_user_account_history', auth()->user()->id) }}"
                            class="nav-link {{ request()->routeIs(['view_user_account_history']) ? 'open' : '' }}"><i
                                class="fas fa-file-invoice nav-icon"></i>
                            <p>Accounts History</p>
                        </a>
                    </li>
                @endunlessrole




                @include('layout.leftsidebar.settings_section')


                @cannot('specific_management_services')
                    @include('layout.leftsidebar.customer')
                @endcannot
                @if (checksettings('CRM') == 'enable')
                    @include('layout.leftsidebar.crm')
                @endif


                @can('customer-support')
                    @include('layout.leftsidebar.support')
                @endcan

                @can('money-receipt-entry')
                    @include('layout.leftsidebar.account')
                @endcan


                @cannot('specific_management_services')
                    @include('layout.leftsidebar.report')
                @endcannot



                @include('layout.leftsidebar.store')

                @if (checkSettings('Bandwidth-section') == 'enable')
                    @can('bandwidth-buy')
                        <li
                            class="nav-item {{ request()->routeIs(['band-provider.*', 'band-service.*', 'band-purchase.*', 'bandwidthReport']) ? 'menu-open' : '' }}">
                            <a href="#" class="nav-link">
                                <i class="fas fa-bell nav-icon"></i>
                                <p>
                                    Bandwidth Buy
                                    <i class="fas fa-angle-left right"></i>
                                </p>
                            </a>

                            <ul class="nav nav-treeview">

                                <li class="nav-item">
                                    <a href="{{ route('band-provider.index') }}"
                                        class="nav-link {{ request()->routeIs(['band-provider.index']) ? 'active' : '' }}">
                                        <i class="ml-3 far fa-circle nav-icon" style="font-size: 10px"></i>
                                        <p>Provider</p>
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a href="{{ route('band-service.index') }}"
                                        class="nav-link {{ request()->routeIs(['band-service.index']) ? 'active' : '' }}">
                                        <i class="ml-3 far fa-circle nav-icon" style="font-size: 10px"></i>
                                        <p>Service</p>
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a href="{{ route('band-purchase.index') }}"
                                        class="nav-link {{ request()->routeIs(['band-purchase.index']) ? 'active' : '' }}">
                                        <i class="ml-3 far fa-circle nav-icon" style="font-size: 10px"></i>
                                        <p>Purchase Bill</p>
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a href="{{ route('bandwidthReport') }}"
                                        class="nav-link {{ request()->routeIs(['bandwidthReport']) ? 'active' : '' }}">
                                        <i class="ml-3 far fa-circle nav-icon" style="font-size: 10px"></i>
                                        <p>Purchase Report</p>
                                    </a>
                                </li>

                            </ul>
                        </li>
                    @endcan
                    @can('bandwidth-sale')
                        @include('layout.leftsidebar.bwsale')
                    @endcan
                @endif

                @if (checkSettings('payroll') == 'enable' && Auth::user()->can('payroll'))
                    @include('layout.leftsidebar.payroll')
                @endif

                @include('layout.leftsidebar.admin')


                @if (checkSettings('help') == 'enable')
                    <li class="nav-item">
                        <a href="{{ route('help.index') }}" class="nav-link">
                            <i class="fa fa-question-circle nav-icon" aria-hidden="true"></i>
                            <p>Help</p>
                        </a>
                    </li>
                @endif

            </ul>
            <div style="height: 150px; flex-shrink: 0; background: #fff;"></div>
        </nav>
        <!-- /.sidebar-menu -->
    </div>
    <!-- /.sidebar -->
</aside>


<style>
    /* Sidebar fills viewport; nav expands and scrolls only when needed */
    .sidebar {
        display: flex;
        flex-direction: column;
        height: 100vh;
        max-height: 100vh;
    }

    .sidebar .sidebar-nav-scroll {
        flex: 1 1 auto;
        min-height: 0;
        max-height: calc(100vh - 1rem);
    }

    .sidebar nav::-webkit-scrollbar {
        width: 5px;
    }

    .sidebar nav::-webkit-scrollbar-track {
        background: #f1f1f1;
    }

    .sidebar nav::-webkit-scrollbar-thumb {
        background: #888;
    }

    .sidebar nav::-webkit-scrollbar-thumb:hover {
        background: #555;
    }
</style>

<script>
    document.addEventListener('DOMContentLoaded', function() {
        var sidebarNav = document.querySelector('.sidebar .sidebar-nav-scroll');
        if (!sidebarNav) return;

        // When a parent menu is opened, scroll sidebar so the menu title is at the top — full submenu is visible
        sidebarNav.addEventListener('click', function(e) {
            var link = e.target.closest('.nav-link');
            if (!link || link.getAttribute('href') !== '#') return;
            var navItem = link.closest('.nav-item');
            if (!navItem || !navItem.querySelector('.nav-treeview')) return;

            setTimeout(function() {
                var navRect = navItem.getBoundingClientRect();
                var containerRect = sidebarNav.getBoundingClientRect();
                var scrollDelta = navRect.top - containerRect.top;
                if (scrollDelta < 0 || navRect.bottom > containerRect.bottom) {
                    var targetScroll = sidebarNav.scrollTop + scrollDelta - 8;
                    sidebarNav.scrollTo({
                        top: Math.max(0, targetScroll),
                        behavior: 'smooth'
                    });
                }
            }, 150);
        });
    });
</script>
