/* =========================================================================
 * gb-addons.css —— 参数化图库面板 / 复合文档图纸导入 / 保真底图
 * 复用 style.css 的深色主题变量，不改动任何既有样式。
 * ========================================================================= */

/* ---------------- 参数化图库：右侧抽屉 ---------------- */
.gbl-panel {
  position: fixed; top: 86px; right: 14px; z-index: 8600;
  width: 470px; max-width: calc(100vw - 28px);
  height: calc(100vh - 130px); min-height: 420px;
  display: none; flex-direction: column;
  background: var(--panel, #1b2027);
  border: 1px solid var(--border, #333b46);
  border-radius: 12px;
  box-shadow: 0 18px 54px rgba(0, 0, 0, .52);
  color: var(--text, #e6eaef);
  font-size: 12px; overflow: hidden;
}
.gbl-panel.show { display: flex; }
.gbl-hd {
  flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between;
  padding: 11px 14px; background: var(--grad-top, #1e242c);
  border-bottom: 1px solid var(--border, #333b46);
  font-size: 14px; font-weight: 600; letter-spacing: .3px;
}
.gbl-x {
  background: none; border: 0; color: var(--text2, #aab3bf);
  font-size: 20px; line-height: 1; cursor: pointer; padding: 0 4px;
}
.gbl-x:hover { color: var(--danger, #ff6b60); }
.gbl-search {
  flex: 0 0 auto; display: flex; align-items: center; gap: 8px;
  padding: 9px 12px; border-bottom: 1px solid var(--border2, #2a313a);
}
.gbl-search input {
  flex: 1; min-width: 0; padding: 7px 10px;
  background: var(--input, #12161c); color: var(--text, #e6eaef);
  border: 1px solid var(--border, #333b46); border-radius: 7px; outline: none;
}
.gbl-search input:focus { border-color: var(--accent, #3b9dff); }
.gbl-count { color: var(--text3, #7c8593); white-space: nowrap; font-size: 11px; }
.gbl-cats {
  flex: 0 0 auto; display: flex; gap: 5px; flex-wrap: wrap;
  padding: 8px 12px; border-bottom: 1px solid var(--border2, #2a313a);
}
.gbl-cats button {
  padding: 5px 9px; border-radius: 14px; cursor: pointer;
  background: var(--panel2, #212730); color: var(--text2, #aab3bf);
  border: 1px solid var(--border2, #2a313a); font-size: 11px;
}
.gbl-cats button:hover { background: var(--hover, #262d36); }
.gbl-cats button.on {
  background: var(--accent-soft, #22354d); color: var(--text, #e6eaef);
  border-color: var(--accent-soft-br, #2f5d8c);
}
.gbl-body { flex: 1 1 auto; display: grid; grid-template-columns: 210px 1fr; min-height: 0; }
.gbl-list { overflow-y: auto; border-right: 1px solid var(--border2, #2a313a); padding: 6px; }
.gbl-item {
  display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px;
  padding: 6px 8px; margin-bottom: 3px; border-radius: 6px; cursor: pointer;
  border: 1px solid transparent;
}
.gbl-item:hover { background: var(--hover, #262d36); }
.gbl-item.sel { background: var(--accent-soft, #22354d); border-color: var(--accent-soft-br, #2f5d8c); }
.gbl-nm { color: var(--text3, #7c8593); font-size: 10px; width: 100%; }
.gbl-lb { color: var(--text, #e6eaef); font-size: 11.5px; }
.gbl-tag {
  margin-left: auto; font-size: 9px; padding: 1px 5px; border-radius: 8px;
  background: var(--panel2, #212730); color: var(--text3, #7c8593);
}
.gbl-empty { color: var(--text3, #7c8593); text-align: center; padding: 24px 8px; }
.gbl-right { overflow-y: auto; padding: 10px 12px 14px; min-width: 0; }
.gbl-sec {
  margin: 10px 0 7px; color: var(--text3, #7c8593);
  font-size: 10.5px; letter-spacing: .6px; text-transform: uppercase;
  border-bottom: 1px solid var(--border2, #2a313a); padding-bottom: 4px;
}
.gbl-sec:first-child { margin-top: 0; }
.gbl-note { float: right; text-transform: none; letter-spacing: 0; }
.gbl-cur { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; }
.gbl-cur b { font-size: 14px; }
.gbl-cur span { color: var(--accent, #3b9dff); font-weight: 600; }
.gbl-cur em { color: var(--text3, #7c8593); font-style: normal; font-size: 10px; width: 100%; }
.gbl-fields, .gbl-opts { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 8px; }
.gbl-fields label, .gbl-opts label {
  display: flex; flex-direction: column; gap: 3px;
  color: var(--text2, #aab3bf); font-size: 10.5px;
}
.gbl-fields small { color: var(--text3, #7c8593); }
.gbl-fields input, .gbl-opts input {
  width: 100%; box-sizing: border-box; padding: 5px 7px;
  background: var(--input, #12161c); color: var(--text, #e6eaef);
  border: 1px solid var(--border, #333b46); border-radius: 5px; outline: none;
}
.gbl-fields input:focus, .gbl-opts input:focus { border-color: var(--accent, #3b9dff); }
.gbl-derived { margin-top: 7px; color: var(--text3, #7c8593); font-size: 10.5px; }
.gbl-derived b { color: var(--text2, #aab3bf); }
.gbl-prev {
  height: 150px; border: 1px solid var(--border2, #2a313a); border-radius: 7px;
  background: #0e131a; display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}
.gbl-prev svg { width: 100%; height: 100%; }
.gbl-acts { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 12px; }
.gbl-acts button {
  padding: 7px 8px; cursor: pointer; border-radius: 6px; font-size: 11px;
  background: var(--panel2, #212730); color: var(--text, #e6eaef);
  border: 1px solid var(--border, #333b46);
}
.gbl-acts button:hover { background: var(--hover, #262d36); }
.gbl-acts .gbl-pri {
  grid-column: 1 / -1; background: var(--accent, #3b9dff);
  border-color: var(--accent, #3b9dff); color: #fff; font-weight: 600;
}
.gbl-acts .gbl-pri:hover { filter: brightness(1.08); }
.gbl-tip {
  margin-top: 10px; color: var(--text3, #7c8593); font-size: 10px; line-height: 1.6;
}

/* ---------------- 图纸导入对话框 ---------------- */
.gbi-modal .gb-modal-box { max-width: calc(100vw - 32px); }
.gbi-top { display: grid; grid-template-columns: 230px 1fr; gap: 14px; }
.gbi-pv {
  height: 150px; border: 1px solid var(--border2, #2a313a); border-radius: 7px;
  background: #0e131a; overflow: hidden;
  display: flex; align-items: center; justify-content: center;
}
.gbi-pv img { max-width: 100%; max-height: 100%; object-fit: contain; }
.gbi-pv span { color: var(--text3, #7c8593); }
.gbi-stat { line-height: 1.9; color: var(--text2, #aab3bf); font-size: 11.5px; }
.gbi-stat b { color: var(--text, #e6eaef); }
.gbi-stat > div:first-child { font-size: 13px; margin-bottom: 4px; }
.gbi-warn {
  margin-top: 8px; padding: 7px 9px; border-radius: 6px; line-height: 1.65;
  background: rgba(255, 179, 71, .08); border: 1px solid rgba(255, 179, 71, .26);
  color: #e2bd83; font-size: 10.5px;
}
.gbi-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 7px 12px;
  margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border2, #2a313a);
}
.gbi-grid label { display: flex; align-items: center; gap: 6px; color: var(--text2, #aab3bf); font-size: 11px; }
.gbi-grid input[type="checkbox"] { accent-color: var(--accent, #3b9dff); }
.gbi-grid input[type="number"] {
  width: 82px; padding: 4px 6px; margin-left: auto;
  background: var(--input, #12161c); color: var(--text, #e6eaef);
  border: 1px solid var(--border, #333b46); border-radius: 5px;
}
.gbi-dl {
  display: flex; align-items: center; gap: 7px; flex-wrap: wrap;
  margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--border2, #2a313a);
}
.gbi-dl button {
  padding: 5px 10px; cursor: pointer; border-radius: 5px; font-size: 11px;
  background: var(--panel2, #212730); color: var(--text, #e6eaef);
  border: 1px solid var(--border, #333b46);
}
.gbi-dl button:hover { background: var(--hover, #262d36); }
.gbi-dl span { color: var(--text3, #7c8593); font-size: 10px; }

/* ---------------- 画布上的保真底图 ---------------- */
.gbi-underlay {
  position: absolute; display: none; pointer-events: none;
  opacity: .78; z-index: 2; image-rendering: auto;
}

@media (max-width: 900px) {
  .gbl-panel { top: 70px; right: 8px; width: calc(100vw - 16px); height: calc(100vh - 110px); }
  .gbl-body { grid-template-columns: 150px 1fr; }
  .gbi-top { grid-template-columns: 1fr; }
  .gbi-pv { height: 120px; }
}