/**
 * 导航级「垃圾篓」样式（2026-10-01）。
 *
 * 结构与文案口径：5177 `src/app.js:23961-24241`（`.workbench-trash-*`）；
 * 客户版把类名改成 `trash-*`，观感沿用工作台的卡片/摘要块（颜色一律走令牌）。
 */

.trash-body {
  display: block;
}

.trash-workbench {
  display: block;
}

.trash-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--wb-space-5);
  margin-bottom: var(--wb-space-5);
}

.trash-head .eyebrow {
  margin: 0;
  color: var(--wb-text-secondary);
  font-size: var(--wb-fs-12);
  font-weight: var(--wb-fw-800);
  letter-spacing: var(--wb-tracking-wide);
  text-transform: uppercase;
}

.trash-head h2 {
  margin: var(--wb-space-1) 0 0;
  color: var(--wb-page-ink);
  font-size: var(--wb-fs-20);
}

.trash-message {
  margin: 0 0 var(--wb-space-5);
  padding: var(--wb-space-3) var(--wb-space-5);
  border: 1px solid var(--wb-border);
  border-radius: var(--wb-radius-control);
  background: var(--wb-panel-bg-soft);
  color: var(--wb-text-secondary);
  font-size: var(--wb-fs-13);
}

.trash-message-error {
  border-color: var(--wb-banner-danger-border);
  background: var(--wb-banner-danger-bg);
  color: var(--wb-banner-danger-ink);
}

.trash-totals {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--wb-space-5);
  margin-bottom: var(--wb-space-5);
}

.trash-totals article {
  display: grid;
  gap: var(--wb-space-1);
  padding: var(--wb-space-5);
  border: 1px solid var(--wb-border);
  border-radius: var(--wb-radius-button);
  background: var(--wb-surface);
  box-shadow: var(--wb-shadow-control);
}

.trash-totals strong {
  color: var(--wb-page-ink);
  font-size: var(--wb-fs-18);
}

.trash-totals span {
  color: var(--wb-text-secondary);
  font-size: var(--wb-fs-12);
}

.trash-capacity {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--wb-space-5);
  margin-bottom: var(--wb-space-5);
  padding: var(--wb-space-5);
  border: 1px solid var(--wb-border);
  border-radius: var(--wb-radius-button);
  background: var(--wb-panel-bg-soft);
}

.trash-capacity strong {
  margin-right: var(--wb-space-3);
  color: var(--wb-text-primary);
  font-size: var(--wb-fs-14);
}

.trash-capacity span,
.trash-capacity p {
  color: var(--wb-text-secondary);
  font-size: var(--wb-fs-12);
}

.trash-capacity p {
  margin: 0;
}

/* 容量等级（照 5177 `workbench-trash-capacity--warning/danger`：等级只换令牌，不写死颜色） */
.trash-capacity[data-level="warning"] {
  border-color: var(--wb-banner-warn-border);
  background: var(--wb-banner-warn-bg);
}

.trash-capacity[data-level="warning"] strong {
  color: var(--wb-banner-warn-ink);
}

.trash-capacity[data-level="danger"] {
  border-color: var(--wb-banner-danger-border);
  background: var(--wb-banner-danger-bg);
}

.trash-capacity[data-level="danger"] strong {
  color: var(--wb-banner-danger-ink);
}

/* 彻底删除确认弹窗（APP:24083-24102 的遮罩弹窗；遮罩与弹窗观感沿用模态令牌） */
.trash-confirm-backdrop {
  position: fixed;
  inset: 0;
  z-index: var(--wb-z-modal);
  display: grid;
  place-items: center;
  padding: var(--wb-space-10);
  background: var(--wb-overlay-bg);
}

.trash-confirm {
  display: grid;
  gap: var(--wb-space-5);
  width: min(440px, 100%);
  padding: var(--wb-space-8);
  border: 1px solid var(--wb-modal-border);
  border-radius: var(--wb-radius-panel);
  background: var(--wb-surface);
  box-shadow: var(--wb-shadow-modal);
}

