<?php
$current_user = currentUser();
$site_name = getSiteConfig('site_name') ?? '麟泓授权系统';
$site_logo = getSiteConfig('site_logo') ?? '/assets/uploads/logo.png';
$user = currentUser();
$page = $_GET['page'] ?? 'dashboard';
$nav_menus = getNavMenus($db);
$unread_count = 0;
if (!empty($current_user['id'])) {
    $unread_count = $db->fetchOne("SELECT COUNT(*) as cnt FROM notifications WHERE user_id IN (0, {$current_user['id']}) AND is_read = 0 AND status = 1")['cnt'] ?? 0;
}?>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
    <link rel="icon" href="/assets/uploads/favicon.ico"> 
    <link rel="stylesheet" href="/assets/css/style.css">
    <link rel="stylesheet" href="/assets/css/encrypt-style.css">
    <link rel="stylesheet" href="/assets/css/dark.css" id="dark-theme" disabled>
    <script src="/assets/js/main.js" defer></script>
    <script src="/assets/js/qrcode.min.js"></script>
    <style>
    /* ========== 强制导航栏最顶层 ========== */
.front-header {
    position: relative;
    z-index: 99999 !important;
}

.nav {
    z-index: 99999 !important;
}

.nav-item {
    z-index: 99999 !important;
    position: relative;
}

.dropdown-menu {
    z-index: 999999 !important;
    position: absolute;
}

/* 确保用户菜单也在上层 */
.user-menu {
    position: relative;
    z-index: 99999 !important;
}

