/* 在线客服浮层的增量样式（外壳沿用 customer-service-modal.css 的 .cs-modal-* ） */

/* iframe 容器：把聊天页原样铺满，去掉 body 默认的 padding 与滚动 */
.cs-drawer__body {
  display: block;
  padding: 0;
  overflow: hidden;
  background: #fff;
}
.cs-drawer__frame {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  background: #fff;
}

/* 浮层打开时锁住背景滚动，否则手机上能透过遮罩把下面的页面滑走 */
html.cs-drawer-open,
html.cs-drawer-open body {
  overflow: hidden;
  overscroll-behavior: none;
}

/* 桌面壳高：表单页内容 575px，默认 570 的壳减掉 50px 标题栏只剩 520，
   底部那行「同一手机号重复进入会恢复历史会话」会被裁掉一行。
   抬到 660 让整页表单一次放下；进会话后消息区自己滚，这个高度也够用。 */
.cs-drawer .cs-modal-container { height: 660px; }

/* 手机：贴底全宽 + 顶部圆角，接近原生 App 的会话面板 */
@media (max-width: 560px) {
  .cs-drawer {
    padding: 0;
    align-items: flex-end;
  }
  .cs-drawer .cs-modal-container {
    width: 100%;
    max-width: none;
    height: 88vh;
    max-height: 88vh;
    border-radius: 16px 16px 0 0;
    transform: translateY(28px);
  }
  .cs-drawer.is-active .cs-modal-container {
    transform: translateY(0);
  }
  .cs-drawer .cs-modal-header {
    border-radius: 16px 16px 0 0;
  }
}