/* ============================================================
   無障礙補強樣式(2026-08 無障礙化階段新增)
   - 必須在 model.css / plugins.css / main.css 之後載入,
     以覆蓋既有的 outline: none / outline: 0 清除
   ============================================================ */

/* ------------------------------------------------------------
   1. 鍵盤焦點可見(WCAG 2.4.7 Focus Visible / 2.4.11 Focus Appearance)
      雙環外框:內層白邊 + 外層深藍環,任何背景(白底、深色 header、
      圖片)都能維持 3:1 以上對比。
      使用 :focus-visible:只在鍵盤操作時顯示,滑鼠點擊不出現。
   ------------------------------------------------------------ */
:focus-visible {
    outline: 2px solid #ffffff !important;
    outline-offset: 0 !important;
    box-shadow: 0 0 0 4px #17457c !important;
    border-radius: 2px;
    z-index: 3;
    position: relative;
    transition: none !important; /* 元素既有 transition:all 會讓外框淡入淡出,聚焦時停用 */
}

/* 舊瀏覽器(不支援 :focus-visible)退回 :focus */
@supports not selector(:focus-visible) {
    a:focus, button:focus, input:focus, select:focus, textarea:focus,
    [tabindex]:focus, iframe:focus {
        outline: 2px solid #ffffff !important;
        outline-offset: 0 !important;
        box-shadow: 0 0 0 4px #17457c !important;
    }
}

/* ------------------------------------------------------------
   1-1. 磁磚/卡片/輪播/側欄選單等「緊貼排列或容器會裁切」的情境
        改用內縮雙環(外圈 3px 深藍 + 內圈 2px 白,畫在元素內側),
        物理上不會被相鄰元素蓋住、也不會被 overflow:hidden 裁掉。
        涵蓋:首頁圖示選單(h_icmenu)、系所/中心連結卡(h_linkd、
        crsl_linkw、abouti_link_wrapper)、相簿與各式磁磚(grid_basic)、
        owl 輪播、左側選單(nav_side_solid)、右欄清單(sdb_simple),
        以及任何包 .img / .img_wrapper 圖塊的連結(:has 自動涵蓋)。
   ------------------------------------------------------------ */
.owl-carousel a:focus-visible,
.h_icmenu a:focus-visible,
.h_linkd a:focus-visible,
.crsl_linkw a:focus-visible,
.grid_basic a:focus-visible,
.abouti_link_wrapper a:focus-visible,
.nav_side_solid a:focus-visible,
.sdb_simple a:focus-visible,
a:has(.img):focus-visible,
a:has(.img_wrapper):focus-visible {
    /* 外框改由 ::after 偽元素繪製(見下),元素本身的 outline/shadow 取消:
       outline 與 inset shadow 畫在元素自身圖層,會被卡片內的預覽圖、
       白底內容區、半透明遮罩等子元素蓋掉(實機回報:上半被圖蓋、下半淡化) */
    outline: none !important;
    box-shadow: none !important;
    position: relative;
    z-index: 5 !important;
    transition: none !important;
}

/* 內縮雙環畫在 ::after:以 z-index 壓在卡片全部子元素之上,
   位置與原本的內縮框完全相同(邊緣 3px 深藍 + 內側 2px 白) */
.owl-carousel a:focus-visible::after,
.h_icmenu a:focus-visible::after,
.h_linkd a:focus-visible::after,
.crsl_linkw a:focus-visible::after,
.grid_basic a:focus-visible::after,
.abouti_link_wrapper a:focus-visible::after,
.nav_side_solid a:focus-visible::after,
.sdb_simple a:focus-visible::after,
a:has(.img):focus-visible::after,
a:has(.img_wrapper):focus-visible::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border: 3px solid #17457c;
    box-shadow: inset 0 0 0 2px #ffffff;
    z-index: 99;
    pointer-events: none;
}

/* 包圖塊的連結設為 block,讓焦點框住完整的可見範圍
   (排除 .item_inner:其既有 display:table 用於垂直置中,且已滿版定位) */
a:has(> .img):not(.item_inner),
a:has(> .img_wrapper):not(.item_inner) {
    display: block;
}

/* 首頁大輪播:.slider .item 以 padding-top 撐高度(內容高度為 0)、
   .img 絕對定位鋪滿——連結盒因此塌陷成一條線,焦點框畫不出來。
   讓連結絕對定位鋪滿整張輪播圖,::after 焦點框即可包住完整可見範圍
   (.img 為連結的子元素,改變定位基準後視覺不變) */
.slider .item {
    position: relative;
}

.slider .item > a {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: block;
}

/* ------------------------------------------------------------
   2. 無障礙定位點 :::(台灣網站無障礙規範慣例)
      永遠可見,顏色繼承所在區塊文字色以確保對比;
      scroll-margin 避免跳轉時被固定選單遮住。
   ------------------------------------------------------------ */
.a11y-anchor {
    display: inline-block;
    color: inherit;
    font-size: 14px; /* 固定尺寸的裝飾性符號,非閱讀內容 */
    font-weight: bold;
    letter-spacing: 2px;
    text-decoration: none;
    opacity: 0.9;
    scroll-margin-top: 140px; /* 固定 navbar 高度緩衝 */
}

.a11y-anchor:hover,
.a11y-anchor:focus,
.a11y-anchor:active {
    color: inherit;
    text-decoration: none;
}

/* 中央內容區塊定位點所在列:位於 banner/輪播之後、主要內容之前的
   白底內容流中(2026-08-13 第四輪:自 header 下緣移入內容區,
   原位置會被固定選單蓋住)。顏色固定深藍,任何斷點皆可見。 */
.a11y-anchor-row {
    max-width: 1170px;
    margin: 0 auto;
    padding: 6px 15px 0;
    line-height: 1;
    position: relative;
    z-index: 3;
}

.a11y-anchor-row .a11y-anchor {
    color: #17457c;
}

/* ------------------------------------------------------------
   3. 網站導覽頁
   ------------------------------------------------------------ */
.sitemap_block h3 {
    margin-top: 28px;
}

.sitemap_block ul.accesskey_list,
.sitemap_block ul.browser_list {
    list-style: disc;
    padding-left: 24px;
    margin: 8px 0 16px;
}

.sitemap_block ol.sitemap_tree {
    padding-left: 24px;
    margin: 8px 0 16px;
}

.sitemap_block ol.sitemap_tree > li {
    margin: 6px 0;
}

.sitemap_block ol.sitemap_tree ol {
    list-style: none;
    padding-left: 20px;
    margin: 4px 0;
}

.sitemap_block .sitemap_tree a {
    text-decoration: underline;
}
