/* ============================================================
   设备材料统计 - 样式（对齐 huchui / yijiyice）
   ============================================================ */

/* 主容器 */
.wrap {
  max-width: 1600px;
  margin: 0 auto;
  padding: 12px 12px 64px;   /* 底部预留固定状态栏(.status-bar)高度，避免被遮挡 */
}

/* Tab导航 */
.tabs {
  display: flex;
  background: #fff;
  border-bottom: 2px solid #cfd8dc;
  padding: 0 20px;
  margin-bottom: 20px;
  overflow-x: auto;
  height: 42px;
  align-items: stretch;
}
.tabs::-webkit-scrollbar { display: none; }
.tabs { -ms-overflow-style: none; scrollbar-width: none; }

.tab {
  padding: 11px 18px;
  border: none;
  background: none;
  cursor: pointer;
  font-size: 13px;
  font-weight: 500;
  color: #546e7a;
  border-bottom: 3px solid transparent;
  transition: all 0.2s;
  white-space: nowrap;
}
.tab:hover { color: #1565c0; background: #e3f2fd; }
.tab.on { color: #1565c0; border-bottom-color: #1565c0; }

/* 工程下拉菜单
   注意：.tabs 有 overflow-x:auto，会裁剪 position:absolute 的子元素，
   故菜单用 position:fixed，top/left 由 app.js 按实际 rect 动态计算。 */
.dropdown { position: static; }
.dropdown .tab { line-height: 42px; padding-top: 0; padding-bottom: 0; }
.dropdown .tab:hover { background: #e3f2fd !important; }
.dropdown-menu {
  display: none;
  position: fixed;
  min-width: 160px;
  background: #fff;
  border: 1px solid #cfd8dc;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  z-index: 1000;
  overflow: hidden;
}
.dropdown-menu.open { display: block; }
.dropdown-menu a {
  display: block;
  padding: 10px 16px;
  color: #37474f;
  text-decoration: none;
  font-size: 13px;
  cursor: pointer;
  border-bottom: 1px solid #f0f0f0;
}
.dropdown-menu a:last-child { border-bottom: none; }
.dropdown-menu a:hover { background: #e3f2fd; color: #1565c0; }

/* 工程名标签 */
.project-badge {
  margin-left: auto;
  align-self: center;
  background: #1565c0;
  color: #fff;
  padding: 5px 12px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
  max-width: 320px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Tab面板 */
.tab-panel { display: none; }
.tab-panel.active { display: block; }

/* 面板头部 */
.panel-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 14px;
}
.wrap h2 { margin: 0; font-size: 18px; color: #263238; }
.wrap h3 { margin: 0 0 10px 0; font-size: 15px; color: #37474f; }

/* 按钮 */
.btn-primary {
  padding: 8px 18px;
  background: #1976d2;
  color: #fff;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 500;
}
.btn-primary:hover { background: #1565c0; }
.btn-primary:disabled { background: #90caf9; cursor: not-allowed; }

.btn-secondary {
  padding: 8px 18px;
  background: #43a047;
  color: #fff;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 500;
}
.btn-secondary:hover { background: #2e7d32; }
.btn-secondary:disabled { background: #a5d6a7; cursor: not-allowed; }

.btn-del {
  padding: 4px 10px;
  background: #ef5350;
  color: #fff;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: 12px;
}
.btn-del:hover { background: #e53935; }

/* 表格「操作」列里的紧凑按钮（比控制栏的 .btn-secondary 小一圈，且按钮间留缝） */
.td-op {
  display: flex;
  gap: 6px;
  justify-content: center;
  flex-wrap: nowrap;
  white-space: nowrap;
}
.btn-td {
  padding: 3px 10px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: 12px;
  line-height: 1.6;
  background: #607d8b;
  color: #fff;
}
.btn-td:hover { background: #546e7a; }

/* 控制栏 */
.char-controls {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
.char-controls label { font-size: 13px; color: #546e7a; }
.char-controls input,
.char-controls select {
  padding: 6px 8px;
  border: 1px solid #cfd8dc;
  border-radius: 4px;
  font-size: 13px;
}
.char-controls input[type="number"] { width: 90px; }

.hint-note { font-size: 12px; color: #90a4ae; }

/* 表格 */
.table-wrap {
  overflow-x: auto;
  background: #fff;
  border-radius: 8px;
  border: 1px solid #e0e0e0;
}
.table-scroll { max-height: 700vh; }

table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
th {
  background: #f5f7fa;
  font-weight: 600;
  color: #333;
  position: sticky;
  top: 0;
  z-index: 1;
}
th, td {
  border: 1px solid #e0e0e0;
  padding: 6px 8px;
  text-align: center;
  white-space: nowrap;
}
.result-table th { background: #e8f0fe; color: #4a90d9; }
tbody tr:hover { background: #fafafa; }

/* ============ 3-金具串配置 ============ */
/* 两行表头：第一行固定 34px，第二行 sticky 时错开，避免两行重叠
   （只有「绝缘子」是 colspan 不带 rowspan，所以第二行不会和第一行同列相撞） */
.jldl-table thead tr:first-child th { top: 0; height: 34px; box-sizing: border-box; }
.jldl-table thead tr:nth-child(2) th { top: 34px; height: 34px; box-sizing: border-box; }
/* 选配金具：每个串号一个多行文本，默认 5 行（rows 属性）
   nowrap（wrap="off"）：一条一行，超长不自动折行 → 横向滚动；右下角可横向/纵向拖拽拉宽 */
.tlem-textarea {
  width: 100%;
  min-width: 220px;
  text-align: left;
  white-space: pre;
  overflow-wrap: normal;
  overflow-x: auto;
  resize: both;
  line-height: 1.45;
  font-family: inherit;
}
/* 表格内输入框 */
.tlem-input {
  width: 100%;
  min-width: 60px;
  padding: 4px 6px;
  border: 1px solid #ddd;
  border-radius: 3px;
  font-size: 12px;
  box-sizing: border-box;
  text-align: center;
}
.tlem-input:focus { border-color: #4a90d9; outline: none; }
select.tlem-input { text-align: center; text-align-last: center; }
textarea.tlem-input { text-align: left; }

/* ============ 导地线型号可搜索下拉 ============ */
.tlem-picker {
  position: relative;
  min-width: 170px;
}
.tlem-picker > input { text-align: left; }
.tlem-picker-list {
  /* 挂到 body 的浮层：用 fixed + JS 动态定位，规避 .table-wrap{overflow} 裁剪 */
  position: fixed;
  z-index: 3000;
  min-width: 200px;
  max-width: 460px;
  max-height: 260px;
  overflow-y: auto;
  /* 滚到边界时不要把整个页面一起滚走 */
  overscroll-behavior: contain;
  background: #fff;
  border: 1px solid #cfd8dc;
  border-radius: 4px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.16);
  text-align: left;
  white-space: normal;
}
.tlem-picker-opt {
  padding: 6px 10px;
  font-size: 12px;
  color: #37474f;
  cursor: pointer;
  border-bottom: 1px solid #f5f5f5;
}
.tlem-picker-opt:last-child { border-bottom: none; }
.tlem-picker-opt:hover { background: #e3f2fd; color: #1565c0; }
/* 库联动选项：主值 + 副标题（金具串名称 / 绝缘子类别） */
.tlem-picker-main { font-weight: 600; }
.tlem-picker-sub {
  margin-top: 2px;
  font-size: 11px;
  color: #90a4ae;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.tlem-picker-opt:hover .tlem-picker-sub { color: #42a5f5; }
.tlem-picker-empty {
  padding: 8px 10px;
  font-size: 12px;
  color: #90a4ae;
}
/* 只读列（单重/线径/计算列）视觉区分 */
.tlem-input[readonly] {
  background: #f5f5f5;
  color: #607d8b;
  cursor: default;
}
/* 计算列：鼠标悬浮显示计算过程 */
.tlem-input[data-key="unitKm"],
.tlem-input[data-key="totalT"] {
  cursor: help;
  text-decoration: underline dotted #90a4ae;
  text-underline-offset: 3px;
}
.tlem-calc-tip {
  position: fixed;
  z-index: 3200;
  max-width: 420px;
  min-width: 240px;
  padding: 10px 12px;
  background: #fff;
  border: 1px solid #cfd8dc;
  border-radius: 6px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
  font-size: 12px;
  line-height: 1.7;
  color: #37474f;
  text-align: left;
  white-space: normal;
  pointer-events: none;   /* 不挡鼠标，避免 hover 抖动 */
}
.tlem-calc-tip .ct-title {
  font-size: 12px;
  font-weight: 600;
  color: #1565c0;
  margin-bottom: 4px;
}
.tlem-calc-tip .ct-line {
  white-space: nowrap;
  color: #455a64;
}
.tlem-calc-tip .ct-line .ct-no {
  display: inline-block;
  min-width: 16px;
  color: #1565c0;
}
.tlem-calc-tip .ct-line b { color: #1b5e20; }
.tlem-calc-tip .ct-res {
  margin-top: 5px;
  padding-top: 5px;
  border-top: 1px dashed #cfd8dc;
  font-weight: 600;
  color: #e65100;
  white-space: nowrap;
}

/* 灰色/高亮单元格 */
.cell-muted { color: #b0bec5; }
.cell-highlight { background: #fff8e1; font-weight: 600; }

/* ============ 2-电气统计 ============ */
.elec-hint {
  background: #f5faff;
  border: 1px solid #dbe9f7;
  border-radius: 6px;
  padding: 10px 14px;
  margin-bottom: 14px;
  font-size: 12px;
  color: #546e7a;
  line-height: 1.8;
}
.elec-hint p { margin: 0; }
.elec-hint b { color: #1565c0; }

.elec-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.elec-box {
  min-width: 0;
  background: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  padding: 12px;
}
.elec-label {
  display: flex;
  align-items: baseline;
  gap: 10px;
  font-size: 14px;
  font-weight: 600;
  color: #37474f;
  margin-bottom: 8px;
}
.elec-hint-sub { font-size: 12px; font-weight: 400; color: #90a4ae; }
.elec-text {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid #cfd8dc;
  border-radius: 4px;
  font-size: 13px;
  font-family: Consolas, Monaco, 'Courier New', monospace;
  line-height: 1.7;
  resize: vertical;
  box-sizing: border-box;
  white-space: pre;
  overflow-wrap: normal;
  overflow-x: auto;
}
.elec-text:focus { border-color: #4a90d9; outline: none; }

/* ============ 对话框（对齐 huchui .proj-modal） ============ */
.proj-modal {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.5);
  z-index: 200;
  align-items: center;
  justify-content: center;
}
.proj-modal.on { display: flex; }
.proj-modal-box {
  background: #fff;
  border-radius: 8px;
  padding: 24px;
  width: 420px;
  max-width: 92vw;
  max-height: 86vh;
  overflow-y: auto;
  box-shadow: 0 8px 32px rgba(0,0,0,0.25);
}
.proj-modal-box h3 { margin-top: 0; color: #263238; }
.proj-label {
  display: block;
  margin: 12px 0 6px;
  font-size: 13px;
  color: #546e7a;
}
.proj-modal-box input[type="text"] {
  width: 100%;
  padding: 9px 10px;
  border: 1px solid #cfd8dc;
  border-radius: 4px;
  font-size: 14px;
  box-sizing: border-box;
}
.proj-modal-btns {
  margin-top: 18px;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

/* 试验或零星金具录入模态框（表比损耗设置宽，单独放宽白/how） */
.mat-misc-box {
  width: 900px;
  max-width: 94vw;
}
.mat-misc-tbl {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  margin-bottom: 4px;
}
.mat-misc-tbl th {
  padding: 8px 6px;
  background: #e8f0fe;
  color: #4a90d9;
  font-weight: 600;
  text-align: center;
  border-bottom: 1px solid #d7e3f4;
}
.mat-misc-tbl td {
  padding: 4px 6px;
  vertical-align: middle;
}
.mat-misc-tbl input[type="number"] { text-align: center; }
.mat-misc-tbl td:last-child { text-align: center; }

/* 添加附属设施模态框 */
.mat-fac-box {
  width: 900px;
  max-width: 94vw;
}
.mat-fac-tbl {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  margin-bottom: 4px;
}
.mat-fac-tbl th {
  padding: 8px 6px;
  background: #e8f0fe;
  color: #4a90d9;
  font-weight: 600;
  text-align: center;
  border-bottom: 1px solid #d7e3f4;
}
.mat-fac-tbl td {
  padding: 4px 6px;
  vertical-align: middle;
}
.mat-fac-tbl input[type="number"] { text-align: center; }
.mat-fac-tbl td:last-child { text-align: center; }

/* 损耗设置模态框内的损耗率表 */
.mat-loss-tbl {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
.mat-loss-tbl td {
  padding: 8px 6px;
  border-bottom: 1px solid #eee;
  vertical-align: middle;
}
.mat-loss-tbl td:first-child {
  width: 110px;
  color: #37474f;
  font-weight: 600;
}
.mat-loss-tbl input[type="number"] {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid #cfd8dc;
  border-radius: 4px;
  font-size: 14px;
  box-sizing: border-box;
}

/* 工程列表项（列表式，仅下边框线） */
.proj-list { margin: 10px 0; }
.proj-item {
  padding: 10px 12px;
  border-bottom: 1px solid #eee;
  cursor: pointer;
  transition: background 0.15s;
}
.proj-item:hover { background: #e3f2fd; }
/* 工程列表项：左侧名称信息 + 右侧改名/删除按钮 */
.proj-item { display: flex; align-items: center; gap: 10px; }
.pj-main { flex: 1; min-width: 0; }
.pj-ops { display: flex; gap: 6px; flex-shrink: 0; }
.pj-btn {
  border: none; border-radius: 4px; padding: 3px 10px; cursor: pointer;
  font-size: 12px; color: #fff; white-space: nowrap;
}
.pj-btn:hover { filter: brightness(1.08); }
.pj-btn-rename { background: #2196f3; }
.pj-btn-del { background: #e53935; }
/* 非本人工程标记：管理员看是「他人」，普通用户看到别人的是「只读」 */
.pj-tag {
  display: inline-block; margin-left: 6px; padding: 1px 6px; border-radius: 3px;
  font-size: 11px; font-weight: normal; color: #fff; background: #ff9800;
}
.pj-admin-tip {
  padding: 8px 12px; margin-bottom: 6px; border-radius: 4px;
  background: #fff8e1; border: 1px solid #ffe082;
  font-size: 12px; color: #8d6e63;
}
.pj-name { font-size: 14px; color: #263238; font-weight: 500; }
.pj-time { font-size: 12px; color: #90a4ae; margin-top: 3px; }
/* 工程更名对话框 */
.rename-box { width: 460px; }
.rename-row { margin-bottom: 12px; }
.rename-row label { display: block; font-size: 13px; color: #607d8b; margin-bottom: 4px; }
.rename-row input {
  width: 100%; padding: 8px 10px; font-size: 14px;
  border: 1px solid #cfd8dc; border-radius: 4px; box-sizing: border-box;
}
.rename-row input[readonly] { background: #f5f5f5; color: #90a4ae; }

/* ============ 列标识设置对话框 ============ */
.cm-box { width: 500px; }
.cm-table {
  width: 100%;
  border-collapse: collapse;
  margin: 10px 0 6px;
  font-size: 13px;
}
.cm-table th,
.cm-table td {
  border: 1px solid #cfd8dc;
  padding: 6px 8px;
  text-align: center;
  white-space: nowrap;
}
.cm-table th {
  position: static;
  background: #e8f0fe;
  color: #1565c0;
  font-weight: 600;
}
.cm-table td.cm-cat {
  background: #f5f7fa;
  color: #37474f;
  font-weight: 500;
  width: 90px;
}
.cm-table input[type="text"] {
  width: 100%;
  min-width: 90px;
  padding: 6px 8px;
  border: 1px solid #cfd8dc;
  border-radius: 4px;
  font-size: 13px;
  box-sizing: border-box;
  text-align: center;
}
.cm-table input[type="text"]:focus { border-color: #4a90d9; outline: none; }

/* 选择工作表 */
.sheet-pick-list {
  margin: 10px 0;
  max-height: 320px;
  overflow-y: auto;
  border: 1px solid #e0e0e0;
  border-radius: 6px;
}
.sheet-pick-item {
  display: block;
  padding: 9px 12px;
  font-size: 13px;
  color: #37474f;
  border-bottom: 1px solid #f0f0f0;
  cursor: pointer;
}
.sheet-pick-item:last-child { border-bottom: none; }
.sheet-pick-item:hover { background: #e3f2fd; }
.sheet-pick-item input[type="radio"] { margin-right: 8px; }

/* ============ 响应式 ============ */
/* 三个统计文本框：宽屏 3 列 → 窄屏 2 列 → 手机 1 列 */
@media (max-width: 1180px) {
  .elec-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 768px) {
  .wrap { padding: 8px; }
  .panel-header { flex-direction: column; align-items: flex-start; }
  .elec-grid { grid-template-columns: minmax(0, 1fr); }
  .project-badge { max-width: 150px; font-size: 11px; }
}