/* ====================
   品牌色系統 (Brand Color System)

   命名規則：--brand-{組別}-{色階}
   - 組別（1, 2, 3...）：品牌色編號，數量依專案需求增減
   - 色階（50~950）：深淺程度，數字越大越深

   範例：--brand-1-200 = 第 1 組品牌色的 200 色階
   ==================== */

:root {
  /* ==================== 品牌色 1（主色 #015596）==================== */
  --brand-1: #015596; /* 基本值 */
  --brand-1-hover: #014780; /* hover = 600 */
  --brand-1-active: #013a69; /* active = 700 */
  --brand-1-50: #f0f6fc;
  --brand-1-100: #ddeaf8;
  --brand-1-200: #bbd6f2;
  --brand-1-300: #8db9e9;
  --brand-1-400: #4f92d8;
  --brand-1-500: #015596; /* = --brand-1 */
  --brand-1-600: #014780;
  --brand-1-700: #013a69;
  --brand-1-800: #022f56;
  --brand-1-900: #022645;
  --brand-1-950: #011a30;

  /* ==================== 品牌色 2（第二色 #0070C0）==================== */
  --brand-2: #0070c0; /* 基本值 */
  --brand-2-hover: #005fa3; /* hover = 600 */
  --brand-2-active: #004e87; /* active = 700 */
  --brand-2-50: #f0f7ff;
  --brand-2-100: #ddeeff;
  --brand-2-200: #b8dcff;
  --brand-2-300: #85c5ff;
  --brand-2-400: #3da0f5;
  --brand-2-500: #0070c0; /* = --brand-2 */
  --brand-2-600: #005fa3;
  --brand-2-700: #004e87;
  --brand-2-800: #003f6e;
  --brand-2-900: #003259;
  --brand-2-950: #00223d;

  /* ==================== 品牌色 3（輔助色 #D5E18A）==================== */
  --brand-3: #D5E18A; /* 基本值 */
}