/* posting/style.css
   只保留“页面布局/排版/交互细节”，卡片/按钮/输入等基础组件全部来自 assets/common.css
*/

/* ===== Layout (2-column) ===== */
.layout{
  grid-template-columns: 1fr 340px;
}
.panel{
  min-height: calc(100vh - 76px);
}
@media (max-width: 1100px){
  .layout{ grid-template-columns: 1fr; }
  .panel{ min-height:auto; }
  .stores-grid{ grid-template-columns: 1fr; }
}

/* ===== Stores block ===== */
.stores summary{
  cursor:pointer;
  font-weight: 900;
  color: var(--text);
  user-select:none;
}
.stores-grid{
  display:grid;
  grid-template-columns: 1fr 1fr 1fr auto;
  gap: 10px;
  margin-top: 12px;
}
.field.actions{ display:flex; align-items:flex-end; }

/* store cards (left panel) */
.store-manage-list{
  margin-top: 12px;
  display:grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
}
.store-card{
  padding: 10px 12px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  background: rgba(255,255,255,.92);
}
.store-card .row{ display:flex; justify-content:space-between; gap: 8px; }
.store-card .name{ font-weight: 900; }
.store-card .actions{ margin-top: 10px; display:flex; gap: 8px; }

/* ===== Tabs / filters ===== */
.tabs-row{ margin-top: 10px; }
.tabs{ display:flex; flex-wrap:wrap; gap: 8px; }
.tab{
  display:inline-flex; align-items:center; gap: 8px;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: rgba(255,255,255,.80);
  cursor:pointer;
}
.tab.active{
  border-color: rgba(37,99,235,.30);
  background: rgba(37,99,235,.10);
  color: rgba(37,99,235,.95);
  font-weight: 900;
}

.filters{
  margin-top: 12px;
  display:flex;
  flex-wrap:wrap;
  gap: 10px;
  align-items:center;
}
.filters .search{ flex:1; min-width: 260px; }
.daterange{ display:flex; align-items:center; gap: 8px; }
.date-sep{ color: var(--muted); }


/* ===== Filters layout (v16) ===== */
.filters-info{ margin-top: 10px; }
.filters-top{
  margin-top: 10px;
  display:flex;
  align-items:center;
  gap: 12px;
}
.filters-top .tabs-wrap{ flex: 0 0 auto; min-width: 260px; }
.filters-top .toolbar-right{
  margin-left: auto;
  display:flex;
  align-items:center;
  gap: 10px;
  flex-wrap: nowrap;
}
.filters-top .daterange{ flex: 0 0 auto; }
.filters-top .search{ flex: 0 0 auto; }

.filters-bottom{ margin-top: 10px; }
.filters-bottom .store{ flex: 1 1 auto; min-width: 260px; }

@media (max-width: 820px){
  .filters-bottom .store{ flex: 1 1 100%; }
}
/* tighten date inputs */
.input-date{ width: 138px; }

/* ===== Table ===== */
.table-wrap{ margin-top: 12px; overflow:hidden; }
.table{ width:100%; border-collapse: collapse; }
.table thead th{
  font-size: 13px;
  padding: 10px 8px;
  text-align:left;
  color: #334155;
  background: rgba(15,23,42,.03);
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}
.table tbody td{
  padding: 8px 8px;
  font-size: 14px;
  line-height: 1.35;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
}
.table tbody tr:hover{ background: rgba(15,23,42,.02); }
.cell-muted{ color: var(--muted); }
/* highlight: store + qty */
.store-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding: 2px 8px;
  border-radius: 999px;
  font-weight: 900;
  border: 1px solid rgba(37,99,235,.25);
  background: rgba(37,99,235,.10);
}
.qty-badge{
  display:inline-flex;
  align-items:center;
  padding: 2px 8px;
  border-radius: 999px;
  font-weight: 900;
  border: 1px solid rgba(245,158,11,.25);
  background: rgba(245,158,11,.12);
  margin-left: 8px;
}

/* column 9: provider/method */
.table th:nth-child(9),
.table td:nth-child(9){
  padding-left: 6px;
  padding-right: 6px;
}
.table td:nth-child(9){
  white-space: normal;
  word-break: break-word;
  font-size: 12px;
  line-height: 1.25;
}

.thumb,.photo{
  width: 44px; height: 44px;
  border-radius: 10px;
  object-fit: cover;
  border: 1px solid rgba(15,23,42,.10);
  cursor: zoom-in;
  background: rgba(255,255,255,.6);
}

/* ===== Empty / Toast / Detail ===== */
.empty{ padding: 28px 12px; text-align:center; color: var(--muted); }
.empty-title{ font-weight: 900; color: var(--text); }
.empty-sub{ margin-top: 6px; }

.toast{
  position: fixed;
  right: 18px;
  bottom: 18px;
  background: rgba(255,255,255,.95);
  border: 1px solid var(--border);
  padding: 10px 12px;
  border-radius: 12px;
  box-shadow: var(--shadow2);
}

