/* Project data room: a focused, RTL-first surface for reusable tables. */
#tablePanel.page-panel { padding:clamp(16px,2.5vw,34px); color:#202d42; }
#tablePanel .table-page-shell { width:min(1600px,100%); margin:0 auto; gap:22px; }
#tablePanel .table-page-hero { display:flex; align-items:flex-end; justify-content:space-between; gap:22px; min-height:140px; padding:8px 2px 18px; border:0; border-bottom:1px solid #dce4ef; border-radius:0; background:transparent; box-shadow:none; }
#tablePanel .table-page-hero-copy { display:grid; gap:8px; }
#tablePanel .table-page-kicker { display:flex; align-items:center; gap:9px; color:#52637c; font-size:12px; font-weight:500; }
#tablePanel .table-page-kicker i { width:8px; height:8px; border-radius:3px; background:#7065e8; box-shadow:0 0 0 4px #7065e81a; transform:rotate(45deg); }
#tablePanel .table-page-hero h1 { margin:0; color:#19263b; font-size:clamp(29px,3.2vw,40px); font-weight:650; letter-spacing:-1px; line-height:1.2; }
#tablePanel .table-page-hero h1 span { color:#796ef0; }
#tablePanel .table-page-hero p { margin:0; color:#53637a; font-size:14px; line-height:1.8; }
#tablePanel .table-page-hero-stat { display:flex; align-items:center; gap:12px; min-width:0; padding:10px 14px; border:1px solid #dfe5ef; border-radius:12px; background:#fff; text-align:start; }
#tablePanel .table-page-hero-stat::before { display:grid; place-items:center; width:36px; height:36px; border-radius:10px; color:#6259cf; background:#f0efff; content:"▦"; font-size:18px; }
#tablePanel .table-page-hero-stat span { color:#53637a; font-size:12px; }
#tablePanel .table-page-hero-stat strong { color:#25334a; font-size:17px; font-weight:600; }
#tablePanel .entity-scope-tabs { align-self:stretch; width:fit-content; gap:3px; margin:0; padding:4px; border:1px solid #e0e6ef; border-radius:11px; background:#edf1f6; }
#tablePanel .entity-scope-tabs button { min-height:36px; padding:0 14px; border:0; border-radius:8px; color:#53637a; background:transparent; font-size:12px; font-weight:450; }
#tablePanel .entity-scope-tabs button.active { color:#283951; background:#fff; box-shadow:0 1px 4px #1f2b3d14; }
#tablePanel .table-page-toolbar { gap:12px; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; }
#tablePanel .table-page-toolbar-actions { gap:8px; }
#tablePanel .table-primary-btn, #tablePanel .table-secondary-btn, #tablePanel .table-list-plus-btn { min-height:42px; padding:9px 15px; border-radius:10px; font-size:12px; font-weight:500; box-shadow:none; }
#tablePanel .table-primary-btn { border:1px solid #5147d2; color:#fff; background:#5f55dc; box-shadow:0 5px 12px #5f55dc20; }
#tablePanel .table-primary-btn:hover { border-color:#453bc1; background:#5147d2; }
#tablePanel .table-secondary-btn, #tablePanel .table-back-btn { color:#34445c; border:1px solid #dfe5ed; background:#fff; }
#tablePanel .table-secondary-btn:hover { border-color:#bfc8dc; background:#f8f9fc; }
#tablePanel .table-page-search { flex-basis:min(100%,360px); }
#tablePanel .table-page-search input { min-height:42px; padding:8px 14px 8px 40px; border-color:#dfe5ed; border-radius:10px; background:#fff; font-size:12px; font-weight:400; box-shadow:none; }
#tablePanel .table-page-search::after { inset-inline-end:auto; inset-inline-start:14px; color:#64738b; font-size:19px; }
#tablePanel .table-page-grid { display:block; }
#tablePanel .table-board-list-card, #tablePanel .table-board-canvas { min-width:0; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; }
#tablePanel .table-board-list-head { margin:3px 0 14px; }
#tablePanel .table-board-list-head .dashboard-card-title { color:#223148; font-size:18px; font-weight:600; }
#tablePanel .table-board-list-head p { color:#53637a; font-size:12px; }
#tablePanel .table-list-plus-btn { width:38px; min-height:38px; border:1px solid #dedafc; border-radius:10px; color:#554bc9; background:#f3f2ff; font-size:21px; }
#tablePanel .table-board-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
#tablePanel .table-board-item { position:relative; min-height:176px; gap:0; padding:17px; overflow:hidden; border:1px solid #dfe5ed; border-radius:14px; background:#fff; box-shadow:0 2px 5px #1e2c4010; text-align:start; transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease; }
#tablePanel .table-board-item::after { position:absolute; inset-inline-end:-30px; bottom:-48px; width:115px; height:115px; border:1px solid #eceafd; border-radius:34px; background:linear-gradient(140deg,#f9f8ff,#f0efff); content:""; transform:rotate(28deg); }
#tablePanel .table-board-item:hover { transform:translateY(-2px); border-color:#c6c1f3; box-shadow:0 10px 24px #29375a13; }
#tablePanel .table-board-item.active { border-color:#897ff0; box-shadow:0 0 0 3px #7065e817; }
#tablePanel .table-board-item-main { position:relative; z-index:1; display:grid; grid-template-columns:42px 1fr; align-items:center; column-gap:11px; row-gap:7px; width:100%; }
#tablePanel .table-board-card-icon { grid-row:span 2; display:grid; place-items:center; width:42px; height:42px; border:1px solid #e3e1fb; border-radius:12px; color:#655bdd; background:#f1f0ff; font-size:21px; }
#tablePanel .table-board-item:nth-child(3n+2) .table-board-card-icon { border-color:#d5eee8; color:#268873; background:#eaf8f3; }
#tablePanel .table-board-item:nth-child(3n) .table-board-card-icon { border-color:#f3e5c7; color:#ae7725; background:#fff7e8; }
#tablePanel .table-board-item-eyebrow { grid-column:2; padding:0; color:#64738a; background:none; font-size:10px; font-weight:450; }
#tablePanel .table-board-item strong { grid-column:2; overflow:hidden; color:#1e2e45; font-size:15px; font-weight:600; text-overflow:ellipsis; white-space:nowrap; }
#tablePanel .table-board-item small { grid-column:1/-1; margin-top:4px; overflow:hidden; color:#52627a; font-size:11px; font-weight:400; text-overflow:ellipsis; white-space:nowrap; }
#tablePanel .table-board-card-counts { grid-column:1/-1; display:flex; gap:7px; margin-top:9px; }
#tablePanel .table-board-card-counts span { padding:5px 8px; border:1px solid #e6eaf0; border-radius:7px; color:#53637a; background:#fafbfd; font-size:10px; }
#tablePanel .table-board-card-counts b { color:#293b53; font-weight:550; }
#tablePanel .table-board-item-arrow { top:14px; inset-inline-end:14px; z-index:2; color:#64738a; font-size:16px; }
#tablePanel.table-detail-open .table-page-shell { min-height:0; }
#tablePanel.table-detail-open .table-page-hero { display:none; }
#tablePanel .table-board-canvas { min-height:0; }
#tablePanel .table-board-workspace { min-width:0; gap:12px; }
#tablePanel .table-board-toolbar { align-items:end; gap:12px; padding:0 0 13px; border-bottom:1px solid #e0e6ee; }
#tablePanel .table-board-name-field { flex:1.15 1 260px; gap:5px; }
#tablePanel .table-board-name-field span, #tablePanel .table-board-meta-field span { color:#53637a; font-size:11px; font-weight:500; }
#tablePanel .table-board-name-field input { min-height:42px; padding:8px 11px; border-color:#dfe5ed; border-radius:9px; color:#202f46; font-size:16px; font-weight:600; }
#tablePanel .table-board-meta-fields { flex:1.5 1 400px; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
#tablePanel .table-board-meta-field { gap:5px; }
#tablePanel .table-board-meta-field select { min-height:42px; padding:7px 10px; border-color:#dfe5ed; border-radius:9px; color:#35465e; font-size:12px; font-weight:400; }
#tablePanel .table-sheet-tools { display:flex; align-items:center; justify-content:space-between; gap:12px; }
#tablePanel .table-sheet-find { display:flex; align-items:center; gap:7px; width:min(340px,100%); min-height:39px; padding:0 10px; border:1px solid #dfe5ed; border-radius:9px; background:#fff; color:#64738a; }
#tablePanel .table-sheet-find:focus-within { border-color:#9289ed; box-shadow:0 0 0 3px #7065e812; }
#tablePanel .table-sheet-find > span { font-size:19px; line-height:1; }
#tablePanel .table-sheet-find input { width:100%; border:0; outline:0; color:#2e4059; background:transparent; font:inherit; font-size:12px; }
#tablePanel .table-sheet-find input::placeholder { color:#7c899c; }
#tablePanel .table-sheet-tools-actions { display:flex; align-items:center; gap:11px; color:#53637a; font-size:11px; }
#tablePanel .table-export-btn { display:inline-flex; align-items:center; gap:6px; min-height:36px; padding:0 10px; border:1px solid #dfe5ed; border-radius:9px; color:#34445c; background:#fff; font:inherit; font-size:11px; cursor:pointer; }
#tablePanel .table-export-btn:hover { color:#5147c9; border-color:#c9c5ef; background:#faf9ff; }
#tablePanel .table-formula-bar { display:flex; align-items:center; gap:9px; min-height:40px; padding:4px 8px; border:1px solid #dfe5ed; border-radius:9px; background:#fff; }
#tablePanel .table-formula-cell-ref { display:grid; place-items:center; min-width:126px; align-self:stretch; padding:0 8px; border-left:1px solid #e7ebf0; color:#53637a; font-size:11px; white-space:nowrap; }
#tablePanel .table-formula-fx { color:#5f55d8; font-family:Georgia,serif; font-size:15px; font-style:italic; font-weight:600; }
#tablePanel .table-formula-bar input { flex:1; width:100%; min-width:0; border:0; outline:0; color:#2e4059; background:transparent; font:inherit; font-size:12px; }
#tablePanel .table-formula-bar input:disabled { color:#7f8b9d; }
#tablePanel .table-formula-preview { max-width:34%; overflow:hidden; padding-inline-start:9px; border-right:1px solid #e7ebf0; color:#53637a; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
#tablePanel .table-sheet-wrap { min-height:250px; max-height:calc(100dvh - 320px); border:1px solid #dfe5ed; border-radius:10px; background:#fff; scrollbar-color:#bac4d2 #f2f4f7; }
#tablePanel .table-sheet-wrap::-webkit-scrollbar { width:10px; height:10px; }
#tablePanel .table-sheet-wrap::-webkit-scrollbar-thumb { border:2px solid #f2f4f7; border-radius:6px; background:#bac4d2; }
#tablePanel .table-sheet { min-width:760px; }
#tablePanel .table-sheet thead th, #tablePanel .table-sheet tbody td, #tablePanel .table-sheet tbody th { border-color:#e8ecf1; }
#tablePanel .table-sheet thead th { z-index:4; padding:8px; background:#f5f7fa; }
#tablePanel .table-sheet thead th.table-add-column-head { position:sticky; left:0; z-index:5; width:48px; min-width:48px; padding:4px; background:#fff; }
#tablePanel .table-add-column-head button { display:grid; place-items:center; width:32px; height:32px; margin:auto; border:1px dashed #bfc5d6; border-radius:9px; color:#5f55d8; background:#f7f6ff; font:inherit; font-size:20px; line-height:1; cursor:pointer; }
#tablePanel .table-add-column-head button:hover { border-color:#8178e7; background:#efedff; }
#tablePanel .table-add-column-cell { width:48px; min-width:48px; border-inline-start:1px dashed #e4e7ed !important; background:#fff !important; }
#tablePanel .table-sheet thead th:first-child { right:0; z-index:6; }
#tablePanel .table-sheet tbody th { position:sticky; right:0; z-index:2; background:#f7f8fa; }
#tablePanel .table-column-name-input { min-height:30px; color:#2e4059; font-size:12px; font-weight:550; }
#tablePanel .table-column-type-select { padding:3px 7px; color:#53637a; font-size:10px; font-weight:400; }
#tablePanel .table-cell-input { min-height:46px; padding:9px 10px; color:#2e4059; font-size:12px; font-weight:400; }
#tablePanel .table-cell-wrap, #tablePanel .table-sheet td, #tablePanel .table-cell-checkbox { min-height:46px; }
#tablePanel .table-sheet tbody tr:nth-child(even) td { background-color:#fbfcfd; }
#tablePanel .table-sheet tbody tr:hover td { background-color:#f7f7ff; }
#tablePanel .table-sheet td.is-selected { background:#f0efff !important; box-shadow:inset 0 0 0 2px #7065e8; }
#tablePanel .table-sheet tbody tr[hidden] { display:none; }
#tablePanel .table-sheet-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; color:#53637a; font-size:11px; }
#tablePanel .table-sheet-footer-info { display:flex; flex-wrap:wrap; align-items:center; gap:8px 18px; }
#tablePanel .table-quick-add-row { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:38px; padding:0 13px; border:1px solid #d9d6fa; border-radius:9px; color:#5148c8; background:#f5f4ff; font:inherit; font-size:12px; font-weight:500; cursor:pointer; }
#tablePanel .table-quick-add-row:hover { border-color:#8a81e9; background:#efedff; }
#tablePanel .table-quick-add-row span { display:grid; place-items:center; width:20px; height:20px; border-radius:6px; color:#fff; background:#655bdd; font-size:17px; line-height:1; }
#tablePanel .table-quick-add-row:disabled { opacity:.55; cursor:wait; }
#tablePanel .table-empty-state { min-height:340px; border:1px dashed #ccd5e1; border-radius:14px; background:#fff; }
#tablePanel .table-empty-state-inner { padding:24px; }
#tablePanel .table-empty-emoji { color:#5f55d8; border:1px solid #e1defa; border-radius:16px; background:#f2f1ff; }
#tablePanel .table-empty-state h2 { color:#23334b; font-size:21px; font-weight:600; }
#tablePanel .table-empty-state p { color:#53637a; font-size:13px; }
#tablePanel .table-modal-kicker { color:#5f55d8; }
#tablePanel .table-modal-field span { color:#45566e; font-weight:500; }

