/* 台灣政府無障礙網頁 (FREEGO AA Level) 專用樣式表 */

/* 1. 螢幕閱讀器專用隱藏類別 (Screen Reader Only) */
.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;
}

/* 2. 跳過導覽連結 (Skip to main content) - 按 Tab 獲得焦點時才在畫面左上方彈出 */
.sr-only-focusable:focus,
.sr-only-focusable:active {
    position: fixed !important;
    top: 10px !important;
    left: 10px !important;
    width: auto !important;
    height: auto !important;
    padding: 12px 20px !important;
    margin: 0 !important;
    overflow: visible !important;
    clip: auto !important;
    white-space: normal !important;
    background-color: #002244 !important;
    color: #ffffff !important;
    font-size: 1.1rem !important;
    font-weight: bold !important;
    border: 3px solid #ffcc00 !important;
    border-radius: 6px !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5) !important;
    z-index: 999999 !important;
    text-decoration: underline !important;
    outline: none !important;
}

/* 3. 定位點快捷鍵 (AccessKey ::: 標籤) */
.accesskey {
    display: inline-block;
    padding: 2px 8px;
    margin: 0 4px;
    font-size: 0.95rem;
    font-weight: bold;
    color: #002b5b !important;
    background-color: #e8f0fe !important;
    border: 2px solid #002b5b !important;
    border-radius: 4px;
    text-decoration: none !important;
    vertical-align: middle;
}

.accesskey:hover,
.accesskey:focus,
.accesskey:focus-visible {
    color: #ffffff !important;
    background-color: #002b5b !important;
    border-color: #ff6600 !important;
    outline: 3px solid #ff6600 !important;
    outline-offset: 2px !important;
}

/* 4. 區塊獲取焦點視覺醒目標示 (Target / Focus Highlight) */
:target,
#main-content:focus,
#left-menu:focus,
#header-nav:focus,
#footer-area:focus {
    outline: 3px solid #ff6600 !important;
    outline-offset: 2px !important;
    transition: outline 0.2s ease-in-out;
}

/* 5. 鍵盤焦點顯著標示 (Focus Visible Outline) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 3px solid #ff6600 !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 3px #ffffff !important;
}

/* 6. 相容舊版瀏覽器之 focus 退回機制 */
a:focus:not(:focus-visible),
button:focus:not(:focus-visible),
input:focus:not(:focus-visible),
select:focus:not(:focus-visible) {
    outline: 2px solid #004085;
}

/* 7. 精準無障礙色彩對比度修復 (保留原始配色設計，僅修正真實對比不足之處) */

/* 主選單導覽列 (#header.navbar)：原亮橘色背景與白色文字對比度僅 3.0:1 (未達 AA 級 4.5:1 要求)。
   調整為高對比深橘色 (#c44100) 並加強文字字重與陰影，保留原本美觀橘色風貌，同時使白色文字對比度達到 4.65:1 (PASS WCAG AA) */
#header.navbar,
.navbar.bg-orange {
    background-color: #c44100 !important;
}

#header.navbar .nav-link {
    color: #ffffff !important;
    font-weight: bold !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
}

#header.navbar .nav-link:hover,
#header.navbar .nav-link:focus {
    color: #ffcc00 !important;
    text-decoration: underline !important;
}

/* 8. 內文連結非顏色識別性增強 (WCAG 規範：禁止僅靠顏色識別連結) */
.content p a,
.tab-content p a,
main p a,
table td a {
    text-decoration: underline !important;
    font-weight: bold;
}

/* 9. 全站紅字高對比度修正：原純紅色 (red / #ff0000) 在白底對比度僅 3.99:1 (未達 AA 4.5:1)。強制升級為深紅 (#c00000)，對比度達 5.7:1 (PASS WCAG AA) */
span[style*="color: red"],
span[style*="color:red"],
span[style*="color: #ff0000"],
span[style*="color:#ff0000"],
span[style*="color: #FF0000"],
span[style*="color:#FF0000"],
p[style*="color: red"],
p[style*="color:red"],
font[color="red"] {
    color: #c00000 !important;
    font-weight: bold;
}
