/* 向阳学院 · chat 模块样式（v8.23 居中悬浮窗）
 * 悬浮窗直接显示在屏幕正中间，不再从底部弹出；
 * 键盘遮挡由原生层根治：MainActivity 监听布局变化，键盘弹出时给 WebView 容器
 * 加等量底部 padding，WebView 真正变矮，悬浮窗随可视区域自动重新居中，
 * 输入框永远停留在键盘上方可见。
 */
/* ===== 在线客服悬浮按钮 ===== */
#chatFab { position:fixed; right:16px; bottom:calc(78px + env(safe-area-inset-bottom, 0px)); z-index:101; display:none; width:50px; height:50px; border:none; border-radius:50%; background:linear-gradient(135deg,#F8A83C,#FC6C3C); color:#fff; cursor:pointer; -webkit-tap-highlight-color:transparent; align-items:center; justify-content:center; }
#chatFab svg { width:24px; height:24px; }
#chatFab:active { transform:scale(.9); }
/* 未读消息角标 */
#chatFabBadge { display:none; position:absolute; top:-4px; right:-4px; min-width:18px; height:18px; padding:0 5px; border-radius:9px; background:#FF3B30; color:#fff; font-size:11px; font-weight:700; line-height:18px; text-align:center; box-shadow:0 1px 4px rgba(0,0,0,.25); border:2px solid #fff; box-sizing:content-box; }

/* ===== 聊天页：v8.23 屏幕正中间悬浮窗 =====
   absolute + body(position:relative, height:100%) 作为包含块，
   WebView 高度变化时窗口随之在可视区域内重新居中 */
#chatPage {
  position:absolute;
  left:50%; top:50%;
  transform:translate(-50%,-50%);
  width:92%; max-width:430px;
  height:76%; max-height:640px;
  z-index:101;
  background:#fff;
  border-radius:16px;
  display:none;
  flex-direction:column;
  overflow:hidden;
}
#chatPage.show { display:flex; }
/* 遮罩层（全屏，比 chatPage 低一层，点击收起聊天） */
#chatMask { position:absolute; left:0; right:0; top:0; bottom:0; z-index:100; background:rgba(48,48,48,.5); display:none; }
#chatMask.show { display:block; }

.chat-header {
  background:linear-gradient(135deg,#F8A83C,#FC6C3C);
  color:#fff; padding:12px 14px;
  display:flex; align-items:center; gap:10px; flex-shrink:0;
}
.chat-hinfo { flex:1; min-width:0; }
.chat-header h2 { font-size:16px; font-weight:600; }
.chat-header .sub { font-size:11px; opacity:.75; margin-top:2px; }
.chat-header button {
  border:1px solid rgba(255,255,255,.35); background:rgba(255,255,255,.12);
  color:#fff; border-radius:18px; padding:6px 12px; font-size:12px;
  cursor:pointer; -webkit-tap-highlight-color:transparent;
}

/* 消息区：flex:1 + min-height:0 占满剩余空间且可被压缩 */
#chatMsgs {
  flex:1; min-height:0; overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  padding:14px 12px 8px;
  background:#fff;
}
.chat-row { display:flex; margin-bottom:12px; align-items:flex-end; gap:8px; }
.chat-row.me { flex-direction:row-reverse; }
.chat-avatar {
  width:34px; height:34px; border-radius:50%; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  font-size:14px; color:#fff;
  background:linear-gradient(135deg,#F8A83C,#FC6C3C);
}
.chat-row.me .chat-avatar { background:linear-gradient(135deg,#1E4D3B,#17342A); }
.chat-bubble {
  max-width:74%; padding:10px 13px; border-radius:16px;
  font-size:14.5px; line-height:1.55; word-break:break-all;
  background:#F5F6F7; color:#241E18;
}
.chat-row.me .chat-bubble { background:linear-gradient(135deg,#F8A83C,#FC6C3C); color:#fff; }
.chat-row.sys { justify-content:center; }
.chat-row.sys .chat-bubble { background:#FFF1E6; color:#A89C90; font-size:12.5px; max-width:86%; box-shadow:none; }

/* 输入区：flex-shrink:0 永不压缩，键盘弹出时随悬浮窗一起保持在键盘上方 */
.chat-inputbar {
  flex-shrink:0;
  display:flex; gap:8px;
  padding:10px 12px;
  background:#fff;
  border-top:1px solid #F0E7DD;
}
.chat-inputbar input {
  flex:1; min-width:0; height:42px;
  border:1px solid #F0E7DD; border-radius:21px;
  padding:0 16px; font-size:14.5px;
  outline:none; background:#FDF6F0; color:#241E18;
}
.chat-inputbar input:focus { border-color:#FC6C3C; background:#fff; }
.chat-inputbar button {
  border:none; border-radius:21px; padding:0 20px;
  font-size:14px; color:#fff; background:#FC6C3C;
  cursor:pointer; -webkit-tap-highlight-color:transparent;
}
.chat-inputbar button:active { background:#e5552e; }

.chat-empty { text-align:center; color:#C4B8AC; font-size:13px; padding:30px 20px; line-height:1.9; }