/*Noto Sans Traditional Chinese */
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@500&display=swap");

*,
*::before,
*::after {
  box-sizing: border-box;
}
body {
  margin: 0;
  padding: 0;
  font-family: "noto sans tc", "Microsoft JhengHei", "sans-serif";
  line-height: 1.6;
}
a {
  text-decoration: none;
  color: inherit;
}

:root {
  --text-inverse: #ffffff; /*白字*/
  --bg-light: #fafafa; /*頁面最外層背景／全站底色*/
  --white-color: #f9f9f9; /*White Smoke 白色烟是较浅的灰色*/
  --light-gray: #c2c2c2; /*（淺灰色）*/
  --text-secondary: #999999; /*輔助說明文字、標籤、小字*/
  --text-body: #666666; /*一般正文文字*/
  --gray-100: #fafafa; /*網頁最淺背景／分隔區塊背景頁面/最外層背景／全站底色*/
  --gray-200: #f0f0f0; /*內區背景／輸入欄背景／卡片底色/主要內容區塊底色／表單背景*/
  --gray-300: #e0e0e0; /*輸入框邊框／hover 效果底色／不可用按鈕背景*/
  --gray-400: #cccccc; /*邊框、分隔線、表格框線*/
  --gray-500: #b3b3b3; /*非主要文字、標籤文字*/
  --gray-600: #999999; /*預設輔助文字／副標題／icon 顏色*/
  --gray-700: #7f7f7f; /*一般文字／未強調的按鈕文字*/
  --gray-800: #666666; /*正文主體文字／主要段落*/
  --gray-900: #4d4d4d; /*標題、LOGO 區塊／主選單*/
  --gray-1000: #333333; /*強烈對比文字／頁首／黑色替代色*/
  --gray-1100: #1a1a1a; /*極深灰，幾乎為黑色，適合主標與對比設計*/
  --dark-color: #000000;

  --price-red: #e53935;
  --h1-font-size: 62px;
  --h2-font-size: 42px;
  --h3-font-size: 36px;
  --h4-font-size: 28px;
  --h5-font-size: 22px;
  --h6-font-size: 18px;
  --Checkout-amount-total-font-size: 22px;

  --body-font-family: "noto sans tc", "Microsoft JhengHei", "sans-serif";
  --copyright-font-size: 0.8rem;
}

#addCartSuccessModal {
  z-index: 1080 !important; /* 高於 Bootstrap 的 backdrop (1050) 與 modal (1055) */
}

.btn-dark-secondary {
  --bs-btn-color: #fff;
  --bs-btn-bg: #5a5f66; /* 主色，比原本 #6c757d 更深 */
  --bs-btn-border-color: #5a5f66;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #484c52;
  --bs-btn-hover-border-color: #42464c;
  --bs-btn-focus-shadow-rgb: 100, 105, 110;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #42464c;
  --bs-btn-active-border-color: #3e4147;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #5a5f66;
  --bs-btn-disabled-border-color: #5a5f66;
}

.container img {
  width: 100%;
}

/*====== 768px 以下（平板） ====== */
@media (max-width: 768px) {
  :root {
    --h1-font-size: 2.5rem;
    --h2-font-size: 1.75rem;
    --h3-font-size: 1.5rem;
  }
}

/* ====== container ====== */

@media (max-width: 576px) {
  /*.container 寬度（微白邊）*/
  .container {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }

  /* 手機版廣告圖片滿版 */
  .container img {
    width: 100%;
    height: auto;
    object-fit: cover;
    display: block;
    margin: 0 auto;
  }
}

/* ====== footer ====== */
.footer-text {
  font-size: 0.875rem; /* 約為 fs-6 */
}

@media (min-width: 768px) {
  .footer-text {
    font-size: 1rem; /* 約為 fs-5 */
  }
}

@media (max-width: 576px) {
  .footer-text {
    display: block;
    text-align: center;
    margin-bottom: 0.25rem;
  }

  .footer-text {
    display: block;
    margin-bottom: 0.25rem;
  }
}