/* ============================================================
   V3.20  自定义表格：导入自动增字段 + 字段类型 + 全局排版优化
   ============================================================ */

/* ---------- 统一弹窗底部按钮区 ---------- */
.modal-foot{display:flex;justify-content:flex-end;gap:10px;margin-top:18px;padding-top:14px;border-top:1px solid var(--divider);}
.empty-tip{color:var(--text-3);font-size:13px;text-align:center;padding:18px 0;}

/* ---------- 通用玻璃输入（字段管理等内嵌表单） ---------- */
.glass-input{
  font-family:inherit;font-size:13.5px;color:var(--text);background:var(--input-bg);
  border:1px solid var(--input-border);border-radius:9px;padding:8px 11px;outline:none;transition:.18s;
}
.glass-input:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(10,132,255,.14);}

/* ---------- 字段设置弹窗 ---------- */
.col-mgr-tip{font-size:12.5px;color:var(--text-3);line-height:1.6;margin:0 0 12px;padding:9px 12px;background:var(--input-bg);border-radius:9px;border-left:3px solid var(--blue);}
.col-mgr-list{display:flex;flex-direction:column;gap:8px;max-height:46vh;overflow-y:auto;padding:2px;margin-bottom:12px;}
.col-mgr-row{
  display:flex;align-items:center;gap:9px;padding:7px 9px;border-radius:11px;
  background:var(--card);border:1px solid var(--input-border);transition:border-color .18s,box-shadow .18s,background .18s;
}
.col-mgr-row:hover{border-color:color-mix(in srgb,var(--blue) 40%,var(--input-border));}
.col-mgr-row.dragging-col{opacity:.45;border-style:dashed;}
.col-mgr-row.over-col{border-color:var(--blue);box-shadow:0 0 0 3px rgba(10,132,255,.15);background:color-mix(in srgb,var(--blue) 6%,var(--card));}
.col-drag{cursor:grab;color:var(--text-3);font-size:15px;user-select:none;padding:0 2px;line-height:1;}
.col-drag:active{cursor:grabbing;}
.col-mgr-row .col-title{flex:1;min-width:0;}
.col-mgr-row .col-type{width:104px;flex-shrink:0;cursor:pointer;}
.col-mgr-row .col-rm{flex-shrink:0;width:30px;height:30px;padding:0;display:flex;align-items:center;justify-content:center;font-size:13px;}
.col-add-btn{width:100%;justify-content:center;border-style:dashed!important;padding:10px!important;color:var(--blue)!important;}

/* ---------- 行编辑：图片字段预览 ---------- */
.row-img-preview{display:block;width:88px;height:88px;object-fit:cover;border-radius:10px;margin-top:8px;cursor:zoom-in;border:1px solid var(--input-border);}

/* ---------- 表格数字列右对齐 ---------- */
.td-num{text-align:right;}
.cell-num{font-variant-numeric:tabular-nums;font-weight:600;}

/* ---------- 自定义表格排版优化 ---------- */
#tblView tbody td{vertical-align:middle;}
#tblView .row-sel{background:color-mix(in srgb,var(--blue) 7%,transparent)!important;}
#tblView .grp-row td{
  font-weight:600;font-size:13px;color:var(--blue);background:color-mix(in srgb,var(--blue) 6%,transparent);
  padding:9px 16px;letter-spacing:.3px;
}
.grp-cnt{display:inline-block;min-width:22px;text-align:center;background:var(--blue);color:#fff;border-radius:11px;font-size:11px;padding:1px 7px;margin-left:6px;font-weight:600;}
.th-drag{color:var(--text-3);font-size:12px;margin-left:3px;}
thead th.dragging-col{opacity:.4;}
thead th.over-col{background:color-mix(in srgb,var(--blue) 12%,var(--hover));}
.tbl-group-sel{width:auto;min-width:150px;}

/* 工具栏内搜索框与选择器对齐 */
.toolbar .search{height:36px;min-width:180px;}
.toolbar select.glass,.toolbar .tbl-group-sel{height:36px;border-radius:10px;font-size:13px;padding:0 11px;}

/* ---------- 全局排版微调 ---------- */
.toolbar{gap:9px;flex-wrap:wrap;}
.fld textarea{width:100%;resize:vertical;min-height:72px;font-family:inherit;}
.modal-body .fld:last-of-type{margin-bottom:6px;}

/* 表格操作列按钮紧凑对齐 */
.act-btns{display:inline-flex;gap:4px;align-items:center;}
.icon-btn{width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;}

/* ---------- 手机端 ---------- */
@media(max-width:640px){
  .col-mgr-row{flex-wrap:wrap;}
  .col-mgr-row .col-title{flex-basis:calc(100% - 40px);}
  .col-mgr-row .col-type{width:calc(100% - 44px);}
  .toolbar .search{min-width:130px;width:100%;order:10;}
}