
/* ===== 对接人管理模块 ===== */
.contacts-card{background:#fff;border-radius:10px;padding:16px 20px;box-shadow:0 1px 3px rgba(0,0,0,0.06);margin-bottom:20px;}
.contacts-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;flex-wrap:wrap;gap:10px;}
.contacts-title{font-size:15px;font-weight:600;color:#333;}
.contacts-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.contacts-search{padding:6px 10px;border:1px solid #ddd;border-radius:4px;font-size:12px;width:220px;outline:none;}
.contacts-search:focus{border-color:#e94560;}
.contacts-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.contacts-table{width:100%;border-collapse:collapse;font-size:13px;min-width:700px;}
.contacts-table th{background:#fafafa;padding:10px 8px;text-align:left;font-weight:600;color:#555;border-bottom:2px solid #f0f0f0;font-size:12px;white-space:nowrap;}
.contacts-table td{padding:10px 8px;border-bottom:1px solid #f5f5f5;}
.contacts-table tr:hover{background:#fafafa;}
.btn-black{background:#333;color:#fff;border:none;}
.btn-black:hover{background:#000;}
.btn-xs{padding:3px 8px;font-size:11px;}

/* ============================================================
 * 品宏外贸CRM系统 - 客户沟通时间轴核心样式
 * 包含：左右分栏布局、左侧时间轴列表、优先级按钮、
 *       右侧内容区、未回复状态、操作按钮、回复区、分页
 * ============================================================ */

/* ===== 时间轴容器 ===== */
.timeline-container{background:#fff;border-radius:10px;box-shadow:0 1px 3px rgba(0,0,0,0.06);display:flex;flex-direction:column;overflow:hidden;}
.timeline-body{display:flex;min-height:560px;}

/* ===== 左侧时间轴列表 ===== */
.timeline-left{width:340px;border-right:1px solid #eee;display:flex;flex-direction:column;}
.timeline-left-header{padding:14px 16px;border-bottom:1px solid #eee;background:#fafafa;font-size:13px;font-weight:600;color:#555;display:flex;align-items:center;justify-content:space-between;}
.timeline-list{flex:1;overflow-y:auto;max-height:560px;}
.timeline-item{padding:14px 16px;border-bottom:1px solid #f5f5f5;cursor:pointer;transition:background 0.15s;border-left:3px solid transparent;}
.timeline-item:hover{background:#fafbfc;}
.timeline-item.active{background:#fff5f7;border-left-color:#e94560;}
.timeline-item.highlight{animation:highlightFade 3s ease-out;}
@keyframes highlightFade{
  0%{background:#fff3cd;border-left-color:#ffc107;}
  100%{background:transparent;border-left-color:transparent;}
}
.timeline-time{font-size:12px;color:#999;margin-bottom:6px;}
.timeline-type{display:inline-block;font-size:10px;padding:1px 6px;border-radius:3px;margin-bottom:6px;font-weight:500;}
.type-email{background:#e6f0ff;color:#1a6dd6;}
.type-social{background:#e6f7ed;color:#1a9c4b;}
.type-meeting{background:#fff2e8;color:#d46b08;}
.type-offline{background:#f0e6ff;color:#722ed1;}
.type-phone{background:#e6f7ff;color:#08979c;}
.timeline-summary{font-size:12px;color:#555;line-height:1.5;margin-bottom:8px;min-height:18px;}
.timeline-summary-empty{color:#bbb;font-style:italic;}
.edit-summary-btn{font-size:11px;color:#e94560;cursor:pointer;margin-top:6px;display:inline-block;}
.edit-summary-btn:hover{text-decoration:underline;}

/* ===== 询盘分类3按钮 ===== */
.inquiry-btns{display:flex;gap:4px;flex-wrap:wrap;margin-top:8px;}
.inquiry-btn{padding:3px 8px;font-size:10px;border-radius:3px;font-weight:700;color:#fff;cursor:pointer;background:#ccc;transition:all 0.15s;}
.inquiry-btn:hover{opacity:0.85;}
.inquiry-btn.active{box-shadow:0 1px 3px rgba(0,0,0,0.2);}
.inquiry-valid.active{background:#e94560;}
.inquiry-invalid.active{background:#5bc0de;}
.inquiry-non.active{background:#5cb85c;}

/* ===== 优先级4色按钮（默认灰色，选中后显色） ===== */
.priority-btns{display:flex;gap:4px;flex-wrap:wrap;margin-top:8px;}
.priority-btn{padding:3px 8px;font-size:10px;border-radius:3px;font-weight:700;color:#fff;cursor:pointer;background:#ccc;transition:all 0.15s;}
.priority-btn.active{box-shadow:0 1px 3px rgba(0,0,0,0.2);}
.priority-btn:hover{opacity:0.85;}
.priority-red.active{background:#dc3545;}
.priority-orange.active{background:#fd7e14;}
.priority-green.active{background:#28a745;}
.priority-black.active{background:#343a40;}

/* ===== 右侧内容区 ===== */
.timeline-right{flex:1;display:flex;flex-direction:column;}
.timeline-right-header{padding:14px 16px;border-bottom:1px solid #eee;background:#fafafa;display:flex;align-items:center;justify-content:space-between;}
.timeline-right-header span{font-size:13px;font-weight:600;color:#555;}
.timeline-content{flex:1;overflow-y:auto;padding:0;}
.empty-timeline{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:#bbb;padding:40px;}
.empty-timeline p{font-size:14px;margin-bottom:16px;}

/* ===== 内容块 ===== */
.content-block{padding:18px 20px;border-bottom:1px solid #f5f5f5;}
.content-block.unreplied{background:#fffbe6;}
.content-block.replied{background:#fff;}
.content-block.no-need{background:#fff;}
.content-title{font-size:15px;font-weight:700;color:#1a1a2e;margin-bottom:10px;}
.content-meta{font-size:11px;color:#999;margin-bottom:10px;}
.content-body{font-size:13px;color:#333;line-height:1.8;margin-bottom:14px;}
.content-body[contenteditable="true"]{border:1px dashed #ddd;border-radius:6px;padding:10px;min-height:60px;}

/* ===== 未回复操作按钮组 ===== */
.action-bar{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap;}
.action-btn{padding:6px 14px;font-size:12px;border-radius:5px;font-weight:500;transition:all 0.15s;}
.action-btn-no-reply{background:#e8e8e8;color:#555;}
.action-btn-no-reply:hover{background:#d8d8d8;}
.action-btn-wait{background:#fff3cd;color:#856404;border:1px solid #ffc107;}
.action-btn-wait:hover{background:#ffeaa7;}
.action-btn-meeting{background:#d4a574;color:#fff;}
.action-btn-meeting:hover{background:#c49464;}
.action-btn-offline{background:#6c757d;color:#fff;}
.action-btn-offline:hover{background:#5a6268;}

/* ===== 回复区 ===== */
.reply-section{margin-top:14px;border-top:1px dashed #eee;padding-top:14px;}
.reply-label{font-size:12px;color:#888;margin-bottom:8px;font-weight:500;}
.reply-history{margin-bottom:12px;}
.reply-item{background:#f8f9fa;border-radius:6px;padding:10px 12px;margin-bottom:8px;font-size:12px;}
.reply-item .reply-time{color:#999;font-size:11px;margin-bottom:4px;}
.reply-item .reply-content{color:#333;line-height:1.6;}

/* ===== 分页 ===== */
.timeline-pagination{padding:14px 20px;border-top:1px solid #eee;display:flex;align-items:center;justify-content:space-between;background:#fafafa;}
.pagination-info{font-size:12px;color:#888;}
.pagination-btns{display:flex;gap:8px;}
.pagination-btn{padding:6px 16px;font-size:12px;border-radius:5px;background:#fff;border:1px solid #ddd;color:#555;}
.pagination-btn:hover:not(:disabled){border-color:#e94560;color:#e94560;}
.pagination-btn:disabled{opacity:0.4;cursor:not-allowed;}
