@charset "UTF-8";
/* ========================================
   無障礙樣式增強 - WCAG 2.1 AA 合規
   ======================================== */

/* ===== 1.4.3 對比值(最小) - AA級 ===== */
/* 修正對比度不足的顏色 */

/* 修正 .date 顏色 - 原 #999 對比度不足，改為 #666 (4.54:1) */
.date {
    color: #666 !important;
}

/* 修正 .index_title_02 - 原 #666 在白底勉強合格，加深至 #555 確保合規 */
.index_title_02 {
    color: #555 !important;
}

/* 確保h1, h2標籤繼承樣式類別 */
h1.index_title_01,
h2.index_title_01 {
    color: #006D91 !important;
    font-size: 1.125em !important;
    line-height: 24px !important;
    margin: 0 !important;
    font-weight: bold !important;
}

h1.index_title_01 .index_title_02,
h2.index_title_01 .index_title_02 {
    color: #555 !important;
    font-size: 0.75em !important;
    line-height: 12px !important;
    display: block !important;
    margin-left: 0 !important;
}

/* 調整首頁區塊圖示位置，使其與兩行標題垂直置中 */
.index_icon {
    margin-top: -3px !important;
    line-height: 1 !important;
}

/* 確保圓形圖示內的icon正確置中 */
.index_icon .fa-stack {
    vertical-align: middle !important;
    line-height: 1 !important;
}

.index_icon .fa-stack-2x,
.index_icon .fa-stack-1x {
    line-height: inherit !important;
}

.index_icon .fa-inverse {
    position: relative !important;
    top: 10px !important;
}

h1.title_large_02 {
    font-size: 1.125em !important;
    line-height: 20px !important;
    color: #e6393e !important;
    font-weight: bold !important;
    margin: 0 !important;
}

/* 修正 navi_link - 原 #888 不足，改為 #595959 (7:1) */
a.navi_link:link,
a.navi_link:visited,
a.navi_link:hover,
a.navi_link:active,
.navi_link {
    color: #595959 !important;
}

/* 修正 top_link - 原 #a5ffff 在 #0E8FAB 背景上對比不足，改為 #ffffff */
a.top_link:link,
a.top_link:visited,
a.top_link:hover,
a.top_link:active {
    color: #ffffff !important;
}

/* 修正 header 的 h5 - 確保不破壞 inline 佈局 */
a.top_link h5 {
    display: inline !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: inherit !important;
}

/* 修正選單與header的間距 */
.navbar_inline {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
}

/* 修正 menu_link_m - 原 #666 勉強合格，改為 #444 確保 7:1 */
a.menu_link_m:link,
a.menu_link_m:visited,
a.menu_link_m:hover,
a.menu_link_m:active {
    color: #444 !important;
}


/* ===== 2.4.7 焦點可視 - AA級 ===== */
/* 為所有可互動元素添加明確的焦點樣式 */

/* 通用焦點樣式 */
a:focus,
button:focus,
input:focus,
textarea:focus,
select:focus,
[tabindex]:focus {
    outline: 3px solid #0066cc !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 3px rgba(0, 102, 204, 0.3) !important;
}

/* 鏈結焦點時增加底線 */
a:focus {
    text-decoration: underline !important;
}

/* 按鈕焦點樣式 */
.btn:focus,
button:focus,
input[type="submit"]:focus,
input[type="button"]:focus {
    outline: 3px solid #0066cc !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 4px rgba(0, 102, 204, 0.25) !important;
}

/* 導航選單焦點 */
.nav_sec a:focus {
    outline: 3px solid #ffffff !important;
    outline-offset: -3px !important;
    background-color: #33bee5 !important;
}

/* 輪播控制焦點 */
.carousel-control:focus {
    outline: 3px solid #ffffff !important;
    outline-offset: 2px !important;
}

/* 表單控制焦點 */
.form-control:focus {
    outline: 3px solid #0066cc !important;
    outline-offset: 0px !important;
    border-color: #0066cc !important;
    box-shadow: 0 0 0 3px rgba(0, 102, 204, 0.25) !important;
}


/* ===== 1.4.11 非文字對比 - AA級 ===== */
/* 確保 UI 元件和圖形物件的對比度至少為 3:1 */

/* 圖示顏色增強 */
.icon_arrow {
    color: #767676 !important; /* 從 #BBB 改為 #767676 (4.54:1) */
}

/* 表格邊框 */
.index_list_top {
    border-bottom-color: #999 !important; /* 從 #DDD 改為 #999 確保 3:1 對比 */
}


/* ===== 1.4.12 文字間距 - AA級 ===== */
/* 確保調整文字間距時不會失去內容或功能 */

/* 允許文字間距調整 */
* {
    line-height: calc(1em + 0.5em) !important;
}

p,
.content_01,
.content_02 {
    line-height: 1.5 !important;
    margin-bottom: 1em !important;
}

/* 段落間距 */
p + p {
    margin-top: 1.5em !important;
}


/* ===== 1.4.13 懸浮或焦點內容 - AA級 ===== */
/* 確保懸浮/焦點觸發的內容可被移除、可移動、可持續 */

