// RecordBoard Grid 表格样式：默认单元格（表头+表体）padding 8px 16px
// 项目内 ant 组件 prefixCls 为 pisell-lowcode，故表格类名为 .pisell-lowcode-table-*
.pisell-lowcode-record-board-grid {
  .pisell-lowcode-table-thead .pisell-lowcode-table-cell,
  .pisell-lowcode-table-tbody .pisell-lowcode-table-cell {
    padding: 8px 16px;
  }
}

/**
 * `layoutVariant="phone"`：统一收窄表头/表体与无限滚动表尾单元格 padding（业务列样式可挂在 grid.className 下）。
 */
.pisell-lowcode-record-board-grid.pisell-record-board-grid--phone {
  .pisell-lowcode-table-thead .pisell-lowcode-table-cell,
  .pisell-lowcode-table-tbody .pisell-lowcode-table-cell,
  .ant-table-thead .ant-table-cell,
  .ant-table-tbody .ant-table-cell {
    padding: 6px 6px !important;
  }

  .pisell-record-board-infinite-scroll-summary-row > .pisell-lowcode-table-cell,
  .pisell-record-board-infinite-scroll-summary-row > .ant-table-cell {
    padding: 6px 6px !important;
  }

  .pisell-record-board-uniform-summary {
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 8px 12px;
    min-height: 36px;
    padding: 8px 12px;

    .pisell-record-board-uniform-summary-item {
      flex-shrink: 1;
      min-width: 0;
      max-width: 100%;
      flex-wrap: wrap;
    }

    .pisell-record-board-uniform-summary-label,
    .pisell-record-board-uniform-summary-value {
      white-space: normal;
    }

    /** 同值总结区 Tag：略小于桌面 14px pill，与手机行高对齐 */
    .pisell-tags,
    .ant-tag,
    .pisell-lowcode-tag {
      padding: 1px 8px;
      font-size: 11px;
      line-height: 16px;
      border-radius: 10px;
      gap: 4px;
    }
  }
}

// 同值列折叠时的总结区样式（参考 Figma 12840-86869）
.pisell-record-board-uniform-summary {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 32px;
  min-height: 44px;
  padding: 12px 24px;
  background: #f2f4f7;
  border-bottom: 1px solid #eaecf0;
  border-radius: 8px 8px 0 0;

  .pisell-record-board-uniform-summary-item {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
  }

  .pisell-record-board-uniform-summary-label {
    font-family: inherit;
    font-size: 12px;
    font-weight: 500;
    line-height: 18px;
    color: #475467;
    white-space: nowrap;
  }

  .pisell-record-board-uniform-summary-value {
    font-family: inherit;
    font-size: 12px;
    font-weight: 500;
    line-height: 18px;
    color: #475467;
    white-space: nowrap;
  }
}

// iOS/WebKit：列表到达边界时不把弹性回弹传给外层（橡皮筋）；fillHeight 时外层或表体内层其一滚动
.pisell-record-board-scroll-body {
  overscroll-behavior: none;
}

// 纯 CSS 占满高度：滚动发生在 .pisell-record-board-scroll-body，表头 sticky 固定；高度传到 table
.pisell-record-board-scroll-body .pisell-lowcode-record-board-grid {
  height: 100%;
  display: flex;
  flex-direction: column;
  min-height: 0;

  .pisell-lowcode-table-thead .pisell-lowcode-table-cell {
    position: sticky;
    top: 0;
    z-index: 1;
    background: var(--ant-color-bg-container, #ffffff);
  }

  /*
   * 根本原因：表头所有单元格统一用了 z-index: 1，横向滚动时后面的列（非固定列）与固定列同层叠，
   * 非固定列会盖住固定列。解决：仅对「固定列」提高 z-index。
   * antd/rc-table 会给所有 fixed 列（含多选列）的 th/td 加上 .*-table-cell-fix-left，
   * 用该类选择器即可覆盖任意数量的固定列，无需按 nth-child 逐个写。
   */

  .pisell-lowcode-table-thead .pisell-lowcode-table-cell-fix-left {
    z-index: 2 !important;
    background: var(--ant-color-bg-container, #ffffff) !important;
  }

  // 让 antd Table 外层占满，使 scroll.y 生效且高度链不断
  .pisell-lowcode-table-wrapper {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
  }

  .pisell-lowcode-table-wrapper .pisell-lowcode-table {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
  }

  .pisell-lowcode-table-wrapper .pisell-lowcode-table .pisell-lowcode-table-container {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
  }
}

// scroll.y / autoCalc 时表体容器滚动；无 scroll-body 时亦同。统一关闭 iOS 弹性回弹
.pisell-record-board-root .pisell-lowcode-record-board-grid {
  .pisell-lowcode-table-body,
  .ant-table-body {
    overscroll-behavior: none;
  }
}

// 行状态样式示例（如 grid.rowClassName 返回 'pisell-record-board-row-cancelled'）
.pisell-record-board-row-cancelled {
  background: #fff1f0;
}

// 无限滚动：表尾 Table.Summary 一行，文案靠左
// 不再加 border-top：上方数据行已有 border-bottom，再画 top 会与 antd 格线叠成双线
.pisell-record-board-infinite-scroll-summary-row > .pisell-lowcode-table-cell,
.pisell-record-board-infinite-scroll-summary-row > .ant-table-cell {
  background: var(--ant-color-bg-container, #ffffff) !important;
  border-top: none !important;
  text-align: left !important;
  vertical-align: middle;
  padding: 8px 12px !important;
}

.pisell-record-board-infinite-scroll-tip {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  font-size: 12px;
  line-height: 18px;
}

.pisell-record-board-infinite-scroll-tip-loading {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #475467;
}

.pisell-record-board-infinite-scroll-tip-done {
  color: #667085;
}