/* Shared approval pagination: aligned metrics, system-specific accent. */
html body :is(.cis-approval-list, .sam-app-shell) .approval-pagination {
  --page-accent:#2447b5;--page-accent-text:#2447b5;
  display:flex; align-items:center; flex-wrap:wrap; gap:10px;
  padding:10px 14px; margin:8px 0; border:1px solid var(--line); border-radius:12px;
  background:var(--ds-surface); color:var(--ink-3); font:12px/1.5 var(--font, sans-serif);
  scroll-margin-top:100px;
}
html body .cis-approval-list .approval-pagination { --page-accent:#ae2330;--page-accent-text:#ae2330; }
html body .approval-pagination .approval-page-status { margin-right:auto; font-variant-numeric:tabular-nums; }
html body .approval-pagination .approval-page-size { display:flex; align-items:center; gap:6px; white-space:nowrap; font:inherit; margin:0; }
html body .approval-pagination .approval-page-size select {
  width:58px; height:30px; min-height:30px; padding:3px 6px; margin:0;
  border:1px solid var(--line); border-radius:7px; background:var(--ds-surface); color:inherit; font:inherit;
}
html body .approval-pagination .approval-page-buttons { display:flex; align-items:center; gap:4px; }
html body .approval-pagination .approval-page-buttons button {
  display:inline-grid; place-items:center; min-width:30px; height:30px; padding:0 6px;
  margin:0; border:1px solid transparent; border-radius:7px; background:transparent; box-shadow:none;
  color:inherit; font:inherit; cursor:pointer;
}
html body .approval-pagination .approval-page-buttons button:hover:not(:disabled) { background:var(--ds-surface-muted); }
html body .approval-pagination .approval-page-buttons button[aria-current="page"] { color:var(--page-accent-text); background:color-mix(in srgb,var(--page-accent) 9%,white); font-weight:700; }
html body .approval-pagination .approval-page-buttons button:disabled { opacity:.35; cursor:not-allowed; }
html body .approval-pagination :is(button,select):focus-visible { outline:2px solid var(--page-accent); outline-offset:2px; }
html body .approval-pagination .approval-page-gap { padding:0 3px; }
@media(max-width:767px) {
  html body :is(.cis-approval-list, .sam-app-shell) .approval-pagination { gap:8px; padding:10px; }
  html body .approval-pagination .approval-page-status { flex:1 0 calc(100% - 100px); }
  html body .approval-pagination .approval-page-buttons { margin-left:auto; }
  html body .approval-pagination .approval-page-buttons button { min-width:34px; height:34px; }
}
html body .cis-approval-intro { position:relative; padding:20px 24px; margin:0 0 12px; border:1px solid var(--line); border-radius:20px; background:linear-gradient(110deg,#edf8f7,#ffffff 65%,#fff5f5); overflow:hidden; }
html body .cis-approval-intro::before { content:''; position:absolute; inset:0 auto 0 0; width:4px; background:#ae2330; }
html body .cis-approval-intro > span { color:var(--brand-text); font-size:11px; font-weight:700; letter-spacing:.1em; }
html body .cis-approval-intro h2 { margin:4px 0 8px; font-size:24px; font-weight:500; color:var(--text-neutral-strong3); }
html body .cis-approval-intro p { margin:0; font-size:13px; color:var(--ds-text-muted); }
html body .cis-request-intro { display:flex; align-items:center; justify-content:space-between; gap:18px; }
html body .cis-request-intro .btn { flex:none; }
html body .cis-request-intro > div > span { color:var(--brand-text); font-size:11px; font-weight:700; letter-spacing:.1em; }
html body [data-approval-filterbar] { padding:0 12px; margin:0 0 10px; border:1px solid var(--line); border-radius:12px; background:rgba(255, 255, 255, 0.69); }
/* 我的申请有按状态、按流程两组筛选：同一张卡里要看得出是两组，否则又挤成一片。 */
html body [data-request-filters] { padding:0 12px; margin:0 0 10px; border:1px solid var(--line); border-radius:12px; background:rgba(255, 255, 255, 0.69); }
html body [data-request-filters] .approval-process-tabs + .approval-process-tabs { border-top:1px solid var(--line); }
html body .cis-approval-search { padding:10px 12px; margin:0 0 12px; border:1px solid var(--line); border-radius:12px; background:rgba(255, 255, 255, 0.69); }
html body .cis-approval-list .approval-card-row { font-size:15px; }
/* Approvals use real process names for navigation and retain a readable table rhythm. */
html body .cis-approval-list .approval-process-tabs {
  display:flex;
  align-items:flex-start;
  gap:12px;
  min-width:0;
}
html body .cis-approval-list .approval-process-tabs > span {
  flex:none;
  padding:7px 0;
  color:var(--text-neutral-base5);
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
}
html body .cis-approval-list .approval-process-tabs .list-tabs { min-width:0; margin:0; }
html body .cis-approval-list .approval-process-tabs .fchip { display:inline-flex; align-items:center; gap:7px; }
html body .cis-approval-list .approval-process-tabs .fchip strong {
  min-width:19px;
  height:19px;
  display:inline-grid;
  place-items:center;
  padding:0 5px;
  border-radius:999px;
  background:#edf1f8;
  color:var(--text-blue-base4);
  font-size:10px;
}
html body .cis-approval-list .approval-process-tabs .fchip.on strong { background:rgba(255, 255, 255, 0.18); color:#ffffff; }
html body .cis-approval-list .approval-list-context { margin-bottom:8px; font-size:12px; }
html body .cis-approval-list .approval-card-table { min-width:0; overflow:hidden; }
html body .cis-approval-list .approval-card-scroll { overflow-x:auto; padding:0 1px 4px; }
html body .cis-approval-list .approval-card-head,
html body .cis-approval-list .approval-card-row {
  display:grid;
  grid-template-columns:minmax(118px,.8fr) minmax(130px,.9fr) minmax(100px,.65fr) minmax(260px,2fr) minmax(145px,1fr) minmax(105px,.75fr) minmax(132px,.85fr) 128px;
  align-items:center;
  gap:14px;
  min-width:1280px;
}
html body .cis-approval-list .approval-card-head {
  min-height:40px;
  padding:0 16px;
  color:var(--text-neutral-base5);
  font-size:11px;
  font-weight:780;
}
html body .cis-approval-list .approval-card-head > span:last-child { text-align:right; }
html body .cis-approval-list .approval-card-body { display:grid; gap:8px; min-width:1280px; }
html body .cis-approval-list .approval-card-row {
  position:relative;
  min-height:72px;
  padding:11px 16px;
  border:1px solid var(--line);
  border-radius:14px;
  background:rgba(255, 255, 255, 0.96);
  box-shadow:0 5px 13px rgba(24, 45, 91, 0.04),inset 0 1px 0 #ffffff;
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
html body .cis-approval-list .approval-card-row:hover {
  border-color:#afbdd3;
  box-shadow:0 9px 20px rgba(24, 45, 91, 0.07),inset 0 1px 0 #ffffff;
  transform:translateY(-1px);
}
html body .cis-approval-list .approval-card-row.urgent {
  border-left:3px solid #b52630;
  padding-left:14px;
  background:linear-gradient(90deg,#fffafa,#ffffff 28%);
}
html body .cis-approval-list .approval-card-cell {
  min-width:0;
  overflow:hidden;
  color:var(--ds-text-secondary);
  font-size:12px;
  line-height:1.45;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html body .cis-approval-list .approval-card-serial,
html body .cis-approval-list .approval-card-created { font:11px ui-monospace,SFMono-Regular,Menlo,monospace; }
html body .cis-approval-list .approval-card-serial a { color:var(--brand-text); font-weight:760; text-decoration:none; }
html body .cis-approval-list .approval-card-serial a:hover { text-decoration:underline; }
html body .cis-approval-list .approval-card-process b { color:var(--text-neutral-strong3); font-size:12.5px; }
html body .cis-approval-list .approval-card-node b {
  display:inline-flex;
  max-width:100%;
  overflow:hidden;
  padding:4px 8px;
  border-radius:8px;
  background:var(--ds-surface-muted);
  color:var(--brand-text);
  font-size:10.5px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html body .cis-approval-list .approval-card-approver {
  display:block;
  max-width:100%;
  overflow:hidden;
  margin-top:3px;
  color:var(--ds-text-muted);
  font-size:10px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html body .cis-approval-list .approval-card-actions { display:flex; align-items:center; justify-content:flex-end; gap:6px; position:sticky; right:0; z-index:1; background:var(--ds-surface); min-height:54px; padding:0 4px; border-radius:8px; box-shadow:-10px 0 15px rgba(255, 255, 255, 0.929); }
html body .cis-approval-list .approval-card-head > span:last-child { position:sticky; right:0; padding:8px; background:var(--ds-surface-muted); z-index:1; }
html body .cis-approval-list .approval-card-row { cursor:pointer; }
html body .cis-approval-list .approval-card-row:focus-visible { outline:2px solid #b52630; outline-offset:-2px; }
html body .cis-approval-list .request-card-head,
html body .cis-approval-list .request-card-row {
  grid-template-columns:minmax(118px,.8fr) minmax(150px,1fr) minmax(260px,2fr) minmax(140px,1fr) minmax(100px,.7fr) minmax(132px,.85fr) 104px;
}
html body .cis-approval-list .request-card-status b {
  display:inline-flex; max-width:100%; overflow:hidden; padding:4px 8px; border-radius:8px;
  background:var(--ds-surface-muted); color:var(--ds-text-secondary); font-size:10.5px; text-overflow:ellipsis; white-space:nowrap;
}
html body .cis-approval-list .request-card-status.request-running b { background:var(--ds-surface-muted); color:var(--text-teal-soft4); }
html body .cis-approval-list .request-card-status.request-invoice b { background:#fff3e4; color:var(--text-warn-base6); }
html body .cis-approval-list .request-card-status.request-completed b { background:var(--ds-accent-soft); color:var(--text-green); }
html body .cis-approval-list .request-card-status.request-rejected b { background:var(--brand-bg); color:var(--text-red-soft7); }
html body .cis-approval-list .request-card-status.request-draft b { background:var(--ds-surface-muted); color:var(--ink-3); }
html body .cis-approval-list .request-card-actions .btn { box-shadow:none; }
html body .cis-approval-list .approval-card-ai { white-space:normal; overflow:visible; font-size:12px; line-height:1.5; color:var(--text-blue-strong1); }
html body .cis-approval-list .approval-ai-label { margin-left:3px; font-size:9px; font-weight:600; color:var(--text-blue-base4); }
html body .cis-approval-list [data-approval-summary] { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
html body .cis-approval-list .approval-summary-partial { display:block; margin-top:2px; color:var(--ink-3); font-size:10px; }
html body .cis-approval-list .approval-reject { color:var(--text-red-soft7); border-color:#edcbd0; }
.approval-summary-retry { padding:2px 5px; border:0; background:none; color:var(--text-teal-soft4); cursor:pointer; }
.approval-decision { box-sizing:border-box; position:fixed; inset:0; margin:auto; width:min(540px,calc(100vw - 32px)); max-height:calc(100dvh - 40px); overflow:auto; padding:26px; border:1px solid var(--line); border-radius:20px; color:var(--text-neutral-strong3); background:var(--ds-surface); box-shadow:0 20px 80px rgba(19, 39, 71, 0.188); }
.approval-decision::backdrop { background:rgba(22, 36, 64, 0.376); backdrop-filter:blur(3px); }
.approval-decision header > span { color:var(--text-neutral-base5); font-size:12px; }
.approval-decision h2 { margin:6px 0 20px; font-size:21px; line-height:1.4; }
.approval-decision dl { display:grid; gap:10px; padding:16px; border-radius:12px; background:var(--ds-surface-muted); font-size:13px; }
.approval-decision dl > div { display:grid; grid-template-columns:85px 1fr; gap:10px; }
.approval-decision dt { color:var(--text-neutral-base5); }.approval-decision dd { margin:0; overflow-wrap:anywhere; }
.approval-decision p { font-size:12px; line-height:1.7; }.approval-decision-notice { color:var(--text-blue-base4); }
.approval-decision label { display:block; margin:18px 0 8px; font-size:13px; font-weight:600; }
.approval-decision textarea { box-sizing:border-box; width:100%; font:inherit; font-size:14px; padding:10px; border:1px solid #cdd6e4; border-radius:10px; resize:vertical; }
.approval-decision [data-decision-status] { color:var(--text-blue-base4); min-height:22px; }
.approval-decision footer { display:flex; align-items:center; gap:8px; margin-top:20px; flex-wrap:wrap; }
.approval-decision footer a { margin-right:auto; color:var(--text-teal-soft4); font-size:13px; }
.approval-decision button { cursor:pointer; padding:10px 16px; border-radius:9px; border:1px solid var(--line); background:white; font-size:13px; color:var(--text-blue-strong1); }
.approval-decision button.approve { background:#b52630; border-color:#b52630; color:white; }
.approval-decision button.reject { background:#a83343; border-color:#a83343; color:white; }
.approval-decision button:disabled { opacity:.45; cursor:not-allowed; }
html body .cis-approval-list .approval-card-actions .btn {
  min-height:30px;
  height:30px;
  padding:0 10px;
  border-radius:9px;
  font-size:11.5px;
}

@media(max-width:767px) {
  html body .cis-approval-list .approval-process-tabs { display:grid; gap:7px; }
  html body .cis-approval-list .approval-process-tabs > span { padding:0; }
  html body .cis-approval-list .approval-process-tabs .list-tabs { display:flex; flex-wrap:nowrap; overflow-x:auto; }
  html body .cis-approval-list .approval-card-scroll { overflow:visible; }
  html body .cis-approval-list .approval-card-head { display:none; }
  html body .cis-approval-list .approval-card-body { min-width:0; gap:9px; }
  html body .cis-approval-list .approval-card-row {
    min-width:0;
    grid-template-columns:minmax(0,1fr) auto;
    gap:9px 12px;
    min-height:0;
    padding:14px;
  }
  html body .cis-approval-list .approval-card-row.urgent { padding-left:12px; }
  html body .cis-approval-list .approval-card-cell { display:grid; gap:2px; overflow:visible; white-space:normal; }
  html body .cis-approval-list .approval-card-cell::before {
    color:var(--ink-3);
    content:attr(data-label);
    font:700 8px var(--font);
  }
  html body .cis-approval-list .approval-card-serial { grid-column:1; }
  html body .cis-approval-list .approval-card-process { grid-column:2; text-align:right; }
  html body .cis-approval-list .approval-card-summary { grid-column:1/-1; }
  html body .cis-approval-list .approval-card-ai { grid-column:1/-1; background:var(--ds-surface-muted); padding:10px; border-radius:8px; }
  html body .cis-approval-list .approval-card-owner { grid-column:1; }
  html body .cis-approval-list .approval-card-created { grid-column:2; text-align:right; }
  html body .cis-approval-list .approval-card-node { grid-column:1; }
  html body .cis-approval-list .approval-card-actions { grid-column:2; align-self:end; position:static; padding:0; min-height:0; box-shadow:none; }
  html body .cis-approval-list .request-card-status { grid-column:2; text-align:right; }
  html body .cis-approval-list .request-card-row .approval-card-created { grid-column:1; }
  html body .cis-request-intro { align-items:flex-start; }

}
html body .cis-approval-list .approval-process-tabs { padding:13px 0; gap:14px; }
/* 流程/状态多起来会换行，行距要比字距更宽，否则两行挤成一片。 */
html body .cis-approval-list .list-tabs { display:flex; flex-wrap:wrap; gap:9px 8px; }
html body .cis-approval-list .fchip { border:1px solid var(--ds-line); background:var(--ds-surface); border-radius:24px; padding:7px 11px; color:var(--ds-text-secondary); cursor:pointer; }
html body .cis-approval-list .fchip.on { background:#a8232e; border-color:#a8232e; color:#ffffff; }
html body .cis-approval-list .approval-list-context { display:flex; gap:10px; padding:10px 0; color:var(--ds-text-muted); }
html body .cis-approval-list .approval-card-actions .btn-pri { background:#ae2330; color:#ffffff; border:1px solid #ae2330; }
html body .cis-approval-search { margin-bottom:0; }
html body .cis-approval-search .searchbar { box-sizing:border-box; width:min(460px,100%); }
html body .cis-approval-search .searchbar input { min-width:0; width:100%; }
html body .cis-approval-list .approval-card-cell { overflow-wrap:anywhere; }
@media(max-width:767px) { html body .cis-approval-list .list-tabs { flex-wrap:nowrap; } html body .cis-approval-list .fchip { white-space:nowrap; } html body .cis-approval-list .approval-card-cell::before { font-size:11px; } }
