<button class="sv-mobile-toggle" onclick="toggleShopVistaSidebar()" aria-label="Open Menu">
    <i class="fa-solid fa-bars"></i>
</button>

<div class="sv-sidebar" id="svSidebar">
    <button class="sv-sidebar-close" onclick="toggleShopVistaSidebar()" aria-label="Close Menu">&times;</button>

    <div class="sv-sidebar-header">
        <h2><span>Online</span>Shop</h2>
        <span class="sv-badge">Admin Panel</span>
    </div>
    
    <ul class="sv-nav-links">
        <li>
            <a href="dashboard.php" class="<?php echo (basename($_SERVER['PHP_SELF']) == 'dashboard.php') ? 'sv-active' : ''; ?>">
                <i class="fa-solid fa-chart-pie"></i>
                <span>Over View</span>
            </a>
        </li>
        <li>
            <a href="categorys.php" class="<?php echo (basename($_SERVER['PHP_SELF']) == 'products.php') ? 'sv-active' : ''; ?>">
                <i class="fa-solid fa-box"></i>
                <span>Categories</span>
            </a>
        </li>
        
         <li>
            <a href="products.php" class="<?php echo (basename($_SERVER['PHP_SELF']) == 'products.php') ? 'sv-active' : ''; ?>">
                <i class="fa-solid fa-box"></i>
                <span>Products</span>
            </a>
        </li>
        
         <li>
            <a href="orders_manager2.php" class="<?php echo (basename($_SERVER['PHP_SELF']) == 'customers.php') ? 'sv-active' : ''; ?>">
                <i class="fa-solid fa-users"></i>
                <span>ALL Order</span>
            </a>
        </li>
        <li>
            <a href="customers.php" class="<?php echo (basename($_SERVER['PHP_SELF']) == 'customers.php') ? 'sv-active' : ''; ?>">
                <i class="fa-solid fa-users"></i>
                <span>Customers</span>
            </a>
        </li>
        
         <li>
            <a href="payment_settings.php" class="<?php echo (basename($_SERVER['PHP_SELF']) == 'payment_settings.php') ? 'sv-active' : ''; ?>">
                <i class="fa-solid fa-sliders"></i>
                <span>Payment Settings</span>
            </a>
        </li>
        
        <li>
            <a href="settings.php" class="<?php echo (basename($_SERVER['PHP_SELF']) == 'settings.php') ? 'sv-active' : ''; ?>">
                <i class="fa-solid fa-sliders"></i>
                <span>Site Settings</span>
            </a>
        </li>
    </ul>

    <div class="sv-sidebar-footer">
        <a href="logout.php" class="sv-logout-btn">
            <i class="fa-solid fa-arrow-right-from-bracket"></i>
            <span>Logout</span>
        </a>
    </div>
</div>

<script>
function toggleShopVistaSidebar() {
    const sidebar = document.getElementById('svSidebar');
    sidebar.classList.toggle('sv-show');
}
</script>