/* ==================== CSS變量定義 ==================== */
:root {
	/* 文字顏色層級 */
	--color-text-primary: #ffffff; /* 主要文字 - 白色 */
	--color-text-secondary: #e44c65; /* 次要文字 - 粉紅色 */
	--color-text-btn-service: #212121; /* 服務頁按鈕文字 - 深灰色 */
	--color-text-page-banner: #ffffff; /* 內頁Banner文字 */

	--color-text-1: #212121; /* 深色文字 - 深灰色 */
	--color-text-2: #dddddd; /* 淺色文字 - 淺灰色 */
	--color-text-gray: #999; /* 灰色文字 - 中灰色 */

	/* 背景顏色層級 */
	--color-bg-content: #272833; /* 更深背景 */
	--color-bg-footer: #34353F; /* 深灰色背景 */
	--color-bg-navbar: #34353F; /* 導覽列 */
	--color-bg-navbar-scroll: rgba(45, 45, 45, 0.9); /* 首頁導覽列滾動時的背景 */
	--color-bg-menu-icon: #b2b2b2;

	--color-bg-1: #ffffff; /* 白色背景 */
	--color-bg-2: #eeeeee; /* 更淺灰色背景 */
	--color-bg-3: #e3e3e3; /* 淺灰色背景 */
	--color-bg-4: #cecece; /* 中灰色背景 */
	--color-bg-5: #34353F; /* 深灰色背景 */
	--color-bg-6: #272833; /* 更深背景 */
	--color-bg-7: #1F2028; /* 最深背景 */

	/* 輔助顏色 */
	--color-red: #ff4c4c; /* 紅色 */
	--color-red-dark: #c00; /* 深紅色 */
	--color-orange: #ea8228; /* 橙色 */
	--color-green: #7AA354; /* 綠色 */
	--color-blue: #268cdf; /* 藍色 */
	--color-brown: #886532; /* 棕色 */
	--color-yellow: #D2BD86; /* 黃色 */
	--color-gray: #888; /* 灰色 */

	/* 邊框顏色 */
	--color-border-1: #bbb; /* 標準邊框 - 淺灰色 */
	--color-border-2: #ddd; /* 淺邊框 - 更淺灰色 */
	--color-border-3: #391911; /* 深邊框 - 深褐色 */

	/* 按鈕顏色類別 */
	--color-btn-service-odd: #e2e4d7; /* 服務頁按鈕 奇數 */
	--color-btn-service-even: #bbbea8; /* 服務頁按鈕 偶數 */
	--color-btn-article: #404052; /* 文章按鈕 */
	--color-btn-article-back: #E44C65; /* 文章返回按鈕 */

	--color-btn-primary: #404052; /* 主要按鈕 - 深藍灰色 */
	--color-btn-secondary: #E44C65; /* 次要按鈕 - 粉紅色 */
	--color-btn-accent: #768c88; /* 強調按鈕 - 淺棕色 */
	--color-btn-green: #7AA354; /* 綠色按鈕 - 草綠色 */
	--color-btn-blue: #83acec; /* 藍色按鈕 - 天空藍 */
	--color-btn-red: #fd947c; /* 紅色按鈕 - 珊瑚紅 */
	--color-btn-orange: #e5b06f; /* 橙色按鈕 - 淺橙色 */

	/* 連結顏色狀態 */
	--color-link: #83acec; /* 普通連結 - 蓝色 */
	--color-link-hover: #E44C65; /* 連結懸停 - 粉紅色 */
	--color-btn-hover: #E44C65; /* 按鈕文字懸停 - 粉紅色 */
	--color-btn-text-hover: #ffffff; /* 按鈕文字懸停 - 白色 */
	--color-btn-service-hover: #768c88; /* 服務頁按鈕文字懸停 - 灰綠色 */
	--color-btn-news-hover: #404052; /* 最新消息頁文字懸停 */

	/* 陰影/疊層效果 */
	--color-overlay: rgba(0, 0, 0, 0.3); /* 深色半透明疊層 */
	--color-overlay-dark: rgba(31, 32, 40, 0.4); /* 淺色藍灰疊層 */
	--shadow-header: 1px 1px 10px rgba(0, 0, 0, 0.2); /* 頁首陰影效果 */

	/* 產品相關 */
	--color-product-bg: #e8e4d8; /* 產品背景色 - 米白色 */
	--color-product-text: #8f7b43; /* 產品文字色 - 土黃色 */

	/* 購物車/訂單專用 */
	--color-cart-bg: #4d4d4d; /* 購物車背景 - 中灰色 */
	--color-order-bg: #ECECFB; /* 訂單背景 - 極淺藍色 */
}