@media (max-width: 900px) {
  #tablePanel.page-panel { padding:16px; }
  #tablePanel .table-board-list { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #tablePanel .table-board-toolbar { align-items:stretch; flex-direction:column; }
  #tablePanel .table-board-meta-fields { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #tablePanel .table-sheet-wrap { max-height:calc(100dvh - 340px); }
}
@media (max-width: 600px) {
  #tablePanel.page-panel { padding:12px; }
  #tablePanel .table-page-shell { gap:15px; }
  #tablePanel .table-page-hero { align-items:flex-start; min-height:0; padding:2px 0 13px; }
  #tablePanel .table-page-hero h1 { font-size:28px; }
  #tablePanel .table-page-hero p { max-width:29ch; font-size:12px; }
  #tablePanel .table-page-hero-stat { gap:7px; padding:8px; }
  #tablePanel .table-page-hero-stat::before { width:30px; height:30px; }
  #tablePanel .table-page-hero-stat span { font-size:9px; }
  #tablePanel .table-page-hero-stat strong { font-size:15px; }
  #tablePanel .entity-scope-tabs { width:100%; overflow:auto; }
  #tablePanel .entity-scope-tabs button { flex:1 0 auto; padding-inline:9px; font-size:11px; }
  #tablePanel .table-page-toolbar { align-items:stretch; flex-direction:column; gap:9px; }
  #tablePanel .table-page-toolbar-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  #tablePanel .table-page-toolbar-actions.table-detail-mode { display:flex; flex-wrap:wrap; }
  #tablePanel .table-page-toolbar-actions.table-detail-mode > button { flex:1 1 auto; }
  #tablePanel .table-page-search { width:100%; min-width:0; }
  #tablePanel .table-board-list-head { margin-bottom:10px; }
  #tablePanel .table-board-list { grid-template-columns:1fr; gap:9px; }
  #tablePanel .table-board-item { min-height:150px; padding:14px; }
  #tablePanel .table-board-meta-fields { grid-template-columns:1fr; }
  #tablePanel .table-sheet-tools { align-items:stretch; flex-direction:column; gap:8px; }
  #tablePanel .table-sheet-find { width:100%; }
  #tablePanel .table-sheet-tools-actions { justify-content:space-between; }
  #tablePanel .table-formula-bar { gap:6px; min-height:38px; padding:4px 6px; }
  #tablePanel .table-formula-cell-ref { min-width:92px; padding-inline:4px; font-size:9px; }
  #tablePanel .table-formula-preview { max-width:28%; font-size:9px; }
  #tablePanel .table-sheet-wrap { min-height:220px; max-height:calc(100dvh - 360px); border-radius:9px; }
  #tablePanel .table-sheet { min-width:680px; }
  #tablePanel .table-sheet-footer { align-items:stretch; flex-direction:column; gap:9px; }
  #tablePanel .table-sheet-footer-info { justify-content:space-between; }
  #tablePanel .table-quick-add-row { width:100%; }
  #tablePanel .table-empty-state { min-height:280px; }
}

