/* admin_scan 组（admin/scan / admin/scan-new / admin/scan-job）專屬樣式。
 * 全部用 app.css 的 token；class 用 asc- 前綴。兼容 iOS Safari 14：不用 inset / flex gap / aspect-ratio / :is() / dvh / color-mix。
 */

/* 文件選擇框：真實存在（e2e 用 uploadFile）、可聚焦，但視覺上藏在「選擇文件」按鈕里 */
.asc-file-input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  margin: 0;
  padding: 0;
  border: 0;
}

/* 頂部主按鈕一行 */
.asc-top {
  display: flex;
  align-items: center;
  margin: var(--sp-3) var(--gutter) 0;
}
.asc-top > .btn {
  flex: 1 1 auto;
}

/* 說明一行 */
.asc-intro {
  margin: var(--sp-2) var(--gutter) 0;
  color: var(--label-2);
}

/* 篩選 / 分區 chips：橫向滾動（不用 flex gap，iOS 14） */
.asc-chips {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin: var(--sp-3) 0 0;
  padding: 0 var(--gutter);
}
.asc-chip {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  min-height: var(--tap);
  margin-right: var(--sp-2);
  padding: 0 var(--sp-3);
  border-radius: var(--radius-pill);
  border: 1px solid var(--separator);
  background: var(--bg-elevated);
  color: var(--label);
  font-size: 13px;
  line-height: 1.2;
}
.asc-chip.is-selected {
  background: var(--tint-soft);
  border-color: var(--tint);
  color: var(--tint);
  font-weight: 600;
}
.asc-chip__n {
  margin-left: var(--sp-1);
  font-size: 12px;
  color: var(--label-3);
}
.asc-chip.is-selected .asc-chip__n {
  color: var(--tint);
}

