@charset "utf-8";
/* ============================================================
   hb-info.css — 控制页左侧「设备信息」信息栏（含设备名/状态/电量）
   ============================================================ */

.hb-ctl-strip{display:none !important}
.hb-ctl-remark{display:none !important}
.hb-ctl-tags{display:none !important}
.hb-ctl-titlerow{display:none !important}

.hb-ctl-info{
  position:fixed;z-index:20;
  width:236px;
  background:#fff;
  border:1px solid #e6ecf7;
  border-radius:16px;
  box-shadow:0 20px 44px -34px rgba(12,18,34,.5), 0 1px 2px rgba(12,18,34,.04);
  padding:10px 10px 12px;
  display:flex;flex-direction:column;min-height:0;
  overflow:auto;scrollbar-width:thin;
}
.hb-ctl-info::-webkit-scrollbar{width:6px}
.hb-ctl-info::-webkit-scrollbar-thumb{background:#dfe6f2;border-radius:6px}

/* 头部：设备名 + 在线 */
.hb-ci-h{display:flex;align-items:center;gap:9px;padding:2px 4px 10px}
.hb-ci-h .hb-ci-ico{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:#eef4ff;color:#2563eb;flex:none}
.hb-ci-h .hb-ci-ico svg{width:17px;height:17px}
.hb-ci-id{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.hb-ci-id b{font-size:13.5px;font-weight:700;color:#0f1a33;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hb-ci-on{align-self:flex-start;font-size:10px;font-weight:600;line-height:1.5;color:#0b8f63;background:#e7f8f0;border:1px solid #bfeedb;border-radius:999px;padding:0 7px}
.hb-ci-on.off{color:#8b95a6;background:#f2f5f9;border-color:#e3e9f3}
.hb-ci-h em{font-style:normal;font-size:9.5px;font-weight:700;letter-spacing:.8px;color:#5b8def;background:#eef4ff;border-radius:5px;padding:2px 5px;flex:none}

/* 状态徽章 */
.hb-ci-chips{display:flex;flex-wrap:wrap;gap:5px;padding:0 4px 9px;border-bottom:1px solid #f0f4fb;margin-bottom:6px}
.hb-ci-chip{font-size:10.5px;font-weight:600;line-height:1;padding:4px 7px;border-radius:6px;border:1px solid transparent;white-space:nowrap}
.hb-ci-chip.off{color:#9aa5b8;background:#f3f6fb;border-color:#e8eef7}

/* 电量 */
.hb-ci-batt{display:flex;align-items:center;gap:7px;padding:0 4px 9px;border-bottom:1px solid #f0f4fb;margin-bottom:4px}
.hb-ci-batt>span{font-size:11.5px;color:#8b97ab;flex:none}
.hb-ci-batt>i{flex:1;height:6px;border-radius:99px;background:#eef2f9;overflow:hidden;display:block}
.hb-ci-batt>i>b{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#22c55e,#10b981);transition:width .3s ease}
.hb-ci-batt>em{font-style:normal;font-size:11.5px;font-weight:600;color:#0f1a33;font-variant-numeric:tabular-nums;flex:none}

/* 信息行 */
.hb-ci-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 7px;border-radius:8px;transition:background .14s ease}
.hb-ci-row:hover{background:#f6f9ff}
.hb-ci-k{font-size:11.5px;color:#8b97ab;flex:none;white-space:nowrap}
.hb-ci-v{font-size:12.5px;color:#0f1a33;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:right;font-variant-numeric:tabular-nums}
.hb-ci-v.mono{font-family:"IBM Plex Mono",Consolas,"Courier New",monospace;font-size:11.5px;letter-spacing:.2px;color:#1e293b}

.hb-ci-sep{height:1px;background:#f0f4fb;margin:8px 4px 6px}

/* 输入框 */
.hb-ci-field{display:flex;flex-direction:column;gap:4px;padding:6px 6px 0}
.hb-ci-field>span{font-size:11px;color:#8b97ab}
.hb-ci-field input{height:30px;border:1px solid #e3eafa;border-radius:9px;padding:0 9px;font-size:12.5px;color:#0f1a33;background:#fbfdff;outline:none;transition:.15s}
.hb-ci-field input::placeholder{color:#b3bdcc}
.hb-ci-field input:focus{border-color:#bcd2ff;background:#fff;box-shadow:0 0 0 3px #eaf1ff}