/* 移动端菜单 */
.mobile-menu {
    z-index: 999999 !important;
}
        /* ========== 导航栏样式 ========== */
        .front-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 12px 30px;
            background: var(--bg-primary);
            border-bottom: 1px solid var(--border-color);
            position: relative;
            flex-wrap: wrap;
        }
        
        .logo-area .logo {
            height: 45px;
            width: auto;
        }
        
        .nav {
            display: flex;
            gap: 5px;
            align-items: center;
        }
        
        /* ========== 下拉菜单样式 ========== */
        .nav-item {
            position: relative;
            display: inline-block;
        }
        
        .nav-link {
            display: block;
            padding: 10px 16px;
            text-decoration: none;
            color: var(--text-secondary);
            border-radius: 8px;
            transition: all 0.2s;
            font-weight: 500;
        }
        
        .nav-link:hover {
            background: var(--bg-secondary);
            color: var(--primary-color);
        }
        
        .nav-link.active {
            color: var(--primary-color);
        }
        
        /* 下拉指示箭头 */
        .nav-item.has-dropdown > .nav-link::after {
            content: '▼';
            font-size: 10px;
            margin-left: 6px;
            opacity: 0.5;
        }
        
        .nav-item.has-dropdown:hover > .nav-link::after {
            opacity: 1;
        }
        
        /* 下拉菜单 */
        .dropdown-menu {
            position: absolute;
            top: 100%;
            left: 0;
            min-width: 180px;
            background: var(--bg-primary);
            border: 1px solid var(--border-color);
            border-radius: 12px;
            box-shadow: 0 10px 30px rgba(0,0,0,0.15);
            opacity: 0;
            visibility: hidden;
            transform: translateY(-10px);
            transition: all 0.25s ease;
            z-index: 9999;
            padding: 8px 0;
        }
        
        .nav-item:hover .dropdown-menu {
            opacity: 1;
            visibility: visible;
            transform: translateY(0);
        }
        
        .dropdown-menu a {
            display: block;
            padding: 10px 20px;
            text-decoration: none;
            color: var(--text-secondary);
            font-size: 14px;
            transition: all 0.2s;
        }
        
        .dropdown-menu a:hover {
            background: var(--bg-secondary);
            color: var(--primary-color);
            padding-left: 25px;
        }
        
        /* 用户菜单样式 */
        .user-menu {
            display: flex;
            align-items: center;
            gap: 15px;
        }
        
        .user-info {
            display: flex;
            align-items: center;
            gap: 12px;
        }
        
        .user-avatar {
            width: 36px;
            height: 36px;
            border-radius: 50%;
            object-fit: cover;
        }
        
        .balance {
            font-weight: 600;
            color: var(--primary-color);
        }
        
        /* 按钮样式 */
        .btn {
            display: inline-flex;
            align-items: center;
            gap: 4px;
            padding: 8px 18px;
            border-radius: 30px;
            text-decoration: none;
            font-size: 14px;
            font-weight: 500;
            transition: all 0.2s;
        }
        
        .btn-primary {
            background: linear-gradient(135deg, #667eea, #764ba2);
            color: white;
            border: none;
        }
        
        .btn-primary:hover {
            transform: translateY(-1px);
            box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
        }
        
        .btn-outline {
            background: transparent;
            border: 1.5px solid var(--border-color);
            color: var(--text-primary);
        }
        
        .btn-outline:hover {
            border-color: var(--primary-color);
            color: var(--primary-color);
        }
        
        .btn-sm {
            padding: 6px 14px;
            font-size: 13px;
        }
        
        /* 移动端菜单按钮 */
        .mobile-menu-btn {
            display: none;
            background: none;
            border: none;
            font-size: 28px;
            cursor: pointer;
            color: var(--text-primary);
            padding: 5px 10px;
        }
        
        /* 移动端菜单 */
        .mobile-menu {
            display: none;
            position: fixed;
            top: 70px;
            left: 0;
            right: 0;
            background: var(--bg-primary);
            border-top: 1px solid var(--border-color);
            box-shadow: 0 10px 20px rgba(0,0,0,0.1);
            z-index: 1000;
            flex-direction: column;
            padding: 10px 0;
            max-height: calc(100vh - 70px);
            overflow-y: auto;
        }
        
        .mobile-menu.show {
            display: flex;
        }
        
        .mobile-nav-link {
            padding: 14px 20px;
            display: block;
            text-decoration: none;
            color: var(--text-primary);
            border-bottom: 1px solid var(--border-color);
        }
        
        /* 移动端用户信息卡片 */
        .mobile-user-card {
            padding: 16px 20px;
            border-bottom: 1px solid var(--border-color);
            background: var(--bg-secondary);
        }
        
        .mobile-user-info {
            display: flex;
            align-items: center;
            gap: 14px;
        }
        
        .mobile-user-avatar {
            width: 50px;
            height: 50px;
            border-radius: 50%;
            object-fit: cover;
            border: 2px solid var(--primary-color);
        }
        
        .mobile-user-details {
            flex: 1;
        }
        
        .mobile-user-name {
            font-weight: 600;
            color: var(--text-primary);
            font-size: 16px;
            margin-bottom: 4px;
        }
        
        .mobile-user-balance {
            font-size: 14px;
            font-weight: 600;
            color: var(--primary-color);
        }
        
        .mobile-user-actions {
            display: flex;
            gap: 10px;
            margin-top: 14px;
        }
        
        .mobile-user-btn {
            flex: 1;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 6px;
            padding: 12px 16px;
            border-radius: 30px;
            text-decoration: none;
            font-weight: 500;
            font-size: 14px;
            transition: all 0.2s;
        }
        
        .mobile-user-btn-primary {
            background: var(--primary-color);
            color: white;
        }
        
        .mobile-user-btn-outline {
            background: transparent;
            border: 1.5px solid var(--border-color);
            color: var(--text-primary);
        }
        
        .mobile-menu-divider {
            height: 8px;
            background: var(--bg-secondary);
            border-top: 1px solid var(--border-color);
            border-bottom: 1px solid var(--border-color);
        }
        
        /* 移动端下拉 */
        .mobile-has-dropdown > .mobile-nav-link::after {
            content: '▼';
            font-size: 10px;
            margin-left: 8px;
            float: right;
        }
        
        .mobile-dropdown {
            display: none;
            background: var(--bg-secondary);
            padding-left: 20px;
        }
        
        .mobile-dropdown.show {
            display: block;
        }
        
        .mobile-dropdown a {
            padding: 12px 20px;
            display: block;
            text-decoration: none;
            color: var(--text-secondary);
            font-size: 14px;
            border-bottom: 1px solid var(--border-color);
        }
        
        .mobile-dropdown a:last-child {
            border-bottom: none;
        }
        
        /* 响应式 */
        @media (min-width: 769px) {
            .nav {
                display: flex !important;
            }
            .mobile-menu-btn {
                display: none;
            }
            .mobile-menu {
                display: none !important;
            }
        }
        
        @media (max-width: 768px) {
            .front-header {
                padding: 10px 15px;
            }
            
            .mobile-menu-btn {
                display: block;
                order: 2;
            }
            
            .logo-area {
                order: 1;
            }
            
            /* 移动端隐藏桌面用户菜单 */
            .user-menu {
                display: none !important;
            }
            
            .nav {
                display: none !important;
            }
        }
        
        @media (max-width: 480px) {
            .front-header {
                padding: 8px 12px;
            }
            
            .logo-area .logo {
                height: 35px;
            }
        }
        
        /* 二维码弹窗 */
        .qrcode-modal {
            position: fixed;
            top: 0; left: 0; right: 0; bottom: 0;
            background: rgba(0, 0, 0, 0.6);
            backdrop-filter: blur(5px);
            display: none;
            justify-content: center;
            align-items: center;
            z-index: 9999;
            opacity: 0;
            transition: opacity 0.3s ease;
        }
        .modal-content {
            background: #ffffff;
            color: #333;
            padding: 30px;
            border-radius: 20px;
            text-align: center;
            max-width: 380px;
            width: 90%;
            box-shadow: 0 10px 30px rgba(0,0,0,0.3);
            transform: scale(0.9);
            transition: transform 0.3s ease;
        }
        .qrcode-modal.active {
            display: flex;
            opacity: 1;
        }
        .qrcode-modal.active .modal-content {
            transform: scale(1);
        }
        .qrcode-img {
            width: 250px;
            height: 250px;
            margin: 20px auto;
            border: 1px solid #eee;
            padding: 5px;
            border-radius: 10px;
        }
        .close-btn {
            margin-top: 20px;
            padding: 10px 25px;
            background: #f5f5f5;
            border: none;
            border-radius: 8px;
            cursor: pointer;
            font-weight: 600;
            transition: 0.2s;
        }
        .close-btn:hover {
            background: #e0e0e0;
        }
        
        /* 确保下拉菜单在最上层 */
.dropdown-menu {
    z-index: 9999 !important;
}

.nav-item {
    z-index: 9999;
}
/* ========== 用户下拉卡片 ========== */
.user-dropdown {
    position: relative;
}

.user-dropdown-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    background: none;
    border: none;
    padding: 6px 12px 6px 8px;
    border-radius: 40px;
    cursor: pointer;
    transition: all 0.2s;
    color: var(--text-primary);
    background: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.user-dropdown-btn:hover {
    background: var(--bg-primary);
    border-color: var(--primary-color);
}

.user-dropdown-btn .user-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
}