/* 作業卡片 */
.asc-card {
  position: relative;
  margin: var(--sp-3) var(--gutter) 0;
  padding: var(--sp-3);
  border-radius: var(--radius);
  background: var(--bg-elevated);
  border: 1px solid var(--separator);
}
.asc-card.is-pressable:active {
  background: var(--fill);
}
.asc-card__head {
  display: flex;
  align-items: center;
}
.asc-card__name {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 16px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.asc-card__meta {
  margin-top: var(--sp-1);
  font-size: 13px;
  color: var(--label-2);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.asc-card__del {
  position: absolute;
  top: var(--sp-2);
  right: var(--sp-2);
}

/* 進度條（列表 / 上傳 / 識別共用） */
.asc-prog {
  position: relative;
  height: 6px;
  border-radius: 3px;
  background: var(--fill);
  overflow: hidden;
}
.asc-prog__fill {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 0;
  border-radius: 3px;
  background: var(--tint);
  transition: width var(--dur-normal, 0.2s) var(--ease-out, ease-out);
}
.asc-prog--thin {
  height: 4px;
}
.asc-prog-row {
  display: flex;
  align-items: center;
  margin-top: var(--sp-2);
}
.asc-prog-row .asc-prog {
  flex: 1 1 auto;
}
.asc-prog__pct {
  flex: 0 0 auto;
  margin-left: var(--sp-2);
  font-size: 12px;
  color: var(--label-2);
}
.asc-prog__label {
  margin-top: var(--sp-1);
  font-size: 12px;
  color: var(--label-2);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 新建頁：文件行 */
.asc-file {
  display: flex;
  align-items: center;
  padding: var(--sp-3) var(--gutter);
  border-bottom: 1px solid var(--hairline);
}
.asc-file__main {
  flex: 1 1 auto;
  min-width: 0;
}
.asc-file__name {
  font-size: 15px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.asc-file__sub {
  margin-top: 2px;
  font-size: 12px;
  color: var(--label-2);
}
.asc-file__sub .c-red {
  font-size: 12px;
}
.asc-file--bad .asc-file__name {
  color: var(--red-ink);
}
.asc-hint {
  margin: var(--sp-2) var(--gutter) 0;
  font-size: 12px;
  color: var(--label-3);
}
.asc-upview {
  margin: var(--sp-3) var(--gutter) 0;
  padding: var(--sp-3);
  border-radius: var(--radius);
  background: var(--bg-elevated);
  border: 1px solid var(--separator);
}
.asc-upview__title {
  font-size: 14px;
  font-weight: 600;
}

/* 詳情：識別中大卡 */
.asc-stage {
  margin: var(--sp-3) var(--gutter) 0;
  padding: var(--sp-4) var(--sp-3);
  border-radius: var(--radius);
  background: var(--bg-elevated);
  border: 1px solid var(--separator);
  text-align: center;
}
.asc-stage__stage {
  font-size: 17px;
  font-weight: 600;
}
.asc-stage__msg {
  margin-top: var(--sp-2);
  font-size: 13px;
  color: var(--label-2);
}
.asc-stage .asc-prog {
  margin-top: var(--sp-3);
}
.asc-stage__time {
  margin-top: var(--sp-2);
  font-size: 12px;
  color: var(--label-3);
}

/* 詳情：文件列表行 */
.asc-jfile {
  padding: var(--sp-3) var(--gutter);
  border-bottom: 1px solid var(--hairline);
}
.asc-jfile:last-child {
  border-bottom: 0;
}
.asc-jfile__head {
  display: flex;
  align-items: center;
}
.asc-jfile__name {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 15px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 預覽：摘要卡 */
.asc-sum {
  margin: var(--sp-3) var(--gutter) 0;
  padding: var(--sp-3);
  border-radius: var(--radius);
  background: var(--bg-elevated);
  border: 1px solid var(--separator);
}
.asc-sum__line {
  font-size: 14px;
}
.asc-sum__regions {
  display: flex;
  flex-wrap: wrap;
  margin-top: var(--sp-2);
}
.asc-sum__region {
  margin: var(--sp-1) var(--sp-2) 0 0;
  font-size: 13px;
  color: var(--label-2);
}
.asc-sum__region .num {
  font-weight: 600;
  color: var(--label);
}
.asc-sum__extra {
  margin-top: var(--sp-2);
  font-size: 13px;
  color: var(--label-2);
}
.asc-sum__warn {
  margin-top: var(--sp-2);
  padding-top: var(--sp-2);
  border-top: 1px solid var(--hairline);
  font-size: 12px;
  color: var(--orange-ink);
}
.asc-sum__toggle {
  margin-top: var(--sp-2);
}

/* 需核對計數按鈕 */
.asc-needbtn {
  margin: var(--sp-2) var(--gutter) 0;
  width: calc(100% - var(--gutter) * 2);
}

/* 行卡片 */
.asc-rows {
  margin: var(--sp-2) 0 0;
}
.asc-row {
  position: relative;
  margin: var(--sp-2) var(--gutter) 0;
  border-radius: var(--radius);
  background: var(--bg-elevated);
  border: 1px solid var(--separator);
  overflow: hidden;
}
.asc-row.is-review {
  border-left: 3px solid var(--orange);
}
.asc-row.is-dropped {
  opacity: 0.72;
}
.asc-row__main {
  display: block;
  width: 100%;
  text-align: left;
  background: none;
  border: 0;
  padding: var(--sp-3);
  font: inherit;
  color: inherit;
}
.asc-row__top {
  display: flex;
  align-items: center;
}
.asc-rank {
  flex: 0 0 auto;
  min-width: 30px;
  height: 24px;
  line-height: 24px;
  padding: 0 6px;
  border-radius: 12px;
  background: var(--fill);
  color: var(--label);
  font-size: 13px;
  font-weight: 600;
  text-align: center;
}
.asc-row__name {
  flex: 1 1 auto;
  min-width: 0;
  margin-left: var(--sp-2);
  font-size: 15px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.asc-row__award {
  flex: 0 0 auto;
  margin-left: var(--sp-2);
  font-size: 13px;
  color: var(--label-2);
  text-align: right;
  max-width: 40%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.asc-row__title {
  margin-top: var(--sp-1);
  font-size: 13px;
  color: var(--label-2);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.asc-row.is-open .asc-row__title {
  -webkit-line-clamp: 99;
}
.asc-row__meta {
  margin-top: var(--sp-1);
  font-size: 12px;
  color: var(--label-3);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.asc-row__tags {
  display: flex;
  flex-wrap: wrap;
  margin-top: var(--sp-1);
}
.asc-row__tags .tag {
  margin: var(--sp-1) var(--sp-1) 0 0;
}
.asc-row__reasons {
  margin-top: var(--sp-1);
  font-size: 12px;
  color: var(--orange-ink);
}
.asc-row__total {
  font-size: 13px;
  color: var(--label);
}
.asc-detail {
  padding: 0 var(--sp-3) var(--sp-3);
  border-top: 1px solid var(--hairline);
}
.asc-detail__full {
  padding-top: var(--sp-2);
  font-size: 13px;
  color: var(--label-2);
}
.asc-detail__btns {
  display: flex;
  flex-wrap: wrap;
  padding-top: var(--sp-2);
}
.asc-detail__btns .btn {
  margin: 0 var(--sp-2) var(--sp-2) 0;
}
.asc-detail .asc-prog {
  margin-top: var(--sp-2);
}
.asc-cand {
  display: block;
  width: 100%;
  text-align: left;
  margin-top: var(--sp-2);
}
.asc-flash {
  animation: asc-flash 600ms var(--ease-out, ease-out);
}
@keyframes asc-flash {
  0% {
    background: var(--orange-soft, var(--fill));
  }
  100% {
    background: var(--bg-elevated);
  }
}
@media (prefers-reduced-motion: reduce) {
  .asc-flash {
    animation: none;
  }
  .asc-prog__fill {
    transition: none;
  }
}

/* 看原圖彈層：圖 + 百分比高亮框 */
.asc-imgscroll {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.asc-imgbox {
  position: relative;
  width: max(100%, 640px);
  font-size: 0;
}
.asc-imgbox img {
  width: 100%;
  height: auto;
}
.asc-hl {
  position: absolute;
  border: 2px solid var(--orange);
  background: transparent;
  border-radius: 2px;
}
.asc-imgerr {
  padding: var(--sp-4) var(--sp-3);
  text-align: center;
  font-size: 14px;
  color: var(--label-2);
}

/* 表單彈層里的字段 */
.asc-sheet-field {
  padding: var(--sp-2) 0;
}
.asc-medals {
  display: flex;
  flex-wrap: wrap;
  padding-top: var(--sp-1);
}
.asc-medals .btn {
  margin: 0 var(--sp-2) var(--sp-2) 0;
}

/* 交接彈層：分區行 */
.asc-map {
  padding: var(--sp-3) 0;
  border-bottom: 1px solid var(--hairline);
}
.asc-map__head {
  display: flex;
  align-items: center;
}
.asc-map__title {
  flex: 1 1 auto;
  min-width: 0;
  margin-left: var(--sp-2);
  font-size: 15px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.asc-map__err {
  margin-top: var(--sp-1);
  font-size: 12px;
  color: var(--red-ink);
}
.asc-map__exh {
  margin-top: var(--sp-2);
}

/* 交接結果 */
.asc-hb-item {
  padding: var(--sp-3) 0;
  border-bottom: 1px solid var(--hairline);
}
.asc-hb-item:last-child {
  border-bottom: 0;
}
.asc-hb__head {
  display: flex;
  align-items: center;
}
.asc-hb__title {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 15px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.asc-hb__meta {
  margin-top: var(--sp-1);
  font-size: 13px;
  color: var(--label-2);
}
.asc-hb__skip {
  margin-top: var(--sp-1);
  font-size: 12px;
  color: var(--orange-ink);
}

/* 導出彈層 */
.asc-exp-scope {
  padding: var(--sp-2) 0 var(--sp-1);
}