.trash-confirm > strong {
  color: var(--wb-modal-ink);
  font-size: var(--wb-fs-16);
}

.trash-confirm > p {
  margin: 0;
  color: var(--wb-text-secondary);
  font-size: var(--wb-fs-13);
  line-height: var(--wb-font-line-height);
}

.trash-confirm-details {
  display: grid;
  gap: var(--wb-space-3);
  margin: 0;
}

.trash-confirm-details > div {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: var(--wb-space-4);
}

.trash-confirm-details dt {
  color: var(--wb-text-secondary);
  font-size: var(--wb-fs-12);
}

.trash-confirm-details dd {
  margin: 0;
  color: var(--wb-text-primary);
  font-size: var(--wb-fs-13);
  overflow-wrap: anywhere;
}

.trash-confirm-actions {
  display: flex;
  justify-content: flex-end;
  gap: var(--wb-space-4);
}

.trash-entry-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--wb-space-5);
  margin-bottom: var(--wb-space-5);
  padding: var(--wb-space-5);
  border: 1px solid var(--wb-border);
  border-radius: var(--wb-radius-button);
  background: var(--wb-surface);
  box-shadow: var(--wb-shadow-control);
}

.trash-entry-card h3 {
  margin: 0 0 var(--wb-space-1);
  color: var(--wb-text-primary);
  font-size: var(--wb-fs-14);
}

.trash-entry-card p {
  margin: 0;
  color: var(--wb-text-secondary);
  font-size: var(--wb-fs-12);
}

.trash-deleted-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--wb-space-5);
  margin-bottom: var(--wb-space-4);
}

.trash-deleted-head h3 {
  margin: 0 0 var(--wb-space-1);
  color: var(--wb-text-primary);
  font-size: var(--wb-fs-14);
}

.trash-deleted-head p {
  margin: 0;
  color: var(--wb-text-secondary);
  font-size: var(--wb-fs-12);
}

.trash-deleted-head > strong {
  color: var(--wb-text-secondary);
  font-size: var(--wb-fs-16);
}

.trash-record-group {
  margin: var(--wb-space-4) 0 var(--wb-space-3);
  color: var(--wb-text-secondary);
  font-size: var(--wb-fs-12);
  font-weight: var(--wb-fw-800);
}

.trash-record-item {
  display: flex;
  align-items: center;
  gap: var(--wb-space-5);
  padding: var(--wb-space-4) var(--wb-space-5);
  border: 1px solid var(--wb-border);
  border-radius: var(--wb-radius-button);
  background: var(--wb-surface);
  margin-bottom: var(--wb-space-3);
}

.trash-file-type {
  flex: 0 0 auto;
  padding: var(--wb-space-1) var(--wb-space-3);
  border: 1px solid var(--wb-pill-neutral-border);
  border-radius: var(--wb-radius-pill);
  background: var(--wb-pill-neutral-bg);
  color: var(--wb-pill-neutral-ink);
  font-size: var(--wb-fs-11);
}

.trash-record-main {
  display: grid;
  flex: 1 1 auto;
  gap: var(--wb-space-1);
  min-width: 0;
}

.trash-record-main strong {
  color: var(--wb-text-primary);
  font-size: var(--wb-fs-13);
  overflow-wrap: anywhere;
}

.trash-record-main span,
.trash-record-main small {
  color: var(--wb-text-secondary);
  font-size: var(--wb-fs-12);
  overflow-wrap: anywhere;
}

.trash-record-actions {
  display: flex;
  flex: 0 0 auto;
  gap: var(--wb-space-3);
}

.trash-deleted-empty {
  margin: 0;
  padding: var(--wb-space-7);
  border: 1px dashed var(--wb-empty-border);
  border-radius: var(--wb-radius-button);
  background: var(--wb-empty-bg);
  color: var(--wb-empty-ink);
  font-size: var(--wb-fs-13);
  text-align: center;
}

@media (max-width: 920px) {
  .trash-totals {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