.user-dropdown-btn .user-name {
    font-weight: 500;
    font-size: 14px;
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.user-dropdown-btn .dropdown-arrow {
    transition: transform 0.2s;
}

.user-dropdown-btn.active .dropdown-arrow {
    transform: rotate(180deg);
}

/* 下拉卡片 */
.user-dropdown-card {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    width: 260px;
    background: var(--bg-primary);
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.15);
    border: 1px solid var(--border-color);
    padding: 16px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: all 0.25s ease;
    z-index: 10000;
}

.user-dropdown-card.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* 余额行 */
.card-balance,
.card-membership {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
}

.card-balance .balance-label,
.card-membership .membership-label {
    flex: 1;
    font-size: 14px;
    color: var(--text-secondary);
}

.card-balance .balance-value {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-color);
}

.card-membership .membership-value {
    font-size: 14px;
    font-weight: 600;
    color: #f59e0b;
    background: #fef3c7;
    padding: 2px 12px;
    border-radius: 20px;
}

/* 分隔线 */
.card-divider {
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--border-color), transparent);
    margin: 12px 0;
}

/* 快捷按钮网格 */
.card-actions {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}

.card-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 10px 8px;
    background: var(--bg-secondary);
    border-radius: 12px;
    text-decoration: none;
    transition: all 0.2s;
}

.card-btn:hover {
    background: var(--primary-color);
}

.card-btn:hover img {
    filter: brightness(0) invert(1);
}

.card-btn:hover span {
    color: white;
}

.card-btn span {
    font-size: 12px;
    color: var(--text-secondary);
    font-weight: 500;
}

/* 退出链接 */
.card-footer {
    text-align: center;
}

