@charset "UTF-8";

/* --- Brand 主色系 --- */
.text-primary   { color: #00a0e9; } /* 主藍色 */
.text-secondary { color: #27548A; } /* 深藍 */
.text-accent    { color: #3A0519; } /* 深棕 / 酒紅 */
.text-info      { color: #0077cc; } /* 提示藍 */
.text-blue      { color: #007bff; } /* 亮藍 */

/* --- 功能性顏色 --- */
.text-success { color: #28a745; }  /* 成功 */
.text-danger  { color: #dc3545; }  /* 錯誤 */
.text-warning { color: #ffc107; }  /* 警告 */

/* --- 灰階色階 --- */
.text-gray-900 { color: #222222; }
.text-gray-800 { color: #333333; }
.text-gray-700 { color: #555555; }
.text-gray-600 { color: #666666; }
.text-gray-500 { color: #777777; }
.text-gray-400 { color: #999999; }
.text-gray-450 { color: #d0021b; }
.text-gray-300 { color: #cccccc; }
.text-gray-200 { color: #e0e0e0; }
.text-gray-100 { color: #f5f5f5; }

/* --- 文字顏色 --- */
.text-white {
  color: #FFF;
}
.text-black {
  color: #111;
}
.text-black:hover{
  color: #00a0e9;
}

.text-brown    { color: #7f181b; } 
.text-blackred { color: #B03060;}
.text-peach { color: #d9534f; }
.text-gray-blue { color: #94a3b8; }
.text-red { color: #e4002b; }
.text-blue-400 { color: #4a90e2; }
.text-blue-300 { color: #334155; }
.text-blue-600 { color: #64748b; }

.text-orange { color: #e67e22; }
.text-orange-100 { color: #f39c12; }

.text-green-300 { color: #335238; }




/* --- 背景顏色 --- */
.bg-primary   { background: #00a0e9; }
.bg-secondary { background: #27548A; }
.bg-accent    { background: #3A0519; }
.bg-info      { background: #0077cc; }
.bg-nav      { background: #4F94CD; }
.bg-sub      { background: #f5faff; }

.bg-success { background: #28a745; }
.bg-danger  { background: #dc3545; }
.bg-warning { background: #ffc107; }

.bg-gray-900 { background: #222222; }
.bg-gray-800 { background: #333333; }

.bg-gray-700 { background: #555555; }
.bg-gray-600 { background: #666666; }
.bg-gray-500 { background: #777777; }
.bg-gray-400 { background: #999999; }
.bg-gray-300 { background: #cccccc; }
.bg-gray-200 { background: #e0e0e0; }
.bg-gray-150 { background: #f7f7f7; }
.bg-gray-100 { background: #f5f5f5; }
.bg-gray-50 { background: #fdfdfd; }


.bg-gray { background: #EEEEEE; }
.bg-white { background: #FFF; }
.bg-white-800 { background: #f8fafc; }

.bg-black { background: #3d464d; }
.bg-pink { background: #fff9f9; }
.bg-pink-500 { background: #fff5f5; }
.bg-pink-300 {background: #fff1f3; }

.bg-blue-150 { background: #f8f9fa; }
.bg-blue-450 { background: #e6f7ff; }
.bg-blue-400 { background: #4a90e2; }

.bg-green-300 { background: #dbeede; }

.bg-blue-200 { background: #f0f9ff; }
.bg-yellow { background: #fff9e6; }
.bg-orange { background: #e67e22; }






/* --- 背景顏色透明 --- */
.bg-white-70 { background: rgba(255,255,255,0.7); }
.bg-white-80 { background: rgba(255,255,255,0.8); }
.bg-white-95 { background: rgba(255,255,255,0.95); }
.bg-white-98 { background: rgba(255,255,255,0.98); }
.bg-black-30 { background: rgba(0,0,0,0.3); }
.bg-black-50 { background: rgba(0,0,0,0.5); }
.bg-primary-80 { background: rgba(0,160,233,0.8); }


/* --- 邊框顏色 --- */
.border-primary   { border:1px solid #00a0e9; }
.border-secondary { border-color: #27548A; }
.border-accent    { border-color: #3A0519; }
.border-info      { border-color: #0077cc; }

.border-success { border-color: #28a745; }
.border-danger  { border-color: #dc3545; }
.border-warning { border-color: #ffc107; }

.border-gray-900 { border-color: #222222; }
.border-gray-700 { border-color: #555555; }
.border-gray-500 { border-color: #777777; }
.border-gray-300 { border-color: #cccccc; }

.border-gray-200 { border: 1px solid #CCC; }

.border-pink-200-dashed { border: 1px dashed #ffbaba;}


.border-top-gray-300 { border-top: 1px solid #AAA; }
.border-top-gray-200 { border-top: 1px solid #CCC; }
.border-top-gray-100 { border-top: 1px solid #EEE; }

.border-right-gray-300 { border-right: 1px solid #AAA; }
.border-right-gray-200 { border-right: 1px solid #CCC; }
.border-right-gray-100 { border-right: 1px solid #EEE; }
.border-right-white { border-right: 1px solid #FFF; }

.border-bottom-gray-100 { border-bottom: 1px solid #f7f7f7; }
.border-bottom-gray-200 { border-bottom: 1px solid #EEE; }
.border-bottom-gray-250 { border-bottom: 1px solid #e0e0e0; }
.border-bottom-gray-400 { border-bottom: 1px solid #DDD; }

.border-top-gray-200-dashed { border-top: 1px dashed #CCC; }
.border-bottom-gray-200-dotted { border-bottom: 1px dotted #CCC; }


/* --- 文字反白按鈕（常用組合） --- */
.btn-bg-primary {
  background: #00a0e9;
  color: #fff;
}
.btn-bg-primary:hover {
  background: #0ab4ff;
}

.btn-bg-secondary {
  background: #27548A;
  color: #FFF;
}

.btn-bg-secondary:hover {
  background: #32619f;
}