.detail-toolbar{ display:flex; gap: 10px; align-items:center; }
.detail{ margin-top: 12px; }
.detail-empty{
  color: var(--muted);
  padding: 12px;
  border: 1px dashed var(--border);
  border-radius: 14px;
}
.detail-card{
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 12px;
  background: rgba(255,255,255,.92);
  margin-bottom: 10px;
}
.detail-title{ font-weight: 900; margin: 2px 0 10px; font-size: 18px; }
.detail-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.detail-item{
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 12px;
  padding: 10px;
}
.detail-item .k{ font-size: 12px; color: var(--muted); }
.detail-item .v{ margin-top: 4px; font-weight: 700; }

/* ===== Details collapse ===== */
.layout[data-details-collapsed="true"]{ grid-template-columns: 1fr; }
.layout[data-details-collapsed="true"] .panel-details{ display:none; }

/* ===== Modal（页面独有结构，但视觉变量来自 common.css） ===== */

/* 图片预览（点击缩略图放大） */
.img-preview{ position:fixed; inset:0; z-index:10000; }
.img-preview.hidden{ display:none; }
.img-preview .mask{ position:absolute; inset:0; background: rgba(0,0,0,.6); }
.img-preview img{ position:absolute; max-width:90%; max-height:90%; top:50%; left:50%; transform: translate(-50%,-50%); border-radius: 10px; background:#fff; }

body.modal-open{ overflow:hidden; }

.modal.hidden{ display:none; }
.modal{ position:fixed; inset:0; z-index:9999; overflow:auto; scrollbar-width:none; }
.modal::-webkit-scrollbar{ width:0; height:0; }
.modal-backdrop{ position:absolute; inset:0; background: rgba(2,6,23,.55); backdrop-filter: blur(2px); }
.modal-card{
  position:relative;
  margin: 20px auto;
  width: min(1180px, calc(100vw - 24px));
  background:#fff;
  border:1px solid rgba(15,23,42,.10);
  border-radius: var(--radius);
  box-shadow: 0 30px 90px rgba(2,6,23,.35);
  max-height: none;
  display:flex;
  flex-direction:column;
  overflow: visible;
}
.modal-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  padding: 18px 18px 12px;
  border-bottom: 1px solid #eef2f7;
  position: sticky;
  top: 0;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(8px);
  z-index: 2;
}
.modal-title{
  font-weight: 900;
  font-size: 30px;
  letter-spacing: .2px;
  line-height: 1.15;
  display:flex;
  align-items:center;
  gap: 10px;
  flex-wrap: wrap;
}
.modal-close{
  border:0;
  background: transparent;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  color:#64748b;
  font-size: 20px;
  line-height: 36px;
  cursor:pointer;
}
.modal-close:hover{ background: rgba(15,23,42,.06); color:#0f172a; }
.modal-body{ overflow: visible; padding: 14px 16px 18px; }

/* 状态徽标（详情标题用） */
.status-pill{
  display:inline-flex;
  align-items:center;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  border: 1px solid rgba(15,23,42,.10);
  background: #f1f5f9;
  color:#0f172a;
}
.status-awaiting_packaging{ background: rgba(245,158,11,.15); border-color: rgba(245,158,11,.25); color: rgba(180,83,9,1); }
.status-awaiting_deliver{ background: rgba(20,184,166,.14); border-color: rgba(20,184,166,.25); color: rgba(13,148,136,1); }
.status-delivering{ background: rgba(99,102,241,.14); border-color: rgba(99,102,241,.25); color: rgba(79,70,229,1); }
.status-delivered{ background: rgba(34,197,94,.14); border-color: rgba(34,197,94,.25); color: rgba(21,128,61,1); }
.status-cancelled{ background: rgba(148,163,184,.16); border-color: rgba(148,163,184,.25); color: rgba(71,85,105,1); }

/* ===== 详情里的 Ozon 风格商品表格（页面独有） ===== */
.oz-section{ margin-top: 10px; }
.oz-h{ font-weight: 900; font-size: 16px; margin: 0 0 8px; }
.oz-table-wrap{
  border: 1px solid rgba(15,23,42,.10);
  border-radius: 14px;
  overflow: hidden;
  background: #fff;
}
.oz-table{
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 13px;
}
.oz-table thead th{
  text-align: left;
  padding: 12px 12px;
  color: #475569;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
  position: sticky;
  top: 0;
  z-index: 1;
}
.oz-table tbody td{
  padding: 12px 12px;
  border-bottom: 1px solid #eef2f7;
  vertical-align: top;
}
.oz-table tbody tr:hover td{ background: rgba(37,99,235,.04); }
.oz-table .col-photo{ width: 68px; }
.oz-table .col-qty{ width: 70px; }
.oz-table .col-price{ width: 110px; }
.oz-table .col-paid{ width: 130px; }
.oz-table .col-dim{ width: 140px; }
.oz-table .col-w{ width: 90px; }
.oz-table .col-more{ width: 48px; text-align:right; }
.oz-table .photo{
  width: 44px; height: 44px;
  border-radius: 10px;
  border: 1px solid rgba(15,23,42,.10);
  background: #f8fafc;
  overflow: hidden;
}
.oz-table .photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.oz-table .pname{ font-weight: 900; color:#0f172a; line-height: 1.25; }
.oz-table .psub{ margin-top: 4px; color:#64748b; font-size: 12px; }
.more-btn{
  border: 0;
  background: transparent;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  cursor: pointer;
  color: var(--primary);
  font-size: 18px;
  line-height: 34px;
}
.more-btn:hover{ background: rgba(37,99,235,.10); }

/* 数字列右对齐 */
.oz-table th.col-qty, .oz-table td.col-qty,
.oz-table th.col-price, .oz-table td.col-price,
.oz-table th.col-paid, .oz-table td.col-paid,
.oz-table th.col-dim, .oz-table td.col-dim,
.oz-table th.col-w, .oz-table td.col-w{ text-align: right; }

/* 详情内信息块 */
.oz-kvlist{ display:grid; grid-template-columns: 1fr; gap:8px; }
@media (min-width: 760px){ .oz-kvlist{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (min-width: 960px){ .oz-kvlist{ grid-template-columns: repeat(4, minmax(0,1fr)); } }
.kv{
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 14px;
  padding: 10px 12px;
  background: #fff;
}
.kv .k{ color:#64748b; font-size: 12px; }
.kv .v{ margin-top: 6px; font-weight: 900; color:#0f172a; }
.th-sub{ color:#94a3b8; font-weight: 700; font-size: 12px; }

@media (max-width: 980px){
  .stores-grid{ grid-template-columns: 1fr; }
  .prod{ min-width: 240px; }
.product-title{ font-weight: 700; line-height: 1.3; }
.product-sku{
  display:inline-block;
  max-width: 420px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 12px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  color: #475569;
  padding: 2px 6px;
  border-radius: 6px;
  background: #f3f4f6;
  border: 1px solid #e5e7eb;
}
.thumb{ cursor: zoom-in; }

  .oz-kvlist{ grid-template-columns: 1fr; }
}


/* store picker in filters */
.filters .store{ display:flex; align-items:center; gap:10px; flex:1; min-width: 280px; }
.filters .store #storePicker{ flex:1; min-width: 220px; }

.oz-clamp{ display:-webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow:hidden; }

/* ===== Status cell (multi-line) ===== */
.status-cell{ display:flex; flex-direction:column; gap: 6px; }
.status-cell .shead{ display:flex; align-items:center; }
.status-cell .sline{ display:flex; justify-content:space-between; gap: 10px; font-size: 12px; line-height: 1.15; }
.status-cell .skey{ color: var(--muted); white-space: nowrap; }
.status-cell .sval{ font-weight: 800; color: #0f172a; white-space: nowrap; }
.status-cell .sline .muted{ font-weight: 600; }


/* ===== v15: modal + status compact ===== */
.status-cell{ display:flex; flex-direction:column; gap:6px; }
.status-lines{ display:flex; flex-direction:column; gap:2px; }
.sline{ display:flex; justify-content:space-between; gap:8px; font-size:12px; line-height:1.15; color:#334155; }
.skey{ color:#64748b; font-weight:700; white-space:nowrap; }
.sval{ color:#0f172a; font-weight:800; text-align:right; white-space:nowrap; }

.modal-head{ padding: 14px 16px 10px; }
.modal-body{ padding: 10px 12px 14px; }

.oz-section{ padding: 10px 10px; }
.oz-h{ margin-bottom: 8px; }
.oz-kvlist{ gap:6px; }
.kv{ padding: 8px 10px; border-radius: 12px; }
.kv .v{ margin-top: 4px; font-weight: 900; }

.oz-table th, .oz-table td{ padding: 8px 10px; }
.prod-img{ width:44px; height:44px; border-radius: 10px; }
.prod-title{ font-size: 13px; line-height: 1.25; }
.prod-sub{ font-size: 12px; }

/* tracking / copy box styling */
.copy-box{display:inline-flex;align-items:center;justify-content:center;padding:4px 8px;border-radius:8px;border:1px solid rgba(0,0,0,.12);background:#fff;font-size:13px;line-height:1;}
.copy-box:hover{border-color:rgba(0,0,0,.25)}

.row-act{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 4px 10px;
  border-radius: 10px;
  border: 1px solid rgba(15,23,42,.15);
  background: rgba(255,255,255,.9);
  font-size: 12px;
  line-height: 1;
  cursor: pointer;
  user-select:none;
  white-space: nowrap;
}
.row-act:hover{ background: rgba(59,130,246,.08); border-color: rgba(59,130,246,.25); }
.row-act:active{ transform: translateY(1px); }

/* v18.5: 右侧对齐 tabs + 日期 + 搜索（同一行靠右） */
.filters-top .filters-row{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
}

/* v18.5: 行内操作按钮（最后一列） */
.table .row-action{
  white-space: nowrap;
}

/* 追踪号按钮更紧凑 */
.track-link{
  display:inline-block;
  max-width: 140px;
  overflow:hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
}