/* ============================================================
 * AA 無障礙共用樣式（2026-05-12）
 * 依「省水標章無障礙修正_0512.docx」AA 級人工檢測修正
 * ============================================================ */

/* ---- 視覺隱藏（保留語意供螢幕閱讀器使用） ---- */
.visually-hidden,
.sr-only {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* 焦點時顯示（跳過區塊連結 ::: 用） */
.visually-hidden-focusable:not(:focus):not(:focus-within),
.skip-link:not(:focus):not(:focus-within) {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* 跳過區塊連結（accesskey U/C/B/L）取得焦點時顯眼呈現 */
.key-U:focus,
.key-C:focus,
.key-B:focus,
.key-L:focus,
.skip-link:focus {
    position: fixed !important;
    top: 8px;
    left: 8px;
    z-index: 9999;
    width: auto !important;
    height: auto !important;
    padding: 8px 16px;
    margin: 0;
    overflow: visible;
    clip: auto;
    background: #00689c;
    color: #fff !important;
    font-size: 1.125em;
    text-decoration: underline;
    outline: 3px solid #ffeb3b;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4);
}

/* ---- 全域焦點指示（WCAG 2.4.7） ---- */
a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus,
[tabindex]:focus {
    outline: 3px solid #ffb300;
    outline-offset: 2px;
}

a:focus-visible,
button:focus-visible,
[tabindex]:focus-visible {
    outline: 3px solid #ffb300;
    outline-offset: 2px;
}

/* ---- 對比補強：「更多消息+」與底部選單 ---- */
.home_box_more a {
    background-color: #00689c !important;
    color: #fff !important;
}

.home_box_more a:hover,
.home_box_more a:focus {
    background-color: #005884 !important;
    color: #fff !important;
}

#footer_top {
    background-color: #00689c !important;
}

ul.footer_box li a {
    color: #fff !important;
}

ul.footer_box li a:hover,
ul.footer_box li a:focus {
    color: #ffeb3b !important;
    text-decoration: underline !important;
}

.sub_menu_box {
    background-color: #00689c !important;
}

/* ---- 漢堡選單 ---- */
button.toggle {
    background: transparent;
    border: 0;
    padding: 25px 10px 0 0;
    cursor: pointer;
    float: right;
}

button.toggle:focus {
    outline: 3px solid #ffb300;
}

/* 漢堡開啟時 body 加 class，避免背景捲動 */
body.nav-open {
    overflow: hidden;
}

/* ---- 輪播控制 ---- */
.jssor-pause-toggle {
    /* 掛在 #jssor_1 內部 bottom-left；輪播高度固定 300px，與下方長描述區塊不再重疊 */
    position: absolute;
    bottom: 12px;
    left: 12px;
    z-index: 50;
    background: rgba(0, 104, 156, 0.92);
    color: #fff;
    border: 0;
    border-radius: 4px;
    padding: 6px 12px;
    font-size: 0.875em;
    cursor: pointer;
    font-family: "微軟正黑體", Arial, sans-serif;
    line-height: 1;
}

.jssor-pause-toggle:hover,
.jssor-pause-toggle:focus {
    background: #005884;
    outline: 2px solid #ffb300;
}

/* 輪播箭頭可鍵盤聚焦 */
.jssora051[tabindex],
.jssorb051 [tabindex] {
    cursor: pointer;
}

.jssora051:focus {
    outline: 3px solid #ffb300;
    outline-offset: -3px;
}

/* ---- 「回到頂端」按鈕尺寸限制（WCAG 1.4.10） ---- */
#goTopButton {
    width: 55px !important;
    height: 55px !important;
    max-width: 55px !important;
    max-height: 55px !important;
    min-width: 44px;
    min-height: 44px;
}

#goTopButton img {
    width: 100%;
    height: 100%;
    max-width: 55px;
    max-height: 55px;
    object-fit: contain;
}

@media (max-width: 480px) {
    #goTopButton {
        width: 48px !important;
        height: 48px !important;
    }
}

/* ---- 圖片長描述（WCAG 1.1.1） ---- */
.img-longdesc {
    margin: 12px auto;
    max-width: 1140px;
    padding: 12px 16px;
    border-left: 4px solid #00689c;
    background: #f4f8fb;
    color: #333;
    font-size: 1em;
    line-height: 1.6;
}

.img-longdesc > summary {
    cursor: pointer;
    color: #00689c;
    font-weight: bold;
    padding: 4px 0;
}

.img-longdesc > summary:focus {
    outline: 3px solid #ffb300;
}

.img-longdesc[open] > summary {
    margin-bottom: 8px;
}

.img-longdesc p {
    margin: 0 0 6px 0;
}

/* ---- FAQ 摺疊按鈕（WCAG 4.1.2） ---- */
.faq-question-btn {
    display: block;
    width: 100%;
    text-align: left;
    background: transparent;
    border: 0;
    padding: 6px 0;
    font-size: 1em;
    font-weight: bold;
    color: #333;
    font-family: "微軟正黑體", Arial, sans-serif;
    cursor: pointer;
}

.faq-question-btn:hover,
.faq-question-btn:focus {
    color: #00689c;
    text-decoration: underline;
}

.faq-question-btn[aria-expanded="true"]::before {
    content: "▼ ";
    color: #00689c;
}

.faq-question-btn[aria-expanded="false"]::before {
    content: "▶ ";
    color: #999;
}

/* ---- 檔案連結補強提示 ---- */
.file-link-note {
    color: #555;
    font-size: 0.875em;
    margin-left: 6px;
}

/* ---- SiteMap 快捷鍵說明 ---- */
.sitemap-accesskey {
    margin: 20px 0;
    padding: 16px;
    background: #f4f8fb;
    border: 1px solid #c8d8e4;
    border-radius: 4px;
}

.sitemap-accesskey h3 {
    margin: 0 0 10px 0;
    color: #00689c;
    font-size: 1.125em;
}

.sitemap-accesskey dl {
    margin: 0;
}

.sitemap-accesskey dt {
    float: left;
    width: 110px;
    font-weight: bold;
    color: #333;
}

.sitemap-accesskey dd {
    margin-left: 110px;
    color: #555;
}