/* ============================================================================
   admin 端 surface 层 —— 依赖 business.css(工艺令牌 + 基础组件)与
   theme-juliu.css(品牌族,接线归任务 #6)。本文件只保留 admin 独有组件,
   禁止重定义 :root 原子令牌与基础组件五态;断点只取 640 / 768 / 1024 / 1280。
   ========================================================================== */

/* -- 登录卡品牌标(admin 独有类;基础层仅提供 .merchant-mark) ------------------ */
.brand-mark {
  display: grid; place-items: center; width: 54px; height: 54px; margin: auto;
  border-radius: var(--r-lg); color: var(--brand-ink); background: var(--brand);
  font-size: var(--fs-2xl); font-weight: var(--fw-bold);
}

/* -- 验证码行(admin 独有;按钮与图片同行等高,46px 固定高 ≥ --tap-min) -------- */
.captcha { display: grid; grid-template-columns: 140px 1fr; gap: var(--s-3); align-items: end; }
.captcha button {
  height: 46px; padding: 0; overflow: hidden;
  border: var(--bw-1) solid var(--line); border-radius: var(--r-sm);
  background: var(--surface);
}
.captcha img { width: 100%; height: 100%; object-fit: contain; }
.captcha label { margin: 0; }

/* -- 审核材料块(admin 独有;detail 对话框内的图片证据列表) -------------------- */
.review-material {
  display: grid; gap: var(--s-2); padding: var(--s-4) 0;
  border-bottom: var(--bw-1) solid var(--line);
}
.review-material:last-child { border-bottom: 0; }
.review-material small { color: var(--muted); }
.review-material img {
  display: block; max-width: 100%; max-height: 440px; object-fit: contain;
  border: var(--bw-1) solid var(--line); border-radius: var(--r-sm);
}

/* -- 双面板布局(admin 独有;经营总览两栏) ------------------------------------- */
.two-panels { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-4); }

/* -- 登录卡次按钮通栏 ---------------------------------------------------------- */
.login-secondary { width: 100%; margin-top: var(--s-2); }

