/*〔存查 s0000〕*/

/* ---------- §1 Design Tokens（來源：賣賣 App AppColors，亮色） ---------- */
:root {
  /* 品牌主色（兩模式相同；App: AppColors.primary / textOnPrimary） */
  --primary: 49.4 100% 50%;              /* #FFD200 品牌金黃 */
  --primary-foreground: 0 0% 10.2%;      /* #1A1A1A 黃底恆黑字 */
  --primary-light: 50.9 100% 60%;        /* #FFE033 hover */
  --primary-dark: 49.3 100% 45.1%;       /* #E6BD00 active */

  /* 中性（App: background / surface / surfaceVariant / textPrimary…） */
  /*〔存查 s0001〕*/
  /*〔存查 s0002〕*/
  --background: 0 0% 98%;               /*〔存查 s0003〕*/
  --foreground: 0 0% 0%;                 /*〔存查 s0004〕*/
  --card: 0 0% 100%;                     /* #FFFFFF */
  --card-foreground: 0 0% 0%;            /* #000000 ← oklch(0% 0 0)（原 240 10% 3.9%） */
  --popover: 0 0% 100%;
  --popover-foreground: 0 0% 0%;         /* #000000 ← oklch(0% 0 0)（原 240 10% 3.9%） */
  --secondary: 0 0% 96.1%;               /* #F5F5F5 ← oklch(0.97 0 0)（原 240 4.8% 95.9% #F4F4F5 zinc-100） */
  --secondary-foreground: 0 0% 9%;       /* #171717 ← oklch(0.205 0 0)（原 240 10% 3.9%） */
  --muted: 0 0% 96.1%;                   /* #F5F5F5 ← oklch(0.97 0 0)（原 240 4.8% 95.9%） */
  /*〔存查 s0005〕*/
  /*〔存查 s0006〕*/
  --muted-foreground: 0 0% 45.1%;        /* #737373 neutral-500 ← oklch(0.556 0 0)（原 240 3.8% 46.1% #71717A zinc-500） */
  --accent: 0 0% 96.1%;                  /* #F5F5F5 ← oklch(0.97 0 0)（原 240 4.8% 95.9%） */
  --accent-foreground: 0 0% 9%;          /* #171717 ← oklch(0.205 0 0)（原 240 10% 3.9%） */
  --border: 0 0% 89.8%;                  /* #E5E5E5 neutral-200 ← oklch(0.922 0 0)（原 240 5.9% 90% #E4E4E7 zinc-200） */
  --input: 0 0% 89.8%;                   /* #E5E5E5 ← oklch(0.922 0 0)（原 240 5.9% 90%） */
  /*〔存查 s0007〕*/
  --ring: 0 0% 63.1%;                    /* #A1A1A1 ← oklch(0.708 0 0)（原 240 10% 3.9% 近黑） */
  --hint: 0 0% 63.1%;                    /* #A1A1A1 佔位符 ← §S-74 achromatic（原 240 5% 64.9% #A1A1AA zinc-400；L 64.9%→官方階 63.1%，色差 9/255）。與 --ring 亮色同階 */

  /* 一般主要動作＝zinc 近黑（黃鈕只留給「新增 / 儲存」） */
  --dark: 0 0% 9%;                       /* #171717 ← §S-74 achromatic（原 240 5.9% 10% #18181B zinc-900；官方階 9%＝oklch(0.205)，色差 4/255）。上行「zinc 近黑」的語意不變，只是灰不再帶藍 */
  --dark-foreground: 0 0% 98%;
  /*〔存查 s0008〕*/
  /* 固定深色面板（兩模式皆深底白字；App: AppColors.darkPanel） */
  /*〔存查 s0009〕*/
  --dark-panel: 0 0% 9%;                 /* #171717 ← §S-74 achromatic（原 240 5.9% 10% #18181B，色差 4/255） */
  --dark-panel-foreground: 0 0% 98%;     /* 原本就是 achromatic，§S-74 未動 */

  /* 狀態色（兩模式相同；App 同名值） */
  /*〔存查 s0010〕*/
  --destructive: 357.1 100% 45.3%;       /* #E7000B ← oklch(0.577 0.245 27.325)（溢 sRGB 色域，已裁切）；原 0 84.2% 60.2% #EF4444。已被 §S-39（亮）覆蓋，見上 */
  --destructive-foreground: 0 0% 100%;
  --success: 142.1 70.6% 45.3%;          /* #22C55E */
  --success-foreground: 0 0% 100%;
  --info: 217.2 91.2% 59.8%;             /* #3B82F6 */
  --info-foreground: 0 0% 100%;
  --warning: 37.7 92.1% 50.2%;           /* #F59E0B amber，與 primary 黃區隔 */
  --warning-foreground: 0 0% 10.2%;
  /* 柔和語意底（狀態 pill / alert 用，禁止 view 再寫死 hex） */
  --success-bg: 142 60% 94%;
  --success-fg: 142 65% 28%;
  --warning-bg: 38 92% 94%;
  --warning-fg: 32 81% 33%;
  /*〔存查 s0011〕*/
  --destructive-fg: 0 74% 42%;           /* #BA1B1B 紅字專用，勿當底色 */

  /* 請假 / 加班 / 打卡語意色（來源：App AppColors 同名） */
  --leave-annual: 258 90% 66%;           /* #8B5CF6 */
  --leave-sick: 330 81% 60%;             /* #EC4899 */
  --leave-personal: 189 94% 43%;         /* #06B6D4 */
  --early-leave: 25 95% 53%;             /* #F97316 */

  /* 圖表調色盤（低飽和可區分；canvas 不吃 CSS 變數，必須經 fatboyToken() 解析） */
  /*〔存查 s0012〕*/
  --chart-1: 49 100% 50%;                /* 已被 §S-12 覆蓋 */
  /* §S-74：--chart-2 與 --dark 同值（zinc-900），圖表的近黑長條會與旁邊的
     btn-dark 並排出現，一藍一中性就露餡。
     它另有第二處宣告（html.dark，見 §S-12 (b) 區塊），兩處同步。 */
  --chart-2: 0 0% 9%;                    /* #171717 ← §S-74 achromatic（原 240 5.9% 10% #18181B，色差 4/255） */
  --chart-3: 220 9% 46%;
  --chart-4: 215 16% 65%;
  --chart-5: 200 18% 46%;
  --chart-6: 173 25% 42%;
  --chart-7: 12 40% 58%;
  --chart-8: 262 25% 58%;

  --radius: 0.625rem;                    /* 10px，對齊 App ShadThemeData.radius */

  /*〔存查 s0013〕*/
  /*〔存查 s0014〕*/
  --radius-sm: calc(var(--radius) * 0.6);   /* 6px  —— DropdownMenuItem、code、kbd */
  --radius-md: calc(var(--radius) * 0.8);   /* 8px  —— Button 全系列、Input、Badge、Popover、縮圖 */
  /*〔存查 s0015〕*/
  --radius-lg: var(--radius);               /* 10px —— DialogContent（Modal） */
  --radius-xl: calc(var(--radius) * 1.4);   /* 14px —— Card */

  /* 超連結＝前景色 + 底線（shadcn 做法，不用藍色） */
  --link: var(--foreground);
  --link-hover: var(--foreground);

  /* 側欄（shadcn 官方 sidebar＝亮色淺底深字。深色側欄會被判定成「沒套 shadcn」） */
  /* §S-74：側欄整組 achromatic。規則是「保 L、H/S 歸零，能對上官方階就對上」，
     但**有兩顆刻意不吸到官方階**，理由寫在各自那行 —— 吸過去會改到功能，不是去色相。 */
  --sidebar-bg: 0 0% 98%;                /* 原本就是 achromatic，§S-74 未動（＝官方 --sidebar oklch(0.985)） */
  --sidebar-fg: 0 0% 34%;                /* #575757 ← §S-74 保 L 去色相（原 240 5% 34% #52525B zinc-600，色差 5/255）。
                                            不吸官方階：最近的是 25.1%，差 8.9pp＝23/255，會把側欄文字整體壓黑一階，
                                              且與 --sidebar-fg-strong(9%) 的三階層次被壓掉約三成。對比 7.41→6.92，仍遠高於 AA。 */
  --sidebar-fg-strong: 0 0% 9%;          /* #171717 ← §S-74 achromatic（原 240 6% 10% #18181B，官方階 9%，色差 4/255） */
  --sidebar-border: 0 0% 89.8%;          /* #E5E5E5 ← §S-74 achromatic（原 240 6% 90% #E4E4E7，官方階 89.8%＝--border，色差 2/255） */
  --sidebar-accent: 0 0% 94%;            /*〔存查 s0016〕*/
  --sidebar-active-bg: 0 0% 89.8%;       /* #E5E5E5 ← §S-74 achromatic（原 240 5% 90% #E4E4E7，官方階 89.8%，色差 2/255） */

  /* ---- Color Admin 專有變數補位 ----
     view 的 inline style 直接引用這三個（共 10 處：Chat/index、AiTool/*、Ai/*），
     拔掉 app.min.css 後會變 undefined → 不報錯但靜默失效（分隔線消失、卡片透明）。 */
  --bs-component-bg: hsl(var(--card));
  --bs-component-bg-rgb: 255, 255, 255;
  --bs-component-border-color: hsl(var(--border));

  /* Color Admin 主題色 remap → pace 載入條 / active / accent 全部跟著品牌黃 */
  --bs-app-theme: hsl(var(--primary));
  --bs-app-theme-rgb: 255, 210, 0;
  --bs-app-theme-color: hsl(var(--primary-foreground));

  /* ---- Bootstrap 全域變數 remap 到 shadcn token ---- */
  --bs-body-bg: hsl(var(--background));
  --bs-body-color: hsl(var(--foreground));
  --bs-border-color: hsl(var(--border));
  --bs-border-radius: var(--radius);
  --bs-border-radius-sm: var(--radius-sm);
  --bs-border-radius-lg: var(--radius-xl);
  --bs-link-color: hsl(var(--link));
  --bs-link-hover-color: hsl(var(--link-hover));
  /* BS5.3 的 a 實際吃 rgba(var(--bs-link-color-rgb),…)，rgb 版必須一起蓋 */
  --bs-link-color-rgb: 9, 9, 11;
  --bs-link-hover-color-rgb: 9, 9, 11;
  --bs-emphasis-color: hsl(var(--foreground));
  --bs-secondary-color: hsl(var(--muted-foreground));
  --bs-tertiary-bg: hsl(var(--muted));
}

/* ---------- §1b 暗色模式（App: AppColors._dark = true 那一組） ---------- */
html.dark {
  --background: 0 0% 3.9%;               /* #0A0A0A ← oklch(0.145 0 0)（原 240 10% 3.9% #09090B zinc-950） */
  --foreground: 0 0% 98%;                /* #FAFAFA */
  --card: 0 0% 9%;                       /* #171717 ← oklch(0.205 0 0)（原 240 5.9% 10% #18181B zinc-900）；比 --background 亮一階，與官方同向 */
  --card-foreground: 0 0% 98%;
  --popover: 0 0% 9%;                    /* #171717 ← oklch(0.205 0 0)（原 240 5.9% 10%） */
  --popover-foreground: 0 0% 98%;
  --secondary: 0 0% 14.9%;               /* #262626 ← oklch(0.269 0 0)（原 240 3.7% 15.9% #27272A zinc-800） */
  --secondary-foreground: 0 0% 98%;
  --muted: 0 0% 14.9%;                   /* #262626 ← oklch(0.269 0 0)（原 240 3.7% 15.9%） */
  --muted-foreground: 0 0% 63.1%;        /* #A1A1A1 ← oklch(0.708 0 0)（原 240 5% 64.9% #A1A1AA zinc-400） */
  --accent: 0 0% 25.1%;                  /* #404040 ← oklch(0.371 0 0)（原 240 3.7% 15.9%）。官方暗色 --accent 比 --muted/--secondary 亮一大階，hover 態才看得見 */
  --accent-foreground: 0 0% 98%;
  --border: 0 0% 100% / 10%;             /* ← oklch(1 0 0 / 10%) 白色 10% 疊層（原 240 3.7% 15.9% #27272A 不透明）。語法見 §S-72 一-(3) */
  --input: 0 0% 100% / 15%;              /* ← oklch(1 0 0 / 15%) 白色 15% 疊層（原 240 3.7% 15.9%） */
  /*〔存查 s0017〕*/
  --destructive: 0 72.2% 50.6%;          /*〔存查 s0018〕*/
  --destructive-foreground: 0 0% 98%;

  /*〔存查 s0019〕*/
  --ring: 0 0% 45.1%;                    /*〔存查 s0020〕*/
  --hint: 0 0% 45.1%;                    /* #737373 ← §S-74 achromatic（原 240 3.8% 46.1% #71717A zinc-500；官方階 45.1%，色差 7/255）。與 --ring 暗色同階 */

  /* 一般主要動作鈕在暗色翻成淺底深字（App: secondary 淺色=黑 / 深色=白） */
  --dark: 0 0% 98%;                      /* 原本就是 achromatic，§S-74 未動 */
  --dark-foreground: 0 0% 9%;            /* #171717 ← §S-74 achromatic（原 240 5.9% 10% #18181B，官方階 9%，色差 4/255） */
  /*〔存查 s0021〕*/
  /* darkPanel 兩模式皆深，不翻轉 */
  /* §S-74：與 :root 那份**寫同一個新值** 0 0% 9%，不翻轉的性質原樣保留。
     上面警告裡「暗色 --dark-panel 與 --card / --popover 逐字同值」在 §S-72 之後一度變成
     「差 4/255」，§S-74 之後又回到逐字同值（都是 #171717，對比 1.0000）—— 警告照舊有效。 */
  --dark-panel: 0 0% 9%;                 /* #171717 ← §S-74 achromatic（原 240 5.9% 10% #18181B，色差 4/255） */
  --dark-panel-foreground: 0 0% 98%;     /* 原本就是 achromatic，§S-74 未動 */

  --success-bg: 142 40% 16%;
  --success-fg: 142 60% 70%;
  --warning-bg: 38 50% 16%;
  --warning-fg: 38 90% 70%;
  /*〔存查 s0022〕*/
  --destructive-fg: 0 91% 71%;           /* #F87171 */

  --link: var(--foreground);
  --link-hover: var(--foreground);

  /* §S-74：暗側欄整組 achromatic，五顆吸到官方階、一顆刻意保 L（理由在該行）。 */
  --sidebar-bg: 0 0% 9%;                 /* #171717 ← §S-74 achromatic（原 240 5.9% 10% #18181B，官方階 9%，色差 4/255）。
                                            這讓它與暗色 --card 變成同值 —— 官方就是這樣（--sidebar 與 --card 都是 oklch(0.205)），
                                              側欄靠 --background(#0A0A0A) 的頁底與 1px --sidebar-border 分界，不靠自身色差。 */
  --sidebar-fg: 0 0% 63.1%;              /* #A1A1A1 ← §S-74 achromatic（原 240 5% 65% #A1A1AA zinc-400；官方階 63.1%，色差 9/255）。對比 6.91→6.94 */
  --sidebar-fg-strong: 0 0% 98%;         /* 原本就是 achromatic，§S-74 未動 */
  --sidebar-border: 0 0% 14.9%;          /*〔存查 s0023〕*/
  --sidebar-accent: 0 0% 14.9%;          /* #262626 ← §S-74 achromatic（原 240 3.7% 15.9% #27272A，官方階 14.9%＝官方 --sidebar-accent oklch(0.269)，色差 4/255） */
  --sidebar-active-bg: 0 0% 19%;         /* #303030 ← §S-74 保 L 去色相（原 240 3.7% 19% #2F2F32，色差 2/255）。
                                            不吸官方階：最近的 14.9% 正好等於 --sidebar-accent，吸過去兩顆就撞成同色（Δ0），
                                              hover 與 active 分不出來。保 L 之後兩者 ΔRGB 由 8 變 10，反而更分得開。 */

  --bs-component-bg: hsl(var(--card));
  --bs-component-bg-rgb: 24, 24, 27;
  --bs-component-border-color: hsl(var(--border));

  --bs-link-color-rgb: 250, 250, 250;
  --bs-link-hover-color-rgb: 250, 250, 250;

  color-scheme: dark;   /* 元素級，蓋掉 head 的 meta color-scheme only light */
}

/* ---------- §2 基礎 ---------- */
body,
.app,
#content.app-content {
  background-color: hsl(var(--background));
  color: hsl(var(--foreground));
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  letter-spacing: -0.011em;
}
h1, h2, h3, h4, h5, h6 {
  font-weight: 600;
  letter-spacing: -0.02em;
  color: hsl(var(--foreground));
}
a { text-decoration: none; }
/*〔存查 s0024〕*/
.text-muted { color: hsl(var(--muted-foreground)) !important; }
/*〔存查 s0025〕*/
hr, .dropdown-divider { border-color: hsl(var(--border)); opacity: 1; }
::selection { background: hsl(var(--primary) / .35); }

/* 按鈕內的圖示一律繼承按鈕前景色 —— view 不准再寫 text-white
   （黃底黑字的鈕若寫死白 icon 會直接隱形） */
.btn i { color: inherit; }

/* =============================================================================
 * 以下移植自 merp shadcn-theme.css
 * ============================================================================= */

/*〔存查 s0026〕*/


/* =============================================================================
 * §3 Page header（移植自 merp §3 L113-120）
 * ============================================================================= */
.page-header {
  border-bottom: 1px solid hsl(var(--border));
  padding-bottom: 0.75rem;
  margin-bottom: 1.25rem;
}
.page-header h1, .page-header h4 { color: hsl(var(--foreground)); }


/*〔存查 s0027〕*/
.btn {
  --bs-btn-border-radius: var(--radius);
  /*〔存查 s0028〕*/
  font-weight: 500;
  border-width: 1px;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease, opacity .15s ease;
  box-shadow: none !important;
  /* BS5 拿掉了 BS4 的 .btn 預設 nowrap → 手機上 flex tab 列的按鈕會被壓縮成中文直排（一字一行）。
     shadcn 按鈕本就不換行；nowrap 也讓 flex 子項的 min-content 撐住不被壓縮。 */
  white-space: nowrap;
}
.btn-sm { --bs-btn-border-radius: var(--radius-md); }

/* 轉換 1／2：.btn-dark ＝ 一般主要動作（zinc 近黑；暗色自動翻成淺底深字）
   對應原版模板的 `.btn-dark, .btn-primary` 那一組。hover/active 用 alpha 而非
   寫死 hsl(240 5.9% 18%)，這樣暗色翻轉後也不會又變回近黑。 */
.btn-dark {
  --bs-btn-bg: hsl(var(--dark));
  --bs-btn-border-color: hsl(var(--dark));
  --bs-btn-color: hsl(var(--dark-foreground));
  --bs-btn-hover-bg: hsl(var(--dark) / .88);
  --bs-btn-hover-border-color: hsl(var(--dark) / .88);
  --bs-btn-hover-color: hsl(var(--dark-foreground));
  --bs-btn-active-bg: hsl(var(--dark) / .8);
  --bs-btn-active-border-color: hsl(var(--dark) / .8);
  --bs-btn-active-color: hsl(var(--dark-foreground));
  --bs-btn-disabled-bg: hsl(var(--dark));
  --bs-btn-disabled-border-color: hsl(var(--dark));
  --bs-btn-disabled-opacity: .5;
}
/* 轉換 2／2：.btn-primary ＝ 品牌金黃，黃底恆黑字。
   只留給「新增 / 儲存」級主要動作，每頁最多一顆（全站灑黃會變黃斑馬）。
   hover/active 走 --primary-light / --primary-dark（App 同名 token，兩模式相同）。 */
.btn-primary {
  --bs-btn-bg: hsl(var(--primary));
  --bs-btn-border-color: hsl(var(--primary));
  --bs-btn-color: hsl(var(--primary-foreground));
  --bs-btn-hover-bg: hsl(var(--primary-light));
  --bs-btn-hover-border-color: hsl(var(--primary-light));
  --bs-btn-hover-color: hsl(var(--primary-foreground));
  --bs-btn-active-bg: hsl(var(--primary-dark));
  --bs-btn-active-border-color: hsl(var(--primary-dark));
  --bs-btn-active-color: hsl(var(--primary-foreground));
  --bs-btn-disabled-bg: hsl(var(--primary));
  --bs-btn-disabled-border-color: hsl(var(--primary));
  --bs-btn-disabled-opacity: .5;
}
/* btn-white（Color Admin 慣用「淺底細框」鈕）→ shadcn outline。照抄，不變。 */
/*〔存查 s0029〕*/
.btn-white,
.btn-secondary, .btn-light {
  /*〔存查 s0030〕*/
  --bs-btn-bg: hsl(var(--background));
  /*〔存查 s0031〕*/
  --bs-btn-border-color: hsl(var(--border));
  /*〔存查 s0032〕*/
  --bs-btn-color: hsl(var(--foreground));
  /*〔存查 s0033〕*/
  --bs-btn-hover-bg: hsl(var(--accent));
  /*〔存查 s0034〕*/
  --bs-btn-hover-border-color: hsl(var(--border));
  /*〔存查 s0035〕*/
  --bs-btn-hover-color: hsl(var(--accent-foreground));
  /*〔存查 s0036〕*/
  --bs-btn-active-bg: hsl(var(--accent));
  --bs-btn-active-border-color: hsl(var(--border));
  /*〔存查 s0037〕*/
  --bs-btn-active-color: hsl(var(--accent-foreground));
}
/*〔存查 s0038〕*/
.btn-default {
  /*〔存查 s0039〕*/
  --bs-btn-bg: transparent;
  /*〔存查 s0040〕*/
  --bs-btn-border-color: transparent;
  /*〔存查 s0041〕*/
  --bs-btn-color: hsl(var(--muted-foreground));
  /*〔存查 s0042〕*/
  --bs-btn-hover-bg: hsl(var(--accent));
  /*〔存查 s0043〕*/
  --bs-btn-hover-border-color: transparent;
  /*〔存查 s0044〕*/
  --bs-btn-hover-color: hsl(var(--accent-foreground));
  /*〔存查 s0045〕*/
  --bs-btn-active-bg: hsl(var(--accent));
  /*〔存查 s0046〕*/
  --bs-btn-active-border-color: transparent;
  /*〔存查 s0047〕*/
  --bs-btn-active-color: hsl(var(--accent-foreground));
}
/* outline 系列收斂為 shadcn outline */
.btn-outline-secondary, .btn-outline-dark, .btn-outline-light {
  /*〔存查 s0048〕*/
  --bs-btn-bg: transparent;
  /*〔存查 s0049〕*/
  --bs-btn-border-color: hsl(var(--border));
  /*〔存查 s0050〕*/
  --bs-btn-color: hsl(var(--foreground));
  /*〔存查 s0051〕*/
  --bs-btn-hover-bg: hsl(var(--accent));
  /*〔存查 s0052〕*/
  --bs-btn-hover-border-color: hsl(var(--border));
  /*〔存查 s0053〕*/
  --bs-btn-hover-color: hsl(var(--accent-foreground));
  /*〔存查 s0054〕*/
  --bs-btn-active-bg: hsl(var(--accent));
  --bs-btn-active-border-color: hsl(var(--border));
  /*〔存查 s0055〕*/
  --bs-btn-active-color: hsl(var(--accent-foreground));
}
.btn-link {
  --bs-btn-color: hsl(var(--foreground));
  --bs-btn-hover-color: hsl(var(--muted-foreground));
  text-decoration: none;
}
/* destructive（照抄，不變） */
.btn-danger {
  /*〔存查 s0056〕*/
  --bs-btn-bg: hsl(var(--destructive));
  /*〔存查 s0057〕*/
  --bs-btn-border-color: hsl(var(--destructive));
  /*〔存查 s0058〕*/
  --bs-btn-color: hsl(var(--destructive-foreground));
  /*〔存查 s0059〕*/
  --bs-btn-hover-bg: hsl(var(--destructive) / .88);
  /*〔存查 s0060〕*/
  --bs-btn-hover-border-color: hsl(var(--destructive) / .88);
  /*〔存查 s0061〕*/
  --bs-btn-hover-color: hsl(var(--destructive-foreground));
  --bs-btn-active-bg: hsl(var(--destructive) / .8);
}
/*〔存查 s0062〕*/
.btn-outline-danger {
  --bs-btn-bg: transparent;
  --bs-btn-border-color: hsl(var(--border));
  --bs-btn-color: hsl(var(--destructive));
  --bs-btn-hover-bg: hsl(var(--destructive));
  --bs-btn-hover-border-color: hsl(var(--destructive));
  --bs-btn-hover-color: hsl(var(--destructive-foreground));
}
/* shadcn 為單色設計：success/warning/info 一律收斂為中性 secondary（語意靠圖示/文字，不靠彩色填底）。
   僅 destructive(刪除/下架) 保留紅色，主要動作保留 .btn-dark 近黑 / .btn-primary 品牌黃。
   如此全站按鈕一致為 shadcn 風。 */
.btn-success,
.btn-warning,
.btn-info {
  /*〔存查 s0063〕*/
  --bs-btn-bg: hsl(var(--secondary));
  /*〔存查 s0064〕*/
  --bs-btn-border-color: hsl(var(--border));
  /*〔存查 s0065〕*/
  --bs-btn-color: hsl(var(--secondary-foreground));
  /*〔存查 s0066〕*/
  --bs-btn-hover-bg: hsl(var(--accent));
  /*〔存查 s0067〕*/
  --bs-btn-hover-border-color: hsl(var(--border));
  /*〔存查 s0068〕*/
  --bs-btn-hover-color: hsl(var(--accent-foreground));
  /*〔存查 s0069〕*/
  --bs-btn-active-bg: hsl(var(--accent));
  --bs-btn-active-border-color: hsl(var(--border));
  /*〔存查 s0070〕*/
  --bs-btn-active-color: hsl(var(--accent-foreground));
}

/* Color Admin 命名色彩鈕（btn-purple/indigo/blue…）：全部收斂為中性 secondary，紅/粉→destructive。
   避免任何頁面殘留彩色鈕（merp 實案：商品頁「搜尋排序初始化」btn-purple）。 */
.btn-purple, .btn-indigo, .btn-blue, .btn-teal, .btn-cyan, .btn-aqua,
.btn-lime, .btn-green, .btn-orange, .btn-yellow, .btn-grey, .btn-gray, .btn-silver {
  /*〔存查 s0071〕*/
  --bs-btn-bg: hsl(var(--secondary)); --bs-btn-border-color: hsl(var(--border)); --bs-btn-color: hsl(var(--secondary-foreground));
  /*〔存查 s0072〕*/
  --bs-btn-hover-bg: hsl(var(--accent)); --bs-btn-hover-border-color: hsl(var(--border)); --bs-btn-hover-color: hsl(var(--accent-foreground));
  /*〔存查 s0073〕*/
  --bs-btn-active-bg: hsl(var(--accent)); --bs-btn-active-border-color: hsl(var(--border)); --bs-btn-active-color: hsl(var(--accent-foreground));
  background-color: hsl(var(--secondary)); border-color: hsl(var(--border)); color: hsl(var(--secondary-foreground));
}
.btn-red, .btn-pink {
  --bs-btn-bg: hsl(var(--destructive)); --bs-btn-border-color: hsl(var(--destructive)); --bs-btn-color: hsl(var(--destructive-foreground));
  --bs-btn-hover-bg: hsl(var(--destructive) / .88); --bs-btn-hover-border-color: hsl(var(--destructive) / .88); --bs-btn-hover-color: hsl(var(--destructive-foreground));
  background-color: hsl(var(--destructive)); border-color: hsl(var(--destructive)); color: hsl(var(--destructive-foreground));
}
/*〔存查 s0074〕*/
.btn-success.text-white, .btn-warning.text-white, .btn-info.text-white,
.btn-secondary.text-white, .btn-light.text-white, .btn-white.text-white,
.btn-purple.text-white, .btn-indigo.text-white, .btn-blue.text-white, .btn-teal.text-white,
.btn-cyan.text-white, .btn-aqua.text-white, .btn-lime.text-white, .btn-green.text-white,
.btn-orange.text-white, .btn-yellow.text-white, .btn-grey.text-white, .btn-gray.text-white, .btn-silver.text-white {
  color: hsl(var(--secondary-foreground)) !important;
}
/* 本專案專屬安全網：.btn-primary 是黃底黑字，view 若寫死 text-white 會直接隱形。
   （原版模板沒有這條，因為它的 primary 是近黑底白字，text-white 剛好對。） */
.btn-primary.text-white { color: hsl(var(--primary-foreground)) !important; }


/* =============================================================================
 * §5 Card / Panel + #content 連結色（移植自 merp §5 L251-318）
 * ============================================================================= */
.card {
  --bs-card-bg: hsl(var(--card));
  --bs-card-color: hsl(var(--card-foreground));
  --bs-card-border-color: hsl(var(--border));
  /* shadcn Card = rounded-xl。內圓角＝外圓角減 1px 邊框寬（幾何推導，不是新階） */
  --bs-card-border-radius: var(--radius-xl);
  --bs-card-inner-border-radius: calc(var(--radius-xl) - 1px);
  /*〔存查 s0075〕*/
  background: hsl(var(--card));
  border: 1px solid hsl(var(--border));
  box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.04);
}
/* 既有頁面用 .card.border-0 做 flush 卡片 → 仍給細框與圓角，維持 shadcn 面板感 */
/*〔存查 s0076〕*/
.card.border-0 { border: 1px solid hsl(var(--border)) !important; }
/* 表格貼卡片底（全站通病）：末列底線與卡框疊成雙線、列背景（hover/striped）戳破卡片圓角。
   末列去底線；貼底的 table/table-responsive 繼承卡片圓角把背景裁掉（overflow-y hidden 只裁圓角溢出，
   不影響 dropdown——表格內下拉本就依 uiux 規範用 dropdown-toggle 版型避開 overflow 容器）。 */
.card .table > tbody > tr:last-child > td,
.card .table > tbody > tr:last-child > th { border-bottom-width: 0; }
.card > .table-responsive:last-child,
  /* 卡片內表格的下緣圓角 = 卡片外圓角減 1px 邊框寬（幾何推導，跟著卡片走） */
.card > .table:last-child {
  border-bottom-left-radius: calc(var(--radius-xl) - 1px);
  border-bottom-right-radius: calc(var(--radius-xl) - 1px);
  overflow-x: auto; overflow-y: auto;
}
.card > .table-responsive:last-child .table { margin-bottom: 0; }
.card-header, .card-footer {
  /*〔存查 s0077〕*/
  background: transparent;
  /*〔存查 s0078〕*/
  border-color: hsl(var(--border));
  font-weight: 600;
  /*〔存查 s0079〕*/
  color: hsl(var(--card-foreground));
}
/*〔存查 s0080〕*/
.card-header .text-muted,
.card-header small,
.card-header .small,
.card-header label,
.card-header .form-label,
.card-header .form-control,
.card-header .form-select,
.card-footer .text-muted,
.card-footer small,
.card-footer .small { font-weight: 400; }

/* 表格內固定尺寸縮圖（修 Color Admin img 規則把 inline 尺寸撐大成原圖）；本檔最後載入故 !important 可勝出 */
/*〔存查 s0081〕*/
.dash-thumb { width: 32px !important; height: 32px !important; object-fit: cover; flex: 0 0 auto; display: inline-block; vertical-align: middle; }
.table img.rounded { max-width: 48px; max-height: 48px; }
/* 列表商品縮圖（商品/訂單列表共用，SSOT）。Color Admin img{max-width:100%} 會撐爆 → !important 鎖尺寸 */
/*〔存查 s0082〕*/
.list-thumb { width: 40px !important; height: 40px !important; object-fit: cover; border-radius: 6px; border: 1px solid hsl(var(--border)); background: hsl(var(--muted)); flex: 0 0 auto; display: inline-block; vertical-align: middle; }
/*〔存查 s0083〕*/
.list-thumb-placeholder { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 6px; border: 1px solid hsl(var(--border)); background: hsl(var(--muted)); color: hsl(var(--muted-foreground)); flex: 0 0 auto; vertical-align: middle; font-size: .85rem; }
/* 訂單列表：多商品縮圖疊放（avatar stack） */
/*〔存查 s0084〕*/
.list-thumb-stack { display: inline-flex; align-items: center; }
/*〔存查 s0085〕*/
.list-thumb-stack .list-thumb, .list-thumb-stack .list-thumb-placeholder { margin-inline-start: -10px; box-shadow: 0 0 0 2px hsl(var(--card)); }
/*〔存查 s0086〕*/
.list-thumb-stack > :first-child { margin-inline-start: 0; }
/*〔存查 s0087〕*/
.list-thumb-more { font-size: .75rem; color: hsl(var(--muted-foreground)); margin-inline-start: 6px; }
/* 安全網：內容區表格內任何「未套縮圖 class」的圖片一律鎖成縮圖尺寸（防某些 plugin CSS 的
   img max-width:100% 把 inline 尺寸撐成原圖）。符合「列表頁圖片一律縮圖」原則。 */
.app-content table td img:not(.list-thumb):not(.dash-thumb):not(.fb-thumb-img):not(.fb-doc-img) { max-width: 56px !important; max-height: 56px !important; object-fit: cover; }
/* 安全網：卡片標題列殘留的 text-white 反轉為卡片前景色，不隱形 */
.app-content .card-header .text-white { color: hsl(var(--card-foreground)) !important; }

/*〔存查 s0088〕*/
#content a:not(.btn):not(.dropdown-item):not(.nav-link):not(.fb-tab):not(.page-link),
.app-content a:not(.btn):not(.dropdown-item):not(.nav-link):not(.fb-tab):not(.page-link) {
  color: hsl(var(--link));
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-color: hsl(var(--muted-foreground) / .45);
}
#content a:not(.btn):not(.dropdown-item):not(.nav-link):not(.fb-tab):not(.page-link):hover,
.app-content a:not(.btn):not(.dropdown-item):not(.nav-link):not(.fb-tab):not(.page-link):hover {
  color: hsl(var(--link-hover));
  text-decoration-color: hsl(var(--foreground));
}


/* =============================================================================
 * §6 Form（移植自 merp §6 L319-342，另補 merp §2 L101-111 的統一 focus ring）
 * ============================================================================= */
.form-control, .form-select {
  --bs-border-color: hsl(var(--input));
  /*〔存查 s0089〕*/
  /*〔存查 s0090〕*/
  background-color: hsl(var(--background));
  border: 1px solid hsl(var(--input));
  border-radius: var(--radius);
  /*〔存查 s0091〕*/
  color: hsl(var(--foreground));
  box-shadow: none;
}
.form-control-sm, .form-select-sm { border-radius: var(--radius-md); }
.form-control::placeholder { color: hsl(var(--hint)); }
.form-control:disabled, .form-select:disabled, .form-control[readonly] { background-color: hsl(var(--muted)); opacity: 1; }
.form-label { font-weight: 500; color: hsl(var(--foreground)); margin-bottom: 0.35rem; }
.input-group-text {
  /*〔存查 s0092〕*/
  background: hsl(var(--muted));
  /*〔存查 s0093〕*/
  border-color: hsl(var(--input));
  /*〔存查 s0094〕*/
  color: hsl(var(--muted-foreground));
}
/* 轉換：原版模板 checkbox 勾選用 primary（近黑）→ 本主題改 --dark（黃勾勾會糊掉且太搶眼）。
   完整 checkbox / radio / switch 見 §35。 */
.form-check-input { border-color: hsl(var(--input)); }
.form-check-input:checked { background-color: hsl(var(--dark)); border-color: hsl(var(--dark)); }
/* §S-73：原本是 `border-color: hsl(var(--ring)); box-shadow: none;`（原值記在此存查）。
   官方 checkbox 的焦點寫法是 `focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50`
   —— border 換 ring 色**加上**一圈 3px 淡環，兩層缺一不可。這裡補上外環那一層。 */
.form-check-input:focus { border-color: hsl(var(--ring)); box-shadow: 0 0 0 3px hsl(var(--ring) / .5); }
/* form-floating（登入頁等）label 色 */
.form-floating > label { color: hsl(var(--muted-foreground)); }

/* 統一 focus ring（shadcn：2px ring + offset）。merp 放在 §2，肥肥目標檔 §2 沒有 → 這裡補上。 */
.btn:focus-visible,
.form-control:focus,
.form-select:focus,
.page-link:focus-visible,   /*〔存查 s0095〕*/
.dropdown-item:focus-visible {
  /* §S-73：原本是 `outline: 2px solid hsl(var(--ring)); outline-offset: 1px; box-shadow: none;`
     （原值記在此存查）。改成官方的兩層：border 換 ring 色（實色）＋ 3px 的 ring/50 柔環。 */
  outline: none;
  outline-offset: 0;
  box-shadow: 0 0 0 3px hsl(var(--ring) / .5);
  border-color: hsl(var(--ring));
}


/* =============================================================================
 * §7 Table（移植自 merp §7 L343-380）
 * ============================================================================= */
.table {
  --bs-table-bg: transparent;
  --bs-table-color: hsl(var(--foreground));
  --bs-table-border-color: hsl(var(--border));
  /* merp 寫死 hsl(240 4.8% 97.5%) 並另外在暗色再蓋一次 → 改吃 token + alpha，自動翻轉 */
  --bs-table-striped-bg: hsl(var(--muted) / .55);
  --bs-table-striped-color: hsl(var(--foreground));
  --bs-table-hover-bg: hsl(var(--accent));
  --bs-table-hover-color: hsl(var(--accent-foreground));
  vertical-align: middle;
  border-color: hsl(var(--border));
}
/*〔存查 s0096〕*/
.table > thead th {
  background: hsl(var(--muted)) !important;
  /*〔存查 s0097〕*/
  color: hsl(var(--muted-foreground-on-muted));
  font-weight: 500;
  text-transform: none;
  border-color: hsl(var(--border));
  /* 從 §23 L2090 原值搬過來的（那條收斂後不再碰 thead，但表頭的下框線仍然需要）：
     `border-bottom: 1px solid hsl(var(--border));` —— 值一字不動，只是換人管。 */
  border-bottom: 1px solid hsl(var(--border));
}
/*〔存查 s0098〕*/
.table-light, .table-light > th, .table-light > td {
  background: hsl(var(--muted)) !important;
  font-weight: 500;
  text-transform: none;
  border-color: hsl(var(--border));
}
.table.table-bordered, .table.table-bordered > :not(caption) > * > * { border-color: hsl(var(--border)); }
.table > tbody > tr { border-color: hsl(var(--border)); }
.table > :not(caption) > * > * { border-bottom-color: hsl(var(--border)); }
/* 排序 icon hook（行為不動，只調色） */
/*〔存查 s0099〕*/
.table-field-sort { color: hsl(var(--muted-foreground)); cursor: pointer; }
/*〔存查 s0100〕*/
.table-field-sort.sort-acitve { color: hsl(var(--foreground)); }
/*〔存查 s0101〕*/

/*〔存查 s0102〕*/
.table-stick > thead > tr > th.stick,
.table-stick > tbody > tr > td.stick { position: sticky; left: 0; z-index: 2; }
.table-stick > tbody > tr > td.stick { background: hsl(var(--card)); }
.table-stick > thead > tr > th.stick { z-index: 3; }
.table-stick > tbody > tr:hover > td.stick { background: hsl(var(--accent)); color: hsl(var(--accent-foreground)); }
.table-stick > thead > tr > th.stick-end,
.table-stick > tbody > tr > td.stick-end { border-right: 1px solid hsl(var(--border)); }

/*〔存查 s0103〕*/
.app-content .table { --bs-table-bg: transparent; border-color: hsl(var(--border)); margin-bottom: 0; }
/* 去掉 table-bordered 的直向框線，只保留橫線 */
.app-content .table.table-bordered > :not(caption) > * > * { border-inline-width: 0; border-block-color: hsl(var(--border)); }
.app-content .table > :not(:first-child) { border-top: 0; }
/* 表頭：透明底 + muted 字 + 細下框 */
.app-content .table > thead > tr > th {
  /*〔存查 s0104〕*/
  background: transparent !important; color: hsl(var(--muted-foreground)); font-weight: 500;
  border-bottom: 1px solid hsl(var(--border)); border-top: 0;
  padding: .6rem .75rem; white-space: nowrap; vertical-align: middle;
}
/* 內容列：去斑馬、舒適 padding、垂直置中、細橫線 */
.app-content .table.table-striped > tbody > tr > * { --bs-table-bg-type: transparent; --bs-table-accent-bg: transparent; }
.app-content .table:not(.table-bordered) > tbody > tr > td { border-color: hsl(var(--border)); border-inline-width: 0; padding: .6rem .75rem; vertical-align: middle; }
/*〔存查 s0105〕*/
.app-content .table.table-bordered > tbody > tr > td,
.app-content .table.table-bordered > thead > tr > th {
    border: 1px solid hsl(var(--border));
    padding: .6rem .75rem;
    vertical-align: middle;
}
.app-content .table > tbody > tr:last-child > td { border-bottom: 0; }
.app-content .table-hover > tbody > tr:hover > * { background: hsl(var(--muted)); color: hsl(var(--foreground)); }

/*〔存查 s0106〕*/
.app-content .table td a.btn[href*="modify"],
.app-content .table td a.btn[href*="edit"],
.app-content .table td a.btn[href*="view"] {
  /* 只接管「尺寸」，顏色一律交還按鈕變體決定。
     原本這裡用 !important 寫死 secondary 底，導致規範的「列表操作鈕＝btn-dark」
     永遠出不來（全站列表頁的編輯鈕都被壓成淺灰）。 */
  /*〔存查 s0107〕*/
  min-width: 32px; height: 32px; padding: 0 .5rem;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--radius) !important;
}

.app-content .table td .fa-lg { font-size: .95rem; }
/* 表格內按鈕不換行（如「強制登出」被擠斷）（merp §16 L1244） */
.app-content .table .btn { white-space: nowrap; }


/*〔存查 s0108〕*/
.badge {
  font-weight: 500;
  /*〔存查 s0109〕*/
  /*〔存查 s0110〕*/
  border-radius: 9999px;
  /*〔存查 s0111〕*/
  border: 1px solid transparent;
}
/*〔存查 s0112〕*/
.badge.bg-secondary, .badge.text-bg-secondary { background: hsl(var(--secondary)) !important; color: hsl(var(--secondary-foreground)) !important; }
/*〔存查 s0113〕*/
.badge.bg-dark, .badge.bg-primary { background: hsl(var(--dark)) !important; color: hsl(var(--dark-foreground)) !important; }
/*〔存查 s0114〕*/
.badge.bg-danger { background: hsl(var(--destructive)) !important; color: hsl(var(--destructive-foreground)) !important; }
.badge.bg-success { background: hsl(var(--success)) !important; color: hsl(var(--success-foreground)) !important; }
/*〔存查 s0115〕*/
.badge.bg-warning { background: hsl(var(--warning)) !important; color: hsl(var(--warning-foreground)) !important; }
.badge.bg-light, .badge.bg-white { background: hsl(var(--muted)) !important; color: hsl(var(--muted-foreground)) !important; border-color: hsl(var(--border)); }


/* =============================================================================
 * §9 Alert（移植自 merp §9 L394-404；柔和底色改吃 --success-bg/--warning-bg token，
 *    完整覆蓋在 §28）
 * ============================================================================= */
.alert {
  border-radius: var(--radius);
  border: 1px solid hsl(var(--border));
}
/*〔存查 s0116〕*/
.alert-info { background: hsl(var(--muted)); color: hsl(var(--foreground)); border-color: hsl(var(--border)); }
.alert-light { background: hsl(var(--card)); color: hsl(var(--muted-foreground)); border-color: hsl(var(--border)); }
/* merp 寫死 hsl(38 92% 95%) / hsl(142 71% 96%) / hsl(0 86% 97%) → 換成 token，暗色自動翻轉 */
.alert-warning { background: hsl(var(--warning-bg)); color: hsl(var(--warning-fg)); border-color: hsl(var(--warning-fg) / .25); }
/*〔存查 s0117〕*/
.alert-success { background: hsl(var(--success-bg)); color: hsl(var(--success-fg)); border-color: hsl(var(--success-fg) / .25); }
/* 紅字一律走 --destructive-fg（見 §1 token 註解）：底維持 --destructive/.1 不動，
   只把「文字」換成深一階的紅 —— 原本 #EF4444 在這個淡紅底上只有 2.82:1。 */
/* 已被 background→L2054(hsl(var(--destructive) / .1) !important)、color→L2054(rgb(186, 28, 28))、border-color→L1948(rgba(220, 38, 38, 0.25)) 覆蓋 */
.alert-danger  { background: hsl(var(--destructive) / .1); color: hsl(var(--destructive-fg)); border-color: hsl(var(--destructive) / .25); }


/* =============================================================================
 * §10 Dropdown（移植自原版模板 §10 L405-420）
 * 轉換：active 項原版模板用 primary → 本主題用 --dark（選單反白不需要品牌黃）
 * ============================================================================= */
.dropdown-menu {
  --bs-dropdown-bg: hsl(var(--popover));
  --bs-dropdown-color: hsl(var(--popover-foreground));
  --bs-dropdown-border-color: hsl(var(--border));
  --bs-dropdown-border-radius: var(--radius);
  --bs-dropdown-link-color: hsl(var(--popover-foreground));
  --bs-dropdown-link-hover-bg: hsl(var(--accent));
  --bs-dropdown-link-hover-color: hsl(var(--accent-foreground));
  --bs-dropdown-link-active-bg: hsl(var(--dark));
  --bs-dropdown-link-active-color: hsl(var(--dark-foreground));
  padding: 0.35rem;
  box-shadow: 0 8px 24px -6px rgb(0 0 0 / 0.12), 0 2px 6px -2px rgb(0 0 0 / 0.08);
}
.dropdown-item { border-radius: var(--radius-md); padding: 0.45rem 0.65rem; }
.dropdown-item:hover, .dropdown-item:focus { background: hsl(var(--accent)); color: hsl(var(--accent-foreground)); }
.dropdown-divider { margin: .3rem 0; border-color: hsl(var(--border)); }


/* =============================================================================
 * §11 Breadcrumb（移植自 merp §11 L421-425）
 * ============================================================================= */
.breadcrumb { --bs-breadcrumb-divider-color: hsl(var(--muted-foreground)); }
.breadcrumb-item, .breadcrumb-item a { color: hsl(var(--muted-foreground)); }
.breadcrumb-item.active { color: hsl(var(--foreground)); }


/*〔存查 s0118〕*/
.pagination {
  --bs-pagination-bg: transparent;
  --bs-pagination-color: hsl(var(--muted-foreground));
  --bs-pagination-border-color: hsl(var(--border));
  --bs-pagination-border-radius: var(--radius);
  --bs-pagination-hover-bg: hsl(var(--accent));
  --bs-pagination-hover-color: hsl(var(--accent-foreground));
  --bs-pagination-hover-border-color: hsl(var(--border));
  --bs-pagination-focus-bg: hsl(var(--accent));
  --bs-pagination-focus-color: hsl(var(--accent-foreground));
  --bs-pagination-focus-box-shadow: 0 0 0 3px hsl(var(--ring) / .5);   /* §S-73：原 `0 0 0 2px hsl(var(--ring) / .2)`，改官方 ring-[3px] ring-ring/50 */
  --bs-pagination-active-bg: hsl(var(--dark));
  --bs-pagination-active-color: hsl(var(--dark-foreground));
  --bs-pagination-active-border-color: hsl(var(--dark));
  --bs-pagination-disabled-bg: transparent;
  --bs-pagination-disabled-color: hsl(var(--muted-foreground) / .5);
  --bs-pagination-disabled-border-color: hsl(var(--border));
  gap: .25rem;
}
.page-link {
  margin: 0;
  background: transparent !important;
  color: hsl(var(--muted-foreground)) !important;
  border: 1px solid hsl(var(--border)) !important;
  border-radius: var(--radius-md) !important;
  font-size: 13px;
}
.page-link:hover {
  background: hsl(var(--accent)) !important;
  color: hsl(var(--accent-foreground)) !important;
}
.page-item.active .page-link {
  background: hsl(var(--dark)) !important;
  color: hsl(var(--dark-foreground)) !important;
  border-color: hsl(var(--dark)) !important;
}
.page-item.disabled .page-link {
  background: transparent !important;
  color: hsl(var(--muted-foreground) / .45) !important;
  border-color: hsl(var(--border)) !important;
}


/*〔存查 s0119〕*/
.fb-tabs {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  align-items: center;
  justify-content: center;
  height: 2.25rem;                        /* h-9 */
  /*〔存查 s0120〕*/
  padding: 3px;                           /* p-[3px] */
  border-radius: var(--radius);           /* rounded-lg */
  background: hsl(var(--muted));          /* bg-muted */
  color: hsl(var(--muted-foreground));
  overflow-x: auto;
}
.fb-tab {
  position: relative;
  display: inline-flex;
  height: calc(100% - 1px);
  align-items: center;
  justify-content: center;
  gap: .375rem;                           /* gap-1.5 */
  padding: .25rem .75rem;                 /* py-1；px 略放寬給中文 */
  border: 1px solid transparent;
  border-radius: var(--radius-md); /* rounded-md */
  font-size: .875rem;                     /* text-sm */
  font-weight: 500;
  white-space: nowrap;
  color: hsl(var(--foreground) / .6);     /* text-foreground/60 */
  text-decoration: none;
  transition: color .15s, background-color .15s, box-shadow .15s;
}
.fb-tab:hover { color: hsl(var(--foreground)); }
.fb-tab.active {
  /*〔存查 s0121〕*/
  /*〔存查 s0122〕*/
  background: hsl(var(--background));     /* data-[state=active]:bg-background */
  /*〔存查 s0123〕*/
  color: hsl(var(--foreground));
  box-shadow: 0 1px 2px 0 rgb(0 0 0 / .05); /* shadow-sm */
}

/* Bootstrap nav-tabs / nav-pills
   轉換：nav-pills active 底原版模板用 primary → 本主題用 --dark */
.nav-tabs {
  --bs-nav-tabs-border-color: hsl(var(--border));
  --bs-nav-tabs-link-active-color: hsl(var(--foreground));
  --bs-nav-tabs-link-active-border-color: hsl(var(--border)) hsl(var(--border)) hsl(var(--card));
}
.nav-tabs .nav-link { color: hsl(var(--muted-foreground)); border-radius: var(--radius) var(--radius) 0 0; }
.nav-tabs .nav-link:hover { color: hsl(var(--foreground)); border-color: hsl(var(--border)); }
.nav-pills {
  --bs-nav-pills-border-radius: var(--radius);
  --bs-nav-pills-link-active-bg: hsl(var(--dark));
  --bs-nav-pills-link-active-color: hsl(var(--dark-foreground));
}
.nav-pills .nav-link { color: hsl(var(--muted-foreground)); }


/* =============================================================================
 * §14 Modal（外觀，不動行為）（移植自 merp §14 L506-516）
 * ============================================================================= */
.modal-content {
  /*〔存查 s0124〕*/
  border: 1px solid hsl(var(--border));
  border-radius: var(--radius-lg);   /* shadcn DialogContent = rounded-lg */
  box-shadow: 0 16px 48px -12px rgb(0 0 0 / 0.25);
  /*〔存查 s0125〕*/
  background: hsl(var(--card));
  /*〔存查 s0126〕*/
  color: hsl(var(--card-foreground));
}
/*〔存查 s0127〕*/
.modal-header, .modal-footer { border-color: hsl(var(--border)); }
.modal-header { font-weight: 600; }


/*〔存查 s0128〕*/
#sidebar.app-sidebar,
.app-sidebar,
.app-sidebar-bg {
  /*〔存查 s0129〕*/
  background: hsl(var(--sidebar-bg)) !important;
}
/* 與內容區之間的細分隔線（shadcn 慣例） */
#sidebar.app-sidebar,
/*〔存查 s0130〕*/
.app-sidebar { border-right: 1px solid hsl(var(--sidebar-border)); }
#sidebar.app-sidebar { color: hsl(var(--sidebar-fg)); }

/* 側欄捲軸（merp §30） */
#sidebar.app-sidebar::-webkit-scrollbar { width: 6px; }
#sidebar.app-sidebar::-webkit-scrollbar-thumb { background: hsl(var(--sidebar-border)); border-radius: 3px; }
#sidebar.app-sidebar::-webkit-scrollbar-track { background: transparent; }

/* 分組標題 */
/*〔存查 s0131〕*/
.app-sidebar .menu-header {
  color: hsl(var(--sidebar-fg) / .6);
  text-transform: none;
  letter-spacing: 0.04em;
  font-size: 0.7rem;
  font-weight: 500;
}
.app-sidebar .menu-link {
  color: hsl(var(--sidebar-fg));
  border-radius: var(--radius);
  /*〔存查 s0132〕*/
  margin: 1px 8px;
  font-weight: 400;
  transition: background-color .12s ease, color .12s ease;
}
.app-sidebar .menu-link .menu-icon { color: hsl(var(--sidebar-fg)); opacity: .9; }
.app-sidebar .menu-link:hover,
.app-sidebar .menu-link:focus {
  background: hsl(var(--sidebar-accent));
  color: hsl(var(--sidebar-fg-strong));
}
.app-sidebar .menu-link:hover .menu-icon { color: hsl(var(--sidebar-fg-strong)); }

/* active：目前頁＝深色反轉（有感）。這裡原版模板用 --primary，本主題改 --dark。 */
#sidebar .menu-item.active > .menu-link {
  /*〔存查 s0133〕*/
  background: hsl(var(--dark));
  /*〔存查 s0134〕*/
  color: hsl(var(--dark-foreground));
  /*〔存查 s0135〕*/
  font-weight: 500;
}
#sidebar .menu-item.active > .menu-link .menu-icon,
/*〔存查 s0136〕*/
#sidebar .menu-item.active > .menu-link .menu-caret { color: hsl(var(--dark-foreground)); opacity: 1; }
/* has-sub 群組（自己不是目的頁，只是展開中）→ 只用淡 accent，不要整條反白 */
#sidebar .menu-item.has-sub.active > .menu-link,
#sidebar .menu-item.expand > .menu-link {
  /*〔存查 s0137〕*/
  background: hsl(var(--sidebar-accent));
  /*〔存查 s0138〕*/
  color: hsl(var(--sidebar-fg-strong));
}
#sidebar .menu-item.has-sub.active > .menu-link .menu-icon,
#sidebar .menu-item.has-sub.active > .menu-link .menu-caret { color: hsl(var(--sidebar-fg-strong)); }
#sidebar .menu-submenu .menu-item.active > .menu-link {
  /*〔存查 s0139〕*/
  background: hsl(var(--dark));
  /*〔存查 s0140〕*/
  color: hsl(var(--dark-foreground));
}
.app-sidebar .menu-submenu { background: transparent; }
.app-sidebar .menu-submenu .menu-link { font-size: 0.85rem; }
.app-sidebar .menu-caret { color: hsl(var(--sidebar-fg) / .75); }

/* 側欄統計 badge */
/*〔存查 s0141〕*/
.app-sidebar .menu-badge {
  background: hsl(var(--sidebar-active-bg)) !important;
  color: hsl(var(--sidebar-fg-strong)) !important;
  border-radius: 9999px;
  font-weight: 500;
}
/* 側欄 profile 區：移除原 theme 的山景封面照，改 shadcn 純色 + 細底線 */
.app-sidebar .menu-profile-cover,
.app-sidebar .menu-profile-cover.with-shadow {
  background-image: none !important;
  background-color: hsl(var(--sidebar-bg)) !important;
}
.app-sidebar .menu-profile-cover.with-shadow:before {
  background-image: none !important;
  background: transparent !important;
}
.app-sidebar .menu-profile {
  /*〔存查 s0142〕*/
  border-bottom: 1px solid hsl(var(--sidebar-border));
}
.app-sidebar .menu-profile-link { color: hsl(var(--sidebar-fg-strong)) !important; }
.app-sidebar .menu-profile-info,
.app-sidebar .menu-profile-info .text-white-50,
/*〔存查 s0143〕*/
.app-sidebar .menu-profile-info small { color: hsl(var(--sidebar-fg)) !important; }
.app-sidebar .menu-profile-image { border: 1px solid hsl(var(--sidebar-border)); }
/* profile 區內的前台/登出小連結 */
.app-sidebar .menu-profile a,
.app-sidebar .menu-profile .text-white-50 { color: hsl(var(--sidebar-fg)) !important; }
.app-sidebar .menu-profile a:hover { color: hsl(var(--sidebar-fg-strong)) !important; }
/* 收合鈕 */
.app-sidebar-minify-btn {
  background: hsl(var(--sidebar-accent));
  color: hsl(var(--sidebar-fg)) !important;
  /*〔存查 s0144〕*/
  border-radius: 9999px;
}
.app-sidebar-minify-btn:hover { background: hsl(var(--sidebar-active-bg)); color: hsl(var(--sidebar-fg-strong)) !important; }

/* 側欄的 data-bs-theme="dark"（Color Admin 遺留，肥肥 _nav.blade.php L2 也有）
   會讓亮色模式下的 Bootstrap 元件仍套暗色變數 → 明確以 token 覆蓋（merp §31 L2049-2055） */
#sidebar[data-bs-theme="dark"] {
  --bs-body-color: hsl(var(--sidebar-fg));
  --bs-body-bg: hsl(var(--sidebar-bg));
  --bs-emphasis-color: hsl(var(--sidebar-fg-strong));
}


/* =============================================================================
 * §16 Login 頁（移植自原版模板 §16 L591-662 + 原版模板 §14 L1199-1245）
 * brand-badge 是「品牌識別」→ 這是全檔少數保留 --primary（金黃）的地方
 * ============================================================================= */
/*〔存查 s0145〕*/
.login.login-v1 {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  background: hsl(var(--muted));
}
/*〔存查 s0146〕*/
.login.login-v1 .login-container {
  position: static;
  width: 100%;
  max-width: 400px;
  margin: 1.5rem;
  background: hsl(var(--card));
  border: 1px solid hsl(var(--border));
  border-radius: var(--radius-xl);
  box-shadow: 0 12px 32px -14px rgb(0 0 0 / 0.18);
  overflow: hidden;
  /* 登入頁上方留白收斂（移除 icon 後） */
  padding: 1.6rem 1.6rem 1.8rem;
}
/*〔存查 s0147〕*/
.login.login-v1 .login-header,
.login.login-v1 .login-body {
  position: static;
  float: none;
  width: auto;
  background: transparent !important;
}
/*〔存查 s0148〕*/
.login.login-v1 .login-header .brand {
  text-align: center;
  color: hsl(var(--foreground));
}
/* 品牌識別：黃底黑字方塊 */
/*〔存查 s0149〕*/
.login .brand-badge,
.login.login-v1 .brand-badge {
  width: 52px;
  height: 52px;
  margin: 0 auto .8rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: hsl(var(--primary));
  color: hsl(var(--primary-foreground));
  border-radius: var(--radius-xl);
  font-size: 1.3rem;
  box-shadow: 0 4px 10px -3px hsl(var(--primary) / 0.4);
}
.login .brand { text-align: center; margin-bottom: 1.1rem; }
/*〔存查 s0150〕*/
.login .brand-title {
  font-size: 1.4rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: hsl(var(--foreground));
  line-height: 1.2;
  margin-top: .2rem;
}
/*〔存查 s0151〕*/
.login .brand-sub {
  margin-top: 0.2rem;
  font-size: 0.82rem;
  font-weight: 400;
  color: hsl(var(--muted-foreground));
}
/*〔存查 s0152〕*/
.login.login-v1 .login-header .icon { display: none; }
.login .login-header { margin: 0; padding: 0; }
/*〔存查 s0153〕*/
.login .login-body { padding: 0; }
/*〔存查 s0154〕*/
.login.login-v1 .login-content { width: auto; padding: 0; }
.login .form-label { font-size: .82rem; font-weight: 500; color: hsl(var(--foreground)); margin-bottom: .35rem; }
.login .form-control, .login .form-select { min-height: 40px; padding: .5rem .7rem; }
/*〔存查 s0155〕*/
.login .btn-dark, .login .btn-primary { min-height: 40px; font-weight: 500; }
.login .form-check-label { font-size: .82rem; color: hsl(var(--muted-foreground)); }
.login .alert { border-radius: var(--radius); font-size: .85rem; }
/* 登入頁輸入框：Color Admin app.min.css 有 5 層 class 深色規則，用同鏈 + !important 蓋成淺色 shadcn */
/*〔存查 s0156〕*/
.login.login-v1 .login-container .login-body .login-content .form-control,
.login.login-v1 .login-content .form-control,
.login.login-v1 .login-content .form-select {
  background-color: hsl(var(--background)) !important;
  border: 1px solid hsl(var(--input)) !important;
  color: hsl(var(--foreground)) !important;
}
/*〔存查 s0157〕*/
.login.login-v1 .login-content .form-control::placeholder { color: hsl(var(--hint)) !important; }
/*〔存查 s0158〕*/
.login.login-v1 .form-floating > label { color: hsl(var(--muted-foreground)); }

/* 全站 autofill：去掉瀏覽器藍底，對齊主題（merp §14 L1218-1228） */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
select:-webkit-autofill,
textarea:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px hsl(var(--background)) inset !important;
  -webkit-text-fill-color: hsl(var(--foreground)) !important;
  caret-color: hsl(var(--foreground));
  transition: background-color 9999s ease-in-out 0s;
}

/* 系統版本資訊等 label-value 列表（merp §14 L1237-1241） */
/*〔存查 s0159〕*/
.app-content .system-info-item { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .55rem 0; border-bottom: 1px solid hsl(var(--border)); font-size: .875rem; }
/*〔存查 s0160〕*/
.app-content .system-info-item:last-child { border-bottom: 0; }
/*〔存查 s0161〕*/
.app-content .system-info-item > span:first-child { color: hsl(var(--muted-foreground)); white-space: nowrap; }
/*〔存查 s0162〕*/
.app-content .system-info-item strong { font-weight: 500; text-align: end; }


/*〔存查 s0163〕*/
/* selection 本體（單選/多選）*/
.select2-container .select2-selection--single,
.select2-container .select2-selection--multiple,
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple,
.select2-container--bootstrap-5 .select2-selection--single,
.select2-container--bootstrap-5 .select2-selection--multiple {
  border: 1px solid hsl(var(--input)) !important;
  border-radius: var(--radius) !important;
  background: hsl(var(--background)) !important;
  color: hsl(var(--foreground)) !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered,
.select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered {
  color: hsl(var(--foreground)) !important;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder,
.select2-container--bootstrap-5 .select2-selection__placeholder { color: hsl(var(--hint)) !important; }
/* 只針對 --default theme 的 border-triangle 箭頭；bootstrap-5 theme 用 SVG，別碰 */
.select2-container--default .select2-selection--single .select2-selection__arrow b { border-color: hsl(var(--muted-foreground)) transparent transparent transparent !important; }
.select2-container--default.select2-container--open .select2-selection__arrow b { border-color: transparent transparent hsl(var(--muted-foreground)) transparent !important; }
/* focus / open 態 */
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--bootstrap-5.select2-container--focus .select2-selection,
.select2-container--open .select2-selection--single,
.select2-container--open .select2-selection--multiple {
  border-color: hsl(var(--ring)) !important;
  box-shadow: 0 0 0 3px hsl(var(--ring) / .5) !important;   /* §S-73：原 `0 0 0 2px hsl(var(--ring) / .25)`，改官方 3px + /50 */
}
/* dropdown 面板（append 到 body，靠 html.dark 生效）*/
.select2-container--default .select2-dropdown,
.select2-container--bootstrap-5 .select2-dropdown,
.select2-dropdown {
  border: 1px solid hsl(var(--border)) !important;
  border-radius: var(--radius);
  box-shadow: 0 8px 24px -6px rgb(0 0 0 / 0.25);
  background: hsl(var(--popover)) !important;
  color: hsl(var(--popover-foreground)) !important;
}
/* 搜尋框 */
.select2-container--default .select2-search--dropdown .select2-search__field,
.select2-container--bootstrap-5 .select2-search--dropdown .select2-search__field,
.select2-search--dropdown .select2-search__field {
  background: hsl(var(--background)) !important;
  border: 1px solid hsl(var(--input)) !important;
  border-radius: var(--radius-md);
  color: hsl(var(--foreground)) !important;
  outline: none;
}
/* §S-73：原本只有 `border-color`，缺官方的 3px 柔環那一層，補上（原本那半層一字未動）。 */
.select2-container--default .select2-search--dropdown .select2-search__field:focus,
.select2-container--bootstrap-5 .select2-search--dropdown .select2-search__field:focus { border-color: hsl(var(--ring)) !important; box-shadow: 0 0 0 3px hsl(var(--ring) / .5) !important; }
/* 選項 */
.select2-container--default .select2-results__option,
.select2-container--bootstrap-5 .select2-results__option,
.select2-results__option {
  color: hsl(var(--popover-foreground)) !important;
  background: transparent !important;
}
.select2-container--default .select2-results__option--highlighted,
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--bootstrap-5 .select2-results__option--highlighted,
.select2-results__option--highlighted {
  background: hsl(var(--accent)) !important;
  color: hsl(var(--accent-foreground)) !important;
}
/* 已選項＝深色反轉（hover 淺灰、已選反轉，「選了」一眼可辨）。原版模板此處用 primary，本主題用 --dark */
.select2-container--default .select2-results__option[aria-selected="true"],
.select2-container--default .select2-results__option[data-selected="true"],
.select2-container--bootstrap-5 .select2-results__option[aria-selected="true"],
.select2-container--bootstrap-5 .select2-results__option--selected {
  background: hsl(var(--dark)) !important;
  color: hsl(var(--dark-foreground)) !important;
}
.select2-results__message { color: hsl(var(--muted-foreground)) !important; }
/* 多選 tag */
.select2-container--default .select2-selection--multiple .select2-selection__choice,
.select2-container--bootstrap-5 .select2-selection--multiple .select2-selection__choice {
  background: hsl(var(--secondary)) !important;
  border: 1px solid hsl(var(--border)) !important;
  border-radius: var(--radius-md);
  color: hsl(var(--secondary-foreground)) !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove,
.select2-container--bootstrap-5 .select2-selection--multiple .select2-selection__choice__remove { color: hsl(var(--muted-foreground)) !important; }
.select2-container--default .select2-selection--multiple .select2-search__field,
.select2-container--bootstrap-5 .select2-selection--multiple .select2-search__field { color: hsl(var(--foreground)) !important; }

/* select2 在篩選列內不要撐滿整行（全域 init 是 width:100%，會把每個下拉推成一行）（merp §26 L1693-1697） */
.card-header .select2-container,
.toolbar-row .select2-container { width: auto !important; min-width: 140px; }

/*〔存查 s0164〕*/
.form-select-sm + .select2-container .select2-selection--single {
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 28px 0 10px !important;
  font-size: 13px !important;
}
.form-select-sm + .select2-container .select2-selection--single .select2-selection__rendered { line-height: 30px; font-size: 13px; }
.form-select-sm + .select2-container .select2-selection--single .select2-selection__arrow { display: none !important; }
.select2-container .select2-results__option { font-size: .75rem; }
.select2-container .select2-search--dropdown .select2-search__field { font-size: .75rem; }


/*〔存查 s0165〕*/
.daterangepicker {
  background: hsl(var(--popover)) !important;
  color: hsl(var(--popover-foreground)) !important;
  border: 1px solid hsl(var(--border)) !important;
  border-radius: var(--radius-md);   /* shadcn PopoverContent = rounded-md */
  box-shadow: 0 8px 24px -6px rgb(0 0 0 / 0.25);
  font-family: inherit;
  font-size: 13px;
}
/* 小箭頭 */
.daterangepicker:before { border-bottom-color: hsl(var(--border)) !important; }
.daterangepicker:after { border-bottom-color: hsl(var(--popover)) !important; }
.daterangepicker.drop-up:before { border-top-color: hsl(var(--border)) !important; }
.daterangepicker.drop-up:after { border-top-color: hsl(var(--popover)) !important; }

/* 月曆表頭（月份標題 / 星期） */
.daterangepicker .calendar-table {
  background: hsl(var(--popover)) !important;
  border: 0 !important;
}
.daterangepicker th,
.daterangepicker .month {
  color: hsl(var(--foreground)) !important;
  font-weight: 500;
}
.daterangepicker th.available:hover { background: hsl(var(--accent)) !important; }
/* 上/下月箭頭 */
.daterangepicker .prev span,
.daterangepicker .next span { border-color: hsl(var(--foreground)) !important; }

/* 日期格 */
.daterangepicker td {
  background: transparent !important;
  color: hsl(var(--foreground)) !important;
  border-radius: var(--radius-md);
}
.daterangepicker td.available:hover {
  background: hsl(var(--accent)) !important;
  color: hsl(var(--accent-foreground)) !important;
}
.daterangepicker td.off,
.daterangepicker td.off.in-range,
.daterangepicker td.off.start-date,
.daterangepicker td.off.end-date {
  background: transparent !important;
  color: hsl(var(--muted-foreground) / .5) !important;
}
.daterangepicker td.active,
.daterangepicker td.active:hover,
.daterangepicker td.start-date,
.daterangepicker td.end-date {
  background: hsl(var(--dark)) !important;
  color: hsl(var(--dark-foreground)) !important;
}
.daterangepicker td.in-range {
  background: hsl(var(--accent)) !important;
  color: hsl(var(--accent-foreground)) !important;
}
.daterangepicker td.today { font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.daterangepicker td.disabled { color: hsl(var(--muted-foreground) / .4) !important; text-decoration: line-through; }

/* 年/月下拉（showDropdowns） */
.daterangepicker select {
  background: hsl(var(--background)) !important;
  color: hsl(var(--foreground)) !important;
  border: 1px solid hsl(var(--input)) !important;
  border-radius: var(--radius-md);
  padding: 2px 4px;
}
.daterangepicker select option { background: hsl(var(--popover)); color: hsl(var(--popover-foreground)); }

/* 時間選擇 */
.daterangepicker .calendar-time select { margin: 0 2px; }

/* 快捷區間清單 */
.daterangepicker .ranges { background: hsl(var(--popover)) !important; }
.daterangepicker .ranges li {
  color: hsl(var(--foreground)) !important;
  border-radius: var(--radius-sm);
}
.daterangepicker .ranges li:hover { background: hsl(var(--accent)) !important; color: hsl(var(--accent-foreground)) !important; }
.daterangepicker .ranges li.active { background: hsl(var(--dark)) !important; color: hsl(var(--dark-foreground)) !important; }

/* 底部按鈕列 */
.daterangepicker .drp-buttons {
  background: hsl(var(--popover)) !important;
  border-top: 1px solid hsl(var(--border)) !important;
}
.daterangepicker .drp-selected { color: hsl(var(--muted-foreground)) !important; }
.daterangepicker .drp-buttons .btn { font-weight: 500; }


/*〔存查 s0166〕*/
/* Bootstrap 的 .rounded 本來就等於 --bs-border-radius(=--radius)，
   原本硬加 +2px 讓它跟這個 token 對不起來 —— 收回 lg 這一階。 */
.rounded, .rounded-3 { border-radius: var(--radius-lg) !important; }
.rounded-pill { border-radius: 9999px !important; }
.border { border-color: hsl(var(--border)) !important; }
.shadow, .shadow-sm { box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.08), 0 1px 2px -1px rgb(0 0 0 / 0.06) !important; }
.bg-light { background-color: hsl(var(--muted)) !important; }
/*〔存查 s0167〕*/
.text-primary, a.text-primary { color: hsl(var(--foreground)) !important; }
/* 文字用 --destructive-fg，不是 --destructive（後者是底色 token，白底上只有 3.76:1）。
   旁邊的 .text-success 早就是走 --success-fg，這裡本來就該對齊。 */
/*〔存查 s0168〕*/
.text-danger { color: hsl(var(--destructive-fg)) !important; }
/*〔存查 s0169〕*/
.text-success { color: hsl(var(--success-fg)) !important; }


/*〔存查 s0170〕*/
/* 按鈕：藍/青/靛/紫/aqua → 近黑主要動作鈕（編輯/檢視等） */
.btn.bg-blue, .btn.bg-aqua, .btn.bg-cyan, .btn.bg-teal,
.btn.bg-indigo, .btn.bg-purple, .btn.bg-info, .btn.bg-blue-600, .btn.bg-blue-700 {
  background-color: hsl(var(--dark)) !important;
  border-color: hsl(var(--dark)) !important;
  color: hsl(var(--dark-foreground)) !important;
}
.btn.bg-green, .btn.bg-lime, .btn.bg-success { background-color: hsl(var(--success)) !important; border-color: hsl(var(--success)) !important; color: hsl(var(--success-foreground)) !important; }
.btn.bg-red, .btn.bg-pink, .btn.bg-danger { background-color: hsl(var(--destructive)) !important; border-color: hsl(var(--destructive)) !important; color: hsl(var(--destructive-foreground)) !important; }
.btn.bg-orange, .btn.bg-yellow, .btn.bg-warning { background-color: hsl(var(--warning)) !important; border-color: hsl(var(--warning)) !important; color: hsl(var(--warning-foreground)) !important; }
.btn.bg-grey, .btn.bg-gray, .btn.bg-silver, .btn.bg-default, .btn.bg-secondary {
  background-color: hsl(var(--secondary)) !important; border-color: hsl(var(--border)) !important; color: hsl(var(--secondary-foreground)) !important;
}
.btn.bg-dark, .btn.bg-black { background-color: hsl(var(--dark)) !important; border-color: hsl(var(--dark)) !important; color: hsl(var(--dark-foreground)) !important; }
/* badge 上的 Color Admin 鮮色 */
.badge.bg-blue, .badge.bg-aqua, .badge.bg-cyan, .badge.bg-teal, .badge.bg-indigo, .badge.bg-purple, .badge.bg-info { background: hsl(var(--dark)) !important; color: hsl(var(--dark-foreground)) !important; }
/*〔存查 s0171〕*/
.badge.bg-green, .badge.bg-lime { background: hsl(var(--success)) !important; color: hsl(var(--success-foreground)) !important; }
/*〔存查 s0172〕*/
.badge.bg-orange, .badge.bg-yellow { background: hsl(var(--warning)) !important; color: hsl(var(--warning-foreground)) !important; }
/*〔存查 s0173〕*/
.badge.bg-red, .badge.bg-pink { background: hsl(var(--destructive)) !important; color: hsl(var(--destructive-foreground)) !important; }
/*〔存查 s0174〕*/
.badge.bg-grey, .badge.bg-gray, .badge.bg-silver, .badge.bg-default { background: hsl(var(--secondary)) !important; color: hsl(var(--secondary-foreground)) !important; }
/*〔存查 s0175〕*/
.badge.bg-grey, .badge.bg-gray, .badge.bg-silver { background: hsl(var(--muted)) !important; color: hsl(var(--muted-foreground)) !important; }
/* 文字語意色：保留語意但用 token 色值。
   藍/靛/紫等資訊色原版模板映到 primary → 本主題若映到金黃，白底上完全讀不到 → 用 --foreground */
/*〔存查 s0176〕*/
.text-blue, .text-indigo, .text-purple, .text-teal, .text-cyan, .text-aqua, .text-info { color: hsl(var(--foreground)) !important; }
.text-green, .text-lime { color: hsl(var(--success-fg)) !important; }
/*〔存查 s0177〕*/
.text-red, .text-pink { color: hsl(var(--destructive-fg)) !important; }   /* 同 .text-danger：文字走 -fg */
/*〔存查 s0178〕*/
.text-orange, .text-yellow, .text-warning { color: hsl(var(--warning-fg)) !important; }
/* Color Admin 灰階文字（merp §2 L99） */
.text-gray-500, .text-gray-600, .text-gray-700 { color: hsl(var(--muted-foreground)) !important; }


/*〔存查 s0179〕*/

:root {
    --fb-sidebar-w: 220px;
    --fb-header-h: 50px;
}

body { background: hsl(var(--background)); }

/* 頂 bar：固定 */
#header.app-header {
    position: fixed;
    top: 0; left: 0; right: 0;
    height: var(--fb-header-h);
    z-index: 1020;
    display: flex;
    align-items: center;
    /*〔存查 s0180〕*/
    background: hsl(var(--card));
    /*〔存查 s0181〕*/
    border-bottom: 1px solid hsl(var(--border));
    box-shadow: none;
    padding: 0;
}
#header .navbar-header {
    width: var(--fb-sidebar-w);
    display: flex;
    align-items: center;
    padding: 0 1rem;
    flex: 0 0 var(--fb-sidebar-w);
}
#header .navbar-brand {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-weight: 700;
    color: hsl(var(--foreground));
    text-decoration: none;
    padding: 0;
}
#header .navbar-nav {
    display: flex;
    align-items: center;
    flex-direction: row;
    margin-left: auto;
    padding-right: 1rem;
    gap: .25rem;
}
#header .navbar-nav .navbar-item { list-style: none; display: flex; align-items: center; }
#header .navbar-nav .navbar-link,
#header .navbar-nav .nav-link {
    color: hsl(var(--muted-foreground));
    padding: .5rem .75rem;
    border-radius: var(--radius);
    display: flex;
    align-items: center;
}
#header .navbar-nav .navbar-link:hover,
#header .navbar-nav .nav-link:hover { background: hsl(var(--accent)); color: hsl(var(--accent-foreground)); }
#header .navbar-nav .dropdown-menu { border: 1px solid hsl(var(--border)); box-shadow: 0 8px 24px rgb(0 0 0 / .08); }
#header .navbar-mobile-toggler { display: none; background: none; border: 0; color: hsl(var(--foreground)); }

/* 側欄：固定，頂 bar 下方 */
#sidebar.app-sidebar {
    position: fixed;
    top: var(--fb-header-h);
    bottom: 0;
    left: 0;
    width: var(--fb-sidebar-w);
    padding-top: 0;
    z-index: 1010;
    overflow-y: auto;
    overscroll-behavior: contain;
}
#sidebar .app-sidebar-content { height: auto; }
/* SidebarGroup = p-2（原本上下 12px、左右 8px，上下多出來的 4px 沒有依據） */
#sidebar .menu { padding: .5rem; }
/*〔存查 s0182〕*/
#sidebar .menu-header {
    font-size: 11px;
    letter-spacing: .04em;
    padding: .5rem .75rem;
}
#sidebar .menu-item { position: relative; }
#sidebar .menu-link {
    display: flex;
    align-items: center;
    /*〔存查 s0183〕*/
    height: 32px;               /* h-8 —— 固定高，不讓 line-height 把它撐成 36px */
    gap: .5rem;                 /* gap-2 = 8px（原 10px） */
    padding: .5rem;             /* p-2 = 8px */
    border-radius: var(--radius-md);   /* rounded-md：10 - 2 = 8px（原本吃整顆 10px） */
    font-size: 14px;            /* text-sm */
    text-decoration: none;
    margin-bottom: .25rem;      /* SidebarMenu gap-1 = 4px（原 1px） */
}
/*〔存查 s0184〕*/
#sidebar .menu-icon { width: 18px; text-align: center; flex: 0 0 18px; }
#sidebar .menu-text { flex: 1; }
#sidebar .menu-caret {
    margin-left: auto;
    transition: transform .15s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
}
/* 展開箭頭改用「純 CSS 邊框 chevron」，不依賴 Font Awesome 字型
   （merp 遷移 lucide 後 FA 已移除，原 \f054 字符變 tofu 隱形；
     肥肥雖仍有 Color Admin 的 FA，純 CSS chevron 也一樣正確且更穩） */
#sidebar .menu-caret::before {
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(-45deg);
    margin-left: -2px;
}
/*〔存查 s0185〕*/
#sidebar .menu-item.expand > .menu-link .menu-caret { transform: rotate(90deg); }

/* 子選單：預設收合，.expand 展開（取代 Color Admin app.min.js 的行為）
   ※ Color Admin app.min.js 仍在時，它用 jQuery slideDown 寫 inline display
      → inline 勝出，動畫照常，兩者不衝突 */
/*〔存查 s0186〕*/
#sidebar .menu-submenu { display: none; padding-left: 1.75rem; }
#sidebar .menu-item.expand > .menu-submenu { display: block; }
#sidebar .menu-submenu .menu-link {
    font-size: 13px;
    padding: .375rem .75rem;
    /*〔存查 s0187〕*/
    color: hsl(var(--sidebar-fg) / .9);
}
/* 修原版模板的 bug：原版模板這裡寫 hsl(var(--sidebar-active-fg))，但該 token 從未定義過
   （亮暗兩組都沒有）→ 整條 color 宣告無效被丟棄。本主題改用實際存在的 --sidebar-fg-strong。 */
#sidebar .menu-submenu .menu-item.active > .menu-link {
    /*〔存查 s0188〕*/
    color: hsl(var(--sidebar-fg-strong));
    /*〔存查 s0189〕*/
    background: hsl(var(--sidebar-active-bg));
}

/*〔存查 s0190〕*/
#content.app-content {
    margin-left: var(--fb-sidebar-w);
    padding: 1rem 1.5rem 1.5rem;
    min-height: 100vh;
}

/* RWD：側欄收成抽屜 */
@media (max-width: 991.98px) {
    #header .navbar-header { width: auto; flex: 0 0 auto; }
    /* 漢堡鈕三條槓：.icon-bar 樣式原本在 Color Admin app.min.css，拔掉後沒人補
       → span 全塌成 0 高、按鈕剩 12px 寬，手機上看不到也點不到（= 無法開選單） */
    #header .navbar-mobile-toggler {
        /* 漢堡鈕排到 navbar-header 最左（brand 前）：手機慣例＝選單開關在最左邊。
           order:-1 讓它在 flex 內排第一，margin 收左移右。桌機此鈕 display:none 不受影響。 */
        display: inline-flex; flex-direction: column; justify-content: center; gap: 4px;
        order: -1; margin-left: 0; margin-right: .35rem; padding: 10px 12px 10px 0; cursor: pointer;
    }
    #header .navbar-mobile-toggler .icon-bar {
        display: block; width: 20px; height: 2px; border-radius: 1px;
        background: hsl(var(--foreground));
    }
    /*〔存查 s0191〕*/
    :root { --fb-sidebar-w: 288px; }
    #sidebar.app-sidebar {
        /*〔存查 s0192〕*/
        top: 0;
        transform: translateX(-100%);
        transition: transform .2s ease;
        box-shadow: 0 0 24px rgb(0 0 0 / .18);
    }
    /* 兩種 hook 都吃：body.sidebar-open（merp 自家 JS）／
       .app.app-sidebar-mobile-toggled（Color Admin app.min.js，肥肥目前用這個） */
    body.sidebar-open #sidebar.app-sidebar,
    /*〔存查 s0193〕*/
    body.app-sidebar-mobile-toggled #sidebar.app-sidebar,
    .app.app-sidebar-mobile-toggled #sidebar.app-sidebar { transform: translateX(0); }
    #content.app-content { margin-left: 0; padding-left: 1rem; padding-right: 1rem; }
      /* 本專案走 _nav 的實體遮罩元素（它同時負責變暗與「點一下關閉」），
         這裡不再疊 ::after —— 會變成雙重變暗，而且 ::after 攔不到點擊。
         下面 body.sidebar-open::after 留給原版模板那套。 */
    body.sidebar-open::after,
    .app.app-sidebar-mobile-toggled::after {
        content: "";
        position: fixed; inset: var(--fb-header-h) 0 0 0;
        background: rgb(0 0 0 / .35);
        z-index: 1005;
    }
}

/* 亮/暗切換鈕的圖示互斥顯示 */
.d-block-dark { display: none !important; }
html.dark .d-none-dark { display: none !important; }
html.dark .d-block-dark { display: inline-block !important; }

/* 品牌識別：Pace 頁面載入進度條維持品牌金黃（--bs-app-theme 已在 §1 remap，
   這裡再明確寫一次，蓋掉版面樣板的 inline `var(--bs-yellow)`）。 */
.pace .pace-progress { background: hsl(var(--primary)) !important; }


/*〔存查 s0194〕*/

/* 卡片頭尾、表頭：原本寫死 background:#fff !important（暗色會白底白字看不見） */
.card-header,
.card-footer {
    background: hsl(var(--card)) !important;
    color: hsl(var(--card-foreground));
    border-color: hsl(var(--border));
}
/*〔存查 s0195〕*/
.table tbody th,
.table tfoot th {
    background: hsl(var(--card)) !important;
    color: hsl(var(--muted-foreground)) !important;
    border-bottom: 1px solid hsl(var(--border));
    font-weight: 500;
}

/* 表格：shadcn（去外框、橫線分隔、hover accent） */
.table { color: hsl(var(--foreground)); border-color: hsl(var(--border)); --bs-table-bg: transparent; }
.table > :not(caption) > * > * {
    background-color: transparent;
    border-bottom-color: hsl(var(--border));
    box-shadow: none;
    color: hsl(var(--foreground));
}
.table-hover > tbody > tr:hover > * { background-color: hsl(var(--accent)) !important; color: hsl(var(--accent-foreground)); }

/* 卡片：暗色下要看得出邊界 */
.card {
    background: hsl(var(--card));
    color: hsl(var(--card-foreground));
    border: 1px solid hsl(var(--border));
}
.card.border-0 { border: 1px solid hsl(var(--border)) !important; }

/* page-header（原 inline style，保留版型、去寫死色） */
.page-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    border-bottom: none;
    padding-bottom: 0;
    color: hsl(var(--foreground));
}
.page-header h4 { margin: 0; font-weight: 600; }

/* 按鈕內圖示一律繼承按鈕前景色 —— 殺掉 view 裡寫死的 text-white
   （本主題 .btn-primary 是黃底黑字，白 icon 會直接隱形；.btn-dark 在暗色是淺底，
     白 icon 一樣消失。uiux.md 的 <i class="fas fa-pen text-white"> 就是這個雷） */
.btn i,
.btn .fa,
.btn .fas,
.btn .far,
.btn .fab,
.btn span { color: inherit !important; }

/* 密碼欄 / 複製鈕（原 inline style） */
/*〔存查 s0196〕*/
.password-field { font-family: monospace; letter-spacing: 1px; }
/*〔存查 s0197〕*/
.btn-copy { cursor: pointer; }
/*〔存查 s0198〕*/
.btn-copy:hover { color: hsl(var(--foreground)); }


/*〔存查 s0199〕*/
.badge {
    font-weight: 500;
    /*〔存查 s0200〕*/
    border-radius: 9999px;
    /*〔存查 s0201〕*/
    font-size: 12px;
    padding: .25em .6em;
    border: 1px solid transparent;
}
/* 主要/啟用狀態 = shadcn default（近黑／暗色反轉為白） */
.badge.bg-success,
.badge.bg-primary,
.badge.bg-dark {
    background: hsl(var(--dark)) !important;
    color: hsl(var(--dark-foreground)) !important;
}
/* 次要/停用/中性 = shadcn secondary */
.badge.bg-secondary,
.badge.bg-info,
.badge.bg-light,
.badge.bg-warning {
    /* 已被 background→L4574(hsl(var(--secondary)) !important)、background→L4562(hsl(var(--warning-bg)) !important) 覆蓋 */
    background: hsl(var(--secondary)) !important;
    /* 已被 color→L4574(rgb(9, 9, 11))、color→L4562(rgb(152, 89, 16)) 覆蓋 */
    color: hsl(var(--secondary-foreground)) !important;
    border-color: hsl(var(--border));
}
/* 只有真正的錯誤保留紅色 */
.badge.bg-danger {
    /*〔存查 s0202〕*/
    background: hsl(var(--destructive)) !important;
    /*〔存查 s0203〕*/
    color: hsl(var(--destructive-foreground)) !important;
}
.badge.bg-light.text-dark { color: hsl(var(--secondary-foreground)) !important; }

/* 進度條：軌道 muted、填充 --dark；語意色僅保留 danger/warning 的深淺差異 */
.progress { background: hsl(var(--muted)); }
.progress-bar { background-color: hsl(var(--dark)); }
.progress-bar.bg-success { background-color: hsl(var(--dark)) !important; }
.progress-bar.bg-warning { background-color: hsl(var(--muted-foreground)) !important; }
.progress-bar.bg-danger { background-color: hsl(var(--destructive)) !important; }
/* merp 這條用 hsl(var(--border)) 當填充色 → 對比 1.2:1 等於沒填充，改 muted-foreground 淡版 */
.progress-bar.bg-secondary { background-color: hsl(var(--muted-foreground) / .4) !important; }


/* =============================================================================
 * §25 側欄區隔 + 元件暗色可讀性（移植自 merp §25 L1640-1688）
 * 側欄/頂 bar 一律吃 token（亮色淺底、暗色深底，自動翻轉）
 * ============================================================================= */
#sidebar.app-sidebar,
.app-sidebar,
.app-sidebar-bg {
    background: hsl(var(--sidebar-bg)) !important;
    border-right: 1px solid hsl(var(--sidebar-border));
}
#header.app-header {
    background: hsl(var(--card)) !important;
    border-bottom: 1px solid hsl(var(--border));
}

/* 表單元件在暗色的可讀性（Bootstrap 預設白底） */
.form-control, .form-select {
    /*〔存查 s0204〕*/
    background-color: hsl(var(--background));
    border-color: hsl(var(--input));
    color: hsl(var(--foreground));
}
.form-control:focus, .form-select:focus {
    background: hsl(var(--background));
    color: hsl(var(--foreground));
    border-color: hsl(var(--ring));
}
.form-control::placeholder { color: hsl(var(--hint)); }
.input-group-text {
    background: hsl(var(--muted));
    border-color: hsl(var(--input));
    /*〔存查 s0205〕*/
    color: hsl(var(--muted-foreground));
}
.dropdown-menu {
    background: hsl(var(--popover));
    border: 1px solid hsl(var(--border));
    color: hsl(var(--popover-foreground));
}
.dropdown-item { color: hsl(var(--popover-foreground)); }
.dropdown-item:hover, .dropdown-item:focus { background: hsl(var(--accent)); color: hsl(var(--accent-foreground)); }
.modal-content { background: hsl(var(--card)); color: hsl(var(--card-foreground)); border: 1px solid hsl(var(--border)); }
.modal-header, .modal-footer { border-color: hsl(var(--border)); }
.alert { border: 1px solid hsl(var(--border)); background: hsl(var(--muted)); color: hsl(var(--foreground)); }
/*〔存查 s0206〕*/
.alert-success, .alert-info { background: hsl(var(--muted)); color: hsl(var(--foreground)); }
/*〔存查 s0207〕*/
.alert-danger { background: hsl(var(--destructive) / .12); color: hsl(var(--destructive-fg)); border-color: hsl(var(--destructive) / .3); }
.list-group-item { background: hsl(var(--card)); color: hsl(var(--card-foreground)); border-color: hsl(var(--border)); }
/* nav-tabs 底線式（取代 _link.blade.php inline 寫死的 #6c757d / #212529）
   轉換：選中底線原版模板用 primary → 本主題用 --foreground
     （底線是「線」不是「底」，用金黃在白底上幾乎看不見） */
.nav-tabs { border-bottom-color: hsl(var(--border)); }
.nav-tabs .nav-link { color: hsl(var(--muted-foreground)); border: 0; border-bottom: 2px solid transparent; }
.nav-tabs .nav-link:hover { border-bottom-color: hsl(var(--border)); }
.nav-tabs .nav-link.active {
    color: hsl(var(--foreground));
    background: transparent;
    border: 0;
    border-bottom: 2px solid hsl(var(--foreground));
    font-weight: 600;
}
.card-header-tabs { margin-bottom: -1px; }


/*〔存查 s0208〕*/

/* ---- 按鈕：全部收斂 ---- */
/* 注意：這裡「不」重複宣告 .btn-primary / .btn-dark，避免蓋掉 §4 拆開後的黃/黑分工。
   §4 已給完整 bg/hover/active/disabled，此處只補其餘色系。 */
/*〔存查 s0209〕*/
.btn-success, .btn-info, .btn-warning, .btn-white, .btn-secondary, .btn-light,
.btn-outline-secondary, .btn-outline-success, .btn-outline-info, .btn-outline-warning, .btn-outline-primary, .btn-outline-dark {
    --bs-btn-bg: hsl(var(--secondary)); --bs-btn-border-color: hsl(var(--border)); --bs-btn-color: hsl(var(--secondary-foreground));
    --bs-btn-hover-bg: hsl(var(--accent)); --bs-btn-hover-border-color: hsl(var(--border)); --bs-btn-hover-color: hsl(var(--accent-foreground));
    --bs-btn-active-bg: hsl(var(--accent)); --bs-btn-active-color: hsl(var(--accent-foreground));
}
.btn-danger, .btn-outline-danger {
    --bs-btn-bg: hsl(var(--destructive)); --bs-btn-border-color: hsl(var(--destructive)); --bs-btn-color: hsl(var(--destructive-foreground));
    --bs-btn-hover-bg: hsl(var(--destructive) / .9); --bs-btn-hover-border-color: hsl(var(--destructive) / .9); --bs-btn-hover-color: hsl(var(--destructive-foreground));
}
/* merp 用 hsl(var(--border)) 當底線色（對比 1.2:1 看不見）→ 改 muted-foreground */
.btn-link { color: hsl(var(--foreground)); text-decoration-color: hsl(var(--muted-foreground) / .45); }
.btn {
    /*〔存查 s0210〕*/
    border-radius: var(--radius-md);
    font-weight: 500;
}
/*〔存查 s0211〕*/
.btn:focus-visible { border-color: hsl(var(--ring)); box-shadow: 0 0 0 3px hsl(var(--ring) / .5); }
/*〔存查 s0212〕*/
/* pointer-events 已整條移除：本專案有「用 jQuery 綁 click 的 span pill」
   （限時特賣啟用/停用切換等），沒有 onclick 屬性可判別 → 任何屬性層面的
   :not() 防護都會漏。視覺收斂可以做，但絕不准碰點擊行為。 */
/*〔存查 s0213〕*/
span.btn.btn-rounded.rounded-pill,
span.btn.rounded-pill {
    background: hsl(var(--secondary)) !important;
    border-color: hsl(var(--border)) !important;
    color: hsl(var(--secondary-foreground)) !important;
    font-weight: 500;
}

/* ---- 背景 utility（非 badge/btn）---- */
/*〔存查 s0214〕*/
.bg-primary:not(.badge):not(.btn):not(.progress-bar) { background-color: hsl(var(--secondary)) !important; color: hsl(var(--secondary-foreground)) !important; }
.bg-success:not(.badge):not(.btn):not(.progress-bar) { background-color: hsl(var(--success) / .14) !important; color: hsl(var(--foreground)) !important; }
.bg-info:not(.badge):not(.btn):not(.progress-bar)    { background-color: hsl(var(--info) / .13) !important; color: hsl(var(--foreground)) !important; }
.bg-warning:not(.badge):not(.btn):not(.progress-bar) { background-color: hsl(var(--warning) / .16) !important; color: hsl(var(--foreground)) !important; }
.bg-light:not(.badge):not(.btn) { background-color: hsl(var(--muted)) !important; color: hsl(var(--foreground)) !important; }
.bg-white { background-color: hsl(var(--card)) !important; }
/* 原版模板用 primary（近黑）；本主題用 --dark，否則 bg-dark 會變成黃色區塊 */
.bg-dark:not(.badge):not(.btn) { background-color: hsl(var(--dark)) !important; color: hsl(var(--dark-foreground)) !important; }

/* ---- 文字語意色：保留語意，改用柔和 token 色值（暗色自動翻轉）---- */
.text-success { color: hsl(var(--success-fg)) !important; }
.text-warning { color: hsl(var(--warning-fg)) !important; }
.text-info, .text-primary { color: hsl(var(--foreground)) !important; }
.text-danger { color: hsl(var(--destructive-fg)) !important; }   /* 同上：紅「字」走 -fg token */
.text-muted, .text-secondary { color: hsl(var(--muted-foreground)) !important; }
.text-dark, .text-black { color: hsl(var(--foreground)) !important; }
/*〔存查 s0215〕*/
.text-white { color: hsl(var(--dark-panel-foreground)) !important; }

/* ---- Alert：shadcn（細框 + 淡底，不用鮮色）---- */
.alert-success, .alert-info, .alert-primary, .alert-secondary, .alert-light {
    background: hsl(var(--muted)) !important;
    color: hsl(var(--foreground)) !important;
    border: 1px solid hsl(var(--border)) !important;
}
.alert-warning {
    background: hsl(var(--warning-bg)) !important;
    color: hsl(var(--warning-fg)) !important;
    border: 1px solid hsl(var(--warning-fg) / .25) !important;
}
.alert-danger {
    background: hsl(var(--destructive) / .1) !important;
    color: hsl(var(--destructive-fg)) !important;
    border: 1px solid hsl(var(--destructive) / .25) !important;
}


/*〔存查 s0216〕*/
/*〔存查 s0217〕*/
.stat-pill, .status-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 500;
    background: hsl(var(--secondary));
    color: hsl(var(--secondary-foreground));
    border: 1px solid hsl(var(--border));
}
/*〔存查 s0218〕*/
.stat-pill .n, .status-pill .n { font-size: 14px; font-weight: 600; }
/*〔存查 s0219〕*/
.stat-pill.status-working, .status-working { background: hsl(var(--success-bg)) !important; color: hsl(var(--success-fg)) !important; border-color: hsl(var(--success-fg) / .2) !important; }
/*〔存查 s0220〕*/
.stat-pill.status-off, .status-off { background: hsl(var(--muted)) !important; color: hsl(var(--muted-foreground)) !important; }
/*〔存查 s0221〕*/
.stat-pill.status-leave, .status-leave { background: hsl(var(--warning-bg)) !important; color: hsl(var(--warning-fg)) !important; border-color: hsl(var(--warning-fg) / .2) !important; }
/*〔存查 s0222〕*/
.stat-pill.status-late, .status-late,
.stat-pill.status-early, .status-early { background: hsl(var(--warning-bg)) !important; color: hsl(var(--warning-fg)) !important; border-color: hsl(var(--warning-fg) / .2) !important; }
/*〔存查 s0223〕*/
.stat-pill.status-absent, .status-absent { background: hsl(var(--destructive) / .1) !important; color: hsl(var(--destructive-fg)) !important; border-color: hsl(var(--destructive) / .2) !important; }
/*〔存查 s0224〕*/
.stat-pill.status-none, .status-none { background: hsl(var(--muted)) !important; color: hsl(var(--muted-foreground)) !important; }

/*〔存查 s0225〕*/
/*〔存查 s0226〕*/
.btn-cta-primary { background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); border: 1px solid hsl(var(--primary)); }
/*〔存查 s0227〕*/
.btn-cta-primary:hover, .btn-cta-primary:focus { background: hsl(var(--primary-light)); color: hsl(var(--primary-foreground)); border-color: hsl(var(--primary-light)); }
/*〔存查 s0228〕*/

/*〔存查 s0229〕*/
.btn-cta-secondary { background: hsl(var(--dark)); color: hsl(var(--dark-foreground)); border: 1px solid hsl(var(--dark)); }
/*〔存查 s0230〕*/
.btn-cta-secondary:hover, .btn-cta-secondary:focus { background: hsl(var(--dark) / .88); color: hsl(var(--dark-foreground)); border-color: hsl(var(--dark) / .88); }
.btn-cta-secondary:active { background: hsl(var(--dark) / .8); color: hsl(var(--dark-foreground)); border-color: hsl(var(--dark) / .8); }
/*〔存查 s0231〕*/
.btn-cta-ghost { background: transparent; color: hsl(var(--muted-foreground)); border: 1px solid hsl(var(--border)); }
/*〔存查 s0232〕*/
.btn-cta-ghost:hover, .btn-cta-ghost:focus { background: hsl(var(--accent)); color: hsl(var(--accent-foreground)); }
/*〔存查 s0233〕*/
.ck-step { border: 1px solid hsl(var(--border)); border-radius: var(--radius-xl); padding: 16px; height: 100%; display: flex; flex-direction: column; gap: .5rem; background: hsl(var(--card)); }
/*〔存查 s0234〕*/
.ck-step-num { width: 26px; height: 26px; border-radius: 50%; background: hsl(var(--dark)); color: hsl(var(--dark-foreground)); font-weight: 700; font-size: .8rem; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
/*〔存查 s0235〕*/
.ck-step .ck-step-desc { color: hsl(var(--muted-foreground)); font-size: .82rem; flex-grow: 1; }
/*〔存查 s0236〕*/
.ck-step-tag { font-size: .72rem; color: hsl(var(--muted-foreground)); border: 1px solid hsl(var(--border)); border-radius: 9999px; padding: 1px 8px; }
/*〔存查 s0237〕*/
.ck-step code.ck-cmd { background: hsl(var(--muted)); padding: 2px 6px; border-radius: 6px; }
/* 點開式 FAQ（details/summary，免 JS） */
/*〔存查 s0238〕*/
.ck-faq details { border: 1px solid hsl(var(--border)); border-radius: 8px; padding: .55rem .9rem; margin-bottom: .5rem; background: hsl(var(--card)); }
/*〔存查 s0239〕*/
.ck-faq details:last-child { margin-bottom: 0; }
/*〔存查 s0240〕*/
.ck-faq summary { cursor: pointer; font-weight: 600; font-size: .9rem; }
/*〔存查 s0241〕*/
.ck-faq details[open] summary { margin-bottom: .5rem; }
/*〔存查 s0242〕*/
.ck-faq details > *:not(summary) { font-size: .875rem; }

/*〔存查 s0243〕*/
@media (max-width: 575.98px) {
  /* 表格常掛 .text-nowrap（!important）→ 這裡必須同強度反制，否則長提示字撐爆寬度 */
  .table-stack-sm, .table-stack-sm td, .table-stack-sm small { white-space: normal !important; }
  .table-stack-sm tbody, .table-stack-sm tr, .table-stack-sm td { display: block; width: 100% !important; }
  .table-stack-sm tr { padding: .55rem .85rem; border-bottom: 1px solid hsl(var(--border)); }
  .table-stack-sm tr:last-child { border-bottom: 0; }
  .table-stack-sm td { border: 0 !important; padding: 0; }
  .table-stack-sm td:first-child { font-size: .78rem; color: hsl(var(--muted-foreground)); padding-bottom: 2px; }
  .table-stack-sm td:first-child .col-form-label { padding: 0; font-size: inherit; color: inherit; }
}

/*〔存查 s0244〕*/
* { scrollbar-width: thin; scrollbar-color: hsl(var(--border)) transparent; }
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb { background: hsl(var(--border)); border-radius: 4px; }
*::-webkit-scrollbar-thumb:hover { background: hsl(var(--muted-foreground) / .5); }
*::-webkit-scrollbar-corner { background: transparent; }


/*〔存查 s0245〕*/
.table th,
.table thead th {
    white-space: nowrap;
}
/* 內容欄可換行（長文字/備註），其餘 td 預設不換行以維持整齊 */
.table td { white-space: nowrap; }
.table td.text-wrap,
.table td .text-wrap,
.table td.wrap,
.table td p,
.table td .quill-content { white-space: normal; }
/* 表格容器：超寬時橫向捲動（不要壓縮欄位） */
.table-responsive { -webkit-overflow-scrolling: touch; }


/*〔存查 s0246〕*/
code {
    background: hsl(var(--muted));
    color: hsl(var(--foreground));
    padding: .15em .4em;
    border-radius: var(--radius-sm);
    font-size: .875em;
}
a code, .btn code { background: transparent; padding: 0; }
kbd {
    background: hsl(var(--muted));
    color: hsl(var(--foreground));
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius-sm);
    box-shadow: none;
}
pre {
    background: hsl(var(--muted));
    color: hsl(var(--foreground));
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
    padding: .75rem 1rem;
}
pre code { background: transparent; padding: 0; }

/* 語意標籤（假別/狀態 chip）：柔和淡底 + 深字，不要用鮮豔實心底 */
.tag, .info-list .tag {
    display: inline-block;
    padding: .1rem .45rem;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 500;
    border: 1px solid transparent;
}

/* list-group 語意色（Bootstrap 預設是鮮豔藍/綠/黃底）→ shadcn 收斂 */
.list-group-item-primary, .list-group-item-info, .list-group-item-secondary, .list-group-item-light {
    background: hsl(var(--muted)) !important;
    color: hsl(var(--foreground)) !important;
    border-color: hsl(var(--border)) !important;
}
.list-group-item-success { background: hsl(var(--success-bg)) !important; color: hsl(var(--success-fg)) !important; }
.list-group-item-warning { background: hsl(var(--warning-bg)) !important; color: hsl(var(--warning-fg)) !important; }
.list-group-item-danger  { background: hsl(var(--destructive) / .1) !important; color: hsl(var(--destructive-fg)) !important; }
.list-group-item.active  { background: hsl(var(--dark)) !important; color: hsl(var(--dark-foreground)) !important; border-color: hsl(var(--dark)) !important; }


/*〔存查 s0247〕*/
.form-check-input {
    background-color: hsl(var(--background));
    border: 1px solid hsl(var(--muted-foreground) / .55);
    box-shadow: none;
}
.form-check-input:hover { border-color: hsl(var(--foreground) / .7); }
.form-check-input:focus {
    border-color: hsl(var(--ring));
    box-shadow: 0 0 0 3px hsl(var(--ring) / .5);   /* §S-73：原 `0 0 0 2px hsl(var(--ring) / .25)`，改官方 3px + /50 */
}
.form-check-input:checked {
    background-color: hsl(var(--dark));
    border-color: hsl(var(--dark));
}
/* 勾勾 / 圓點：用 --dark-foreground 的實色（暗色下 --dark 是白底 → 勾要是深色） */
.form-check-input:checked[type="checkbox"] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fafafa' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}
html.dark .form-check-input:checked[type="checkbox"] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%2318181b' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}
.form-check-input:checked[type="radio"] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fafafa'/%3e%3c/svg%3e");
}
html.dark .form-check-input:checked[type="radio"] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%2318181b'/%3e%3c/svg%3e");
}
/* Switch：未勾的軌道要有足夠對比（--muted 在白底上僅 1.05:1，等於看不見） */
/*〔存查 s0248〕*/
.form-switch .form-check-input {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23ffffff'/%3e%3c/svg%3e");
    background-color: hsl(var(--muted-foreground) / .45);
    border-color: transparent;
}
.form-switch .form-check-input:hover { background-color: hsl(var(--muted-foreground) / .6); }
.form-switch .form-check-input:checked {
    background-color: hsl(var(--dark));
    border-color: hsl(var(--dark));
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fafafa'/%3e%3c/svg%3e");
}
html.dark .form-switch .form-check-input:checked {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2318181b'/%3e%3c/svg%3e");
}
.form-check-input:disabled { opacity: .5; }
.form-check-label { color: hsl(var(--foreground)); }

/* 等 JS 填入的預覽圖：空 src 會被瀏覽器解析成當前頁 URL → 顯示破圖 icon。
   沒有 src（或 src 為空）時先不顯示，有值才出現。 */
img:not([src]),
img[src=""] { display: none !important; }

/* 破圖佔位（圖片載入失敗時取代原圖，不露出瀏覽器破圖 icon）。原類名 .merp-img-fallback → .fb-img-fallback */
.fb-img-fallback {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    min-height: 24px;
    background: hsl(var(--muted));
    border: 1px dashed hsl(var(--border));
    border-radius: var(--radius-md);
    color: hsl(var(--muted-foreground));
    font-size: 12px;
}


/*〔存查 s0249〕*/

/* ---- SweetAlert（刪除確認彈窗） ----
   轉換：確認鈕原版模板用 primary（近黑）→ 本主題用 --dark。
     swal 的預設鈕多半是「確定刪除 / 確定取消」，不是新增/儲存，不該用品牌黃。 */
.swal-modal {
    background: hsl(var(--card)) !important;
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius-lg);        /* 與 .modal-content 同階（shadcn DialogContent = rounded-lg） */
}
.swal-title { color: hsl(var(--card-foreground)) !important; font-size: 1.125rem; font-weight: 600; }
.swal-text { color: hsl(var(--muted-foreground)) !important; font-size: .875rem; }
/* shadcn 的 AlertDialogFooter 沒有分隔線 —— 標題／內文／按鈕是同一張卡上的三段，不是三個區塊 */
.swal-footer { border-top: 0; }
/* 圖示收小：原廠是 80px 的大圈，在 shadcn 的對話框裡過重
   （AlertDialog 本身根本沒有圖示，這裡保留但降到輔助角色） */
.swal-icon { width: 48px !important; height: 48px !important; margin: 4px auto 8px !important; }
.swal-icon--warning__body { height: 22px !important; top: 8px !important; }
.swal-icon--warning__dot  { bottom: 6px !important; }
.swal-button {
    background: hsl(var(--dark)) !important;
    color: hsl(var(--dark-foreground)) !important;
    border-radius: var(--radius-md);        /* shadcn Button = rounded-md */
    font-weight: 500;
}
.swal-button:not([disabled]):hover { background: hsl(var(--dark) / .88) !important; }
.swal-button--cancel {
    background: hsl(var(--secondary)) !important;
    color: hsl(var(--secondary-foreground)) !important;
    border: 1px solid hsl(var(--border));
}
.swal-button--danger { background: hsl(var(--destructive)) !important; color: hsl(var(--destructive-foreground)) !important; }
.swal-icon--warning__body, .swal-icon--warning__dot { background-color: hsl(var(--warning-fg)) !important; }
.swal-icon--warning { border-color: hsl(var(--warning-fg)) !important; }

/*〔存查 s0250〕*/
.swal2-container { background: hsl(var(--dark-panel) / .5) !important; }
.swal2-popup {
    background: hsl(var(--card)) !important;
    color: hsl(var(--card-foreground)) !important;
    border: 1px solid hsl(var(--border)) !important;
    border-radius: var(--radius-lg) !important;
    box-shadow: 0 16px 48px -12px rgb(0 0 0 / .25) !important;
    padding: 1.5rem !important;                 /* p-6 */
    max-width: 32rem !important;                /* max-w-lg */
    gap: 0 !important;
}
.swal2-title {
    color: hsl(var(--card-foreground)) !important;
    font-size: 1.125rem !important;             /* text-lg */
    font-weight: 600 !important;
    padding: 0 !important;
    margin: 0 0 .5rem !important;
}
.swal2-html-container {
    color: hsl(var(--muted-foreground)) !important;
    font-size: .875rem !important;              /* text-sm */
    line-height: 1.25rem !important;
    margin: 0 !important;
    padding: 0 !important;
}
/* Footer：靠右、gap-2、無分隔線（shadcn AlertDialogFooter） */
.swal2-actions {
    margin: 1.5rem 0 0 !important;
    gap: .5rem !important;
    justify-content: flex-end !important;
    width: 100% !important;
}
.swal2-styled {
    margin: 0 !important;
    border-radius: var(--radius-md) !important; /* Button = rounded-md */
    font-size: .875rem !important;
    font-weight: 500 !important;
    padding: .5rem 1rem !important;             /* h-9 px-4 */
    box-shadow: none !important;
    transition: background-color .12s ease, color .12s ease;
}
.swal2-styled.swal2-confirm {
    background: hsl(var(--dark)) !important;
    color: hsl(var(--dark-foreground)) !important;
    border: 1px solid transparent !important;
}
.swal2-styled.swal2-confirm:hover { background: hsl(var(--dark) / .88) !important; }
.swal2-styled.swal2-cancel {
    background: hsl(var(--secondary)) !important;
    color: hsl(var(--secondary-foreground)) !important;
    border: 1px solid hsl(var(--border)) !important;
}
.swal2-styled.swal2-cancel:hover { background: hsl(var(--accent)) !important; }
.swal2-styled.swal2-deny {
    background: hsl(var(--destructive)) !important;
    color: hsl(var(--destructive-foreground)) !important;
    border: 1px solid transparent !important;
}
.swal2-styled:focus-visible {
    outline: none !important;
    /* §S-73：原 `0 0 0 2px hsl(var(--background)), 0 0 0 4px hsl(var(--ring) / .5)`（間隙環），
       改官方的 border-ring ＋ 3px ring/50。 */
    border-color: hsl(var(--ring)) !important;
    box-shadow: 0 0 0 3px hsl(var(--ring) / .5) !important;
}
/* 圖示：原廠 80px 大圈 → 48px 輔助角色，顏色改吃 token */
.swal2-icon { width: 48px !important; height: 48px !important; margin: 0 auto 1rem !important; border-width: 2px !important; }
.swal2-icon .swal2-icon-content { font-size: 1.75rem !important; }
.swal2-icon.swal2-warning  { border-color: hsl(var(--warning-fg)) !important;  color: hsl(var(--warning-fg)) !important; }
.swal2-icon.swal2-error    { border-color: hsl(var(--destructive)) !important; color: hsl(var(--destructive)) !important; }
.swal2-icon.swal2-error [class^='swal2-x-mark-line'] { background-color: hsl(var(--destructive)) !important; }
.swal2-icon.swal2-success  { border-color: hsl(var(--success-fg)) !important;  color: hsl(var(--success-fg)) !important; }
.swal2-icon.swal2-success [class^='swal2-success-line'] { background-color: hsl(var(--success-fg)) !important; }
.swal2-icon.swal2-success .swal2-success-ring { border-color: hsl(var(--success-fg) / .3) !important; }
.swal2-icon.swal2-info,
.swal2-icon.swal2-question { border-color: hsl(var(--muted-foreground)) !important; color: hsl(var(--muted-foreground)) !important; }
/* 輸入元件跟著全站 Input 規格 */
.swal2-input, .swal2-textarea, .swal2-select {
    border: 1px solid hsl(var(--border)) !important;
    border-radius: var(--radius-md) !important;
    background: hsl(var(--background)) !important;
    color: hsl(var(--foreground)) !important;
    font-size: .875rem !important;
    box-shadow: none !important;
}
.swal2-input:focus, .swal2-textarea:focus, .swal2-select:focus {
    border-color: hsl(var(--ring)) !important;
    box-shadow: 0 0 0 3px hsl(var(--ring) / .5) !important;   /* §S-73：原 `0 0 0 2px hsl(var(--ring) / .35)`，改官方 3px + /50 */
}
.swal2-validation-message {
    background: hsl(var(--destructive) / .1) !important;
    color: hsl(var(--destructive-fg)) !important;
    border-radius: var(--radius-md) !important;
    font-size: .8125rem !important;
}
.swal2-close { color: hsl(var(--muted-foreground)) !important; box-shadow: none !important; }
.swal2-close:hover { color: hsl(var(--foreground)) !important; }
.swal2-timer-progress-bar { background: hsl(var(--dark) / .25) !important; }
/* toast 模式（右上角小提示）維持精簡，不套 p-6 */
.swal2-popup.swal2-toast { padding: .75rem 1rem !important; max-width: none !important; }
.swal2-popup.swal2-toast .swal2-title { margin: 0 !important; font-size: .875rem !important; }
.swal2-popup.swal2-toast .swal2-icon { width: 24px !important; height: 24px !important; margin: 0 .5rem 0 0 !important; }

/* ---- Tooltip / Popover ----
   轉換：tooltip 底原版模板用 primary → 本主題用 --dark（shadcn tooltip 就是深底淺字，
     黃底黑字的 tooltip 會像警告標籤） */
.tooltip-inner {
    background: hsl(var(--dark));
    color: hsl(var(--dark-foreground));
    border-radius: var(--radius-md);
    font-size: 12px;
}
.tooltip .tooltip-arrow::before { border-top-color: hsl(var(--dark)); border-bottom-color: hsl(var(--dark)); }
.popover {
    background: hsl(var(--popover));
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
}
.popover-header { background: hsl(var(--muted)); color: hsl(var(--foreground)); border-bottom-color: hsl(var(--border)); }
.popover-body { color: hsl(var(--popover-foreground)); }

/* ---- Lightbox（圖片放大） ---- */
.lb-outerContainer, .lb-dataContainer {
    background: hsl(var(--card)) !important;
    border-radius: var(--radius);
}
.lb-data .lb-caption, .lb-data .lb-number { color: hsl(var(--card-foreground)) !important; }
.lb-closeContainer .lb-close { filter: invert(var(--lb-invert, 0)); }
html.dark .lb-closeContainer .lb-close { filter: invert(1); }


/*〔存查 s0251〕*/
.btn:disabled,
.btn.disabled,
fieldset:disabled .btn {
    --bs-btn-disabled-bg: hsl(var(--muted));
    --bs-btn-disabled-color: hsl(var(--muted-foreground));
    --bs-btn-disabled-border-color: hsl(var(--border));
    background-color: hsl(var(--muted)) !important;
    color: hsl(var(--muted-foreground)) !important;
    border-color: hsl(var(--border)) !important;
    opacity: .7;
    cursor: not-allowed;
    pointer-events: auto;   /* 保留 title 提示 */
}
.btn:disabled i, .btn.disabled i { color: inherit !important; }


/*〔存查 s0252〕*/
/* 讓 svg 像字型圖示：隨字級縮放、對齊文字基線 */
.lucide,
i[data-lucide] {          /* [data-lucide] 尚未渲染時（lucide.js 載入前的短暫閃現）也先撐好尺寸 */
    width: 1em;
    height: 1em;
    display: inline-block;
    vertical-align: -0.125em;
    flex-shrink: 0;
}
/* FA size modifier：設 font-size，svg width/height=1em 會跟著縮放 */
.lucide.fa-xs, i[data-lucide].fa-xs { font-size: .75em; }
.lucide.fa-sm, i[data-lucide].fa-sm { font-size: .875em; }
.lucide.fa-lg, i[data-lucide].fa-lg { font-size: 1.25em; }
.lucide.fa-2x, i[data-lucide].fa-2x { font-size: 2em; }
.lucide.fa-3x, i[data-lucide].fa-3x { font-size: 3em; }
.lucide.fa-4x, i[data-lucide].fa-4x { font-size: 4em; }
.lucide.fa-5x, i[data-lucide].fa-5x { font-size: 5em; }
/* fa-fw 固定寬（選單對齊用） */
.lucide.fa-fw, i[data-lucide].fa-fw { width: 1.25em; }
/* fa-spin：FA 移除後自帶旋轉動畫 */
@keyframes lucide-spin { to { transform: rotate(360deg); } }
.lucide.fa-spin, i[data-lucide].fa-spin { animation: lucide-spin 1s linear infinite; }
/* fa-rotate-* 靜態旋轉 transform（非 icon，是套在 icon 上的角度） */
.lucide.fa-rotate-90,  i[data-lucide].fa-rotate-90  { transform: rotate(90deg); }
.lucide.fa-rotate-180, i[data-lucide].fa-rotate-180 { transform: rotate(180deg); }
.lucide.fa-rotate-270, i[data-lucide].fa-rotate-270 { transform: rotate(270deg); }


/* =============================================================================
 * §39 Markdown 檢視（移植自 merp L2432-2461）
 * 串接說明等由 Markdown 渲染的內容
 * ============================================================================= */
.markdown-body { color: hsl(var(--foreground)); line-height: 1.7; }
.markdown-body h1 { font-size: 1.35rem; font-weight: 700; margin: 0 0 1rem; }
.markdown-body h2 { font-size: 1.1rem; font-weight: 700; margin: 1.75rem 0 .75rem; padding-top: .5rem; border-top: 1px solid hsl(var(--border)); }
.markdown-body h3 { font-size: .98rem; font-weight: 600; margin: 1.25rem 0 .5rem; }
.markdown-body p, .markdown-body li { font-size: .9rem; }
.markdown-body ul, .markdown-body ol { padding-inline-start: 1.25rem; }
.markdown-body hr { border-color: hsl(var(--border)); margin: 1.5rem 0; }
.markdown-body blockquote {
  margin: 1rem 0; padding: .6rem .9rem; font-size: .875rem;
  border-inline-start: 3px solid hsl(var(--border)); background: hsl(var(--muted)); border-radius: var(--radius);
}
.markdown-body blockquote p:last-child { margin-bottom: 0; }
.markdown-body code {
  font-size: .85em; padding: .12em .35em; border-radius: 4px;
  background: hsl(var(--muted)); color: hsl(var(--foreground));
}
.markdown-body pre {
  padding: .9rem 1rem; border-radius: var(--radius); overflow-x: auto;
  background: hsl(var(--muted)); border: 1px solid hsl(var(--border)); font-size: .82rem;
}
.markdown-body pre code { padding: 0; background: transparent; }
/* 表格：窄螢幕橫捲（可見捲軸，見全站 .x-scroll 規範） */
.markdown-body table {
  width: 100%; margin: 1rem 0; border-collapse: collapse; font-size: .875rem; display: block; overflow-x: auto;
}
.markdown-body th, .markdown-body td { padding: .5rem .75rem; border: 1px solid hsl(var(--border)); text-align: start; }
.markdown-body th { background: hsl(var(--muted)); font-weight: 600; white-space: nowrap; }


/*〔存查 s0253〕*/
/*〔存查 s0254〕*/
.fs-7{font-size:7px!important}.fs-9{font-size:9px!important}.fs-10{font-size:10px!important}
/* .fs-11 同上被 §S-5 覆蓋成 12px；.fs-12 / .fs-13 未被覆蓋，值即所見 */
.fs-11{font-size:11px!important}.fs-12{font-size:12px!important}.fs-13{font-size:13px!important}
/*〔存查 s0255〕*/
.fs-14{font-size:14px!important}.fs-15{font-size:15px!important}.fs-16{font-size:16px!important}
/*〔存查 s0256〕*/
/*〔存查 s0257〕*/
.fs-17{font-size:17px!important}.fs-18{font-size:18px!important}.fs-20{font-size:20px!important}
/*〔存查 s0258〕*/
/*〔存查 s0259〕*/
/*〔存查 s0260〕*/
.fs-22{font-size:22px!important}.fs-28{font-size:28px!important}.fs-48{font-size:48px!important}

/*〔存查 s0261〕*/
div.dropdown-toggle::after { display: none; }

/* =============================================================================
 * 以下為肥肥專有補位：Color Admin 拔除後會消失、merp 主題未涵蓋的 class
 * ============================================================================= */

/*〔存查 s0262〕*/


/*〔存查 s0263〕*/

/* ---- 補位：.w-{n}px（Color Admin 原本提供） ---- */
.w-10px  { width: 10px  !important; }
.w-20px  { width: 20px  !important; }
.w-25px  { width: 25px  !important; }
.w-70px  { width: 70px  !important; }
.w-100px { width: 100px !important; }   /* 全站 79 處：表格欄寬，改動會全站錯位 */
.w-200px { width: 200px !important; }
.w-350px { width: 350px !important; }

/* .w-sm-200px 在 CA 內是包在 @media (min-width:576px) 裡（已用 grep 確認） */
@media (min-width: 576px) {
  .w-sm-200px { width: 200px !important; }
}

/* ---- 補位：.h-{n}px（Color Admin 原本提供） ---- */
.h-15px  { height: 15px  !important; }
.h-20px  { height: 20px  !important; }
.h-25px  { height: 25px  !important; }
.h-30px  { height: 30px  !important; }
.h-35px  { height: 35px  !important; }
/*〔存查 s0264〕*/
.h-45px  { height: 45px  !important; }
.h-60px  { height: 60px  !important; }
.h-100px { height: 100px !important; }
.h-150px { height: 150px !important; }
.h-200px { height: 200px !important; }

/*〔存查 s0265〕*/
/*〔存查 s0266〕*/
.fs-9px  { font-size: 9px  !important; }
/*〔存查 s0267〕*/
.fs-10px { font-size: 10px !important; }
/*〔存查 s0268〕*/
.fs-11px { font-size: 11px !important; }
.fs-12px { font-size: 12px !important; }
.fs-13px { font-size: 13px !important; }
.fs-14px { font-size: 14px !important; }
.fs-15px { font-size: 15px !important; }
.fs-18px { font-size: 18px !important; }
/*〔存查 s0269〕*/
.fs-24px { font-size: 24px !important; }

/* ---- 補位：px 級 padding（Color Admin 原本提供） ---- */
.ps-35px { padding-left: 35px !important; }   /* 57 處 */
.pt-10px { padding-top: 10px !important; }
.pb-10px { padding-bottom: 10px !important; }
/*〔存查 s0270〕*/
.px-35px { padding-left: 35px !important; padding-right: 35px !important; }
/*〔存查 s0271〕*/
.p-20px  { padding: 20px !important; }
.p-30px  { padding: 30px !important; }
.py-2px  { padding-top: 2px !important; padding-bottom: 2px !important; }

/* ---- 補位：px 級 margin（Color Admin 原本提供） ---- */
.mt-1px  { margin-top: 1px !important; }
.mt-10px { margin-top: 10px !important; }
.mb-10px { margin-bottom: 10px !important; }
.mb-20px { margin-bottom: 20px !important; }
.me-10px { margin-right: 10px !important; }
.my-10px { margin-top: 10px !important; margin-bottom: 10px !important; }

/*〔存查 s0272〕*/
.mt-n1 { margin-top: -.234375rem !important; }
.mt-n5 { margin-top: -2.8125rem  !important; }
.ms-n2 { margin-left: -.46875rem !important; }
.ms-n5 { margin-left: -2.8125rem !important; }

/* ---- 補位：Color Admin 專有 opacity 級距（Color Admin 原本提供）----
   ⚠ BS5 原生只有 25/50/75/100，這裡只補 CA 多出來的級距，不碰 BS5 既有的。 */
/*〔存查 s0273〕*/
.opacity-10 { opacity: .1 !important; }
.opacity-70 { opacity: .7 !important; }
/*〔存查 s0274〕*/
.text-opacity-10 { --bs-text-opacity: 0.1; }
/*〔存查 s0275〕*/
.text-opacity-20 { --bs-text-opacity: 0.2; }
/*〔存查 s0276〕*/
.bg-opacity-15   { --bs-bg-opacity: 0.15; }

/* ---- 補位：.fw-600（Color Admin 原本提供，BS5 只有 normal/bold/bolder/…） ---- */
.fw-600 { font-weight: 600 !important; }


/* =============================================================================
 * §B  高頻單品
 * ============================================================================= */

/*〔存查 s0277〕*/
/*〔存查 s0278〕*/
.btn.btn-xs {
  font-size: 12px;
  padding: 2px 6px;
  --bs-btn-font-size: 12px;
  --bs-btn-padding-y: 2px;
  --bs-btn-padding-x: 6px;
  --bs-btn-border-radius: var(--radius-md);
}

/*〔存查 s0279〕*/
.btn.btn-icon {
  width: 28px;
  height: 28px;
  padding: 0;
  border: none;
  line-height: 28px;
  text-align: center;
  font-size: 14px;
  border-radius: 28px;
}
.btn.btn-icon.btn-xs { width: 16px; height: 16px; font-size: 8px;  line-height: 16px; }
.btn.btn-icon.btn-sm { width: 22px; height: 22px; font-size: 11px; line-height: 22px; }
.btn.btn-icon.btn-lg { width: 34px; height: 34px; font-size: 17px; line-height: 34px; }

/* ---- 補位：.bg-none（Color Admin 原本提供）— 422 處 ----
   CA 原值：.bg-none{background:0 0!important} */
.bg-none { background: none !important; }

/*〔存查 s0281〕*/

/* ---- 補位：.flex-1（Color Admin 原本提供）— 45 處。BS5 只有 .flex-fill ---- */
.flex-1 { flex: 1; }

/* ---- 補位：.cursor-*（Color Admin 原本提供） ---- */
.cursor-pointer { cursor: pointer !important; }
.cursor-default { cursor: default !important; }

/* ---- 補位：.hide（Color Admin 原本提供）— 18 處，BS3 遺留 ---- */
.hide { display: none !important; }

/*〔存查 s0282〕*/
.input-group-addon {
  display: flex;
  align-items: center;
  padding: .375rem .75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: hsl(var(--muted-foreground));
  text-align: center;
  white-space: nowrap;
  background-color: hsl(var(--muted));
  border: 1px solid hsl(var(--border));
  border-radius: var(--bs-border-radius);
}
.datepicker .input-daterange .input-group-addon {
  margin: 0;
  font-weight: 600;
  background: hsl(var(--muted));
  color: hsl(var(--muted-foreground));
  display: flex;
  align-items: center;
  border-radius: 0;
}
body .datetimepicker + .input-group-addon {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

/*〔存查 s0283〕*/
/*〔存查 s0284〕*/
.app-header .navbar-form .form-group { margin: 0; position: relative; }
/*〔存查 s0285〕*/
.form-horizontal.form-bordered .form-group {
  /*〔存查 s0286〕*/
  border-bottom: 1px solid hsl(var(--border));
  margin: 0;
}

/* ---- 補位：.nav-tabs-v2（Color Admin 原本提供）— 16 處（Order/* 各狀態列表頁）----
   CA 用 --bs-component-active-bg（＝CA 主題藍）當 active 底線，
   依配色規則改用 --dark（亮色近黑 / 暗色近白），不用品牌黃。 */
/*〔存查 s0287〕*/
.nav.nav-tabs.nav-tabs-v2 { border-bottom: 1px solid hsl(var(--border)); }
/*〔存查 s0288〕*/
.nav.nav-tabs.nav-tabs-v2 > .nav-item { margin-bottom: -1px; }
/*〔存查 s0289〕*/
.nav.nav-tabs.nav-tabs-v2 > .nav-item > .nav-link {
  border: none;
  border-bottom: 3px solid transparent;
  padding: 1rem 1rem .875rem;
  color: hsl(var(--muted-foreground));
  background: none;
}
/*〔存查 s0290〕*/
.nav.nav-tabs.nav-tabs-v2 > .nav-item > .nav-link:hover {
  border-bottom-color: hsl(var(--muted-foreground) / .45);
  color: hsl(var(--foreground));
}
/*〔存查 s0291〕*/
.nav.nav-tabs.nav-tabs-v2 > .nav-item > .nav-link.active {
  border-bottom-color: hsl(var(--dark));
  background: none;
  color: hsl(var(--foreground));
}
/*〔存查 s0292〕*/
.nav.nav-tabs.nav-tabs-v2 > .nav-item.show > .nav-link {
  background: none;
  border-bottom-color: hsl(var(--border));
  color: hsl(var(--foreground));
}

/*〔存查 s0293〕*/
.text-gray     { color: hsl(var(--muted-foreground) / var(--bs-text-opacity, 1)) !important; }
/*〔存查 s0294〕*/
.text-silver   { color: hsl(var(--muted-foreground) / var(--bs-text-opacity, 1)) !important; }
.text-gray-300 { color: hsl(var(--hint) / var(--bs-text-opacity, 1)) !important; }

/* ---- 補位：灰階底色 / 框線 utility（Color Admin 原本提供）----
   底色一律連前景一起給（同一組 pair），否則暗色模式下深底配深字會看不見。 */
.bg-gray-100 {
  background-color: hsl(var(--secondary) / var(--bs-bg-opacity, 1)) !important;
  color: hsl(var(--secondary-foreground));
}
.bg-gray-500 {
  background-color: hsl(var(--muted-foreground) / var(--bs-bg-opacity, 1)) !important;
  color: hsl(var(--background));
}
.bg-gray-800 {
  /* CA 的 gray-800 是固定近黑；用兩模式皆深的 --dark-panel，不隨主題翻轉 */
  background-color: hsl(var(--dark-panel) / var(--bs-bg-opacity, 1)) !important;
  color: hsl(var(--dark-panel-foreground));
  /*〔存查 s0295〕*/
  --bs-card-color: hsl(var(--dark-panel-foreground));
  /*〔存查 s0296〕*/
  --bs-card-bg: transparent;
  --bs-card-cap-bg: transparent;
  --bs-card-cap-color: hsl(var(--dark-panel-foreground));
  --bs-card-border-color: hsl(0 0% 100% / .10);
  /*〔存查 s0297〕*/
  border-color: hsl(0 0% 100% / .10);
}
/*〔存查 s0298〕*/
.bg-gray-800 > .card-header,
.bg-gray-800 > .card-footer {
  /* 第 1555 行那條帶 !important（它是為了解決「寫死 #fff 在暗色會白底白字」而加的），
     光靠特異度贏不了，必須同樣用 !important 才蓋得過。 */
  background: transparent !important;
  color: hsl(var(--dark-panel-foreground)) !important;
  border-color: hsl(0 0% 100% / .10) !important;
}
.border-gray     { border-color: hsl(var(--border)) !important; }
.border-gray-300 { border-color: hsl(var(--border)) !important; }
.border-silver   { border-color: hsl(var(--border)) !important; }

/* ---- 補位：.bg-component（Color Admin 原本提供）— 4 處 ----
   --bs-component-bg-rgb 已在 shadcn-theme.css §1 定義（亮/暗各一份）。 */
.bg-component {
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-component-bg-rgb), var(--bs-bg-opacity)) !important;
}

/*〔存查 s0299〕*/
.text-theme { color: hsl(var(--dark) / var(--bs-text-opacity, 1)) !important; }

/* ---- 補位：.alert-yellow（Color Admin 原本提供）— Seller/plan/subscription ----
   CA 走 --bs-yellow-*-subtle（CA 自加的變數，會一起消失）→ 改用 warning 柔和語意底。 */
.alert-yellow {
  --bs-alert-color: hsl(var(--warning-fg));
  --bs-alert-bg: hsl(var(--warning-bg));
  --bs-alert-border-color: hsl(var(--warning) / .35);
  --bs-alert-link-color: hsl(var(--warning-fg));
  color: hsl(var(--warning-fg));
  background-color: hsl(var(--warning-bg));
  border-color: hsl(var(--warning) / .35);
}

/*〔存查 s0300〕*/
/*〔存查 s0301〕*/
.text-bg-indigo {
  color: hsl(var(--destructive-foreground)) !important;
  background-color: hsl(var(--leave-annual) / var(--bs-bg-opacity, 1)) !important;
}
/*〔存查 s0302〕*/
.text-bg-pink {
  color: hsl(var(--destructive-foreground)) !important;
  background-color: hsl(var(--leave-sick) / var(--bs-bg-opacity, 1)) !important;
}

/* ---- 補位：.bg-gradient-blue-indigo（Color Admin 原本提供）— 方案推薦卡 ----
   CA 原值：linear-gradient(to bottom,#348fe2 0,#8753de 100%)
   （注意 Seller/bill/index.blade.php 自己有 inline 覆蓋成 135deg 版，那頁不受影響） */
.bg-gradient-blue-indigo {
  background-image: linear-gradient(to bottom,
    hsl(var(--info)) 0,
    hsl(var(--leave-annual)) 100%) !important;
}

/*〔存查 s0303〕*/
.note {
  margin-bottom: 20px;
  position: relative;
  border-radius: var(--radius);
  display: flex;
  flex: 1;
  background: var(--bs-alert-bg, hsl(var(--muted)));
  color: var(--bs-alert-color, hsl(var(--foreground)));
  border-color: var(--bs-alert-border-color, hsl(var(--border)));
  border-left: 3px solid;
}
/*〔存查 s0304〕*/
.note .note-icon {
  width: 80px;
  font-size: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
}
/*〔存查 s0305〕*/
.note .note-content { padding: 15px; flex: 1; }
/*〔存查 s0306〕*/
.note .note-content h1, .note .note-content h2, .note .note-content h3,
.note .note-content h4, .note .note-content h5, .note .note-content h6,
.note .note-content .h1, .note .note-content .h2, .note .note-content .h3,
.note .note-content .h4, .note .note-content .h5, .note .note-content .h6 { color: inherit; }
/*〔存查 s0307〕*/
.note.note-with-end-icon { border-left: none; border-right: 3px solid; }

/* ---- 補位：.iconify（Color Admin 原本提供）----
   CA 只在側欄 / 頂欄 menu-icon 內給 iconify 尺寸，其餘位置本來就沒樣式。
   （fatboy 的 <span class="iconify"> 靠 iconify JS 換成 svg，不是 CSS 的事） */
.app-sidebar .menu .menu-item .menu-icon .iconify,
.app-sidebar .menu .menu-item .menu-icon ion-icon {
  width: 18px; height: 18px; font-size: 18px; margin: 0 -2px;
}
/*〔存查 s0308〕*/
.app-top-menu .menu .menu-item .menu-icon .iconify,
.app-top-menu .menu .menu-item .menu-icon ion-icon {
  margin-right: 8px; width: 18px; font-size: 18px; margin-left: -2px; display: block;
}



/* =============================================================================
 * §C  外殼零件（merp 主題沒有）
 * ============================================================================= */

/* ---- 補位：.app-header-fixed / .app-sidebar-fixed（Color Admin 原本提供）----
   使用處：layouts/default.blade.php:50 `app app-header-fixed app-sidebar-fixed`
   padding-top 是「頂欄高度」的硬尺寸，改了整站內容會被頂欄蓋住。 */
.app-header-fixed { padding-top: 50px; }
.app-header-fixed .app-header { position: fixed; }
@media (max-width: 767.98px) {
  /*〔存查 s0315〕*/
  .app-header-fixed { padding-top: var(--fb-header-h); }
}
@media (min-width: 768px) {
  .app-with-top-menu.app-header-fixed { padding-top: 90px; }
}
.app-sidebar-fixed .app-sidebar { position: fixed; }
@media (min-width: 992px) {
  .app-with-hover-sidebar:not(.app-sidebar-minified).app-sidebar-fixed .app-sidebar { bottom: 0; }
}

/* ---- 補位：.app-content-full-height / .app-without-sidebar / .app-without-header ----
   使用處：layouts/pos.blade.php:22 `app app-content-full-height app-without-sidebar app-without-header`
   這三個沒補＝POS 全螢幕版面直接塌掉（內容不滿版、側欄留白）。 */
.app-content-full-height { height: 100%; }
@media (min-width: 768px) {
  .app-content-full-height .app-content { height: calc(100vh - 50px); }
  .app-content-full-height.app-empty .app-content,
  .app-content-full-height.app-without-header .app-content { height: 100vh; }
}
@media (max-width: 767.98px) {
  .app-content-full-height .app-content { min-height: calc(100vh - 101px); }
}
.app-without-sidebar .app-content { margin: 0; }
@media (max-width: 575.98px) {
  .app-without-sidebar:not(.app-with-top-menu) .app-header .navbar-brand { justify-content: center; }
}

/*〔存查 s0316〕*/
.app-sidebar-mobile-backdrop {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  /*〔存查 s0317〕*/
  z-index: 1020;
  width: 100%; height: 100%;
  padding: 0; border: 0; margin: 0; outline: 0;
  display: none;
  background: transparent;
}
@media (max-width: 767.98px) {
  /* 側欄抬到遮罩之上（還原原廠 Color Admin 的 .app-sidebar{z-index:1021}）。
     只在手機媒體查詢裡做 —— 桌機的疊層是 header(1020) > 側欄(1010)，
     那是刻意的（header 橫跨整個寬度壓在側欄上方），不能被這條污染。 */
  body.app-sidebar-mobile-toggled #sidebar.app-sidebar,
  .app-sidebar-mobile-toggled .app-sidebar:not(.app-sidebar-end) {
    z-index: 1021;
  }
  .app-sidebar-mobile-toggled .app-sidebar-mobile-backdrop:not(.app-sidebar-end) {
    display: block;
    background: hsl(var(--dark-panel) / .5);
    animation: appSidebarMobileBackdrop .2s ease;
  }
  .app-sidebar-mobile-closed .app-sidebar-mobile-backdrop:not(.app-sidebar-end) {
    display: block;
    background: transparent;
    animation: appSidebarMobileRemoveBackdrop .2s ease;
  }
  .app-sidebar-end-mobile-toggled .app-sidebar-end.app-sidebar-mobile-backdrop {
    display: block;
    background: hsl(var(--dark-panel) / .5);
    animation: appSidebarMobileBackdrop .2s ease;
  }
  .app-sidebar-end-mobile-closed .app-sidebar-end.app-sidebar-mobile-backdrop {
    display: block;
    background: transparent;
    animation: appSidebarMobileRemoveBackdrop .2s ease;
  }
}
@keyframes appSidebarMobileBackdrop {
  from { background: transparent; }
  to   { background: hsl(var(--dark-panel) / .5); }
}
@keyframes appSidebarMobileRemoveBackdrop {
  from { background: hsl(var(--dark-panel) / .5); }
  to   { background: transparent; }
}

/* ---- 補位：.menu-divider（Color Admin 原本提供）— includes/_nav.blade.php:79 ---- */
.app-sidebar .menu .menu-divider {
  height: 1px;
  background-color: hsl(var(--sidebar-border));
  margin: 7px 0;
}

/* ---- 補位：.navbar-user（Color Admin 原本提供）— 頂欄使用者頭像區 ---- */
.app-header .navbar-user img {
  width: 30px; height: 30px;
  margin-top: -5px; margin-bottom: -5px;
  border-radius: 30px; margin-right: 10px;
}
.app-header .navbar-user .image {
  width: 30px; height: 30px;
  margin-top: -5px; margin-bottom: -5px;
  overflow: hidden;
  background-size: cover; background-position: center; background-repeat: no-repeat;
  border-radius: 30px; margin-right: 10px;
}
/*〔存查 s0318〕*/
.app-header .navbar-user .image.image-icon {
  font-size: 22px; text-align: center;
  display: flex; align-items: center; justify-content: center;
}
/*〔存查 s0319〕*/
.app-header .navbar-user .image.image-icon i {
  float: none; display: block; font-size: 22px; text-align: center;
  width: auto; margin: 0 auto -10px;
}
@media (max-width: 767.98px) {
  .app-header .navbar-user img,
  .app-header .navbar-user .image { margin-right: 5px; }
}

/*〔存查 s0320〕*/
.app-loader {
  position: fixed;
  top: 0; left: 0; bottom: 0; right: 0;
  background-color: hsl(var(--background));
  z-index: 1050;
  height: 100vh;
  opacity: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
.app-loader.fading { opacity: 0; animation: appLoaderFadeOut .2s ease; }
.app-loader.loaded,
body.loaded .app-loader { display: none; }
.app-loader.loaded .spinner,
body.loaded .app-loader .spinner { animation: none; }
@keyframes appLoaderFadeOut { from { opacity: 1; } to { opacity: 0; } }

/* CA 原值：border:2px solid #2d353c;border-top-color:#fff（深色環＋亮色缺口）。
   換 token 後亮/暗都成立：底環 --foreground 半透明，轉頭 --foreground 實色。 */
.spinner {
  height: 36px;
  width: 36px;
  border: 2px solid hsl(var(--foreground) / .2);
  border-top-color: hsl(var(--foreground));
  border-radius: 36px;
  animation: rotation .6s infinite linear;
}
.spinner.spinner-sm { height: 28px; width: 28px; }
@keyframes rotation { from { transform: rotate(0); } to { transform: rotate(359deg); } }

/*〔存查 s0321〕*/
.theme-panel {
  position: fixed;
  width: 260px;
  right: -260px;
  top: 0; bottom: 0;
  z-index: 1035;
  background: hsl(var(--card));
  color: hsl(var(--card-foreground));
  transition: right .2s linear;
  border-radius: var(--radius) 0 0 var(--radius);
}
.theme-panel.active { box-shadow: 0 5px 25px hsl(var(--foreground) / .3); right: 0; }
.theme-panel .theme-collapse-btn {
  position: absolute;
  /*〔存查 s0322〕*/
  left: -30px;
  top: 30%;
  /*〔存查 s0323〕*/
  margin-top: -15px;
  /*〔存查 s0324〕*/
  width: 30px; height: 30px; line-height: 30px;
  font-size: 18px;
  color: hsl(var(--card-foreground));
  background: hsl(var(--card));
  text-align: center;
  border-radius: var(--radius) 0 0 var(--radius);
  box-shadow: 0 0 15px 0 hsl(var(--foreground) / .15);
}
@media (max-width: 575.98px) {
  .theme-panel .theme-collapse-btn { top: 35%; }
}
/* CA 用 FontAwesome 的 \f00d 換掉展開圖示；fatboy 的按鈕是 fa-face-laugh-squint，
   換成 \f00d 會把小幫手表情變成叉叉 → 不照搬這條（刻意省略，非遺漏）。 */
.theme-panel .theme-panel-content {
  background: hsl(var(--card));
  padding: 20px;
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  overflow: scroll;   /* CA 原值。此容器有 data-scrollbar="true"，由 PerfectScrollbar 接手 */
  margin: 0;
  z-index: 10;
}
.theme-panel .theme-panel-divider {
  height: 1px;
  margin: 15px 0;
  background-color: hsl(var(--border));
}

/* ---- 補位：.btn-scroll-to-top（Color Admin 原本提供）— 5 處 ----
   搭配 includes/_shell.blade.php §7 的 JS（>200px 時加 .show）。 */
.btn-scroll-to-top {
  position: fixed !important;
  bottom: 20px;
  z-index: 1020;
  opacity: 0;
  display: none;
}
.btn-scroll-to-top.show { opacity: 1; display: block; animation: btnFadeIn .2s ease; }
/*〔存查 s0325〕*/
.app-with-end-sidebar .btn-scroll-to-top { left: 25px; right: auto; }
@media (min-width: 768px)  { .btn-scroll-to-top { right: 15px; } }
@media (max-width: 767.98px) { .btn-scroll-to-top { right: 10px; } }
@keyframes btnFadeIn { from { opacity: 0; } to { opacity: 1; } }

/*〔存查 s0326〕*/
.pace-top .pace .pace-progress { top: 0 !important; }
.pace-top .pace .pace-activity { top: 15px !important; }

/*〔存查 s0327〕*/
.error {
  margin: 0 auto;
  text-align: center;
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
/*〔存查 s0328〕*/
.error .error-code,
.error .error-content { flex: 1; transform: translateZ(0); }
/*〔存查 s0329〕*/
.error .error-code {
  color: hsl(var(--foreground));
  font-size: 200px;
  line-height: 1;
  text-shadow: 10px 10px 0 hsl(var(--foreground) / .2);
  padding: 1.875rem;
  height: 50vh;
  display: flex;
  justify-content: center;
  align-items: flex-end;
}
/*〔存查 s0330〕*/
@media (max-width: 767.98px) { .error .error-code { font-size: 160px; } }
/*〔存查 s0331〕*/
@media (max-width: 575.98px) { .error .error-code { font-size: 120px; } }
/*〔存查 s0332〕*/
.error .error-content {
  bottom: 0;
  padding: 1.875rem;
  background: hsl(var(--dark-panel));
  color: hsl(var(--dark-panel-foreground));
}
/*〔存查 s0333〕*/
.error .error-message {
  color: hsl(var(--dark-panel-foreground));
  font-size: 1.5rem;
  line-height: 1.2;
  letter-spacing: .5px;
  margin-bottom: .46875rem;
}
/*〔存查 s0334〕*/
.error .error-desc {
  font-size: .75rem;
  color: hsl(var(--dark-panel-foreground) / .5);
  letter-spacing: .5px;
}

/*〔存查 s0335〕*/
.login.login-v2 {
  min-height: 100vh;
  color: hsl(var(--dark-panel-foreground));
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: var(--radius);
}
.login.login-v2 .login-container { max-width: 400px; padding: 0 20px; position: relative; flex: 1; }
.login.login-v2 .login-header { margin-bottom: 20px; position: relative; display: flex; align-items: center; }
.login.login-v2 .login-header .brand { padding: 0; font-size: 28px; font-weight: 300; flex: 1; }
.login.login-v2 .login-header .brand .logo {
  /* 品牌識別，允許用 --primary（金黃） */
  border: 14px solid transparent;
  border-color: transparent hsl(var(--dark-panel) / .15) hsl(var(--dark-panel) / .3);
  background-color: hsl(var(--primary));
  width: 28px; height: 28px;
  position: relative;
  font-size: 0;
  border-radius: 6px;
  margin-right: .703125rem;
}
.login.login-v2 .login-header .brand small,
.login.login-v2 .login-header .brand .small {
  font-size: 13px; display: block; opacity: .5; font-weight: 600;
}
.login.login-v2 .login-header .icon { opacity: .75; }
.login.login-v2 .login-header .icon i { font-size: 56px; }
@media (max-width: 767.98px) {
  .login.login-v2 .login-header .brand { font-size: 24px; }
  .login.login-v2 .login-header .brand .logo { width: 24px; height: 24px; border-width: 12px; }
  .login.login-v2 .login-header .brand small,
  .login.login-v2 .login-header .brand .small { font-size: 12px; }
  .login.login-v2 .login-header .icon i { font-size: 48px; }
}
.login.login-v2 .login-content .form-control:focus {
  box-shadow: 0 0 0 5px hsl(var(--dark-panel-foreground) / .35);
}
.login.login-v2 .login-content .form-check-input:checked {
  background-color: hsl(var(--primary));
  border-color: hsl(var(--primary));
}
.login-cover { position: fixed; top: 0; left: 0; right: 0; bottom: 0; }
.login-cover .login-cover-img,
.login-cover .login-cover-bg {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.login-cover .login-cover-bg {
  background: linear-gradient(to bottom,
    hsl(var(--dark-panel) / .45) 0,
    hsl(var(--dark-panel) / .9));
}
.login-cover .login-cover-img { transition: background .2s ease; }


/*〔存查 s0336〕*/

/*〔存查 s0337〕*/
div.product-row {
  padding: 0;
  margin: -.703125rem;
  display: flex;
  flex-wrap: wrap;
}
div.product-row .product-container { padding: .703125rem; width: 100%; }
@media (min-width: 576px)  { div.product-row .product-container { width: 50%; } }
@media (min-width: 768px)  { div.product-row .product-container { width: 33.33%; } }
@media (min-width: 992px)  { div.product-row .product-container { width: 50%; } }
@media (min-width: 1200px) { div.product-row .product-container { width: 33.33%; } }
@media (min-width: 1800px) { div.product-row .product-container { width: 25%; } }
div.product-row .product-container .product { height: 100%; }

/* ---- 補位：.product 商品格（Color Admin 原本提供）---- */
.product {
  background: hsl(var(--card));
  color: hsl(var(--card-foreground));
  margin: 0;
  text-decoration: none;
  overflow: hidden;
  position: relative;
  border-radius: var(--radius);
  border: 1px solid hsl(var(--border));
  transition: all .2s linear;
  display: flex;
  flex-direction: column;
}
.product:hover { box-shadow: 0 .5rem 1rem hsl(var(--foreground) / .12); }
.product .img {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  min-height: 180px;
  transition: all .2s linear;
}
.product .text {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: .703125rem .9375rem;
}
.product .text .title {
  font-size: .875rem;
  font-weight: 600;
  color: hsl(var(--card-foreground));
  margin: 0 0 2px;
}
.product .text .desc {
  color: hsl(var(--muted-foreground));
  font-weight: 600;
  margin: 0 0 .9375rem;
  line-height: 1.4;
  flex: 1;
}
.product .text .price {
  margin: 0;
  font-weight: 600;
  color: hsl(var(--card-foreground));
  font-size: .875rem;
}
/* 商品資訊區（CA 的 .product-img / .product-info / .product-option 那組） */
/*〔存查 s0338〕*/
.product .product-img .img {
  padding-top: 75%;
  min-height: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
/*〔存查 s0339〕*/
@media (max-width: 767.98px) { .product .product-img .img { padding-top: 56.25%; } }
.product .product-info { padding: .9375rem 1.171875rem; flex: 1; }
.product .product-info .title { font-size: .875rem; font-weight: 600; }
.product .product-info .desc  { color: hsl(var(--muted-foreground)); margin-bottom: .9375rem; }

/* .not-available：售罄 / 不可選狀態 */
.product.not-available { cursor: not-allowed; box-shadow: none !important; }
.product.not-available .img,
.product.not-available .text { opacity: .65; }
.product.not-available .not-available-text {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  min-height: 180px;
  background: hsl(var(--dark-panel) / .75);
  color: hsl(var(--dark-panel-foreground));
  font-size: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}



/*〔存查 s0418〕*/

/* =============================================================================
 * §修正 — 靜態元件驗證頁（kitchen-sink）跑出來的問題
 * 本節在檔尾，同權重下最後宣告者勝，用來收斂前面章節互相打架的規則。
 * ============================================================================= */

/*〔存查 s0419〕*/
.btn-default {
  --bs-btn-bg: transparent;
  --bs-btn-border-color: hsl(var(--border));
  --bs-btn-color: hsl(var(--foreground));
  --bs-btn-hover-bg: hsl(var(--accent));
  --bs-btn-hover-border-color: hsl(var(--border));
  --bs-btn-hover-color: hsl(var(--accent-foreground));
  --bs-btn-active-bg: hsl(var(--accent));
  --bs-btn-active-border-color: hsl(var(--border));
  --bs-btn-active-color: hsl(var(--accent-foreground));
}

/*〔存查 s0420〕*/
.progress-bar.bg-success { background-color: hsl(var(--success)) !important; }
.progress-bar.bg-warning { background-color: hsl(var(--warning)) !important; }
.progress-bar.bg-info    { background-color: hsl(var(--info)) !important; }
.progress-bar.bg-danger  { background-color: hsl(var(--destructive)) !important; }

/*〔存查 s0421〕*/
.alert-success {
  background: hsl(var(--success-bg)) !important;
  color: hsl(var(--success-fg)) !important;
  border: 1px solid hsl(var(--success-fg) / .25) !important;
}

/* ── 4. 側欄 menu-badge 沒有內距，看起來就是一個裸數字 */
/*〔存查 s0422〕*/
.app-sidebar .menu-badge {
  padding: 1px 7px !important;
  font-size: 11px;
  line-height: 1.5;
}

/*〔存查 s0423〕*/
.app-sidebar .menu-profile {
    padding: 8px;
    margin-bottom: 4px;
    /*〔存查 s0424〕*/
    border-bottom: 1px solid hsl(var(--sidebar-border));
}
.app-sidebar .menu-profile-link {
    display: flex !important;
    align-items: center;
    gap: 8px;
    padding: 8px;
    border-radius: var(--radius);
    text-decoration: none;
    color: hsl(var(--sidebar-fg-strong));
    transition: background-color .15s ease;
}
.app-sidebar .menu-profile-link:hover { background: hsl(var(--sidebar-accent)); }

/* 封面照區＝Color Admin 的裝飾（內含 bouncingBalls canvas），shadcn 不用 */
.app-sidebar .menu-profile-cover { display: none !important; }

/* 頭像：shadcn sidebar 用 rounded-lg 方形圓角（不是全圓），32px */
.app-sidebar .menu-profile-image {
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    margin: 0;
    border-radius: var(--radius-md);
    overflow: hidden;
    background: hsl(var(--muted));
    border: 1px solid hsl(var(--sidebar-border));
    position: static;
}
.app-sidebar .menu-profile-image img {
    width: 100%; height: 100%; object-fit: cover; display: block;
    border-radius: var(--radius-md);
}

/* 資訊區：名稱一行、客戶代號一行，長名截斷不推擠版面 */
.app-sidebar .menu-profile-info {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 13px;
    font-weight: 600;
    /*〔存查 s0425〕*/
    line-height: 1.3;
    /*〔存查 s0426〕*/
    color: hsl(var(--sidebar-fg-strong));
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.app-sidebar .menu-profile-info h6 {
    margin: 1px 0 0;
    font-size: 11px;
    font-weight: 400;
    color: hsl(var(--sidebar-fg));
    display: flex;
    align-items: center;
    gap: 4px;
}
.app-sidebar .menu-profile-info h6 i,
.app-sidebar .menu-profile-info h6 svg { width: 11px; height: 11px; opacity: .6; }

/* 「續約訂閱」＝帳務入口，用 shadcn badge 的尺度（原本是偏大的黃色 pill） */
.app-sidebar .menu-profile-info .btn.btn-yellow {
    background: hsl(var(--primary)) !important;
    border-color: hsl(var(--primary)) !important;
    color: hsl(var(--primary-foreground)) !important;
    font-size: 10px;
    font-weight: 600;
    line-height: 1.5;
    padding: 1px 7px !important;
    margin-top: 5px;
    border-radius: 9999px;
}
.app-sidebar .menu-profile-info .menu-caret { margin-top: 5px; }

/* =============================================================================
 * §補位 2 — 逐頁重構時發現主題缺的規則
 * ============================================================================= */

/* 下拉選單內 .form-check 的 hover 回饋（訂單列表的店鋪/狀態/物流篩選，12 處）。
   它不是 .dropdown-item，吃不到 Bootstrap 原生 hover，原本靠 view 裡寫死的 #f8f9fa。 */
.hover-bg-light:hover { background-color: hsl(var(--muted)); }

/* 暫存區左側子選單（Order/Queue）。原本 #f8f9fa 底 + #fff8e1 active + 黃色左側 accent，
   那條黃是刻意的品牌識別 → 用 --primary 的淡版重現，亮暗都成立。 */
/*〔存查 s0427〕*/
.queue-sub {
    background: hsl(var(--muted));
    color: hsl(var(--foreground));
    border-bottom: 1px solid hsl(var(--border));
}
/*〔存查 s0428〕*/
.queue-sub:hover { background: hsl(var(--accent)); }
/*〔存查 s0429〕*/
.queue-sub-active {
    background: hsl(var(--primary) / .14) !important;
    box-shadow: inset 3px 0 0 hsl(var(--primary));
}

/* Color Admin 專有的 .opacity-5（18 處搜尋框放大鏡）。
   Bootstrap 5 只出貨 25/50/75/100，缺這條放大鏡會變全不透明。 */
.opacity-5 { opacity: .5 !important; }

/* 篩選器「已套用」提示：原本全站查無定義（CA 也沒有），補成 shadcn 的強調外框，
   讓使用者看得出這個篩選正在生效。 */
.filter-active {
    border-color: hsl(var(--foreground) / .45) !important;
    box-shadow: inset 0 0 0 1px hsl(var(--foreground) / .25);
}

/* =============================================================================
 * §補位 3 — 逐頁檢視抓到的主題層錯誤
 * ============================================================================= */

/*〔存查 s0430〕*/
h1.page-header,
h2.page-header,
h3.page-header,
h4.page-header,
h5.page-header,
.page-header h1 {
    font-size: 1.5rem;
    font-weight: 600;
    letter-spacing: -0.02em;
    line-height: 1.3;
}
/*〔存查 s0431〕*/
h1.page-header,
h2.page-header,
h3.page-header,
h4.page-header,
h5.page-header {
    display: block;
    gap: 0;
    border-bottom: 0;
    padding-bottom: 0;
}
.page-header h4 { font-size: 1.125rem; }
.page-header small,
.page-header .text-muted { font-size: .8125rem; font-weight: 400; }



/* fa-2xs（側欄「官網」的外開小標記）— §38 只定義了 fa-xs 起，補上極小號 */
.lucide.fa-2xs, i[data-lucide].fa-2xs { font-size: .625em; }

/* 佔位符對比：--hint 在白底只有 2.4:1（低於 3:1 門檻）。
   shadcn 的 placeholder 用 muted-foreground（4.6:1），select2 也一併對齊。 */
.form-control::placeholder,
.form-select::placeholder,
.select2-container--bootstrap-5 .select2-selection__placeholder,
.select2-container--default .select2-selection__placeholder {
    color: hsl(var(--muted-foreground)) !important;
    opacity: 1;
}

/* =============================================================================
 * §補位 4 — 狀態語意還原與零星缺口（逐模組檢視後）
 * ============================================================================= */

/*〔存查 s0432〕*/
span.btn.rounded-pill.btn-success,
span.btn.rounded-pill.btn-green,
span.btn.btn-rounded.rounded-pill.btn-success,
span.btn.btn-rounded.rounded-pill.btn-green {
    background: hsl(var(--success-bg)) !important;
    color: hsl(var(--success-fg)) !important;
    border-color: hsl(var(--success-fg) / .25) !important;
}
span.btn.rounded-pill.btn-warning,
span.btn.btn-rounded.rounded-pill.btn-warning {
    background: hsl(var(--warning-bg)) !important;
    color: hsl(var(--warning-fg)) !important;
    border-color: hsl(var(--warning-fg) / .25) !important;
}
span.btn.rounded-pill.btn-danger,
span.btn.btn-rounded.rounded-pill.btn-danger {
    background: hsl(var(--destructive) / .12) !important;
    color: hsl(var(--destructive-fg)) !important;
    border-color: hsl(var(--destructive) / .3) !important;
}
span.btn.rounded-pill.btn-info,
span.btn.btn-rounded.rounded-pill.btn-info {
    background: hsl(var(--info) / .12) !important;
    color: hsl(var(--info)) !important;
    border-color: hsl(var(--info) / .3) !important;
}

/* ── .bg-danger 用在 card-header 等非 badge/btn 元素上時會落回 Bootstrap 原生 #dc3545
   （非 token，暗色不翻轉、白名單稽核會判違規）→ 接到 destructive token。
   真警示該紅就紅，配 text-white 對比足夠。 */
.bg-danger:not(.badge):not(.btn):not(.progress-bar) {
    background-color: hsl(var(--destructive)) !important;
    color: hsl(var(--destructive-foreground)) !important;
}

/* ── SVG presentation attribute 不吃 var()：補貨頁的 90 天銷量折線圖
   stroke 寫死近黑，暗色模式下在深底上完全看不見。用 CSS 蓋掉 attribute（CSS 優先）。 */
#specDetailModal polyline,
#specDetailModal path[stroke] { stroke: hsl(var(--foreground)); }
#specDetailModal rect[fill="#f1f3f5"] { fill: hsl(var(--muted)); }
#specDetailModal rect[fill="#ced4da"] { fill: hsl(var(--muted-foreground) / .5); }

/* 三個全站沒有定義、view 卻在用的 class（bootstrap/vendor/theme 三邊都查無） */
/*〔存查 s0433〕*/
.text-xs { font-size: .75rem !important; }
/*〔存查 s0434〕*/
.text-opacity-20 { --bs-text-opacity: .2; opacity: .2; }
.animate-bounce { animation: fbBounce 1s infinite; }
@keyframes fbBounce {
    0%, 100% { transform: translateY(-12%); animation-timing-function: cubic-bezier(.8, 0, 1, 1); }
    50%      { transform: none;             animation-timing-function: cubic-bezier(0, 0, .2, 1); }
}


/*〔存查 s0435〕*/
.btn-yellow {
    --bs-btn-bg: hsl(var(--primary));
    --bs-btn-border-color: hsl(var(--primary));
    --bs-btn-color: hsl(var(--primary-foreground));
    --bs-btn-hover-bg: hsl(var(--primary-light));
    --bs-btn-hover-border-color: hsl(var(--primary-light));
    --bs-btn-hover-color: hsl(var(--primary-foreground));
    --bs-btn-active-bg: hsl(var(--primary-dark));
    --bs-btn-active-border-color: hsl(var(--primary-dark));
    --bs-btn-active-color: hsl(var(--primary-foreground));
    --bs-btn-disabled-bg: hsl(var(--primary));
    --bs-btn-disabled-border-color: hsl(var(--primary));
    --bs-btn-disabled-color: hsl(var(--primary-foreground));
}
/* 黃底上寫死的 text-white 會整顆隱形 → 打回黑字 */
.btn-yellow.text-white, .btn-primary.text-white { color: hsl(var(--primary-foreground)) !important; }

/* =============================================================================
 * §補位 5 — 依 shadcn 原生設計補的兩個元件
 * ============================================================================= */

/* ── 空狀態（shadcn empty state）
   shadcn 的空狀態＝「小尺寸 muted 圖示 + 標題（+ 說明）」置中，不是巨大插圖。
   原本 fa-10x 的巨大幽靈圖示不是 shadcn 的語彙，且主題只定義到 fa-5x。 */
.fb-empty-icon {
    width: 40px !important;
    height: 40px !important;
    color: hsl(var(--muted-foreground) / .55);
    stroke-width: 1.5;
    display: inline-block;
}
.fb-empty-icon + h4,
.fb-empty-icon + h5,
.fb-empty-icon + h6,
.fb-empty-icon + p {
    margin-top: 10px;
    font-size: .875rem;
    font-weight: 500;
    color: hsl(var(--muted-foreground));
}

/*〔存查 s0436〕*/
span.btn[class*="btn-"]:not(.btn-dark):not(.btn-light):not(.btn-primary) {
    /*〔存查 s0437〕*/
    font-size: 12px;
    font-weight: 500;
    line-height: 1.45;
    padding: 2px 8px;
    border-radius: 9999px;
    border-width: 1px;
    vertical-align: middle;
}
span.btn.btn-success, span.btn.btn-green {
    background: hsl(var(--success-bg)) !important;
    color: hsl(var(--success-fg)) !important;
    border-color: hsl(var(--success-fg) / .25) !important;
}
span.btn.btn-warning, span.btn.btn-orange {
    background: hsl(var(--warning-bg)) !important;
    color: hsl(var(--warning-fg)) !important;
    border-color: hsl(var(--warning-fg) / .25) !important;
}
span.btn.btn-danger, span.btn.btn-red {
    background: hsl(var(--destructive) / .12) !important;
    color: hsl(var(--destructive-fg)) !important;
    border-color: hsl(var(--destructive) / .3) !important;
}
span.btn.btn-info {
    background: hsl(var(--info) / .12) !important;
    color: hsl(var(--info)) !important;
    border-color: hsl(var(--info) / .3) !important;
}

/* =============================================================================
 * §補位 6 — 逐模組檢視後的主題層缺口
 * ============================================================================= */

/*〔存查 s0438〕*/
[data-bs-theme="light"] {
    --background: 0 0% 98%;   /*〔存查 s0439〕*/
    --foreground: 0 0% 0%;              /* §S-72 同步 :root */
    --card: 0 0% 100%;
    --card-foreground: 0 0% 0%;         /* §S-72 同步 :root */
    --muted: 0 0% 96.1%;                /* §S-72 同步 :root */
    --muted-foreground: 0 0% 45.1%;     /* §S-72 同步 :root */
    --border: 0 0% 89.8%;               /* §S-72 同步 :root */
    --dark: 0 0% 9%;                    /* #171717 ← §S-74 achromatic，與 :root 那顆同步（原 240 5.9% 10% #18181B，色差 4/255） */
    --dark-foreground: 0 0% 98%;        /* 原本就是 achromatic，§S-74 未動 */
}
[data-bs-theme="light"] .text-white,
[data-bs-theme="light"] .text-black,
/*〔存查 s0440〕*/
[data-bs-theme="light"] .text-dark { color: hsl(var(--foreground)) !important; }
[data-bs-theme="light"] .bg-white { background-color: hsl(0 0% 100%) !important; }

/* ── badge 語意變體：原本 info/dark/primary 在收斂後全落到同一個近黑，
   行事曆的「任務 / 行程 / 貨櫃」三種標記變得完全無法區分（圖例也對不上）。
   給 badge 一組可辨識的柔和變體（shadcn 的 badge secondary/outline 精神）。 */
.badge.bg-info    { background: hsl(var(--info) / .15) !important; color: hsl(var(--info)) !important; border: 1px solid hsl(var(--info) / .3); }
.badge.bg-success { background: hsl(var(--success-bg)) !important; color: hsl(var(--success-fg)) !important; border: 1px solid hsl(var(--success-fg) / .25); }
.badge.bg-warning { background: hsl(var(--warning-bg)) !important; color: hsl(var(--warning-fg)) !important; border: 1px solid hsl(var(--warning-fg) / .25); }
/*〔存查 s0441〕*/
.badge.bg-danger  { background: hsl(var(--destructive)) !important; color: hsl(var(--destructive-foreground)) !important; border-color: transparent; }
.badge.bg-dark    { background: hsl(var(--dark)) !important; color: hsl(var(--dark-foreground)) !important; }
.badge.bg-secondary { background: hsl(var(--secondary)) !important; color: hsl(var(--secondary-foreground)) !important; }

/* ── .border-primary（拖曳 hover 佔位框）theme 沒接管 → 會露出 Bootstrap 原生藍 */
.border-primary { border-color: hsl(var(--foreground) / .5) !important; }
.border-success { border-color: hsl(var(--success) / .5) !important; }
.border-danger  { border-color: hsl(var(--destructive) / .5) !important; }
/*〔存查 s0442〕*/
.border-info    { border-color: hsl(var(--info) / .5) !important; }

/*〔存查 s0443〕*/
/*〔存查 s0444〕*/

/*〔存查 s0445〕*/
.app-without-sidebar #content.app-content,
.app-without-header #content.app-content {
  margin: 0;
  padding: 0;
  min-height: 0;
}


/* ---- 補位：.bg-default（Color Admin 遺留，全站 2 處，其一在 pos/_header）----
   CA 原值：background-color: rgba(var(--bs-default-rgb)) = #e9ecef（淺灰）
   拔掉 app.min.css 後變 no-op → POS 左側導覽 rail 失去底色，與內容區糊在一起。 */
.bg-default { background-color: hsl(var(--muted)) !important; }




/*〔存查 s0487〕*/
.breath {
  animation-name: breath;
  animation-duration: 3s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: 3;
  border: 7px solid hsl(var(--foreground));
}
@keyframes breath {
  from { opacity: 1; }
  50%  { opacity: .5; }
  to   { opacity: 1; }
}


/* ── 展開/收合的 chevron（shadcn accordion 做法）
   不換圖示、單一 chevron 用 CSS 旋轉。原本的寫法是 JS 對調 fa-caret-down / fa-caret-up
   兩個 class —— lucide 把 <i> 換成 <svg> 之後那種寫法會靜默失效（箭頭永遠不轉）。 */
/*〔存查 s0489〕*/
.fb-caret { transition: transform .18s ease; }
/*〔存查 s0490〕*/
.fb-caret.open,
.open > .fb-caret,
[aria-expanded="true"] > .fb-caret { transform: rotate(180deg); }

/*〔存查 s0491〕*/

/* §filterbar 已移除：改用 merp 的實證結構（篩選列收進 card-header + d-flex gap-2），
   不再自創 .fb-filterbar 容器。 */

/* ── 全站控制項高度統一（規格 §0：sm=32px，不可 31/33/35 混雜） */
.app-content .form-control-sm:not(textarea),
.app-content .form-select-sm,
.app-content .btn-sm,
.app-content .input-group-sm > .form-control:not(textarea),
.app-content .input-group-sm > .input-group-text,
.app-content .select2-container--bootstrap-5 .select2-selection--single,
/*〔存查 s0492〕*/
.app-content .form-control-color {
    height: 32px;
    min-height: 32px;
    font-size: 13px;
}
/*〔存查 s0493〕*/
.app-content textarea.form-control-sm,
.app-content .input-group-sm > textarea.form-control {
    font-size: 13px;
    min-height: 0;
    height: auto;
}
.app-content .btn-sm { padding-top: 0; padding-bottom: 0; display: inline-flex; align-items: center; justify-content: center; }
/* 圖示型小鈕維持正方 */
.app-content .btn-sm.btn-icon, .app-content .btn-xs.btn-icon { padding: 0; }

/*〔存查 s0494〕*/

/*〔存查 s0495〕*/
.app-content .table > thead > tr > th {
    font-size: 12px;
    font-weight: 500;
    color: hsl(var(--muted-foreground));
    letter-spacing: .01em;
}
/*〔存查 s0496〕*/
.app-content .table > tbody > tr > td { font-size: 13px; }

/*〔存查 s0497〕*/
.app-content .small,
.app-content small { font-size: 12px; }

/* ── .pagination-wrapper：全專案 45 處在用，但沒有任何 CSS 定義（完全沒樣式）
   規格 §5：卡片底部、左邊每頁筆數、右邊頁碼。 */
.pagination-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding: 12px 16px;
    border-top: 1px solid hsl(var(--border));
    background: hsl(var(--card));
    border-bottom-left-radius: var(--radius);
    border-bottom-right-radius: var(--radius);
}
/* 分頁列若落在卡片外面（45 處多數如此），自己補上外框才不會像浮在空白裡 */
.card + .pagination-wrapper,
.app-content > .pagination-wrapper {
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
    margin-top: -1px;
}
.pagination-wrapper .pagination { margin: 0; }
.pagination-wrapper > :only-child { margin-left: auto; margin-right: auto; }
/* 分頁元件（component/pagination.blade.php）自己就是一列「左：統計文字 / 右：頁碼」，
   當它是 .pagination-wrapper 的唯一子項時要撐滿，否則上面那條 :only-child 置中規則
   會把「統計 + 頁碼」整組推到中間，與 merp 的「左統計右頁碼」排版不一致。 */
.pagination-wrapper > .d-md-flex { flex: 1 1 auto; min-width: 0; margin-left: 0; margin-right: 0; }

/*〔存查 s0498〕*/
.card-footer > .pagination-wrapper,
.card-body > .pagination-wrapper {
    width: 100%;
    flex: 1 1 auto;
    border: 0;
    border-radius: 0;
    padding: 0;
    background: transparent;
}
/* 分頁列整體是次要資訊：不繼承 card-footer 的 600 字重，字級收到 13px。
   （頁碼 .page-link 有自己的尺寸，不受影響。） */
.pagination-wrapper {
    font-weight: 400;
    font-size: .8125rem;
}

/* ── 吸頂表頭：sticky thead 需要不透明底才不會被內容穿透
   （沿用的 9 處 .bg-light.sticky-top，改用 card token 而非 Bootstrap 灰） */
.app-content thead.sticky-top th,
.app-content .table thead.bg-light.sticky-top th {
    background: hsl(var(--card)) !important;
    box-shadow: inset 0 -1px 0 hsl(var(--border));
}

/*〔存查 s0499〕*/
.fb-topbar-page {
    display: flex;
    align-items: center;
    gap: .5rem;
    min-width: 0;
    flex: 1 1 auto;
    padding-inline: .75rem;
    overflow: hidden;
}
.fb-topbar-title {
    font-size: 1.05rem !important;
    margin: 0 !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 600;
    color: hsl(var(--foreground));
}
.fb-topbar-meta {
    flex: 0 0 auto;
    white-space: nowrap;
    font-size: 12px;
}
.fb-topbar-page .btn { white-space: nowrap; }

/* 返回鈕 → 箭頭方鈕 */
.fb-back-btn {
    width: 32px; height: 32px; padding: 0;
    border: 1px solid hsl(var(--border));
    background: transparent;
    color: hsl(var(--foreground));
    border-radius: var(--radius);
    display: inline-flex; align-items: center; justify-content: center;
    flex: 0 0 auto;
    margin-inline-end: .25rem;
    text-decoration: none;
    cursor: pointer;
}
.fb-back-btn:hover { background: hsl(var(--accent)); color: hsl(var(--foreground)); }

/* 標題搬走後，原位的 page-header 變成動作行 */
.fb-action-row {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    align-items: center;
    margin-bottom: .9rem;
}
.fb-action-row:empty { display: none; }
/* 頁首不可裁切：各 view 頁首常寫 inline overflow-x:auto，依 CSS 規範另一軸也會被算成 auto
   → 整個頁首變裁切框，Bootstrap 下拉一展開就被切掉。本列已 flex-wrap 會換行，一律 visible。
   必須 !important 才蓋得過 view 的 inline style。 */
#content .page-header.fb-action-row { overflow: visible !important; margin-bottom: .9rem; }

@media (max-width: 991.98px) {
    .fb-topbar-title { font-size: .92rem !important; }
    .fb-topbar-page .btn:not(.fb-back-btn) { display: none; }
}

/*〔存查 s0500〕*/
.select2-container--bootstrap-5 .select2-selection--single,
.select2-container--bootstrap-5 .select2-selection--multiple {
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 28px 0 10px !important;
    font-size: 13px !important;
    line-height: 30px !important;
    display: flex !important;
    align-items: center;
    width: 100% !important;
    box-sizing: border-box !important;
    border: 1px solid hsl(var(--border)) !important;
    border-radius: var(--radius) !important;
    background-color: hsl(var(--background)) !important;
    color: hsl(var(--foreground)) !important;
}
.select2-container--bootstrap-5 .select2-selection__rendered {
    padding: 0 !important;
    line-height: 30px !important;
    font-size: 13px !important;
    color: hsl(var(--foreground)) !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}
.select2-container--bootstrap-5 .selection { display: block !important; width: 100% !important; }
/* ① 原廠隱藏規則選擇器寫錯（__arrow 是 __rendered 的兄弟不是子層）→ 手動藏掉 */
.select2-container--bootstrap-5 .select2-selection__arrow { display: none !important; }
/* ② 補回 caret（走 currentColor 的 mask，暗色會自動翻轉，不再寫死 %23343a40） */
.select2-container--bootstrap-5 .select2-selection--single::after {
    content: ""; position: absolute; right: 10px; top: 50%; transform: translateY(-50%);
    width: 14px; height: 14px; pointer-events: none; background-color: currentColor; opacity: .5;
    -webkit-mask: no-repeat center / 14px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    mask: no-repeat center / 14px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}
.select2-container--bootstrap-5 .select2-selection--single { position: relative; }
select.fw-bold + .select2-container .select2-selection__rendered { font-weight: 600; }
.select2-container--bootstrap-5 .select2-selection__clear { line-height: 30px !important; }
.select2-container--bootstrap-5 .select2-dropdown { font-size: 13px !important; }
.select2-container--bootstrap-5 .select2-search--dropdown .select2-search__field,
.select2-container--bootstrap-5 .select2-search .select2-search__field {
    font-size: 13px !important; padding: 5px 10px !important; min-height: 30px !important; line-height: 20px !important;
}
.select2-container--bootstrap-5 .select2-results__option,
.select2-container--bootstrap-5 .select2-results__options li { padding: 5px 10px !important; font-size: 13px !important; line-height: 20px !important; }
.select2-container--bootstrap-5 .select2-results__message { padding: 6px 10px !important; font-size: 13px !important; }
.select2-container--bootstrap-5 .select2-search--dropdown { padding: 4px !important; }
.select2-container--bootstrap-5 .select2-results { padding: 0 !important; }
.select2-container--bootstrap-5 .select2-results__options { max-height: 250px !important; }
/* 寬度行為（沿用原本的三種模式） */
select.select2-hidden-accessible + .select2-container { display: inline-block !important; min-width: 80px; }
select.select2-fit + .select2-container { width: max-content !important; }
select.w-100.select2-hidden-accessible + .select2-container { display: block !important; }
.input-group select.select2-hidden-accessible + .select2-container { display: flex !important; flex: 1 1 auto; width: 1% !important; min-width: 0; }
.input-group .select2-container--bootstrap-5 .select2-selection { border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important; }

/*〔存查 s0501〕*/
/*〔存查 s0502〕*/
.fb-filter-card {
    padding: 12px;
    margin-bottom: 16px;
    background: hsl(var(--card));
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);
}
/* 若它正好緊貼在下方卡片上，兩者接成一體（避免出現雙層框） */
/*〔存查 s0503〕*/
.fb-filter-card + .card {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    margin-top: -17px;
}
/*〔存查 s0504〕*/
.fb-filter-card:has(+ .card) {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    margin-bottom: 0;
}
/* 卡片內的 filter-bar 不再自帶外框（由 card-header 承載） */
/*〔存查 s0505〕*/
.card .fb-filter-card, .card-header .fb-filter-card {
    padding: 0; margin: 0; background: none; border: 0; box-shadow: none; border-radius: 0;
}

/*〔存查 s0506〕*/
/*〔存查 s0507〕*/
.dropdown-toggle:has(.caret)::after { display: none !important; }

/* .caret 本身改成 shadcn 的 chevron（線條），不要 CA 的實心三角 */
.caret {
    display: inline-block;
    width: 12px; height: 12px;
    margin-left: .25rem;
    vertical-align: middle;
    border: 0 !important;
    background-color: currentColor;
    opacity: .55;
    -webkit-mask: no-repeat center / 12px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    mask: no-repeat center / 12px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

/*〔存查 s0508〕*/
.fb-filter { display: flex; flex-direction: column; gap: 10px; }
/*〔存查 s0509〕*/
.fb-filter-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}
/*〔存查 s0510〕*/
.fb-filter-advanced {
    display: none;
    padding-top: 10px;
    border-top: 1px solid hsl(var(--border));
}
/*〔存查 s0511〕*/
.fb-filter.is-open .fb-filter-advanced {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 8px 10px;
    align-items: end;
}
/* 進階面板內每一格：label 在上、控制項在下（規格 §6） */
/*〔存查 s0512〕*/
.fb-filter-advanced > * { min-width: 0; }
/*〔存查 s0513〕*/
.fb-filter-advanced .form-label {
    display: block;
    font-size: 11px;
    font-weight: 500;
    color: hsl(var(--muted-foreground));
    margin-bottom: 4px;
}
/*〔存查 s0514〕*/
/*〔存查 s0515〕*/
.fb-filter-advanced .select2-hidden-accessible {
    width: 1px !important;
    min-width: 0 !important;
}
/*〔存查 s0516〕*/
.fb-filter-advanced .form-control,
.fb-filter-advanced .form-select:not(.select2-hidden-accessible),
.fb-filter-advanced .dropdown > .btn,
.fb-filter-advanced .select2-container { width: 100% !important; }

/* 展開鈕：已套用幾項用 badge 顯示 */
[data-filter-toggle] [data-filter-count]:not(:empty) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 17px;
    height: 17px;
    padding: 0 5px;
    margin-left: 4px;
    border-radius: 9999px;
    background: hsl(var(--dark));
    color: hsl(var(--dark-foreground));
    font-size: 10px;
    font-weight: 600;
}
[data-filter-toggle] .lucide-chevron-down,
[data-filter-toggle] [data-lucide="chevron-down"] { transition: transform .18s ease; }
.fb-filter.is-open [data-filter-toggle] [data-lucide="chevron-down"],
.fb-filter.is-open [data-filter-toggle] .lucide-chevron-down { transform: rotate(180deg); }

/*〔存查 s0517〕*/
.fb-tabs .nav-item { display: flex; }

/*〔存查 s0518〕*/
.btn-check:checked + .btn-outline-dark,
.btn-check:checked + .btn-outline-secondary,
.btn-check:active + .btn-outline-dark,
.btn-check:checked + .btn.btn-outline-dark:focus-visible {
    background: hsl(var(--dark));
    border-color: hsl(var(--dark));
    color: hsl(var(--dark-foreground));
    box-shadow: none;
}
.btn-check:checked + .btn-outline-primary {
    background: hsl(var(--primary));
    border-color: hsl(var(--primary));
    color: hsl(var(--primary-foreground));
    box-shadow: none;
}
/* 未選中：與 .fb-tab 未選中態一致的 ghost，而不是描邊框 */
.btn-check + .btn-outline-dark,
.btn-check + .btn-outline-secondary {
    border-color: transparent;
    color: hsl(var(--muted-foreground));
}
.btn-check:not(:checked) + .btn-outline-dark:hover,
.btn-check:not(:checked) + .btn-outline-secondary:hover {
    background: hsl(var(--accent));
    color: hsl(var(--foreground));
}

/*〔存查 s0519〕*/
.modal-content.border-0 {
    border: 1px solid hsl(var(--border)) !important;
}

/*〔存查 s0520〕*/
/*〔存查 s0521〕*/
.page-header > .btn:not(:first-child),
.page-header > .dropdown,
.page-header > form,
.page-header > .fb-page-help,
.page-header > select,
.page-header > .input-group {
    order: 50;
}
.page-header > .btn:not(:first-child) ~ *,
.page-header > .dropdown ~ *,
.page-header > form ~ * { order: 50; }
/* 說明鈕永遠排在動作組最後（它是輔助資訊不是主要動作） */
/*〔存查 s0522〕*/
.page-header > .fb-page-help,
.page-header > .fb-ph-inline > .fb-page-help,
.page-header .ms-auto > .fb-page-help { order: 99; margin-left: auto; }
.page-header > .fb-ph-inline { display: contents; }
/* 動作組的第一個元素負責把整組推到右邊 */
.page-header > .btn:not(:first-child):first-of-type,
.page-header > .dropdown:first-of-type,
.page-header > form:first-of-type {
    margin-left: auto;
}
/* 已經自己包了 .ms-auto 的頁面：不重複推，避免雙重推擠 */
.page-header > .ms-auto ~ * { margin-left: 0 !important; }
.page-header > .ms-auto { order: 50; }

/*〔存查 s0523〕*/

/* 外層：不再是「有下框線的獨立區塊」，而是側欄內縮的一顆按鈕 */
.app-sidebar .menu-profile {
    border-bottom: 0;
    padding: 8px;
    margin-bottom: 4px;
    border-bottom: 1px solid hsl(var(--sidebar-border));
}
.app-sidebar .menu-profile-link {
    /*〔存查 s0524〕*/
    display: grid;
    grid-template-columns: 32px 1fr auto;
    align-items: center;
    gap: 8px;
    padding: 8px;
    border-radius: var(--radius);
    transition: background-color .15s;
}
.app-sidebar .menu-profile-link:hover {
    background: hsl(var(--sidebar-accent));
}
/* 裝飾用的 cover 與彈跳球 canvas：shadcn 的 sidebar 沒有這種東西，收掉 */
.app-sidebar .menu-profile-cover,
.app-sidebar .menu-profile-cover.with-shadow {
    display: none !important;
}
/* 頭像：32px 圓角方形（shadcn Avatar 在 sidebar 用的是 rounded-lg 不是圓形） */
.app-sidebar .menu-profile-image {
    width: 32px; height: 32px;
    margin: 0; padding: 0;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid hsl(var(--sidebar-border));
    flex: 0 0 auto;
}
.app-sidebar .menu-profile-image img {
    width: 100%; height: 100%; object-fit: cover; display: block;
}
/* 文字區：兩行，主要 14px/500、次要 12px/muted，過長一律省略號不換行 */
.app-sidebar .menu-profile-info {
    min-width: 0;
    display: flex; flex-direction: column; gap: 1px;
    font-size: 14px; font-weight: 500; line-height: 1.25;
    color: hsl(var(--sidebar-fg-strong)) !important;
}
.app-sidebar .menu-profile-info > .d-flex { min-width: 0; }
.app-sidebar .menu-profile-info .flex-grow-1 {
    min-width: 0;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.app-sidebar .menu-profile-info h6 {
    margin: 0;
    font-size: 12px; font-weight: 400; line-height: 1.3;
    color: hsl(var(--sidebar-fg)) !important;
    display: flex; align-items: center; gap: 4px;
}
.app-sidebar .menu-profile-info h6 svg { width: 12px; height: 12px; opacity: .7; }
/* 訂閱狀態：從搶眼的黃色實心膠囊 → shadcn 的小 badge（次要資訊不該比名字還亮） */
.app-sidebar .menu-profile-info .btn-yellow,
.app-sidebar .menu-profile-info .btn.rounded-pill {
    background: hsl(var(--primary) / .16) !important;
    color: hsl(var(--sidebar-fg-strong)) !important;
    border: 1px solid hsl(var(--primary) / .35) !important;
    font-size: 11px !important; font-weight: 500 !important;
    line-height: 1.4 !important;
    padding: 1px 6px !important;
    border-radius: 6px !important;
    box-shadow: none !important;
}
/* chevron：靠右、muted、不佔空間 */
.app-sidebar .menu-profile .menu-caret {
    margin: 0 !important;
    opacity: .5;
    flex: 0 0 auto;
}
/* 側欄收合時（minified）只留頭像 */
.app-sidebar-minified .app-sidebar .menu-profile-link {
    grid-template-columns: 32px;
    justify-content: center;
}
.app-sidebar-minified .app-sidebar .menu-profile-info,
.app-sidebar-minified .app-sidebar .menu-profile .menu-caret { display: none !important; }

/*〔存查 s0525〕*/
@media (max-width: 767.98px) {
    /*〔存查 s0526〕*/
    .app-header .navbar-nav .navbar-user .d-inline-block.text-truncate,
    .app-header .navbar-nav .navbar-user > .navbar-link > span:not(.badge):not(.fb-thumb) {
        display: none !important;
    }
    /* 通知數字 badge 保留（那是要看的資訊），但縮小 */
    .app-header .navbar-nav .badge { font-size: 10px; padding: 2px 5px; }
    /* 各項目間距收緊 */
    .app-header .navbar-nav > .navbar-item > .navbar-link { padding-left: .4rem; padding-right: .4rem; }
    /* 標題：讓它真的有空間，並以省略號收尾（原本被壓成一個字） */
    .fb-topbar-page { min-width: 0; flex: 1 1 auto; overflow: hidden; }
    .fb-topbar-title {
        display: block;
        max-width: 100%;
        white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    /* 頂 bar 的 meta（更新時間、計數）在手機上收掉，內容區已經有一份 */
    .fb-topbar-page .fb-topbar-meta { display: none !important; }
    /* caret 在手機上是純裝飾（點整塊都會開），收掉換空間 */
    .app-header .navbar-nav .caret { display: none !important; }
}

/*〔存查 s0527〕*/
@media (max-width: 767.98px) {
    .pagination-wrapper,
    .card-footer > .d-md-flex {
        flex-wrap: wrap;
        gap: 8px;
    }
    /*〔存查 s0528〕*/
    .card-footer,
    .card-footer > *,
    .card-footer > * > * {
        max-width: 100%;
        min-width: 0;
    }
    .pagination,
    .pagination-wrapper .pagination,
    .card-footer .pagination {
        flex-wrap: nowrap;
        max-width: 100%;
        overflow-x: auto;
        scrollbar-width: none;          /* 手機不顯示捲軸，用手指滑 */
        -webkit-overflow-scrolling: touch;
        justify-content: flex-start;
    }
    .pagination-wrapper .pagination::-webkit-scrollbar,
    .card-footer .pagination::-webkit-scrollbar { display: none; }
    .pagination .page-link { flex: 0 0 auto; }
    /* 統計文字獨立一行、置中 */
    .pagination-wrapper > .me-auto,
    .card-footer .text-md-center { width: 100%; text-align: center; }
}

/*〔存查 s0529〕*/
/*〔存查 s0530〕*/
.app-content .fb-cell-sum {
    background-color: color-mix(in srgb, hsl(var(--success)) 15%, hsl(var(--card))) !important;
}
/*〔存查 s0531〕*/
.app-content .fb-cell-avg {
    background-color: color-mix(in srgb, hsl(var(--info)) 12%, hsl(var(--card))) !important;
}
/*〔存查 s0532〕*/
.app-content .fb-row-total > td,
.app-content .fb-row-total > th,
.app-content td.fb-row-total {
    background-color: color-mix(in srgb, hsl(var(--warning)) 18%, hsl(var(--card))) !important;
    font-weight: 600;
}
/*〔存查 s0533〕*/
.app-content .fb-row-subtotal > td,
.app-content .fb-row-subtotal > th {
    background-color: color-mix(in srgb, hsl(var(--warning)) 9%, hsl(var(--card))) !important;
}
/*〔存查 s0534〕*/
.app-content .fb-cell-neutral-strong {
    background-color: color-mix(in srgb, hsl(var(--foreground)) 7%, hsl(var(--card))) !important;
}
/*〔存查 s0535〕*/
.app-content .fb-cell-neutral-soft {
    background-color: color-mix(in srgb, hsl(var(--foreground)) 3.5%, hsl(var(--card))) !important;
}
/* 保險絲：任何 sticky 儲存格若仍是半透明底，強制補一層不透明卡片底。
   這條擋的是「日後有人又寫了半透明色」——讓穿透不能再默默回來。 */
.app-content table th[class*="sticky"],
.app-content table td[class*="sticky"],
.app-content .table-sticky-head thead th {
    background-color: hsl(var(--card));
}

/*〔存查 s0536〕*/
#header .navbar-nav .navbar-link.icon,
#header .navbar-nav #notification-dropdown > .navbar-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
#header .navbar-nav #notification-badge {
    position: absolute;
    top: 2px;
    left: 50%;
    margin-left: 2px;          /* 貼在鈴鐺右上角，略為重疊 */
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    font-size: 10px;
    font-weight: 600;
    line-height: 16px;
    border-radius: 9999px;     /* 計數徽章用全圓角，與方角的狀態 badge 區隔 */
    text-align: center;
    box-shadow: 0 0 0 2px hsl(var(--card));   /* 與底下的圖示分離 */
}

/*〔存查 s0537〕*/
.pm-stepper--chevron,
.scr-stepper { --pm-arrow: 11px; --pm-gap: 2px; --scr-arrow: 11px; --scr-gap: 2px; }

/* ── 未到：最淡，明顯退後 */
.pm-stepper--chevron .pm-step.is-future,
.scr-stepper .scr-step.is-future {
    background-color: hsl(var(--muted) / .55) !important;
    color: hsl(var(--muted-foreground)) !important;
    font-weight: 400 !important;
}
/* ── 已完成：實心 muted，文字用正常前景（走過的階段仍要讀得清楚） */
.pm-stepper--chevron .pm-step.is-past,
.scr-stepper .scr-step.is-past {
    background-color: hsl(var(--muted)) !important;
    color: hsl(var(--foreground)) !important;
    font-weight: 500 !important;
}
/* ── 當前：唯一的焦點。實心近黑 + 反白字 */
.pm-stepper--chevron .pm-step.is-current,
.scr-stepper .scr-step.is-current {
    background-color: hsl(var(--dark)) !important;
    color: hsl(var(--dark-foreground)) !important;
    font-weight: 600 !important;
    filter: drop-shadow(0 1px 3px hsl(var(--foreground) / .28)) !important;
}
/* is-current 上若有 view 寫死的 .bg-white/.text-dark，交還給上面的規則 */
.pm-stepper--chevron .pm-step.is-current.bg-white,
.scr-stepper .scr-step.is-current.bg-white {
    background-color: hsl(var(--dark)) !important;
    color: hsl(var(--dark-foreground)) !important;
}
/* 當前步驟內的計數 chip 也要跟著反白 */
.scr-stepper .scr-step.is-current .scr-count,
.pm-stepper--chevron .pm-step.is-current .badge {
    background: hsl(var(--dark-foreground) / .22) !important;
    color: hsl(var(--dark-foreground)) !important;
}
/* ── 可點的步驟：hover 才有回饋，不要一直看起來像連結 */
.pm-stepper--chevron a.pm-step,
.scr-stepper a.scr-step { text-decoration: none !important; }
.pm-stepper--chevron a.pm-step:hover:not(.is-current),
.scr-stepper a.scr-step:hover:not(.is-current) {
    background-color: hsl(var(--accent)) !important;
    color: hsl(var(--accent-foreground)) !important;
    filter: none !important;
}

/*〔存查 s0538〕*/
@media (max-width: 767.98px) {
    .theme-panel:not(.active) { display: none !important; }
}

/*〔存查 s0539〕*/
@media (max-width: 767.98px) {

    /*〔存查 s0540〕*/
    .page-header { white-space: normal !important; }
    /*〔存查 s0541〕*/
    .page-header > *,
    .page-header .flex-shrink-0 { min-width: 0 !important; flex-shrink: 1 !important; }
    /* 動作鈕橫排容器（.ms-auto.d-flex…）在手機要能自己折行，
       否則就算外層可壓縮，內層 d-flex 不換行一樣把整列頂開。 */
    .page-header .d-flex:not(.flex-nowrap) { flex-wrap: wrap !important; }
    /* 但「單顆按鈕、狀態 badge、分頁連結」的文字仍不可從中間斷開 */
    .page-header .btn,
    .page-header .badge,
    .page-header .nav-link { white-space: nowrap; }

    /*〔存查 s0542〕*/
    .select2-hidden-accessible {
        width: 1px !important;
        min-width: 0 !important;
        height: 1px !important;
        min-height: 0 !important;
        /*〔存查 s0543〕*/
        left: 0 !important;
    }

    /*〔存查 s0544〕*/
    .pagination { flex-wrap: wrap; }

    /*〔存查 s0545〕*/
    .min-w-0 { min-width: 0 !important; }

    /*〔存查 s0546〕*/
    *:not(.table-responsive) > table.table td { white-space: normal; }
}

/*〔存查 s0547〕*/
html.dark .upload-area {
    background: hsl(var(--muted));
    border-color: hsl(var(--border));
}
html.dark .upload-area:hover,
html.dark .upload-area.drag-over {
    background: hsl(var(--accent));
    border-color: hsl(var(--info));
}
html.dark .upload-icon,
html.dark .upload-text,
html.dark .file-size,
html.dark .file-icon,
html.dark .inline-file-icon,
html.dark .btn-action,
html.dark .btn-inline-action { color: hsl(var(--muted-foreground)); }

html.dark .file-item,
html.dark .inline-file-item {
    background: hsl(var(--card));
    border-color: hsl(var(--border));
}
html.dark .file-preview,
html.dark .inline-preview { background: hsl(var(--muted)); }
html.dark .file-name { color: hsl(var(--foreground)); }
html.dark .file-actions {
    background: hsl(var(--muted));
    border-top-color: hsl(var(--border));
}
html.dark .btn-action:hover,
html.dark .btn-inline-action:hover {
    background: hsl(var(--accent));
    color: hsl(var(--accent-foreground));
}
/* 錯誤狀態：維持「紅色語意」，但換成暗色可讀的低亮度紅底 */
html.dark .file-item[data-status="error"],
html.dark .inline-file-item[data-status="error"] {
    background: hsl(var(--destructive) / .12);
    border-color: hsl(var(--destructive) / .45);
}
/* 疊在圖片上的遮罩原本是半透明白（rgba(255,255,255,.9~.95)），暗色下會整片泛白 */
html.dark .inline-uploading,
html.dark .upload-error { background: hsl(var(--card) / .92); }
html.dark .inline-error { background: hsl(var(--destructive) / .22); }
/* .spinner 這個 class 名很通用：全站還有 3 處是「整頁載入動畫」
   （includes/_load、layouts/app、layouts/empty）。這裡只鎖 file-uploader 自己的那顆，
   不要順手改到頁面載入動畫。 */
html.dark .inline-uploading .spinner { border-color: hsl(var(--border)); border-top-color: hsl(var(--info)); }

/*〔存查 s0548〕*/

/* ── 選單項：32px、6px 圓角 ── */
.app-sidebar .menu-link {
    min-height: 32px;
    padding: 6px 8px;
    margin: 1px 8px;
    gap: 8px;
    border-radius: var(--radius-sm);   /* 10px → 6px，對齊 rounded-md */
    font-size: .875rem;
    line-height: 1.25rem;
}
#sidebar .menu-icon,
.app-sidebar .menu-link .menu-icon {
    width: 16px;
    flex: 0 0 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.app-sidebar .menu-link .menu-icon svg,
.app-sidebar .menu-link .menu-icon i { width: 16px; height: 16px; }

/*〔存查 s0549〕*/
#sidebar .menu-item.active > .menu-link,
#sidebar .menu-submenu .menu-item.active > .menu-link {
    background: hsl(var(--sidebar-accent));
    color: hsl(var(--sidebar-fg-strong));
    font-weight: 500;
}
#sidebar .menu-item.active > .menu-link .menu-icon,
#sidebar .menu-submenu .menu-item.active > .menu-link .menu-icon {
    color: hsl(var(--sidebar-fg-strong));
    opacity: 1;
}
/* ── 展開中的父項：不給底色，只靠 caret 轉向表達「已展開」
       —— 這是把「展開」與「所在頁」分開的關鍵，原本兩者同色。 ── */
#sidebar .menu-item.has-sub.expand > .menu-link,
#sidebar .menu-item.expand > .menu-link {
    background: transparent;
    color: hsl(var(--sidebar-fg-strong));
    font-weight: 500;
}
#sidebar .menu-item.has-sub.expand > .menu-link:hover {
    background: hsl(var(--sidebar-accent) / .6);
}
/* 父項本身就是所在頁（例：點了「訂單系統」自己那一頁）才給底色 */
#sidebar .menu-item.has-sub.active:not(.expand) > .menu-link {
    background: hsl(var(--sidebar-accent));
}

/* ── 子選單：左側引導線（shadcn SidebarMenuSub 的核心視覺） ── */
.app-sidebar .menu-submenu {
    margin: 2px 0 2px 22px;
    padding-left: 10px;
    border-left: 1px solid hsl(var(--sidebar-border));
}
.app-sidebar .menu-submenu .menu-link {
    min-height: 28px;
    padding: 4px 8px;
    margin: 1px 0;
    font-size: .8125rem;
    border-radius: var(--radius-sm);
}
/* 子項沒有圖示欄，文字直接靠左（原本會空一格圖示位） */
.app-sidebar .menu-submenu .menu-link .menu-icon { display: none; }

/* ── caret：展開時轉 90 度（shadcn 的 chevron 行為） ── */
.app-sidebar .menu-caret {
    margin-left: auto;
    transition: transform .15s ease;
    display: inline-flex;
    align-items: center;
}
.app-sidebar .menu-caret svg { width: 14px; height: 14px; }
/*〔存查 s0550〕*/
#sidebar .menu-item.expand > .menu-link .menu-caret { transform: rotate(90deg); }

/* ── 分組標籤（SidebarGroupLabel）：小字、次要色、不可點的語氣 ── */
/*〔存查 s0551〕*/
.app-sidebar .menu-header {
    height: 32px;
    display: flex;
    align-items: center;
    padding: 0 16px;
    margin-top: 8px;
    font-size: .75rem;
    font-weight: 500;
    letter-spacing: .01em;
    color: hsl(var(--sidebar-fg) / .7);
    text-transform: none;
}

/*〔存查 s0552〕*/

/* ── 列內動作鈕：實心 → ghost ── */
/*〔存查 s0553〕*/
.app-content td .btn.btn-xs.btn-dark:not(.btn-rounded):not([class*="rounded-pill"]),
.app-content td a.btn.btn-xs.btn-dark:not(.btn-rounded):not([class*="rounded-pill"]) {
    background: transparent;
    border-color: transparent;
    color: hsl(var(--foreground));
    border-radius: var(--radius-md) !important;   /* 與 .fb-row-action 同階 */
    box-shadow: none;
}
/*〔存查 s0554〕*/
.app-content td .btn.btn-xs.btn-dark:not(.btn-rounded):not([class*="rounded-pill"]):hover,
.app-content td a.btn.btn-xs.btn-dark:not(.btn-rounded):not([class*="rounded-pill"]):hover,
.app-content td .btn.btn-xs.btn-dark:not(.btn-rounded):not([class*="rounded-pill"]):focus-visible {
    background: hsl(var(--accent));
    border-color: transparent;
    color: hsl(var(--accent-foreground));
}
.app-content td .btn.btn-xs.btn-dark svg { width: 16px; height: 16px; }

/*〔存查 s0555〕*/
.app-content td a.btn.btn-xs.btn-light:not(.btn-rounded):not([class*="rounded-pill"]),
.app-content td button.btn.btn-xs.btn-light:not(.btn-rounded):not([class*="rounded-pill"]),
.app-content td a.btn.btn-xs.btn-white:not(.btn-rounded):not([class*="rounded-pill"]),
.app-content td button.btn.btn-xs.btn-white:not(.btn-rounded):not([class*="rounded-pill"]),
.app-content td a.btn.btn-xs.btn-secondary:not(.btn-rounded):not([class*="rounded-pill"]),
.app-content td button.btn.btn-xs.btn-secondary:not(.btn-rounded):not([class*="rounded-pill"]),
.app-content td a.btn.btn-xs.btn-default:not(.btn-rounded):not([class*="rounded-pill"]),
.app-content td button.btn.btn-xs.btn-default:not(.btn-rounded):not([class*="rounded-pill"]) {
    background: transparent;
    border-color: transparent;
    color: hsl(var(--foreground));
    border-radius: var(--radius-md) !important;   /* 與 .fb-row-action 同階 */
    box-shadow: none;
}
.app-content td a.btn.btn-xs.btn-light:not(.btn-rounded):not([class*="rounded-pill"]):hover,
.app-content td button.btn.btn-xs.btn-light:not(.btn-rounded):not([class*="rounded-pill"]):hover,
.app-content td a.btn.btn-xs.btn-white:not(.btn-rounded):not([class*="rounded-pill"]):hover,
.app-content td button.btn.btn-xs.btn-white:not(.btn-rounded):not([class*="rounded-pill"]):hover,
.app-content td a.btn.btn-xs.btn-secondary:not(.btn-rounded):not([class*="rounded-pill"]):hover,
.app-content td button.btn.btn-xs.btn-secondary:not(.btn-rounded):not([class*="rounded-pill"]):hover,
.app-content td a.btn.btn-xs.btn-default:not(.btn-rounded):not([class*="rounded-pill"]):hover,
.app-content td button.btn.btn-xs.btn-default:not(.btn-rounded):not([class*="rounded-pill"]):hover {
    background: hsl(var(--accent));
    border-color: transparent;
    color: hsl(var(--accent-foreground));
}

/* 破壞性動作 = shadcn 的 destructive ghost：透明底 + 紅字，hover 才給淡紅底。
   （實心紅方塊在列表裡會比「編輯」還搶眼，主次顛倒） */
.app-content td a.btn.btn-xs.btn-danger:not(.btn-rounded):not([class*="rounded-pill"]),
.app-content td button.btn.btn-xs.btn-danger:not(.btn-rounded):not([class*="rounded-pill"]) {
    background: transparent;
    border-color: transparent;
    color: hsl(var(--destructive-fg));
    border-radius: var(--radius-sm) !important;
    box-shadow: none;
}
.app-content td a.btn.btn-xs.btn-danger:not(.btn-rounded):not([class*="rounded-pill"]):hover,
.app-content td button.btn.btn-xs.btn-danger:not(.btn-rounded):not([class*="rounded-pill"]):hover {
    background: hsl(var(--destructive) / .1);
    border-color: transparent;
    color: hsl(var(--destructive-fg));
}

/*〔存查 s0556〕*/
.app-content td a.btn.btn-xs:not(.btn-rounded):not([class*="rounded-pill"]),
.app-content td button.btn.btn-xs:not(.btn-rounded):not([class*="rounded-pill"]) {
    min-height: 32px;
    min-width: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* icon 尺寸比照 shadcn size-4，與 btn-dark 那條一致 */
.app-content td a.btn.btn-xs.btn-light svg,
.app-content td button.btn.btn-xs.btn-light svg,
.app-content td a.btn.btn-xs.btn-white svg,
.app-content td button.btn.btn-xs.btn-white svg,
.app-content td a.btn.btn-xs.btn-secondary svg,
.app-content td button.btn.btn-xs.btn-secondary svg,
.app-content td a.btn.btn-xs.btn-default svg,
.app-content td button.btn.btn-xs.btn-default svg,
.app-content td a.btn.btn-xs.btn-danger svg,
.app-content td button.btn.btn-xs.btn-danger svg { width: 16px; height: 16px; }

/* ── 表格縮圖 ── */
.app-content td img.fb-thumb,
.app-content td .fb-thumb > img,
.app-content table td > img:not(.rounded-circle):not([class*="rounded-pill"]) {
    border-radius: var(--radius-sm) !important;
    border: 1px solid hsl(var(--border));
    background: hsl(var(--muted));
    object-fit: cover;
}

/*〔存查 s0557〕*/

/*〔存查 s0558〕*/
#sidebar .menu-link,
#sidebar .menu-submenu .menu-link {
    padding-left: 8px;
    padding-right: 8px;
}
/* shadcn 只有「一層」8px：SidebarGroup p-2 提供外距，SidebarMenuButton p-2 提供內距，
   圖示落在 16px。這裡原本是「容器 padding 8 + 連結 margin 8 + 內距 8」三層疊加 → 圖示 24px。
   把連結的左右 margin 收掉，改由 .menu 容器統一給，才會落在 16px。 */
#sidebar .menu { padding-left: 8px; padding-right: 8px; }
#sidebar .menu > .menu-item > .menu-link { margin-left: 0; margin-right: 0; }
#sidebar .menu-submenu .menu-link { margin-left: 0; margin-right: 0; }

/* ── ② 文字一律 truncate，不換行（shadcn 硬規則） ── */
#sidebar .menu-link { overflow: hidden; }
.app-sidebar .menu-link .menu-text,
.app-sidebar .menu-submenu .menu-link {
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* 子項本身是 flex 容器時，讓文字節點可壓縮 */
.app-sidebar .menu-submenu .menu-link > * { min-width: 0; }

/*〔存查 s0559〕*/
#sidebar .menu-submenu {
    margin: 2px 0 2px 14px;
    padding-left: 10px;
    border-left: 1px solid hsl(var(--sidebar-border));
}
#sidebar .menu-submenu .menu-submenu { margin-left: 8px; padding-left: 8px; }

/* ── ③ badge 不參與佔位（shadcn absolute right-1） ── */
.app-sidebar .menu-item { position: relative; }
#sidebar .menu-link { position: relative; }
#sidebar .menu-item.has-sub > .menu-link { padding-right: 44px; }
/*〔存查 s0560〕*/
.app-sidebar .menu-badge {
    position: absolute;
    right: 26px;                 /* 讓開右側的 caret */
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    font-size: .6875rem;
    line-height: 1;
    padding: 3px 6px;
}
/* 沒有 caret 的項目（不可展開）badge 可以更靠右 */
/*〔存查 s0561〕*/
#sidebar .menu-item:not(.has-sub) > .menu-link .menu-badge { right: 8px; }
#sidebar .menu-item:not(.has-sub) > .menu-link:has(.menu-badge) { padding-right: 40px; }
/* caret 也絕對定位，才不會跟 badge 互推 */
.app-sidebar .menu-caret {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 0;
}
#sidebar .menu-item.expand > .menu-link .menu-caret { transform: translateY(-50%) rotate(90deg); }

/*〔存查 s0562〕*/

#sidebar .menu-profile { padding: 8px; margin-bottom: 4px; }

/* 裝飾用的彈跳球 canvas：shadcn 的 header 是乾淨的，不放裝飾動畫 */
#sidebar .menu-profile-cover { display: none !important; }

#sidebar .menu-profile-link {
    display: flex;
    align-items: center;
    /*〔存查 s0563〕*/
    gap: 8px;
    height: 48px;                      /* shadcn size="lg" */
    padding: 8px;
    border-radius: var(--radius-sm);
    overflow: hidden;
    transition: background-color .12s ease;
}
#sidebar .menu-profile-link:hover { background: hsl(var(--sidebar-accent)); }

#sidebar .menu-profile-image {
    width: 32px; height: 32px;
    flex: 0 0 32px;
    border-radius: 8px;                /* rounded-lg */
    overflow: hidden;
}
#sidebar .menu-profile-image img { width: 100%; height: 100%; object-fit: cover; }

/* 文字區：兩行 grid，兩行都 truncate */
#sidebar .menu-profile-info {
    display: grid;
    /*〔存查 s0564〕*/
    grid-template-rows: 16px 16px;   /* 16+16 = 32px 內容區，第二行要塞得下續約 chip */
    align-content: center;
    flex: 1 1 auto;
    min-width: 0;
    gap: 0;
    font-size: .875rem;
    font-weight: 600;                  /* 第一行＝組織名 */
}
#sidebar .menu-profile-info .tenant-name,
#sidebar .menu-profile-info .tenant-meta { line-height: 16px; }
/* 兩行都 truncate（shadcn 的 SidebarMenuButton 是 overflow-hidden + truncate） */
#sidebar .menu-profile-info .tenant-name,
#sidebar .menu-profile-info .tenant-meta {
    min-width: 0;
    /*〔存查 s0565〕*/
    display: flex;
    /*〔存查 s0566〕*/
    align-items: center;
    /*〔存查 s0567〕*/
    /*〔存查 s0568〕*/
    gap: 2px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
/* 訂閱狀態 badge 文字短且固定，不參與壓縮 —— 讓壓縮壓力留在可截斷的租戶碼上 */
#sidebar .menu-profile-info .tenant-meta > .btn { flex: 0 0 auto; }
#sidebar .menu-profile-info .tenant-name { font-size: .875rem; font-weight: 600; }
/*〔存查 s0569〕*/
#sidebar .menu-profile-info .tenant-code {
    /*〔存查 s0570〕*/
    overflow: hidden; text-overflow: ellipsis;
    font-size: .75rem; font-weight: 400;
    /*〔存查 s0571〕*/
    color: hsl(var(--sidebar-fg) / .75);
}
#sidebar .menu-profile-info .tenant-meta svg { width: 12px; height: 12px; flex: 0 0 12px; color: hsl(var(--sidebar-fg) / .6); }
/* 第二行：客戶代號 + 續約訂閱，並排、次要色、可截斷 */
#sidebar .menu-profile-info h6 {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin: 0;
    font-size: .75rem;
    font-weight: 400;
    /*〔存查 s0572〕*/
    color: hsl(var(--sidebar-fg) / .9) !important;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
#sidebar .menu-profile-info h6 svg { width: 12px; height: 12px; }
/* 「續約訂閱」＝ shadcn 的第二行「方案」，收成 inline chip 不另起一行 */
#sidebar .menu-profile-info .btn-yellow {
    /*〔存查 s0573〕*/

    /*〔存查 s0574〕*/
    font-size: 12px !important;
    line-height: 12px !important;
    padding: 1px 4px !important;
    /*〔存查 s0575〕*/
    margin: 0 !important;
    height: 16px;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
}
/* caret 改成右側的「可切換」指示，不再佔一整行 */
/*〔存查 s0576〕*/
#sidebar .menu-profile-info { position: relative; padding-right: 18px; }
#sidebar .menu-profile-info > .menu-caret {
    /*〔存查 s0577〕*/
    position: absolute;
    right: 0; top: 50%;
    /*〔存查 s0578〕*/
    transform: translateY(-50%);
    margin: 0;
}

/*〔存查 s0579〕*/

#header .navbar-nav > .navbar-item > .navbar-link,
.app-header .navbar-nav > .navbar-item > .navbar-link,
#header .navbar-nav > .navbar-item > a,
.app-header .navbar-nav > .navbar-item > a {
    height: 32px;
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0 8px;
    border-radius: var(--radius-md);   /* 與 btn-sm 同階 */
    font-size: .875rem;
    line-height: 1;
}
/*〔存查 s0580〕*/
#header .navbar-nav > .navbar-item > a,
.app-header .navbar-nav > .navbar-item > a {
    min-width: 32px;
    justify-content: center;
}
#header .navbar-nav .navbar-link:hover,
.app-header .navbar-nav .navbar-link:hover,
#header .navbar-nav > .navbar-item > a:hover,
.app-header .navbar-nav > .navbar-item > a:hover {
    background: hsl(var(--accent));
    color: hsl(var(--accent-foreground));
}
/* 使用者頭像：shadcn Avatar 在 header 是 size-8 的圓角方形 */
#header .navbar-nav img,
.app-header .navbar-nav img {
    width: 24px; height: 24px;
    border-radius: 6px;
    object-fit: cover;
}

/*〔存查 s0581〕*/

.form-control:focus,
.form-select:focus,
.page-link:focus-visible,   /*〔存查 s0582〕*/
.dropdown-item:focus-visible,
.form-check-input:focus {
    outline: none;
    /*〔存查 s0583〕*/
    box-shadow: 0 0 0 3px hsl(var(--ring) / .5);
    border-color: hsl(var(--ring));
}

/*〔存查 s0584〕*/
.daterangepicker {
    border-radius: var(--radius-md);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);
    border: 1px solid hsl(var(--border));
}
.daterangepicker .ranges li { border-radius: var(--radius-sm); }
/* 選中的快捷選項：shadcn 的 Popover 選項是 accent 底色，不是實心反白 */
.daterangepicker .ranges li.active {
    background: hsl(var(--accent));
    color: hsl(var(--accent-foreground));
    font-weight: 500;
}

/* ── SSOT 元件：x-row-action（列內動作鈕）與 x-thumb（商品縮圖）的樣式 ──
   建立原因見兩支元件檔的註解：全站盤點出
   57 顆帶筆圖示的按鈕用了 20 種 class 組合、33 處商品圖用了 22 種寫法。 */
.fb-row-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px; height: 32px;          /* shadcn size="icon" */
    padding: 0;
    border: 0;
    background: transparent;            /* variant="ghost" */
    color: hsl(var(--foreground));
    border-radius: var(--radius-md);   /* shadcn Button 一律 rounded-md */
    transition: background-color .12s ease, color .12s ease;
    cursor: pointer;
}
.fb-row-action:hover,
.fb-row-action:focus-visible {
    background: hsl(var(--accent));
    color: hsl(var(--accent-foreground));
}
.fb-row-action:focus-visible {
    outline: none;
    /* §S-73：原 `0 0 0 2px hsl(var(--background)), 0 0 0 4px hsl(var(--ring) / .5)` → 官方兩層 */
    border-color: hsl(var(--ring));
    box-shadow: 0 0 0 3px hsl(var(--ring) / .5);
}
.fb-row-action svg { width: 16px; height: 16px; }
.fb-row-action-danger { color: hsl(var(--destructive-fg)); }
.fb-row-action-danger:hover { background: hsl(var(--destructive) / .1); color: hsl(var(--destructive-fg)); }

/*〔存查 s0585〕*/
.fb-row-action:disabled,
.fb-row-action[disabled],
.fb-row-action.disabled {
    opacity: .4;
    cursor: not-allowed;
    pointer-events: none;
}

.fb-thumb {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--fb-thumb-size, 40px);
    height: var(--fb-thumb-size, 40px);
    flex: 0 0 var(--fb-thumb-size, 40px);
    border-radius: var(--radius-md);   /* rounded-md，與 Button 同階 */
    border: 1px solid hsl(var(--border));
    background: hsl(var(--muted));      /* 圖沒載入時的佔位，版面不會塌 */
    overflow: hidden;
}
/* 圓形＝頭像語意（原本全站有 3 處 rounded-circle 的人物頭像，形狀不能被方形洗掉） */
/*〔存查 s0586〕*/
.fb-thumb-circle { border-radius: 9999px; }
/*〔存查 s0587〕*/
.fb-thumb > img {
    /*〔存查 s0588〕*/
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;   /* 形狀由容器的 overflow:hidden 決定 */
    position: static !important;
    transform: none !important;
    float: none !important;
    display: block !important;
}
.fb-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
/*〔存查 s0589〕*/
.fb-thumb .fb-thumb-empty { width: 40%; height: 40%; color: hsl(var(--muted-foreground)); opacity: .6; }
/*〔存查 s0590〕*/
.fb-thumb-link { display: inline-block; line-height: 0; }


/*〔存查 s0591〕*/

/*〔存查 s0592〕*/
.form-range { accent-color: hsl(var(--dark)); }
.form-range:focus-visible {
    outline: none;
    /* §S-73：原 `0 0 0 2px hsl(var(--background)), 0 0 0 4px hsl(var(--ring) / .5)` → 官方兩層 */
    border-color: hsl(var(--ring));
    box-shadow: 0 0 0 3px hsl(var(--ring) / .5);
}

/*〔存查 s0593〕*/
.modal-header { border-bottom: 0; }
.modal-footer { border-top: 0; }

/*〔存查 s0594〕*/
.modal-title { font-size: 1.125rem; font-weight: 600; }

/*〔存查 s0595〕*/
#sidebar #appSidebarProfileMenu {
    /*〔存查 s0596〕*/
    background: hsl(var(--sidebar-accent) / .55);
    /*〔存查 s0597〕*/
    border-radius: var(--radius-md);
    /*〔存查 s0598〕*/
    margin: 2px 8px 6px;
    /*〔存查 s0599〕*/
    padding: 4px 0;
}
#sidebar #appSidebarProfileMenu .menu-link { margin-left: 4px; margin-right: 4px; }

/*〔存查 s0600〕*/
/*〔存查 s0601〕*/
#sidebar .menu-profile-info .tenant-code {
    /*〔存查 s0602〕*/
    flex: 0 0 auto;
    /*〔存查 s0603〕*/
    overflow: visible;
    /*〔存查 s0604〕*/
    text-overflow: clip;
}
#sidebar .menu-profile-info .tenant-meta > .btn {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

/*〔存查 s0605〕*/

/*〔存查 s0606〕*/
@media (max-width: 767.98px) {
    .fb-row-action { position: relative; }
    .fb-row-action::after {
        content: '';
        position: absolute;
        inset: -8px;            /* shadcn 的 -inset-2 */
    }
    /* 頂 bar：不外擴，改補間距（原本 4px，shadcn SiteHeader 是 gap-2 = 8px） */
    .app-header .navbar-nav > .navbar-item + .navbar-item { margin-left: 4px; }

    /*〔存查 s0607〕*/
    .app-header .dropdown-menu {
        /*〔存查 s0608〕*/
        position: fixed !important;
        top: calc(var(--fb-header-h) + 4px) !important;
        right: .5rem !important;
        left: auto !important;
        width: min(360px, calc(100vw - 1rem)) !important;
        min-width: 0 !important;
        max-width: none !important;
        transform: none !important;
        margin: 0 !important;
    }
}

/*〔存查 s0609〕*/
.app-header .navbar-link:focus-visible,
.app-header .navbar-item > a:focus-visible,
.app-header .navbar-mobile-toggler:focus-visible {
    outline: none;
    border-radius: var(--radius-md);
    /* §S-73：原 `0 0 0 2px hsl(var(--background)), 0 0 0 4px hsl(var(--ring) / .5)` → 官方兩層 */
    border-color: hsl(var(--ring));
    box-shadow: 0 0 0 3px hsl(var(--ring) / .5);
}
.app-header .navbar-link:focus:not(:focus-visible),
.app-header .navbar-item > a:focus:not(:focus-visible),
.app-header .navbar-mobile-toggler:focus:not(:focus-visible) {
    outline: none;
    box-shadow: none;
}

/*〔存查 s0610〕*/
@media (max-width: 767.98px) {
    /*〔存查 s0611〕*/
    .fb-filter:not(.is-open) .fb-filter-row [data-filter-more] { display: none !important; }

    /*〔存查 s0612〕*/
    /*〔存查 s0613〕*/
    /*〔存查 s0614〕*/
    .fb-filter-row > div:not(.input-group) { min-width: 0 !important; }
    /*〔存查 s0615〕*/
    .fb-filter-row > div:not(.input-group) > input[type="text"],
    .fb-filter-row > div:not(.input-group) > input:not([type]) { min-width: 0 !important; }
    /*〔存查 s0616〕*/
    .fb-filter-row > div:not(.input-group):has(> input[type="text"]),
    .fb-filter-row > div:not(.input-group):has(> input:not([type])) { flex: 1 1 120px; }
    /* 日期這種「輸入框＋附加鈕」一組的，寧可換行到下一列，也不能自己內部斷開 */
    /*〔存查 s0617〕*/
    .fb-filter-row .input-group { flex-wrap: nowrap !important; flex: 0 0 auto; }
}

/*〔存查 s0618〕*/
.btn.btn-lg:not(.btn-icon) {
    min-height: 40px;
    padding: 0 2rem;
    font-size: .875rem;
    border-radius: var(--radius-md);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/*〔存查 s0619〕*/

/* --- S-1. 寬度工具 .w-150px -------------------------------------------------
   CA 的 .w-*px 工具組，肥肥用到 w-100px/w-200px 等已在共用章節補過，
   seller 多用了一個 w-150px（PackagingMachine/Order/modify_item.blade.php 商品總計欄）。 */
.w-150px { width: 150px !important; }

/*〔存查 s0620〕*/
.bootstrap-timepicker .input-group-addon i {
    width: auto;
    height: auto;
    display: inline;
}

/*〔存查 s0621〕*/
.form-floating {
    display: flex;
    flex-direction: column;
    /* position:relative 保留 —— 登入頁的「顯示密碼」眼睛圖示是 absolute 定位，靠它當參考框 */
}
/* 排序：label(1) → 輸入框(2) → 其餘（.invalid-feedback 等）(3)。
   不能用 flex-direction: column-reverse，那會把 .invalid-feedback 甩到最上面。 */
.form-floating > * { order: 3; }
.form-floating > label { order: 1; }
.form-floating > .form-control,
.form-floating > .form-select,
.form-floating > .form-control-plaintext { order: 2; }

/* label：解除 Bootstrap 的絕對定位／滿版遮罩／縮放位移，改成規格 §6 的欄位標籤 */
.form-floating > label {
    position: static;
    width: auto;
    height: auto;
    max-width: 100%;
    padding: 0;
    border: 0;
    overflow: visible;
    pointer-events: auto;
    transition: none;
    transform: none !important;          /* 蓋掉 :not(:placeholder-shown) ~ label 的 scale(.85) */
    margin-bottom: 6px;
    font-size: 12px !important;          /* 蓋掉 view 寫死的 .fs-13px（規格 §6：label 12px/500） */
    font-weight: 500;
    line-height: 1.4;
    color: hsl(var(--muted-foreground)) !important;   /* 蓋掉 view 寫死的 .text-gray-600 */
}
/* Bootstrap 用 label::after 畫一塊「蓋住邊框」的底色補丁，堆疊式不需要，留著會多一塊色塊 */
.form-floating > label::after { display: none; content: none; }

/* 輸入框：解除浮動標籤專用的上下內距（1.625rem/.625rem）與 58px 高 */
.form-floating > .form-control,
.form-floating > .form-select,
.form-floating > .form-control:focus,
.form-floating > .form-control:not(:placeholder-shown),
.form-floating > .form-control-plaintext:focus,
.form-floating > .form-control-plaintext:not(:placeholder-shown) {
    height: 36px;
    min-height: 36px;
    padding-top: 0;
    padding-bottom: 0;
    line-height: 1.4;
}

/* 「顯示密碼」眼睛圖示（login/sso-login 的 #checkEye，view 寫死 top:50%）：
   容器變高之後 50% 會落在 label 那一行 → 改成貼齊輸入框（容器最後一個在流內的元素）。
   這兩處的 .form-floating 內沒有 .invalid-feedback，輸入框就是最底部，bottom:0 對得準。 */
.form-floating > i,
.form-floating > svg {
    position: absolute !important;
    top: auto !important;
    bottom: 0 !important;
    right: 12px !important;
    height: 36px;
    display: flex !important;
    align-items: center;
    transform: none !important;
    font-size: 15px !important;          /* view 寫死 fa-2xl(2em)＝26px，對 36/40px 的框太大 */
    line-height: 1;
    color: hsl(var(--muted-foreground)) !important;   /* 蓋掉 inline style="color:#000" */
    cursor: pointer;
    z-index: 2;
}

/*〔存查 s0622〕*/

/*〔存查 s0623〕*/
.app-content :not(.input-group-sm):not(.input-group-lg) > .form-control:not(textarea):not(.form-control-sm):not(.form-control-lg):not(.form-control-color):not([type="file"]):not([type="color"]),
.app-content :not(.input-group-sm):not(.input-group-lg) > .form-select:not(.form-select-sm):not(.form-select-lg):not([multiple]):not([size]) {
    height: 36px;
    min-height: 36px;
    font-size: 14px;                     /* 規格 §0：default 控制項字級 14px */
}
/*〔存查 s0624〕*/
.app-content :not(.input-group-sm):not(.input-group-lg) > .input-group-text {
    min-height: 36px;
    font-size: 14px;
}

/*〔存查 s0625〕*/
.app-content :not(.input-group-sm):not(.input-group-lg) > .btn:not(.btn-sm):not(.btn-xs):not(.btn-lg):not(.btn-icon):not(.btn-close),
.theme-panel .btn:not(.btn-sm):not(.btn-xs):not(.btn-lg):not(.btn-icon):not(.btn-close) {
    min-height: 36px;
    font-size: 14px;
    line-height: 22px;
    padding-top: 6px;
    padding-bottom: 6px;
}

/*〔存查 s0626〕*/
.app-content .btn.btn-xs:not(.btn-icon) {
    min-height: 24px;
    line-height: 18px;
    padding-top: 2px;
    padding-bottom: 2px;
}

/* (d) .h-45px（12 處，全部是 auth 五頁的輸入框）：
   45px 不在 32/36/40 任何一階上。登入類頁面上游已訂 `.login .form-control{min-height:40px}`
   ＝ shadcn 的 lg，送出鈕 .btn-lg 也是 40px → 登入頁收斂後整頁只剩「一種」高度。 */
/*〔存查 s0627〕*/
.form-control.h-45px,
.form-select.h-45px { height: 36px !important; min-height: 36px; }
.login .form-control.h-45px,
.login .form-select.h-45px,
.login .form-floating > .form-control,
.login .form-floating > .form-select { height: 40px !important; min-height: 40px; }
.login .form-floating > i,
.login .form-floating > svg { height: 40px; }

/*〔存查 s0628〕*/
.fs-9px, .fs-10px, .fs-11px,
.fs-7, .fs-9, .fs-10, .fs-11 { font-size: 12px !important; }

/*〔存查 s0629〕*/
.app-content .text-white:not([class*="bg-"]):not([class*="btn"]):not(.badge) { color: inherit !important; }
.app-content .text-white-50:not([class*="bg-"]):not([class*="btn"]):not(.badge) { color: inherit !important; opacity: .7; }

/*〔存查 s0630〕*/
/*〔存查 s0631〕*/
.app-content .card-img-overlay .text-white:not([class*="bg-"]):not([class*="btn"]):not(.badge),
.app-content .hover-show-elm .text-white:not([class*="bg-"]):not([class*="btn"]):not(.badge),
.app-content .image-inner .text-white:not([class*="bg-"]):not([class*="btn"]):not(.badge),
.app-content [class*="bg-gradient"] .text-white:not([class*="bg-"]):not([class*="btn"]):not(.badge),
.app-content [style*="background-image"] .text-white:not([class*="bg-"]):not([class*="btn"]):not(.badge),
.app-content .card-img-overlay .text-white-50:not([class*="bg-"]):not([class*="btn"]):not(.badge),
.app-content .hover-show-elm .text-white-50:not([class*="bg-"]):not([class*="btn"]):not(.badge),
.app-content .image-inner .text-white-50:not([class*="bg-"]):not([class*="btn"]):not(.badge),
.app-content [class*="bg-gradient"] .text-white-50:not([class*="bg-"]):not([class*="btn"]):not(.badge),
.app-content [style*="background-image"] .text-white-50:not([class*="bg-"]):not([class*="btn"]):not(.badge) {
    color: hsl(var(--dark-panel-foreground)) !important;
    opacity: 1;
}

/*〔存查 s0632〕*/
.btn.btn-yellow {
    background-color: hsl(var(--primary));
    border-color: hsl(var(--primary));
    color: hsl(var(--primary-foreground));
}
.btn.btn-yellow:hover,
.btn.btn-yellow:focus {
    background-color: hsl(var(--primary-light));
    border-color: hsl(var(--primary-light));
    color: hsl(var(--primary-foreground));
}
.btn.btn-yellow:active,
.btn.btn-yellow:focus-visible {
    background-color: hsl(var(--primary-dark));
    border-color: hsl(var(--primary-dark));
    color: hsl(var(--primary-foreground));
}

/*〔存查 s0633〕*/
.bg-indigo:not(.badge):not(.btn),
.bg-purple:not(.badge):not(.btn) {
    background-color: hsl(var(--dark-panel) / var(--bs-bg-opacity, 1)) !important;
    color: hsl(var(--dark-panel-foreground));
    --bs-card-color: hsl(var(--dark-panel-foreground));
    --bs-card-bg: transparent;
    --bs-card-cap-bg: transparent;
    --bs-card-cap-color: hsl(var(--dark-panel-foreground));
    --bs-card-border-color: hsl(0 0% 100% / .10);
    /*〔存查 s0634〕*/
    border-color: hsl(0 0% 100% / .10);
}
.bg-indigo:not(.badge):not(.btn) > .card-header,
.bg-indigo:not(.badge):not(.btn) > .card-footer,
.bg-purple:not(.badge):not(.btn) > .card-header,
.bg-purple:not(.badge):not(.btn) > .card-footer {
    background: transparent !important;
    color: hsl(var(--dark-panel-foreground)) !important;
    border-color: hsl(0 0% 100% / .10) !important;
}

/*〔存查 s0635〕*/
.text-body { color: hsl(var(--foreground)) !important; }
.text-body-secondary, .text-body-tertiary { color: hsl(var(--muted-foreground)) !important; }


/*〔存查 s0638〕*/

/*〔存查 s0639〕*/
.bg-gray-800 h1, .bg-gray-800 h2, .bg-gray-800 h3,
.bg-gray-800 h4, .bg-gray-800 h5, .bg-gray-800 h6,
.bg-gray-800 .h1, .bg-gray-800 .h2, .bg-gray-800 .h3,
.bg-gray-800 .h4, .bg-gray-800 .h5, .bg-gray-800 .h6,
.bg-indigo:not(.badge):not(.btn) h1, .bg-indigo:not(.badge):not(.btn) h2,
.bg-indigo:not(.badge):not(.btn) h3, .bg-indigo:not(.badge):not(.btn) h4,
.bg-indigo:not(.badge):not(.btn) h5, .bg-indigo:not(.badge):not(.btn) h6,
.bg-purple:not(.badge):not(.btn) h1, .bg-purple:not(.badge):not(.btn) h2,
.bg-purple:not(.badge):not(.btn) h3, .bg-purple:not(.badge):not(.btn) h4,
.bg-purple:not(.badge):not(.btn) h5, .bg-purple:not(.badge):not(.btn) h6 {
    color: hsl(var(--dark-panel-foreground));
}
.bg-gray-800 .text-gray-500,
.bg-gray-800 .text-gray-600,
.bg-gray-800 .text-gray-700,
.bg-gray-800 .text-gray,
.bg-gray-800 .text-silver,
.bg-gray-800 .text-muted,
.bg-indigo:not(.badge):not(.btn) .text-gray-500,
.bg-indigo:not(.badge):not(.btn) .text-gray-600,
.bg-indigo:not(.badge):not(.btn) .text-gray-700,
.bg-indigo:not(.badge):not(.btn) .text-gray,
.bg-indigo:not(.badge):not(.btn) .text-silver,
.bg-indigo:not(.badge):not(.btn) .text-muted,
.bg-purple:not(.badge):not(.btn) .text-gray-500,
.bg-purple:not(.badge):not(.btn) .text-gray-600,
.bg-purple:not(.badge):not(.btn) .text-gray-700,
.bg-purple:not(.badge):not(.btn) .text-gray,
.bg-purple:not(.badge):not(.btn) .text-silver,
.bg-purple:not(.badge):not(.btn) .text-muted {
    color: hsl(var(--dark-panel-foreground) / .65) !important;
}
/* 佔位級灰（--hint）在深面板上更淡一階，維持三層層次 */
.bg-gray-800 .text-gray-300,
.bg-indigo:not(.badge):not(.btn) .text-gray-300,
.bg-purple:not(.badge):not(.btn) .text-gray-300 {
    color: hsl(var(--dark-panel-foreground) / .5) !important;
}

/*〔存查 s0640〕*/
.bg-dark:not(.badge):not(.btn) h1, .bg-dark:not(.badge):not(.btn) h2,
.bg-dark:not(.badge):not(.btn) h3, .bg-dark:not(.badge):not(.btn) h4,
.bg-dark:not(.badge):not(.btn) h5, .bg-dark:not(.badge):not(.btn) h6,
.bg-dark:not(.badge):not(.btn) .h1, .bg-dark:not(.badge):not(.btn) .h2,
.bg-dark:not(.badge):not(.btn) .h3, .bg-dark:not(.badge):not(.btn) .h4,
.bg-dark:not(.badge):not(.btn) .h5, .bg-dark:not(.badge):not(.btn) .h6,
.bg-dark:not(.badge):not(.btn) .modal-title {
    color: hsl(var(--dark-foreground));
}
.bg-dark:not(.badge):not(.btn) .text-gray-500,
.bg-dark:not(.badge):not(.btn) .text-gray-600,
.bg-dark:not(.badge):not(.btn) .text-gray-700,
.bg-dark:not(.badge):not(.btn) .text-gray,
.bg-dark:not(.badge):not(.btn) .text-silver,
.bg-dark:not(.badge):not(.btn) .text-muted {
    color: hsl(var(--dark-foreground) / .65) !important;
}

/*〔存查 s0641〕*/

/* (a) --chart-1 踩到白底可讀的一階（亮色模式）。維持黃/琥珀色相家族。 */
:root {
  --chart-1: 40 92% 38%;                 /* #ba7f08 對白卡 3:1 PASS（原 49 100% 50% 只有 1.43:1） */
}

/* (b) 暗色模式的階：不是把亮色反轉，是各自挑「在 #18181b 上看得見」的一階
       （dataviz 的規矩：dark mode is selected, not an automatic flip）。 */
html.dark {
  --chart-1: 43 96% 56%;                 /* #fbbf24 琥珀提亮 */
  --chart-2: 0 0% 89.8%;                 /* #E5E5E5 zinc 翻成近白（原 #18181b 在暗卡上等於隱形）← §S-74 achromatic（原 240 5% 90% #e4e4e7，官方階 89.8%，色差 2/255） */
  --chart-3: 218 11% 65%;                /* #9ca3af */
  --chart-4: 215 16% 70%;
  --chart-5: 200 22% 62%;
  --chart-6: 173 30% 58%;
  --chart-7: 12 55% 68%;
  --chart-8: 262 45% 72%;
}

/* (c) 圖表空狀態：shadcn empty state（40px muted 圖示 + 標題 + 說明），
       不是巨大插圖，也不是讓使用者盯著一張畫著 0 的空座標軸猜。 */
.fb-chart-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 269px;                     /* 與 canvas 容器同高，有無資料時版面不跳動 */
  padding: 24px;
  text-align: center;
}
.fb-chart-empty > i {
  font-size: 40px;
  line-height: 1;
  color: hsl(var(--muted-foreground) / .45);
}
.fb-chart-empty .fb-chart-empty-title {
  font-size: 14px;
  font-weight: 500;
  color: hsl(var(--foreground));
}
.fb-chart-empty .fb-chart-empty-desc {
  font-size: 13px;
  font-weight: 400;
  color: hsl(var(--muted-foreground));
}

/*〔存查 s0642〕*/
.app-header .navbar-nav > .navbar-item > .navbar-link[data-theme-toggle],
#header .navbar-nav > .navbar-item > .navbar-link[data-theme-toggle] {
  min-width: 32px;
  justify-content: center;
  background: transparent;
  box-shadow: none;
}

.fb-ph-lead { display: contents; }


/*〔存查 s0643〕*/

:root {
  /* 窄條寬＝Color Admin 原值 60px（圖示 18px + 左右各 21px，恰好置中） */
  --fb-sidebar-w-mini: 60px;
}

@media (min-width: 992px) {

  /* ── (1) 內容區讓位量：220px → 60px（收合的全部意義就在這一條） ───────── */
  .app-sidebar-minified:not(.app-without-sidebar) #content.app-content {
    margin-left: var(--fb-sidebar-w-mini);
  }

  /* ── (2) 側欄本體縮成窄條；滑鼠移上去浮出展開 ─────────────────────── */
  .app-sidebar-minified #sidebar.app-sidebar {
    width: var(--fb-sidebar-w-mini);
    transition: width .15s ease, box-shadow .15s ease;
  }
  .app-sidebar-minified #sidebar.app-sidebar:hover {
    width: var(--fb-sidebar-w);
    /* 展開時是浮在內容之上的面板 → 給陰影，才看得出是覆蓋不是推擠 */
    box-shadow: 4px 0 24px rgb(0 0 0 / .12);
  }

  /* ── (3) 窄條態（沒滑到）：只留置中的圖示 ─────────────────────────── */
  .app-sidebar-minified #sidebar:not(:hover) .menu-link {
    justify-content: center;
    gap: 0;
    padding-left: 0;
    padding-right: 0;
  }
  .app-sidebar-minified #sidebar:not(:hover) .menu-text,
  .app-sidebar-minified #sidebar:not(:hover) .menu-caret,
  .app-sidebar-minified #sidebar:not(:hover) .menu-badge {
    display: none !important;
  }
  /* 分組標題：文字收起來，只留一條分隔線維持分組感（本站 _nav 目前沒有用
     .menu-header，這條是給日後加上時不會突然變成一坨亂碼寬度） */
  /*〔存查 s0644〕*/
  .app-sidebar-minified #sidebar:not(:hover) .menu-header {
    height: 1px;
    padding: 0;
    margin: 8px 12px;
    overflow: hidden;
    text-indent: -999em;
    background: hsl(var(--sidebar-border));
  }
  /* 之前被點開（.expand）的子選單，在窄條態不能露出來 —— 沒有文字的第二層
     只會是一排看不懂的縮排空白 */
  .app-sidebar-minified #sidebar:not(:hover) .menu-submenu {
    display: none !important;
  }
  /* 收合鈕：置中，箭頭翻面朝右（它現在的意思是「展開」） */
  .app-sidebar-minified #sidebar:not(:hover) .app-sidebar-minify-btn {
    margin: 0 auto !important;
    justify-content: center;
  }
  .app-sidebar-minified #sidebar .app-sidebar-minify-btn > svg,
  .app-sidebar-minified #sidebar .app-sidebar-minify-btn > i {
    transform: scaleX(-1);
  }

  /*〔存查 s0645〕*/
  .app-sidebar-minified #sidebar.app-sidebar:hover .menu-profile-link {
    grid-template-columns: 32px 1fr auto;
    justify-content: normal;
  }
  .app-sidebar-minified #sidebar.app-sidebar:hover .menu-profile-info {
    display: flex !important;
  }
  .app-sidebar-minified #sidebar.app-sidebar:hover .menu-profile .menu-caret {
    display: inline-flex !important;
  }

  /*〔存查 s0646〕*/
  .app-sidebar-minified #sidebar.app-sidebar:hover .menu-item.has-sub:hover > .menu-submenu {
    display: block;
  }
  .app-sidebar-minified #sidebar.app-sidebar:hover .menu-item.has-sub:hover > .menu-link .menu-caret {
    transform: rotate(90deg);
  }

  /*〔存查 s0647〕*/
  .app-sidebar-minified #sidebar.app-sidebar:has(:focus-visible) {
    width: var(--fb-sidebar-w);
    box-shadow: 4px 0 24px rgb(0 0 0 / .12);
  }
  .app-sidebar-minified #sidebar.app-sidebar:has(:focus-visible) .menu-link {
    justify-content: flex-start;
    gap: .5rem;
    padding-left: .5rem;
    padding-right: .5rem;
  }
  .app-sidebar-minified #sidebar.app-sidebar:has(:focus-visible) .menu-text {
    display: block !important;
  }
  .app-sidebar-minified #sidebar.app-sidebar:has(:focus-visible) .menu-caret {
    display: inline-flex !important;
  }
  .app-sidebar-minified #sidebar.app-sidebar:has(:focus-visible) .menu-profile-link {
    grid-template-columns: 32px 1fr auto;
    justify-content: normal;
  }
  .app-sidebar-minified #sidebar.app-sidebar:has(:focus-visible) .menu-profile-info {
    display: flex !important;
  }
  .app-sidebar-minified #sidebar.app-sidebar:has(:focus-visible) .menu-item.has-sub:focus-within > .menu-submenu {
    display: block !important;
  }
}

/*〔存查 s0648〕*/
@media (max-width: 991.98px) {
  .app-sidebar-minified #sidebar.app-sidebar .menu-profile-link {
    grid-template-columns: 32px 1fr auto;
    justify-content: normal;
  }
  .app-sidebar-minified #sidebar.app-sidebar .menu-profile-info {
    display: flex !important;
  }
  .app-sidebar-minified #sidebar.app-sidebar .menu-profile .menu-caret {
    display: inline-flex !important;
  }
}

/*〔存查 s0649〕*/
.page-header:has(> .ms-auto) > .fb-page-help,
.page-header:has(> .ms-auto) > .fb-ph-inline > .fb-page-help {
    margin-left: 0;
}

/*〔存查 s0650〕*/
.pagination .page-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    height: 32px;
    padding: 0 6px;
}
.pagination .page-link svg {
    width: 14px;
    height: 14px;
}

/*〔存查 s0651〕*/
#sidebar .menu-profile-info .tenant-code {
    color: hsl(var(--sidebar-fg) / .9);
}

/*〔存查 s0652〕*/
.app-content td > span.btn.btn-xs:not(.btn-rounded):not([class*="rounded-pill"]):not(.btn-dark):not(.btn-light):not(.btn-white):not(.btn-default):not(.btn-secondary):not(.btn-primary):not(.btn-yellow):not(.btn-green):not(.btn-success):not(.btn-red):not(.btn-danger):not(.btn-gray):not(.btn-warning):not(.btn-info):not(.btn-indigo):not(.btn-purple):not(.btn-teal):not(.btn-lime):not(.btn-pink):not(.btn-orange):not(.btn-blue):not(.btn-cyan) {
    background: transparent;
    border-color: transparent;
    box-shadow: none;
    padding: 0;
    color: inherit;
    font-weight: inherit;
}

/*〔存查 s0653〕*/
#gritter-notice-wrapper {
    top: 68px;                      /* 讓開頂 bar（.app-header 高 56px + 12px 間距） */
    right: 16px;
    width: 340px;
}
#gritter-notice-wrapper .gritter-item-wrapper {
    background: none;
    margin: 0 0 10px;
    filter: none;
}
#gritter-notice-wrapper .gritter-top,
#gritter-notice-wrapper .gritter-bottom {
    background: none;
    height: 0;
    margin: 0;
    padding: 0;
    font-size: 0;
    line-height: 0;
}
#gritter-notice-wrapper .gritter-item {
    background: hsl(var(--popover));
    color: hsl(var(--popover-foreground));
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
    box-shadow: 0 4px 12px -2px rgb(0 0 0 / .08);
    padding: 12px 40px 12px 14px;
    font-family: inherit;
}
#gritter-notice-wrapper .gritter-title {
    display: block;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
    color: hsl(var(--foreground));
    text-shadow: none;
    padding: 0;
    margin: 0 0 2px;
}
#gritter-notice-wrapper .gritter-item p {
    font-size: 13px;
    line-height: 1.5;
    color: hsl(var(--muted-foreground));
    margin: 0;
    padding: 0;
}
/* 關閉鈕：gritter 出廠是把「Close Notification」這段文字用 text-indent 推出畫面、
   再用精靈圖畫一個 ✕。文字保留（螢幕閱讀器要用），只把外觀換成 shadcn 的 ghost 圖示鈕。 */
#gritter-notice-wrapper .gritter-close {
    display: block;
    top: 8px;
    right: 8px;
    left: auto;
    width: 22px;
    height: 22px;
    background: none;
    border-radius: var(--radius-sm);
    text-indent: -9999px;
    overflow: hidden;
    opacity: .6;
    transition: background-color .15s ease, opacity .15s ease;
}
#gritter-notice-wrapper .gritter-close::before,
#gritter-notice-wrapper .gritter-close::after {
    content: "";
    position: absolute;
    left: 6px;
    top: 10px;
    width: 10px;
    height: 1.5px;
    background: hsl(var(--foreground));
    border-radius: 1px;
}
#gritter-notice-wrapper .gritter-close::before { transform: rotate(45deg); }
#gritter-notice-wrapper .gritter-close::after  { transform: rotate(-45deg); }
#gritter-notice-wrapper .gritter-close:hover {
    background: hsl(var(--accent));
    opacity: 1;
}

/*〔存查 s0654〕*/
.app-content .form-control.is-invalid,
.app-content .form-select.is-invalid,
.app-content .was-validated .form-control:invalid,
.app-content .was-validated .form-select:invalid {
    border-color: hsl(var(--destructive));
    background-image: none;
    padding-right: .75rem;
}
.app-content .form-control.is-invalid:focus,
.app-content .form-select.is-invalid:focus,
.app-content .was-validated .form-control:invalid:focus {
    box-shadow: 0 0 0 2px hsl(var(--background)), 0 0 0 4px hsl(var(--destructive) / .4);
    border-color: hsl(var(--destructive));
}
.app-content .form-control.is-valid,
.app-content .form-select.is-valid,
.app-content .was-validated .form-control:valid {
    border-color: hsl(var(--success, var(--border)));
    background-image: none;
    padding-right: .75rem;
}
.app-content .invalid-feedback,
.app-content .valid-feedback {
    font-size: 12px;
    margin-top: 4px;
}
/*〔存查 s0655〕*/
.app-content .invalid-feedback { color: hsl(var(--destructive-fg)); }
/* checkbox / radio 的錯誤態（shadcn 只換邊框色，不換底） */
.app-content .form-check-input.is-invalid {
    border-color: hsl(var(--destructive));
}

/*〔存查 s0656〕*/
.app-content .btn:disabled,
.app-content .btn.disabled,
.app-content fieldset:disabled .btn {
    cursor: not-allowed;
    pointer-events: auto;          /* 保留 cursor 提示（Bootstrap 預設 none 會連游標都不換） */
}
.app-content .btn.is-loading {
    position: relative;
    color: transparent !important;
    pointer-events: none;
}
.app-content .btn.is-loading > * { visibility: hidden; }
.app-content .btn.is-loading::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 14px;
    height: 14px;
    margin: -7px 0 0 -7px;
    border: 2px solid currentColor;
    border-top-color: transparent;
    border-radius: 50%;
    color: hsl(var(--foreground));
    animation: fbBtnSpin .6s linear infinite;
}
.app-content .btn-primary.is-loading::after,
.app-content .btn-yellow.is-loading::after { color: hsl(var(--primary-foreground)); }
.app-content .btn-dark.is-loading::after { color: hsl(var(--dark-foreground)); }
@keyframes fbBtnSpin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
    .app-content .btn.is-loading::after { animation-duration: 2s; }
}

/*〔存查 s0657〕*/
.app-content tbody tr:has(input[type="checkbox"]:checked) > * {
    background-color: hsl(var(--accent) / .6);
}
.app-content tbody tr:has(input[type="checkbox"]:checked):hover > * {
    background-color: hsl(var(--accent));
}

/*〔存查 s0658〕*/
/*〔存查 s0659〕*/
#sidebar .menu-profile-info .tenant-code {
    /*〔存查 s0660〕*/
    flex: 1 1 auto;
    /*〔存查 s0661〕*/
    min-width: 0;
    /*〔存查 s0662〕*/
    overflow: hidden;
    /*〔存查 s0663〕*/
    text-overflow: ellipsis;
}
/* 搬進帳戶區選單的訂閱狀態列：它不再是 profile 按鈕的一部分，
   不吃 .menu-profile-info 的 grid 兩行版面，只是一列靠左的狀態標籤。 */
#sidebar #appSidebarProfileMenu .fb-plan-status {
    display: flex;
    align-items: center;
    padding: 6px 12px 2px;
    grid-template-rows: none;
    height: auto;
    overflow: visible;
}
#sidebar #appSidebarProfileMenu .dropdown-divider {
    margin: 6px 12px;
    border-color: hsl(var(--sidebar-border));
    opacity: 1;
}

/*〔存查 s0664〕*/
.app-content table.fb-form-table > tbody > tr > td {
    padding-top: .5rem;
    padding-bottom: .5rem;
    border: 0;
    vertical-align: middle;
}
/* 第一欄＝label 欄：固定寬度讓所有列的控制項對齊成一直線（fatboy 用 style="width:170px"） */
.app-content table.fb-form-table > tbody > tr > td:first-child {
    width: 170px;
    padding-left: 0;
    white-space: nowrap;
}
.app-content table.fb-form-table > tbody > tr > td:last-child { padding-right: 0; }
/* 多行控制項（textarea / 一組欄位）的 label 要對齊到第一行，不是垂直置中 */
.app-content table.fb-form-table > tbody > tr:has(textarea) > td:first-child,
.app-content table.fb-form-table > tbody > tr:has(.row) > td:first-child { vertical-align: top; padding-top: .75rem; }
/* 表單型表格不該有列 hover（那是資料列的語彙，會讓人以為整列可點） */
.app-content table.fb-form-table > tbody > tr:hover > * { background: transparent; }
/* label：12px/500 --muted-foreground（規格 §6） */
.app-content table.fb-form-table .form-label { font-size: 12px; font-weight: 500; }
@media (max-width: 575.98px) {
    /* 手機：170px 的 label 欄會把控制項擠成一條縫 → 收窄 */
    .app-content table.fb-form-table > tbody > tr > td:first-child { width: 96px; white-space: normal; }
}

/*〔存查 s0665〕*/
.btn:focus-visible,
.form-control:focus,
.form-select:focus,
.page-link:focus-visible,   /*〔存查 s0666〕*/
.dropdown-item:focus-visible,
.form-check-input:focus,
.fb-tab:focus-visible,
.nav-link:focus-visible,
.select2-container--bootstrap-5 .select2-selection:focus {
    outline: none;
    outline-offset: 0;
}
/* .fb-tab（分段控制器）先前**完全沒有** focus-visible 規則 → 鍵盤操作量到的是
   Chrome 預設的 `outline: auto 1px rgb(0,95,204)` 藍框。補成與按鈕同一套間隙環。 */
.fb-tab:focus-visible,
.nav-link:focus-visible {
    /* §S-73：原 `0 0 0 2px hsl(var(--background)), 0 0 0 4px hsl(var(--ring) / .5)` → 官方兩層 */
    border-color: hsl(var(--ring));
    box-shadow: 0 0 0 3px hsl(var(--ring) / .5);
    border-radius: var(--radius-md);
}

/*〔存查 s0667〕*/
body :focus-visible {
    outline: none;
    /* §S-73：原 `box-shadow: 0 0 0 2px hsl(var(--background)), 0 0 0 4px hsl(var(--ring) / .5);`
       改成官方的兩層。border-color 這條在 border-width:0 的元素上是 no-op，
       等同 Tailwind 的 `border-ring`（它也只設 border-color，不設寬度）。 */
    border-color: hsl(var(--ring));
    box-shadow: 0 0 0 3px hsl(var(--ring) / .5);
}

/*〔存查 s0669〕*/
.dropdown-menu:not(.media-list) > .dropdown-item,
.dropdown-menu:not(.media-list) .dropdown-item,
.dropdown-menu:not(.media-list) > li > .dropdown-item {
    font-size: 14px;
}


/*〔存查 s0672〕*/
.app-header .navbar-brand small {
    opacity: 1 !important;
}

/*〔存查 s0673〕*/
.app-sidebar-minify-btn {
    padding: 6px;
    box-sizing: content-box;
}

/*〔存查 s0674〕*/
.btn:focus-visible,
.navbar-link.btn:focus-visible,
.app-content .btn:focus-visible {
    /*〔存查 s0675〕*/
    border-color: hsl(var(--ring)) !important;
    box-shadow: 0 0 0 3px hsl(var(--ring) / .5) !important;
    outline: none !important;
}

/*〔存查 s0676〕*/
:root                     { --muted-foreground-on-muted: 240 3.8% 43%; }
html.dark                 { --muted-foreground-on-muted: 240 5% 64.9%; }   /*〔存查 s0677〕*/
/* [data-bs-theme="light"]（AI 工具 hero 的「永遠亮色的島」，見 §補位 6）必須另外寫死：
   自訂屬性是在宣告的那個元素上就把 var() 代換掉並往下繼承的，
   html.dark 上算好的深色值會直接流進島內，壓在島內的亮色 --muted 上會慘不忍睹。 */
[data-bs-theme="light"]   { --muted-foreground-on-muted: 240 3.8% 43%; }

/* 自己就是 muted 面（背景與文字同一條規則給的） */
.list-thumb-placeholder,
.input-group-text,
.input-group-addon,
.datepicker .input-daterange .input-group-addon,
.fb-img-fallback {
    color: hsl(var(--muted-foreground-on-muted));
}
/*〔存查 s0678〕*/
.app-content .table > thead.table-light > tr > th,
.app-content .table > thead > tr.table-light > th,
.app-content .table > thead > tr > th.table-light,
.table-light,
.table-light > th,
.table-light > td {
    color: hsl(var(--muted-foreground-on-muted)) !important;
}
/* 原規則帶 !important，覆寫也必須帶（同特異度 + 排在後面才會贏） */
.badge.bg-white,
.badge.bg-grey, .badge.bg-gray, .badge.bg-silver,
.stat-pill.status-off, .status-off,
.stat-pill.status-none, .status-none {
    color: hsl(var(--muted-foreground-on-muted)) !important;
}
/*〔存查 s0679〕*/
.bg-light .text-muted,
.bg-light .text-secondary {
    color: hsl(var(--muted-foreground-on-muted)) !important;
}


/*〔存查 s0682〕*/
#sidebar .menu-profile-info .tenant-name { display: block; }

/*〔存查 s0683〕*/
/*〔存查 s0684〕*/
#sidebar .menu-profile-info {
    padding-right: 0;
    grid-template-columns: minmax(0, 1fr) 10px;
    column-gap: 2px;
}
#sidebar .menu-profile-info > .tenant-name,
#sidebar .menu-profile-info > .tenant-meta { grid-column: 1; }
#sidebar .menu-profile-info > .menu-caret {
    position: static;
    transform: none;
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: center;
    justify-self: end;
    /*〔存查 s0685〕*/
    width: 10px;
    min-width: 10px;
}
/*〔存查 s0686〕*/
#sidebar .menu-profile-info .tenant-meta { gap: 1px; }
#sidebar .menu-profile-info .tenant-meta > .btn.btn-yellow {
    /*〔存查 s0687〕*/
    padding-left: 5px !important;
    /*〔存查 s0688〕*/
    padding-right: 5px !important;
    flex: 0 0 auto;                 /* chip 永遠不被壓縮，寧可讓代號截斷 */
}
#sidebar .menu-profile-info .tenant-code {
    /*〔存查 s0689〕*/
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/*〔存查 s0690〕*/
#sidebar .menu-profile-link { padding-right: 4px; }

/*〔存查 s0691〕*/

/*〔存查 s0692〕*/
/*〔存查 s0693〕*/
.page-header > .fb-ph-actions { order: 50; margin-left: 0 !important; }
/* 還沒元件化、自己手刻 .ms-auto 動作組的頁首（例：Seller/includes/_plan_tabs 的
   無標題分支）也一起靠左，全站同一種節奏。只打 .page-header 的直接子代，
   卡片／表格／modal 裡的 .ms-auto 完全不受影響。 */
.page-header > .ms-auto { margin-left: 0 !important; }

/*〔存查 s0694〕*/
.page-header > .fb-page-help,
.page-header > .fb-ph-inline > .fb-page-help,
.page-header:has(> .fb-ph-actions) > .fb-page-help,
.page-header:has(> .fb-ph-actions) > .fb-ph-inline > .fb-page-help {
    order: 99;
    margin-left: auto !important;
}

/*〔存查 s0695〕*/
.fb-ph-subtitle {
    font-size: .8125rem;
    font-weight: 400;
    line-height: 1.4;
    min-width: 0;
    max-width: 22rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 0 1 auto;
}
/* 搬進頂 bar 後空間更緊，再收一階；頂 bar 本來就有 .fb-topbar-meta 的
   ≤767px 隱藏規則接住窄螢幕。 */
.fb-topbar-page .fb-ph-subtitle { max-width: 16rem; }
@media (max-width: 1199.98px) {
    .fb-topbar-page .fb-ph-subtitle { max-width: 10rem; }
}

/*〔存查 s0696〕*/
.fb-ph-nav {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    flex: 0 0 auto;
    border-radius: 8px;
    color: hsl(var(--muted-foreground));
    text-decoration: none;
    transition: background-color .15s ease, color .15s ease;
}
.fb-ph-nav:hover,
.fb-ph-nav:focus-visible {
    background-color: hsl(var(--accent));
    color: hsl(var(--foreground));
    text-decoration: none;
}
.fb-ph-nav:focus-visible {
    /* §S-73：原 `outline: 2px solid hsl(var(--ring)); outline-offset: 2px;` → 官方兩層 */
    outline: none;
    outline-offset: 0;
    border-color: hsl(var(--ring));
    box-shadow: 0 0 0 3px hsl(var(--ring) / .5);
}
.fb-ph-nav svg,
.fb-ph-nav i[data-lucide] { width: 16px; height: 16px; }
/* 搬進頂 bar 後跟著標題的字級縮一階，維持同一列的視覺重量 */
.fb-topbar-page .fb-ph-nav { width: 24px; height: 24px; }
.fb-topbar-page .fb-ph-nav svg { width: 15px; height: 15px; }

/*〔存查 s0697〕*/
#sidebar .menu-profile-info .tenant-meta {
    flex-wrap: nowrap;
    align-items: center;
}

/*〔存查 s0698〕*/
#sidebar .menu-profile-info .tenant-meta {
    justify-content: flex-start;
}
#sidebar .menu-profile-info .tenant-meta > * { margin-left: 0 !important; margin-right: 0 !important; }

/*〔存查 s0699〕*/
/*〔存查 s0700〕*/
#sidebar #appSidebarProfileMenu {
    background: transparent;
    border: 0;
    border-left: 1px solid hsl(var(--sidebar-border));
    box-shadow: none;
    border-radius: 0;
    padding: 2px 0 2px 10px;
    margin: 2px 8px 6px 22px;   /* 左側縮排＝shadcn 的 mx-3.5 量級 */
}
#sidebar #appSidebarProfileMenu .menu-item > .menu-link {
    border-radius: calc(var(--radius) - 3px);
    padding: 7px 10px;
    gap: 8px;
}
#sidebar #appSidebarProfileMenu .menu-item > .menu-link:hover {
    background: hsl(var(--accent));
    color: hsl(var(--accent-foreground));
}
/* 上面的 justify-content 沒有效果，因為真正把 ⓘ 與 chip 推到最右的是
   `.tenant-code { flex: 1 1 auto }` —— 它會**長大**填滿剩餘空間。
   改成 `0 1 auto`：可收縮（超長代號仍截斷）但不長大，三者才會貼左成一組。 */
#sidebar .menu-profile-info .tenant-code { flex: 0 1 auto; }
/*〔存查 s0701〕*/
#sidebar .menu-profile-info .tenant-meta { gap: 2px; }
#sidebar .menu-profile-info .tenant-meta > .btn.btn-yellow {
    /*〔存查 s0702〕*/
    padding-left: 4px !important;
    /*〔存查 s0703〕*/
    padding-right: 4px !important;
}


/*〔存查 s0709〕*/

/*〔存查 s0710〕*/
.app-sidebar-minify-btn {
    border-radius: var(--radius-md);
}

/*〔存查 s0711〕*/
@media (max-width: 991.98px) {
    #header .navbar-mobile-toggler {
        padding-top: 9px;
        padding-bottom: 9px;
    }
}

/*〔存查 s0712〕*/
.theme-panel .theme-collapse-btn {
    left: -32px;
    width: 32px;
    height: 32px;
    line-height: 32px;
    margin-top: -16px;
}

/*〔存查 s0713〕*/
.modal :not(.input-group-sm):not(.input-group-lg) > .btn:not(.btn-sm):not(.btn-xs):not(.btn-lg):not(.btn-icon):not(.btn-close) {
    min-height: 36px;
    font-size: 14px;
    line-height: 22px;
    padding-top: 6px;
    padding-bottom: 6px;
}
.modal .form-control-sm:not(textarea),
.modal .form-select-sm,
.modal .btn-sm,
.modal .input-group-sm > .form-control:not(textarea),
.modal .input-group-sm > .input-group-text,
.modal .select2-container--bootstrap-5 .select2-selection--single,
.modal .form-control-color {
    height: 32px;
    min-height: 32px;
    font-size: 13px;
}
.modal textarea.form-control-sm,
.modal .input-group-sm > textarea.form-control {
    font-size: 13px;
    min-height: 0;
    height: auto;
}
.modal .btn-sm {
    padding-top: 0;
    padding-bottom: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.modal .btn-sm.btn-icon,
.modal .btn-xs.btn-icon { padding: 0; }
.modal .btn.btn-xs:not(.btn-icon) {
    min-height: 24px;
    line-height: 18px;
    padding-top: 2px;
    padding-bottom: 2px;
}

/*〔存查 s0714〕*/
:root {
    /*〔存查 s0715〕*/
    --destructive: 357.1 100% 45.3%;       /* #E7000B ← 官方 A oklch(0.577 0.245 27.325)（溢色域已裁切），白字 4.77:1（原 0 72.2% 50.6% #DC2626 白字 4.83:1） */
}
/*〔存查 s0716〕*/
/*〔存查 s0717〕*/
.btn-outline-danger {
    --bs-btn-color: hsl(var(--destructive-fg));
}

/*〔存查 s0718〕*/
[data-bs-theme="light"],
[data-bs-theme="dark"] {
    --bs-body-bg: hsl(var(--background));
    --bs-body-color: hsl(var(--foreground));
    --bs-emphasis-color: hsl(var(--foreground));
    --bs-secondary-color: hsl(var(--muted-foreground));
    --bs-tertiary-bg: hsl(var(--muted));
    --bs-border-color: hsl(var(--border));
    --bs-border-radius: var(--radius);
    --bs-border-radius-sm: var(--radius-sm);
    --bs-border-radius-lg: var(--radius-xl);
    --bs-component-bg: hsl(var(--card));
    --bs-component-border-color: hsl(var(--border));
}
/*〔存查 s0719〕*/
[data-bs-theme="light"] {
    --bs-link-color: hsl(var(--link));
    --bs-link-hover-color: hsl(var(--link-hover));
    --bs-link-color-rgb: 9, 9, 11;
    --bs-link-hover-color-rgb: 9, 9, 11;
}
/*〔存查 s0720〕*/

/*〔存查 s0721〕*/
.theme-panel .theme-collapse-btn:focus-visible,
.app-sidebar-minify-btn:focus-visible {
    outline: none;
    /* §S-73：原 `0 0 0 2px hsl(var(--background)), 0 0 0 4px hsl(var(--ring))` → 官方兩層 */
    border-color: hsl(var(--ring));
    box-shadow: 0 0 0 3px hsl(var(--ring) / .5);
}
.app-sidebar-minify-btn:focus-visible {
    /* §S-73：原 `0 0 0 2px hsl(var(--sidebar-bg)), 0 0 0 4px hsl(var(--ring))`。
       上面「側欄那顆的 offset 環要用 --sidebar-bg」的理由是**間隙那一圈**會露白邊；
       官方寫法沒有間隙，所以這條的差異已消失。規則保留，值與上面同一套。 */
    border-color: hsl(var(--ring));
    box-shadow: 0 0 0 3px hsl(var(--ring) / .5);
}
.theme-panel .theme-collapse-btn:focus:not(:focus-visible),
.app-sidebar-minify-btn:focus:not(:focus-visible) {
    outline: none;
}
/*〔存查 s0722〕*/
.theme-panel .theme-collapse-btn:hover {
    background: hsl(var(--accent));
    color: hsl(var(--accent-foreground));
}
/*〔存查 s0723〕*/
.theme-panel .theme-collapse-btn:active {
    background: hsl(var(--accent));
    color: hsl(var(--accent-foreground));
    background-image: linear-gradient(hsl(var(--foreground) / .10), hsl(var(--foreground) / .10));
}
.app-sidebar-minify-btn:active {
    background: hsl(var(--sidebar-active-bg));
    color: hsl(var(--sidebar-fg-strong)) !important;
    background-image: linear-gradient(hsl(var(--sidebar-fg-strong) / .10), hsl(var(--sidebar-fg-strong) / .10));
}
.btn-close:active {
    background-color: hsl(var(--foreground) / .12);
    border-radius: var(--radius-sm);
}
/* disabled：這兩顆目前沒有停用情境，但四態要成套（未來 JS 一掛 .disabled
   就必須看得出不可點），用與 §S-21 送出中同一套「降對比 + not-allowed」。 */
.theme-panel .theme-collapse-btn.disabled,
.theme-panel .theme-collapse-btn[aria-disabled="true"],
.app-sidebar-minify-btn.disabled,
.app-sidebar-minify-btn[aria-disabled="true"] {
    opacity: .5;
    cursor: not-allowed;
    pointer-events: none;
}

/*〔存查 s0724〕*/
#sidebar .menu-profile-link { gap: 0; }
#sidebar .menu-profile-info .tenant-meta > .btn.btn-yellow {
    /* shadcn Badge：方角圓化而非藥丸、字重 600、內距 10/2 */
    border-radius: var(--radius-sm, 6px) !important;
    padding: 2px 8px !important;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    height: auto;
    min-height: 0;
    background: hsl(var(--primary)) !important;
    color: hsl(var(--primary-foreground)) !important;
    border: 0 !important;
}

/*〔存查 s0725〕*/
/*〔存查 s0726〕*/
.page-header > .fb-ph-actions { order: 1; }
.page-header > .fb-ph-freshness { order: 98; margin-left: auto; }
.page-header > .fb-page-help,
.page-header > .fb-ph-inline > .fb-page-help,
.page-header:has(> .fb-ph-actions) > .fb-page-help,
.page-header:has(> .fb-ph-actions) > .fb-ph-inline > .fb-page-help {
    margin-left: 0;
}

/*〔存查 s0727〕*/
.flow-stepper {
    /*〔存查 s0728〕*/
    --flow-arrow: 11px;
    --flow-gap: 2px;
    --flow-h: 32px;              /* shadcn 控制項尺度 sm＝32px，與頁面其他控制項同階 */
    display: flex;
    align-items: stretch;
}
.flow-stepper-track {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    /*〔存查 s0729〕*/
    overflow-x: auto;
    scrollbar-width: thin;
}
.flow-step {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 64px;
    min-height: var(--flow-h);
    flex-shrink: 0;
    /* 負 margin 讓後一塊的凹槽咬住前一塊的尖角，中間留 --flow-gap 的縫 */
    margin-left: calc((var(--flow-arrow) - var(--flow-gap)) * -1);
    padding: 0 12px 0 calc(4px + var(--flow-arrow));
    font-size: 13px;
    line-height: 1.2;
    white-space: nowrap;
    /* !important：主題的 `#content a:not(.btn):not(...)`（特異度 1,5,1）會把步驟塊
       當成一般內容連結上色＋加底線，不加就吃不到步驟條自己的配色。 */
    text-decoration: none !important;
    /* 左凹槽 + 右尖角 */
    clip-path: polygon(
        0 0,
        calc(100% - var(--flow-arrow)) 0,
        100% 50%,
        calc(100% - var(--flow-arrow)) 100%,
        0 100%,
        var(--flow-arrow) 50%
    );
    transition: background-color .15s ease, color .15s ease, filter .15s ease;
}
/* 第一塊：左邊是流程起點，不該有凹槽（會看起來像被前一站咬掉一角） */
.flow-stepper-track > .flow-step:first-child {
    margin-left: 0;
    padding-left: 10px;
    /*〔存查 s0730〕*/
    border-top-left-radius: var(--radius);
    /*〔存查 s0731〕*/
    border-bottom-left-radius: var(--radius);
    clip-path: polygon(
        0 0,
        calc(100% - var(--flow-arrow)) 0,
        100% 50%,
        calc(100% - var(--flow-arrow)) 100%,
        0 100%
    );
}
/* 線性流程的最後一塊保留尖角（它指向「流程結束」，不是指向下一站）——
   這是刻意的：把它收成方角會和一般 badge 難以區分。 */

/* ── 分叉（branch）：主幹跑完分成互斥的兩個結果 ──
   語意：已退貨 / 退貨取消 是二選一，畫成直線會被讀成「退完貨還要再走一步」。 */
.flow-stepper--branch .flow-stepper-track > .flow-step:last-child {
    /* 主幹最後一塊要露出尖角讓分叉欄咬住 */
    padding-right: 12px;
}
.flow-branch {
    display: inline-flex;
    flex-direction: column;
    gap: var(--flow-gap);
    /* 左移咬住主幹尖角；水平縫隙比垂直縫大一點，形狀才讀得出來 */
    margin-left: calc((var(--flow-arrow) - 4px) * -1);
}
.flow-branch-half {
    min-height: calc((var(--flow-h) - var(--flow-gap)) / 2);
    height: calc((var(--flow-h) - var(--flow-gap)) / 2);
    margin-left: 0;
    padding: 0 calc(10px + var(--flow-arrow));
    font-size: 12px;
    line-height: 1.05;
}
/* 上半：左凹槽承接主幹尖角、右收上半尖角；與下半合成同一支「兩頭箭頭」 */
.flow-branch-top {
    clip-path: polygon(0 0, calc(100% - var(--flow-arrow)) 0, 100% 100%, var(--flow-arrow) 100%);
}
.flow-branch-bottom {
    clip-path: polygon(var(--flow-arrow) 0, 100% 0, calc(100% - var(--flow-arrow)) 100%, 0 100%);
}

/* ── 狀態配色：沿用 §步驟箭頭（5877 行起）已定案的階層，這裡只是把 .flow-step
      掛進同一組規則。刻意重寫一份而不是去改上面那組的選擇器：那組同時服務
      .pm-stepper--chevron 與 .scr-stepper 兩個既有實作，動它等於同時動三個地方。 */
/*〔存查 s0732〕*/
.flow-stepper .flow-step.is-future {
    background-color: hsl(var(--muted)) !important;
    /*〔存查 s0733〕*/
    color: hsl(var(--muted-foreground)) !important;
    font-weight: 400 !important;
}
/*〔存查 s0734〕*/
.flow-stepper .flow-step.is-past {
    background-color: hsl(var(--muted)) !important;
    color: hsl(var(--foreground) / .6) !important;
    font-weight: 500 !important;
}
/*〔存查 s0735〕*/
/*〔存查 s0736〕*/
.flow-stepper .flow-step.is-current {
    /*〔存查 s0737〕*/
    background-color: hsl(var(--card)) !important;
    color: hsl(var(--foreground)) !important;
    font-weight: 600 !important;
    /*〔存查 s0738〕*/
    filter: drop-shadow(0 1px 2px hsl(var(--foreground) / .16))
            drop-shadow(0 0 .5px hsl(var(--border))) !important;
}
.flow-stepper a.flow-step:hover:not(.is-current) {
    background-color: hsl(var(--accent)) !important;
    color: hsl(var(--accent-foreground)) !important;
    filter: none !important;
}
.flow-stepper a.flow-step:focus-visible {
    /*〔存查 s0739〕*/
    outline: none;
    outline-offset: 0;
    border-color: hsl(var(--ring));
    box-shadow: 0 0 0 3px hsl(var(--ring) / .5);
    /* clip-path 會把 outline 一起裁掉 → 焦點框看不見。改用 z-index 抬高並取消裁切，
       只在鍵盤聚焦時發生，不影響一般狀態的形狀。 */
    clip-path: none;
    z-index: 1;
}

/*〔存查 s0740〕*/
.flow-stepper .flow-branch-half.is-future {
    background-color: hsl(var(--muted)) !important;
    /*〔存查 s0741〕*/
    color: hsl(var(--muted-foreground)) !important;
}
.flow-stepper a.flow-branch-half:hover:not(.is-current) {
    background-color: hsl(var(--accent)) !important;
    color: hsl(var(--accent-foreground)) !important;
}

/*〔存查 s0742〕*/
.flow-stepper .flow-step.is-future,
.flow-stepper .flow-branch-half.is-future {
    color: hsl(var(--muted-foreground-on-muted)) !important;
}

/*〔存查 s0743〕*/

/*〔存查 s0744〕*/
.spinner-border {
    width: 16px;
    height: 16px;
    border-width: 2px;
    color: hsl(var(--muted-foreground));
    vertical-align: -2px;
}
.spinner-border-sm { width: 12px; height: 12px; border-width: 2px; }
/* 放在按鈕裡時跟著按鈕的前景色走（例：深色送出鈕上的白色 loader） */
.btn .spinner-border { color: inherit; }

/* ── ② .avatar（auth/sso-account-prompt 的字母頭像）：
      shadcn Avatar ＝ 正圓 + bg-muted + 置中的 fallback 文字。 */
.avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 9999px;
    background: hsl(var(--muted));
    color: hsl(var(--muted-foreground));
    font-weight: 500;
    font-size: .875rem;
    flex-shrink: 0;
    overflow: hidden;
}

/* ── ③ .btn-group 的圓角接 token（不改 Bootstrap 的分組行為，只讓外側圓角
      與全站 --radius 家族一致，否則會露出 Bootstrap 預設的 .375rem）。 */
.btn-group > .btn:first-child:not(:last-child) {
    border-top-right-radius: 0; border-bottom-right-radius: 0;
}
.btn-group > .btn:last-child:not(:first-child) {
    border-top-left-radius: 0; border-bottom-left-radius: 0;
}
.btn-group > .btn:not(:first-child):not(:last-child) { border-radius: 0; }

/*〔存查 s0745〕*/
.dropdown-item.disabled,
.dropdown-item:disabled {
    pointer-events: none;
    opacity: .5;
    background: transparent;
}

/* ── ⑤ Breadcrumb 連結的 hover/focus：shadcn BreadcrumbLink 是
      `transition-colors hover:text-foreground`，原本只宣告了靜態 color。 */
.breadcrumb-item > a:hover,
.breadcrumb-item > a:focus-visible { color: hsl(var(--foreground)); }
.breadcrumb-item > a { transition: color .15s ease; }


/*〔存查 s0746〕*/

/* ═══════════════════════════════════════════════════════════════
   §S-44
   ═══════════════════════════════════════════════════════════════ */

/*〔存查 s0747〕*/
.datepicker .cw {
    font-size: 12px;
    width: auto;
}


/*〔存查 s0752〕*/

/*〔存查 s0753〕*/

/*〔存查 s0754〕*/

/*〔存查 s0755〕*/
:root                     { --muted-foreground-on-border: 240 3.8% 39%; }
html.dark                 { --muted-foreground-on-border: 240 5% 64.9%; }
[data-bs-theme="dark"]    { --muted-foreground-on-border: 240 5% 64.9%; }
[data-bs-theme="light"]   { --muted-foreground-on-border: 240 3.8% 39%; }

/*〔存查 s0756〕*/
.flow-stepper .flow-step.is-future,
.flow-stepper .flow-step.is-past,
.flow-stepper .flow-branch-half.is-future {
    background-color: hsl(var(--border)) !important;
}

/*〔存查 s0757〕*/
.flow-stepper .flow-step.is-future,
.flow-stepper .flow-branch-half.is-future {
    color: hsl(var(--muted-foreground-on-border)) !important;
}


/*〔存查 s0760〕*/
.fb-tabs {
    background: hsl(var(--border));
}

/*〔存查 s0761〕*/

/*〔存查 s0762〕*/
.fb-tabs {
    border: 1px solid hsl(var(--muted-foreground) / .28);
}
.fb-tab.active {
    border-color: hsl(var(--muted-foreground) / .22);
}

/*〔存查 s0763〕*/
.fb-tabs {
    --fb-tab-arrow: 10px;
    --fb-tab-gap: 2px;
    --fb-tab-seam: 2px;
}
.fb-tabs > .fb-tab {
    /* 負 margin 讓後一塊的凹槽咬住前一塊的尖角，中間留 --fb-tab-gap 的縫 */
    margin-left: calc((var(--fb-tab-arrow) - var(--fb-tab-gap)) * -1);
    /* 補回被凹槽吃掉的左側淨空：文字在垂直中線，凹槽最深處也在中線，但斜邊在文字高度
       範圍內只吃掉約一半深度 → 補 arrow 的一半（5px）就夠。補滿 10px 文字會明顯偏右
       （§S-42 的 .flow-step 同樣只補 4px 不補滿）。 */
    padding-left: calc(.75rem + var(--fb-tab-arrow) * .5);
    border-radius: 0;
    clip-path: polygon(
        0 0,
        calc(100% - var(--fb-tab-arrow)) 0,
        100% 50%,
        calc(100% - var(--fb-tab-arrow)) 100%,
        0 100%,
        var(--fb-tab-arrow) 50%
    );
}
/*〔存查 s0764〕*/
.fb-tabs > .fb-tab:not(:first-child:last-child) {
    border-color: transparent;
}
/*〔存查 s0765〕*/
.fb-tabs > .fb-tab::before {
    content: '';
    position: absolute;
    inset: -1px;
    background: hsl(var(--background));
    clip-path: polygon(
        0 0,
        var(--fb-tab-seam) 0,
        calc(var(--fb-tab-seam) + var(--fb-tab-arrow)) 50%,
        var(--fb-tab-seam) 100%,
        0 100%,
        var(--fb-tab-arrow) 50%
    );
}
/* 首塊：左邊是整組的外緣，不該有凹槽（會看起來像被前一塊咬掉一角），也不該有縫 */
.fb-tabs > .fb-tab:first-child {
    margin-left: 0;
    padding-left: .75rem;
    border-top-left-radius: var(--radius-md);
    border-bottom-left-radius: var(--radius-md);
    clip-path: polygon(
        0 0,
        calc(100% - var(--fb-tab-arrow)) 0,
        100% 50%,
        calc(100% - var(--fb-tab-arrow)) 100%,
        0 100%
    );
}
.fb-tabs > .fb-tab:first-child::before { content: none; }
/* 尾塊：右邊收平並補圓角，整組頁籤才填滿軌道（見上面「尾塊收平右邊」） */
.fb-tabs > .fb-tab:last-child {
    border-top-right-radius: var(--radius-md);
    border-bottom-right-radius: var(--radius-md);
    clip-path: polygon(
        0 0,
        100% 0,
        100% 100%,
        0 100%,
        var(--fb-tab-arrow) 50%
    );
}
/* 只有一顆：first 與 last 同時成立 → 完整還原成 §13 的圓角 chip */
.fb-tabs > .fb-tab:first-child:last-child {
    padding-left: .75rem;
    border-radius: var(--radius-md);
    clip-path: none;
}
/* 鍵盤焦點：取消裁切讓 §focus 的間隙環（box-shadow）畫得出來，並抬高蓋過鄰居 */
.fb-tabs > .fb-tab:focus-visible {
    clip-path: none;
    border-radius: var(--radius-md);
    z-index: 1;
}
.fb-tabs > .fb-tab:focus-visible::before { content: none; }

/*〔存查 s0766〕*/
.flow-stepper .flow-step.is-current {
    /* 邊寬。改這一顆就好，多邊形頂點都是它乘出來的。 */
    --fs-ring: 1px;
    /* 讓下面那顆 z-index:-1 的 ::before 停在「本體背景之上、文字之下」 */
    isolation: isolate;
    /* 本體＝那圈邊（面由 ::before 畫）。與 §S-42 同特異度 (0,3,0) + !important，
       靠排在後面取勝，§S-42 原文一行未動。 */
    background-color: hsl(var(--border)) !important;
    /* §S-42 的 drop-shadow 是死碼（第二段有逐像素證據），關掉；原文保留在 §S-42。 */
    filter: none !important;
}
/* 面：一般步驟塊（中段／末段）—— 左凹槽 + 右尖角，顯式內縮頂點 */
.flow-stepper .flow-step.is-current::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background: hsl(var(--card));
    clip-path: polygon(
        calc(var(--fs-ring) * 1.9) var(--fs-ring),
        calc(100% - var(--flow-arrow) - var(--fs-ring) * .53) var(--fs-ring),
        calc(100% - var(--fs-ring) * 1.21) 50%,
        calc(100% - var(--flow-arrow) - var(--fs-ring) * .53) calc(100% - var(--fs-ring)),
        calc(var(--fs-ring) * 1.9) calc(100% - var(--fs-ring)),
        calc(var(--flow-arrow) + var(--fs-ring) * 1.21) 50%
    );
}
/* 面：首塊 —— 沒有左凹槽、左側兩角有圓角，改用小盒子法讓圓角能一起縮
   （選擇器 (0,4,1) 勝過上面那條 (0,3,1)；分叉半片不在 .flow-stepper-track 底下，咬不到） */
.flow-stepper-track > .flow-step.is-current:first-child::before {
    inset: var(--fs-ring);
    /*〔存查 s0767〕*/
    border-top-left-radius: calc(var(--radius) - var(--fs-ring));
    /*〔存查 s0768〕*/
    border-bottom-left-radius: calc(var(--radius) - var(--fs-ring));
    clip-path: polygon(
        0 0,
        calc(100% - var(--flow-arrow)) 0,
        100% 50%,
        calc(100% - var(--flow-arrow)) 100%,
        0 100%
    );
}
/* 面：分叉上半（銳角在左上與右下，要用大係數 1.97 才推得進去） */
.flow-stepper .flow-branch-half.flow-branch-top.is-current::before {
    clip-path: polygon(
        calc(var(--fs-ring) * 1.97) var(--fs-ring),
        calc(100% - var(--flow-arrow) - var(--fs-ring) * .51) var(--fs-ring),
        calc(100% - var(--fs-ring) * 1.97) calc(100% - var(--fs-ring)),
        calc(var(--flow-arrow) + var(--fs-ring) * .51) calc(100% - var(--fs-ring))
    );
}
/* 面：分叉下半（上下鏡射，銳角換到右上與左下） */
.flow-stepper .flow-branch-half.flow-branch-bottom.is-current::before {
    clip-path: polygon(
        calc(var(--flow-arrow) + var(--fs-ring) * .51) var(--fs-ring),
        calc(100% - var(--fs-ring) * 1.97) var(--fs-ring),
        calc(100% - var(--flow-arrow) - var(--fs-ring) * .51) calc(100% - var(--fs-ring)),
        calc(var(--fs-ring) * 1.97) calc(100% - var(--fs-ring))
    );
}
/*〔存查 s0769〕*/
.flow-stepper a.flow-step.is-current:focus-visible::before {
    inset: 0;
    clip-path: none;
    border-radius: inherit;
}

/*〔存查 s0770〕*/

/* ── (1) 一般頁籤：把 §S-50 的 chevron 幾何整組退回 §13 ── */
.fb-tabs:not(.fb-tabs--flow) > .fb-tab {
    margin-left: 0;
    padding-left: .75rem;
    border-radius: var(--radius-md);
    clip-path: none;
}
/* chevron 專用的 V 形接縫：矩形片不需要，關掉（§S-50 原規則在變體下仍然生效） */
.fb-tabs:not(.fb-tabs--flow) > .fb-tab::before {
    content: none;
}
/* §S-49 給選中片的髮絲邊，在一般頁籤要留著 —— 把被 §S-50 關掉的那圈邊寫回來。
   (0,4,0) 與 §S-50 的 `:not(:first-child:last-child)` 同分，靠排在後面取勝。 */
.fb-tabs:not(.fb-tabs--flow) > .fb-tab.active {
    border-color: hsl(var(--muted-foreground) / .22);
}
/* 首塊／尾塊：§S-50 只補了單邊兩個圓角並各自留了凹槽或平邊，這裡一起回到四角 8px 方片 */
.fb-tabs:not(.fb-tabs--flow) > .fb-tab:first-child,
.fb-tabs:not(.fb-tabs--flow) > .fb-tab:last-child {
    padding-left: .75rem;
    border-radius: var(--radius-md);
    clip-path: none;
}

/* ── (2) 微調 A：軌道溝槽 3px → 4px，白色 chip 相對外框再內縮 1px（兩個變體共用）── */
.fb-tabs {
    padding: 4px;
}

/* ── (3) 微調 B：步驟條起點的圓角 10px → 6px（白色面同步 9px → 5px）── */
.flow-stepper-track > .flow-step:first-child {
    border-top-left-radius: var(--radius-sm);
    border-bottom-left-radius: var(--radius-sm);
}
.flow-stepper-track > .flow-step.is-current:first-child::before {
    border-top-left-radius: calc(var(--radius-sm) - var(--fs-ring));
    border-bottom-left-radius: calc(var(--radius-sm) - var(--fs-ring));
}

/*〔存查 s0771〕*/

/* ── (1) 篩選列容器：由 <x-page-tabs> 在「自己就是那一列」時生出來 ──
   （長在 .card-header 裡的那些是用呼叫端現成的 d-flex 列，不會走到這裡） */
.fb-filter-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
}

/*〔存查 s0772〕*/
.fb-filter-tabs { order: -1; }
.fb-filter-freshness {
    order: 98;
    margin-left: auto;
    flex-shrink: 0;
}

/* ── (3) 更新時間已被篩選列接手時，收掉頁首那一份 ──
   兩條分別對應：篩選列是頁首後面某個兄弟的**子孫**（卡片裡的 .card-header），
   以及篩選列**就是**頁首後面的兄弟本身。 */
.page-header:has(~ * [data-fb-freshness-relocated]) > [data-fb-freshness-origin],
.page-header:has(~ [data-fb-freshness-relocated]) > [data-fb-freshness-origin] {
    display: none;
}

/*〔存查 s0773〕*/
.page-header:has(> .fb-ph-inline > .fb-tabs):has(> .fb-ph-actions)::after {
    content: '';
    flex-basis: 100%;
    height: 0;
    order: 50;
}
.page-header:has(> .fb-ph-actions) > .fb-ph-inline > .fb-tabs {
    order: 60;
}


/*〔存查 s0774〕*/

/* ── ① 來源：resources/views/Pick/desktop/edit.blade.php ── */
/*〔存查 s0775〕*/
        .app-content table.fb-form-table > tbody > tr:has(input[type="checkbox"]:checked) > *,
        .app-content table.fb-form-table > tbody > tr:has(input[type="checkbox"]:checked):hover > * {
            background-color: transparent;
        }

/* ── ② 來源：resources/views/StoreSetting/_picker_card.blade.php ── */
/*〔存查 s0776〕*/
/*〔存查 s0777〕*/
        /* 文字 LOGO：品牌色底 ＋ 恆亮前景。圓角走 shadcn 的 --radius（lg 階）。
           允許換行（Yahoo購物中心 7 個字在 1200px 斷點的窄卡放不下一行），
             不用 nowrap＋ellipsis —— 品牌名被截成「Yahoo購物…」比換行難讀。 */
        .sc-brand-mark {
            display: inline-flex;
            align-items: center;
            min-width: 0;
            padding: .375rem .75rem;
            border-radius: var(--radius);
            color: hsl(var(--dark-panel-foreground));
            font-size: 1.25rem;                          /* 20px；配 700 粗體＝WCAG large text */
            font-weight: 700;
            line-height: 1.25;
            margin: 0;
            overflow-wrap: anywhere;
            /*〔存查 s0778〕*/
            box-shadow: inset 0 0 0 1px hsl(var(--foreground) / .18);
        }
        /*〔存查 s0779〕*/
        .sc-brand-mark--neutral {
            background-color: hsl(var(--dark));
            color: hsl(var(--dark-foreground));
        }
        /* 說明段：shadcn CardDescription ＝ text-sm ＋ muted-foreground。
           不設 height/overflow —— 原本 `.gallery .desc` 寫死 51px 會把長說明剪掉。 */
        .sc-picker-desc { line-height: 1.6; }
        /* 卡片 hover：整張卡是「可挑選的項目」，給一點浮起的回饋（shadcn 的 hover:shadow-md）。
           顏色不動，只動陰影與邊框色，暗色模式自動成立（--ring 有翻轉）。 */
        .sc-picker-card { transition: box-shadow .15s ease, border-color .15s ease; }
        .sc-picker-card:hover {
            border-color: hsl(var(--ring) / .25);
            box-shadow: 0 4px 12px -2px rgb(0 0 0 / .10), 0 2px 4px -2px rgb(0 0 0 / .06);
        }


/*〔存查 s0780〕*/


/*〔存查 s0781〕*/
:root                     { --accent-on-muted: 240 4.8% 95.9%; }
html.dark                 { --accent-on-muted: 240 5.3% 26.1%; }
[data-bs-theme="dark"]    { --accent-on-muted: 240 5.3% 26.1%; }
[data-bs-theme="light"]   { --accent-on-muted: 240 4.8% 95.9%; }

/* 流程步驟條（§S-42 / §S-46 的 .flow-step）：靜止底是 --border，hover 改吃新 token */
.flow-stepper a.flow-step:hover:not(.is-current) {
    background-color: hsl(var(--accent-on-muted)) !important;
}
/*〔存查 s0782〕*/
.pm-stepper--chevron a.pm-step:hover:not(.is-current),
.scr-stepper a.scr-step:hover:not(.is-current) {
    background-color: hsl(var(--accent-on-muted)) !important;
}


/*〔存查 s0784〕*/
.app-content table.fb-form-table > tbody > tr > td {
    white-space: normal;
}
.app-content table.fb-form-table > tbody > tr:has(.form-check + .form-check) > td:first-child,
.app-content table.fb-form-table > tbody > tr:has(.form-check-inline + .form-check-inline) > td:first-child {
    vertical-align: top;
    padding-top: .75rem;
}


/*〔存查 s0785〕*/
.form-switch .form-check-input:checked {
    background-color: hsl(var(--success-fg));
    border-color: hsl(var(--success-fg));
}

/*〔存查 s0786〕*/
.fb-action-row > div:empty {
    display: none;
}

/*〔存查 s0787〕*/


/*〔存查 s0788〕*/
.fb-tabs.fb-tabs--touch {
    display: flex;                       /* §13 是 inline-flex，這裡要撐滿側欄 */
    width: 100%;                         /* §13 是 fit-content */
    height: auto;                        /* §13 寫死 2.25rem，會壓住 min-height:44px */
}
.fb-tabs.fb-tabs--touch > .fb-tab {
    flex: 1 1 auto;                      /* ＝ Bootstrap .nav-fill 的分配方式（不是 flex:1） */
    height: auto;                        /* §13 是 calc(100% - 1px) */
    min-height: 44px;                    /* 觸控需求，沿用 §S-32 原值 */
    padding: 12px 15px;                  /* 沿用 §S-32 原值 */
}
/* 只有兩顆頁籤，因此兩顆都同時是 first 與 last，會被 §S-52 那條 (0,4,0) 的
   `padding-left: .75rem` 壓成左 12／右 15 的不對稱。同分靠排在後面補回來。 */
.fb-tabs.fb-tabs--touch > .fb-tab:first-child,
.fb-tabs.fb-tabs--touch > .fb-tab:last-child {
    padding-left: 15px;
}
/* 本節唯一一條非尺寸宣告：維持 §S-32 的選中字重（理由見上） */
.fb-tabs.fb-tabs--touch > .fb-tab.active {
    font-weight: 600;
}


/*〔存查 s0789〕*/
:root                     { --accent-on-muted-fill: 240 5.9% 90%; }
html.dark                 { --accent-on-muted-fill: 240 5.3% 26.1%; }
[data-bs-theme="dark"]    { --accent-on-muted-fill: 240 5.3% 26.1%; }
[data-bs-theme="light"]   { --accent-on-muted-fill: 240 5.9% 90%; }


/*〔存查 s0790〕*/


/*〔存查 s0791〕*/
:root                     { --switch-on: 142.1 76.2% 36.3%; }   /* #16A34A green-600 */
html.dark                 { --switch-on: 141.9 69.2% 58%; }     /* #4ADE80 green-400 */
[data-bs-theme="dark"]    { --switch-on: 141.9 69.2% 58%; }
[data-bs-theme="light"]   { --switch-on: 142.1 76.2% 36.3%; }

.form-switch .form-check-input:checked {
    background-color: hsl(var(--switch-on));
    border-color: hsl(var(--switch-on));
}


/*〔存查 s0792〕*/
.app-content .card > .card-body:has(> table.fb-form-table),
.app-content .card > .card-body:has(> .table-responsive > table.fb-form-table) {
    padding: 1rem !important;
}


/*〔存查 s0793〕*/
.app-content td .fb-row-action[title="編輯"] {
    background: hsl(var(--dark));
    /* !important 的理由見上：§5 的連結色規則帶 ID，(1,5,1) 沒有純特異度解 */
    color: hsl(var(--dark-foreground)) !important;
}
.app-content td .fb-row-action[title="編輯"]:hover,
.app-content td .fb-row-action[title="編輯"]:focus-visible {
    background: hsl(var(--dark) / .88);
    color: hsl(var(--dark-foreground)) !important;
}
.app-content td .fb-row-action[title="編輯"]:active {
    background: hsl(var(--dark) / .8);
    color: hsl(var(--dark-foreground)) !important;
}


/*〔存查 s0794〕*/

/* ── ① 內嵌用：把浮層攤平 ── */
#inline-datepicker .daterangepicker {
    position: static !important;
    display: block !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    width: 100%;
    max-width: none;
    margin: 0 !important;
    padding: 0;
    /* 框與陰影交給外層 .dropdown-menu（shadcn Popover），這裡不再疊一層 */
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    font-size: 13px;
    z-index: auto;
}
/* 浮層的小尖角在內嵌時沒有意義 */
#inline-datepicker .daterangepicker:before,
#inline-datepicker .daterangepicker:after {
    display: none !important;
}
#inline-datepicker .daterangepicker .drp-calendar {
    float: none;
    width: 100%;
    max-width: none;
    padding: 0;
}
#inline-datepicker .daterangepicker .calendar-table {
    padding: 0;
    background: transparent !important;
}
#inline-datepicker .daterangepicker .calendar-table table {
    width: 100%;
}
/*〔存查 s0795〕*/
#inline-datepicker .daterangepicker .calendar-table th.week,
#inline-datepicker .daterangepicker .calendar-table td.week {
    color: hsl(var(--muted-foreground)) !important;
    font-size: 10px;
    font-weight: 400;
    min-width: 20px;
    width: 20px;
    padding: 0;
}
/*〔存查 s0796〕*/
#inline-datepicker.drp-week .daterangepicker .calendar-table thead tr:first-child th:first-child {
    min-width: 20px;
    width: 20px;
    padding: 0;
}
/* showDropdowns 的年月下拉：塞進 dropdown 寬度內不要撐破 */
#inline-datepicker .daterangepicker .monthselect,
#inline-datepicker .daterangepicker .yearselect {
    width: auto;
    max-width: 46%;
}

/* ── ② 殘留的 bootstrap-datepicker（月／年）接上 shadcn token ── */
.datepicker-inline,
.datepicker.datepicker-inline {
    width: 100%;
    padding: 0;
    background: transparent;
    color: hsl(var(--foreground));
    border-radius: var(--radius-md);
    font-size: 13px;
}
.datepicker table {
    width: 100%;
}
/*〔存查 s0797〕*/
.datepicker table tr td,
.datepicker table tr th {
    color: hsl(var(--foreground));
    font-weight: 500;
    border-radius: 4px;
}
.datepicker table tr td span {
    border-radius: 4px;
}
/* hover / focus：shadcn 的清單項一律 accent 底 */
.datepicker table tr th.datepicker-switch:hover,
.datepicker table tr th.prev:hover,
.datepicker table tr th.next:hover,
.datepicker table tr td.day:hover,
.datepicker table tr td.day.focused,
.datepicker table tr td span:hover,
.datepicker table tr td span.focused {
    background: hsl(var(--accent)) !important;
    background-image: none !important;
    color: hsl(var(--accent-foreground)) !important;
}
/* 非本月／非本年的格子 */
.datepicker table tr td.old,
.datepicker table tr td.new,
.datepicker table tr td span.old,
.datepicker table tr td span.new {
    color: hsl(var(--muted-foreground) / .5) !important;
}
/* ISO 週次欄 */
.datepicker table tr td.cw,
.datepicker table tr th.cw {
    color: hsl(var(--muted-foreground)) !important;
    font-weight: 400;
}
/* 今天：與 daterangepicker 的 td.today 同一種表示法（底線 + 粗體），
   不是套件預設那塊黃色漸層 —— 黃色在暗色下會變成一塊亮斑 */
.datepicker table tr td.today,
.datepicker table tr td.today:hover,
.datepicker table tr td.today.disabled,
.datepicker table tr td.today.disabled:hover {
    background: transparent !important;
    background-image: none !important;
    color: hsl(var(--foreground)) !important;
    text-shadow: none !important;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.datepicker table tr td.today:hover {
    background: hsl(var(--accent)) !important;
    color: hsl(var(--accent-foreground)) !important;
}
/* 選中：與 daterangepicker 的 td.active 一致 = --dark 實心 */
.datepicker table tr td.active,
.datepicker table tr td.active:hover,
.datepicker table tr td.active.active,
.datepicker table tr td.active:hover.active,
.datepicker table tr td.active.disabled,
.datepicker table tr td.active.disabled:hover,
.datepicker table tr td.today.active,
.datepicker table tr td.today.active:hover,
.datepicker table tr td span.active,
.datepicker table tr td span.active:hover,
.datepicker table tr td span.active.active,
.datepicker table tr td span.active.disabled,
.datepicker table tr td span.active.disabled:hover {
    background: hsl(var(--dark)) !important;
    background-color: hsl(var(--dark)) !important;
    background-image: none !important;
    color: hsl(var(--dark-foreground)) !important;
    text-shadow: none !important;
    border-color: transparent !important;
}
/* 不可點（週模式鎖星期一時，星期一以外的格子）*/
.datepicker table tr td.disabled,
.datepicker table tr td.disabled:hover,
.datepicker table tr td span.disabled,
.datepicker table tr td span.disabled:hover {
    background: transparent !important;
    background-image: none !important;
    color: hsl(var(--muted-foreground) / .4) !important;
}
/* 標題列（‹ 2026年八月 ›）：跟 daterangepicker 的 .month 同字重 */
.datepicker table tr th.datepicker-switch,
.datepicker table tr th.prev,
.datepicker table tr th.next {
    color: hsl(var(--foreground));
    font-weight: 500;
    border-radius: 4px;   /* 與格子同一個值，理由見上 */
}
.datepicker table tr th.dow {
    color: hsl(var(--muted-foreground));
    font-weight: 500;
}

/*〔存查 s0798〕*/
.app-content td .fb-row-action[title="編輯"] {
    background: transparent !important;
    color: hsl(var(--foreground)) !important;
}

/*〔存查 s0799〕*/
.app-content td .fb-row-action[title="編輯"] {
    width: auto;
    min-width: 0;
    height: 32px;
    padding: 0 12px;
    gap: 6px;
    /*〔存查 s0800〕*/
    /* background/border 需要 !important：§S-60（列內編輯鈕退回 ghost）的
         `background: transparent !important` 排在本節之前但帶 !important，不加就贏不過它。
         §S-60 的原文一行未刪，靠本節同帶 !important 且排在後面取勝。 */
    border: 1px solid hsl(var(--dark)) !important;
    border-radius: var(--radius-md);
    background: hsl(var(--dark)) !important;
    color: hsl(var(--dark-foreground)) !important;
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
}
.app-content td .fb-row-action[title="編輯"]:hover {
    /* shadcn default 變體的 hover 是 bg-primary/90 */
    background: hsl(var(--dark) / .9) !important;
    border-color: hsl(var(--dark) / .9) !important;
    color: hsl(var(--dark-foreground)) !important;
}

/*〔存查 s0801〕*/
.app-content .row > .card {
    background-clip: content-box;
}

/*〔存查 s0802〕*/
.app-content .form-label {
    font-size: 14px;
    font-weight: 500;
}
/*〔存查 s0803〕*/
.app-content table.fb-form-table .form-label {
    font-size: 14px;
}

/*〔存查 s0804〕*/
.app-content .table > thead > tr > th {
    font-size: 14px;
}
.app-content .table > tbody > tr > td {
    font-size: 14px;
}
.app-content .card > .card-header {
    /*〔存查 s0805〕*/
    font-weight: 600 !important;
}

/*〔存查 s0806〕*/

/*〔存查 s0807〕*/
.app-content table.table.dataTable > tbody > tr > .dtfc-fixed-start,
.app-content table.table.dataTable > tbody > tr > .dtfc-fixed-end {
    background-color: hsl(var(--card));
}
.app-content table.table.dataTable > thead > tr > .dtfc-fixed-start,
.app-content table.table.dataTable > thead > tr > .dtfc-fixed-end,
.app-content table.table.dataTable > tfoot > tr > .dtfc-fixed-start,
.app-content table.table.dataTable > tfoot > tr > .dtfc-fixed-end {
    background-color: hsl(var(--card)) !important;
}
/* FixedColumns 在捲動時會塞兩塊 blocker 蓋住捲軸角落，DataTables 寫死 white /
   rgb(33,37,41)。目前兩頁都是 display:none，但只要有人開 scrollY 就會現形，
   一併接到 token 上（--card 亮暗會翻轉）。 */
div.dt-scroll div.dtfc-top-blocker,
div.dt-scroll div.dtfc-bottom-blocker,
div.dtfh-floatingparent div.dtfc-top-blocker,
div.dtfh-floatingparent div.dtfc-bottom-blocker {
    background-color: hsl(var(--card));
}
/*〔存查 s0808〕*/
.app-content table.table.dataTable > thead > tr > .dtfc-fixed-start:not(:has(+ .dtfc-fixed-start)),
.app-content table.table.dataTable > tbody > tr > .dtfc-fixed-start:not(:has(+ .dtfc-fixed-start)),
.app-content table.table.dataTable > tfoot > tr > .dtfc-fixed-start:not(:has(+ .dtfc-fixed-start)) {
    border-right: 1px solid hsl(var(--border));
}

/*〔存查 s0809〕*/
.app-content table.table-stick > thead > tr > th.stick {
    background: hsl(var(--card)) !important;
}

/*〔存查 s0810〕*/
.app-content table[data-sticky-head] > thead > tr > th,
.app-content table.table-sticky-head > thead > tr > th,
.app-content table > thead.sticky-top > tr > th,
.app-content .table thead.bg-light.sticky-top > tr > th {
    position: sticky;
    top: 0;
    z-index: 3;
    background: hsl(var(--card)) !important;
    box-shadow: inset 0 -1px 0 hsl(var(--border));
}

/* ── S-65.4 左上角那一格同時吸頂又凍結 → 必須是整張表最高層
   不拉高的話它跟吸頂表頭同為 3，靠後面的規則決勝負＝不可控；
   橫捲時會看到第二欄的表頭從它上面壓過去。 */
.app-content table[data-sticky-head] > thead > tr > th.stick,
.app-content table.table-sticky-head > thead > tr > th.stick,
.app-content table[data-sticky-head] > thead > tr > .dtfc-fixed-start,
.app-content table[data-sticky-head] > thead > tr > .dtfc-fixed-end,
.app-content table.table-sticky-head > thead > tr > .dtfc-fixed-start,
.app-content table.table-sticky-head > thead > tr > .dtfc-fixed-end {
    z-index: 4;
}

/*〔存查 s0811〕*/
.app-content table.table.dataTable > tbody > tr:hover > .dtfc-fixed-start,
.app-content table.table.dataTable > tbody > tr:hover > .dtfc-fixed-end {
    background-color: hsl(var(--accent));
    color: hsl(var(--accent-foreground));
}

/*〔存查 s0812〕*/
.app-content table.table-stick > tbody > tr > td.stick.stick-end,
.app-content table.table-stick > tfoot > tr > td.stick.stick-end,
.app-content table.table-stick > tfoot > tr > th.stick.stick-end {
    border-right: 1px solid hsl(var(--border));
}

/*〔存查 s0813〕*/
[data-fb-batch-bar][data-fb-batch-empty] .btn:not([data-fb-batch-keep-enabled]),
[data-fb-batch-bar][data-fb-batch-empty] button:not([data-fb-batch-keep-enabled]) {
    /* 值取 Bootstrap `.btn:disabled` 的 .65，讓過渡態與 JS 接手後長得一模一樣 */
    opacity: .65;
    /* 這條只負責「DOMContentLoaded 之前」與「JS 掛掉」這兩個空窗：
         真正的停用是 JS 寫進 disabled / .disabled 的那一份（SSOT 在元件裡）。
         沒有這條的話，空窗期那幾毫秒是可點的 —— 那就是行為變更。 */
    pointer-events: none;
}
/* 未選取時整條列退到次要層級：它常駐在畫面上，不該和「有選取」時一樣搶眼。
   只調透明度不調高度 —— 高度一變就等於又回到「列會跳動」的老問題。 */
[data-fb-batch-bar][data-fb-batch-empty] {
    background: transparent;
}

/*〔存查 s0814〕*/
.page-header.d-flex:has(> .fb-ph-actions)::before,
.page-header.d-flex:has(> .fb-ph-freshness)::before,
.page-header.d-flex:has(> .fb-page-help)::before,
.page-header.d-flex:has(> .fb-ph-inline > .fb-page-help)::before,
.page-header.d-flex:has(> .ms-auto)::before {
    content: '';
    order: 90;
    flex: 1 1 auto;
    min-width: 0;
    height: 0;
}

/*〔存查 s0815〕*/
/*〔存查 s0816〕*/
.page-header.d-flex > .fb-ph-actions {
    order: 99;
    /*〔存查 s0817〕*/
    margin-left: auto !important;
}
.page-header.d-flex > .fb-page-help,
.page-header.d-flex > .fb-ph-inline > .fb-page-help {
    order: 100;
    margin-left: 0 !important;
}
/* 還沒元件化、自己手刻 .ms-auto 動作組的頁首（例：Seller/includes/_plan_tabs 的
   無標題分支）跟著一起靠右，全站同一種節奏。
   §S-31 把它的 margin-left 壓成 0，這裡只補 order —— 兩條合起來就是「靠右但不搶 auto」。 */
.page-header.d-flex > .ms-auto {
    order: 99;
}

/*〔存查 s0818〕*/

/* ①②③ 軌道 */
.fb-tabs:not(.fb-tabs--flow) {
    padding: 3px;
    background: hsl(var(--muted));
    border: 0;
}

/*〔存查 s0819〕*/
.fb-tabs:not(.fb-tabs--flow):not(.fb-tabs--touch) > .fb-tab {
    padding-left: .5rem;
    padding-right: .5rem;
}
.fb-tabs:not(.fb-tabs--flow):not(.fb-tabs--touch) > .fb-tab:first-child,
.fb-tabs:not(.fb-tabs--flow):not(.fb-tabs--touch) > .fb-tab:last-child {
    padding-left: .5rem;
}

/*〔存查 s0820〕*/
.fb-tabs:not(.fb-tabs--flow) > .fb-tab.active {
    border-color: transparent;
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);
}

/*〔存查 s0821〕*/
html.dark .fb-tabs:not(.fb-tabs--flow) > .fb-tab {
    color: hsl(var(--muted-foreground));
}


/*〔存查 s0822〕*/


/* ① --background 回歸官方純白。
   這是一個 `:root` 區塊，與 §1 的 `:root` 同特異度 (0,1,0)、排在後面 → 亮色由本節勝出。
     `html.dark` 是 (0,1,1)，特異度更高 → **暗色完全不受影響**（暗色仍是 §1b 的 240 10% 3.9%）。 */
:root {
    --background: 0 0% 98%;
}


/*〔存查 s0823〕*/
html.dark .fb-tabs:not(.fb-tabs--flow) > .fb-tab.active {
    background: hsl(0 0% 100% / .3);
    border-color: hsl(0 0% 100% / .15);
    color: hsl(var(--foreground));
}


/*〔存查 s0824〕*/
/*〔存查 s0825〕*/
.page-header.d-flex:has(> .fb-ph-actions .btn-primary) > .fb-ph-actions {
    /*〔存查 s0826〕*/
    order: 1;
    /* §S-66 的 `margin-left:auto !important` 在此失效（見上面第四段） */
    margin-left: 0 !important;
}

/*〔存查 s0827〕*/

/*〔存查 s0828〕*/

/*〔存查 s0829〕*/
#shipmentGroupBody .btn:has(> input[type="checkbox"]) {
    /* 官方 toggle outline：`border border-input bg-transparent` */
    background-color: transparent;
    border-color: hsl(var(--input));
    color: hsl(var(--foreground));
}
/*〔存查 s0830〕*/
#shipmentGroupBody .btn:has(> input[type="checkbox"]).active {
    /* 值逐字取自本檔 §btn-check 選中態，不是另外挑的 */
    background-color: hsl(var(--dark));
    border-color: hsl(var(--dark));
    color: hsl(var(--dark-foreground));
    box-shadow: none;
}

/*〔存查 s0831〕*/

/*〔存查 s0832〕*/

/*〔存查 s0833〕*/
.btn.btn-outline-danger {
    --bs-btn-bg: hsl(var(--background));
    --bs-btn-border-color: hsl(var(--destructive));
    --bs-btn-color: hsl(var(--destructive-fg));
    --bs-btn-hover-bg: hsl(var(--destructive));
    --bs-btn-hover-border-color: hsl(var(--destructive));
    --bs-btn-hover-color: hsl(var(--destructive-foreground));
    --bs-btn-active-bg: hsl(var(--destructive));
    --bs-btn-active-border-color: hsl(var(--destructive));
    --bs-btn-active-color: hsl(var(--destructive-foreground));
}


/*〔存查 s0834〕*/

/*〔存查 s0835〕*/

/*〔存查 s0836〕*/

/* 中性 outline 系列：清單與 §28 那條逐字相同，確保沒有一個變體被漏在失效狀態。 */
.btn-outline-secondary.active,
.btn-outline-success.active,
.btn-outline-info.active,
.btn-outline-warning.active,
.btn-outline-dark.active {
    --bs-btn-active-bg: hsl(var(--dark));
    --bs-btn-active-border-color: hsl(var(--dark));
    --bs-btn-active-color: hsl(var(--dark-foreground));
}
/* -primary 跟著 §btn-check 選中態 走品牌色，不併入上面那組。 */
.btn-outline-primary.active {
    --bs-btn-active-bg: hsl(var(--primary));
    --bs-btn-active-border-color: hsl(var(--primary));
    --bs-btn-active-color: hsl(var(--primary-foreground));
}


/*〔存查 s0837〕*/
.sc-app-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;                    /* 圖示是固定尺寸，不參與 flex 伸縮 */
  width: 3.5rem;                     /* 56px（推導見上） */
  height: 3.5rem;
  border-radius: var(--radius-xl);   /* 14px，與 Card 同階 */
  font-size: 1.5rem;                 /* 24px ＋ 700 ＝ WCAG large text，過 3:1 */
  font-weight: 700;
  line-height: 1;
  text-align: center;
  overflow: hidden;                  /* 首字若是寬字形也不會頂出圓角 */
  user-select: none;                 /* 它是圖示不是可選取的內文；平台名在旁邊那行 */
  box-shadow: 0 0 0 1px hsl(var(--border));
}
/*〔存查 s0838〕*/
html.dark .sc-app-icon { box-shadow: 0 0 0 1px hsl(0 0% 100% / .22); }

/* 品牌圖示：底色由呼叫端以 inline style 帶入（對方的品牌規範，兩模式都不翻轉），
   這裡只負責前景 —— --dark-panel-foreground 是主題給「恆深底面板」準備的恆亮前景
   （亮暗同為 0 0% 98%），與 .sc-brand-mark 當初用的是同一顆，語意一致。 */
.sc-app-icon--brand { color: hsl(var(--dark-panel-foreground)); }
/*〔存查 s0839〕*/

/*〔存查 s0840〕*/
.sc-app-meta { min-width: 0; flex: 1 1 auto; }

/*〔存查 s0841〕*/
.sc-app-title { font-size: 1rem; line-height: 1.35; }

/*〔存查 s0842〕*/
.sc-picker-cover {
  padding: 1rem;                                                  /* 縱 16px；橫 16px 對齊 .card-body p-3 */
  border-bottom: 1px solid hsl(var(--border));
  background-clip: padding-box;                                   /* 讓下緣那 1px 疊在卡片底色上，不是疊在品牌色上 */
  border-top-left-radius: var(--bs-card-inner-border-radius);     /* §5 已定義 ＝ calc(--radius-xl - 1px) ＝ 13px */
  border-top-right-radius: var(--bs-card-inner-border-radius);
}
@media (min-width: 768px) {
  /* ≥768 是本卡多欄版面的起點，也是 .card-body 由 p-3 換成 p-md-4 的斷點；
     橫向內距必須同步，封面上的平台名才會與下方所有內容共用同一條左緣。 */
  .sc-picker-cover { padding: 1rem 1.5rem; }
}
html.dark .sc-picker-cover { border-bottom-color: hsl(0 0% 100% / .22); }

/*〔存查 s0843〕*/
.sc-picker-cover--brand { color: hsl(var(--dark-panel-foreground)); }

/*〔存查 s0844〕*/

/*〔存查 s0845〕*/
.sc-picker-cover-name {
  margin: 0;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

/*〔存查 s0846〕*/

/*〔存查 s0847〕*/
.sc-picker-cover .sc-picker-cover-name { color: inherit; }

/*〔存查 s0848〕*/
.sc-picker-cover {
  display: flex;
  flex-direction: column;
  align-items: flex-start;   /* 方格不要被拉成整行寬 */
  gap: .75rem;               /* 12px：方格與平台名之間 */
}

/*〔存查 s0849〕*/
.sc-picker-cover--brand .sc-picker-cover-name { color: hsl(var(--dark-panel-foreground)); }

/* 88px 方格。三種內容（logo / lucide / 文字）共用同一組幾何。 */
.sc-picker-cover-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 5.5rem;                    /* 88px */
  height: 5.5rem;
  border-radius: var(--radius-xl);  /* 14px，與 Card 同階 */
  overflow: hidden;                 /* logo 的直角不要頂出圓角 */
  font-size: 2rem;                  /* 32px：文字版（MO店+／新竹物流）；配 700 ＝ WCAG large text */
  font-weight: 700;
  line-height: 1;
  user-select: none;
}
/* 白底只給「裡面放 logo / lucide」的九張 —— 文字版上了白底就是白字疊白底。 */
.sc-picker-cover--brand .sc-picker-cover-mark--filled { background-color: hsl(var(--dark-panel-foreground)); }
/*〔存查 s0850〕*/
.sc-brand-mark--neutral .sc-picker-cover-mark--filled {
  background-color: hsl(var(--dark-foreground));
  color: hsl(var(--dark));
}
/* logo 本體：64px，contain 不拉伸（來源尺寸 152²～1024² 不一）。 */
.sc-picker-cover-logo {
  width: 4rem;
  height: 4rem;
  object-fit: contain;
  display: block;
}
/* lucide 在本專案是 <i data-lucide> 被換成 <svg>，尺寸要明寫，否則吃到 1em。 */
.sc-picker-cover-mark svg { width: 2.5rem; height: 2.5rem; stroke-width: 1.75; }

/*〔存查 s0851〕*/

.sc-picker-appbar {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: 1rem 1rem 0;
}
@media (min-width: 768px) {
    /* 與 .card-body 的 p-md-4 對齊，讓圖示左緣與下方說明、CTA 同一條左緣 */
    .sc-picker-appbar { padding: 1.5rem 1.5rem 0; }
}

/*〔存查 s0852〕*/
.sc-app-tile {
    flex: 0 0 auto;
    width: 4rem;
    height: 4rem;
    border-radius: var(--radius-xl);
    display: grid;
    place-items: center;
    overflow: hidden;
    /* 深色品牌色（酷澎 #1C1A4E 1.12／SHOPLINE #000000 1.17）在暗色卡片上
       填色對比不足，形狀要靠這圈描邊定義。用 --foreground 的低 alpha
       才會亮暗自動翻轉；寫死顏色會在其中一態消失。 */
    box-shadow: inset 0 0 0 1px hsl(var(--foreground) / .12);
    color: hsl(var(--dark-panel-foreground));   /* 方磚內的前景恆亮（首字／lucide 都吃它） */
}
/* 自帶不透明底的三張（AMEGO／SHOPLINE／YAHOO）：logo 就是完整 App 圖示，鋪滿方磚 */
.sc-app-tile--bleed { background: hsl(var(--card)); }
.sc-app-tile--bleed .sc-app-tile-logo { width: 100%; height: 100%; object-fit: cover; }

/* 透明 logo（蝦皮／momo／酷澎／大榮）：品牌色底 ＋ 置中 logo。
   object-fit: contain —— 這幾張原始比例各不相同（152²/512²/550²），拉伸會讓商標變形。 */
.sc-app-tile-logo { width: 2.5rem; height: 2.5rem; object-fit: contain; display: block; }

/* lucide（自訂商店 store／雲端小幫手 cloud）：它們不是平台品牌，用圖示是正確語意 */
.sc-app-tile svg { width: 1.75rem; height: 1.75rem; stroke-width: 1.75; }

/* MO店+／新竹物流：抓不到方形 logo，維持首字。
   24px 不是 60px —— 沒有這條在管尺寸，首字會變成一個突兀的大字。 */
.sc-app-tile { font-size: 1.5rem; font-weight: 700; line-height: 1; }

/* ══ 名稱與分類 ═══════════════════════════════════════════════════════ */
.sc-app-meta {
    /* 不用 .min-w-0 utility：本專案只在 @media (max-width: 767.98px) 內定義它，
       桌機寬度它根本不存在，用了會靜默無效。 */
    min-width: 0;
}
.sc-app-name {
    margin: 0;
    font-size: 1rem;          /* 16px —— 不超過整頁 h1 的 16.8px，字級階梯不倒掛 */
    font-weight: 600;
    line-height: 1.35;
    color: hsl(var(--card-foreground));
}
.sc-app-cat {
    display: block;
    margin-top: .125rem;
    font-size: .8125rem;      /* 13px，App Store 副標的量級 */
    color: hsl(var(--muted-foreground));
}

/*〔存查 s0853〕*/
.sc-app-tile--plate { background: hsl(var(--card)); }

/*〔存查 s0854〕*/

.sc-picker-appbar { align-items: flex-start; }
.sc-app-meta { flex: 1 1 auto; }

/* 副標行：分類 · 狀態 —— 一行讀完「這是什麼、現在如何」 */
.sc-app-cat { display: flex; align-items: center; flex-wrap: wrap; gap: .25rem; }
.sc-app-sep { opacity: .45; }
.sc-app-status { display: inline-flex; align-items: center; gap: .25rem; }
.sc-app-status svg { width: .875rem; height: .875rem; }

/* 「取得」膠囊。用 --secondary 底而不是白底＋border：
   App Store 那顆是淡灰實心膠囊，白底 outline 在白卡片上幾乎沒有存在感（改前就是這樣）。 */
.sc-app-get {
    flex: 0 0 auto;
    border-radius: 9999px;
    padding: .3125rem 1rem;
    font-size: .8125rem;
    font-weight: 600;
    background: hsl(var(--secondary));
    color: hsl(var(--secondary-foreground));
    border: 1px solid transparent;
    white-space: nowrap;
}
.sc-app-get:hover,
.sc-picker-card:hover .sc-app-get {
    background: hsl(var(--primary));
    color: hsl(var(--primary-foreground));
}

/*〔存查 s0855〕*/
.sc-picker-card [data-slot="card-footer"]:empty { display: none; border-top: 0; margin: 0; padding: 0; }

/* 名稱：膠囊鈕佔走右側之後，長名（Yahoo購物中心／momo購物網）會折成兩行。
   縮一階字級並允許 meta 收縮，讓它在 1440 四欄下維持單行。 */
.sc-app-name { font-size: .9375rem; }
.sc-app-meta { min-width: 0; flex: 1 1 auto; }

/*〔存查 s0856〕*/

.sc-app-get {
    background: hsl(var(--primary));
    color: hsl(var(--primary-foreground));
    font-weight: 600;
    padding: .375rem 1.125rem;
    font-size: .875rem;
}
.sc-app-get:hover,
.sc-picker-card:hover .sc-app-get {
    /* hover 稍微壓深一階，維持黃色語意（不要換成別的色相，那會讓人以為狀態變了） */
    background: hsl(var(--primary));
    color: hsl(var(--primary-foreground));
    filter: brightness(.94);
}

/* 「使用中 N」從副標裡的小灰字改成獨立一列的淡綠藥丸 */
.sc-app-status {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    padding: .125rem .5rem;
    border-radius: 9999px;
    background: hsl(var(--success-bg));
    color: hsl(var(--success-fg));
    font-size: .75rem;
    font-weight: 600;
    line-height: 1.5;
}
/* 藥丸自己已經是綠的，前面那顆圖示不必再上色，改吃 currentColor 才不會兩種綠打架 */
.sc-app-status svg { color: currentColor; width: .8125rem; height: .8125rem; }
/* 分隔點在藥丸旁邊會變成多餘的視覺噪音 */
.sc-app-sep { display: none; }

/*〔存查 s0857〕*/

.sc-app-actions { display: flex; align-items: center; gap: .5rem; }
/* 底列有內容了，S-77d 那條 :empty 自然不再命中（規則保留，供沒有 CTA 的呼叫端用） */

/* 名稱可以放回 16px：擠壓源頭消失了 */
.sc-app-name { font-size: 1rem; }
.sc-app-cat  { display: block; }

/*〔存查 s0858〕*/

.sc-picker-card .card-body { padding-top: 1rem; }
@media (min-width: 768px) {
    /* appbar 已經給了上緣 24px，card-body 不要再給一次 */
    .sc-picker-card .card-body { padding-top: 1rem; }
}
/* 搬空的 card-header 不再佔位（markup 依禁刪規則保留） */
.sc-picker-card [data-slot="card-header"]:empty,
.sc-picker-card [data-slot="card-header"]:not(:has(*:not(:empty))) { display: none; }
/* 說明區：上緣交給 card-body 的 padding-top，自己不再加 margin */
.sc-picker-card [data-slot="card-content"] { margin-top: 0 !important; }
/* 動作列：分隔線上下各 12px，比原本的 16 緊一階 —— 它是列尾不是新段落 */
.sc-picker-card [data-slot="card-footer"] { margin-top: 1rem !important; padding-top: .75rem !important; }
/* 說明段本身的行高收一階，四行 clamp 下少掉一段虛胖 */
.sc-picker-desc { line-height: 1.55; }

/*〔存查 s0859〕*/

.sc-app-status,
.sc-app-get {
    height: 2rem;                 /* 32px，與 .btn-sm 同階 */
    padding: 0 .875rem;
    font-size: .8125rem;          /* 13px */
    font-weight: 600;
    line-height: 1;
    border-radius: 9999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .3125rem;
}
.sc-app-status svg { width: .875rem; height: .875rem; }

/*〔存查 s0860〕*/

/*〔存查 s0861〕*/

.sc-app-status--muted {
    background: hsl(var(--secondary));
    color: hsl(var(--muted-foreground));
}
.sc-app-status--success {
    background: hsl(var(--success-bg));
    color: hsl(var(--success-fg));
}

/*〔存查 s0862〕*/
.sc-app-actions .sc-app-get.order-first { order: -1; }

/*〔存查 s0863〕*/
#shipmentGroupModal .sg-print-alt {
    font-size: .6875rem;   /* 11px：與第一行 13px 拉開兩階，「小字放小」才看得出來 */
    line-height: 1.2;
    opacity: .65;          /* 作用在 currentColor 上，四種底色（亮/暗 × outline/active）自動跟著走 */
}

/*〔存查 s0864〕*/

/* 三階 gap：對得到 button.tsx 的 gap-2 / gap-1.5 / gap-1 */
.btn { gap: .5rem; }
.btn-sm { gap: .375rem; }
.btn-xs { gap: .25rem; }

/* 圖示的水平 margin 交回給 gap（只收 flex 化過的 sm / xs，且放過 *-auto） */
.app-content .btn-sm > i:not([class*="ms-auto"]):not([class*="me-auto"]),
.app-content .btn-sm > svg:not([class*="ms-auto"]):not([class*="me-auto"]),
.app-content .btn-xs > i:not([class*="ms-auto"]):not([class*="me-auto"]),
.app-content .btn-xs > svg:not([class*="ms-auto"]):not([class*="me-auto"]) {
    margin-inline: 0 !important;
}

/*〔存查 s0865〕*/

/*〔存查 s0866〕*/
.app-content table.fb-form-table > tbody > tr > td {
    font-weight: 400;
}
.app-content table.fb-form-table > tbody > tr > td:first-child {
    font-weight: 500;
}

/*〔存查 s0867〕*/

/*〔存查 s0868〕*/

/*〔存查 s0869〕*/

/*〔存查 s0870〕*/
.app-content table.fb-form-table > tbody > tr > td label.col-form-label {
    padding-top: 0;
    padding-bottom: 0;
    margin-bottom: 0;
    line-height: 32px;
}

/*〔存查 s0871〕*/
.btn-close {
    /* ① 顏色與不透明度：改 Bootstrap 自己的變數，:hover / :focus / .disabled 自動跟上 */
    --bs-btn-close-color: currentColor;   /* 原值 #000 */
    --bs-btn-close-opacity: .7;           /* 原值 0.5，對齊 shadcn DialogClose 的 opacity-70 */
    --bs-btn-close-hover-opacity: 1;      /* 原值 0.75，對齊 hover:opacity-100 */
    /* ② 叉叉不再由背景圖畫（背景留給 §S-39 的 :active 底），改由 ::before 畫 */
    background-image: none;
    /* ③ ::before 的定位基準。`.alert-dismissible .btn-close`(0,2,0) 會把它改成 absolute，
          那也是合法的定位基準，兩種情形 ::before 都對齊 padding box。 */
    position: relative;
}
.btn-close::before {
    content: "";
    position: absolute;
    inset: 0;                              /* ＝ .btn-close 的 padding box（1em 內容 + .25em 內距） */
    background-color: currentColor;        /* 叉叉的顏色 ＝ 容器前景色 */
    pointer-events: none;
    /* 形狀逐字元照抄 Bootstrap 5.3.3 的 --bs-btn-close-bg，只是改當 mask 用 */
    -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e");
            mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e");
    -webkit-mask-position: center;         mask-position: center;
    -webkit-mask-size: 1em auto;           mask-size: 1em auto;   /* ＝ 原本的 center/1em auto */
    -webkit-mask-repeat: no-repeat;        mask-repeat: no-repeat;
}
/* 反白濾鏡一律關掉（理由與特異度見上「filter: none 為什麼需要」） */
.btn-close,
.btn-close-white,
[data-bs-theme] .btn-close {
    filter: none;
}
/*〔存查 s0872〕*/

/*〔存查 s0873〕*/
.app-content .card-header,
.app-content .card-footer {
    /* 原值：Bootstrap `.card-header/.card-footer{padding:var(--bs-card-cap-padding-y)
       var(--bs-card-cap-padding-x)}` ＝ 0.5rem 1rem ＝ 8px 16px（記在此存查） */
    padding: 1rem;
}

/*〔存查 s0874〕*/

/*〔存查 s0875〕*/

/*〔存查 s0876〕*/
.app-content .card-body .btn.btn-inline-upload {
    --bs-btn-bg: transparent;
    --bs-btn-color: hsl(var(--muted-foreground));
    --bs-btn-border-color: hsl(var(--border));
    --bs-btn-hover-bg: hsl(var(--accent));
    --bs-btn-hover-color: hsl(var(--accent-foreground));
    --bs-btn-hover-border-color: hsl(var(--border));
    --bs-btn-active-bg: hsl(var(--accent));
    --bs-btn-active-color: hsl(var(--accent-foreground));
    --bs-btn-active-border-color: hsl(var(--border));
    border-style: dashed;
}

/*〔存查 s0877〕*/
.app-content .input-group.input-group-sm .input-group-prepend > .input-group-text {
    min-height: 32px;
    padding: .25rem .5rem;
    font-size: .875rem;
    border-radius: var(--bs-border-radius-sm);
}


/*〔存查 s0886〕*/

/*〔存查 s0887〕*/
.fs-13px,
.fs-15px {
    /* 原值：`.fs-13px{13px}`（L3054）、`.fs-15px{15px}`（L3056），兩者都仍在檔案裡，記此存查。
       改為 .875rem = 14px = Tailwind text-sm = shadcn CardDescription / AlertDescription 的字級。 */
    font-size: .875rem !important;
}

/*〔存查 s0888〕*/
/*〔存查 s0889〕*/
.page-header.d-flex:has(> .fb-ph-actions [data-ph-primary]) > .fb-ph-actions {
    /* 與 §S-69 同值：order 1 ＝ 標題（order 0）之後、填充位（order 90）之前 */
    order: 1;
    /* 壓住 §S-66 L13295 的 `margin-left:auto !important`（375 折行時它會真的生效） */
    margin-left: 0 !important;
}

/*〔存查 s0890〕*/

/* ── (1) §7b 表格 shadcn 化：去直框 / 去斑馬，只留橫線 + 透明表頭 + row hover ──
   原條文在本檔 L953-979（`.app-content` 變體），此處是同一組值的無前綴複本。
   每條的特異度都比對應的 `.app-content` 變體少一個 class，因此後台仍由變體決定。 */
.table { /* (0,1,0) vs BS `.table`(0,1,0) 同分、本節在後，因此勝出 */
  --bs-table-bg: transparent;
  border-color: hsl(var(--border));
  margin-bottom: 0;
}
/* 去掉 table-bordered 的直向框線，只保留橫線 —— (0,2,1) */
.table.table-bordered > :not(caption) > * > * { border-inline-width: 0; border-block-color: hsl(var(--border)); }
/* (0,2,0) */
.table > :not(:first-child) { border-top: 0; }
/*〔存查 s0891〕*/
.table > thead > tr > th {
  background: transparent !important; color: hsl(var(--muted-foreground)); font-weight: 500;
  border-bottom: 1px solid hsl(var(--border)); border-top: 0;
  padding: .6rem .75rem; white-space: nowrap; vertical-align: middle;
}
/* 內容列：去斑馬、舒適 padding、垂直置中、細橫線 —— (0,2,2) / (0,2,3) */
.table.table-striped > tbody > tr > * { --bs-table-bg-type: transparent; --bs-table-accent-bg: transparent; }
.table:not(.table-bordered) > tbody > tr > td { border-color: hsl(var(--border)); border-inline-width: 0; padding: .6rem .75rem; vertical-align: middle; }
/* `.table-bordered` 必須留直線（原條文註解已說明：日曆／月排班表的格線是資訊不是裝飾）—— (0,2,3) */
.table.table-bordered > tbody > tr > td,
.table.table-bordered > thead > tr > th {
    border: 1px solid hsl(var(--border));
    padding: .6rem .75rem;
    vertical-align: middle;
}
.table > tbody > tr:last-child > td { border-bottom: 0; }   /* (0,2,3) */
.table-hover > tbody > tr:hover > * { background: hsl(var(--muted)); color: hsl(var(--foreground)); }   /* (0,2,2) */

/*〔存查 s0892〕*/
.table > thead > tr > th {   /* (0,1,3) */
    font-weight: 500;
    color: hsl(var(--muted-foreground));
    letter-spacing: .01em;
}

/*〔存查 s0893〕*/
.table > thead > tr > th { font-size: 14px; }   /* (0,1,3) 勝 BS 繼承的 16px */
.table > tbody > tr > td { font-size: 14px; }   /* (0,1,3) */
/* (0,2,0) + !important —— 需要 !important 的理由與原條文相同：要壓過 markup 上
   `class="card-header p-3 fw-bold"` 的 `.fw-bold`（BS utility，font-weight:700!important，(0,1,0)）。
   `.app-content .card > .card-header`(0,3,0) 同樣帶 !important，因此後台仍由它決定。 */
.card > .card-header { font-weight: 600 !important; }

/*〔存查 s0894〕*/
.form-label {
    font-size: 14px;
    font-weight: 500;
}

/*〔存查 s0895〕*/
.card-header,
.card-footer {
    padding: 1rem;
}

/*〔存查 s0896〕*/
.small,
small { font-size: 12px; }

/*〔存查 s0897〕*/
.invalid-feedback,
.valid-feedback {
    font-size: 12px;
    margin-top: 4px;
}
.invalid-feedback { color: hsl(var(--destructive-fg)); }

/*〔存查 s0898〕*/

/*〔存查 s0899〕*/
:where(.fb-public) .btn:where(:not(.btn-icon):not(.btn-close)) {
    min-height: 40px;
    padding: 7px 16px;      /* 7 + 24(line-height) + 7 + 2(border) = 40 */
    font-size: 14px;        /* spec：控制項字級 default = 14px */
    line-height: 24px;
}
/* sm = 32px（spec：字級 13px、左右內距 10px） */
:where(.fb-public) .btn-sm {
    min-height: 32px;
    padding: 5px 10px;      /* 5 + 20 + 5 + 2 = 32 */
    font-size: 13px;
    line-height: 20px;
}
:where(.fb-public) .form-control {
    min-height: 40px;
    padding: 7px 12px;      /* spec：控制項左右內距 12px */
    font-size: 14px;
    line-height: 24px;
}
/* 手機 16px：iOS Safari 對 <16px 的輸入框會自動放大整頁（縮放後不會還原）。
   這是「防瀏覽器介入」不是設計字級，所以只加在手機斷點。 */
@media (max-width: 768px) {
    :where(.fb-public) .form-control { font-size: 16px; }
}

/*〔存查 s0900〕*/

.reissue-type-group {
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.reissue-type-card {
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius-md);          /* 8px：選項列表用中階，卡片的 --radius-xl(14px) 在這個尺寸會太圓 */
    background: hsl(var(--card));
    overflow: hidden;                          /* 讓 hover 底色被卡片圓角裁掉，標題列本身就不必再寫一組 radius */
    transition: border-color .15s ease, box-shadow .15s ease;
}

/* 標題列＝可點區。整列都是 <label for="invoice_type_…">，不是只有那顆圓點。 */
.reissue-type-hit {
    display: flex;
    align-items: center;
    gap: .625rem;
    min-height: 52px;                          /* ≥ 44px 觸控目標（WCAG 2.5.5 / Apple HIG） */
    margin: 0;                                 /* 蓋掉可能存在的 label 預設下邊距 */
    padding: .75rem 1rem;
    cursor: pointer;
    font-weight: 400;                          /* 上方「變更為」是 .fw-semibold，選項本身維持一般字重 */
    user-select: none;                         /* 連點兩下不要選到文字（觸控裝置尤其明顯） */
    -webkit-tap-highlight-color: transparent;  /* 手機點擊時不要那層灰色閃底，卡框變色已是回饋 */
    transition: background-color .15s ease;
}

/* 原生 radio 保留可見：五態（未選 / hover / focus / checked / disabled）連暗色
   全部由本檔 §35 ＋ §S-73 負責，這裡只調尺寸與 flex 定位，不重畫任何一態。 */
.reissue-type-input {
    flex: 0 0 auto;
    width: 1rem;                               /* 釘 16px：BS 出廠是 1em，而本表單在 result 頁吃
                                                  `.container-wide .card{font-size:14px}`、在 reissue 獨立頁不吃
                                                  因此不釘死的話兩頁的圓點大小會不一樣 */
    height: 1rem;
    margin-top: 0;                             /* BS `.form-check-input{margin-top:.25em}` 是給非 flex 版面用的 */
}

.reissue-type-title {
    line-height: 1.4;
    color: hsl(var(--foreground));
}

/* hover：只上在標題列，且只給「可選」的卡 */
.reissue-type-card:not(.reissue-type-card--disabled) .reissue-type-hit:hover {
    background: hsl(var(--accent));
}

/* 選中態：邊框 ＋ 1px 外環。色票＝ §35 給 checked radio 的 --dark（亮近黑 / 暗近白）。
   box-shadow 畫在 overflow:hidden 的**外側**，不會被裁掉。 */
.reissue-type-card:has(.reissue-type-input:checked) {
    border-color: hsl(var(--dark));
    box-shadow: 0 0 0 1px hsl(var(--dark));
}

/*〔存查 s0901〕*/
.reissue-type-card:has(.reissue-type-input:focus-visible) {
    border-color: hsl(var(--foreground));
}

/*〔存查 s0902〕*/
.reissue-type-card--disabled {
    border-style: dashed;  /* 被下面第六節 (7) 撥回 solid，這裡的 dashed 不是生效值，原文保留存查 */
    cursor: not-allowed;
}
.reissue-type-card--disabled .reissue-type-hit { cursor: not-allowed; }
.reissue-type-card--disabled .reissue-type-title { color: hsl(var(--muted-foreground)); }

/*〔存查 s0903〕*/
.reissue-type-note {
    display: block;
    padding: 0 1rem .75rem calc(1rem + 1rem + .625rem - .25rem);
}
/* 有這句說明時，標題列的下留白讓給它，避免上下各留一份（否則卡片會虛胖約 12px）。
   同時解除 52px 的最小高度：那個值是為「觸控目標」訂的，而這張卡點不下去，
     留著只會讓文字在 52px 的框裡偏下 4px，並且把一張**不能選**的卡撐得跟能選的一樣高。 */
.reissue-type-card--disabled .reissue-type-hit {
    min-height: auto;
    padding-bottom: .25rem;
}

/* 插槽：永遠存在、永遠 display:block，只有左右內距、沒有上下內距
   因此裡面沒有可見內容時高度為 0，四張卡看起來都只有標題列。
   顯示／隱藏由腳本操作**區塊自己**的 .style.display，插槽不參與。 */
.reissue-type-body {
    padding: 0 1rem;
}

/*〔存查 s0904〕*/
.reissue-type-fields {
    margin: 0 -1rem !important;
    padding: .75rem 1rem 1rem;
    border-top: 1px solid hsl(var(--border));
}

/*〔存查 s0905〕*/

/*〔存查 s0906〕*/
.reissue-type-card--disabled {
    border-style: solid;
}

/*〔存查 s0907〕*/

/*〔存查 s0908〕*/

/*〔存查 s0909〕*/
/*〔存查 s0910〕*/
/*〔存查 s0911〕*/
/*〔存查 s0912〕*/
/*〔存查 s0913〕*/
.reissue-type-badge {
    margin-left: auto;
    flex: 0 0 auto;
    display: inline-flex;       /*〔存查 s0914〕*/
    align-items: center;
    gap: .25rem;                /* 圖示與「目前」兩字的間距；storageLocation 那顆用的是一個半形空白，
                                   這裡用 gap 才不會在不同字型下漂移 */
    background: hsl(var(--primary));
    color: hsl(var(--primary-foreground));
    /*〔存查 s0915〕*/
    border: 1px solid transparent;
    /*〔存查 s0916〕*/
    /*〔存查 s0917〕*/
    /*〔存查 s0918〕*/
    padding: .125rem .5rem;
}

/* 使用者要求減少動態時，狀態切換一律瞬間完成（prefers-reduced-motion）。 */
@media (prefers-reduced-motion: reduce) {
    .reissue-type-card,
    .reissue-type-hit { transition: none; }
}

/*〔存查 s0919〕*/

/* 每一段（<label class="fb-tab reissue-seg-item">）。<a> 有的游標行為，<label> 要自己補。
   user-select / tap-highlight 兩條與 `.reissue-type-hit` 同一個理由（連點兩下不要選到文字、
   手機點擊不要那層灰底閃光）。 */
.reissue-seg-item {
    cursor: pointer;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
}
/* 「目前狀態」那一段：只換游標，不換文字顏色（理由與算式見上方 (2) 最後一段）。 */
.reissue-seg-input:disabled + .reissue-seg-item {
    cursor: not-allowed;
}

/*〔存查 s0920〕*/
/*〔存查 s0921〕*/
/*〔存查 s0922〕*/
/*〔存查 s0923〕*/
/*〔存查 s0924〕*/
.reissue-seg.fb-tabs:not(.fb-tabs--flow):not(.fb-tabs--touch) > .fb-tab {
    padding-left: .3125rem;      /* 5px。覆蓋 §S-67 ⑤ 的 `.5rem`＝8px（官方 px-2）。(0,5,0) > (0,4,0) */
    padding-right: .3125rem;
    gap: .25rem;                 /* 4px。覆蓋 §13 `.fb-tab` 的 `gap: .375rem`＝6px。 */
}
/*〔存查 s0925〕*/
.reissue-seg .reissue-seg-item .reissue-type-badge {
    gap: .1875rem;               /* 3px。覆蓋本節上方 `.reissue-type-badge` 的 `gap: .25rem`＝4px。 */
    padding: .0625rem .25rem;    /*〔存查 s0926〕*/
}

/* 「目前」chip 在分段控制項內的尺寸修正（本規則沿用未撤銷，只調一個值）。 */
.reissue-seg-item .reissue-type-badge {
    margin-left: 0;             /* 歸零 .reissue-type-badge 給卡片標題列用的 auto */
    font-size: .6875rem;        /* 11px：軌道只有 36px 高，12px 徽章會把片撐出換行 */
    /*〔存查 s0927〕*/
    padding: .0625rem .375rem;
}
/* 鍵盤焦點：焦點在被 .btn-check 隱藏的 input 上，用相鄰兄弟把環畫到看得見的片上。
   值與檔尾 `.fb-tab:focus-visible`（§S-73 官方兩層）逐字相同。 */
/*〔存查 s0928〕*/
/*〔存查 s0929〕*/
.reissue-seg-dot {
    flex: 0 0 auto;
    width: .375rem;
    height: .375rem;
    border-radius: 50%;
    background: hsl(var(--muted-foreground));
}
/*〔存查 s0930〕*/
.reissue-seg-note {
    padding: .5rem 0 0;
}

/* 「點改打勾」：只換這張卡上的 checked 指示器，§35 的全站規則一字未動（見上方 (5)）。
   SVG 逐字沿用 §35 `.form-check-input:checked[type="checkbox"]` 那一支（同一條 path、
   同一個 stroke-width、同一顆 --dark-foreground 色值）。 */
.reissue-type-input:checked[type="radio"] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fafafa' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}
html.dark .reissue-type-input:checked[type="radio"] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%2318181b' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}

/*〔存查 s0931〕*/

/*〔存查 s0932〕*/

/*〔存查 s0933〕*/
/*〔存查 s0934〕*/

/*〔存查 s0935〕*/
/*〔存查 s0936〕*/
.fb-tabs:not(.fb-tabs--flow) > .reissue-seg-input:checked + .reissue-seg-item {
    color: hsl(var(--foreground));
    background: hsl(var(--background));
    border-color: hsl(var(--dark));
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);
}
/*〔存查 s0937〕*/

/*〔存查 s0938〕*/
.fb-tabs:not(.fb-tabs--flow) > .reissue-seg-input:focus-visible + .reissue-seg-item {
    border-color: hsl(var(--ring));
    box-shadow: 0 0 0 3px hsl(var(--ring) / .5);
}

/*〔存查 s0939〕*/
.reissue-type-card--readonly .reissue-type-hit {
    min-height: 52px;           /* 抄 `.reissue-type-hit` 基底原值，撥回 --disabled 的 auto */
    padding-bottom: .75rem;     /* 抄 `.reissue-type-hit` 基底 `padding:.75rem 1rem` 的下半，撥回 --disabled 的 .25rem */
}
.reissue-current-mark {
    flex: 0 0 auto;
    width: 1rem;                /* 與 `.reissue-type-input` 逐字相同，理由見第二節該規則的原註解 */
    height: 1rem;
    margin-top: 0;              /* BS `.form-check-input{margin-top:.25em}` 是給非 flex 版面用的 */
}

/*〔存查 s0940〕*/

/* (1) 容器：details 本身不畫任何東西，外框仍然是 .alert.alert-warning 的。 */
.reissue-notice {
    display: block;
}

/*〔存查 s0941〕*/
.reissue-notice-summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 6px;
    row-gap: 2px;
    cursor: pointer;
    list-style: none;           /* Firefox / 新版 Chromium 的 marker */
    -webkit-tap-highlight-color: transparent;
}
.reissue-notice-summary::-webkit-details-marker {
    display: none;              /* 舊 WebKit（含較舊 iOS Safari）的 marker */
}
.reissue-notice-summary:focus-visible {
    outline: none;
    outline-offset: 0;
    box-shadow: 0 0 0 3px hsl(var(--ring) / .5);   /* §S-73 官方兩層的柔環那一層 */
    border-radius: 6px;
}

/* (3) 標題「⚠ 重要提示」：字面一字未動，只是現在住在 summary 裡。 */
.reissue-notice-title {
    display: inline-flex;
    align-items: center;
}

/*〔存查 s0942〕*/
.reissue-notice-icon {
    opacity: .7;
    transition: opacity .15s ease;
}
.reissue-notice-summary:hover .reissue-notice-icon,
.reissue-notice[open] .reissue-notice-icon {
    opacity: 1;
}

/* (5) 摘要句：獨占第二行。
   `flex-basis:100%` 而不是換一個 <div>：summary 的子元素若用 block 元素會讓
   flex 的垂直對齊多一層計算，也讓「標題與圖示同行」需要額外包一層。 */
.reissue-notice-brief {
    flex-basis: 100%;
    opacity: .9;
}

/*〔存查 s0943〕*/
.reissue-notice-panel {
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid currentColor;
    border-top-color: color-mix(in srgb, currentColor 20%, transparent);
}
.reissue-notice-line + .reissue-notice-line {
    margin-top: 4px;
}

/* `color-mix()` 的 fallback：上面刻意先寫一行實色 `border-top: 1px solid currentColor`，
   不支援 color-mix 的瀏覽器會忽略後面那行 border-top-color，得到一條實色分隔線
   —— 比較重，但不會消失，也不會變成預設的黑色。 */



/*〔存查 s0991〕*/
.site-main .card > .card-body:last-child > .row:last-child:has(> [class*="col-"].border-bottom) {
    clip-path: inset(0 0 1px 0);
}

/*〔存查 s0992〕*/

/* 遮罩：官方 AlertDialogOverlay = bg-black/50（原廠 rgba(0,0,0,.4)） */
.swal-overlay {
  background-color: hsl(var(--dark-panel) / .5);
}

/* 容器：官方 AlertDialogContent = grid gap-4 rounded-lg border p-6 sm:max-w-lg */
.swal-modal {
  display: inline-grid !important;      /* 不能用 grid，理由見章節註解 */
  gap: 1rem !important;
  padding: 1.5rem !important;           /* p-6 */
  text-align: left !important;          /* 原廠 center；官方對話框是左對齊 */
  max-width: 32rem !important;          /* sm:max-w-lg */
}

/*〔存查 s0993〕*/
.swal-icon { display: none !important; }

/* 標題：官方 AlertDialogTitle = text-lg font-semibold */
.swal-title {
  padding: 0 !important;
  margin: 0 !important;
  text-align: left !important;
  font-size: 1.125rem !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
}

/* 內文：官方 AlertDialogDescription = text-sm text-muted-foreground
   `.swal-text` 走 `text:` 參數；`.swal-content` 走 `content:` 參數（§POS-8 的 checkbox modal 用這條） */
.swal-text,
.swal-content {
  padding: 0 !important;
  margin: 0 !important;
  text-align: left !important;
  font-size: .875rem !important;
  line-height: 1.45 !important;
  color: hsl(var(--muted-foreground)) !important;
  max-width: 100% !important;           /* 原廠 .swal-text 是 calc(100% - 20px)，會在 grid 內短一截 */
}

/* 頁尾：官方 AlertDialogFooter = flex sm:justify-end sm:gap-2、且**沒有分隔線** */
.swal-footer {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: .5rem !important;
  padding: 0 !important;
  margin: 0 !important;
  border-top: 0 !important;
}
.swal-button-container {
  margin: 0 !important;                 /* 原廠 5px；間距改由 footer 的 gap 統一負責（SSOT） */
  display: inline-flex !important;
}

/* 按鈕：官方 Button size="sm" = h-8 px-3 text-sm
   兩條選擇器都要：9 個呼叫點有 4 個傳 `className:'btn …'`（machine 1566/1600/1607、
     package 1249/1283/1290），只寫 `.swal-button` 會被 Bootstrap `.btn` 的 padding 撐到 40px。 */
.swal-button,
.swal-button.btn {
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 .75rem !important;
  font-size: .875rem !important;
  line-height: 1 !important;
  font-weight: 500 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  white-space: nowrap !important;
  border-radius: var(--radius-md) !important;
}

/* 取消鈕：官方 AlertDialogCancel = buttonVariants({variant:"outline"}) */
.swal-button--cancel,
.swal-button--cancel.btn {
  background: hsl(var(--background)) !important;
  color: hsl(var(--foreground)) !important;
  border: 1px solid hsl(var(--border)) !important;
}
.swal-button--cancel:not([disabled]):hover,
.swal-button--cancel.btn:not([disabled]):hover {
  background: hsl(var(--accent)) !important;
  color: hsl(var(--accent-foreground)) !important;
}

/*〔存查 s0994〕*/
.swal-button.btn-danger {
  background: hsl(var(--destructive)) !important;
  border-color: hsl(var(--destructive)) !important;
  color: hsl(var(--destructive-foreground)) !important;
}
.swal-button.btn-danger:not([disabled]):hover {
  background: hsl(var(--destructive) / .9) !important;
  border-color: hsl(var(--destructive) / .9) !important;
  color: hsl(var(--destructive-foreground)) !important;
}

/*〔存查 s0995〕*/


/*〔存查 s0996〕*/
.app-content :not(.input-group-sm):not(.input-group-lg) > .btn:not(.btn-sm):not(.btn-xs):not(.btn-lg):not(.btn-icon):not(.btn-close),
.theme-panel .btn:not(.btn-sm):not(.btn-xs):not(.btn-lg):not(.btn-icon):not(.btn-close) {
    min-height: 32px;
    line-height: 20px;      /* 5 + 20 + 5 + 2(border) = 32 */
    padding-top: 5px;
    padding-bottom: 5px;
    /*〔存查 s0997〕*/
}

/*〔存查 s0998〕*/
.app-content a.btn.btn-xs:not(.btn-icon),
.app-content button.btn.btn-xs:not(.btn-icon) {
    min-height: 32px;
    line-height: 20px;      /* 5 + 20 + 5 + 2 = 32；font-size 維持 §CA 補位的 12px */
    padding-top: 5px;
    padding-bottom: 5px;
}

/* ── (3) Modal 影子階梯 36 → 32（與 (1) 同一組數字）──
   `.modal` 那一整組是 (1) 的複製品，改一邊不改另一邊 = 開新破口。 */
.modal :not(.input-group-sm):not(.input-group-lg) > .btn:not(.btn-sm):not(.btn-xs):not(.btn-lg):not(.btn-icon):not(.btn-close) {
    min-height: 32px;
    line-height: 20px;
    padding-top: 5px;
    padding-bottom: 5px;
}

/* ── (4) Modal 的 .btn-xs 24 → 32（span 一樣排除，理由同 (2)）── */
.modal a.btn.btn-xs:not(.btn-icon),
.modal button.btn.btn-xs:not(.btn-icon) {
    min-height: 32px;
    line-height: 20px;
    padding-top: 5px;
    padding-bottom: 5px;
}

/*〔存查 s0999〕*/
.btn.btn-lg:not(.btn-icon) {
    min-height: 32px;
}

/*〔存查 s1000〕*/
:where(.fb-public) .btn:where(:not(.btn-icon):not(.btn-close)) {
    min-height: 32px;
    line-height: 20px;
    /*〔存查 s1001〕*/
    padding-top: 5px;       /* 5 + 20 + 5 + 2 = 32 */
    padding-bottom: 5px;
    /* font-size 維持 14px（上游值） */
}

/*〔存查 s1002〕*/
.login .btn-dark,
.login .btn-primary {
    min-height: 32px;
}

/*〔存查 s1003〕*/
.login.login-v2 .login-content .btn.btn-primary,
.login.login-v2 .login-content .btn.btn-yellow {
    height: 32px;
    min-height: 32px;
}

/*〔存查 s1004〕*/
.fb-tabs {
    height: auto;
}
.fb-tab {
    height: 32px;
}

/*〔存查 s1005〕*/
.fb-tabs.fb-tabs--touch > .fb-tab {
    height: 32px;
    min-height: 32px;
    padding-top: 0;
    padding-bottom: 0;
}

/*〔存查 s1006〕*/
.btn.btn-icon {
    width: 32px;
    height: 32px;
    min-height: 32px;
    line-height: 32px;
    font-size: 14px;
    border-radius: 32px;
    padding: 0;
}
.btn.btn-icon.btn-xs,
.btn.btn-icon.btn-sm,
.btn.btn-icon.btn-lg {
    width: 32px;
    height: 32px;
    min-height: 32px;
    line-height: 32px;
    font-size: 14px;
}


/*〔存查 s1014〕*/
:where(.fb-public) span.btn.btn-xs {
    min-height: 24px;
    line-height: 18px;      /* 2 + 18 + 2 + 2(border) = 24 */
    padding-top: 2px;
    padding-bottom: 2px;
}

/*〔存查 s1015〕*/

/*〔存查 s1016〕*/
.container-wide .card .table-responsive { position: relative; }

/*〔存查 s1017〕*/
.container-wide .card table.table {
    font-size: .875rem;                  /* --text-sm */
    line-height: calc(1.25 / 0.875);     /* --text-sm--line-height 等於 20px */
}

/*〔存查 s1018〕*/
.container-wide .card .table > thead > tr > th {
    height: 2.5rem;                      /* h-10 = --spacing*10 */
    padding: 0 .5rem;                    /* px-2；官方沒有 py，靠 h-10 定高 */
    text-align: left;                    /* text-left（blade 的 .text-end 帶 !important，數字欄照樣靠右，與官方 demo 一致） */
    vertical-align: middle;              /* align-middle */
    font-weight: 500;                    /* font-medium = --font-weight-medium */
    white-space: nowrap;                 /* whitespace-nowrap */
    letter-spacing: normal;              /* 官方無 tracking-*；歸零本檔既有的 .01em */
}

/*〔存查 s1019〕*/
.container-wide .card .table > thead > tr > th { color: hsl(var(--foreground)); }

/*〔存查 s1020〕*/
.container-wide .card .table > tbody > tr > td {
    padding: .5rem;                      /* p-2 */
    vertical-align: middle;              /* align-middle */
    white-space: nowrap;                 /*〔存查 s1021〕*/
}

/*〔存查 s1022〕*/
.container-wide .card .table > tbody > tr {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);   /* --default-transition-timing-function */
    transition-duration: 150ms;                                 /* --default-transition-duration */
}
.container-wide .card .table > tbody > tr:hover { background-color: hsl(var(--muted) / .5); }   /* hover:bg-muted/50 */

/*〔存查 s1023〕*/
.container-wide .card .table > tfoot {
    border-top: 1px solid hsl(var(--border));   /* border-t */
    background-color: hsl(var(--muted) / .5);   /* bg-muted/50 */
    font-weight: 500;                           /* font-medium */
}
.container-wide .card .table > tfoot > tr > td {
    padding: .5rem;                             /* 與 (4) 同 —— 官方 TableFooter 內用的就是 TableCell */
    vertical-align: middle;
    white-space: nowrap;
    /*〔存查 s1024〕*/
    font-size: .875rem;                         /* text-sm */
}
.container-wide .card .table > tfoot > tr:last-child > td { border-bottom-width: 0; }   /* [&>tr]:last:border-b-0 */

/* ── (7) TableCaption `mt-4 text-sm text-muted-foreground` ──
   本頁沒有 `<caption>`，先備著；未來加了 caption 才有作用，現在 0 命中、0 風險。 */
.container-wide .card .table > caption {
    margin-top: 1rem;                    /* mt-4 = --spacing*4 */
    font-size: .875rem;                  /* text-sm */
    color: hsl(var(--muted-foreground)); /* text-muted-foreground */
    caption-side: bottom;                /* 官方 Table 的 caption-bottom */
}


/*〔存查 s1029〕*/

/*〔存查 s1030〕*/
.app-content :not(.input-group-sm):not(.input-group-lg) > .form-control:not(textarea):not(.form-control-sm):not(.form-control-lg):not(.form-control-color):not([type="file"]):not([type="color"]),
.app-content :not(.input-group-sm):not(.input-group-lg) > .form-select:not(.form-select-sm):not(.form-select-lg):not([multiple]):not([size]) {
    height: 32px;
    min-height: 32px;
    line-height: 20px;      /* 5 + 20 + 5 + 2(border) = 32 */
    padding-top: 5px;
    padding-bottom: 5px;
    /* font-size 不宣告 —— 見章節開頭「全節一律不動 font-size」 */
}
/* `.input-group-text` 必須跟上：漏掉就是 32px 的輸入框配 36px 的附加框（§S-4 原本的教訓） */
.app-content :not(.input-group-sm):not(.input-group-lg) > .input-group-text {
    min-height: 32px;
    line-height: 20px;
    padding-top: 5px;
    padding-bottom: 5px;
}

/*〔存查 s1031〕*/
.modal :not(.input-group-sm):not(.input-group-lg) > .form-control:not(textarea):not(.form-control-sm):not(.form-control-lg):not(.form-control-color):not([type="file"]):not([type="color"]),
.modal :not(.input-group-sm):not(.input-group-lg) > .form-select:not(.form-select-sm):not(.form-select-lg):not([multiple]):not([size]) {
    height: 32px;
    min-height: 32px;
    line-height: 20px;
    padding-top: 5px;
    padding-bottom: 5px;
}
.modal :not(.input-group-sm):not(.input-group-lg) > .input-group-text {
    min-height: 32px;
    line-height: 20px;
    padding-top: 5px;
    padding-bottom: 5px;
}

/*〔存查 s1032〕*/
:where(.fb-public) .form-control,
:where(.fb-public) .form-select {
    min-height: 32px;
    line-height: 20px;      /* 5 + 20 + 5 + 2 = 32 */
    padding-top: 5px;
    padding-bottom: 5px;
}
:where(.fb-public) .input-group-text {
    min-height: 32px;
    line-height: 20px;
    padding-top: 5px;
    padding-bottom: 5px;
}

/*〔存查 s1033〕*/
.login .form-control,
.login .form-select {
    min-height: 32px;
    line-height: 20px;
    padding-top: 5px;
    padding-bottom: 5px;
}
.login.login-v2 .login-content .form-control:not(.form-control-lg),
.login.login-v2 .login-content .form-select:not(.form-select-lg) {
    height: 32px;
    min-height: 32px;
}
/* 這一條只換高度、**不碰 padding** —— view 的 inline style 給它 `padding:0 12px`，
   而 `.input-group-text` 是 `display:flex; align-items:center`，內容自己會垂直置中，
   再去搶 padding 只是多開一場沒必要的特異度戰爭。 */
.login.login-v2 .login-content .input-group .input-group-text {
    height: 32px;
    min-height: 32px;
}

/*〔存查 s1034〕*/
.form-floating > .form-control,
.form-floating > .form-select,
.form-floating > .form-control:focus,
.form-floating > .form-control:not(:placeholder-shown),
.form-floating > .form-control-plaintext:focus,
.form-floating > .form-control-plaintext:not(:placeholder-shown) {
    height: 32px;
    min-height: 32px;
}
.login .form-floating > .form-control,
.login .form-floating > .form-select {
    height: 32px !important;
    min-height: 32px;
}
.login .form-floating > i,
.login .form-floating > svg { height: 32px; }

/* ── (6) `.h-45px` 的兩階 36 / 40 → 32（§S-4 (d) 作廢改值）──
   選擇器與上游同分、位置在後取勝；`!important` 照抄（上游帶著，不帶就輸給它）。
   §S-4 (d) 已註記「blade 0 命中」，本條與上游一樣是**防復活**用的，不是在修現行畫面。 */
.form-control.h-45px,
.form-select.h-45px { height: 32px !important; min-height: 32px; }
.login .form-control.h-45px,
.login .form-select.h-45px { height: 32px !important; min-height: 32px; }


/*〔存查 s1036〕*/
.app-content textarea.form-control:not(.form-control-sm):not(.form-control-lg),
.modal textarea.form-control:not(.form-control-sm):not(.form-control-lg),
:where(.fb-public) textarea.form-control:not(.form-control-sm):not(.form-control-lg) {
    min-height: 32px;
    height: auto;
    line-height: 20px;      /* rows x 20 + 5 + 5 + 2 */
    padding-top: 5px;
    padding-bottom: 5px;
}
.app-content textarea.form-control-sm,
.modal textarea.form-control-sm {
    min-height: 32px;
}

/*〔存查 s1037〕*/
.btn.btn-lg:not(.btn-icon) {
    padding-left: 8px;      /*〔存查 s1038〕*/
    padding-right: 8px;
    font-size: 13px;        /*〔存查 s1039〕*/
    gap: .375rem;           /* 對齊 §S-79 的 .btn-sm 階（官方 button.tsx size.sm 的 gap-1.5） */
}



/*〔存查 s1045〕*/
@media (max-width: 767.98px), (pointer: coarse) and (max-width: 1024px) {
    .login.login-v2 .login-content .form-control:not(.form-control-lg),
    .login.login-v2 .login-content .form-select:not(.form-select-lg) {
        font-size: 16px;
    }
}


/*〔存查 s1046〕*/

/* ── (1) `<table>` = `w-full caption-bottom text-sm` 的 text-sm 那半 ── */
.table.table.table:not(.fb-form-table) {
    font-size: .875rem;                  /* --text-sm */
    line-height: calc(1.25 / 0.875);     /* --text-sm--line-height：14px 字對應 20px */
}

/*〔存查 s1047〕*/
.table.table.table:not(.fb-form-table) > thead > tr > th {
    height: 2.5rem;                      /* h-10 = --spacing*10 = 40px */
    padding: 0 .5rem;                    /* px-2；官方沒有 py，靠 h-10 定高 */
    vertical-align: middle;              /* align-middle */
    font-weight: 500;                    /* font-medium */
    font-size: .875rem;                  /* text-sm；直接鍵在 th 上，不靠繼承（理由見「五、」） */
    line-height: calc(1.25 / 0.875);
    letter-spacing: normal;              /* 官方無 tracking-*；歸零 §補位7 的 .01em */
    color: hsl(var(--foreground));       /*〔存查 s1048〕*/
}

/*〔存查 s1049〕*/
.table.table.table:not(.fb-form-table) > tbody > tr > td {
    padding: .5rem;                      /* p-2 */
    vertical-align: middle;              /* align-middle */
    font-size: .875rem;                  /* text-sm（必要：贏過 td 層級的 13px，否則行高變 18.57、列高 35.57） */
    line-height: calc(1.25 / 0.875);
}

/*〔存查 s1050〕*/
.table.table.table:not(.fb-form-table) > tbody > tr {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);   /* --default-transition-timing-function */
    transition-duration: 150ms;                                 /* --default-transition-duration */
}
.table.table.table:not(.fb-form-table) > tbody > tr:hover { background-color: hsl(var(--muted) / .5); }   /* hover:bg-muted/50 */

/*〔存查 s1051〕*/
.table.table.table:not(.fb-form-table) > tfoot {
    border-top: 1px solid hsl(var(--border));   /* border-t */
    background-color: hsl(var(--muted) / .5);   /* bg-muted/50 */
    font-weight: 500;                           /* font-medium */
}
.table.table.table:not(.fb-form-table) > tfoot > tr > td {
    padding: .5rem;                             /* 官方 TableFooter 內用的就是 TableCell */
    vertical-align: middle;
    font-size: .875rem;                         /*〔存查 s1052〕*/
    line-height: calc(1.25 / 0.875);
}
.table.table.table:not(.fb-form-table) > tfoot > tr:last-child > td { border-bottom-width: 0; }   /* [&>tr]:last:border-b-0 */

/* ── (6) TableCaption `mt-4 text-sm text-muted-foreground` ──
   全站目前 0 命中，先備著；未來加了 `<caption>` 才有作用，現在 0 風險。 */
.table.table.table:not(.fb-form-table) > caption {
    margin-top: 1rem;                    /* mt-4 */
    font-size: .875rem;                  /* text-sm */
    color: hsl(var(--muted-foreground)); /* text-muted-foreground */
    caption-side: bottom;                /* 官方 Table 的 caption-bottom */
}


/*〔存查 s1053〕*/
.table-hover.table-hover.table-hover:not(.fb-form-table) > tbody > tr:hover > * {
    background-color: hsl(var(--muted) / .5) !important;   /* hover:bg-muted/50 —— 覆蓋 §23 L2174 的 hsl(var(--accent)) !important */
}


/*〔存查 s1054〕*/

/* ── (1) `.card` = shadcn v4 Card 的 `shadow-sm` ── */
.card.card { box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); }

/* ── (2) `.shadow` / `.shadow-sm` 工具類 = 同一個官方值（v4 的 --shadow 與 --shadow-sm 逐字相同）── */
.shadow.shadow,
.shadow-sm.shadow-sm { box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1) !important; }


/*〔存查 s1055〕*/

#sidebar .menu-submenu .menu-link {
    height: 28px;   /* SidebarMenuSubButton h-7（原本繼承 L1937 主項的 h-8=32px） */
}


/*〔存查 s1062〕*/

/*〔存查 s1063〕*/
.page-header.page-header.d-flex > .fb-ph-actions {
    /* order 1 ＝ 標題／計數 chip／副標（order 0）之後、§S-66 填充位（order 90）之前。
       與 §S-69／§S-70 逐字同值，三條同時命中時結果也是同一個。 */
    order: 1;
    /* 壓住 §S-66 的 margin-left auto !important（1440 是死碼，375 折行時會真的生效）。 */
    margin-left: 0 !important;
}

/* --- S-114 end ------------------------------------------------------------- */

/*〔存查 s1069〕*/

/* ── `.shadow-lg` 工具類 = Tailwind v4 `--shadow-lg` 逐字值 ── */
.shadow-lg.shadow-lg { box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1) !important; }
/* --- S-112 end ------------------------------------------------------------- */


/* --- S-115 end ------------------------------------------------------------- */

/*〔存查 s1073〕*/
.badge.badge.badge.badge > svg {
    font-size: 1em;
    width: 1em;
    height: 1em;
    vertical-align: -0.125em;
}
/* --- S-116 end ------------------------------------------------------------- */

/*〔存查 s1074〕*/

/* --- S-117 end ------------------------------------------------------------- */

/* --- S-118 end ------------------------------------------------------------- */


/*〔存查 s1081〕*/

#sidebar .app-sidebar-minify-btn {
    /* 幾何：28 → 32，與 header 四顆工具鈕、側欄 13 顆 menu-link 同階 */
    box-sizing: border-box;     /* ← 蓋掉 §S-29 的 content-box，height 才是「連內距的總高」 */
    height: 32px;
    min-height: 32px;
    min-width: 32px;            /* 圖示 16 ＋ 內距 8×2 恰好 32；這條是正方形的下限保證 */
    padding: 0 .5rem;           /* ← 蓋掉 §S-29 的 6px 四邊；與 header 工具鈕的 0 8px 同值 */
    /* 這組工具鈕的共用字重。這顆鈕現況零文字節點，因此目前零視覺影響（見章節註解） */
    font-weight: 500;
}
/* 圖示尺寸釘死，不再由 font-size(1em) 隱性決定。
   `i` 與 `svg` 兩種都接：Lucide 會把 `<i data-lucide>` 換成 `<svg>`，替換前後不能有一段沒樣式。
   刻意只宣告 width/height/flex，**不宣告 transform**，因此 §S-14 收合態的箭頭翻面完全不受影響。 */
#sidebar .app-sidebar-minify-btn > :is(svg, i) {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
}
/* --- S-119 end ------------------------------------------------------------- */

/* --- S-120 end ------------------------------------------------------------- */

/*〔存查 s1084〕*/
.site-nav {
    padding: 4px;
    margin: -4px;
}


/* --- S-126 end ------------------------------------------------------------- */

/*〔存查 s1097〕*/
/* --- S-126a end ------------------------------------------------------------ */

/*〔存查 s1098〕*/
/* --- S-127 end -------------------------------------------------------------- */


/*〔存查 s1099〕*/

@media (min-width: 992px) {

  /* ── (1) 側欄本體：抑制期間 hover 不展開 ─────────────────────────────
     值與 §S-14 (2) 的窄條態相同；box-shadow 一併收掉，
     否則會出現「寬度是窄條、卻掛著『我正浮在內容上』的陰影」的矛盾外觀。 */
  .app-sidebar-minified #sidebar.app-sidebar.fb-sidebar-hover-off:hover {
    width: var(--fb-sidebar-w-mini);
    box-shadow: none;
  }

  /* ── (2) 把 §S-14 (3) 的「窄條態長相」補回來（原文掛 :not(:hover)，滑鼠停著時失效）─ */
  .app-sidebar-minified #sidebar.app-sidebar.fb-sidebar-hover-off:hover .menu-link {
    justify-content: center;
    gap: 0;
    padding-left: 0;
    padding-right: 0;
  }
  .app-sidebar-minified #sidebar.app-sidebar.fb-sidebar-hover-off:hover .menu-text,
  .app-sidebar-minified #sidebar.app-sidebar.fb-sidebar-hover-off:hover .menu-caret,
  .app-sidebar-minified #sidebar.app-sidebar.fb-sidebar-hover-off:hover .menu-badge {
    display: none !important;
  }
  /* .menu-header：本站 _nav 目前 0 命中，與 §S-14 (3) 同步保留，日後加上時不會突然爆寬 */
  .app-sidebar-minified #sidebar.app-sidebar.fb-sidebar-hover-off:hover .menu-header {
    height: 1px;
    padding: 0;
    margin: 8px 12px;
    overflow: hidden;
    text-indent: -999em;
    background: hsl(var(--sidebar-border));
  }
  /* 子選單：同時壓掉 §S-14 (5) 的「hover 到 has-sub 就展開」 */
  .app-sidebar-minified #sidebar.app-sidebar.fb-sidebar-hover-off:hover .menu-submenu {
    display: none !important;
  }
  /* 收合鈕自己：窄條態要置中（展開態靠 .ms-auto 貼右） */
  .app-sidebar-minified #sidebar.app-sidebar.fb-sidebar-hover-off:hover .app-sidebar-minify-btn {
    margin: 0 auto !important;
    justify-content: center;
  }

  /* ── (3) 個人區：§S-14 (4) 在 hover 時把「只留頭像」還原了，這裡再收回去 ──────
     值逐字取自 §Sidebar 的「側欄收合時只留頭像」三條（L6569-6574）。 */
  .app-sidebar-minified #sidebar.app-sidebar.fb-sidebar-hover-off:hover .menu-profile-link {
    grid-template-columns: 32px;
    justify-content: center;
  }
  .app-sidebar-minified #sidebar.app-sidebar.fb-sidebar-hover-off:hover .menu-profile-info,
  .app-sidebar-minified #sidebar.app-sidebar.fb-sidebar-hover-off:hover .menu-profile .menu-caret {
    display: none !important;
  }
}
/* --- S-128 end ---------------------------------------------------------------- */