.logout-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px 20px;
    color: #ef4444;
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    border-radius: 30px;
    transition: all 0.2s;
}

.logout-link:hover {
    background: #fef2f2;
}

/* 站内信铃铛 */
.notification-bell {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: var(--bg-secondary);
    border-radius: 50%;
    cursor: pointer;
    transition: all 0.2s;
    border: 1px solid var(--border-color);
    margin-right: 8px;
}

.notification-bell:hover {
    background: var(--bg-primary);
    border-color: var(--primary-color);
}

.bell-badge {
    position: absolute;
    top: -2px;
    right: -2px;
    min-width: 18px;
    height: 18px;
    background: #ef4444;
    color: white;
    font-size: 10px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    padding: 0 4px;
    border: 2px solid var(--bg-primary);
}

/* 响应式 */
@media (max-width: 768px) {
    .user-dropdown-card {
        position: fixed;
        top: auto;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        border-radius: 20px 20px 0 0;
        transform: translateY(100%);
    }
    
    .user-dropdown-card.show {
        transform: translateY(0);
    }
}
    </style>
</head>
<body>

<header class="front-header">
    <div class="logo-area">
        <a href="/">
            <img src="<?php echo htmlspecialchars($site_logo);?>" alt="Logo" class="logo">
        </a>
    </div>
    
    <!-- PC端导航（带下拉菜单） -->
    <nav class="nav" id="navLinks">
        <?php foreach ($nav_menus as $menu):?>
            <?php if (!empty($menu['children'])):?>
                <div class="nav-item has-dropdown">
                    <a href="<?php echo htmlspecialchars($menu['url']);?>" class="nav-link">
                        <?php echo htmlspecialchars($menu['name']);?>
                    </a>
                    <div class="dropdown-menu">
                        <?php foreach ($menu['children'] as $child): ?>
                            <a href="<?php echo htmlspecialchars($child['url']);?>">
                                <?php echo htmlspecialchars($child['name']);?>
                            </a>
                        <?php endforeach;?>
                    </div>
                </div>
            <?php else:?>
                <div class="nav-item">
                    <a href="<?php echo htmlspecialchars($menu['url']);?>" class="nav-link">
                        <?php echo htmlspecialchars($menu['name']);?>
                    </a>
                </div>
            <?php endif;?>
        <?php endforeach;?>
        
        <?php if ($current_user):?>
            <div class="nav-item">
                <a href="/admin.php" class="nav-link">用户中心</a>
            </div>
        <?php endif;?>
    </nav>
    
   <!-- 桌面端用户菜单（移动端隐藏） -->
<div class="user-menu">
    <?php if ($current_user): ?>
        <!-- 获取用户会员等级 -->
        <?php
        // 获取会员等级或管理员标识
if ($current_user['role'] === 'admin') {
    $group_name = '管理员';
} else {
    $user_group = $db->fetchOne("SELECT g.name FROM user_groups g WHERE g.id = " . intval($current_user['group_id'] ?? 0));
    $group_name = $user_group['name'] ?? '普通会员';
}
        $unread_count = 0;
