:root {
            --primary-color: #0d6efd;
            --dark-bg: #121212;
            --darker-bg: #0a0a0a;
            --card-bg: #1e1e1e;
            --border-color: #333;
            --text-color: #f0f0f0;
            --text-muted: #aaa;
            --success-color: #198754;
            --wechat-color: #07c160;
		     
		            --accent-color: #58a6ff;
		            --text-primary: #f0f6fc;
		            --text-secondary: #8b949e;
		            --table-bg: #21262d;
		            --table-border: #30363d;
			            --secondary-color: #6c757d;
			            --success-color: #198754;
			            --warning-color: #ffc107;
			            --danger-color: #dc3545;
			            --dark-bg: #121212;
			            --darker-bg: #0a0a0a;
			            --card-bg: #1e1e1e;
			            --card-border: #333;
			            --text-primary: #f8f9fa;
			            --text-secondary: #adb5bd;
        }
		 /* 左侧菜单栏样式 */
		        .sidebar {
		            background-color: var(--darker-bg);
		            height: 100vh;
		            position: sticky;
		            top: 0;
		            overflow-y: auto;
		            padding: 0;
		            box-shadow: 2px 0 10px rgba(0, 0, 0, 0.3);
		        }
		        
		        .sidebar-header {
		            padding: 1.5rem;
		            border-bottom: 1px solid var(--border-color);
		            text-align: center;
		            background-color: rgba(13, 110, 253, 0.1);
		        }
		        
		        .gold-section {
		            padding: 1.5rem;
		            border-bottom: 1px solid var(--border-color);
		        }
		        
		        .gold-amount {
		            font-size: 2.5rem;
		            font-weight: bold;
		            color: var(--gold-color);
		            text-align: center;
		            margin-bottom: 1rem;
		        }
		        
		        .gold-label {
		            color: var(--text-muted);
		            text-align: center;
		            margin-bottom: 1.5rem;
		        }
		        
		        .signin-btn {
		            background: linear-gradient(45deg, #ffd700, #ffed4e);
		            color: #333;
		            font-weight: bold;
		            border: none;
		            padding: 0.75rem;
		            border-radius: 8px;
		            width: 100%;
		            transition: all 0.3s;
		            display: flex;
		            align-items: center;
		            justify-content: center;
		            gap: 0.5rem;
		        }
		        
		        .signin-btn:hover {
		            transform: translateY(-2px);
		            box-shadow: 0 5px 15px rgba(255, 215, 0, 0.4);
		        }
		        
		        .signin-btn:active {
		            transform: translateY(0);
		        }
		        
		        .signin-btn:disabled {
		            opacity: 0.7;
		            cursor: not-allowed;
		        }
		        
		        .menu-section {
		            padding: 1.5rem 0;
		        }
		        
		        .nav-link {
		            color: var(--text-muted);
		            padding: 0.75rem 1.5rem;
		            border-left: 3px solid transparent;
		            transition: all 0.3s;
		            display: flex;
		            align-items: center;
		            gap: 0.75rem;
		        }
		        
		        .nav-link:hover, .nav-link.active {
		            color: var(--text-color);
		            background-color: rgba(13, 110, 253, 0.1);
		            border-left-color: var(--primary-color);
		        }
		        
		        .nav-icon {
		            width: 24px;
		            text-align: center;
		        }
		     .qr-close{
    position:absolute; top:12px; right:12px;
    width:32px; height:32px; border:none; border-radius:50%;z-index: 66;
    background:#f2f5f8; color:#8b98a8; font-size:18px; line-height:1;
    display:flex; align-items:center; justify-content:center;
    cursor:pointer; transition:all .2s;
}
.qr-close:hover{ background:#e6ebf0; color:#4a5a6d; transform:rotate(90deg); }
.qr-close:active{ transform:rotate(90deg) scale(.9); }

		        /* 右侧内容区样式 */
		        .main-content {
		            background-color: var(--dark-bg);
		            padding: 2rem;
		            overflow-y: auto;
		        }
		        
		        .page-title {
		            margin-bottom: 2rem;
		            padding-bottom: 1rem;
		            border-bottom: 1px solid var(--border-color);
		        }
		        
		        /* 会员信息卡片样式 */
		        .member-card {
		            background-color: var(--card-bg);
		            border-radius: 10px;
		            border: 1px solid var(--border-color);
		            padding: 1.5rem;
		            margin-bottom: 2rem;
		        }
		        
		        .member-info {
		            display: flex;
		            justify-content: space-between;
		            align-items: flex-start;
		        }
		        
		        .member-type {
		            display: inline-block;
		            padding: 0.25rem 0.75rem;
		            border-radius: 20px;
		            font-weight: bold;
		            font-size: 0.9rem;
		        }
		        
		        .member-normal {
		            background-color: #6c757d;
		            color: white;
		        }
		        
		        .member-vip {
		            background: linear-gradient(45deg, var(--vip-purple), var(--vip-gold));
		            color: white;
		        }
		        
		        .download-count {
		            text-align: right;
		        }
		        
		        .download-number {
		            font-size: 2rem;
		            font-weight: bold;
		            color: var(--primary-color);
		        }
		        
 #qrModal .modal-content{ border:none; border-radius:20px; overflow:hidden; }
.qr-box{ text-align:center; padding:26px 22px 22px; }
.qr-box .brand-tag{
    display:inline-block; padding:4px 12px; border-radius:20px;
    font-size:12.5px; font-weight:600; margin-bottom:14px;
}
.qr-box .brand-tag.wechat{ background:#f1fdf5; color:var(--wechat); }
.qr-box .brand-tag.alipay{ background:#f0f6ff; color:var(--alipay); }
.qr-img{
    width:196px; height:196px; border-radius:12px;
    border:1px solid #eef1f5; padding:8px; background:#fff;
}
.qr-amount{ font-size:26px; font-weight:700; color:#1f2d3d; margin:14px 0 4px; }
.qr-amount small{ font-size:15px; font-weight:600; margin-right:2px; }
.qr-tip{ font-size:13px; color:#8b98a8; }
.qr-order{ font-size:12px; color:#aab6c4; margin-top:10px; word-break:break-all; }
.mock-pay-btn{ margin-top:12px; font-size:12.5px; color:#aab6c4; }



.pm-box{ padding:24px 22px 20px; text-align:center; }
.pm-title{ font-size:15px; font-weight:700; color:#1f2d3d; margin-bottom:4px; }
.pm-plan{ font-size:12.5px; color:#9aa7b6; margin-bottom:14px; }
.pm-amount{
    font-size:32px; font-weight:800; color:#1f2d3d;
    letter-spacing:-1px; margin-bottom:22px;
}
.pm-amount small{ font-size:17px; font-weight:700; margin-right:2px; }

.pm-list{ display:flex; flex-direction:column; gap:10px; }
.pm-item{
    --brand:var(--wechat);
    display:flex; align-items:center; gap:12px;
    padding:14px 16px; text-align:left;
    border:2px solid #e8ecf1; border-radius:14px;
    background:#fafbfc; cursor:pointer;
    transition:border-color .22s, background .22s, transform .18s, box-shadow .22s;
}
.pm-item[data-type="alipay"]{ --brand:var(--alipay); }
.pm-item:hover{
    border-color:var(--brand); background:#fff;
    transform:translateY(-2px);
    box-shadow:0 8px 20px rgba(24,43,80,.09);
}
.pm-item:active{ transform:translateY(0) scale(.99); }

.pm-icon{
    flex:none; width:38px; height:38px; border-radius:11px;
    display:flex; align-items:center; justify-content:center; color:#fff;
}
.pm-icon.wechat{ background:linear-gradient(135deg,#22d16a,#07c160); }
.pm-icon.alipay{ background:linear-gradient(135deg,#3b8cff,#1677ff); }

.pm-info{ flex:1; min-width:0; }
.pm-name{ font-size:14.5px; font-weight:600; color:#2c3a4b; }
.pm-desc{ font-size:11.5px; color:#9aa7b6; margin-top:2px; }
.pm-arrow{ color:#c5ced8; font-size:20px; line-height:1; }

.pm-cancel{
    width:100%; margin-top:16px; padding:11px 0;
    font-size:14px; color:#6b7a8d;
    background:#f4f7fa; border:1px solid #e8ecf1; border-radius:12px;
    cursor:pointer; transition:all .18s;
}
.pm-cancel:hover{ background:#eef2f7; color:#3c4a5c; }

/* ---------- 二维码弹窗 ---------- */
#qrModal .modal-content{ border:none; border-radius:20px; overflow:hidden; }
.qr-box{ position:relative; text-align:center; padding:26px 22px 22px; }
.qr-close{
    position:absolute; top:12px; right:12px;
    width:32px; height:32px; border:none; border-radius:50%;
    background:#f2f5f8; color:#8b98a8; font-size:18px; line-height:1;
    display:flex; align-items:center; justify-content:center;
    cursor:pointer; transition:all .2s;
}
.qr-close:hover{ background:#e6ebf0; color:#4a5a6d; transform:rotate(90deg); }
.qr-close:active{ transform:rotate(90deg) scale(.9); }

.qr-box .brand-tag{
    display:inline-block; padding:4px 12px; border-radius:20px;
    font-size:12.5px; font-weight:600; margin-bottom:14px;
}
.qr-box .brand-tag.wechat{ background:#f1fdf5; color:var(--wechat); }
.qr-box .brand-tag.alipay{ background:#f0f6ff; color:var(--alipay); }

.qr-wrap{
    width:196px; height:196px; margin:0 auto; padding:8px;
    border:1px solid #eef1f5; border-radius:12px; background:#fff;
    display:flex; align-items:center; justify-content:center; overflow:hidden;
}
.qr-wrap img,
.qr-wrap canvas{ width:180px !important; height:180px !important; display:block; }

.qr-amount{ font-size:26px; font-weight:700; color:#1f2d3d; margin:14px 0 4px; }
.qr-amount small{ font-size:15px; font-weight:600; margin-right:2px; }
.qr-plan-tag{ font-size:12.5px; color:#9aa7b6; margin-bottom:6px; }
.qr-tip{ font-size:13px; color:#8b98a8; }
.qr-order{ font-size:12px; color:#aab6c4; margin-top:10px; word-break:break-all; }
.mock-pay-btn{ margin-top:12px; font-size:12.5px; color:#aab6c4; }
.qr-cancel{
    display:block; width:100%; margin-top:16px; padding:11px 0;
    font-size:14px; color:#6b7a8d;
    background:#f4f7fa; border:1px solid #e8ecf1; border-radius:12px;
    cursor:pointer; transition:all .18s;
}
.qr-cancel:hover{ background:#eef2f7; color:#3c4a5c; }


/* ---------- Toast ---------- */
.my-toast{
    position:fixed; left:50%; top:38px; z-index:9999;
    transform:translate(-50%,-24px);
    padding:11px 22px; border-radius:12px;
    background:rgba(31,45,61,.92); color:#fff; font-size:14px;
    opacity:0; pointer-events:none; transition:all .3s;
    box-shadow:0 10px 30px rgba(0,0,0,.18);
}
.my-toast.show{ opacity:1; transform:translate(-50%,0); }
.my-toast.success{ background:rgba(7,193,96,.95); }
		        
	.free-card 	 .feature-item i{color: var(--secondary-color);}
	.vip-card	 .feature-item i{color: var(--primary-color);}	 
	.svip-card	 .feature-item i{color: var(--danger-color);}	 
	.svip2-card	 .feature-item i{color: #6f42c1;;}
	
		        /* 充值区域样式 */
		        .recharge-section {
		            background-color: var(--card-bg);
		            border-radius: 10px;
		            border: 1px solid var(--border-color);
		            padding: 1.5rem;
		            margin-bottom: 2rem;
		        }
		        
		        .recharge-title {
		            margin-bottom: 1.5rem;
		            padding-bottom: 0.75rem;
		            border-bottom: 1px solid var(--border-color);
		        }
		        
		        .amount-input-group {
		            margin-bottom: 1.5rem;
		        }
		        
		        .amount-input {
		            background-color: rgba(255, 255, 255, 0.05);
		            border: 1px solid var(--border-color);
		            color: var(--text-color);
		            padding: 0.75rem;
		            border-radius: 8px;
		            font-size: 1.2rem;
		        }
		        
		        .amount-input:focus {
		            background-color: rgba(255, 255, 255, 0.1);
		            border-color: var(--primary-color);
		            box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
		            color: var(--text-color);
		        }
		        
		        .payment-methods {
		            margin-bottom: 1.5rem;
		        }
		        
		        .payment-method {
		            display: flex;
		            align-items: center;
		            padding: 0.75rem;
		            border: 1px solid var(--border-color);
		            border-radius: 8px;
		            margin-bottom: 0.75rem;
		            cursor: pointer;
		            transition: all 0.3s;
		        }
		        
		        .payment-method:hover {
		            background-color: rgba(13, 110, 253, 0.1);
		            border-color: var(--primary-color);
		        }
		        
		        .payment-method.active {
		            background-color: rgba(13, 110, 253, 0.2);
		            border-color: var(--primary-color);
		        }
		        
		        .payment-icon {
		            width: 40px;
		            height: 40px;
		            border-radius: 8px;
		            display: flex;
		            align-items: center;
		            justify-content: center;
		            margin-right: 1rem;
		            font-size: 1.2rem;
		        }
		        
		        .wechat-pay {
		            background: linear-gradient(135deg, #07c160, #4cd964);
		            color: white;
		        }
		        
		        .alipay-pay {
		            background: linear-gradient(135deg, #1677ff, #69b1ff);
		            color: white;
		        }
		        
		        .recharge-btn {
		            background-color: var(--primary-color);
		            border: none;
		            padding: 0.75rem;
		            border-radius: 8px;
		            font-weight: bold;
		            width: 100%;
		            transition: all 0.3s;
		        }
		        
		        .recharge-btn:hover {
		            background-color: #0b5ed7;
		            transform: translateY(-2px);
		            box-shadow: 0 5px 15px rgba(13, 110, 253, 0.4);
		        }
		        
		        /* 说明区域样式 */
		        .instructions-section {
		            background-color: var(--card-bg);
		            border-radius: 10px;
		            border: 1px solid var(--border-color);
		            padding: 1.5rem;
		        }
		        
		        .instructions-title {
		            margin-bottom: 1rem;
		            color: var(--primary-color);
		        }
		        
		        .instructions-list {
		            padding-left: 1.5rem;
		        }
		        
		        .instructions-list li {
		            margin-bottom: 0.5rem;
		            line-height: 1.5;
		        }
		        .text-muted{        color: var(--text-muted) !important;}
				        
				        .pricing-card {
				            background-color: var(--card-bg);
				            border-radius: 15px;
				            border: 1px solid var(--card-border);
				            transition: all 0.3s ease;
				            overflow: hidden;
				            margin-bottom: 30px;
				            height: 100%;
				        }
				        
				        .pricing-card:hover {
				            transform: translateY(-10px);
				            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
				        }
				        
				        .pricing-header {
				            padding: 30px 20px;
				            text-align: center;
				            border-bottom: 1px solid var(--card-border);
				        }
				        
				        .pricing-title {
				            font-size: 1.2rem;
				            font-weight: bold;
				            margin-bottom: 10px;
				        }
				        
				        .pricing-price {
				            font-size: 2.5rem;
				            font-weight: bold;
				            margin: 20px 0;
				        }
				        
				        .pricing-price span {
				            font-size: 1.5rem;
				            color: var(--text-secondary);
				        }
				        
				        .pricing-features {
				            padding: 30px 20px;
				        }
				        
				        .feature-item {
				            display: flex;
				            align-items: center;
				            margin-bottom: 15px;
				            color: var(--text-secondary);
				        }
				        
				        .feature-item i {
				            margin-right: 10px;
				            font-size: 1.2rem;
				        }
				        
				        .btn-purchase {
				            display: block;
				            width: 80%;
				            margin: 20px auto 30px;
				            padding: 12px;
				            font-weight: bold;
				            border-radius: 8px;
				            border: none;
				            transition: all 0.3s ease;
				        }
				        
				        .badge-popular {
				            position: absolute;
				            top: 15px;
				            right: -30px;
				            background-color: #ffc107;
				            color: #000;
				            padding: 5px 30px;
				            transform: rotate(45deg);
				            font-weight: bold;
				            font-size: 0.8rem;
				        }
				        
				        .badge-value {
				            position: absolute;
				            top: 15px;
				            right: -30px;
				            background-color: #6f42c1;
				            color: white;
				            padding: 5px 30px;
				            transform: rotate(45deg);
				            font-weight: bold;
				            font-size: 0.8rem;
				        }
				        
				        .card-popular {
				            border: 2px solid #ffc107;
				            position: relative;
				            overflow: hidden;
				        }
				        
				        .card-value {
				            border: 2px solid #6f42c1;
				            position: relative;
				            overflow: hidden;
				        }
				        
				        .free-card .pricing-header {
				            background-color: rgba(108, 117, 125, 0.2);
				        }
				        
				        .vip-card .pricing-header {
				            background-color: rgba(13, 110, 253, 0.2);
				        }
				        
				        .svip-card .pricing-header {
				            background-color: rgba(220, 53, 69, 0.2);
				        }
				        
				        .svip2-card .pricing-header {
				            background-color: rgba(111, 66, 193, 0.2);
				        }
				        
				        .btn-free {
				            background-color: var(--secondary-color);
				            color: white;
				        }
				        
				        .btn-vip {
				            background-color: var(--primary-color);
				            color: white;
				        }
				        
				        .btn-svip {
				            background-color: var(--danger-color);
				            color: white;
				        }
				        
				        .btn-svip2 {
				            background-color: #6f42c1;
				            color: white;
				        }
				        
				        .btn-free:hover {
				            background-color: #5a6268;
				            color: white;
				        }
				        
				        .btn-vip:hover {
				            background-color: #0b5ed7;
				            color: white;
				        }
				        
				        .btn-svip:hover {
				            background-color: #bb2d3b;
				            color: white;
				        }
				        
				        .btn-svip2:hover {
				            background-color: #5a32a3;
				            color: white;
				        }
				        
				        .section-title {
				            text-align: center;
				            margin-bottom: 50px;
				            position: relative;
				        }
				        
				        .section-title:after {
				            content: '';
				            display: block;
				            width: 80px;
				            height: 4px;
				            background-color: var(--primary-color);
				            margin: 15px auto;
				            border-radius: 2px;
				        }
				        
				        .comparison-table {
				            background-color: var(--card-bg);
				            border-radius: 10px;
				            overflow: hidden;
				            margin-top: 50px;
				        }
				        
				        .comparison-table th {
				            background-color: var(--darker-bg);
				            font-weight: bold;
				            text-align: center;
				            padding: 20px;
				        }
				        
				        .comparison-table td {
				            padding: 15px 20px;
				            border-bottom: 1px solid var(--card-border);
				        }
				        
				        .feature-icon {
				            width: 24px;
				            height: 24px;
				            border-radius: 50%;
				            display: inline-flex;
				            align-items: center;
				            justify-content: center;
				            margin-right: 10px;
				        }
				        
				        .free-icon {
				            background-color: rgba(108, 117, 125, 0.3);
				            color: var(--secondary-color);
				        }
				        
				        .vip-icon {
				            background-color: rgba(13, 110, 253, 0.3);
				            color: var(--primary-color);
				        }
				        
				        .svip-icon {
				            background-color: rgba(220, 53, 69, 0.3);
				            color: var(--danger-color);
				        }
				        
				        .svip2-icon {
				            background-color: rgba(111, 66, 193, 0.3);
				            color: #6f42c1;
				        }
						  /* 记录表格容器 */
						        .records-container {
						            background-color: var(--card-bg);
						            border-radius: 12px;
						            border: 1px solid var(--border-color);
						            overflow: hidden;
						            margin-bottom: 2rem;
						        }
						        
						        .records-header {
						            padding: 1.5rem;
						            border-bottom: 1px solid var(--border-color);
						            display: flex;
						            justify-content: space-between;
						            align-items: center;
						            flex-wrap: wrap;
						            gap: 1rem;
						        }
						        
						        .records-title {
						            font-weight: 600;
						            font-size: 1.2rem;
						            color: var(--text-color);
						        }
						        
						        .records-actions {
						            display: flex;
						            gap: 0.75rem;
						            align-items: center;
						        }
						        
						        .export-btn {
						            background-color: rgba(255, 255, 255, 0.05);
						            border: 1px solid var(--border-color);
						            color: var(--text-color);
						            font-weight: 500;
						            padding: 0.5rem 1rem;
						            border-radius: 6px;
						            transition: all 0.3s;
						            display: flex;
						            align-items: center;
						            gap: 0.5rem;
						        }
						        
						        .export-btn:hover {
						            background-color: rgba(255, 255, 255, 0.1);
						            border-color: var(--primary-color);
						        }
						        
						        /* 表格样式 */
						        .records-table {
						            width: 100%;
						            border-collapse: collapse;
						        }
						        
						        .records-table thead {
						            background-color: rgba(13, 110, 253, 0.1);
						        }
						        
						        .records-table th {
						            padding: 1rem;
						            text-align: left;
						            font-weight: 600;
						            color: var(--text-color);
						            border-bottom: 1px solid var(--border-color);
						        }
						        
						        .records-table tbody tr {
						            border-bottom: 1px solid var(--border-color);
						            transition: background-color 0.3s;
						        }
						        
						        .records-table tbody tr:hover {
						            background-color: rgba(255, 255, 255, 0.05);
						        }
						        
						        .records-table td {
						            padding: 1rem;
						            color: var(--text-color);
						        }
						        
						        .order-id {
						            font-weight: 500;
						            color: var(--primary-color);
						        }
						        
						        .amount {
						            font-weight: 600;
						            color: #ffd700;
						        }
						        
						        .status-badge {
						            display: inline-block;
						            padding: 0.25rem 0.75rem;
						            border-radius: 20px;
						            font-size: 0.85rem;
						            font-weight: 500;
						        }
						        
						        .status-success {
						            background-color: rgba(25, 135, 84, 0.2);
						            color: var(--success-color);
						        }
						        
						        .status-pending {
						            background-color: rgba(255, 193, 7, 0.2);
						            color: var(--warning-color);
						        }
						        
						        .status-failed {
						            background-color: rgba(220, 53, 69, 0.2);
						            color: var(--danger-color);
						        }
						        
						        .payment-method {
						            display: flex;
						            align-items: center;
						            gap: 0.5rem;
						        }
						        
						        .payment-icon {
						            width: 24px;
						            height: 24px;
						            border-radius: 4px;
						            display: flex;
						            align-items: center;
						            justify-content: center;
						            font-size: 0.9rem;
						        }
						        
						        .wechat-icon {
						            background-color: rgba(7, 193, 96, 0.2);
						            color: #07c160;
						        }
						        
						        .alipay-icon {
						            background-color: rgba(18, 183, 245, 0.2);
						            color: #12b7f5;
						        }
						        
						        .bank-icon {
						            background-color: rgba(108, 117, 125, 0.2);
						            color: #6c757d;
						        }
						        
						        .action-btn {
						            background-color: rgba(255, 255, 255, 0.05);
						            border: 1px solid var(--border-color);
						            color: var(--text-color);
						            font-size: 0.85rem;
						            padding: 0.25rem 0.75rem;
						            border-radius: 4px;
						            transition: all 0.3s;
						        }
						        
						        .action-btn:hover {
						            background-color: rgba(13, 110, 253, 0.2);
						            border-color: var(--primary-color);
						        }
						        .fany{display:flex;align-items: center; justify-content: center; margin-top:1.6rem;text-transform: uppercase;
}
/*分页*/
.page1 {
   display: flex;
   align-items: center;
   justify-content: center;
flex-wrap: wrap; font-size:.9rem;
padding:1.2rem 0;
}
.divid-a a {
   background-color: rgba(255, 255, 255, 0.05);
   color: #fff; font-size:.9rem;
  min-width:35px;text-decoration:none;
   padding:0px 10px; height:35px;
   cursor:pointer; margin:5px 4px;
   display: flex;
   align-items: center;
   justify-content: center;
   border:1px ##333 solid; border-radius:5px;
   
} 
.divid-a span{ margin:5px 10px;}
.divid-a span.current{    background-color:#0d6efd;
    border-color: #0d6efd;
    color: white;
	 display: flex;
   align-items: center;
   justify-content: center; border-radius:5px;

     min-width:35px;
height:35px;
	}

.divid-a .active ,.divid-a a:hover{
  color: #fff;
   background:#0d6efd;
   border:1px #0d6efd solid;
}

	
	
	
	
		        /* 分页样式 */
						        .pagination-container {
						            padding: 1.5rem;
						            border-top: 1px solid var(--border-color);
						            display: flex;
						            justify-content: space-between;
						            align-items: center;
						            flex-wrap: wrap;
						            gap: 1rem;
						        }
						        
						        .pagination-info {
						            color: var(--text-muted);
						            font-size: 0.9rem;
						        }
						        
						        .pagination {
						            display: flex;
						            gap: 0.5rem;
						        }
						        
						        .page-link {
						            background-color: rgba(255, 255, 255, 0.05);
						            border: 1px solid var(--border-color);
						            color: var(--text-color);
						            padding: 0.5rem 0.75rem;
						            border-radius: 6px;
						            transition: all 0.3s;
						            text-decoration: none;
						        }
						        
						        .page-link:hover {
						            background-color: rgba(255, 255, 255, 0.1);
						            border-color: var(--primary-color);
						        }
						        
						        .page-link.active {
						            background-color: var(--primary-color);
						            border-color: var(--primary-color);
						            color: white;
						        }
						        
						        .page-link.disabled {
						            opacity: 0.5;
						            cursor: not-allowed;
						        }
		
						        /* 分页样式 */
						        .pagination-container {
						            padding: 1.5rem;
						            border-top: 1px solid var(--border-color);
						            display: flex;
						            justify-content: space-between;
						            align-items: center;
						            flex-wrap: wrap;
						            gap: 1rem;
						        }
						        
						        .pagination-info {
						            color: var(--text-muted);
						            font-size: 0.9rem;
						        }
						        
						        .pagination {
						            display: flex;
						            gap: 0.5rem;
						        }
						        
						        .page-link {
						            background-color: rgba(255, 255, 255, 0.05);
						            border: 1px solid var(--border-color);
						            color: var(--text-color);
						            padding: 0.5rem 0.75rem;
						            border-radius: 6px;
						            transition: all 0.3s;
						            text-decoration: none;
						        }
						        
						        .page-link:hover {
						            background-color: rgba(255, 255, 255, 0.1);
						            border-color: var(--primary-color);
						        }
						        
						        .page-link.active {
						            background-color: var(--primary-color);
						            border-color: var(--primary-color);
						            color: white;
						        }
						        
						        .page-link.disabled {
						            opacity: 0.5;
						            cursor: not-allowed;
						        }
						        
						        /* 空状态 */
						        .empty-state {
						            padding: 3rem 1.5rem;
						            text-align: center;
						        }
						        
						        .empty-icon {
						            font-size: 3rem;
						            color: var(--text-muted);
						            margin-bottom: 1rem;
						        }
						        
						        .empty-text {
						            color: var(--text-muted);
						            margin-bottom: 1.5rem;
						        }
								
								
.form-container{background:#1e1e1e;border-radius:12px;border:1px solid #333;padding:25px;margin-top:20px;box-shadow:0 8px 30px rgba(0,0,0,0.4);}.form-header{border-bottom:2px solid #0d6efd;padding-bottom:15px;margin-bottom:25px;text-align:center;}.form-header h2{font-weight:700;}.form-label{color:#f8f9fa;font-weight:500;margin-bottom:6px;}.form-control,.form-select{background:#2d2d2d;border:1px solid #444;color:#f8f9fa;border-radius:8px;padding:10px 15px;transition:all 0.3s;}.form-control:focus,.form-select:focus{background:#2d2d2d;border-color:#0d6efd;box-shadow:0 0 0 0.25rem rgba(13,110,253,0.25);}.form-control:disabled{background:#252525;color:#888;}.input-group-text{background:#252525;border:1px solid #444;color:#adb5bd;}.btn-primary{background:#0d6efd;border:none;border-radius:8px;padding:10px 20px;font-weight:500;transition:all 0.3s;}.btn-primary:hover{background:#0b5ed7;transform:translateY(-2px);}.btn-outline-secondary{color:#adb5bd;border-color:#555;border-radius:8px;}.btn-danger{background:#dc3545;border:none;border-radius:8px;}.btn-success{background:#198754;border:none;border-radius:8px;}.form-text{color:#adb5bd;font-size:0.85rem;margin-top:4px;}.section-divider{margin:25px 0;border-top:1px solid #333;}.section-title{font-size:1.2rem;font-weight:600;margin-bottom:15px;color:#f8f9fa;}.section-title i{color:#0d6efd;margin-right:8px;}.alert-warning{background:rgba(255,193,7,0.15);color:#ffc107;border-left:4px solid #ffc107;border-radius:6px;padding:12px;}.alert-info{background:rgba(13,110,253,0.15);color:#0d6efd;border-left:4px solid #0d6efd;border-radius:6px;padding:12px;}.password-strength{height:4px;border-radius:2px;margin-top:6px;transition:all 0.3s;}.verification-status{display:inline-flex;align-items:center;padding:4px 12px;border-radius:20px;font-size:0.85rem;}.status-verified{background:rgba(25,135,84,0.2);color:#198754;}.status-unverified{background:rgba(220,53,69,0.2);color:#dc3545;}.wechat-connected{display:flex;align-items:center;background:rgba(25,135,84,0.1);border:1px solid rgba(25,135,84,0.3);border-radius:8px;padding:12px;margin-top:10px;}.wechat-avatar{width:45px;height:45px;border-radius:50%;background:#07c160;display:flex;align-items:center;justify-content:center;margin-right:12px;color:white;font-size:22px;}.form-footer{display:flex;justify-content:space-between;margin-top:25px;padding-top:20px;border-top:1px solid #333;}.input-group{box-shadow:0 2px 5px rgba(0,0,0,0.2);border-radius:8px;}.input-group .form-control{border-radius:0 8px 8px 0;}.input-group .input-group-text{border-radius:8px 0 0 8px;}.mb-compact{margin-bottom:16px !important;}		
						
						
						
						  .products-grid {
						            display: grid;
						            grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
						            gap: 1.5rem;
						        }
						        
						        .product-card {
						            background-color: var(--card-bg);
						            border-radius: 12px;
						            border: 1px solid var(--border-color);
						            overflow: hidden;
						            transition: all 0.3s;
						            position: relative;
						        }
						        
						        .product-card:hover {
						            transform: translateY(-8px);
						            box-shadow: 0 15px 35px rgba(0, 0, 0, 0.3);
						            border-color: var(--primary-color);
						        }
						        
						        .product-card.selected {
						            border-color: var(--primary-color);
						            box-shadow: 0 0 0 2px var(--primary-color);
						        }
						        
						        .product-select {
						            position: absolute;
						            top: 15px;
						            left: 15px;
						            z-index: 10;
						            width: 20px;
						            height: 20px;
						            cursor: pointer;
						            accent-color: var(--primary-color);
						        }
						        
						        .product-image {
						            position: relative;
						            height: 180px;
						            overflow: hidden;
						        }
						        
						        .product-image img {
						            width: 100%;
						            height: 100%;
						            object-fit: cover;
						            transition: transform 0.5s;
						        }
						        
						        .product-card:hover .product-image img {
						            transform: scale(1.05);
						        }
						        
						        .product-category {
						            position: absolute;
						            top: 15px;
						            right: 15px;
						            background-color: rgba(0, 0, 0, 0.7);
						            color: white;
						            font-size: 0.75rem;
						            padding: 0.25rem 0.5rem;
						            border-radius: 4px;
						        }
						        
						        .product-content {
						            padding: 1.25rem;
						        }
						        
						        .product-title {
						            font-weight: 600;
						            margin-bottom: 0.5rem;
						            font-size: 1.1rem;
						            line-height: 1.3;
						            height: 2.6em;
						            overflow: hidden;
						            display: -webkit-box;
						            -webkit-line-clamp: 2;
						            -webkit-box-orient: vertical;
						        }
						        
						        .product-description {
						            color: var(--text-muted);
						            font-size: 0.85rem;
						            margin-bottom: 1rem;
						            line-height: 1.4;
						            height: 2.8em;
						            overflow: hidden;
						            display: -webkit-box;
						            -webkit-line-clamp: 2;
						            -webkit-box-orient: vertical;
						        }
						        
						        .product-footer {
						            display: flex;
						            justify-content: space-between;
						            align-items: center;
						            padding-top: 0.75rem;
						            border-top: 1px solid var(--border-color);
						        }
						        
						        .product-price {
						            font-weight: 700;
						            font-size: 1.2rem;
						            color: #ffd700;
						        }
						        
						        .product-actions {
						            display: flex;
						            gap: 0.5rem;
						        }
						        
						        .product-btn {
						            background-color: rgba(255, 255, 255, 0.05);
						            border: 1px solid var(--border-color);
						            color: var(--text-color);
						            width: 36px;
						            height: 36px;
						            border-radius: 6px;
						            display: flex;
						            align-items: center;
						            justify-content: center;
						            transition: all 0.3s;
						            cursor: pointer;
						        }
						        
						        .product-btn:hover {
						            background-color: rgba(13, 110, 253, 0.1);
						            border-color: var(--primary-color);
						            transform: translateY(-2px);
						        }
						        
						        .product-btn.delete:hover {
						            background-color: rgba(220, 53, 69, 0.1);
						            border-color: var(--danger-color);
						        }
						
								 .table-container {
								            background-color: var(--table-bg);
								            border-radius: 8px;
								            overflow: hidden;
								            border: 1px solid var(--table-border);
								        }
								        
								        .table-dark {
								            --bs-table-bg: var(--table-bg);
								            --bs-table-border-color: var(--table-border);
								            --bs-table-striped-bg: rgba(255, 255, 255, 0.05);
								            --bs-table-hover-bg: rgba(88, 166, 255, 0.1);
								            margin-bottom: 0;
								        }
								        
								        .table-dark th {
								            border-bottom: 2px solid var(--table-border);
								            font-weight: 600;
								            color: var(--accent-color);
								            padding: 12px 16px;
								        }
								        
								        .table-dark td {
								            padding: 12px 16px;
								            vertical-align: middle;
								        }
								        
								        .status-badge {
								            padding: 4px 8px;
								            border-radius: 4px;
								            font-size: 12px;
								            font-weight: 500;
								        }
								        
								        .status-valid {
								            background-color: rgba(35, 134, 54, 0.2);
								            color: #3fb950;
								        }
								        
								        .status-expiring {
								            background-color: rgba(158, 106, 3, 0.2);
								            color: #d29922;
								        }
								        
								        .status-expired {
								            background-color: rgba(218, 54, 51, 0.2);
								            color: #da3633;
								        }
								        
								        .link-cell {
								            max-width: 300px;
								        }
								        
								        .link-text {
								            background-color: rgba(255, 255, 255, 0.05);
								            border: 1px solid var(--table-border);
								            border-radius: 4px;
								            padding: 6px 10px;
								            font-family: monospace;
								            font-size: 12px;
								            display: inline-block;
								            max-width: 100%;
								            overflow: hidden;
								            text-overflow: ellipsis;
								            white-space: nowrap;
								        }
								        
								        .copy-btn {
								            padding: 4px 8px;
								            font-size: 12px;
								        }
								        
								        .action-btn {
								            padding: 4px 8px;
								            font-size: 12px;
								        }
								        
								        .search-box {
								            max-width: 300px;
								        }
								        
								        .search-input {
								            background-color: var(--secondary-dark);
								            border-color: var(--table-border);
								            color: var(--text-primary);
								        }
								        
								        .search-input:focus {
								            background-color: var(--secondary-dark);
								            border-color: var(--accent-color);
								            color: var(--text-primary);
								            box-shadow: 0 0 0 0.25rem rgba(88, 166, 255, 0.25);
								        }
				        
		        /* 响应式调整 */
		        @media (max-width: 992px) {
		            .sidebar {
		                height: auto;
		                position: static;
		            }
		            
		            .main-content {
		                padding: 1.5rem;
		            }
		            
		            .member-info {
		                flex-direction: column;
		                gap: 1.5rem;
		            }
		            
		            .download-count {
		                text-align: left;
		            }
		        }
		        
		        /* 签到成功提示 */
		        .signin-success {
		            position: fixed;
		            top: 20px;
		            right: 20px;
		            background-color: #198754;
		            color: white;
		            padding: 1rem 1.5rem;
		            border-radius: 8px;
		            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
		            z-index: 1000;
		            display: none;
		            align-items: center;
		            gap: 0.75rem;
		        }
		        
		        /* 选项卡内容样式 */
		        .tab-content {
		            display: none;
		        }
		        
		        .tab-content.active {
		            display: block;
		        }
		        
		        /* 充值记录样式 */
		        .record-table {
		            width: 100%;
		            background-color: var(--card-bg);
		            border-radius: 10px;
		            overflow: hidden;
		            border: 1px solid var(--border-color);
		        }
		        
		        .record-table th {
		            background-color: rgba(13, 110, 253, 0.2);
		            padding: 1rem;
		            text-align: left;
		            border-bottom: 1px solid var(--border-color);
		        }
		        
		        .record-table td {
		            padding: 1rem;
		            border-bottom: 1px solid var(--border-color);
		        }
		        
		        .record-table tr:last-child td {
		            border-bottom: none;
		        }
		        
		        .status-success {
		            color: #198754;
		        }
		        
		        .status-pending {
		            color: #ffc107;
		        }