/**
 * D2 对比复盘洞察 — 样式表
 *
 * CSS 前缀: aci- (acquisition compare insight)
 * 架构基线: .workbuddy/specs/acquisition-ai-capabilities/03-phase3-architecture.md
 */

.aci-page { padding: 24px; max-width: 1440px; margin: 0 auto; }
.aci-header { margin-bottom: 24px; }
.aci-title { font-size: 20px; font-weight: 600; color: #1a1a1a; margin: 0; }
.aci-subtitle { font-size: 13px; color: #8c8c8c; margin-top: 4px; }

/* Tab 导航 */
.aci-tabs { display: flex; gap: 0; border-bottom: 2px solid #e8e8e8; margin-bottom: 24px; }
.aci-tab { padding: 10px 20px; font-size: 14px; border: none; background: none; color: #555; cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.2s; }
.aci-tab:hover { color: #722ed1; }
.aci-tab--active { color: #722ed1; border-bottom-color: #722ed1; font-weight: 600; }

/* 生成面板 */
.aci-generate-panel { background: #fff; border: 1px solid #e8e8e8; border-radius: 8px; padding: 24px; max-width: 600px; margin: 0 auto; }
.aci-form-group { margin-bottom: 16px; }
.aci-form-label { display: block; font-size: 13px; font-weight: 500; color: #555; margin-bottom: 6px; }
.aci-form-input { width: 100%; padding: 8px 12px; border: 1px solid #d9d9d9; border-radius: 6px; font-size: 14px; box-sizing: border-box; }

/* 按钮 */
.aci-btn { padding: 8px 16px; border: 1px solid #d9d9d9; border-radius: 6px; font-size: 13px; cursor: pointer; transition: all 0.2s; background: #fff; color: #333; }
.aci-btn:hover { border-color: #722ed1; color: #722ed1; }
.aci-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.aci-btn--primary { background: #722ed1; color: #fff; border-color: #722ed1; }
.aci-btn--primary:hover { background: #531dab; border-color: #531dab; color: #fff; }
.aci-btn--outline { border-color: #722ed1; color: #722ed1; background: #fff; }
.aci-btn--outline:hover { background: #f9f0ff; }

/* 来源标签 */
.aci-source-badge { font-size: 11px; padding: 2px 8px; border-radius: 4px; }
.aci-source--ai { background: #e6f7ff; color: #1890ff; }
.aci-source--rule { background: #fff7e6; color: #fa8c16; }
.aci-source--default { background: #f5f5f5; color: #8c8c8c; }

/* 洞察详情 */
.aci-detail { max-width: 900px; }
.aci-detail-header { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; padding: 12px 0; border-bottom: 1px solid #f0f0f0; }
.aci-activity-count { font-size: 13px; color: #555; }
.aci-detail-time { font-size: 12px; color: #8c8c8c; margin-left: auto; }

.aci-section { background: #fff; border: 1px solid #e8e8e8; border-radius: 8px; padding: 20px; margin-bottom: 16px; }
.aci-section-title { font-size: 16px; font-weight: 600; color: #1a1a1a; margin: 0 0 12px 0; }
.aci-text-block { font-size: 14px; line-height: 1.7; color: #333; background: #fafafa; padding: 12px 16px; border-radius: 6px; }
.aci-text-block--summary { background: #f9f0ff; border-left: 3px solid #722ed1; }

/* 差异卡片 */
.aci-diff-card { border: 1px solid #f0f0f0; border-radius: 8px; padding: 14px; margin-bottom: 10px; }
.aci-diff-metric { font-size: 14px; font-weight: 600; color: #1a1a1a; margin-bottom: 6px; }
.aci-diff-compare { display: flex; gap: 16px; margin-bottom: 6px; }
.aci-diff-best { color: #52c41a; font-size: 13px; }
.aci-diff-worst { color: #ff4d4f; font-size: 13px; }
.aci-diff-gap { font-size: 13px; color: #fa8c16; margin-bottom: 4px; }
.aci-diff-analysis { font-size: 13px; color: #555; line-height: 1.5; }

/* 归因因子 */
.aci-factor { display: flex; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid #f5f5f5; }
.aci-factor:last-child { border-bottom: none; }
.aci-impact-badge { font-size: 14px; }
.aci-impact--positive { color: #52c41a; }
.aci-impact--negative { color: #ff4d4f; }
.aci-impact--neutral { color: #8c8c8c; }
.aci-factor-name { font-size: 13px; font-weight: 500; color: #1a1a1a; }
.aci-factor-explain { font-size: 12px; color: #8c8c8c; }

/* 规律 */
.aci-pattern { display: flex; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid #f5f5f5; }
.aci-pattern:last-child { border-bottom: none; }
.aci-confidence-badge { font-size: 10px; padding: 1px 6px; border-radius: 3px; }
.aci-confidence--high { background: #f6ffed; color: #52c41a; }
.aci-confidence--medium { background: #fff7e6; color: #fa8c16; }
.aci-confidence--low { background: #f5f5f5; color: #8c8c8c; }
.aci-pattern-name { font-size: 13px; font-weight: 500; color: #1a1a1a; }
.aci-pattern-desc { font-size: 12px; color: #555; }

/* 最佳实践 */
.aci-practice { border: 1px solid #e6f7ff; border-radius: 6px; padding: 12px; margin-bottom: 8px; background: #fafdfe; }
.aci-practice:last-child { margin-bottom: 0; }
.aci-practice-name { font-size: 14px; font-weight: 600; color: #1a1a1a; margin-bottom: 4px; }
.aci-practice-scenario { font-size: 12px; color: #555; }
.aci-practice-impact { font-size: 12px; color: #52c41a; }

.aci-detail-actions { margin-top: 20px; }

/* 历史列表 */
.aci-history-list { display: flex; flex-direction: column; gap: 8px; }
.aci-history-card { display: flex; align-items: center; gap: 12px; padding: 14px 18px; background: #fff; border: 1px solid #e8e8e8; border-radius: 8px; cursor: pointer; transition: border-color 0.2s; }
.aci-history-card:hover { border-color: #722ed1; }
.aci-history-ids { font-size: 13px; color: #555; }
.aci-history-count { font-size: 12px; color: #8c8c8c; }
.aci-history-time { font-size: 12px; color: #8c8c8c; margin-left: auto; }

/* 状态提示 */
.aci-empty { text-align: center; color: #8c8c8c; padding: 40px; font-size: 14px; }
.aci-error { background: #fff2f0; border: 1px solid #ffccc7; border-radius: 6px; padding: 10px 14px; color: #ff4d4f; font-size: 13px; margin-top: 12px; }

@media (max-width: 768px) {
    .aci-page { padding: 16px; }
    .aci-tabs { overflow-x: auto; }
    .aci-diff-compare { flex-direction: column; gap: 4px; }
}