/* ============================================================
 * 19c. HUD hover tooltips（v7.7 信息架构调整）
 *
 * .hud-team / .hud-opponent 在 HUD 内部，hover 时显示 .hud-tooltip 浮层
 * 内容由 render.js 从 team-profile / coach-scout 同步过来
 * ============================================================ */

.hud-team,
.hud-opponent {
  position: relative;
}

.hud-info-hint {
  font-size: 9px;
  color: var(--text-muted);
  margin-left: 4px;
  transition: color 0.15s;
}

.hud-team:hover .hud-info-hint,
.hud-opponent:hover .hud-info-hint {
  color: var(--gold-primary);
}

.hud-tooltip {
  position: absolute;
  top: calc(100% + 8px);
  z-index: 90;
  width: 320px;
  max-width: calc(100vw - 32px);
  padding: 12px 14px;
  background: var(--bg-panel);
  border: 1px solid var(--border-default);
  border-radius: 0;
  box-shadow: 5px 5px 0 rgba(0, 0, 0, 0.6);
  font-size: 12px;
  line-height: 1.6;
  color: var(--text-main);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4px);
  transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s;
  pointer-events: none;
}

.hud-team .hud-tooltip {
  left: 0;
  border-left: 3px solid var(--green);
}

.hud-opponent .hud-tooltip {
  right: 0;
  border-left: 3px solid var(--gold-primary);
}

.hud-team:hover .hud-tooltip,
.hud-opponent:hover .hud-tooltip {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* C 线信息层开关 step1：教学提示关闭（body.tips-off）时，HUD 悬停讲解不显示，▼ 提示也收起。
   常驻的比分 / 风格 / 状态条不受影响。 */
body.tips-off .hud-team:hover .hud-tooltip,
body.tips-off .hud-opponent:hover .hud-tooltip {
  opacity: 0;
  visibility: hidden;
}

body.tips-off .hud-info-hint {
  display: none;
}

/* HUD tooltip 内部文字样式（同 #team-profile / #coach-scout 风格） */
.hud-tooltip .side-mini-title {
  font-size: 13px;
  font-weight: bold;
  margin-bottom: 4px;
}

.hud-team .hud-tooltip .side-mini-title {
  color: var(--green);
}

.hud-opponent .hud-tooltip .side-mini-title {
  color: var(--gold-primary);
}

.hud-tooltip .side-line {
  color: var(--text-main);
  font-size: 12px;
  line-height: 1.6;
}

.hud-tooltip .side-section {
  margin-top: 6px;
}

.hud-tooltip .side-muted {
  color: var(--text-dim);
  font-size: 12px;
  font-style: italic;
  line-height: 1.5;
}

.hud-tooltip .run-identity-return {
  margin-top: 6px;
  padding: 6px 8px;
  background: var(--bg-base);
  border-left: 2px solid var(--gold-primary);
  border-radius: 0;
}

.hud-tooltip .run-identity-return b {
  display: block;
  color: var(--gold-primary);
  font-size: 12px;
  margin-bottom: 2px;
}

.hud-tooltip .run-identity-return span {
  display: block;
  color: var(--text-dim);
  font-size: 11px;
  font-style: italic;
}

/* ============================================================
 * 19d. 比赛中状态切换（v7.7 信息架构调整）
 *
 * 开局态（body 无 .match-started，CC 未选）：
 *   侧栏 top 显示 #team-profile + #coach-scout，隐藏 #result-box
 *
 * 比赛中（body 有 .match-started，CC 已选）：
 *   侧栏 top 隐藏 #team-profile + #coach-scout（内容通过 HUD hover 显示）
 *   显示 #result-box（被新出牌结果填充）
 * ============================================================ */

/* v1.2 路径 B 调整：result-box 移回主列（whitebox-v7.7.html cards 后面）
 * - 单牌出牌（mode='hand'）：JS 完全不渲染 result-box，靠 toast 反馈
 * - 回合结算（mode='turn'）：inline 在主列显示，与 hand-bar 的"下一回合"配对
 * 旧的"侧栏顶部 result-box + 空占位"规则已删除（v7.7 信息架构 v2）
 */

/* 比赛中：侧栏的 team-profile + coach-scout 隐藏（侧栏在比赛中变空，时间线在 col-side-bottom）*/
body.tactical-v77.match-started .col-side-top #team-profile,
body.tactical-v77.match-started .col-side-top #coach-scout {
  display: none;
}

/* result-box 在主列内：隐藏 #continue-turn 按钮（功能已归入 hand-bar 的"下一回合"）*/
body.tactical-v77 #result-box .continue-btn,
body.tactical-v77 #result-box #continue-turn {
  display: none;
}

/* result-head 改为单行（删 button 后剩 title），左对齐 */
body.tactical-v77 #result-box .result-head {
  justify-content: flex-start;
}

/* 主列 result-box 在 mode='hand' 时不出现（JS 控制 display:none）；
 * mode='turn' 时正常 block 显示。state-grid 在主列宽度下可保持 4 列默认。
 */

/* 无可用牌时 EndTurn 按钮加金色脉冲高亮（明确告诉玩家：必须点这个结算）*/
#end-turn-btn.must-end {
  animation: v77-pulse-gold 1.6s ease-in-out infinite;
}

@keyframes v77-pulse-gold {
  0%, 100% {
    box-shadow: 0 0 0 0 var(--gold-glow);
  }
  50% {
    box-shadow: 0 0 0 6px var(--gold-glow);
  }
}

/* 单列模式（< 1024px）：HUD tooltip 改为 fixed 定位，居中显示 */
@media (max-width: 1023px) {
  .hud-tooltip {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: min(420px, calc(100vw - 32px));
    z-index: 200;
  }

  .hud-team .hud-tooltip,
  .hud-opponent .hud-tooltip {
    left: 50%;
    right: auto;
  }

  .hud-team:hover .hud-tooltip,
  .hud-opponent:hover .hud-tooltip {
    transform: translate(-50%, -50%);
  }
}

/* ============================================================
 * 20. Responsive
 * ============================================================ */

@media (max-width: 600px) {
  body {
    padding: 8px;
    padding-bottom: calc(env(safe-area-inset-bottom) + 8px);
  }

  #header {
    flex-wrap: wrap;
    gap: 8px;
  }

  .score {
    font-size: 22px;
    letter-spacing: 4px;
  }

  .meta-line {
    font-size: 10px;
  }

  #cards {
    flex-direction: column;
    gap: 8px;
  }

  .card {
    min-width: auto;
    padding: 10px;
  }

  .card .c-name {
    font-size: 15px;
    padding-right: 60px;
  }

  .card .c-hit-wrap {
    top: 8px;
    right: 10px;
  }

  .card .c-hit {
    font-size: 22px;
  }

  #team-profile,
  #coach-scout {
    font-size: 11px;
    padding: 8px 10px;
    line-height: 1.5;
  }

  .pick-coach {
    min-width: auto;
  }

  #log {
    max-height: 110px;
    font-size: 10px;
    line-height: 1.5;
  }
}

@media (max-width: 380px) {
  body {
    padding: 6px;
  }

  #header {
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
    text-align: center;
  }

  .hud-team-line.away {
    justify-content: flex-start;
  }
}

/* 触屏设备：去 hover 残留 */
@media (hover: none) {
  .card:hover {
    border-color: var(--border-default);
  }

  .card:active {
    border-color: var(--gold-primary);
  }

  .pick-coach:hover {
    border-color: var(--border-default);
    box-shadow: var(--shadow-card);
  }

  .pick-coach:active {
    border-color: var(--gold-primary);
  }
}