if ($current_user && !empty($current_user['id'])) {
    $unread_count = $db->fetchOne("SELECT COUNT(*) as cnt FROM notifications WHERE user_id IN (0, {$current_user['id']}) AND is_read = 0 AND status = 1")['cnt'] ?? 0;
}
        ?>
        
        <!-- 站内信铃铛 -->
        <div class="notification-bell" onclick="window.location.href='/admin.php?page=notifications'">
            <img src="https://api.iconify.design/mdi:bell-outline.svg?color=%23666" width="22" height="22" alt="">
            <?php if ($unread_count > 0): ?>
                <span class="bell-badge"><?php echo $unread_count; ?></span>
            <?php endif; ?>
        </div>
        
        <!-- 用户头像和昵称（点击弹出下拉卡片） -->
        <div class="user-dropdown">
            <button class="user-dropdown-btn" id="userDropdownBtn">
                <img src="<?php echo htmlspecialchars($current_user['avatar'] ?? '/assets/uploads/default_avatar.png'); ?>" class="user-avatar" alt="">
                <span class="user-name"><?php echo htmlspecialchars($current_user['username']); ?></span>
                <img src="https://api.iconify.design/mdi:chevron-down.svg?color=%23666" width="16" height="16" class="dropdown-arrow" alt="">
            </button>
            
            <div class="user-dropdown-card" id="userDropdownCard">
                <!-- 余额 -->
                <div class="card-balance">
                    <img src="https://api.iconify.design/mdi:wallet-outline.svg?color=%23667eea" width="20" height="20" alt="">
                    <span class="balance-label">账户余额</span>
                    <span class="balance-value">¥<?php echo number_format($current_user['balance'], 2); ?></span>
                </div>
                
               <div class="card-membership">
    <img src="https://api.iconify.design/mdi:<?php echo $current_user['role'] === 'admin' ? 'shield' : 'shield-account-outline'; ?>.svg?color=<?php echo $current_user['role'] === 'admin' ? '%23229B34' : '%23f59e0b'; ?>" width="20" height="20" alt="">
    <span class="membership-label"><?php echo $current_user['role'] === 'admin' ? '角色' : '会员等级'; ?></span>
    <span class="membership-value" style="<?php echo $current_user['role'] === 'admin' ? 'background:#fee2e2;color:#ef4444;' : ''; ?>">
        <?php echo htmlspecialchars($group_name); ?>
    </span>
</div>
                
                <!-- 分隔线 -->
                <div class="card-divider"></div>
                
                <!-- 快捷按钮 -->
<div class="card-actions">
    <?php if ($current_user['role'] === 'admin'): ?>
        <!-- 管理员菜单 -->
        <a href="/admin.php?page=dashboard" class="card-btn">
            <img src="https://api.iconify.design/mdi:view-dashboard.svg?color=%23667eea" width="18" height="18" alt="">
            <span>用户中心</span>
        </a>
        <a href="/admin.php?page=apps" class="card-btn">
            <img src="https://api.iconify.design/mdi:application.svg?color=%2310b981" width="18" height="18" alt="">
            <span>应用管理</span>
        </a>
        <a href="/admin.php?page=licenses" class="card-btn">
            <img src="https://api.iconify.design/mdi:key.svg?color=%23f59e0b" width="18" height="18" alt="">
            <span>授权管理</span>
        </a>
        <a href="/admin.php?page=config" class="card-btn">
            <img src="https://api.iconify.design/mdi:cog.svg?color=%238b5cf6" width="18" height="18" alt="">
            <span>网站配置</span>
        </a>
    <?php else: ?>
        <!-- 普通用户菜单 -->
        <a href="/admin.php?page=dashboard" class="card-btn">
            <img src="https://api.iconify.design/mdi:view-dashboard.svg?color=%23667eea" width="18" height="18" alt="">
            <span>用户中心</span>
        </a>
        <a href="/admin.php?page=recharge" class="card-btn">
            <img src="https://api.iconify.design/mdi:wallet-plus.svg?color=%2310b981" width="18" height="18" alt="">
            <span>余额充值</span>
        </a>
        <a href="/admin.php?page=licenses" class="card-btn">
            <img src="https://api.iconify.design/mdi:key.svg?color=%23f59e0b" width="18" height="18" alt="">
            <span>授权管理</span>
        </a>
        <a href="/admin.php?page=buy_app" class="card-btn">
            <img src="https://api.iconify.design/mdi:cart.svg?color=%23ef4444" width="18" height="18" alt="">
            <span>购买授权</span>
        </a>
    <?php endif; ?>
</div>
                
                <!-- 分隔线 -->
                <div class="card-divider"></div>
                
                <!-- 底部链接 -->
                <div class="card-footer">
                    <a href="/modules/home/logout.php" class="logout-link">
                        <img src="https://api.iconify.design/mdi:logout.svg?color=%23ef4444" width="18" height="18" alt="">
                        <span>退出登录</span>
                    </a>
                </div>
            </div>
        </div>
    <?php else: ?>
        
    <?php endif; ?>
</div>
    
    <button class="mobile-menu-btn" id="mobileMenuBtn">
        <img src="/assets/icons/menu.svg" width="28" height="28" alt="">
    </button>
</header>

