/* ==========================================================================
   ai-chat.css —— 全站 AI 对话组件公共样式（唯一基准：kaiqiu-ai 独立 AI 页）
   引用页面：club-dashboard.html / club-dashboard-app.html（工作台 AI 弹窗）
            signin-admin.html / signin-admin-app.html（签到页内嵌 AI 弹窗）
   维护规则：AI 头像 / 气泡 / 思考点 / 表单弹窗样式只改本文件，所有页面同步生效；
            kaiqiu-ai 独立页保留同名内联样式（视觉一致，逻辑冻结不动）。
   ========================================================================== */

/* ============ AI 头像：黑色球体 + 右上亮绿高光 + 白色横八双眼（台球 8 字造型） ============
   三种眼部姿态由 data-pose 控制（JS：assets/js/ai-avatar.js）：
   up-right 向右上看 / down 向下看 / blink 双眼一起眨眼；
   姿态仅做 transform 过渡，不改变布局，无跳动。双眼保持水平、无倾斜角。 */
.ai-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 0;  /* 无外圈描边 */
  /* 球体：上方/左上大面积亮绿，沿斜向过渡，右下收为纯黑（右上另带釉面高光） */
  background-color: #031008;
  background-image:
    radial-gradient(circle at 30% 24%, rgba(93, 255, 162, 0.95) 0%, rgba(36, 214, 110, 0.92) 30%, rgba(13, 140, 66, 0.6) 58%, rgba(4, 30, 14, 0) 85%),
    linear-gradient(132deg, rgba(0, 0, 0, 0) 38%, rgba(0, 0, 0, 0.5) 68%, #000000 100%);
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
  box-shadow:
    0 0 12px rgba(46, 230, 110, 0.55),
    inset 0 3px 6px rgba(150, 255, 185, 0.28),
    inset 0 -5px 10px rgba(0, 0, 0, 0.65),
    0 4px 10px rgba(0, 0, 0, 0.45);
  animation: aiFloatUpdown 3s ease-in-out infinite;
}
/* 右上方亮绿釉面高光（强化球体光感，不使用白色避免假光斑） */
.ai-avatar::before {
  content: '';
  position: absolute;
  top: 4%;
  right: 6%;
  width: 44%;
  height: 40%;
  border-radius: 50%;
  background: radial-gradient(circle at 62% 38%, rgba(170, 255, 198, 0.5), rgba(110, 255, 165, 0.12) 55%, rgba(110, 255, 165, 0) 72%);
  pointer-events: none;
}
.ai-avatar .eye {
  width: 5px;
  height: 11px;
  background-color: #0a0a0a;
  border-radius: 50%;
  position: absolute;
  top: 12px;
  z-index: 1;
  /* 姿态切换平滑过渡（仅 transform，不触发布局） */
  transition: transform 0.32s cubic-bezier(0.34, 1.25, 0.64, 1);
}
/* 瞳孔：白色小圆点，固定在眼睛左上角 */
.ai-avatar .eye::after {
  content: '';
  position: absolute;
  top: 1px;
  left: 1px;
  width: 2px;
  height: 2px;
  background: #ffffff;
  border-radius: 50%;
}
.ai-avatar .eye.left-eye { left: 10px; }
.ai-avatar .eye.right-eye { right: 10px; }
/* 默认（无 data-pose）：双眼居中，水平横八造型 */
/* 姿态①：向右上看——双眼整体偏移至右上方（保持水平，不倾斜） */
.ai-avatar[data-pose="up-right"] .eye { transform: translate(3px, -4px); }
/* 姿态②：向下看——双眼整体偏移至下方（保持水平，不倾斜） */
.ai-avatar[data-pose="down"] .eye { transform: translate(0, 5px); }
/* 姿态③：眨眼——双眼快速闭合立即恢复（像人眨眼，不持续闭合） */
.ai-avatar[data-pose="blink"] .eye {
  transform: none;
  animation: aiBlink 1.8s ease-in-out infinite;
}
@keyframes aiBlink {
  0%, 88%, 100% { transform: scaleY(1); }
  44%, 50% { transform: scaleY(0.14); }
}
@keyframes aiFloatUpdown {
  0% { transform: translateY(0px); }
  50% { transform: translateY(-5px); }
  100% { transform: translateY(0px); }
}

