/**
 * 三码合一 · 列表页样式
 * v5 对齐 aiChatWindow_Demo_v35 antd 列表风格（framework.css 第二部分）
 * v17 参考截图两卡片布局：查询卡片（字段+重置/查询/收起）+ 列表卡片（红线标题+新建+表格+分页）
 */

/* ===== 列表卡片（antd .list-card 圆角 8px） ===== */
.list-card { border-radius: 8px; }
.query-card + .list-card { margin-top: 16px; }

/* ===== 查询卡片（v17：字段行 + 按钮行；收起态=单行字段+右侧按钮） ===== */
.query-card { border-radius: 8px; }
.query-form { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; padding: 20px 16px; position: relative; z-index: 1; }
.query-field { display: flex; align-items: center; flex: 0 0 auto; }
.query-label { flex: 0 0 auto; color: rgba(0, 0, 0, 0.88); font-size: 14px; white-space: nowrap; }
.query-field .qt-input { width: 300px; max-width: none; flex: none; } /* v18：固定 300px */
.query-actions { display: flex; align-items: center; gap: 12px; margin-left: auto; }
.query-form:not(.collapsed) .query-actions { flex-basis: 100%; justify-content: flex-end; }
.query-toggle { display: inline-flex; align-items: center; gap: 4px; color: #da2634; font-size: 14px; cursor: pointer; user-select: none; }
.query-toggle:hover { color: #e64c53; }
.query-toggle svg { transition: transform .2s; }
.query-form.collapsed .query-toggle svg { transform: rotate(180deg); } /* 收起态箭头朝下 */

/* ===== 列表卡片标题行（v17：红线标题 + 右侧新建按钮） ===== */
.list-head { display: flex; align-items: center; padding: 16px 16px 14px; position: relative; z-index: 1; }
.list-head-title { position: relative; padding-left: 12px; font-size: 16px; font-weight: 600; color: rgba(0, 0, 0, 0.88); }
.list-head-title::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 4px; height: 16px; background: #da2634; border-radius: 2px; }
.list-head .qt-tbtn { margin-left: auto; }

/* ===== antd 风按钮（32px / 圆角 6px / 主色 #da2634） ===== */
.qt-tbtn { height: 32px; padding: 4px 15px; border: 1px solid #d9d9d9; border-radius: 6px; background: #fff; color: rgba(0, 0, 0, 0.88); font-size: 14px; white-space: nowrap; cursor: pointer; box-shadow: 0 2px 0 rgba(0, 0, 0, 0.02); transition: all .2s; }
.qt-tbtn:hover { border-color: #da2634; color: #da2634; }
.qt-tbtn-primary { border-color: #da2634; background: #da2634; color: #fff; box-shadow: 0 2px 0 rgba(255, 22, 5, 0.06); }
.qt-tbtn-primary:hover { border-color: #e64c53; background: #e64c53; color: #fff; }

/* ===== 表格（ant-table-middle：12px 8px / 仅横向边框 / hover #fafafa / 表头竖分隔） ===== */
/* v16：左右 16px 内边距，表格边界与工具栏/分页对齐 */
.list-table-wrap { overflow-x: auto; padding: 0 16px; }
.list-table { width: 100%; border-collapse: collapse; font-size: 14px; background: #fff; }
.list-table th { position: relative; background: #fafafa; color: rgba(0, 0, 0, 0.88); font-weight: 600; text-align: left; padding: 12px 8px; border-bottom: 1px solid #f0f0f0; white-space: nowrap; user-select: none; }
.list-table th:not(:last-child)::before { content: ""; position: absolute; top: 50%; inset-inline-end: 0; width: 1px; height: 1.6em; background: #f0f0f0; transform: translateY(-50%); }
.list-table td { padding: 12px 8px; border-bottom: 1px solid #f0f0f0; color: rgba(0, 0, 0, 0.88); vertical-align: middle; white-space: nowrap; }
.list-table tbody tr { transition: background .15s; }
.list-table tbody tr:hover td { background: #fafafa; }
.list-table tbody tr:last-child td { border-bottom: 0; }
.list-table th.sortable { cursor: pointer; }
.list-table th.sortable:hover { color: #da2634; }

.th-sorter { display: inline-flex; align-items: center; gap: 4px; }
.th-sorter .arrows { display: inline-flex; flex-direction: column; line-height: 1; gap: 1px; }
.th-sorter .arrows i { font-style: normal; font-size: 10px; color: rgba(0, 0, 0, 0.29); }
.th-sorter .arrows i.on { color: #da2634; }
.th-sorter .arrows i:hover { color: #8c8c8c; }

.td-name { font-weight: 500; color: rgba(0, 0, 0, 0.88); white-space: nowrap; }
.td-code { font-family: "SF Mono", Menlo, Consolas, monospace; font-size: 13px; color: rgba(0, 0, 0, 0.65); white-space: nowrap; }
.td-creator { color: rgba(0, 0, 0, 0.65); white-space: nowrap; }
.td-time { color: rgba(0, 0, 0, 0.65); white-space: nowrap; font-size: 13px; }
.td-op { white-space: nowrap; }
.op-link { color: #da2634; font-size: 14px; cursor: pointer; background: transparent; border: 0; padding: 0; transition: color .15s; }
.op-link:hover { color: #e64c53; }
.op-link.op-gap { margin-left: 16px; }

.list-empty { padding: 48px 0 40px; text-align: center; color: rgba(0, 0, 0, 0.45); }
.list-empty .empty-icon { font-size: 30px; margin-bottom: 8px; }

/* ===== 分页（antd：右对齐 32px 页码 / 激活白底红描边 / 条数盒 / 跳页输入） ===== */
.list-pagination { display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 16px; flex-wrap: wrap; font-size: 14px; color: rgba(0, 0, 0, 0.88); }
.list-pagination .total { margin-right: 8px; color: rgba(0, 0, 0, 0.65); white-space: nowrap; }
.page-item { min-width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; padding: 0 6px; border-radius: 6px; border: 1px solid transparent; background: transparent; color: rgba(0, 0, 0, 0.88); cursor: pointer; white-space: nowrap; transition: all .15s; font-size: 14px; }
.page-item:hover:not(:disabled) { color: #da2634; }
.page-item.active { border-color: #da2634; background: #fff; color: #da2634; font-weight: 600; cursor: default; }
.page-item:disabled { color: rgba(0, 0, 0, 0.25); cursor: not-allowed; background: transparent; }
.page-ellipsis { cursor: default; color: rgba(0, 0, 0, 0.25); padding: 0 2px; }
.page-size { display: inline-flex; align-items: center; }
.page-size select { height: 32px; border: 1px solid #d9d9d9; border-radius: 6px; background: #fff; color: rgba(0, 0, 0, 0.88); font-size: 14px; padding: 0 8px; outline: none; cursor: pointer; transition: all .15s; }
.page-size select:hover { border-color: #da2634; color: #da2634; }
.pg-jump { display: inline-flex; align-items: center; gap: 4px; color: rgba(0, 0, 0, 0.65); white-space: nowrap; }
.pg-jump input { width: 50px; height: 32px; border: 1px solid #d9d9d9; border-radius: 6px; text-align: center; outline: none; font-size: 14px; color: rgba(0, 0, 0, 0.88); transition: border-color .15s, box-shadow .15s; }
.pg-jump input:focus { border-color: #da2634; box-shadow: 0 0 0 2px rgba(218, 38, 52, 0.1); }
