/* Hradar 专属补充样式 —— 只在 console.css（用户中心 styles.css 原文件）之上叠加。
 *
 * 规则：壳、token、按钮、输入、标题栏、动效一律用 console.css 里现成的类，
 * 这里只定义用户中心没有的东西（设置卡/日志卡/系统消息条/原生 select），
 * 且只引用 console.css 的 token，不引入新颜色/圆角。
 */

/* ── 内联 SVG 图标尺寸 ──
 * 用户中心用 lucide-react，图标自带 width/height 属性；我们的页面手写内联
 * SVG 没有尺寸属性，这里按 console 各位置的实际图标大小约束。 */
.window-button svg,
.desktop-titlebar .language-toggle svg {
  width: 24px;
  height: 24px;
}

.primary-button > svg {
  width: 17px;
  height: 17px;
}

.secondary-button > svg {
  width: 16px;
  height: 16px;
}

.password-visibility-toggle svg {
  width: 20px;
  height: 20px;
}

.login-footer-link svg {
  width: 14px;
  height: 14px;
}

/* ── 焦点黑框纪律（HEINO_UI_DESIGN_STANDARD §9.2） ──
 * 鼠标点击不出现任何默认黑框（Chromium 对 select 点击也会匹配 :focus-visible）；
 * 只有键盘 Tab 的 :focus-visible 才显示受控外框。 */
button:focus:not(:focus-visible),
select:focus:not(:focus-visible),
a:focus:not(:focus-visible),
input:focus:not(:focus-visible) {
  outline: none !important;
}

/* 🔴 文本输入框点击/聚焦一律不叠加 outline 黑框（Chromium 对输入框点击也匹配
 *    :focus-visible，画出边框线外的黑框）——受控焦点就是边框变色 + 3px 浅 ring。 */
input:focus-visible,
input:focus {
  outline: none;
}

/* ── 设置卡：白色卡面承载一组连续表单（Console Light 卡片层级） ── */
.nb-card {
  min-width: 0;
  display: grid;
  gap: 16px;
  padding: 20px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid var(--line);
  border-radius: 14px;
}

.nb-card > .nb-card-head {
  display: grid;
  gap: 3px;
}

.nb-card-head .eyebrow {
  color: var(--muted);
}

.nb-card-head h3 {
  margin: 0;
  color: var(--ink);
  font-size: 18px;
  line-height: 1.35;
  font-weight: 700;
}

.nb-row {
  min-width: 0;
  display: grid;
  gap: 10px;
}

/* 一行三个短字段（网页端口 / 数据接收端口 / 网页密码） */
.nb-grid-3 {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px 14px;
}

/* 一行两个字段（游戏机 IP / 显示端） */
.nb-grid-2 {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 14px;
}

.nb-inline {
  min-width: 0;
  display: flex;
  align-items: end;
  gap: 10px;
  flex-wrap: wrap;
}

.nb-inline > .field-control {
  flex: 1 1 150px;
}

.nb-inline > .nb-inline-unit {
  flex: 0 0 auto;
  padding-bottom: 15px;
  color: var(--muted);
  font-size: 14px;
  white-space: nowrap;
}

.nb-inline > .secondary-button {
  flex: 0 0 auto;
  margin-bottom: 5px;
}

.field-hint {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}

.field-hint code {
  padding: 1px 5px;
  color: var(--ink);
  background: var(--panel-hover);
  border: 1px solid var(--line);
  border-radius: 6px;
  font-family: var(--font-mono);
  font-size: 12px;
}

/* ── 原生下拉（用户中心用自定义下拉；工具页用原生 select 同规格） ── */
select {
  width: 100%;
  height: 58px;
  min-width: 0;
  padding: 0 14px;
  color: var(--ink);
  background: #ffffff;
  border: 1px solid var(--line-strong);
  border-radius: 11px;
  outline: none;
  transition: border-color 150ms ease, box-shadow 150ms ease;
}

select:hover {
  border-color: #a8a29e;
}

select:focus {
  border-color: #1c1917;
  box-shadow: 0 0 0 3px rgba(28, 25, 23, 0.08);
}

select:disabled {
  color: var(--faint);
  background: var(--panel-hover);
  cursor: not-allowed;
}

/* ── 动作行 ── */
.nb-actions {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.nb-actions .primary-button {
  min-width: 118px;
}

/* ── 系统消息条（SDK 报错原话；对齐弹窗警告块规格） ── */
.nb-alert {
  min-width: 0;
  display: none;
  gap: 4px;
  padding: 14px;
  color: #9a3412;
  background: #fff7ed;
  border: 1px solid #fed7aa;
  border-radius: 13px;
  font-size: 13px;
  line-height: 1.55;
}

.nb-alert.is-visible {
  display: grid;
}

.nb-alert.is-error {
  color: #b91c1c;
  background: #fff7f7;
  border-color: #fecaca;
}

/* ── 运行日志卡：占满面板剩余高度；mono 走 Heino Mono，中文回落 Heino Noto ── */
.nb-log {
  flex: 1 1 auto;
  min-height: 260px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 16px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid var(--line);
  border-radius: 14px;
}

.nb-log-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.nb-log-head .eyebrow {
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: none;
}

.nb-log-lines {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  color: #57534e;
  /* Heino 正文字体（Inter + Noto Sans SC），数字启用等宽特性保持对齐 */
  font-family: var(--font-body);
  font-feature-settings: "tnum" 1;
  font-size: 13px;
  line-height: 1.7;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}