/* ============================================================
   無障礙補強樣式(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;
}


/* 上方功能區塊定位點(#U):改為絕對定位、不佔排版空間(2026-08-14 第九輪)
   原本 inline-block 排在兩個浮動欄位之前,會在頂列多出一行、把整個
   header 撐高——改為覆疊在頂列(桌機高 36px)正中,視覺位置與原先
   相同,但回復加入定位點前的單行緊湊高度。 */
@media (min-width: 768px) {
    .top_nav > .container {
        position: relative;
    }

    .top_nav > .container > .a11y-anchor {
        position: absolute;
        left: 50%;
        top: 50%;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        margin: 0;
        line-height: 1;
        z-index: 5;
    }
}
/* 手機版(<768px)維持原本文流位置:固定選單品牌列(logo、
   選單鈕、右上語言選單)沒有可覆疊的空檔——右側 50px 內是
   浮動置右的 navbar-toggle,絕對定位會疊在其上(沙箱實測)。 */

/* 中央內容區塊定位點所在列:位於 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;
}

/* ------------------------------------------------------------
   2-1. 跳到主要內容(skip link,2026-08-14 第九輪)
        整頁第一個 Tab 停留點:平時整塊藏在畫面上緣外(仍在 Tab
        順序中),鍵盤聚焦時自左上角降下,Enter 後跳至中央內容
        區塊定位點 #C——功能等同快速鍵 Alt+C。
        仿數位部無障礙網路空間服務網的呈現方式。
   ------------------------------------------------------------ */
a.a11y-skip {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2000; /* 高於 navbar(1030)與手機語言選單(1031) */
    display: inline-block;
    padding: 14px 22px;
    background-color: #ffcf00; /* 全站主視覺黃,黑字對比 12.7:1 */
    color: #333333;
    font-size: 16px;
    font-weight: bold;
    line-height: 1;
    text-decoration: none;
    border-radius: 0 0 8px 0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
    -webkit-transform: translateY(-130%);
    transform: translateY(-130%);
}

a.a11y-skip:focus,
a.a11y-skip:focus-visible {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    color: #333333;
    text-decoration: underline;
}

/* ------------------------------------------------------------
   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;
}

/* ------------------------------------------------------------
   4. 文字對比度修正(2026-08-14 第十輪,WCAG 1.4.3 AA ≥ 4.5:1)
      原則:保留原色相、只降明度;所有色值均以公式驗算過。
   ------------------------------------------------------------ */

/* 4-1 消息類別標籤(首頁/最新消息列表):白字不動,底色加深。
       原對比:橘 2.56、綠 2.17、藍綠 2.09、金 1.73、紅 3.96;
       藍 nstg_7th(#0275d8)原本即 4.63 合規,不調整。
       緞帶三角(:before/:after)同步換色。 */
.newst_tag.nstg_2nd { background-color: #c15300; } /* 橘 4.66:1 */
.newst_tag.nstg_2nd:before { border-color: #c15300 transparent transparent transparent; }
.newst_tag.nstg_2nd:after { border-color: transparent transparent transparent #c15300; }

.newst_tag.nstg_3rd { background-color: #42822c; } /* 綠 4.71:1 */
.newst_tag.nstg_3rd:before { border-color: #42822c transparent transparent transparent; }
.newst_tag.nstg_3rd:after { border-color: transparent transparent transparent #42822c; }

.newst_tag.nstg_4th { background-color: #1e8083; } /* 藍綠 4.70:1 */
.newst_tag.nstg_4th:before { border-color: #1e8083 transparent transparent transparent; }
.newst_tag.nstg_4th:after { border-color: transparent transparent transparent #1e8083; }

.newst_tag.nstg_5th { background-color: #986d00; } /* 金 4.64:1 */
.newst_tag.nstg_5th:before { border-color: #986d00 transparent transparent transparent; }
.newst_tag.nstg_5th:after { border-color: transparent transparent transparent #986d00; }

.newst_tag.nstg_6th { background-color: #d0322d; } /* 紅 5.03:1 */
.newst_tag.nstg_6th:before { border-color: #d0322d transparent transparent transparent; }
.newst_tag.nstg_6th:after { border-color: transparent transparent transparent #d0322d; }

/* 4-2 檔案下載連結(附件下載/檔案下載頁/講座附件/系友下載):
       原亮黃 #ffcf00 僅 1.48:1 → 深橘。
       注意:連結多位於 .basic_block 內,其背景是 #f9f9f9 不是白色
       (第十輪的 #c15300 對 #f9f9f9 只有 4.43,Chrome 實測 4.42),
       故以 #f9f9f9 為基準取 #b95000 = 4.74:1(對白底 4.99:1);
       hover/focus 再加深(對 #f9f9f9 6.76:1)。 */
a.underline { color: #b95000; }

a.underline:hover,
a.underline:focus { color: #933f00; } /* 7.11:1 */

/* footer 版權列為黃底黑字(8.53:1 合規),不受上面深橘影響 */
.f_copyright a.underline,
.f_copyright a.underline:hover,
.f_copyright a.underline:focus { color: #333333; }

/* 4-3 相簿卡片「N 張照片 ◆ 日期」:原 #999 對白底 2.85:1
       → 深藍 #17457c(9.64:1,同焦點框/內容區定位點用色);
       日期前的小方點同步換色。 */
.album_note { color: #17457c; }

.album_note .date:before { background-color: #17457c; }

/* 4-4 頁碼:目前頁原為黃底白字 1.48:1 → 黃底黑字 8.53:1 */
.pagination li.active a,
.pagination li.active a:hover,
.pagination li.active a:focus,
.pagination li.active a.active { color: #333333; }

/* 4-5 首頁「管院焦點」卡片(2026-08-14 第十一輪):
       標題原 #ff7d1b 對白卡底 2.56:1 → 與下載連結同色 #b95000(4.99:1);
       「公告日期」原 #999 為 2.85:1 → 深灰 #595959(7.00:1)。
       .crsl_basic .date 同時涵蓋同型輪播卡(講座等)的日期字。 */
.crsl_hn .title { color: #b95000; }

.crsl_basic .date { color: #595959; }