/* AI GEO 优化系统 - 补充样式 v2.46 */

/* ============ FAQ 交互 ============ */
.faq-item .answer { display: none; }
.faq-item.active .answer { display: block; }
.faq-item h3 { cursor: pointer; user-select: none; }
.faq-item h3:hover { color: #f97316; }

/* ============ 表格 ============ */
table { width: 100%; border-collapse: collapse; }
td { padding: 10px 0; border-bottom: 1px solid #eee; }

/* ============ 按钮 ============ */
.btn { display:inline-flex; align-items:center; gap:6px; padding:10px 24px; border-radius:8px; font-size:0.95rem; font-weight:500; text-decoration:none; transition:all .3s; cursor:pointer; border:none; }
.btn-primary { background:#f97316; color:#fff; }
.btn-primary:hover { background:#ea580c; transform:translateY(-1px); box-shadow:0 4px 12px rgba(249,115,22,.3); }
.btn-outline { background:transparent; color:#f97316; border:2px solid #f97316; }
.btn-outline:hover { background:#f97316; color:#fff; transform:translateY(-1px); }
.btn-sm { padding:6px 14px; font-size:0.85rem; }
.btn-danger { background:#dc2626; color:#fff; }
.btn-danger:hover { background:#b91c1c; }

/* ============ 卡片 ============ */
.card { background:#fff; border-radius:12px; padding:24px; box-shadow:0 2px 10px rgba(0,0,0,.08); transition:transform .3s, box-shadow .3s; }
.card-hover { cursor:default; }
.card-hover:hover { transform:translateY(-3px); box-shadow:0 8px 25px rgba(0,0,0,.12); }

/* ============ 网格布局 ============ */
.grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.grid-3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:20px; }
.grid-4 { display:grid; grid-template-columns:1fr 1fr 1fr 1fr; gap:20px; }

/* ============ 监控面板 ============ */
.monitor-card { background:#fff; border-radius:12px; padding:24px; box-shadow:0 2px 10px rgba(0,0,0,.08); margin-bottom:20px; }
.monitor-card h3 { font-size:1.2rem; color:#1a1a2e; margin-bottom:16px; display:flex; align-items:center; gap:8px; }
.monitor-card .last-update { font-size:0.8rem; color:#888; margin-left:auto; font-weight:normal; }
.monitor-table { width:100%; border-collapse:collapse; font-size:0.9rem; }
.monitor-table th { text-align:left; padding:10px 8px; border-bottom:2px solid #eee; color:#666; font-size:0.8rem; text-transform:uppercase; }
.monitor-table td { padding:8px 8px; border-bottom:1px solid #f0f0f0; }
.monitor-table tr:hover td { background:#fafafa; }
.status-badge { display:inline-block; padding:2px 10px; border-radius:12px; font-size:0.75rem; font-weight:600; }
.status-running { background:#dcfce7; color:#16a34a; }
.status-sleeping { background:#fef3c7; color:#d97706; }
.status-idle { background:#e0f2fe; color:#0284c7; }
.status-stopped { background:#fee2e2; color:#dc2626; }
.status-zombie { background:#fce7f3; color:#db2777; }
.conn-stat { display:flex; flex-wrap:wrap; gap:12px; margin-top:8px; }
.conn-stat-item { flex:1; min-width:100px; text-align:center; padding:16px; border-radius:10px; background:#f8f9fa; transition:transform .2s; }
.conn-stat-item:hover { transform:scale(1.05); }
.conn-stat-item .num { font-size:1.8rem; font-weight:700; }
.conn-stat-item .label { font-size:0.8rem; color:#888; margin-top:4px; }
.conn-established .num { color:#16a34a; }
.conn-timewait .num { color:#d97706; }
.conn-listen .num { color:#0284c7; }
.conn-closewait .num { color:#dc2626; }
.conn-other .num { color:#6b7280; }
.chart-container { position:relative; height:250px; width:100%; }
.refresh-btn { background:#f97316; color:#fff; border:none; padding:6px 16px; border-radius:6px; cursor:pointer; font-size:0.85rem; margin-left:12px; transition:all .3s; }
.refresh-btn:hover { background:#ea580c; }
.refresh-btn:disabled { opacity:0.6; cursor:not-allowed; }
.loading { text-align:center; padding:40px; color:#888; }
.error-msg { text-align:center; padding:20px; color:#dc2626; background:#fee2e2; border-radius:8px; }

/* ============ 管理后台 ============ */
.admin-sidebar { width:240px; background:#1a1a2e; color:#fff; min-height:100vh; position:fixed; left:0; top:0; }
.admin-sidebar .logo { padding:20px; font-size:1.1rem; font-weight:700; border-bottom:1px solid rgba(255,255,255,.1); }
.admin-sidebar .nav-item { display:flex; align-items:center; gap:10px; padding:12px 20px; color:rgba(255,255,255,.7); text-decoration:none; transition:all .3s; }
.admin-sidebar .nav-item:hover { background:rgba(255,255,255,.1); color:#fff; }
.admin-sidebar .nav-item.active { background:rgba(249,115,22,.2); color:#f97316; border-right:3px solid #f97316; }
.admin-content { margin-left:240px; padding:24px; min-height:100vh; background:#f5f5f7; }

/* ============ Hero 区域 ============ */
.hero { background:linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%); color:#fff; padding:60px 20px; text-align:center; }
.hero h1 { font-size:2.2rem; margin-bottom:16px; }
.hero p { font-size:1.1rem; color:rgba(255,255,255,.8); max-width:600px; margin:0 auto 24px; }
.hero .stats { display:flex; justify-content:center; gap:40px; margin-top:32px; }
.hero .stat-item { text-align:center; }
.hero .stat-num { font-size:2rem; font-weight:700; color:#f97316; }
.hero .stat-label { font-size:0.85rem; color:rgba(255,255,255,.6); margin-top:4px; }

/* ============ 徽章 ============ */
.badge { display:inline-block; padding:2px 8px; border-radius:4px; font-size:0.75rem; font-weight:600; }
.badge-doubao { background:#fff7ed; color:#f97316; }
.badge-deepseek { background:#eff6ff; color:#3b82f6; }
.badge-qwen { background:#f0fdf4; color:#22c55e; }

/* ============ 进度条 ============ */
.progress-bar { height:8px; background:#e5e7eb; border-radius:4px; overflow:hidden; }
.progress-bar .fill { height:100%; border-radius:4px; transition:width 1s ease; }
.progress-bar .fill.green { background:#22c55e; }
.progress-bar .fill.orange { background:#f97316; }
.progress-bar .fill.red { background:#dc2626; }

/* ============ Toast 通知 ============ */
.toast { position:fixed; bottom:24px; right:24px; padding:12px 20px; border-radius:8px; color:#fff; font-size:0.9rem; z-index:9999; animation:slideUp .3s ease; }
.toast-success { background:#16a34a; }
.toast-error { background:#dc2626; }
@keyframes slideUp { from { transform:translateY(20px); opacity:0; } to { transform:translateY(0); opacity:1; } }

/* ============ 响应式 ============ */
@media (max-width: 768px) {
    .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr !important; }
    .hero .stats { flex-direction: column; gap: 15px; }
    .conn-stat-item { min-width:45%; }
    .admin-sidebar { width:60px; }
    .admin-sidebar .nav-item span { display:none; }
    .admin-content { margin-left:60px; }
    .hero h1 { font-size:1.5rem; }
}