/**
 * 批量下单浮窗全局组件样式（自 template/table/index.php 抽取）
 * 无遮罩不挡页面、可拖动、可最小化、暂不可调大小
 */

.batch-win {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 1600;
  /* 与 cfxzs.php 的 460px 小窗同宽：iframe 视口 <500px 时程序自动满幅填充 */
  width: min(94vw, 460px);
  height: min(76vh, 640px);
  background: #fff;
  border-radius: 14px;
  border: 1px solid rgba(15, 23, 42, 0.06);
  box-shadow: 0 18px 50px rgba(15, 23, 42, 0.22);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  transform: translateY(16px) scale(0.97);
  transform-origin: bottom right;
  /* left/top/width/height 参与过渡：最小化时飞向左下角并缩成气泡 */
  transition:
    opacity 0.26s ease,
    transform 0.26s cubic-bezier(0.32, 0.72, 0, 1),
    visibility 0.26s,
    left 0.38s cubic-bezier(0.32, 0.72, 0, 1),
    top 0.38s cubic-bezier(0.32, 0.72, 0, 1),
    width 0.34s cubic-bezier(0.32, 0.72, 0, 1),
    height 0.34s cubic-bezier(0.32, 0.72, 0, 1);
}

.batch-win.is-show {
  opacity: 1;
  visibility: visible;
  transform: none;
}

/* 最小化通用：iframe 隐藏但继续运行（下单任务不中断） */
.batch-win.is-min .batch-frame {
  display: none;
}

/* PC 端最小化 = 收进左下角胶囊气泡（图标 +「批量下单」文字，客服气泡正上方），点一下还原 */
@media (min-width: 993px) {
  .batch-win.is-min {
    width: 140px;
    height: 54px;
    border-radius: 999px;
    cursor: pointer;
    animation: batchBubblePulse 2.6s ease-out infinite;
  }

  /* 悬停轻微上浮提示可点还原（光环动画持续，不随悬停中断） */
  .batch-win.is-min:hover {
    transform: translateY(-2px);
  }

  .batch-win.is-min .batch-win-head {
    width: 100%;
    height: 100%;
    padding: 0;
    justify-content: center;
    gap: 0;
    overflow: hidden; /* 气泡态钳制内容，图标/文字永不越出胶囊边界 */
    border-radius: 999px;
    cursor: pointer; /* 气泡态标题栏不再是拖动区，覆盖其 move 光标为手型 */
  }

  .batch-win.is-min .batch-win-btn,
  .batch-win.is-min .batch-win-dl {
    display: none; /* 气泡态只留闪电图标+「批量下单」；
       下载胶囊若留在 140px 气泡里会把内容挤出边界、图标被裁不居中 */
  }

  .batch-win.is-min .batch-win-title {
    font-size: 14px;
    justify-content: center;
    overflow: visible; /* 不再钳制标题，图标完整居中不被裁 */
    padding-left: 20px;
  }

  /* 文字常态展示（沿用原悬停展开态的间距与视觉） */
  .batch-win.is-min .b-label {
    max-width: 96px;
    opacity: 1;
    margin-left: 7px;
    white-space: nowrap;
  }
}

/* 呼吸光环：提示批量任务仍在后台运行 */
@keyframes batchBubblePulse {
  0% {
    box-shadow:
      0 0 0 0 rgba(79, 124, 255, 0.42),
      0 10px 28px rgba(15, 23, 42, 0.18);
  }

  70% {
    box-shadow:
      0 0 0 16px rgba(79, 124, 255, 0),
      0 10px 28px rgba(15, 23, 42, 0.18);
  }

  100% {
    box-shadow:
      0 0 0 0 rgba(79, 124, 255, 0),
      0 10px 28px rgba(15, 23, 42, 0.18);
  }
}

/* 手机端最小化：原位紧凑胶囊条（图标+文字），窄视口收缩自适应、不遮内容 */
@media (max-width: 992px) {
  .batch-win.is-min {
    width: auto;
    max-width: calc(100vw - 20px);
    height: auto;
    border-radius: 999px;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.18);
  }

  .batch-win.is-min .batch-win-head {
    padding: 7px 10px 7px 14px;
    justify-content: center; /* 气泡态内容居中，胶囊对称 */
    gap: 0;
    overflow: hidden; /* 窄视口气泡同样钳制内容不越界 */
    border-radius: 999px;
  }

  /* 手机端气泡同样只保留图标+文字：隐藏下载入口与最小化/关闭按钮 */
  .batch-win.is-min .batch-win-btn,
  .batch-win.is-min .batch-win-dl {
    display: none;
  }

  .batch-win.is-min .batch-win-head {
    padding: 7px 14px; /* 左右对称，气泡内容居中不错位 */
  }

  .batch-win.is-min .batch-win-title {
    font-size: 13px;
    overflow: visible;
  }

  .batch-win.is-min .b-label {
    white-space: nowrap;
  }
}

.batch-win-head {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  padding: 9px 10px 9px 14px;
  background: linear-gradient(135deg, #4f7cff, #7a5cff);
  color: #fff;
  cursor: move;
  user-select: none;
  -webkit-user-select: none;
  touch-action: none;
  flex-shrink: 0;
}

.batch-win-title {
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: 0.5px;
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  overflow: hidden;
  min-width: 0; /* 允许在窄容器里收缩，避免擑破父级边界 */
}

.batch-win-acts {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  margin-left: auto; /* 贴靠标题栏最右端，与“下载软件版”拉开距离 */
}

.batch-win-btn {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
  font-size: 12px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.2s;
}

.batch-win-btn:hover {
  background: rgba(255, 255, 255, 0.34);
}

/* “下载软件版”醒目入口：紧跟“批量下单”标题右侧的橙黄渐变胶囊横条（操作按钮由 margin-left:auto 推至最右，天然隔开） */
.batch-win-dl {
  width: auto;
  height: auto;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 14px;
  border-radius: 999px;
  background: linear-gradient(135deg, #ffb93c, #ff7a3c);
  color: #fff;
  font-size: 12.5px;
  font-weight: 700;
  line-height: 1.4;
  text-decoration: none;
  white-space: nowrap;
  box-shadow: 0 2px 8px rgba(255, 138, 60, 0.45);
  transition:
    transform 0.15s,
    box-shadow 0.15s,
    filter 0.15s;
}

.batch-win-dl:hover {
  filter: brightness(1.08);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(255, 138, 60, 0.55);
  color: #fff;
  text-decoration: none;
}

.batch-win-dl i {
  font-size: 12px;
}

/* 关闭叉号：高频操作，单独加大点击区域，悬停时放大、旋转并变红 */
.batch-win-btn.batch-win-close {
  width: 30px;
  height: 30px;
  font-size: 14px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition:
    background 0.2s,
    transform 0.25s;
}

.batch-win-btn.batch-win-close:hover {
  background: #ff4936;
  transform: scale(1.12) rotate(90deg);
}

.batch-win-btn.batch-win-close:active {
  transform: scale(0.94) rotate(90deg);
}

.batch-win .batch-frame {
  flex: 1;
  width: 100%;
  border: none;
  background: #fff;
  display: block;
}

/* 手机端：浮窗近乎全宽停靠右下角，仍可拖动 */
@media (max-width: 992px) {
  .batch-win {
    right: 10px;
    bottom: 66px; /* 避开底部 Tab 导航 */
    width: calc(100vw - 20px);
    height: min(72vh, 680px);
  }
}
