/* 後台白牌化調整（由 settings.JAZZMIN_SETTINGS["custom_css"] 載入） */

/* ── 品牌色票（與前台 Dashboard/估價器/報價單一致：暖紙白×墨藍×黃銅）── */
:root {
  --lq-ink: #171a2c;
  --lq-paper: #f2f0e9;
  --lq-band: #fbf9f2;
  --lq-card: #fffefb;
  --lq-line: #e5e1d3;
  --lq-brass: #b08a2e;       /* 填色用：主 CTA/選中態 */
  --lq-brass-ink: #8a6a1f;   /* 文字/連結用（對比較足） */
  --lq-brass-dark: #96741f;  /* 填色 hover */
  --lq-brass-tint: #f8f2e0;
  --lq-muted: #6f6b5c;
}

/* 藏 Jazzmin 頁尾（版權列＋「Jazzmin 版本」），避免對客戶露出第三方套件 */
.app-footer { display: none; }

/* 藏 AdminLTE 預設 Logo（登入頁圓圈 A 與側欄小圖）；
   日後若在 JAZZMIN_SETTINGS 設 site_logo 換成自家 Logo，記得移除這條
   （!important：AdminLTE 4 的 .logo-light/.logo-dark 主題切換樣式會蓋過一般規則） */
.login-logo img,
.brand-link .brand-image { display: none !important; }

/* ── 品牌皮膚：大面積表面換暖色調（只動顏色，不動排版/密度）──
   這版 Jazzmin 是 AdminLTE 4 + Bootstrap 5：表面走 --bs-* 變數、
   元件（按鈕/分頁）走各自的元件變數，佈景選擇器是 .app-*。 */
:root, [data-bs-theme="light"] {
  --bs-body-bg: #f2f0e9;          /* 內容背景（暖紙白） */
  --bs-tertiary-bg: #f2f0e9;      /* body 的 bg-body-tertiary */
  --bs-secondary-bg: #fbf9f2;     /* 側欄的 bg-body-secondary（暖象牙） */
  --bs-link-color: #8a6a1f;       /* 連結改墨金（flatly 原為藍綠色，與暖色調相衝） */
  --bs-link-hover-color: #6b5310;
  --bs-link-color-rgb: 138, 106, 31;
  --bs-link-hover-color-rgb: 107, 83, 16;
}

/* 頂欄：暖象牙底＋髮絲線 */
.app-header {
  background-color: var(--lq-band) !important;
  border-bottom: 1px solid var(--lq-line);
}

/* 側欄：淺色暖底、選中黃銅、hover 淡金 */
.app-sidebar {
  background-color: var(--lq-band) !important;
  box-shadow: none !important;
  border-right: 1px solid var(--lq-line);
}
/* Jazzmin 模板把側欄寫死 data-bs-theme="dark"（AdminLTE 深色側欄的淺灰字 #c2c7d0），
   我們的側欄底是淺象牙，字就淡到看不清——把側欄文字變數整組改回深色。
   （#jazzy-sidebar 用 ID 拉高權重，穩贏 adminlte 的 [data-bs-theme=dark] .app-sidebar） */
#jazzy-sidebar {
  --lte-sidebar-color: #3a3f55;                    /* 一般選單字：墨藍調深灰 */
  --lte-sidebar-hover-color: var(--lq-ink);
  --lte-sidebar-active-color: var(--lq-ink);
  --lte-sidebar-hover-bg: var(--lq-brass-tint);
  --lte-sidebar-menu-active-bg: var(--lq-brass);
  --lte-sidebar-menu-active-color: #fffdf5;
  --lte-sidebar-submenu-color: #3a3f55;
  --lte-sidebar-submenu-hover-color: var(--lq-ink);
  --lte-sidebar-submenu-hover-bg: var(--lq-brass-tint);
  --lte-sidebar-submenu-active-color: var(--lq-ink);
  --lte-sidebar-submenu-active-bg: var(--lq-brass-tint);
  --lte-sidebar-header-color: var(--lq-muted);     /* 「進銷存與報價」等分組標題 */
}
.sidebar-brand { border-bottom: 1px solid var(--lq-line); }
.brand-link {
  font-family: "Noto Serif TC", "Songti TC", "PMingLiU", Georgia, serif;
  font-weight: 700; letter-spacing: 1px; color: var(--lq-ink) !important;
}
/* 系統名稱：adminlte 給 .brand-text 的是 80% 強調色（dark 主題＝近白），模板又掛 fw-light
   （font-weight:300 !important）——顏色與字重都要 !important 才蓋得回墨藍粗體 */