/* ============ 对话气泡：AI 绿色渐变毛玻璃 / 用户深色毛玻璃 ============ */
.ai-msg-row { display: flex; gap: 8px; margin-bottom: 14px; }
.ai-row-ai { justify-content: flex-start; align-items: flex-start; }
.ai-row-user { justify-content: flex-end; }
.ai-bubble {
  max-width: 82%;
  padding: 12px 16px;
  border-radius: 18px;
  font-size: 14px;
  line-height: 1.65;
  word-break: break-word;
  white-space: pre-wrap;
}
.ai-bubble-ai {
  position: relative;
  background: linear-gradient(90deg, #287038, #0a1c10);
  border: 1px solid #3fc060;
  color: #ffffff;
  border-bottom-left-radius: 6px;
}
.ai-bubble-user {
  background-color: rgba(255, 255, 255, 0.18);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255, 255, 255, 0.26);
  border-radius: 16px;
  color: #ffffff;
  border-bottom-right-radius: 6px;
}

/* 思考态三点 */
.ai-dot {
  display: inline-block;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: #00FF88;
  margin: 0 2px;
  animation: aiDot 1.4s infinite;
}
.ai-dot:nth-child(2) { animation-delay: 0.2s; }
.ai-dot:nth-child(3) { animation-delay: 0.4s; }
@keyframes aiDot { 0%, 60%, 100% { opacity: 0.3; } 30% { opacity: 1; } }

/* ============ AI 弹窗内输入区 / 发送按钮 / 底部小字（对齐 kaiqiu-ai 基准） ============ */
#aiAssistantModal .ai-chat-inputbar textarea,
#aiAssistantModal .ai-input-area .ai-input {
  flex: 1;
  resize: none;
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 20px;
  padding: 10px 14px;
  font-size: 14px;
  line-height: 1.5;
  outline: none;
  min-width: 0;
}
#aiAssistantModal .ai-chat-inputbar textarea:focus,
#aiAssistantModal .ai-input-area .ai-input:focus {
  border-color: rgba(0, 200, 83, 0.5);
}
#aiAssistantModal .ai-chat-inputbar textarea::placeholder,
#aiAssistantModal .ai-input-area .ai-input::placeholder {
  color: rgba(255, 255, 255, 0.4);
}
#aiAssistantModal .ai-send-btn {
  flex: 0 0 auto;
  background: linear-gradient(90deg, #000000, #0F1A15);
  color: #00FF88;
  border: 1px solid rgba(0, 200, 83, 0.35);
  border-radius: 12px;
  padding: 10px 20px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 0 14px rgba(0, 200, 83, 0.3);
  white-space: nowrap;
  -webkit-tap-highlight-color: transparent;
  transition: transform 0.15s ease, opacity 0.15s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}
#aiAssistantModal .ai-send-btn svg { width: 18px; height: 18px; }
#aiAssistantModal .ai-send-btn:active { transform: scale(0.96); }
#aiAssistantModal .ai-send-btn:disabled { opacity: 0.4; box-shadow: none; }
.ai-tip {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.45);
  text-align: center;
  margin-top: 6px;
  margin-bottom: 2px;
}

/* ============ 建赛表单弹窗：底部弹出面板（日历/时间/奖金），浮层在 AI 弹窗之上 ============ */
.sheet-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  display: none;
  align-items: flex-end;
  justify-content: center;
  z-index: 3000;
}
.sheet-overlay.active { display: flex; }
.sheet-box {
  width: 100%;
  max-width: 500px;
  background: linear-gradient(160deg, #0F1A15 0%, #0A0F0D 100%);
  border: 1px solid rgba(0, 200, 83, 0.25);
  border-bottom: none;
  border-radius: 20px 20px 0 0;
  padding: 20px 18px calc(16px + env(safe-area-inset-bottom));
  box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.5);
  animation: aiSheetUp 0.25s ease both;
}
@keyframes aiSheetUp {
  0% { transform: translateY(100%); }
  100% { transform: translateY(0); }
}
.sheet-title {
  text-align: center;
  font-size: 16px;
  font-weight: 700;
  color: #00FF88;
  margin-bottom: 14px;
}
.sheet-actions { margin-top: 16px; }

