/* ============================================================
   V3.26  聊天文字排版全面优化
   ============================================================ */

/* ---------- 消息流与间距 ---------- */
.msg-stream{ gap:10px; padding:20px 18px; }
.msg-row{ max-width:80%; margin-bottom:0; }
.msg-row.mine{ align-items:flex-end; }
.msg-row.other{ align-items:flex-start; }

/* ---------- 气泡包裹与宽度统一 ---------- */
.msg-bubble-wrap{ max-width:100%; gap:8px; }
.msg-bubble-wrap .msg-bubble{ max-width:100%; }

/* ---------- 气泡本体：内边距/行高/圆角优化 ---------- */
.msg-bubble{
  padding:10px 14px;
  font-size:14px;
  line-height:1.62;
  letter-spacing:.1px;
  border-radius:18px;
  word-break:break-word;
  overflow-wrap:anywhere;
  box-shadow:0 2px 10px rgba(0,0,0,.06);
}
/* 自己的消息：右下小圆角（微信风格） */
.msg-row.mine .msg-bubble{
  border-radius:18px 18px 4px 18px;
  background:linear-gradient(135deg,#0A84FF,#5E5CE6);
  color:#fff;
  text-shadow:0 1px 2px rgba(0,0,0,.12);
}
/* 对方消息：左下小圆角 */
.msg-row.other .msg-bubble{
  border-radius:18px 18px 18px 4px;
}
.msg-bare{ padding:2px 0!important; border-radius:0!important; box-shadow:none!important; background:transparent!important; }

/* ---------- 群聊发送者名字 ---------- */
.msg-sender{ font-size:12px; color:var(--text-3); margin:0 6px 3px; font-weight:500; }

/* ---------- 时间 + 已读标记 ---------- */
.msg-time{
  font-size:11px;
  color:var(--text-3);
  margin:3px 8px 0;
  display:flex;
  align-items:center;
  gap:8px;
  line-height:1;
  opacity:.85;
}
.msg-row.mine .msg-time{ justify-content:flex-end; }
.msg-row.other .msg-time{ justify-content:flex-start; }
/* 已读标记独立样式 */
.msg-read{
  font-size:10.5px;
  margin:0;
  display:inline-flex;
  align-items:center;
  gap:4px;
  line-height:1;
  font-weight:500;
}
.msg-read .rd-dot{
  width:6px;height:6px;border-radius:50%;
  display:inline-block;
}
.msg-read.read{ color:var(--blue); font-weight:600; }
body[data-theme="dark"] .msg-read.read{ color:#5eb1ff; }
.msg-read:not(.read){ color:var(--text-3); }

/* ---------- 商品卡片（单商品） ---------- */
.msg-product{
  width:auto;
  min-width:240px;
  max-width:280px;
  padding:12px;
  gap:12px;
  border-radius:16px;
  align-items:flex-start;
}
.msg-product img{ width:56px;height:56px;border-radius:12px;object-fit:cover;flex-shrink:0; }
.mp-noimg{ width:56px;height:56px;border-radius:12px;font-size:24px;flex-shrink:0; }
.msg-product .mp-mid{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.mp-code{ font-weight:700; font-size:13px; color:var(--text); word-break:break-all; }
.mp-name{ font-size:13.5px; margin:0; color:var(--text); font-weight:600; line-height:1.4; word-break:break-word; }
.mp-spec{ font-size:12px; color:var(--text-2); line-height:1.4; word-break:break-word; }
.mp-hint{ font-size:11px; color:var(--blue); margin-top:3px; font-weight:500; }

/* ---------- 多商品卡片 ---------- */
.msg-products{ min-width:240px; max-width:300px; border-radius:16px; overflow:hidden; }
.mps-head{ padding:10px 12px; font-size:13px; font-weight:600; }
.mps-item{ padding:8px 12px; gap:10px; align-items:center; }
.mps-item img{ width:40px;height:40px;border-radius:10px;object-fit:cover;flex-shrink:0; }
.mps-mid{ flex:1; min-width:0; }
.mps-name{ font-size:13px; font-weight:600; line-height:1.4; word-break:break-word; }
.mps-sub{ font-size:11.5px; color:var(--text-2); margin-top:1px; word-break:break-all; }
.mps-more{ padding:8px 12px; font-size:12px; color:var(--blue); font-weight:500; text-align:center; }

/* ---------- 图片消息 ---------- */
.msg-img{ max-width:260px; max-height:280px; border-radius:16px; }

/* ---------- 文件消息 ---------- */
.msg-file{
  max-width:260px;
  padding:12px 14px;
  border-radius:14px;
  font-size:13.5px;
  gap:10px;
  align-items:center;
}
.msg-file svg{ flex-shrink:0; }

/* ---------- 大表情/贴纸 ---------- */
.msg-lottie{ width:132px; height:132px; }
.msg-sticker{ width:100px; height:100px; }

/* ---------- 撤回消息 ---------- */
.msg-recalled{
  font-size:12.5px;
  padding:5px 16px;
  border-radius:12px;
  font-style:italic;
  color:var(--text-3);
}

/* ---------- 输入框占位文字优化 ---------- */
#chatInput.chat-input-editable:empty::before{
  line-height:1.6;
  font-size:14px;
}

/* ---------- 聊天顶部 ---------- */
.chat-top{ padding:14px 18px; gap:10px; }
.chat-top-info b{ font-size:15px; }
.chat-peer-status{ font-size:12px; }

/* ---------- 会话列表文字 ---------- */
.conv-name{ font-size:14.5px; font-weight:600; }
.conv-last{ font-size:12.5px; line-height:1.4; }
.conv-time{ font-size:11px; }

/* ---------- 手机端 ---------- */
@media(max-width:640px){
  .msg-stream{ padding:14px 12px; gap:8px; }
  .msg-row{ max-width:88%; }
  .msg-bubble{ padding:9px 12px; font-size:13.5px; line-height:1.55; border-radius:16px; }
  .msg-row.mine .msg-bubble{ border-radius:16px 16px 4px 16px; }
  .msg-row.other .msg-bubble{ border-radius:16px 16px 16px 4px; }
  .msg-product{ min-width:200px; max-width:240px; padding:10px; gap:10px; }
  .msg-product img{ width:48px;height:48px; }
  .mp-noimg{ width:48px;height:48px;font-size:20px; }
  .mp-name{ font-size:13px; }
  .msg-img{ max-width:200px; max-height:220px; }
  .msg-file{ max-width:220px; padding:10px 12px; }
}