/* -- 响应式差量(断点字面量对齐 business.css 速记;断点内禁 min/max-height) ----- */
@media (max-width: 1024px) {
  .two-panels { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .captcha { grid-template-columns: 1fr; }
}
/* 按运营任务组织导航，原有低频维护入口保留但不占据首层。 */
#nav details { width: 100%; }
#nav summary { cursor: pointer; padding: var(--s-3); min-height: var(--tap-min); font-weight: var(--fw-semibold); border-radius: var(--r-sm); }
#nav details button { width: 100%; }
#nav summary:focus-visible { outline: 2px solid currentColor; outline-offset: -2px; }
#appView > aside { display: flex; flex-direction: column; }
#nav { flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden; align-content: start; scrollbar-width: thin; }
#nav details details { margin-left: var(--s-3); width: calc(100% - var(--s-3)); border-left: var(--bw-1) solid var(--n-600); }
#nav details button { padding-left: var(--s-6); }
#nav .contains-current > summary { color: var(--n-0); }
#nav button.active { border-left: var(--bw-2) solid var(--brand); }
#appView > aside > .logout { position: static; width: 100%; margin-top: var(--s-3); flex-shrink: 0; }
#navigationToggle { display: none; }
.workspace header .nav-path { margin: 0 0 var(--s-2); font-size: var(--fs-sm); color: var(--muted); }
@media (max-width: 640px) {
  body { padding-bottom: 0; }
  #appView > aside { position: static; height: auto; padding: var(--s-3); color: var(--ink); box-shadow: none; border-bottom: var(--bw-1) solid var(--line); }
  #navigationToggle { display: block; width: 100%; text-align: left; color: var(--ink); background: var(--surface-muted); }
  #nav { display: none; flex: none; }
  .navigation-open #nav { display: grid; }
  #nav button { text-align: left; font-size: var(--fs-sm); white-space: normal; }
  #nav .contains-current > summary { color: var(--brand); }
  #nav details details { border-left-color: var(--line); }
  #appView > aside.navigation-open > .logout { display: block; }
}
.admin-support-duty{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:8px 0}
.admin-support-duty [role="status"]{color:var(--ink-secondary);font-size:var(--fs-sm)}
.admin-support-messages{max-height:50vh;overflow-y:auto;padding:16px 0}
.admin-support-message{max-width:85%;padding:12px 16px;margin-bottom:12px;border-radius:var(--r-md);background:var(--surface-muted)}
.admin-support-message.is-own{margin-left:auto;background:var(--primary-soft)}
.admin-support-message p{white-space:pre-wrap;overflow-wrap:anywhere;margin:8px 0 0;color:var(--ink)}
.admin-support-message small{color:var(--muted)}
.admin-support-reply{display:grid;gap:12px;border-top:1px solid var(--line);padding-top:16px}
.admin-support-reply textarea{min-height:96px;resize:vertical;width:100%}
.hours-editor{padding:16px;margin:0 0 16px;border:1px solid var(--line);border-radius:var(--r-md)}
.hours-window{display:flex;gap:12px;align-items:end;flex-wrap:wrap;padding:12px 0;border-bottom:1px solid var(--line)}
.hours-days{display:flex;gap:12px;flex-wrap:wrap;width:100%}
.hours-days label{display:flex;align-items:center;gap:4px;margin:0}
.hours-days input{width:18px;min-height:18px;margin:0}
/* 费率配置保留来源事实，与可编辑的分润规则分开。 */
.rate-preview { display: grid; gap: var(--s-2); padding: var(--s-3); background: var(--surface-muted); border-radius: var(--r-md); }
.rate-preview p { margin: 0; }
.rate-preview small { color: var(--muted); }
/* 宽表格横向滚动时保留处理入口，正文仍可完整滚动查看。 */
.table-wrap .table-action-cell { position: sticky; right: 0; z-index: 1; background: var(--surface); border-left: var(--bw-1) solid var(--line); }
.table-wrap th.table-action-cell { z-index: 2; background: var(--surface-muted); }

/* 长文本列（工单主题等）截断成单行：悬停看全文，详情弹窗仍可看完整内容，
   同时避免长主题把表格撑宽、把操作列按钮挤成竖排。 */
.cell-truncate {
  max-width: 320px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* 弹窗表单的独立规则行：字段名保持简短，格式要求放这里，不挤压输入框。 */
.field-hint { color: var(--muted); font-size: var(--fs-xs); font-weight: var(--fw-regular); }

/* 列表筛选下拉（状态/分类）与查询框同行，宽度收紧不占整行。 */
.actions select { width: auto; min-width: 132px; }

/* 表格操作列按钮组不换行：wrap 会把列最小宽度压成单按钮宽，导致按钮竖排撑高整行。 */
.table-action-cell .actions { flex-wrap: nowrap; }

/* 管理工作区：日常任务分区，运行记录按信息而非表单展示。 */
.workspace > header h1 { font-size: var(--fs-xl); }
.workspace .panel { border-radius: var(--r-sm); box-shadow: none; }
.workspace .panel > .field-hint { margin: 0; padding: var(--s-3) var(--s-4); border-bottom: var(--bw-1) solid var(--line); }
.workspace .empty { white-space: normal; }
.workspace .empty p { margin-bottom: 0; }
.source-tabs { display: flex; gap: var(--s-2); margin-bottom: var(--s-4); border-bottom: var(--bw-1) solid var(--line); }
.source-tabs button { background: transparent; color: var(--muted); border-radius: 0; border-bottom: var(--bw-2) solid transparent; }
.source-tabs button.active { color: var(--brand); border-bottom-color: var(--brand); }
[data-source-panel][hidden] { display: none; }
.workspace .list-controls { padding: var(--s-3) var(--s-4); border-bottom: var(--bw-1) solid var(--line); }
.list-controls > form { flex: 1; align-items: end; }
.list-controls label { margin: 0; color: var(--muted); font-size: var(--fs-xs); }
.list-controls input[type="date"] { width: 152px; }
.list-controls input[type="search"] { width: 224px; }
.source-filters { display: flex; flex-wrap: wrap; gap: var(--s-4); padding: var(--s-3) var(--s-4); border-bottom: var(--bw-1) solid var(--line); }
.source-filters label { min-width: 160px; margin: 0; color: var(--muted); }
.cell-stack { display: grid; gap: var(--s-1); }
.cell-stack small { color: var(--muted); }
.connection-details { padding: var(--s-4); border-top: var(--bw-1) solid var(--line); }
.connection-details > summary { cursor: pointer; color: var(--ink-secondary); white-space: normal; }
.connection-details .panel { margin: var(--s-4) 0 0; }
.more-actions { position: relative; }
.more-actions summary { cursor: pointer; padding: var(--s-2); color: var(--muted); min-height: var(--tap-min); display: flex; align-items: center; }
.more-actions summary::after { content: '⌄'; margin-left: var(--s-2); }
.more-actions[open] summary::after { content: '⌃'; }
.more-actions-menu { display: grid; gap: var(--s-1); padding: var(--s-2); background: var(--surface-muted); border: var(--bw-1) solid var(--line); border-radius: var(--r-sm); }
.more-actions-menu button { text-align: left; background: transparent; }
.source-tabs button:focus-visible, .more-actions summary:focus-visible, .connection-details > summary:focus-visible { outline: var(--focus-ring); outline-offset: -2px; }
.admin-facts { margin: 0; }
.admin-facts > div { display: grid; grid-template-columns: minmax(112px, 1fr) minmax(0, 2fr); gap: var(--s-4); padding: var(--s-3) 0; border-bottom: var(--bw-1) solid var(--line); }
.admin-facts > div:last-child { border: 0; }
.admin-facts dt { color: var(--muted); }
.admin-facts dd { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.page-retry { padding: var(--s-6); background: var(--surface); border: var(--bw-1) solid var(--line); border-radius: var(--r-sm); }
#formDialog.wide-form { width: min(920px, calc(100% - var(--s-8))); }
#formDialog.wide-form #dialogFields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--s-6); }
.channel-rate-editor { grid-column: 1 / -1; min-width: 0; margin: var(--s-2) 0 var(--s-4); padding: 0; border: var(--bw-1) solid var(--line); border-radius: var(--r-sm); }
.channel-rate-editor legend { margin-left: var(--s-3); padding: 0 var(--s-2); font-weight: var(--fw-semibold); }
.channel-rate-editor > p { padding: 0 var(--s-4); }
.channel-rate-editor table { width: 100%; }
.channel-rate-editor thead th { position: sticky; top: 0; z-index: 1; background: var(--surface-muted); }
.channel-rate-editor th, .channel-rate-editor td { padding: var(--s-2) var(--s-4); }
.channel-rate-editor tbody th { font-weight: var(--fw-medium); white-space: normal; }
.channel-rate-editor .rate-input { display: flex; align-items: center; gap: var(--s-2); margin: 0; }
.channel-rate-editor input { width: 120px; text-align: right; margin: 0; }
.form-security { grid-column: 1 / -1; }
@media (min-width: 768px) {
  .workspace .table-action { min-height: 32px; padding: var(--s-1) var(--s-2); }
  .workspace .more-actions summary { min-height: 32px; padding: var(--s-1) var(--s-2); }
  .workspace .list-controls input, .workspace .list-controls select, .source-filters select { min-height: 36px; padding: var(--s-1) var(--s-2); }
  .channel-rate-editor input { min-height: 36px; padding: var(--s-1) var(--s-2); }
}
@media (max-width: 640px) {
  #formDialog.wide-form #dialogFields { grid-template-columns: minmax(0, 1fr); }
  .channel-rate-editor th, .channel-rate-editor td { padding: var(--s-2) var(--s-1); font-size: var(--fs-xs); }
  .channel-rate-editor input { width: 76px; }
  .source-filters label { flex: 1; min-width: 120px; }
  .admin-facts > div { grid-template-columns: minmax(0, 1fr); gap: var(--s-1); }
}