/* 大量上傳頁（bulk.html）另外用到的樣式；顏色、按鈕、面板等共用元件在 style.css */

.notice-text { border: 1px solid var(--warn); background: var(--relative-bg); border-radius: 8px; padding: 10px 14px; font-size: 14px; }

.scan-summary { margin-top: 14px; display: grid; gap: 4px; }
.scan-summary .big { font-size: 16px; font-weight: 600; }
.scan-summary .buttons { justify-content: flex-start; margin: 6px 0 0; }
.skipped-list { margin: 6px 0 0; padding-left: 20px; font-size: 13px; color: var(--muted); max-height: 220px; overflow: auto; }

.date-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.date-row input { flex: 1 1 160px; }

.advanced { margin-top: 14px; }
.advanced summary { cursor: pointer; color: var(--accent); font-size: 14px; }
.advanced input { width: 100%; }
.buttons.left { justify-content: flex-start; }

.upload-progress { margin-top: 18px; border-top: 1px solid var(--border); padding-top: 14px; display: grid; gap: 8px; }
.upload-job { margin: 0; font-weight: 600; }

.bar-row { display: grid; grid-template-columns: 4.5em minmax(0, 1fr) auto; gap: 12px; align-items: center; font-size: 14px; }
.bar-row .progress { margin: 0; }
.bar-row .num { font-variant-numeric: tabular-nums; color: var(--muted); min-width: 12em; text-align: right; }
.progress-bar.done { background: var(--pass); }

.run-status { margin: 4px 0 0; font-weight: 600; }
.run-status.warn { color: var(--warn); }
.run-status.error { color: var(--reject); }

.jobs { display: grid; gap: 12px; margin-top: 12px; }
.job { border: 1px solid var(--border); border-left: 5px solid var(--manual); border-radius: 8px; padding: 12px 14px; display: grid; gap: 6px; }
.job.processing { border-left-color: var(--relative); }
.job.done { border-left-color: var(--pass); }
.job .hint, .job p { margin: 0; }
.job-head { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.job-name { font-weight: 600; word-break: break-all; }
.badge.job-uploading { background: var(--manual-bg); color: var(--manual); }
.badge.job-processing { background: var(--relative-bg); color: var(--relative); }
.badge.job-done { background: var(--pass-bg); color: var(--pass); }
.job-counts { list-style: none; margin: 0; padding: 0; display: flex; gap: 6px 16px; flex-wrap: wrap; font-size: 14px; color: var(--muted); }
.job-counts strong { font-variant-numeric: tabular-nums; }
.job-counts .pass strong { color: var(--pass); }
.job-counts .reject strong { color: var(--reject); }
.job-counts .relative_date strong { color: var(--relative); }
.job-counts .manual strong { color: var(--manual); }
.job-counts .failed strong { color: var(--warn); }
.job-note { font-size: 14px; }
.job .buttons { margin: 4px 0 0; }

.log-box { font-size: 13px; }
.log-box summary { cursor: pointer; color: var(--accent); }
.log-box ol { margin: 6px 0 0; padding-left: 22px; max-height: 260px; overflow: auto; color: var(--muted); }

@media (max-width: 720px) {
  .bar-row { grid-template-columns: 4em minmax(0, 1fr); }
  .bar-row .num { grid-column: 1 / -1; text-align: left; min-width: 0; }
}