/* On phones, keep the table inside the available viewport and give scrolling to the grid. */
@media (max-width: 760px) {
  body[data-active-page="table"] .app-layout { height:100svh; min-height:100svh; height:100dvh; min-height:100dvh; overflow:hidden; }
  body[data-active-page="table"] .content { height:100%; min-height:0; overflow:hidden; }
  #tablePanel.page-panel.active { display:flex; flex:1 1 auto; flex-direction:column; width:100%; height:calc(100dvh - 118px); min-height:0; padding:8px 10px max(8px,env(safe-area-inset-bottom)); overflow:hidden; box-sizing:border-box; }
  #tablePanel .table-page-shell { display:flex; flex:1 1 auto; flex-direction:column; width:100%; height:100%; min-height:0; gap:10px; }
  #tablePanel.table-detail-open .table-page-shell { height:100%; }
  #tablePanel .entity-scope-tabs { flex:none; min-height:38px; }
  #tablePanel .table-page-toolbar { flex:none; gap:7px; }
  #tablePanel .table-page-toolbar-actions { flex-wrap:nowrap; gap:6px; }
  #tablePanel .table-page-toolbar-actions.table-detail-mode > button { flex:1 1 0; min-width:0; min-height:38px; padding:7px 8px; font-size:11px; }
  #tablePanel .table-page-grid { display:flex; flex:1 1 0; flex-direction:column; min-height:0; gap:0; }
  #tablePanel .table-board-canvas { display:flex; flex:1 1 0; flex-direction:column; min-height:0; overflow:hidden; }
  #tablePanel .table-board-workspace { display:flex; flex:1 1 0; flex-direction:column; min-height:0; gap:7px; overflow:hidden; }
  #tablePanel .table-board-toolbar { flex:none; display:grid; grid-template-columns:minmax(0,1fr); gap:6px; padding-bottom:7px; }
  #tablePanel .table-board-name-field { display:grid; grid-template-columns:62px minmax(0,1fr); align-items:center; gap:6px; }
  #tablePanel .table-board-name-field input { min-height:37px; font-size:14px; }
  #tablePanel .table-board-meta-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
  #tablePanel .table-board-meta-field { display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:5px; }
  #tablePanel .table-board-meta-field select { min-width:0; min-height:37px; padding:5px 7px; font-size:11px; }
  #tablePanel .table-sheet-tools { flex:none; flex-direction:row; align-items:center; gap:7px; }
  #tablePanel .table-sheet-find { flex:1 1 0; min-width:0; min-height:37px; }
  #tablePanel .table-sheet-tools-actions { flex:none; gap:6px; font-size:10px; }
  #tablePanel .table-export-btn { min-height:36px; padding-inline:8px; }
  #tablePanel .table-formula-bar { flex:none; min-height:37px; }
  #tablePanel .table-sheet-wrap { flex:1 1 0; min-height:100px; max-height:none; overflow:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; }
  #tablePanel .table-sheet { min-width:680px; }
  #tablePanel .table-sheet-footer { flex:none; flex-direction:row; align-items:center; gap:8px; padding-top:1px; }
  #tablePanel .table-sheet-footer-info { min-width:0; flex:1 1 auto; gap:4px 10px; font-size:9px; }
  #tablePanel .table-sheet-footer-info > span:first-child { display:none; }
  #tablePanel .table-quick-add-row { width:auto; flex:none; min-height:36px; }
  #tablePanel.table-detail-open .table-page-hero { display:none; }
}

@media (max-width: 390px) {
  #tablePanel .table-board-meta-field { grid-template-columns:1fr; gap:2px; }
  #tablePanel .table-board-meta-field span { font-size:9px; }
  #tablePanel .table-sheet-tools-actions > span { max-width:72px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  #tablePanel .table-export-btn span { display:none; }
}
