/* 多维表格(Bitable v1) · 独立模块样式 — 工程纪律: 不改 css/app.css */
#btbPane { flex: 1; display: flex; min-width: 0; background: #fff; }
#btbPane.hidden { display: none !important; }

/* 左列: base 列表 */
#btbList { width: 280px; border-right: 1px solid var(--line); display: flex; flex-direction: column; background: var(--sb-bg); }
.btb-head { padding: 14px 16px 8px; font-size: 17px; font-weight: 600; display: flex; align-items: center; justify-content: space-between; }
#btbListBody { flex: 1; overflow-y: auto; padding: 2px 8px 12px; }
.btb-item { padding: 10px 12px; border-radius: 8px; cursor: pointer; }
.btb-item:hover { background: #ececf0; }
.btb-item.active { background: var(--accent-weak); }
.btb-item-title { font-size: 14px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: flex; align-items: center; gap: 6px; }
.btb-item-sub { font-size: 11px; color: var(--txt2); margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.btb-share-tag { font-size: 10px; padding: 0 5px; border-radius: 4px; background: #e8f7ee; color: #2a9d5c; flex: none; }
.btb-empty { text-align: center; color: #9aa2af; font-size: 13px; padding: 50px 14px; line-height: 2; }

/* 右侧: 主区 */
#btbMain { flex: 1; display: flex; flex-direction: column; min-width: 0; }
#btbPlaceholder { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; color: #9aa2af; font-size: 14px; text-align: center; line-height: 1.9; }
.btb-logo { width: 64px; height: 64px; border-radius: 16px; background: #e8f7ee; color: #2a9d5c; display: flex; align-items: center; justify-content: center; font-size: 30px; }

.btb-bar { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-bottom: 1px solid var(--line); }
#btbName { font-size: 15px; font-weight: 600; border: 1px solid transparent; border-radius: 6px; padding: 3px 8px; min-width: 60px; max-width: 320px; background: transparent; }
#btbName:hover, #btbName:focus { border-color: var(--line); background: #fff; outline: none; }
.btb-bar-sp { flex: 1; }
.btb-btn { border: 1px solid var(--line); background: #fff; border-radius: 6px; padding: 5px 12px; font-size: 12.5px; cursor: pointer; color: var(--txt); white-space: nowrap; }
.btb-btn:hover { border-color: var(--accent); color: var(--accent); }
.btb-btn.primary { background: var(--accent); border-color: var(--accent); color: #fff; }
.btb-btn.danger:hover { border-color: var(--danger); color: var(--danger); }

/* 数据表页签 */
#btbTabs { display: flex; align-items: center; gap: 4px; padding: 6px 14px 0; border-bottom: 1px solid var(--line); overflow-x: auto; }
.btb-tab { padding: 6px 14px; font-size: 13px; border-radius: 8px 8px 0 0; cursor: pointer; color: var(--txt2); border: 1px solid transparent; border-bottom: none; white-space: nowrap; }
.btb-tab:hover { background: #f2f3f5; }
.btb-tab.active { color: var(--txt); font-weight: 500; background: #fff; border-color: var(--line); margin-bottom: -1px; }
.btb-tab-add { padding: 4px 10px; cursor: pointer; color: var(--txt2); font-size: 15px; }
.btb-tab-add:hover { color: var(--accent); }

/* 工具条(排序/筛选状态) */
#btbTools { display: flex; align-items: center; gap: 8px; padding: 8px 14px; font-size: 12.5px; }
.btb-chip { display: inline-flex; align-items: center; gap: 6px; background: var(--accent-weak); color: var(--accent); border-radius: 12px; padding: 3px 10px; }
.btb-chip b { cursor: pointer; font-weight: 600; }

/* 网格 */
#btbGridWrap { flex: 1; overflow: auto; padding: 0 14px 20px; }
#btbGrid { border-collapse: collapse; font-size: 13px; min-width: 100%; }
#btbGrid th, #btbGrid td { border: 1px solid var(--line); padding: 0; height: 36px; background: #fff; }
#btbGrid th { background: #f7f8fa; font-weight: 500; color: var(--txt2); position: sticky; top: 0; z-index: 2; }
.btb-th { display: flex; align-items: center; gap: 6px; padding: 0 10px; cursor: pointer; min-width: 120px; max-width: 320px; white-space: nowrap; }
.btb-th:hover { color: var(--accent); }
.btb-th .btb-ficon { opacity: .75; font-size: 12px; }
.btb-th .btb-sortmark { color: var(--accent); font-size: 11px; }
.btb-th-add { padding: 0 14px; cursor: pointer; color: var(--txt2); font-size: 16px; min-width: 44px; text-align: center; }
.btb-th-add:hover { color: var(--accent); }
.btb-idx { width: 44px; min-width: 44px; text-align: center; color: var(--txt2); font-size: 12px; position: relative; }
.btb-idx .btb-rowdel { display: none; position: absolute; inset: 0; align-items: center; justify-content: center; background: #fff; color: var(--danger); cursor: pointer; }
#btbGrid tr:hover .btb-rowdel { display: flex; }
.btb-cell { padding: 6px 10px; cursor: pointer; min-width: 120px; max-width: 320px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; min-height: 23px; }
.btb-cell:hover { outline: 2px solid var(--accent-weak); outline-offset: -2px; }
.btb-cell input, .btb-cell select { width: 100%; border: none; outline: 2px solid var(--accent); outline-offset: -2px; font: inherit; padding: 6px 10px; background: #fff; }
.btb-cell-url { color: var(--accent); text-decoration: underline; }
.btb-tag { display: inline-block; padding: 1px 8px; border-radius: 10px; font-size: 12px; margin-right: 4px; background: #eef1f5; }
.btb-tag.t0 { background: #e8f0ff; color: #2e6cf6; } .btb-tag.t1 { background: #e8f7ee; color: #2a9d5c; }
.btb-tag.t2 { background: #fff3e0; color: #c06c2e; } .btb-tag.t3 { background: #f3e8ff; color: #8358c9; }
.btb-tag.t4 { background: #ffe8ec; color: #c44f6a; } .btb-tag.t5 { background: #e0f4f3; color: #2d9d8f; }
.btb-check { font-size: 15px; display: inline-block; width: 100%; text-align: center; }
.btb-addrow { color: var(--txt2); cursor: pointer; padding: 8px 10px; font-size: 13px; }
.btb-addrow:hover { color: var(--accent); }

/* 弹层(模块自带, 不借 app.js 的 modal) */
#btbMask { position: fixed; inset: 0; background: rgba(0,0,0,.35); z-index: 300; display: flex; align-items: center; justify-content: center; }
#btbMask.hidden { display: none !important; }
#btbBox { background: #fff; border-radius: 10px; min-width: 330px; max-width: 480px; max-height: 76vh; display: flex; flex-direction: column; box-shadow: 0 12px 40px rgba(0,0,0,.18); }
.btb-m-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px 8px; font-size: 15px; font-weight: 600; }
.btb-m-head .btb-x { cursor: pointer; color: var(--txt2); font-size: 14px; }
.btb-m-body { padding: 4px 16px; overflow-y: auto; }
.btb-m-foot { padding: 12px 16px 14px; display: flex; justify-content: flex-end; gap: 8px; }
.btb-input { width: 100%; border: 1px solid var(--line); border-radius: 6px; padding: 7px 10px; font-size: 13px; margin: 6px 0; }
.btb-input:focus { outline: none; border-color: var(--accent); }
.btb-label { font-size: 12px; color: var(--txt2); margin-top: 8px; }
.btb-pick-item { display: flex; align-items: center; gap: 8px; padding: 7px 6px; border-radius: 6px; cursor: pointer; font-size: 13px; }
.btb-pick-item:hover { background: #f2f3f5; }
.btb-pick-item .sub { color: var(--txt2); font-size: 11px; margin-left: auto; }

/* 列头菜单 */
#btbMenu { position: fixed; z-index: 310; background: #fff; border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 8px 26px rgba(0,0,0,.14); padding: 5px; min-width: 150px; }
#btbMenu.hidden { display: none !important; }
.btb-menu-item { padding: 7px 12px; font-size: 13px; border-radius: 6px; cursor: pointer; white-space: nowrap; }
.btb-menu-item:hover { background: #f2f3f5; }
.btb-menu-item.danger { color: var(--danger); }

/* 窄屏(安卓壳): 列表/表格两屏切换; 一级边栏(rail)由 app.css 统一管理, 永不在此隐藏 */
@media (max-width: 520px) {
  #btbPane:not(.hidden) { flex: 1; min-height: 0; }
  #btbList { width: 100%; }
  #btbPane.btb-open #btbList { display: none; }
  #btbPane:not(.btb-open) #btbMain { display: none; }
}
