/* harc 全站樣式：色票與表單可讀性。由 base.html 一次載入，所有頁面共用。 */

:root {
  /* 品牌色票：表頭與視窗標題列共用，字面色碼全站只留這一處 */
  --harc-thead-bg: #123B6D;
  --harc-thead-edge: #0B294D;
  --harc-border: #E3E8EF;
}

/* ── 表單可讀性 ──────────────────────────────────────────────
   Bootstrap 預設的輸入值（--bs-body-color）與 placeholder（--bs-secondary-color）
   灰階太接近，欄位裡到底是「現有資料」還是「範例文字」分不出來。
   建檔頁的 autofill 會把預設值直接寫進欄位，混淆最嚴重。
   解法：實際值加深加粗、範例文字改淡並斜體，兩者刻意拉開對比。
   規則不綁任何頁面，故建檔 / 地點管理 / 掃碼 / 清冊搜尋框一體適用。 */
.form-control,
.form-select {
  color: #16233A;
  font-weight: 600;
}

.form-control::placeholder {
  color: #BFC7D2;
  font-weight: 400;
  font-style: italic;
}

/* 唯讀欄位：看得出是「系統給的、不能改」而不是「還沒填」 */
.form-control[readonly] {
  background: #EEF2F7;
  color: var(--harc-thead-bg);
}

/* 盤點頁表格：固定 px 欄寬（table-layout:fixed + 固定總寬），欄寬以 <col> 指定。 */
.tbl-fixed {
  table-layout: fixed;
  font-size: 14px;
  margin-bottom: 0;
}
.tbl-fixed th {
  background: #EEEFEE;
  color: #0D6EFD;
  text-align: center;
}
.tbl-fixed td {
  overflow-wrap: anywhere;
}

/* 條碼掃描畫面與 toast 區（掃碼盤點頁、標籤張貼頁共用） */
/* 手機直拿時相機給直式畫面；固定 16:9 橫框裁中間（ZXing 也只解中央橫帶），紅線提示條碼橫放對準 */
.scan-frame { position: relative; }
.scan-frame::after {
  content: ""; position: absolute; left: 8%; right: 8%; top: 50%;
  border-top: 2px solid rgba(220, 53, 69, .85); pointer-events: none;
}
.scan-video {
  display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover;
  background: #000; border-radius: 8px;
}
.toast-area { z-index: 1080; }