<!-- 移动端菜单 -->
<div class="mobile-menu" id="mobileMenu">
    <!-- ========== 移动端用户信息卡片 ========== -->
    <?php if ($current_user): ?>
        <div class="mobile-user-card">
            <div class="mobile-user-info">
                <img src="<?php echo htmlspecialchars($current_user['avatar']??'/assets/uploads/default_avatar.png');?>" class="mobile-user-avatar" alt="">
                <div class="mobile-user-details">
                    <div class="mobile-user-name"><?php echo htmlspecialchars($current_user['username']);?></div>
                    <div class="mobile-user-balance">
                        <img src="https://api.iconify.design/mdi:wallet.svg?color=%23667eea" width="14" height="14" style="vertical-align: middle;" alt="">
                        余额 ¥<?php echo number_format($current_user['balance'],2);?>
                    </div>
                </div>
            </div>
            <div class="mobile-user-actions">
                <a href="/admin.php" class="mobile-user-btn mobile-user-btn-primary">
                    <img src="https://api.iconify.design/mdi:view-dashboard.svg?color=white" width="16" height="16" alt="">
                    用户中心
                </a>
                <a href="/modules/home/logout.php" class="mobile-user-btn mobile-user-btn-outline">
                    <img src="https://api.iconify.design/mdi:logout.svg?color=currentColor" width="16" height="16" alt="">
                    退出
                </a>
            </div>
        </div>
        <div class="mobile-menu-divider"></div>
    <?php else: ?>
        <div class="mobile-user-card">
            <div class="mobile-user-actions">
                <a href="/modules/home/login.php" class="mobile-user-btn mobile-user-btn-primary">
                    <img src="https://api.iconify.design/mdi:login.svg?color=white" width="16" height="16" alt="">
                    登录
                </a>
                <a href="/modules/home/register.php" class="mobile-user-btn mobile-user-btn-outline">
                    <img src="https://api.iconify.design/mdi:account-plus.svg?color=currentColor" width="16" height="16" alt="">
                    注册
                </a>
            </div>
        </div>
        <div class="mobile-menu-divider"></div>
    <?php endif; ?>
    
    <?php foreach ($nav_menus as $menu):?>
        <?php if (!empty($menu['children'])):?>
            <div class="mobile-has-dropdown">
                <span class="mobile-nav-link" onclick="toggleMobileDropdown(this)">
                    <?php echo htmlspecialchars($menu['name']);?>
                </span>
                <div class="mobile-dropdown">
                    <?php foreach ($menu['children'] as $child):?>
                        <a href="<?php echo htmlspecialchars($child['url']);?>">
                            <?php echo htmlspecialchars($child['name']);?>
                        </a>
                    <?php endforeach;?>
                </div>
            </div>
        <?php else:?>
            <a href="<?php echo htmlspecialchars($menu['url']);?>" class="mobile-nav-link">
                <?php echo htmlspecialchars($menu['name']);?>
            </a>
        <?php endif;?>
    <?php endforeach;?>
    
</div>

<script>

// 移动端下拉切换（必须保留）
function toggleMobileDropdown(element) {
    const dropdown = element.nextElementSibling;
    if (dropdown) {
        dropdown.classList.toggle('show');
    }
}

// 二维码弹窗
const modal = document.getElementById('qrcodeModal');

function showQrcodeModal() {
    if (modal) {
        modal.classList.add('active');
        document.body.style.overflow = 'hidden';
    }
}

function hideQrcodeModal() {
    if (modal) {
        modal.classList.remove('active');
        document.body.style.overflow = 'auto';
    }
}

if (modal) {
    modal.addEventListener('click', function(e) {
        if (e.target === modal) hideQrcodeModal();
    });
}
// 用户下拉卡片
const userDropdownBtn = document.getElementById('userDropdownBtn');
const userDropdownCard = document.getElementById('userDropdownCard');

if (userDropdownBtn && userDropdownCard) {
    userDropdownBtn.addEventListener('click', function(e) {
        e.stopPropagation();
        this.classList.toggle('active');
        userDropdownCard.classList.toggle('show');
    });
    
    // 点击外部关闭
    document.addEventListener('click', function(e) {
        if (!userDropdownBtn.contains(e.target) && !userDropdownCard.contains(e.target)) {
            userDropdownBtn.classList.remove('active');
            userDropdownCard.classList.remove('show');
        }
    });
}
</script>
</body>
</html>