.sidebar-brand .brand-text,
.sidebar-brand .brand-text:hover {
  color: var(--lq-ink) !important;
  font-weight: 700 !important;
}
.app-sidebar .sidebar-menu .nav-link.active {
  background-color: var(--lq-brass) !important;
  color: #fffdf5 !important;
  box-shadow: none !important;
}
.app-sidebar .sidebar-menu .nav-link.active i,
.app-sidebar .sidebar-menu .nav-link.active p { color: #fffdf5 !important; }
.app-sidebar .sidebar-menu .nav-link:not(.active):hover {
  background-color: var(--lq-brass-tint) !important;
  color: var(--lq-ink) !important;
}

/* 卡片：髮絲線邊框取代陰影（與前台卡片同款） */
.card {
  --bs-card-bg: var(--lq-card);
  border: 1px solid var(--lq-line);
  box-shadow: none !important;
}
.card-header { background-color: var(--lq-band); border-bottom-color: var(--lq-line); }

/* 主要動作按鈕（儲存/確認/新增）：黃銅色＝與估價器「儲存報價」一致 */
.btn-primary, .btn-success {
  --bs-btn-bg: var(--lq-brass);
  --bs-btn-border-color: var(--lq-brass);
  --bs-btn-color: #fffdf5;
  --bs-btn-hover-bg: var(--lq-brass-dark);
  --bs-btn-hover-border-color: var(--lq-brass-dark);
  --bs-btn-hover-color: #fffdf5;
  --bs-btn-active-bg: var(--lq-brass-dark);
  --bs-btn-active-border-color: var(--lq-brass-dark);
  --bs-btn-active-color: #fffdf5;
  --bs-btn-disabled-bg: var(--lq-brass);
  --bs-btn-disabled-border-color: var(--lq-brass);
  --bs-btn-disabled-color: #fffdf5;
}
/* 次要動作（Excel 匯入/匯出等）：白底髮絲線，hover 泛金 */
.btn-info {
  --bs-btn-bg: #fff;
  --bs-btn-border-color: #d8d3c2;
  --bs-btn-color: var(--lq-ink);
  --bs-btn-hover-bg: var(--lq-brass-tint);
  --bs-btn-hover-border-color: var(--lq-brass);
  --bs-btn-hover-color: var(--lq-ink);
  --bs-btn-active-bg: var(--lq-brass-tint);
  --bs-btn-active-border-color: var(--lq-brass);
  --bs-btn-active-color: var(--lq-ink);
}
.btn-outline-primary {
  --bs-btn-color: var(--lq-brass-dark);
  --bs-btn-border-color: var(--lq-brass);
  --bs-btn-hover-bg: var(--lq-brass);
  --bs-btn-hover-border-color: var(--lq-brass);
  --bs-btn-hover-color: #fffdf5;
  --bs-btn-active-bg: var(--lq-brass);
  --bs-btn-active-border-color: var(--lq-brass);
  --bs-btn-active-color: #fffdf5;
}

/* 分頁器目前頁 */
.pagination {
  --bs-pagination-active-bg: var(--lq-brass);
  --bs-pagination-active-border-color: var(--lq-brass);
}

/* 登入頁 */
.login-page, .register-page { background-color: var(--lq-paper) !important; }
.login-card-body, .register-card-body { border: 1px solid var(--lq-line); }

/* ── 編輯表單視覺（只作用在 change-form，不影響列表/收貨表單）──
   數字/短文字欄不整行拉滿，一眼看得出「這欄只要填一個數字」 */
.change-form input[type="number"] { max-width: 180px; }
.change-form input[type="text"],
.change-form input[type="email"],
.change-form input[type="url"] { max-width: 480px; }
/* 分組卡片標題加深＋左色條，捲動時段落分明 */
.change-form .card > .card-header {
  border-left: 4px solid var(--lq-ink);
  background: var(--lq-band);
  font-weight: 700;
}

/* ── 列表頁「操作指引」卡（admin/catalog/change_list.html）──
   <details> 可收合，收合狀態記在 localStorage；字樣依開合切換 */
.workflow-hint > summary {
  cursor: pointer;
  list-style: none;                 /* 藏瀏覽器預設三角形 */
  border-left: 4px solid var(--lq-brass);
  background: var(--lq-brass-tint);
  font-weight: 700;
}
.workflow-hint > summary::-webkit-details-marker { display: none; }
.workflow-hint > summary .hint-toggle::after { content: "收合 ▴"; font-weight: 400; }
.workflow-hint:not([open]) > summary .hint-toggle::after { content: "展開 ▾"; font-weight: 400; }
.workflow-hint .card-body li { line-height: 1.7; }

/* ── 列表「👉 下一步」欄與狀態圓標：一眼看出每列現在該做哪件事 ──
   （按鈕是 <a> 連到單筆確認頁——changelist 是一個大表單，列內不能再放巢狀 form） */
.next-step-btn {
  display: inline-block;
  padding: 3px 12px;
  border-radius: 6px;
  background: var(--lq-brass);
  color: #fffdf5 !important;
  font-weight: 700;
  white-space: nowrap;
  text-decoration: none;
}
.next-step-btn:hover { background: var(--lq-brass-dark); color: #fffdf5; }
.next-step-btn.outline {
  background: #fff;
  color: var(--lq-brass-ink) !important;
  border: 1px solid var(--lq-brass);
  font-weight: 600;
}
.next-step-btn.outline:hover { background: var(--lq-brass-tint); }
.next-step-hint { color: #6b7280; font-size: 0.9em; white-space: nowrap; }
.next-step-link { font-size: 0.85em; white-space: nowrap; }

/* 狀態圓標（訂單/採購單；報價的狀態欄是可編輯下拉維持原樣）
   —— 語意色（待處理黃/進行中藍/完成綠）刻意保留，不跟品牌色 */
.status-pill {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  font-weight: 600;
  white-space: nowrap;
}
.status-pill.is-pending { background: #fef3c7; color: #92400e; }   /* 待出貨 */
.status-pill.is-shipped { background: #dbeafe; color: #1e40af; }   /* 已出貨 */
.status-pill.is-closed  { background: #e5e7eb; color: #374151; }   /* 已結案 */
.status-pill.is-draft   { background: #fef3c7; color: #92400e; }   /* 草稿   */
.status-pill.is-ordered { background: #dbeafe; color: #1e40af; }   /* 已下單 */
.status-pill.is-received{ background: #dcfce7; color: #166534; }   /* 已收貨 */