/* Google Material Symbols 圖示（老闆 2026-10-05 拍板：客人介面一律用這套，不用 emoji）
   字型檔放自己伺服器 static/fonts/（只含用到的圖示，約 7KB），網路不好也不會變成英文字。
   設定（老闆選全部預設）：外型＝線框 Outlined、平常空心選中才實心、粗細 400、強調 0、大小 24。
   要加新圖示：到 fonts.google.com/icons 查名字，重新下載含新名字的字型檔（見 PROGRESS／記憶 customer-member-area）。 */
@font-face {
  font-family: 'Material Symbols Outlined';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url(/static/fonts/material-symbols-outlined.woff2?v=7) format('woff2');
}
.ms {
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  vertical-align: middle;
  -webkit-font-smoothing: antialiased;
  font-feature-settings: 'liga';
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
  user-select: none;
}
/* 被選中／啟用中 → 實心 */
.ms.on { font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24; }
.ms.sm { font-size: 18px; }
.ms.xs { font-size: 15px; }

/* 師傅端／後台用的「文字裡的小圖示」（2026-10-06）：<i class="mi" data-i="save"></i>
   圖示名字放在 data-i、用 ::before 畫出來 → 按鈕的文字（textContent）裡沒有英文名字，
   程式存起來再還原按鈕文字時頂多少一個圖示，不會冒出「save 儲存」這種英文。大小跟著旁邊的字。 */
.mi { font-style: normal; display: inline-block; line-height: 1; vertical-align: -0.16em; width: 1.15em; text-align: center; }
.mi::before {
  content: attr(data-i);
  font-family: 'Material Symbols Outlined';
  font-weight: normal; font-style: normal; font-size: 1.15em; line-height: 1;
  letter-spacing: normal; text-transform: none; white-space: nowrap; word-wrap: normal; direction: ltr;
  -webkit-font-smoothing: antialiased; font-feature-settings: 'liga';
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}
.mi.on::before { font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24; }
.mi[data-f]::before { font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24; }
