/* ============================================================
   智众业务管理平台 — 科技墨绿主题覆盖层
   在 style.css 之后加载，差异化细节样式
   ============================================================ */

/* ---- 品牌区（侧边栏顶部） ---- */
.brand {
  display: flex; align-items: center; gap: 12px;
  padding: 20px 18px 18px; margin-bottom: 6px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.brand-logo {
  width: 40px; height: 40px; border-radius: 11px; flex-shrink: 0;
  background: linear-gradient(135deg, #34d399, #059669);
  color: #fff; font-size: 21px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 12px rgba(16,185,129,0.35);
}
.brand-text { display: flex; flex-direction: column; line-height: 1.3; }
.brand-text strong { font-size: 14px; color: #fff; letter-spacing: 0.5px; white-space: nowrap; }
.brand-text span { font-size: 9px; color: rgba(255,255,255,0.4); letter-spacing: 1.5px; margin-top: 2px; white-space: nowrap; }

/* ---- 侧边栏微调 ---- */
.sidebar h1 { letter-spacing: 1px; }
.sidebar .nav-item { border-radius: 0 10px 10px 0; margin: 2px 8px 2px 0; padding: 12px 16px; }
.sidebar .nav-item.active { border-left-color: var(--accent); }

/* ---- 主内容区背景 ---- */
.main { background: linear-gradient(180deg, #f6faf8 0%, #eef4f1 100%); }

/* ---- 页面头部 ---- */
.page-header h2::before {
  content: ''; display: inline-block; width: 4px; height: 18px;
  background: linear-gradient(180deg, #34d399, #059669);
  border-radius: 2px; margin-right: 10px; vertical-align: -2px;
}

/* ---- 卡片差异化 ---- */
.card {
  border-radius: 14px; border: 1px solid #dfeae4;
  background: linear-gradient(180deg, #ffffff, #fbfdfc);
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.card:hover { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(16,90,60,0.12); }
.card h3 { color: var(--gray-500); }

/* 总览数字卡片 */
.row .card .value { color: #0d9488; }

/* ---- 按钮差异化 ---- */
.btn { border-radius: 10px; font-weight: 600; }
.btn-primary { background: linear-gradient(135deg, #10b981, #059669); box-shadow: 0 2px 8px rgba(16,185,129,0.3); }
.btn-primary:hover { background: linear-gradient(135deg, #059669, #047857); box-shadow: 0 4px 12px rgba(16,185,129,0.4); }
.btn-success { background: linear-gradient(135deg, #10b981, #059669); }
.btn-outline { border-radius: 10px; }
.btn-outline:hover { border-color: #10b981; color: #047857; background: #f0fdf4; }

/* ---- 表格差异化 ---- */
.table-wrap { border: 1px solid #e3ede7; background: #fff; }
th { background: #f0f7f3; color: #3d5a4a; letter-spacing: 1px; }
tbody tr:nth-child(even) { background: #f8fbf9; }
tr:hover { background: #ecf7f1 !important; }

/* ---- 徽章差异化 ---- */
.badge { border-radius: 6px; font-weight: 600; }
.badge-success { background: #d1fae5; color: #047857; }
.badge-warning { background: #fef3c7; color: #92400e; }
.badge-danger { background: #fee2e2; color: #991b1b; }
.badge-info { background: #ccfbf1; color: #0f766e; }
.badge-gray { background: #eef2f0; color: #52715f; }

/* ---- 筛选按钮 ---- */
.filter-bar .filter-btn { border-radius: 8px; }
.filter-bar .filter-btn.active { background: linear-gradient(135deg, #10b981, #059669); border-color: transparent; }

/* ---- 弹窗 ---- */
.modal { border-radius: 18px; border: 1px solid #e0ebe5; }
.modal h3 { color: #1c2f26; }
.modal .modal-actions { border-top-color: #e9f0ec; }

/* ---- 抽屉 ---- */
.drawer-header { border-bottom-color: #e9f0ec; }
.drawer-header h3 { color: #1c2f26; }

/* ---- 表单聚焦 ---- */
.form-group input:focus, .form-group select:focus, .form-group textarea:focus {
  border-color: #10b981 !important; box-shadow: 0 0 0 3px rgba(16,185,129,0.15) !important;
}

/* ---- 进度条（PM 看板） ---- */
.pm-bprog .pm-fill { background: linear-gradient(90deg, #34d399, #059669) !important; }
.pm-tab.active { background: linear-gradient(135deg, #10b981, #059669) !important; }

/* ---- PM 统计卡片 ---- */
.pm-stat { border-radius: 14px; }
.pm-stat-icon { background: #ecfdf5 !important; color: #059669; }

/* ---- 滚动条 ---- */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #c2d6cc; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #9dbbae; }

/* ---- 空状态 ---- */
.empty-state { color: var(--gray-400); }

/* ---- AI 助手按钮（如有） ---- */
#aiToggle, .ai-toggle { background: linear-gradient(135deg, #10b981, #059669) !important; }

/* ---- 移动端菜单按钮 ---- */
.menu-toggle { background: var(--sidebar-bg) !important; border-radius: 10px; }
