/*
 * [INPUT]: 依赖 base.css 的颜色、字体、按钮与工具面板基础令牌
 * [OUTPUT]: 提供批量设置、处理队列、检测摘要、多下载动作与动态报告状态样式
 * [POS]: css 模块的业务状态表现层，承载五格式批量清理闭环的视觉反馈
 * [PROTOCOL]: 变更时更新此头部，然后检查 AGENTS.md
 */

.cleaner-workbench {
  margin-top: 12px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.035);
}

.cleaner-workbench[hidden] {
  display: none;
}

.dropzone[hidden] {
  display: none;
}

.process-status {
  display: grid;
  gap: 5px;
  padding: 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.process-code {
  color: var(--signal);
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.08em;
}

.process-status strong {
  color: var(--paper-bright);
  font-size: 13px;
}

.process-status > span:last-child {
  color: rgba(255, 255, 255, 0.5);
  font-size: 10px;
  line-height: 1.5;
}

.batch-settings {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.12);
}

.batch-settings > label {
  display: grid;
  gap: 12px;
  padding: 15px;
  background: var(--ink);
}

.batch-settings label > span:first-child {
  display: flex;
  justify-content: space-between;
  color: rgba(255, 255, 255, 0.62);
  font-family: var(--mono);
  font-size: 8px;
  letter-spacing: 0.06em;
}

.batch-settings output {
  color: var(--signal);
}

.batch-settings input[type="range"] {
  width: 100%;
  accent-color: var(--signal);
}

.batch-settings .fingerprint-option {
  display: flex;
  cursor: pointer;
  grid-template-columns: auto 1fr;
  align-items: flex-start;
}

.fingerprint-option input {
  margin: 2px 0 0;
  accent-color: var(--signal);
}

.fingerprint-option > span {
  display: grid !important;
  gap: 3px;
  justify-content: initial !important;
  letter-spacing: 0 !important;
}

.fingerprint-option strong {
  color: var(--paper-bright);
  font-family: var(--sans);
  font-size: 10px;
}

.fingerprint-option small {
  color: rgba(255, 255, 255, 0.42);
  font-family: var(--sans);
  font-size: 9px;
  line-height: 1.4;
}

.batch-settings > p {
  grid-column: 1 / -1;
  margin: 0;
  padding: 10px 15px;
  background: var(--ink);
  color: rgba(255, 255, 255, 0.4);
  font-family: var(--mono);
  font-size: 8px;
}

.cleaner-workbench[data-phase="error"] .process-code {
  color: var(--warning);
}

.process-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  padding: 12px;
}

.process-actions .button {
  width: 100%;
  min-height: 46px;
  cursor: pointer;
  justify-content: space-between;
  border: 0;
  font-family: inherit;
  font-size: 11px;
}

.process-actions .button:disabled {
  cursor: wait;
  opacity: 0.55;
}

.process-actions .button[hidden] {
  display: none;
}

.download-file {
  border: 1px solid var(--signal) !important;
  background: transparent;
  color: var(--signal);
}

.download-file[hidden] {
  display: none;
}

.report-download {
  border: 1px solid rgba(255, 255, 255, 0.22) !important;
  background: transparent;
  color: var(--paper-bright);
}

.report-download[hidden] {
  display: none;
}

.scan-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.12);
}

.scan-summary[hidden] {
  display: none;
}

.scan-summary span {
  padding: 9px 11px;
  background: var(--ink);
  font-family: var(--mono);
  font-size: 8px;
  line-height: 1.35;
}

.scan-summary .is-found {
  color: #ff9380;
}

.scan-summary .is-clear {
  color: rgba(255, 255, 255, 0.42);
}

.batch-queue {
  display: grid;
  gap: 1px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.12);
}

.batch-queue[hidden] {
  display: none;
}

.batch-item {
  display: grid;
  min-width: 0;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 11px 12px;
  background: var(--ink);
  box-shadow: inset 2px 0 0 transparent;
}

.batch-item.is-selected {
  box-shadow: inset 2px 0 0 var(--signal);
}

.batch-item[data-state="error"] {
  box-shadow: inset 2px 0 0 var(--warning);
}

.batch-item-index,
.batch-item-status {
  color: rgba(255, 255, 255, 0.38);
  font-family: var(--mono);
  font-size: 8px;
}

.batch-item[data-state="verified"] .batch-item-status {
  color: var(--signal);
}

.batch-item[data-state="error"] .batch-item-status {
  color: #ff9380;
}

.batch-item-copy {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.batch-item-copy strong,
.batch-item-copy span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.batch-item-copy strong {
  color: var(--paper-bright);
  font-size: 10px;
}

.batch-item-copy span {
  color: rgba(255, 255, 255, 0.42);
  font-family: var(--mono);
  font-size: 8px;
}

.batch-item-actions {
  display: flex;
  grid-column: 2 / -1;
  gap: 6px;
}

.batch-item-actions button {
  cursor: pointer;
  padding: 5px 7px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: transparent;
  color: rgba(255, 255, 255, 0.58);
  font-family: var(--mono);
  font-size: 7px;
}

.batch-item-actions button:hover {
  border-color: var(--signal);
  color: var(--signal);
}

.file-thumbnail.is-unavailable {
  display: grid;
  place-items: center;
}

.file-thumbnail.is-unavailable::after {
  content: "HEIC";
  color: var(--signal);
  font-family: var(--mono);
  font-size: 9px;
}

.report-column dl div[data-state="found"] dd,
.report-column dl div[data-state="residual"] dd {
  color: #a23324;
}

.report-column dl div[data-state="clean"] dd {
  color: #3d7308;
}

.report-column dd {
  overflow-wrap: anywhere;
}

@media (max-width: 520px) {
  .scan-summary {
    grid-template-columns: 1fr;
  }

  .process-status {
    padding: 14px;
  }

  .batch-settings {
    grid-template-columns: 1fr;
  }

  .batch-settings > p {
    grid-column: 1;
  }
}