/* 日历选择器 */
.cal-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.cal-title { font-size: 15px; color: #fff; font-weight: 600; }
.cal-nav {
  width: 34px; height: 34px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 10px;
  color: #A8E4B5;
  font-size: 16px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.cal-nav:disabled { opacity: 0.3; cursor: not-allowed; }
.cal-week {
  display: grid; grid-template-columns: repeat(7, 1fr);
  text-align: center; font-size: 12px;
  color: rgba(255, 255, 255, 0.45);
  margin-bottom: 4px;
}
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.cal-cell {
  display: flex; align-items: center; justify-content: center;
  height: 38px;
  border: none;
  background: transparent;
  color: #fff;
  font-size: 14px;
  border-radius: 10px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.cal-cell.cal-empty { cursor: default; }
.cal-cell.cal-disabled { color: rgba(255, 255, 255, 0.2); cursor: not-allowed; }
.cal-cell.cal-today { color: #00FF88; font-weight: 700; }
.cal-cell.cal-selected {
  background: #00C853;
  color: #050505;
  font-weight: 700;
  box-shadow: 0 0 12px rgba(0, 200, 83, 0.5);
}

/* 24 小时制时间选择 */
.tp-row { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 10px 0 4px; }
.tp-colon { font-size: 24px; font-weight: 700; color: #00FF88; }
.tp-select {
  width: 96px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(0, 200, 83, 0.25);
  border-radius: 12px;
  color: #fff;
  font-size: 22px;
  font-weight: 600;
  text-align: center;
  text-align-last: center;
  padding: 10px 6px;
  outline: none;
  -webkit-appearance: none;
}
.tp-select option { background: #0F1A15; color: #fff; }

/* 冠亚季殿奖金四框 + 其他奖金框（v20 全部支持文本：现金+台费卡+奖杯等混合描述） */
.pz-group { display: flex; flex-direction: column; gap: 10px; }
.pz-row { display: flex; align-items: center; gap: 10px; }
.pz-label { width: 68px; flex-shrink: 0; font-size: 14px; color: rgba(255, 255, 255, 0.75); }
.pz-input {
  flex: 1;
  min-width: 0;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(0, 200, 83, 0.2);
  border-radius: 12px;
  padding: 10px 12px;
  color: #fff;
  font-size: 15px;
  outline: none;
  text-align: left;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.pz-input:focus { border-color: #00C853; box-shadow: 0 0 0 2px rgba(0, 200, 83, 0.12); }
.pz-unit { width: 20px; flex-shrink: 0; font-size: 14px; color: rgba(255, 255, 255, 0.55); }
.pz-error { display: none; margin-top: 10px; font-size: 13px; color: #FF6B6B; text-align: center; }

/* ============ AI 助手弹窗骨架（工作台/签到页共用；两工作台页保留同名内联规则，互不冲突） ============ */
.ai-modal-box {
  width: calc(100% - 40px);
  height: auto;
  max-width: 480px;
  max-height: 70vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 20px;
  background-color: rgba(0, 0, 0, 0.32);
  backdrop-filter: blur(10px) saturate(140%);
  -webkit-backdrop-filter: blur(10px) saturate(140%);
  border: 1px solid rgba(255, 255, 255, 0.18);
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.55);
}
@media (max-width: 480px) {
  .ai-modal-box { max-height: 70vh; }
}
.ai-modal-header {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 10px 12px 0;
}
.ai-modal-close {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  flex: 0 0 auto;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.22);
  color: #ffffff;
  font-size: 18px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.ai-modal-close:active { transform: scale(0.92); }
#aiAssistantModal .ai-chat-body { flex: 1; overflow-y: auto; padding: 14px; min-height: 0; }
.ai-quick-reply {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 10px 12px 0 12px;
  background: rgba(0, 0, 0, 0.25);
  border-top: 1px solid rgba(255, 255, 255, 0.14);
}
#aiQuickReply.ai-quick-equal { flex-wrap: nowrap; }
#aiQuickReply.ai-quick-equal button { flex: 1 1 0; padding: 9px 4px; white-space: nowrap; }
#aiAssistantModal.has-quick .ai-chat-inputbar { border-top: none; }
.ai-quick-reply button {
  padding: 9px 16px;
  border-radius: 12px;
  cursor: pointer;
  border: none;
  background: linear-gradient(135deg, #06e062, #00b351);
  color: #ffffff;
  font-size: 14px;
  font-weight: 700;
  box-shadow: 0 2px 8px rgba(6, 224, 98, 0.35);
  transition: transform 0.15s ease, opacity 0.15s ease;
}
.ai-quick-reply button:active { transform: scale(0.96); }
.ai-quick-reply button:disabled { opacity: 0.5; cursor: not-allowed; }
#aiAssistantModal .ai-chat-inputbar {
  display: flex;
  gap: 8px;
  align-items: flex-end;
  padding: 10px 12px;
  padding-bottom: calc(10px + env(safe-area-inset-bottom));
  border-top: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(0, 0, 0, 0.25);
}

/* ==========================================================================
   v23：工作台全局 AI 助手（底部导航头像 + 上下文按钮 + 签到名单弹窗）
   ========================================================================== */

/* ---- 底部导航 AI 入口大头像：复用 .ai-avatar 球体/高光/描边/外发光/浮动/三姿态，仅放大尺寸 ---- */
.ai-avatar-nav {
  width: 44px;
  height: 44px;
}
.ai-avatar-nav .eye {
  width: 6px;
  height: 13px;
  top: 15px;
}
.ai-avatar-nav .eye.left-eye { left: 13px; }
.ai-avatar-nav .eye.right-eye { right: 13px; }
/* 导航按钮本体透明化（双端 .ai-circle-btn 同构覆盖）：按钮仅做点击热区，视觉全部交给头像 */
.ai-circle-btn.ai-avatar-host {
  background: none;
  border: none;
  box-shadow: none;
}

/* ---- 空闲态上下文按钮栏（创建比赛 / 签到 动态切换）：复用 .ai-quick-reply 按钮皮肤 ---- */
#aiAssistantModal.has-context .ai-chat-inputbar { border-top: none; }

/* ---- 多场有效比赛：弹窗顶部下拉选择器 ---- */
.ai-event-select-bar {
  display: none;
  padding: 8px 12px 0;
}
.ai-event-select {
  width: 100%;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(0, 200, 83, 0.3);
  border-radius: 12px;
  color: #fff;
  font-size: 13px;
  padding: 8px 10px;
  outline: none;
  -webkit-appearance: none;
  appearance: none;
}
.ai-event-select option { background: #0F1A15; color: #fff; }

/* ---- 签到名单弹窗：复用 sheet-overlay / sheet-box 底部浮层骨架（与日历/时间/奖金弹窗同样式） ---- */
.ck-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}
.ck-head .ck-head-title {
  flex: 1;
  margin-bottom: 0;
  text-align: center;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ck-list {
  max-height: 46vh;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.ck-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  margin-bottom: 8px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.10);
}
.ck-row.ck-done { opacity: 0.55; }
.ck-name {
  flex: 1;
  min-width: 0;
  font-size: 14px;
  color: #fff;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ck-state {
  flex: 0 0 auto;
  font-size: 12px;
  color: #00e676;
}
.ck-btn {
  flex: 0 0 auto;
  padding: 7px 16px;
  border: none;
  border-radius: 10px;
  background: linear-gradient(135deg, #06e062, #00b351);
  color: #ffffff;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  box-shadow: 0 2px 8px rgba(6, 224, 98, 0.35);
}
.ck-btn:active { transform: scale(0.95); }
.ck-btn:disabled { opacity: 0.6; cursor: not-allowed; }
.ck-loading {
  text-align: center;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.5);
  padding: 18px 0;
}

/* ---- v24 判罚弹窗：对局列表（与签到名单同构，复用 sheet-overlay / ck-row / ck-btn） ---- */
.jz-stage {
  font-size: 12px;
  font-weight: 600;
  color: #00e676;
  margin: 10px 2px 6px;
  letter-spacing: 1px;
}
.jz-table {
  flex: 0 0 auto;
  min-width: 34px;
  text-align: center;
  padding: 4px 6px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 700;
  color: #00e676;
  background: rgba(0, 230, 118, 0.12);
  border: 1px solid rgba(0, 230, 118, 0.25);
}
/* 无桌号对局：隐藏桌号徽标占位（与播报口径一致，只显示选手 VS 选手） */
.jz-table.jz-table-none {
  color: rgba(255, 255, 255, 0.45);
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.10);
}
.jz-btn {
  min-width: 52px;
}