/* P478 H1 首选攻击目标：战场面板 / 战场标记 / 城墙战术设置预设与选择弹窗 */

/* ---- 战场：指令栏「◎ 目标」按钮 ---- */
.bf-command-dock { white-space: nowrap; }
.bf-dock-btn.bf-target-btn {
  width: auto;
  padding: 0 9px;
  margin-left: 4px;
  font-size: 12px;
  font-weight: 800;
  color: #fff3e6;
  border-color: rgba(220, 90, 70, 0.85);
  background: linear-gradient(#7a2a20, #4a1712);
  text-shadow: 0 0 2px #000, 0 1px 1px #000;
}
.bf-dock-btn.bf-target-btn.open,
.bf-dock-btn.bf-target-btn.set { box-shadow: 0 0 0 1px rgba(255, 138, 106, 0.55) inset; }
.bf-dock-btn.bf-target-btn:disabled { opacity: 0.5; }

/* ---- 战场：首选目标面板（点「◎ 目标」才出现） ---- */
.bf-tgt-panel {
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 52px;
  z-index: 30;
  background: rgba(12, 18, 14, 0.96);
  border: 1px solid rgba(184, 152, 48, 0.6);
  border-radius: 12px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.6);
  padding: 10px 10px 8px;
  color: #eef4ee;
}
.bf-tgt-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 8px; }
.bf-tgt-title { font-size: 14px; font-weight: 800; color: #f1d27a; text-shadow: 0 1px 1px #000; }
.bf-tgt-range { font-size: 11px; color: #aebcaf; }
.bf-tgt-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.bf-tgt-chip {
  position: relative;
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  height: 38px;
  padding: 0 6px;
  border-radius: 8px;
  border: 1px solid rgba(80, 100, 90, 0.55);
  background: #1d2821;
  color: #e8eee8;
  font-size: 12px;
  font-weight: 700;
  text-align: left;
  text-shadow: 0 0 2px #000, 0 1px 1px #000;
}
.bf-tgt-chip i {
  flex: 0 0 auto;
  font-style: normal;
  width: 24px;
  height: 24px;
  border-radius: 6px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(200, 100, 80, 0.75);
  background: rgba(16, 24, 20, 0.94);
  font-size: 13px;
  color: #fff;
}
.bf-tgt-chip span { display: flex; flex-direction: column; line-height: 1.15; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bf-tgt-chip small { font-size: 9px; color: #ffb27a; }
.bf-tgt-chip.auto i { border-color: rgba(184, 152, 48, 0.7); color: #f1d27a; }
.bf-tgt-chip.out { opacity: 0.85; }
.bf-tgt-chip.on {
  border-color: #e05a40;
  background: linear-gradient(#6e2418, #3d130d);
  color: #fff6ea;
}
.bf-tgt-chip.on::after {
  content: "首选";
  position: absolute;
  top: -7px;
  right: -4px;
  font-size: 9px;
  padding: 1px 4px;
  border-radius: 6px;
  background: #e05a40;
  color: #fff;
  text-shadow: 0 0 2px #000;
}
.bf-tgt-chip.auto.on::after { content: "当前"; }
.bf-tgt-chip:disabled { opacity: 0.5; }
.bf-tgt-note { margin-top: 8px; font-size: 11px; line-height: 1.55; color: #c9d4c9; }
.bf-tgt-note b { color: #f1d27a; }
.bf-tgt-note .warn { color: #ff9a7a; }
.bf-tgt-foot { margin-top: 4px; font-size: 10.5px; line-height: 1.5; color: #8fa293; }

/* ---- 战场：被选中的敌方部队红圈 + 己方部队目标角标 ---- */
.bf-unit.bf-pref-ov { overflow: visible !important; }
.bf-pref-ring {
  position: absolute;
  inset: -7px;
  border: 2px dashed #ff6a4d;
  border-radius: 14px;
  pointer-events: none;
}
.bf-pref-ring::before {
  content: "首选";
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 9px;
  font-weight: 800;
  padding: 0 4px;
  border-radius: 5px;
  background: #e05a40;
  color: #fff;
  white-space: nowrap;
  text-shadow: 0 0 2px #000;
}
.bf-pref-badge {
  position: absolute;
  left: -6px;
  bottom: -8px;
  font-size: 9px;
  font-weight: 800;
  padding: 1px 4px;
  border-radius: 6px;
  background: #8a2a1c;
  border: 1px solid #ff6a4d;
  color: #fff;
  white-space: nowrap;
  font-style: normal;
  line-height: 1.2;
  pointer-events: none;
  text-shadow: 0 0 2px #000;
}

/* ---- 城墙战术设置：每个兵种的首选目标 ---- */
.def-tgt-tip {
  margin: 0 0 8px;
  padding: 6px 8px;
  border-radius: 8px;
  border: 1px solid rgba(224, 90, 64, 0.45);
  background: rgba(110, 36, 24, 0.25);
  font-size: 11.5px;
  line-height: 1.55;
  color: #f3dcd2;
}
.def-tgt-tip b { color: #ffb08f; }
.def-tgt-line { display: flex; align-items: center; gap: 6px; margin-top: 6px; }
.def-tgt-lab { font-size: 11px; color: #aebcaf; font-weight: 700; white-space: nowrap; }
.def-tgt-btn {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 6px;
  height: 30px;
  padding: 0 8px;
  border-radius: 7px;
  border: 1px solid rgba(80, 100, 90, 0.6);
  background: #1a231d;
  color: #e8eee8;
  font-size: 12px;
  font-weight: 700;
  text-shadow: 0 0 2px #000, 0 1px 1px #000;
}
.def-tgt-btn .def-tgt-ico { width: 26px; height: 20px; object-fit: cover; border-radius: 4px; }
.def-tgt-btn .nm { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.def-tgt-btn .nm.auto { color: #c9d4c9; }
.def-tgt-btn .arr { margin-left: auto; color: #d6c27a; font-size: 11px; white-space: nowrap; }
.def-tgt-btn .ring { color: #ff8a6a; font-size: 13px; }
.def-tgt-btn.set { border-color: #e05a40; background: linear-gradient(#5e2016, #36110c); color: #fff6ea; }

/* ---- 城墙战术设置：选择弹窗 ---- */
.def-pick-mask { position: fixed; inset: 0; z-index: 9999; background: rgba(0, 0, 0, 0.62); display: flex; align-items: flex-end; justify-content: center; }
.def-pick {
  width: 100%;
  max-width: 520px;
  max-height: 92vh;
  overflow-y: auto;
  background: linear-gradient(#18221c, #0f1611);
  border-top: 1px solid rgba(184, 152, 48, 0.6);
  border-radius: 16px 16px 0 0;
  padding: 14px 14px 16px;
  color: #eef4ee;
  box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.6);
}
.def-pick h3 { margin: 0 0 2px; font-size: 16px; color: #f1d27a; text-shadow: 0 1px 1px #000; }
.def-pick-sub { font-size: 11.5px; color: #aebcaf; margin-bottom: 10px; }
.def-pick-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.def-pick-opt {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  padding: 6px 2px 5px;
  border-radius: 9px;
  border: 1px solid rgba(80, 100, 90, 0.55);
  background: #1d2821;
  font-size: 11.5px;
  font-weight: 700;
  color: #e8eee8;
  text-shadow: 0 0 2px #000, 0 1px 1px #000;
}
.def-pick-opt .def-pick-ico { width: 54px; height: 38px; object-fit: cover; border-radius: 5px; }
.def-pick-auto {
  width: 54px;
  height: 38px;
  border-radius: 5px;
  display: grid;
  place-items: center;
  border: 1px dashed rgba(184, 152, 48, 0.7);
  color: #f1d27a;
  font-size: 11px;
  line-height: 1.2;
  text-align: center;
}
.def-pick-opt.on { border-color: #e05a40; background: linear-gradient(#6e2418, #3d130d); color: #fff6ea; }
.def-pick-opt.on::after { content: "✓"; position: absolute; top: 3px; right: 5px; color: #ffb08f; font-size: 12px; }
.def-pick-note { margin-top: 8px; font-size: 11px; color: #aebcaf; line-height: 1.5; }
.def-pick-foot { display: flex; gap: 10px; margin-top: 12px; }
.def-pick-foot button {
  flex: 1;
  height: 40px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 800;
  color: #fff8e8;
  text-shadow: 0 0 2px #000, 0 1px 2px #000;
}
.def-pick-cancel { background: #1d2821; border: 1px solid rgba(120, 140, 128, 0.6); }
.def-pick-ok { background: linear-gradient(#b8982f, #7a6018); border: 1px solid #dcb43c; }