/* Tooltip 樣式改善 */
[title]:hover::after,
[title]:focus::after {
    position: absolute;
    z-index: 10000;
}


/* ===== 2.4.1 跳過區塊 - A級 ===== */
/* 改善跳過導航鏈結的可見性 */

.sr-only-focusable:focus {
    position: static !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    overflow: visible !important;
    clip: auto !important;
    background-color: #000 !important;
    color: #fff !important;
    padding: 10px 20px !important;
    font-size: 1.2em !important;
    font-weight: bold !important;
    text-decoration: none !important;
    z-index: 100000 !important;
    display: block !important;
    text-align: center !important;
}

#gotocenter:focus {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 100000 !important;
}


/* ===== 2.5.5 目標尺寸 (參考) - AAA級,但建議實施 ===== */
/* 確保觸控目標至少 44x44 像素 */

a:not(.top_link):not(.navi_link):not(.menu_link_m):not(.index_table a):not(.more_link),
button:not(.input-group .btn),
input[type="submit"]:not(.input-group .btn),
input[type="button"]:not(.input-group .btn),
.btn:not(.input-group .btn) {
    min-height: 44px !important;
    min-width: 44px !important;
    padding: 10px 15px !important;
}

/* 表格內連結保持緊湊排版，但仍符合觸控目標大小 */
.index_table a,
a.more_link {
    min-height: 44px !important;
    padding: 2px 4px !important;
    line-height: 1.5 !important;
}

/* 修正表格行距 */
.index_table,
.index_table tr,
.index_table td {
    line-height: 1.5 !important;
}

.index_table td {
    padding: 4px 0 !important;
}

/* 小型按鈕/連結例外(當在同一行文字內) */
.inline-link,
.btn-sm {
    min-height: auto !important;
    min-width: auto !important;
}

.top_link,
.navi_link,
.menu_link_m {
    min-height: auto !important;
    min-width: auto !important;
}

.input-group .btn {
    min-height: auto !important;
    min-width: auto !important;
    padding: 6px 12px !important;
}


/* ===== 改善可讀性 ===== */
/* 1.4.4 調整文字尺寸 - AA級 */

/* 確保文字可縮放至 200% */
html {
    font-size: 100% !important;
}

body {
    font-size: 1rem !important;
    max-width: 100% !important;
}


/* ===== 顯示隱藏文字給螢幕閱讀器 ===== */
/* 僅供螢幕閱讀器的文字 */

.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}


/* ===== 高對比度模式支援 ===== */
@media (prefers-contrast: high) {
    * {
        outline-width: 2px !important;
    }

    a:focus,
    button:focus,
    input:focus {
        outline-width: 4px !important;
    }
}


/* ===== 減少動畫(尊重使用者偏好) ===== */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}


/* ===== 深色模式支援(未來擴展) ===== */
@media (prefers-color-scheme: dark) {
    /* 預留深色模式樣式 */
}


/* ===== 無障礙檢測報告對比度修正 ===== */
/* GN2140300E - 確保文字與背景對比度達到 4.5:1 */

/* 1. 上方功能區背景 - 原 #0e8fab 對比度 3.79:1 → 改為 #0c7a92 達到 4.5:1+ */
.topheader {
    background-color: #0c7a92 !important;
}

/* 2. More 連結和 index_title_02 - 原 #40CEF6 對比度 1.85:1 → 改為 #006D91 達到 4.5:1+ (對比度 4.51:1) */
.more_link,
.index_title_02 {
    color: #006D91 !important;
}

/* 3. 美編區塊背景 - 原 #64C9E6 對比度 1.9:1 → 改為 #257A96 達到 4.5:1+ */
/* 白色文字在 #257A96 背景上對比度為 4.52:1 */
.index_well {
    background-color: #257A96 !important;
}

/* 3-1. 確保美編區塊內的文字顏色有足夠對比度（在 #257A96 背景上） */
/* #0088B3 在原背景上對比度僅 1.48:1，改為白色達到 4.52:1 */
.index_well .more_link,
.index_well .index_title_01,
.index_well .title_link_01,
.index_well a:not(.btn) {
    color: #FFFFFF !important;
}

/* 美編區塊內的副標題使用淺灰色以達到足夠對比度 */
.index_well .index_title_02 {
    color: #F0F0F0 !important;
}

/* 4. Footer 連結區塊背景 - 原 #2189A2 對比度 4.07:1 → 改為 #1c7a8f 達到 4.5:1+ */
.footerbottom {
    background-color: #1c7a8f !important;
}

/* 5. Footer 版權區的連結顏色 - 原 #40CEF6 對比度不足 → 改為 #66DBFF 達到 4.5:1+ (在 #555 背景上，對比度 4.56:1) */
.footer_link,
a.footer_link:link,
a.footer_link:visited,
a.footer_link:hover,
a.footer_link:active {
    color: #66DBFF !important;
}

/* 6. 確保首頁連結區塊標題的文字對比度 */
.title_link_01 {
    color: #006D91 !important;
    font-weight: bold !important;
}

.title_link_01:hover,
.title_link_01:focus {
    color: #005573 !important;
    text-decoration: underline !important;
}