@charset "utf-8";

/* ============================================================
   header / hero / sidebar 版型
   只在有大 banner 的頁面（body.at-hero-layout）生效
   ============================================================ */

:root {
    --at-vs-main: #136BA5;
    --at-vs-dark: #0E5C77;   /* hero 標題壓在照片上，用深一點的藍才讀得到 */
    --at-vs-text: #5a5a5a;
    --at-vs-line: #dbdbdb;
    --at-vs-sub: #6B6B6B;    /* 原 #828282 對白底只有 3.9，改深到 5.3（文字 ≥ 4.5） */
    --at-vs-shadow: 0 4px 30px rgba(0, 0, 0, .08);
    /* 內頁內容寬度佔滿版 85%，左右各留 7.5% */
    --at-vs-gutter: 7.5%;
    /* banner 底線的漸層兩端色 */
}

/* ------------------------------------------------------------
   hero（header 背景）
   ------------------------------------------------------------ */
/* 高度跟著 banner 圖的比例（2560 x 640 = 4:1），圖片才會完整呈現不被裁切
   overflow 開放，右側人物才能突出下緣 50px */
.at-hero-layout .at-page-big-banner {
    position: relative;
    width: 100%;
    height: 25vw;
    overflow: visible;
}

/* 跟首頁主視覺同一套處理：左側內縮 5%、左下角大圓弧。
   12vw 約等於 banner 高度（25vw）的 48%，跟首頁 330/720 的比例一致 */
.at-hero-layout .at-page-big-banner>img {
    display: block;
    width: 95%;
    height: 100%;
    max-height: none;
    margin-left: 5%;
    border-radius: 0 0 0 12vw;
    object-fit: cover;
    object-position: center;
}

/* 右側人物：踩過直線 20px，做出立體感 */
.at-hero-layout .at-page-big-banner::before {
    content: "";
    position: absolute;
    right: 9%;
    bottom: -20px;
    z-index: 3;
    width: 13.44vw;
    height: 15.26vw;
    background: url(../images/page/cta-person.png) no-repeat center bottom;
    background-size: contain;
}

/* 沒有套用 hero 版型的頁面（例如英文版）不顯示 banner 上的文字 */
.at-hero-text {
    display: none;
}

/* banner 上的單元名稱：英文在上、中文在下，灰字
   垂直置中的範圍是「主選單膠囊下緣 ~ banner 下緣」，不是整個 banner。
   膠囊下緣在畫面 90px 處，banner 從 29px 開始，所以相對 banner 是 61px，
   再留一點空隙取 70px */
.at-hero-layout .at-hero-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: absolute;
    left: 5%;
    right: 0;
    top: var(--at-vs-hero-text-top, 70px);
    bottom: 0;
    transform: none;
    z-index: 3;
    text-align: center;
    color: var(--at-vs-text);
    /* 外緣先描 1px 白邊（八方向硬陰影），再往外暈開，壓在任何 banner 圖上都讀得到 */
    text-shadow:
        -1px -1px 0 #FFF,
        1px -1px 0 #FFF,
        -1px 1px 0 #FFF,
        1px 1px 0 #FFF,
        0 -1px 0 #FFF,
        0 1px 0 #FFF,
        -1px 0 0 #FFF,
        1px 0 0 #FFF,
        0 0 4px #FFF,
        0 0 4px #FFF,
        0 0 8px #FFF,
        0 0 12px rgba(255, 255, 255, .9);
}

.at-hero-title-en {
    font-size: 2.25rem;
    font-weight: 700;
    letter-spacing: .1em;
    line-height: 1.1;
    margin: 0 0 6px 0;
}

/* 特殊醫療各單位（教學研究室等）沒有英文副標，
   單位名稱放大到跟下方頁面標題 .at-title-area h2 一樣（1.6rem）。
   選擇器比手機版的 .at-hero-title 縮字規則具體，各尺寸都維持同大小 */
.at-hero-layout .at-hero-text--unit .at-hero-title {
    font-size: 1.6rem;
}

.at-hero-title {
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: .18em;
    line-height: 1.4;
    margin: 0;
    /* letter-spacing 會在最後一字右邊多留空隙，補回來才置中 */
    text-indent: .18em;
}

@media (max-width: 991px) {
    .at-hero-layout .at-page-big-banner {
        height: 125px;
        min-height: 0;
    }

    .at-hero-layout .at-page-big-banner>img {
        width: 100%;
        margin-left: 0;
        border-radius: 0 0 0 60px;
    }

    /* 手機版空間不夠，不放人物 */
    .at-hero-layout .at-page-big-banner::before {
        content: none;
    }

    /* 手機版文字上下左右都置中 */
    .at-hero-layout .at-hero-text {
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        align-items: center;
        transform: none;
    }


    .at-hero-title-en {
        font-size: 1.25rem;
        margin: 0 0 2px 0;
    }

    .at-hero-title {
        font-size: .8125rem;
    }
}

/* ------------------------------------------------------------
   header：logo 白色圓角卡片 + 右上浮動膠囊選單
   ------------------------------------------------------------ */
@media (min-width: 992px) {

    .at-hero-layout header {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        z-index: 30;
    }

    /* 無障礙工具列（:::、字級、English…）保留在最上方
       半透明白 + 背景模糊（毛玻璃），banner 會透出來；下緣加陰影做出浮起來的層次 */
    .at-hero-layout .at-topest-area {
        /* 白底再透一點，讓 banner 透出來；模糊加重，文字仍讀得清楚
           （文字是黑色，底圖再暗，疊上 35% 白之後對比仍有 5.6 以上） */
        background: rgba(255, 255, 255, .35);
        -webkit-backdrop-filter: blur(16px) saturate(150%);
        backdrop-filter: blur(16px) saturate(150%);
        border-bottom: 1px solid rgba(255, 255, 255, .4);
        box-shadow: 0 2px 12px rgba(0, 0, 0, .06);
        padding: 0;
    }

    .at-hero-layout .at-top-sun-menu {
        background: transparent;
    }

    .at-hero-layout .at-top-sun-menu ul li a,
    .at-hero-layout .at-top-sun-menu ul li::before {
        color: #000;
    }

    .at-hero-layout .at-topest-area ul {
        max-width: 1600px;
        padding: 3px 30px;
        line-height: 1.2;
    }

    /* logo 的定位基準交給整個 <header>，才能貼到畫面左上角
       （原本掛在 .at-top-logo 上，起點會被上方的 .at-topest-area 推下來） */
    .at-hero-layout header {
        position: relative;
    }

    .at-hero-layout .at-top-logo {
        position: static;
        background: transparent;
        padding: 0;
        height: 0;
    }

    .at-hero-layout .at-top-logo .container {
        max-width: none;
        padding: 0;
    }

    .at-hero-layout .at-top-logo .row {
        margin: 0;
    }

    /* 中間這幾層都不能是定位基準，否則會被 bootstrap 欄位寬度影響 */
    .at-hero-layout .at-top-logo .container,
    .at-hero-layout .at-top-logo .row,
    .at-hero-layout .at-top-logo .col-lg-4 {
        position: static;
    }

    .at-hero-layout .at-top-logo .col-lg-4 {
        padding: 0;
    }

    /* logo：直接放原本的透明 png，不加外框，貼齊畫面左上角 */
    .at-hero-layout .logo {
        top: 10px;
        left: 30px;
        width: 300px;
        height: 85px;
        background-position: left center;
        z-index: 41;
    }

    /* 主選單膠囊 */
    .at-hero-layout .at-main-menu-area {
        position: fixed;
        top: 38px;
        right: 30px;
        margin-top: 0;
        z-index: 40;
        width: auto;
    }

    .at-hero-layout .at-main-menu {
        padding: 0;
    }

    .at-hero-layout .at-main-menu-ul {
        display: flex;
        justify-content: flex-start;
        align-items: stretch;
        width: auto;
        margin: 0;
        padding: 0 26px;
        background: #FFF;
        border-radius: 100px;
        box-shadow: var(--at-vs-shadow);
    }

    .at-hero-layout .at-main-menu-ul>li {
        height: 52px;
        position: relative;
    }

    /* 下拉改成掛在各自的項目底下，白色三角形才對得準 */
    .at-hero-layout .at-main-menu-ul>li.at-mega-menu-item {
        position: relative;
    }

    /* 選單與下拉之間的白色三角形 */
    .at-hero-layout .at-main-menu-ul>li.dropdown::after {
        content: "";
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 15px 15px;
        border-color: transparent transparent #FFF;
        position: absolute;
        top: 48px;
        left: 50%;
        transform: translateX(-50%);
        z-index: 1001;
        opacity: 0;
        visibility: hidden;
        transition: .3s cubic-bezier(.215, .61, .355, 1);
    }

    .at-hero-layout .at-main-menu-ul>li.dropdown:hover::after,
    .at-hero-layout .at-main-menu-ul>li.dropdown.show::after,
    .at-hero-layout .at-main-menu-ul>li.dropdown:focus-within::after {
        opacity: 1;
        visibility: visible;
    }

    .at-hero-layout .at-main-menu-ul>li>a {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 100%;
        padding: 0 14px;
        font-size: 1rem;
        font-weight: 600;
        color: var(--at-vs-text);
        letter-spacing: .06em;
        border-radius: 0;
    }

    .at-hero-layout .at-main-menu-ul>li>a:hover,
    .at-hero-layout .at-main-menu-ul>li>a:focus,
    .at-hero-layout .at-main-menu-ul>li.show>a {
        background: transparent;
        color: var(--at-vs-main);
        /* 滑過、聚焦時加底線：不只靠顏色表示，鍵盤與色弱使用者也分得出來 */
        text-decoration: underline;
        text-underline-offset: 4px;
    }

    /* 下拉 / mega menu */
    .at-hero-layout .at-mega-menu-content,
    .at-hero-layout .at-general-item .dropdown-menu {
        top: 62px;
        left: 50%;
        right: auto;
        transform: translateX(-50%);
        width: auto;
        min-width: 560px;
        padding: 22px 28px;
        border: none;
        border-radius: 10px;
        box-shadow: 0 0 40px rgba(0, 0, 0, .06);
    }

    /* 右側幾項改成靠右對齊，避免下拉超出畫面（三角形仍對準項目） */
    .at-hero-layout .at-main-menu-ul>li:nth-last-child(-n+4) .at-mega-menu-content,
    .at-hero-layout .at-main-menu-ul>li:nth-last-child(-n+4) .dropdown-menu {
        left: auto;
        right: 0;
        transform: none;
    }

    /* 三組以上的第二層要加寬；太寬時改對齊膠囊右緣，避免超出畫面
       （三角形掛在項目上，位置不受影響） */
    .at-hero-layout .at-main-menu-ul>li .at-mega-menu-content:has(.col-lg-4),
    .at-hero-layout .at-main-menu-ul>li .at-mega-menu-content:has(.col-lg-3) {
        position: fixed;
        top: 100px;
        right: 30px;
        left: auto;
        transform: none;
        min-width: 0;
        max-width: calc(100vw - 60px);
    }

    /* 三組 */
    .at-hero-layout .at-main-menu-ul>li .at-mega-menu-content:has(.col-lg-4) {
        width: 780px;
    }

    /* 四組 */
    .at-hero-layout .at-main-menu-ul>li .at-mega-menu-content:has(.col-lg-3) {
        width: 1000px;
    }

    /* 選單與下拉中間的空隙補上感應範圍，滑鼠移過去時不會閃掉 */
    .at-hero-layout .at-mega-menu-content::before,
    .at-hero-layout .at-general-item .dropdown-menu::before {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: -12px;
        height: 12px;
    }

    .at-hero-layout .at-general-item .dropdown-menu {
        min-width: 180px;
        padding: 14px 20px;
    }

    .at-hero-layout .at-mega-menu-content .container {
        max-width: none;
        padding: 0;
    }

    /* 第二層的分類標題，比照 sidebar 標題 */
    .at-hero-layout .at-main-menu-ul .dropdown-menu span {
        font-size: 1rem;
        font-weight: 600;
        line-height: 1.4;
        color: #333;
        padding: 0 0 14px 0;
        margin: 0 0 10px 0;
        border-bottom: 1px solid var(--at-vs-line);
    }

    /* 第二層的連結，比照 sidebar 的箭頭項目 */
    .at-hero-layout .at-general-item .dropdown-menu {
        text-align: left;
    }

    .at-hero-layout .at-mega-menu-content a,
    .at-hero-layout .at-general-item .dropdown-menu a {
        display: block;
        position: relative;
        margin-top: 0;
        /* 左邊留給箭頭；箭頭改成絕對定位，滑過的底線才不會畫到箭頭下面 */
        padding: 6px 0 6px 24px;
        font-size: 1.0rem;
        font-weight: 400;
        line-height: 1.8;
        letter-spacing: .04em;
        color: var(--at-vs-text);
    }

    .at-hero-layout .at-mega-menu-content a::before,
    .at-hero-layout .at-general-item .dropdown-menu a::before {
        content: "\f054";
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        font-size: 12px;
        display: inline-block;
        position: absolute;
        left: 0;
        top: 11px;
        margin: 0;
        color: #858585; /* 原 #b5b5b5 對白底 2.0，改深到 3.7（圖示 ≥ 3） */
        flex-shrink: 0;
        transition: transform .3s cubic-bezier(.215, .61, .355, 1);
    }

    .at-hero-layout .at-mega-menu-content a:hover,
    .at-hero-layout .at-mega-menu-content a:focus,
    .at-hero-layout .at-general-item .dropdown-menu a:hover,
    .at-hero-layout .at-general-item .dropdown-menu a:focus {
        color: var(--at-vs-main);
        text-decoration: underline;
        text-underline-offset: 4px;
    }

    .at-hero-layout .at-mega-menu-content a:hover::before,
    .at-hero-layout .at-mega-menu-content a:focus::before,
    .at-hero-layout .at-general-item .dropdown-menu a:hover::before,
    .at-hero-layout .at-general-item .dropdown-menu a:focus::before {
        color: var(--at-vs-main);
        transform: translateX(5px);
    }

    /* 熱門搜尋 + 搜尋框：本版型不顯示（蓋掉 bootstrap 的 .d-lg-block） */
    .at-hero-layout .at-search {
        display: none !important;
    }
}

@media (min-width: 992px) and (max-width: 1400px) {
    .at-hero-layout .logo {
        width: 280px;
        height: 104px;
        background-size: 226px auto;
    }

    .at-hero-layout .at-main-menu-ul {
        padding: 0 16px;
    }

    .at-hero-layout .at-main-menu-ul>li>a {
        padding: 0 9px;
    }

    .at-hero-layout .at-hero-text {
        /* 這個區間 logo 高度是 104px */
        top: 142px;
    }
}

/* ------------------------------------------------------------
   內容區：寬度對齊 hero 的標題與 logo
   ------------------------------------------------------------ */

/* 內頁底色純白（banner 下方的波浪填色也是白的，上下才接得起來） */
body.at-hero-layout {
    background: #FFF;
}

/* 中間區塊：跟左側 sidebar 一樣的白色圓角卡片 */
.at-hero-layout .at-page-main-content {
    background: #FFF;
    border-radius: 20px;
    box-shadow: 0 0 40px rgba(0, 0, 0, .06);
    padding: 40px;
}

/* sidebar 與內文距離上方麵包屑 30px */
.at-hero-layout .at-main-area>.row {
    margin-top: 30px;
}

@media (min-width: 992px) {
    .at-hero-layout .at-main-area.container {
        width: 85%;
        max-width: 85%;
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
        /* 讓出右上人物突出的 20px */
        padding-top: 20px;
    }
}

/* ------------------------------------------------------------
   sidebar：維持在左欄，改成白色圓角卡片
   選擇器限定在 .at-page-sidebar-column 內，避免影響單元頁的同名結構
   ------------------------------------------------------------ */
@media (min-width: 992px) {

    .at-hero-layout .at-page-sidebar-column .at-page-sidebar-area {
        background: #FFF;
        border-radius: 20px;
        box-shadow: 0 0 40px rgba(0, 0, 0, .06);
        padding: 40px 32px;
    }

    .at-hero-layout .at-page-sidebar-title {
        display: block;
        background: none;
        color: #333;
        font-size: 1.125rem;
        font-weight: 600;
        line-height: 1.4;
        padding: 0 0 24px 0;
        margin: 0 0 18px 0;
        border-bottom: 1px solid var(--at-vs-line);
    }

    .at-hero-layout .at-page-sidebar-title::before,
    .at-hero-layout .at-page-sidebar-title::after {
        content: none;
    }

    .at-hero-layout .at-page-sidebar-column .at-page-sidebar-area ul li,
    .at-hero-layout .at-page-sidebar-column .at-page-sidebar-area ul li:not(:last-child) {
        padding: 0;
        border-bottom: none;
    }

    .at-hero-layout .at-page-sidebar-column .at-page-sidebar-area ul li a {
        display: block;
        position: relative;
        padding: 6px 0 6px 24px;
        font-size: 1.0rem;
        font-weight: 400;
        line-height: 1.8;
        color: var(--at-vs-text);
    }

    .at-hero-layout .at-page-sidebar-column .at-page-sidebar-area ul li a::before {
        content: "\f054";
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        font-size: 12px;
        display: inline-block;
        position: absolute;
        left: 0;
        top: 11px;
        width: auto;
        height: auto;
        margin: 0;
        background: none;
        border-radius: 0;
        color: #858585; /* 原 #b5b5b5 對白底 2.0，改深到 3.7（圖示 ≥ 3） */
        flex-shrink: 0;
        transition: transform .3s cubic-bezier(.215, .61, .355, 1);
    }

    .at-hero-layout .at-page-sidebar-column .at-page-sidebar-area ul li a:hover,
    .at-hero-layout .at-page-sidebar-column .at-page-sidebar-area ul li a:focus {
        color: var(--at-vs-main);
        text-decoration: underline;
        text-underline-offset: 4px;
    }

    .at-hero-layout .at-page-sidebar-column .at-page-sidebar-area ul li a:hover::before,
    .at-hero-layout .at-page-sidebar-column .at-page-sidebar-area ul li a:focus::before {
        color: var(--at-vs-main);
        transform: translateX(5px);
    }

    /* 目前所在的科別（除了顏色再加粗體，當作非顏色提示） */
    .at-hero-layout .at-page-sidebar-column .at-page-sidebar-area ul li>a[aria-expanded="true"] {
        color: var(--at-vs-main);
        font-weight: 600;
        text-decoration: none;
    }

    .at-hero-layout .at-page-sidebar-column .at-page-sidebar-area ul li>a[aria-expanded="true"]::before {
        color: var(--at-vs-main);
        transform: translateX(5px);
    }

    /* 展開的子項目 */
    .at-hero-layout .at-page-sidebar-column .at-page-sidebar-area ul ul {
        padding: 8px 0 10px 32px;
    }

    .at-hero-layout .at-page-sidebar-column .at-page-sidebar-area ul ul li a {
        font-size: 1.0rem;
        line-height: 1.7;
        color: var(--at-vs-sub);
        /* 子項目沒有箭頭，不用留左邊的位置 */
        padding: 4px 0;
    }

    .at-hero-layout .at-page-sidebar-column .at-page-sidebar-area ul ul li a::before {
        content: none;
    }

    .at-hero-layout .at-page-sidebar-column .at-page-sidebar-area ul ul li a:hover,
    .at-hero-layout .at-page-sidebar-column .at-page-sidebar-area ul ul li a:focus {
        color: var(--at-vs-main);
        text-decoration: underline;
        text-underline-offset: 4px;
    }

    /* 目前所在的頁面 */
    .at-hero-layout .at-page-sidebar-column .at-page-sidebar-area ul li a[aria-current="page"] {
        color: var(--at-vs-main);
        font-weight: 600;
        text-decoration: none;
    }

    /* 右側收合箭頭隱藏（aria-expanded 仍在，輔具讀得到展開狀態） */
    .at-hero-layout .at-page-sidebar-column .at-page-sidebar .fa-angle-down,
    .at-hero-layout .at-page-sidebar-column .at-page-sidebar .fa-angle-up {
        display: none;
    }
}

/* ------------------------------------------------------------
   手機版 sidebar：拉到內容上方，改成可收合的選單
   這一段不限 .at-hero-layout，所有內頁（含英文版）共用
   ------------------------------------------------------------ */
@media (max-width: 991px) {

    .at-page-sidebar-column {
        order: -1;
        flex: 0 0 100%;
        max-width: 100%;
    }

    .at-page-sidebar-area {
        margin: 0 0 24px 0;
        padding: 0;
        background: none;
        border-radius: 0;
        box-shadow: none;
        overflow: visible;
    }

    /* 標題改成可點的收合列 */
    .at-page-sidebar-title {
        display: block;
        position: relative;
        margin: 0;
        padding: 12px 44px 12px 16px;
        background: none;
        border: 1px solid #dcdcdc;
        border-radius: 4px;
        color: #000;
        font-size: 1.05em;
        font-weight: bold;
        text-align: center;
        text-decoration: none;
    }

    .at-page-sidebar-title:hover,
    .at-page-sidebar-title:focus {
        color: #000;
        text-decoration: none;
    }

    /* 蓋掉桌機版標題的「/」與右側 logo 裝飾 */
    .at-page-sidebar-title::before {
        content: none;
    }

    .at-page-sidebar-title::after {
        content: "\f0d7";
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        width: auto;
        height: auto;
        margin: 0;
        float: none;
        background: none;
        color: #666;
        position: absolute;
        right: 16px;
        top: 50%;
        transform: translateY(-50%);
    }

    .at-page-sidebar-title[aria-expanded="true"] {
        border-radius: 4px 4px 0 0;
    }

    .at-page-sidebar-title[aria-expanded="true"]::after {
        content: "\f0d8";
    }

    /* 展開後的清單 */
    .at-page-sidebar-area .sidebar-area>ul {
        border: 1px solid #dcdcdc;
        border-top: none;
        border-radius: 0 0 4px 4px;
        padding: 0;
    }

    .at-page-sidebar-area .sidebar-area ul li,
    .at-page-sidebar-area .sidebar-area ul li:not(:last-child) {
        border-bottom: 1px solid #dcdcdc;
    }

    .at-page-sidebar-area .sidebar-area>ul>li:last-child {
        border-bottom: none;
    }

    /* 子項目不再切線 */
    .at-page-sidebar-area .sidebar-area ul ul li,
    .at-page-sidebar-area .sidebar-area ul ul li:not(:last-child) {
        border-bottom: none;
    }
}

/* ------------------------------------------------------------
   內容區右上角的回上頁按鈕
   ------------------------------------------------------------ */
/* 回上頁圓鈕：改跟語音、列印、分享同一套灰底白圖示（見下方「標題右側工具列」） */

/* ------------------------------------------------------------
   右側固定的分享／工具列
   ------------------------------------------------------------ */
.at-float-tools {
    position: fixed;
    right: 18px;
    top: 50%;
    /* 整條縮到 85%，以右緣為基準所以離視窗邊距不變 */
    transform: translateY(-50%) scale(.85);
    transform-origin: right center;
    z-index: 50;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* 上方的分享把手 */
.at-float-tools__toggle {
    position: relative;
    z-index: 2;
    width: 48px;
    height: 48px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: linear-gradient(180deg, #FFF 0%, #ededed 100%);
    color: #555;
    font-size: 1.05rem;
    box-shadow: 0 6px 14px rgba(0, 0, 0, .18), inset 0 1px 0 #FFF;
    transition: .2s cubic-bezier(.215, .61, .355, 1);
}

.at-float-tools__toggle:hover {
    color: var(--at-vs-main);
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, .22), inset 0 1px 0 #FFF;
}

/* 把手下方的小三角，連到清單 */
.at-float-tools__toggle::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -9px;
    transform: translateX(-50%);
    border-style: solid;
    border-width: 10px 9px 0 9px;
    border-color: #f6f6f6 transparent transparent transparent;
    filter: drop-shadow(0 2px 1px rgba(0, 0, 0, .06));
}

.at-float-tools__toggle[aria-expanded="false"]::after {
    display: none;
}

/* 工具清單 */
.at-float-tools__list {
    list-style: none;
    width: -moz-max-content;
    width: max-content;
    margin: -4px 0 0 0;
    /* 上方留白要容納把手的三角形 */
    padding: 25px 8px 14px;
    background: linear-gradient(180deg, #FFF 0%, #f4f4f4 100%);
    border-radius: 34px;
    box-shadow: 0 10px 28px rgba(0, 0, 0, .18), inset 0 1px 0 #FFF;
}

.at-float-tools__toggle[aria-expanded="false"]+.at-float-tools__list {
    display: none;
}

.at-float-tools__list>li {
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none;
}

.at-float-tools__list>li+li {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #e8e8e8;
}

.at-float-tools__list a,
.at-float-tools__list>li>button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    padding: 0;
    border: 1px solid #e4e4e4;
    border-radius: 50%;
    background: linear-gradient(180deg, #FFF 0%, #f2f2f2 100%);
    color: #333;
    font-size: .95rem;
    font-weight: bold;
    box-shadow: 0 2px 5px rgba(0, 0, 0, .12), inset 0 1px 0 #FFF;
    transition: .2s cubic-bezier(.215, .61, .355, 1);
}

.at-float-tools__list a:hover,
.at-float-tools__list a:focus,
.at-float-tools__list>li>button:hover,
.at-float-tools__list>li>button:focus {
    color: var(--at-vs-main);
    text-decoration: none;
    transform: translateY(-2px);
    box-shadow: 0 6px 12px rgba(0, 0, 0, .18), inset 0 1px 0 #FFF;
}

/* Aa 的字級選單，往左展開 */
.at-float-tools__font {
    position: relative;
}

.at-float-font-menu {
    display: none;
    position: absolute;
    right: calc(100% + 14px);
    top: 50%;
    transform: translateY(-50%);
    padding: 8px;
    background: linear-gradient(180deg, #FFF 0%, #f4f4f4 100%);
    border-radius: 30px;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .18), inset 0 1px 0 #FFF;
    white-space: nowrap;
}

#at_float_font_toggle[aria-expanded="true"]+.at-float-font-menu {
    display: block;
}

.at-float-font-menu::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -8px;
    transform: translateY(-50%);
    border-style: solid;
    border-width: 8px 0 8px 9px;
    border-color: transparent transparent transparent #f8f8f8;
}

.at-float-font-menu button {
    width: 38px;
    height: 38px;
    padding: 0;
    border: 1px solid #e4e4e4;
    border-radius: 50%;
    background: linear-gradient(180deg, #FFF 0%, #f2f2f2 100%);
    color: #333;
    font-weight: bold;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .1), inset 0 1px 0 #FFF;
    transition: .2s;
}

.at-float-font-menu button+button {
    margin-left: 6px;
}

.at-float-font-menu button:hover,
.at-float-font-menu button:focus {
    color: var(--at-vs-main);
}

.at-float-font-menu button[disabled] {
    background: var(--at-vs-main);
    border-color: var(--at-vs-main);
    color: #FFF;
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, .18);
}

@media (max-width: 991px) {
    .at-float-tools {
        right: 10px;
        /* 手機版按鈕本來就小，不再縮，維持可點擊面積 */
        transform: translateY(-50%);
    }

    .at-float-tools__toggle {
        width: 42px;
        height: 42px;
    }

    .at-float-tools__list {
        padding: 12px 7px;
    }

    .at-float-tools__list a,
    .at-float-tools__list>li>button {
        width: 36px;
        height: 36px;
        font-size: .85rem;
    }
}

@media print {
    .at-float-tools {
        display: none !important;
    }
}

/* ------------------------------------------------------------
   單元頁（unit_page / unit-special-page）：清單改成格子式
   直接改既有的巢狀 ul 結構，不需要動範本
   ------------------------------------------------------------ */
.at-unit-page-content .at-page-sidebar-area {
    padding: 0;
    background: none;
    overflow: visible;
}

.at-unit-page-content .at-page-sidebar {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
    margin: 0 -7.5px;
    border-radius: 0;
}

/* 每一組佔滿一列 */
.at-unit-page-content .at-page-sidebar>li {
    flex: 0 0 100%;
    max-width: 100%;
    padding: 0 7.5px;
    margin: 0 0 36px;
    border-bottom: none;
    list-style: none;
}

/* 沒有子項目的頂層連結，直接當成一格 */
.at-unit-page-content .at-page-sidebar>li.at-custom-links {
    flex: 0 0 25%;
    max-width: 25%;
    margin-bottom: 15px;
}

.at-unit-page-content .at-page-sidebar>li:last-child {
    margin-bottom: 0;
}

/* 組標題橫幅 */
.at-unit-page-content .at-collapse-button {
    display: block;
    padding: 15px 20px 17px;
    margin: 0 0 24px;
    background: var(--at-anchor-bg, #EBF6FA);
    color: var(--at-vs-dark);
    font-size: 1.1rem;
    font-weight: bold;
    line-height: 1.4;
    border-radius: 15px 0;
    transition: background .2s;
}

.at-unit-page-content .at-collapse-button:hover,
.at-unit-page-content .at-collapse-button:focus {
    background: #D8ECF4;
    color: var(--at-vs-dark);
    text-decoration: none;
}

.at-unit-page-content .at-collapse-button::before {
    content: none;
}

.at-unit-page-content .at-collapse-button i {
    display: none;
}

/* 格子容器 */
.at-unit-page-content .at-page-sidebar>li>ul.collapse.show {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
    margin: 0 -7.5px;
    border: none;
}

.at-unit-page-content .at-page-sidebar>li>ul>li {
    flex: 0 0 calc(25% - 15px);
    max-width: calc(25% - 15px);
    padding: 0;
    /* style.css 的 .at-page-main-content ul ul li 用了 margin-bottom:2px !important，只能同樣加權蓋掉 */
    margin: 0 7.5px 15px !important;
    border-bottom: none;
}

/* 卡片：白底 + 主色細框，滑過整格填滿主色 */
.at-unit-page-content .at-page-sidebar>li>ul>li>a,
.at-unit-page-content .at-page-sidebar>li.at-custom-links>a {
    display: flex;
    align-items: center;
    position: relative;
    min-height: 72px;
    padding: 12px 62px 12px 24px;
    background: #FFF;
    border: 1px solid var(--at-main);
    border-radius: 0;
    color: #333;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: .05em;
    line-height: 1.5;
    transition: background-color .3s ease, color .3s ease;
}

/* 箭頭：與全站一致的「線穿圓框」，用遮罩上色，所以會跟著文字顏色變 */
.at-unit-page-content .at-page-sidebar>li>ul>li>a::before,
.at-unit-page-content .at-page-sidebar>li.at-custom-links>a::before {
    content: "";
    display: block;
    width: 35.5px;
    height: 29px;
    background-color: currentColor;
    -webkit-mask: url(../images/arrow-line-circle.svg) no-repeat center / contain;
    mask: url(../images/arrow-line-circle.svg) no-repeat center / contain;
    position: absolute;
    left: auto;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    transition: transform .3s ease;
}

/* 滑過、聚焦：整格填滿主色、白字，箭頭跟著變白（白字對主色對比 5.72） */
.at-unit-page-content .at-page-sidebar>li>ul>li>a:hover,
.at-unit-page-content .at-page-sidebar>li>ul>li>a:focus,
.at-unit-page-content .at-page-sidebar>li.at-custom-links>a:hover,
.at-unit-page-content .at-page-sidebar>li.at-custom-links>a:focus {
    background: var(--at-main);
    color: #FFF;
    text-decoration: none;
}

.at-unit-page-content .at-page-sidebar>li>ul>li>a:hover::before,
.at-unit-page-content .at-page-sidebar>li.at-custom-links>a:hover::before,
.at-unit-page-content .at-page-sidebar>li>ul>li>a:focus::before,
.at-unit-page-content .at-page-sidebar>li.at-custom-links>a:focus::before {
    transform: translateY(-50%) translateX(3px);
}

@media (max-width: 1400px) {
    .at-unit-page-content .at-page-sidebar>li>ul>li {
        flex: 0 0 calc(33.3333% - 15px);
        max-width: calc(33.3333% - 15px);
    }

    .at-unit-page-content .at-page-sidebar>li.at-custom-links {
        flex: 0 0 33.3333%;
        max-width: 33.3333%;
    }
}

@media (max-width: 1200px) {
    .at-unit-page-content .at-page-sidebar>li>ul>li {
        flex: 0 0 calc(50% - 15px);
        max-width: calc(50% - 15px);
    }

    .at-unit-page-content .at-page-sidebar>li.at-custom-links {
        flex: 0 0 50%;
        max-width: 50%;
    }
}

@media (max-width: 767px) {

    .at-unit-page-content .at-page-sidebar>li>ul>li,
    .at-unit-page-content .at-page-sidebar>li.at-custom-links {
        flex: 0 0 calc(100% - 15px);
        max-width: calc(100% - 15px);
    }

    .at-unit-page-content .at-collapse-button {
        font-size: 1rem;
        padding: 12px 16px 14px;
        margin-bottom: 18px;
    }
}

/* ------------------------------------------------------------
   footer 資訊區
   背景圖是暫用的，換圖只要改下面 background 的 url
   ------------------------------------------------------------ */
.at-footer-main {
    position: relative;
    text-align: left;
}

.at-footer-main__inner {
    width: 85%;
    margin: 0 auto;
    padding: 40px 0 20px;
}

/* 每一列都是左右兩端對齊 */
.at-footer-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 24px;
}

.at-footer-row--top {
    align-items: center;
    margin: 0 0 18px;
}

.at-footer-logo img {
    display: block;
    width: 100%;
    max-width: 560px;
    height: auto;
}

.at-footer-text,
.at-footer-update {
    margin: 0 0 8px;
    padding: 0;
    font-size: 1rem;
    line-height: 1.9;
    color: #333;
}

.at-footer-update {
    flex: 0 0 auto;
    white-space: nowrap;
}

/* 右上標章 */
.at-footer-badges {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 10px;
}

.at-footer-badges img {
    display: block;
    height: 40px;
    width: auto;
}

/* 宣告連結 */
.at-footer-links {
    flex: 0 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    gap: 6px 0;
    margin: 0 0 8px;
    padding: 0;
    list-style: none;
}

.at-footer-links li {
    display: flex;
    align-items: center;
    padding: 0;
    margin: 0;
    list-style: none;
    font-size: 1rem;
}

.at-footer-links li:not(:last-child)::after {
    content: "/";
    margin: 0 14px;
    color: #c9ccd4;
}

.at-footer-links a {
    color: #333;
}

.at-footer-links a:hover {
    color: var(--at-main-dark);
}

@media (max-width: 991px) {
    .at-footer-main__inner {
        width: auto;
        padding: 32px 20px 28px;
    }

    .at-footer-row,
    .at-footer-row--top,
    .at-footer-row--bottom {
        display: block;
    }

    .at-footer-logo img {
        max-width: 100%;
    }

    .at-footer-badges {
        margin: 18px 0 0;
    }

    .at-footer-text,
    .at-footer-links li,
    .at-footer-update {
        font-size: .9375rem;
    }

    .at-footer-links {
        justify-content: flex-start;
        margin: 12px 0 0;
    }
}

/* 最底的深色列：左邊聲明、右邊版權 */
.at-footer-bottom {
    background: #4A4E53;
    color: #FFF;
    text-align: left;
}

.at-footer-bottom__inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    width: 85%;
    margin: 0 auto;
    padding: 12px 0;
}

.at-footer-bottom p {
    margin: 0;
    padding: 0;
    font-size: .9375rem;
    line-height: 1.7;
}

.at-footer-bottom__copy {
    flex: 0 0 auto;
    white-space: nowrap;
}

@media (max-width: 991px) {
    .at-footer-bottom__inner {
        display: block;
        width: auto;
        padding: 12px 20px;
        text-align: center;
    }

    .at-footer-bottom__copy {
        margin-top: 6px;
        white-space: normal;
    }
}

/* ------------------------------------------------------------
   fat footer（展開選單）：白底 + 漢堡圖示 + 下方分隔線
   ------------------------------------------------------------ */
.at-fat-footer-area--light {
    background: #FFF;
}

/* 圖示用 ::before，JS 的 .text() 換字時才不會把它洗掉 */
.at-fat-footer-area--light .at-fat-footer-title::before {
    content: "\f0c9";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 1.15em;
    margin-right: 10px;
    vertical-align: -2px;
    color: #333;
}

.at-fat-footer-area--light .at-fat-footer-title {
    color: #333;
    font-size: 1rem;
}

.at-fat-footer-area--light .at-fat-footer-title:hover {
    color: var(--at-main-dark);
    text-decoration: none;
}

/* 與下方資訊區之間的分隔線 */
/* ------------------------------------------------------------
   檔案清單裡的 sr-only 修正
   style.css 的 .at-news-related-file ul li span { position: relative }
   比 bootstrap 的 .sr-only 具體，會把隱藏文字改回 relative，
   clip 與 1px 寬高只對 absolute 有效，於是「另開新視窗開啟」又被畫出來。
   這裡把 sr-only 需要的定位與邊界補回來（手機版那條 display:block 也一併壓住）
   ------------------------------------------------------------ */
.at-news-related-file ul li .sr-only {
    display: inline;
    position: absolute;
    margin: -1px;
}

/* ------------------------------------------------------------
   外部連結圖示
   另開新視窗的連結，文字後面補一個外連圖示（Font Awesome 5 f35d）
   只加在文字連結上；圖片連結、浮動工具那種純圖示按鈕不加
   ------------------------------------------------------------ */
.at-sitemap a[target="_blank"]::after,
.at-page-main-content a[target="_blank"]::after,
.at-page-sidebar-column a[target="_blank"]::after,
.at-footer-main .at-footer-text a[target="_blank"]::after,
.at-footer-main .at-footer-links a[target="_blank"]::after,
.at-main-menu-ul .dropdown-menu a[target="_blank"]::after,
.at-top-sun-menu a[target="_blank"]::after,
.mobile-links-area a[target="_blank"]::after {
    content: "\f35d";
    display: inline-block;
    margin-left: .4em;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: .8em;
    font-style: normal;
    line-height: 1;
    text-decoration: none;
    vertical-align: baseline;
}

/* 連結內容是圖片時不加（例如 footer 的無障礙標章） */
.at-footer-main a[target="_blank"]:has(img)::after {
    content: none;
}

/* ------------------------------------------------------------
   fat footer 網站地圖
   以主選單第一層分類，直接列出第三層連結（跳過第二層）
   ------------------------------------------------------------ */
/* bootstrap 的 .container 固定 1140，比上方內容區窄；
   這裡改成跟 .at-main-area／.at-footer-main__inner 一樣的 85% */
.at-fat-footer-area>.container {
    width: 85%;
    max-width: 85%;
    padding-right: 0;
    padding-left: 0;
}

.at-sitemap {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 0 32px;
    padding: 10px 0 26px;
    /* <footer> 整體是 text-align:center，網站地圖要靠左 */
    text-align: left;
}

/* 各科介紹連結最多，佔兩格並在內部再分兩排 */
.at-sitemap__column--wide {
    grid-column: span 2;
}

.at-sitemap__group+.at-sitemap__group {
    margin-top: 34px;
}

/* 第一層標題：右側箭頭 + 細底線 */
.at-fat-footer-area a.at-sitemap__title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 0 14px;
    padding: 0 0 11px;
    border-bottom: 1px solid var(--at-main);
    color: var(--at-main);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.4;
}

.at-fat-footer-area a.at-sitemap__title:hover {
    color: var(--at-main-dark);
    border-bottom-color: var(--at-main-dark);
    text-decoration: none;
}

.at-sitemap__title .at-arrow {
    width: 29px;
    height: 24px;
    transition: transform .25s cubic-bezier(.215, .61, .355, 1);
}

.at-sitemap__title:hover .at-arrow {
    transform: translateX(4px);
}

.at-sitemap__list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.at-sitemap__list--2col {
    column-count: 2;
    column-gap: 40px;
}

#at-fat-footer .at-sitemap__list li {
    margin: 0;
    padding: 0;
    line-height: 1.6;
    /* 分欄時避免一個項目被拆到兩欄 */
    break-inside: avoid;
}

.at-fat-footer-area .at-sitemap__list a {
    display: block;
    padding: 6px 0;
    color: #444;
    font-size: .9375rem;
}

.at-fat-footer-area .at-sitemap__list a:hover {
    color: var(--at-main-dark);
}

@media (max-width: 991px) {
    .at-fat-footer-area>.container {
        width: auto;
        max-width: none;
        padding-right: 20px;
        padding-left: 20px;
    }

    .at-sitemap {
        grid-template-columns: 1fr 1fr;
        gap: 0 26px;
    }

    .at-sitemap__column--wide {
        grid-column: span 1;
    }

    .at-sitemap__list--2col {
        column-count: 1;
    }
}

@media (max-width: 575.98px) {
    .at-sitemap {
        grid-template-columns: 1fr;
    }

    .at-sitemap__group+.at-sitemap__group {
        margin-top: 26px;
    }
}

/* 分隔線移到「展開選單」上方：寬 95%、2px、置中 */
.at-fat-footer-area--light {
    position: relative;
}

.at-fat-footer-area--light::before {
    content: "";
    position: absolute;
    top: 0;
    left: 2.5%;
    width: 95%;
    height: 2px;
    background: #dcdcdc;
}

.at-fat-footer-area--light+.at-footer-main {
    border-top: 0;
}

/* ------------------------------------------------------------
   內文 h3 與本頁章節導覽
   ------------------------------------------------------------ */
:root {
    --at-h-ink: #1A1A1A;
    --at-h-bar: #136BA5;
    --at-h-arrow: #136BA5;
    --at-anchor-bg: #EBF6FA;
}

/* h3：左側斜切色塊 */
.at-page-main-content h3,
.at-team-area h3 {
    display: flex;
    align-items: flex-end;
    margin: 2.6rem 0 1.2rem;
    padding: 0;
    border-bottom: 0;
    color: var(--at-h-ink);
    /* 跟左側選單標題 .at-page-sidebar-title 同樣大小（18px） */
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1.3;
}

.at-page-main-content h3::before,
.at-team-area h3::before {
    content: "";
    flex: 0 0 auto;
    align-self: center;
    width: .7em;
    height: .7em;
    margin-right: .45em;
    background: var(--at-h-bar);
    clip-path: polygon(50% 0,
            61% 39%,
            100% 50%,
            61% 61%,
            50% 100%,
            39% 61%,
            0 50%,
            39% 39%);
}

.at-page-main-content h3[id] {
    scroll-margin-top: 24px;
}

.at-page-main-content h3[tabindex]:focus {
    outline-offset: 4px;
}

/* 本頁章節導覽：右下角斜切的色塊 */
.at-anchor-nav {
    --at-anchor-cut: 30px;
    margin: 0 0 34px;
    padding: 26px 34px;
    border-bottom: 0;
    background: var(--at-anchor-bg);
    clip-path: polygon(0 0,
            100% 0,
            100% calc(100% - var(--at-anchor-cut)),
            calc(100% - var(--at-anchor-cut)) 100%,
            0 100%);
}

.at-anchor-nav ul {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 14px 30px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.at-anchor-nav li {
    margin: 0;
    padding: 0;
}

.at-anchor-nav li::before,
.at-anchor-nav li::after {
    content: none;
}

.at-anchor-nav a {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: var(--at-h-ink);
    font-size: .98rem;
    font-weight: 700;
    line-height: 1.5;
    text-decoration: none;
}

.at-anchor-nav a::before {
    content: "\f063";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: .7em;
    flex: 0 0 auto;
    color: var(--at-h-arrow);
    transition: transform .18s;
}

.at-anchor-nav a:hover,
.at-anchor-nav a:focus {
    color: var(--at-main-dark);
    text-decoration: none;
}

.at-anchor-nav a:hover::before,
.at-anchor-nav a:focus::before {
    transform: translateY(2px);
}

@media (max-width: 575.98px) {
    .at-anchor-nav {
        --at-anchor-cut: 20px;
        padding: 20px 22px;
    }

    .at-anchor-nav ul {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .at-anchor-nav a {
        font-size: .92rem;
    }

    /* 小螢幕的側欄標題會縮到 1.05rem，h3 跟著一起縮才對得上 */
    .at-page-main-content h3,
    .at-team-area h3 {
        font-size: 1.05rem;
        margin: 2rem 0 1rem;
    }
}

/* ------------------------------------------------------------
   各科介紹：原本的頁籤改成一頁式區塊
   ------------------------------------------------------------ */
.at-depart-section {
    margin: 0 0 8px;
}

.at-depart-section:last-child {
    margin-bottom: 0;
}

/* 人員介紹的三欄照舊，只補上區塊之間的距離 */
.at-depart-section .row {
    margin-top: 8px;
}

/* ------------------------------------------------------------
   頁面標題的分隔線
   左端四角星 + 2px 橫線
   ------------------------------------------------------------ */
.at-title-area {
    border-bottom: 0;
    padding-bottom: 3px;
}

/* 原本的藍色短線不要 */
.at-title-area h2::after {
    content: none;
}

/* 左端的四角星 */
.at-title-area::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: -5px;
    width: 12px;
    height: 12px;
    background: var(--at-main);
    clip-path: polygon(50% 0,
            61% 39%,
            100% 50%,
            61% 61%,
            50% 100%,
            39% 61%,
            0 50%,
            39% 39%);
}

/* 2px 橫線，從星星右側開始 */
.at-title-area::after {
    content: "";
    position: absolute;
    left: 18px;
    right: 0;
    bottom: 0;
    height: 2px;
    background: var(--at-main);
}

/* ------------------------------------------------------------
   瀏覽人次／更新日期：上方加分隔線
   ------------------------------------------------------------ */
.at-update-info {
    margin-top: 44px;
    padding-top: 22px;
    border-top: 1px solid #e5e5e5;
}

/* 按鈕原本是相對 .at-update-info 絕對定位，補回新增的 padding */
.at-update-info .at-back-button-area {
    top: 27px;
}

@media (max-width: 991px) {
    .at-update-info {
        margin-top: 32px;
        padding-top: 18px;
    }
}

/* ------------------------------------------------------------
   頁首右上工具列：注音／淺深色切換／Aa 字級
   ------------------------------------------------------------ */
.at-top-sun-menu ul {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.at-top-sun-menu ul li {
    display: flex;
    align-items: center;
}

/* 圖示按鈕前面不要「|」分隔 */
.at-top-sun-menu ul li.at-util-tool::before {
    content: none !important;
}

.at-top-sun-menu ul li.at-util-tool {
    margin-left: 10px;
}

.at-top-sun-menu .at-notation-button {
    padding: 0;
    background: transparent;
    color: #000;
    font-size: .813em;
    line-height: inherit;
}

.at-top-sun-menu .at-notation-button:hover,
.at-top-sun-menu .at-notation-button[aria-pressed="true"] {
    color: var(--at-main-dark);
}

.at-top-sun-menu .at-util-icon-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    /* 上下負邊距：圓鈕不把工具列撐高（撐高會貼到下方主選單膠囊） */
    margin: -3.5px 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--at-main-dark);
    font-size: 1.1rem;
    line-height: 1;
    transition: background-color .18s ease, color .18s ease;
}

.at-top-sun-menu .at-util-icon-btn:hover,
.at-top-sun-menu .at-util-icon-btn:focus,
.at-top-sun-menu .at-util-icon-btn[aria-expanded="true"] {
    background: rgba(20, 134, 173, .12);
}

.at-util-aa {
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: .02em;
}

/* 主選單列是 position:fixed、z-index:40，工具列要疊在它上面，展開的字級選單才不會被蓋住 */
.at-topest-area {
    position: relative;
    z-index: 41;
}

.at-util-font {
    position: relative;
}

.at-util-menu {
    display: none;
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 1000;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 10px;
    border: 1px solid #DCE3E8;
    border-radius: 12px;
    background: #FFF;
    box-shadow: 0 8px 24px rgba(3, 58, 82, .16);
}

.at-util-menu.is-open {
    display: flex;
}

.at-top-sun-menu .at-util-menu .at-util-option {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #EEF4F7;
    color: #222;
    font-size: .95rem;
    font-weight: 700;
    line-height: 1;
    transition: background-color .18s ease, color .18s ease;
}

.at-top-sun-menu .at-util-menu .at-util-option:hover,
.at-top-sun-menu .at-util-menu .at-util-option:focus {
    background: #DCEBF1;
}

/* 目前字級：主色實心（原本的程式會把目前那顆設成 disabled） */
.at-top-sun-menu .at-util-menu .at-util-option[aria-pressed="true"],
.at-top-sun-menu .at-util-menu .at-util-option[disabled] {
    background: var(--at-main);
    color: #FFF;
}

/* 深色主題 */
html[data-theme="dark"] .at-hero-layout .at-topest-area {
    background: rgba(30, 41, 59, .7);
    border-bottom-color: rgba(255, 255, 255, .08);
}

html[data-theme="dark"] .at-hero-layout .at-top-sun-menu ul li a,
html[data-theme="dark"] .at-hero-layout .at-top-sun-menu ul li::before,
html[data-theme="dark"] .at-top-sun-menu .at-notation-button,
html[data-theme="dark"] .at-top-sun-menu .at-util-icon-btn {
    color: #FFF !important;
    background: transparent !important;
}

html[data-theme="dark"] .at-top-sun-menu .at-util-icon-btn:hover,
html[data-theme="dark"] .at-top-sun-menu .at-util-icon-btn[aria-expanded="true"] {
    background: rgba(255, 255, 255, .12) !important;
}

html[data-theme="dark"] .at-util-menu {
    border-color: rgba(255, 255, 255, .08);
    background: #1e293b;
}

html[data-theme="dark"] .at-top-sun-menu .at-util-menu .at-util-option {
    background: #334155 !important;
    color: #FFF !important;
}

html[data-theme="dark"] .at-top-sun-menu .at-util-menu .at-util-option[aria-pressed="true"],
html[data-theme="dark"] .at-top-sun-menu .at-util-menu .at-util-option[disabled] {
    background: var(--at-main) !important;
}

/* 深色主題：主選單膠囊、下拉三角形、logo */
html[data-theme="dark"] .at-hero-layout .at-main-menu-ul {
    background: #1e293b;
    box-shadow: 0 4px 18px rgba(0, 0, 0, .45);
}

html[data-theme="dark"] .at-hero-layout .at-main-menu-ul>li>a:hover,
html[data-theme="dark"] .at-hero-layout .at-main-menu-ul>li>a:focus,
html[data-theme="dark"] .at-hero-layout .at-main-menu-ul>li.show>a {
    color: #8FC9EC !important;
}

/* 三角形跟下拉選單同色（style.css 深色下拉底色為 #334155） */
html[data-theme="dark"] .at-hero-layout .at-main-menu-ul>li.dropdown::after {
    border-bottom-color: #334155;
}

/* logo 是深色字的透明圖，深色底上看不清楚：墊一塊白底圓角（做法同 813） */
html[data-theme="dark"] .logo {
    background-color: #FFF;
    background-size: 94% auto;
    background-position: center;
    border-radius: 10px;
}

html[data-theme="dark"] .at-fat-footer-area--light::before {
    background: rgba(255, 255, 255, .12);
}

/* 沒有 hero 的頁面（搜尋、404 等）上方工具列是主色藍底，工具按鈕改白色 */
body:not(.at-hero-layout) .at-top-sun-menu .at-notation-button,
body:not(.at-hero-layout) .at-top-sun-menu .at-util-icon-btn {
    color: #FFF;
}

body:not(.at-hero-layout) .at-top-sun-menu .at-util-icon-btn:hover,
body:not(.at-hero-layout) .at-top-sun-menu .at-util-icon-btn[aria-expanded="true"] {
    background: rgba(255, 255, 255, .18);
}

/* 深色主題：右側浮動工具維持白色按鈕，圖示不要被通用規則改成青綠色 */
html[data-theme="dark"] .at-float-tools__list a,
html[data-theme="dark"] .at-float-tools__list>li>button,
html[data-theme="dark"] .at-float-font-menu button:not([disabled]) {
    color: #333;
}

html[data-theme="dark"] .at-float-tools__list a:hover,
html[data-theme="dark"] .at-float-tools__list a:focus,
html[data-theme="dark"] .at-float-tools__list>li>button:hover,
html[data-theme="dark"] .at-float-font-menu button:not([disabled]):hover {
    color: var(--at-vs-main);
}


/* ------------------------------------------------------------
   頁首右上：放大鏡搜尋
   點放大鏡往下展開搜尋框、進階搜尋、熱門搜尋
   收起時用透明＋不可點（不用 display:none），快速鍵 Alt+S 才能跳進搜尋框
   ------------------------------------------------------------ */
.at-util-search {
    position: relative;
}

.at-util-search-panel {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    z-index: 1000;
    width: 460px;
    padding: 18px 20px 16px;
    border: 1px solid #DCE3E8;
    border-radius: 12px;
    background: #FFF;
    box-shadow: 0 8px 24px rgba(3, 58, 82, .16);
    opacity: 0;
    visibility: visible;
    pointer-events: none;
    transform: translateY(-6px);
    transition: opacity .18s ease, transform .18s ease;
}

.at-util-search-panel.is-open {
    opacity: 1;
    pointer-events: auto;
    transform: none;
}

.at-util-search-form {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
}

.at-util-search-form input[type="text"] {
    flex: 1 1 auto;
    min-width: 0;
    height: 40px;
    padding: 0 14px;
    border: 1px solid #C9D3DA;
    border-radius: 8px;
    color: #222;
    font-size: 1rem;
}

.at-util-search-form input[type="text"]:focus {
    border-color: var(--at-main);
}

.at-top-sun-menu .at-util-search-submit,
.at-top-sun-menu .at-util-search-advanced {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    height: 40px;
    padding: 0 16px;
    border: 0;
    border-radius: 8px;
    font-size: .9375rem;
    font-weight: 700;
    white-space: nowrap;
    text-decoration: none;
    transition: background-color .18s ease;
}

.at-top-sun-menu .at-util-search-submit {
    background: var(--at-main);
    color: #FFF;
}

.at-top-sun-menu .at-util-search-submit:hover {
    background: var(--at-main-dark);
}

.at-hero-layout .at-top-sun-menu ul li a.at-util-search-advanced,
.at-top-sun-menu .at-util-search-advanced {
    background: #EEF4F7;
    color: var(--at-main-dark);
    font-size: .9375rem;
}

.at-top-sun-menu .at-util-search-advanced:hover {
    background: #DCEBF1;
}

/* 進階搜尋是外連，但按鈕裡不放外連圖示 */
.at-top-sun-menu .at-util-search-advanced::after {
    content: none !important;
}

.at-util-search-hot {
    margin: 12px 0 0;
    color: #444;
    font-size: .9375rem;
    line-height: 1.6;
    text-align: left;
}

.at-hero-layout .at-top-sun-menu ul li .at-util-search-hot a,
.at-util-search-hot a {
    color: var(--at-main-dark);
    font-size: .9375rem;
    font-weight: 700;
}

.at-util-search-hot a:hover {
    text-decoration: underline;
}

@media (prefers-reduced-motion: reduce) {
    .at-util-search-panel {
        transition: none;
    }
}

/* 深色主題 */
html[data-theme="dark"] .at-util-search-panel {
    border-color: rgba(255, 255, 255, .08);
    background: #1e293b;
}

html[data-theme="dark"] .at-util-search-form input[type="text"] {
    border-color: rgba(255, 255, 255, .2);
    background: #0f172a;
    color: #e2e8f0;
}

html[data-theme="dark"] .at-util-search-hot,
html[data-theme="dark"] .at-util-search-hot span {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .at-hero-layout .at-top-sun-menu ul li .at-util-search-hot a,
html[data-theme="dark"] .at-util-search-hot a {
    color: #8FC9EC !important;
}

html[data-theme="dark"] .at-top-sun-menu a.at-util-search-advanced,
html[data-theme="dark"] .at-hero-layout .at-top-sun-menu ul li a.at-util-search-advanced {
    background: #334155 !important;
    color: #FFF !important;
}

html[data-theme="dark"] .at-top-sun-menu .at-util-search-submit {
    background: var(--at-main) !important;
    color: #FFF !important;
}

/* ------------------------------------------------------------
   網站導覽頁（/service/sitemap/）
   三欄版面：
   - 三欄，左右兩欄淺灰 #f6f8f9、中間白底，高度對齊
   - 標題：大的英文 + 小的中文加底線
   - 連結前面藍色 >，滑過加底線
   ------------------------------------------------------------ */
.at-page-main-content .at-map-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    margin: 24px 0 0;
}

.at-page-main-content .at-map-cell {
    display: flex;
    min-width: 0;
}

.at-page-main-content .at-map-list-item {
    flex: 1 1 auto;
    padding: 36px 32px 44px;
    background: #F6F8F9;
}

/* 中間那欄白底（每列的第 2 格） */
.at-page-main-content .at-map-cell:nth-child(3n+2) .at-map-list-item {
    background: #FFF;
}

.at-page-main-content h3.at-map-title {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 4px 10px;
    margin: 0 0 26px;
    padding: 0;
    background: none;
    color: var(--at-main-dark);
    text-align: left;
    line-height: 1.1;
}

.at-page-main-content h3.at-map-title::before {
    content: none;
}

.at-page-main-content .at-map-title__en {
    color: var(--at-main-dark);
    font-size: 1.75rem;
    font-weight: 700;
    letter-spacing: .01em;
    line-height: 1.1;
}

.at-page-main-content .at-map-title__zh {
    margin-bottom: 3px;
    padding: 0 2px 3px;
    border-bottom: 2px solid var(--at-main);
    color: var(--at-main-dark);
    font-size: .8125rem;
    font-weight: 700;
    letter-spacing: .08em;
    line-height: 1.4;
}

/* 第一層：分類名稱（本院公告、內科部…），當小標用 */
.at-page-main-content .at-map-list-item>ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.at-page-main-content .at-map-list-item>ul>li {
    margin: 0 0 18px;
    list-style: none;
}

.at-page-main-content .at-map-list-item>ul>li:last-child {
    margin-bottom: 0;
}

.at-page-main-content .at-map-list-item>ul>li>a {
    display: block;
    margin-bottom: 6px;
    color: #222;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.6;
    text-decoration: none;
}

.at-page-main-content .at-map-list-item>ul>li>a[href^="javascript"] {
    cursor: default;
}

/* 第二層：實際的頁面連結，前面藍色 > */
.at-page-main-content .at-map-list-item ul ul {
    margin: 0;
    padding: 0;
}

.at-page-main-content .at-map-list-item ul ul li {
    margin: 0 0 6px !important;
    padding: 0;
    line-height: 1.6;
    break-inside: avoid;
}

/* style.css 把內文的 li / a / span 都設成 line-height:2，這裡收緊 */
.at-page-main-content .at-map-list-item li,
.at-page-main-content .at-map-list-item a,
.at-page-main-content .at-map-list-item span {
    line-height: 1.6;
}

.at-page-main-content .at-map-list-item ul ul li::before {
    content: none;
}

/* 沒有子項目的第一層連結（自訂連結）也套同一個 > 樣式 */
.at-page-main-content .at-map-list-item ul ul a,
.at-page-main-content .at-map-list-item>ul>li.at-custom-links>a {
    display: inline-block;
    position: relative;
    padding-left: 14px;
    color: #555;
    font-size: .9375rem;
    font-weight: 400;
    line-height: 1.6;
    text-decoration: none;
}

.at-page-main-content .at-map-list-item ul ul a::before,
.at-page-main-content .at-map-list-item>ul>li.at-custom-links>a::before {
    content: "\f054";
    position: absolute;
    left: 0;
    top: .5em;
    color: var(--at-main);
    font-family: "Font Awesome 5 Free";
    font-size: .6rem;
    font-weight: 900;
    line-height: 1;
}

.at-page-main-content .at-map-list-item ul ul a:hover,
.at-page-main-content .at-map-list-item ul ul a:focus,
.at-page-main-content .at-map-list-item>ul>li.at-custom-links>a:hover {
    color: var(--at-main-dark);
    text-decoration: underline;
}

/* 各科介紹的科別名稱都很短，子項目多的分類分兩小欄，免得整列被拉得很長
   （特殊醫療的中心名稱較長，分欄會斷行，所以只套在各科介紹） */
.at-page-main-content .at-map-cell--split .at-map-list-item ul ul:has(> li:nth-child(7)) {
    column-count: 2;
    column-gap: 16px;
}

@media (max-width: 1199px) {
    .at-page-main-content .at-map-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .at-page-main-content .at-map-cell:nth-child(3n+2) .at-map-list-item {
        background: #F6F8F9;
    }

    /* 兩欄時改成棋盤格交錯 */
    .at-page-main-content .at-map-cell:nth-child(4n+2) .at-map-list-item,
    .at-page-main-content .at-map-cell:nth-child(4n+3) .at-map-list-item {
        background: #FFF;
    }
}

@media (max-width: 767px) {
    .at-page-main-content .at-map-grid {
        grid-template-columns: 1fr;
    }

    .at-page-main-content .at-map-list-item {
        padding: 26px 22px 32px;
    }

    .at-page-main-content .at-map-cell .at-map-list-item,
    .at-page-main-content .at-map-cell:nth-child(n) .at-map-list-item {
        background: #F6F8F9;
    }

    .at-page-main-content .at-map-cell:nth-child(even) .at-map-list-item {
        background: #FFF;
    }
}

/* 深色主題 */
html[data-theme="dark"] .at-page-main-content .at-map-cell:nth-child(n) .at-map-list-item {
    background: #1e293b;
}

html[data-theme="dark"] .at-page-main-content .at-map-cell:nth-child(3n+2) .at-map-list-item {
    background: #0f172a;
}

html[data-theme="dark"] .at-page-main-content .at-map-title__en,
html[data-theme="dark"] .at-page-main-content .at-map-title__zh {
    color: #8FC9EC !important;
}

html[data-theme="dark"] .at-page-main-content .at-map-list-item>ul>li>a {
    color: #FFF !important;
}

html[data-theme="dark"] .at-page-main-content .at-map-list-item ul ul a,
html[data-theme="dark"] .at-page-main-content .at-map-list-item>ul>li.at-custom-links>a {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .at-page-main-content .at-map-list-item ul ul a::before,
html[data-theme="dark"] .at-page-main-content .at-map-list-item>ul>li.at-custom-links>a::before {
    color: #8FC9EC;
}

@media (max-width: 1199px) {
    html[data-theme="dark"] .at-page-main-content .at-map-cell:nth-child(3n+2) .at-map-list-item {
        background: #1e293b;
    }

    html[data-theme="dark"] .at-page-main-content .at-map-cell:nth-child(4n+2) .at-map-list-item,
    html[data-theme="dark"] .at-page-main-content .at-map-cell:nth-child(4n+3) .at-map-list-item {
        background: #0f172a;
    }
}

@media (max-width: 767px) {
    html[data-theme="dark"] .at-page-main-content .at-map-cell:nth-child(n) .at-map-list-item {
        background: #1e293b;
    }

    html[data-theme="dark"] .at-page-main-content .at-map-cell:nth-child(even) .at-map-list-item {
        background: #0f172a;
    }
}

/* 英文版網站導覽：內容區比中文版窄（每欄約 255px），英文標題又比較長，
   標題字縮小、左右內距收窄，「Traffic Information」這類標題才排得進一行 */
.at-page-main-content .at-map-grid--en .at-map-list-item {
    padding-right: 24px;
    padding-left: 24px;
}

.at-page-main-content .at-map-grid--en .at-map-title__en {
    font-size: 1.25rem;
}

/* 英文標題長短不一，小字中文有的排在旁邊、有的被擠到下一行；英文版一律放在英文下方，六格才整齊 */
.at-page-main-content .at-map-grid--en h3.at-map-title {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
}

/* ============================================================
   手機版選單（991px 以下）
   - 選單按鈕在右上，四條細線；展開時上面兩條往右收掉、X 的兩條依序畫出來
   - 選單面板接在頁首下方、白底滿版，淡入；各項目依序淡入
   - 每一列下方細灰線，可展開的項目右邊是圓形 +／−
   - 展開後的子選單放在淺色圓角底塊裡
   頁首 64px，線 24px×2px 才看得清楚；子選單底色用本站的淺藍灰。
   ============================================================ */
@media (max-width: 991px) {

    /* ---------- 頁首：logo 靠左、選單按鈕靠右 ---------- */
    .at-top-logo {
        position: relative;
        height: 64px;
        background: #FFF;
        box-shadow: 0 6px 12px rgba(51, 51, 51, .04);
    }

    .at-top-logo .container,
    .at-top-logo .row,
    .at-top-logo .col-lg-4 {
        position: static;
    }

    .at-top-logo .logo {
        top: 10px;
        left: 16px;
        right: auto;
        width: 230px;
        max-width: calc(100% - 96px);
        height: 44px;
        background-position: left center;
    }

    /* ---------- 選單按鈕 ---------- */
    #at_mobile_menu_open.at-burger {
        position: absolute;
        top: 0;
        right: 0;
        left: auto;
        z-index: 10001;
        width: 64px;
        height: 64px;
        padding: 0;
        border: 0;
        background: transparent;
        color: #333;
        cursor: pointer;
    }

    .at-burger__line {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 20px;
        display: block;
        width: 24px;
        height: 2px;
        margin: auto;
        background: #333;
        transform-origin: left;
        transition: transform .3s ease;
    }

    /* 兩條橫線（第 2 條短一點）＋ 收起來的 X（第 3、4 條） */
    .at-burger__line:nth-child(1) {
        top: -12px;
        transition-delay: .55s;
    }

    .at-burger__line:nth-child(2) {
        bottom: -12px;
        transform: scaleX(.76);
        transition-delay: .45s;
    }

    /* X 的兩條都放在按鈕正中央、以中點旋轉，交叉點才會對齊 */
    .at-burger__line:nth-child(3) {
        transform: rotate(45deg) scaleX(0);
        transform-origin: center;
        transition-delay: .1s;
    }

    .at-burger__line:nth-child(4) {
        transform: rotate(-45deg) scaleX(0);
        transform-origin: center;
        transition-delay: 0s;
    }

    /* 展開：橫線往右收掉，X 依序畫出 */
    #at_mobile_menu_open[aria-expanded="true"] .at-burger__line:nth-child(1) {
        transform: scaleX(0);
        transform-origin: right;
        transition-delay: 0s;
    }

    #at_mobile_menu_open[aria-expanded="true"] .at-burger__line:nth-child(2) {
        transform: scaleX(0);
        transform-origin: right;
        transition-delay: .1s;
    }

    #at_mobile_menu_open[aria-expanded="true"] .at-burger__line:nth-child(3) {
        transform: rotate(45deg) scaleX(1);
        transition-delay: .45s;
    }

    #at_mobile_menu_open[aria-expanded="true"] .at-burger__line:nth-child(4) {
        transform: rotate(-45deg) scaleX(1);
        transition-delay: .55s;
    }

    /* 選單開著時，背後的頁面不捲動 */
    html.at-mnav-open,
    html.at-mnav-open body {
        overflow: hidden;
    }

    /* ---------- 選單面板 ---------- */
    #at_main_menu_area {
        position: fixed;
        top: var(--at-mnav-top, 64px);
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 10000;
        width: auto;
        height: auto;
        padding: 10px 25px 40px;
        background: #FFF;
        box-shadow: 0 6px 12px rgba(51, 51, 51, .04);
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity .4s ease, visibility 0s linear .4s;
    }

    #at_main_menu_area.in {
        left: 0;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transition: opacity .2s ease, visibility 0s;
    }

    /* 原本左上的關閉鈕不用了：右上按鈕展開後就是 X */
    #at_main_menu_area #at_mobile_menu_close {
        display: none !important;
    }

    #at_main_menu_area .at-main-menu {
        display: block;
        padding: 0;
    }

    /* 各區塊依序淡入 */
    #at_main_menu_area .at-mobile-search,
    #at_main_menu_area .at-main-menu-ul>li,
    #at_main_menu_area .at-mobile-font-size-area,
    #at_main_menu_area .mobile-links-area {
        opacity: 0;
        transform: translateY(8px);
        transition: opacity .4s ease, transform .4s ease;
    }

    #at_main_menu_area.in .at-mobile-search,
    #at_main_menu_area.in .at-main-menu-ul>li,
    #at_main_menu_area.in .at-mobile-font-size-area,
    #at_main_menu_area.in .mobile-links-area {
        opacity: 1;
        transform: none;
        transition-duration: .6s;
    }

    #at_main_menu_area.in .at-mobile-search { transition-delay: .25s; }
    #at_main_menu_area.in .at-main-menu-ul>li:nth-child(1) { transition-delay: .3s; }
    #at_main_menu_area.in .at-main-menu-ul>li:nth-child(2) { transition-delay: .35s; }
    #at_main_menu_area.in .at-main-menu-ul>li:nth-child(3) { transition-delay: .4s; }
    #at_main_menu_area.in .at-main-menu-ul>li:nth-child(4) { transition-delay: .45s; }
    #at_main_menu_area.in .at-main-menu-ul>li:nth-child(5) { transition-delay: .5s; }
    #at_main_menu_area.in .at-main-menu-ul>li:nth-child(6) { transition-delay: .55s; }
    #at_main_menu_area.in .at-main-menu-ul>li:nth-child(7) { transition-delay: .6s; }
    #at_main_menu_area.in .at-mobile-font-size-area { transition-delay: .65s; }
    #at_main_menu_area.in .mobile-links-area { transition-delay: .7s; }

    /* ---------- 搜尋 ---------- */
    #at_main_menu_area .at-mobile-search {
        margin: 8px 0 6px;
    }

    #at_main_menu_area .at-mobile-search form {
        display: flex;
        gap: 8px;
        margin: 0;
    }

    #at_main_menu_area .at-mobile-search input[type="text"] {
        flex: 1 1 auto;
        width: auto;
        min-width: 0;
        height: 44px;
        margin: 0;
        padding: 0 16px;
        border: 1px solid #DCE3E8;
        border-radius: 22px;
        background: #F5F8FA;
        font-size: 1rem;
    }

    #at_main_menu_area .at-mobile-search input[type="submit"] {
        flex: 0 0 auto;
        height: 44px;
        margin: 0;
        padding: 0 20px;
        border: 0;
        border-radius: 22px;
        background: var(--at-main);
        color: #FFF;
        font-weight: 700;
    }

    /* ---------- 第一層 ---------- */
    #at_main_menu_area .at-main-menu-ul {
        display: block;
        width: 100%;
        margin: 0;
        padding: 0;
        background: none;
        box-shadow: none;
        border-radius: 0;
    }

    #at_main_menu_area .at-main-menu-ul>li {
        position: relative;
        height: auto;
        margin: 0;
        border-bottom: 1px solid #E9E9E9;
        list-style: none;
    }

    #at_main_menu_area .at-main-menu-ul>li::after {
        content: none;
    }

    #at_main_menu_area .at-main-menu-ul>li>a {
        position: relative;
        display: block;
        height: auto;
        padding: 22px 48px 22px 0;
        background: transparent;
        color: #333;
        /* 主項目＝標題：跟左側選單標題 .at-page-sidebar-title 同樣用明體、18px */
        font-family: var(--at-heading-font);
        font-size: 1.125rem;
        font-weight: 700;
        letter-spacing: normal;
        line-height: 1.5;
        text-align: left;
        text-decoration: none;
    }

    /* 右邊的圓形 +／−（取代原本的 Font Awesome 箭頭） */
    #at_main_menu_area .at-main-menu-ul>li.dropdown>a::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 0;
        left: auto;
        width: 32px;
        height: 32px;
        margin: -16px 0 0;
        border: 0;
        border-radius: 50%;
        background:
            linear-gradient(#333, #333) center / 13px 1px no-repeat,
            linear-gradient(#333, #333) center / 1px 13px no-repeat,
            #EEF4F7;
        transition: background-size .3s;
        transform: none;
    }

    #at_main_menu_area .at-main-menu-ul>li.dropdown.is-open>a::after {
        background:
            linear-gradient(#333, #333) center / 13px 1px no-repeat,
            linear-gradient(#333, #333) center / 1px 0 no-repeat,
            #EEF4F7;
    }

    /* ---------- 展開後的子選單 ---------- */
    #at_main_menu_area .at-main-menu-ul>li>.dropdown-menu {
        display: none;
        position: static;
        float: none;
        width: auto;
        min-width: 0;
        max-width: none;
        margin: 0 0 20px;
        padding: 18px 5% 8px;
        /* 白底＋灰色外框（同手機單元選單：1px #DCDCDC、圓角 20px、左右內縮 5%） */
        border: 1px solid #DCDCDC;
        border-radius: 20px;
        background: #FFF;
        box-shadow: none;
        transform: none;
        opacity: 1;
        visibility: visible;
    }

    #at_main_menu_area .at-main-menu-ul>li.is-open>.dropdown-menu {
        display: block;
    }

    #at_main_menu_area .dropdown-menu .container,
    #at_main_menu_area .dropdown-menu .row {
        width: auto;
        max-width: none;
        margin: 0;
        padding: 0;
    }

    /* 外層 .container 是 flex，.row 會縮成文字寬度，分類小標下的線就不滿版 */
    #at_main_menu_area .dropdown-menu .row {
        display: block;
        width: 100%;
    }

    /* 分類（本院公告、內科部…）：小標，底下連結直接列出 */
    #at_main_menu_area .at-mobile-child-menu {
        max-width: none;
        margin: 0 0 12px;
        padding: 0;
        border: 0;
    }

    /* 分類小標下方一條細線（同電腦版大選單的分類標題） */
    #at_main_menu_area .at-mobile-child-menu>span {
        display: block;
        margin: 0 0 8px;
        padding: 0 0 10px;
        /* style.css 舊規則 .at-mobile-child-menu span { border-bottom: none !important } 要蓋過 */
        border-bottom: 1px solid #DBDBDB !important;
        color: var(--at-main-dark);
        /* 分類小標：明體 */
        font-family: var(--at-heading-font);
        font-size: 1rem;
        font-weight: 700;
        cursor: default;
    }

    #at_main_menu_area .at-mobile-child-menu>span::after {
        content: none;
    }

    #at_main_menu_area .at-mobile-child-menu>.collapse {
        display: block !important;
        height: auto !important;
    }

    #at_main_menu_area .dropdown-menu ul {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    #at_main_menu_area .dropdown-menu ul li {
        margin: 0;
        padding: 0;
        border: 0;
        list-style: none;
    }

    #at_main_menu_area .dropdown-menu ul li::before {
        content: none;
    }

    #at_main_menu_area .dropdown-menu ul a {
        display: block;
        padding: 7px 0;
        border: 0;
        background: transparent;
        color: #333;
        /* 子單元連結＝內文：黑體 16px，跟左側選單的連結一樣 */
        font-family: var(--at-body-font);
        font-size: 1rem;
        line-height: 1.5;
        text-decoration: none;
    }

    /* 連結前的 > 箭頭：跟電腦版主選單（大選單）同一個 Font Awesome chevron-right、12px、左邊留 24px
       顏色 #858585：電腦版的 #B5B5B5 在手機選單淺灰底上只有 1.9，改深一點到 3.4（圖示對比 ≥ 3） */
    #at_main_menu_area .dropdown-menu ul a {
        position: relative;
        padding-left: 24px;
    }

    #at_main_menu_area .dropdown-menu ul a::before {
        content: "\f054";
        position: absolute;
        top: 50%;
        left: 2px;
        margin-top: -.5em;
        color: #858585;
        font-family: "Font Awesome 5 Free";
        font-size: 12px;
        font-weight: 900;
        line-height: 1;
        text-decoration: none;
    }

    /* 箭頭不跟著文字加底線 */
    #at_main_menu_area .dropdown-menu ul a:hover::before,
    #at_main_menu_area .dropdown-menu ul a:focus::before {
        text-decoration: none;
    }

    #at_main_menu_area .dropdown-menu ul a:hover,
    #at_main_menu_area .dropdown-menu ul a:focus {
        color: var(--at-main-dark);
        text-decoration: underline;
    }

    /* ---------- 注音、淺色／深色主題、Aa 字級（與電腦版右上工具列相同的三個功能） ---------- */
    #at_main_menu_area .at-mobile-font-size-area {
        margin: 24px 0 0;
        text-align: left;
    }

    #at_main_menu_area .at-mtools {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    #at_main_menu_area .at-mtools > li {
        margin: 0;
        list-style: none;
    }

    #at_main_menu_area .at-mtools__font {
        display: flex;
        align-items: center;
        gap: 8px;
    }

    /* 按鈕：44px 高（手指好點），外框 #7D8FA3 對白底 3.3（無障礙元件邊界 ≥ 3） */
    #at_main_menu_area .at-mtools__btn,
    #at_main_menu_area .at-mtools__opt {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 44px;
        height: 44px;
        padding: 0 14px;
        border: 1px solid #7D8FA3;
        border-radius: 22px;
        background: #FFF;
        color: var(--at-main-dark);
        font-size: .9375rem;
        font-weight: 700;
        line-height: 1;
    }

    #at_main_menu_area .at-mtools__icon,
    #at_main_menu_area .at-mtools__opt {
        width: 44px;
        padding: 0;
    }

    #at_main_menu_area .at-mtools__icon .fas {
        font-size: 1.05rem;
    }

    /* 已開啟（注音、深色主題）、Aa 展開中、目前字級：主色底白字（5.72） */
    #at_main_menu_area .at-mtools__btn[aria-pressed="true"],
    #at_main_menu_area .at-mtools__btn[aria-expanded="true"],
    #at_main_menu_area .at-mtools__opt[aria-pressed="true"],
    #at_main_menu_area .at-mtools__opt[disabled] {
        border-color: var(--at-main);
        background: var(--at-main);
        color: #FFF;
        opacity: 1;
    }

    /* Aa 收起時 小／中／大 整個不顯示（也不會被 Tab 到） */
    #at_main_menu_area .at-mtools__menu {
        display: none;
        gap: 8px;
    }

    #at_main_menu_area .at-mtools__menu.is-open {
        display: flex;
    }

    /* ---------- 網站導覽、English、中英詞彙：膠囊按鈕 ---------- */
    #at_main_menu_area .mobile-links-area {
        margin: 24px 0 0;
    }

    #at_main_menu_area .at-mobile-links {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 8px;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    #at_main_menu_area .at-mobile-links li {
        margin: 0;
        list-style: none;
    }

    #at_main_menu_area .at-mobile-links a {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 46px;
        padding: 0 6px;
        border: 2px solid var(--at-main);
        border-radius: 50px;
        background: var(--at-main);
        color: #FFF;
        font-size: .875rem;
        font-weight: 700;
        text-decoration: none;
        white-space: nowrap;
        transition: background-color .3s ease;
    }

    #at_main_menu_area .at-mobile-links a:hover,
    #at_main_menu_area .at-mobile-links a:focus {
        background: var(--at-main-dark);
        border-color: var(--at-main-dark);
    }

    /* ---------- 深色主題 ---------- */
    html[data-theme="dark"] .at-top-logo,
    html[data-theme="dark"] #at_main_menu_area {
        background: #1e293b !important;
    }

    html[data-theme="dark"] .at-burger__line {
        background: #FFF;
    }

    html[data-theme="dark"] #at_main_menu_area .at-main-menu-ul>li {
        border-bottom-color: rgba(255, 255, 255, .1);
    }

    html[data-theme="dark"] #at_main_menu_area .at-main-menu-ul>li>a,
    html[data-theme="dark"] #at_main_menu_area .dropdown-menu ul a {
        color: #e2e8f0 !important;
    }

    html[data-theme="dark"] #at_main_menu_area .dropdown-menu ul a::before {
        color: #94A3B8;
    }

    html[data-theme="dark"] #at_main_menu_area .at-mobile-child-menu>span {
        border-bottom-color: rgba(255, 255, 255, .25) !important;
    }

    html[data-theme="dark"] #at_main_menu_area .at-main-menu-ul>li>.dropdown-menu {
        border-color: var(--dm-border) !important;
        background: #0f172a !important;
    }

    html[data-theme="dark"] #at_main_menu_area .at-mobile-child-menu>span {
        color: #8FC9EC !important;
    }

    html[data-theme="dark"] #at_main_menu_area .at-main-menu-ul>li.dropdown>a::after {
        background:
            linear-gradient(#FFF, #FFF) center / 13px 1px no-repeat,
            linear-gradient(#FFF, #FFF) center / 1px 13px no-repeat,
            #334155;
    }

    html[data-theme="dark"] #at_main_menu_area .at-main-menu-ul>li.dropdown.is-open>a::after {
        background:
            linear-gradient(#FFF, #FFF) center / 13px 1px no-repeat,
            linear-gradient(#FFF, #FFF) center / 1px 0 no-repeat,
            #334155;
    }
}

@media (max-width: 991px) and (prefers-reduced-motion: reduce) {
    .at-burger__line,
    #at_main_menu_area,
    #at_main_menu_area * {
        transition: none !important;
    }
}

/* ============================================================
   頁尾：深藍底 + 上緣斜邊
   底色 #136BA5 為客戶指定；白字對比 5.72，高於無障礙 AA 的 4.5
   原本的樹木底圖（footer-bg.svg）已不使用
   ============================================================ */
.at-footer-main {
    position: relative;
    z-index: 0;
    text-align: left;
    border-top: 0;
    background: none;
    color: #FFF;
}

/* 斜邊：純裝飾，用 ::before 畫色塊，不裁切內容，文字不會被切到 */
.at-footer-main::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    background: var(--at-footer-bg, var(--at-main));
    clip-path: polygon(0 0, 100% 40px, 100% 100%, 0 100%);
}

.at-footer-main__inner {
    width: 85%;
    margin: 0 auto;
    /* 上方多留斜邊的高度 */
    padding: 76px 0 28px;
}

/* logo 已換成白字版本（assets/images/footerlogo.png），直接放在藍底上，不用白底 */
.at-footer-logo {
    display: inline-block;
}

.at-footer-text,
.at-footer-update,
.at-footer-links a,
.at-footer-links li {
    color: #FFF;
}

.at-footer-text a {
    color: #FFF;
    text-decoration: underline;
}

.at-footer-text a:hover,
.at-footer-links a:hover {
    color: #D8E6F2;
    text-decoration: underline;
}

.at-footer-links li:not(:last-child)::after {
    color: rgba(255, 255, 255, .55);
}

/* 標章：GOV 是黑底圖，墊白底才不會糊在藍色裡 */
.at-footer-badges img {
    padding: 3px;
    border-radius: 4px;
    background: #FFF;
}

/* 最底的一列：深一階的藍 */
.at-footer-bottom {
    background: var(--at-footer-bottom-bg, #0F5C8C);
    color: #FFF;
}

/* 鍵盤焦點框：全站的紅色框在深藍上看不清楚（對比 1.6），
   頁尾改用黃色（對比 4.0，高於非文字元素要求的 3.0） */
.at-footer-main a:focus,
.at-footer-main button:focus,
.at-footer-bottom a:focus,
.at-footer-bottom button:focus {
    outline: 3px dotted #FFD400;
    outline-offset: 2px;
}

@media (max-width: 991px) {
    .at-footer-main::before {
        clip-path: polygon(0 0, 100% 20px, 100% 100%, 0 100%);
    }

    .at-footer-main__inner {
        width: auto;
        padding: 48px 20px 28px;
    }
}

/* 深色主題：同樣的藍再壓深一階 */
html[data-theme="dark"] .at-footer-main {
    --at-footer-bg: #0E4A6E;
    background: none;
    background-color: transparent;
    background-blend-mode: normal;
    border-top-color: transparent;
}

html[data-theme="dark"] .at-footer-bottom {
    --at-footer-bottom-bg: #0B3B58;
}

/* 沒有 hero 版型的頁面（搜尋、404 等）主選單與左側選單，滑過、聚焦同樣加底線 */
body:not(.at-hero-layout) .at-main-menu-ul>li>a:hover,
body:not(.at-hero-layout) .at-main-menu-ul>li>a:focus,
body:not(.at-hero-layout) .at-page-sidebar-area ul li a:hover,
body:not(.at-hero-layout) .at-page-sidebar-area ul li a:focus {
    text-decoration: underline;
    text-underline-offset: 4px;
}

/* 手機、平板：「我要掛號」按鈕不顯示另開新視窗的小圖示（按鈕窄，圖示會擠成兩行）
   按鈕裡的 sr-only 文字仍保留，讀螢幕軟體還是會唸「另開新視窗」 */
@media (max-width: 991px) {
    .at-reg-button[target="_blank"]::after,
    .at-page-main-content .at-reg-button[target="_blank"]::after {
        content: none !important;
    }
}

/* ============================================================
   標題字體：思源宋體（Noto Serif TC）
   - 字體檔自行供應，不走 Google Fonts（政府網站不外連 CDN，也不外洩訪客 IP）
   - 來源為系統內建的 NotoSerifTC-VF.ttf，SIL 開放字型授權，可散布
   - 已取 wght=700 單一字重，並子集化成 Big5 常用字 6004 字，1.2MB
   - src 先寫 local()：訪客電腦已裝思源宋體就直接用，不用下載
   - font-display: swap：字體還沒下載完先用黑體顯示，文字不會空白
   - 只套在中文主標題；英文小標與內文維持原本的黑體（明體配黑體的搭配）
   ============================================================ */
@font-face {
    font-family: "Noto Serif TC 806";
    src: local("Noto Serif TC"),
         local("NotoSerifTC"),
         local("Source Han Serif TC"),
         url("../font/noto-serif-tc/noto-serif-tc-700.woff2") format("woff2");
    font-weight: 400 700;
    font-style: normal;
    font-display: swap;
}

:root {
    /* 要換標題字體改這裡就好；讀不到時往下掉到系統明體，最後回到黑體 */
    --at-heading-font: "Noto Serif TC 806", "Noto Serif TC", "Source Han Serif TC", "PingFang TC", "Microsoft JhengHei", sans-serif;
}

/* 首頁區塊標題、內頁標題、側欄標題、單元頁分類標題、網站導覽標題 */
.at-home-title,
.at-home-esg__title,
.at-page-main-content h2,
.at-page-main-content h3,
.at-team-area h3,
.at-page-sidebar-title,
.at-unit-page-content .at-collapse-button,
.at-hero-title,
.at-hero-title-en,
.at-map-title,
.at-page-title,
.at-link-group-title {
    font-family: var(--at-heading-font);
}

/* 標題裡的英文小標維持黑體：中文明體配英文黑體，層次比較清楚 */
.at-home-title__en,
.at-map-title__en,
.at-hero-title-en {
    font-family: var(--at-body-font);
}

/* 注音模式要能蓋掉標題字體（style.css 的 .at_notation 用了 !important，
   這裡不加 !important，注音字體才不會被搶走） */

/* 英文頁（<html lang="en">）內文行高：中文需要 2.0，英文 1.6 比較好讀，段落不會散 */
html[lang="en"] .at-page-main-content p,
html[lang="en"] .at-page-main-content li,
html[lang="en"] .at-page-main-content td,
html[lang="en"] .at-page-main-content dd {
    line-height: 1.65;
}

html[lang="en"] .at-page-main-content p a,
html[lang="en"] .at-page-main-content p span,
html[lang="en"] .at-page-main-content li a,
html[lang="en"] .at-page-main-content li span {
    line-height: inherit;
}

html[lang="en"] .at-page-main-content p {
    margin-bottom: 1em;
}

html[lang="en"] .at-page-main-content h2,
html[lang="en"] .at-page-main-content h3 {
    line-height: 1.35;
}

/* 英文頁內文段落寬度：每行約 70 個字母最好讀（原本約 90 字，眼睛換行容易找錯行）
   只限制文字段落與清單，圖片、表格仍維持全寬 */
html[lang="en"] .at-page-main-content p,
html[lang="en"] .at-page-main-content ul:not([class]),
html[lang="en"] .at-page-main-content ol:not([class]) {
    /* Segoe UI 平均字寬約 0.48em，34em 約每行 70 字 */
    max-width: 34em;
}

/* 英文版主選單：英文字比中文長，1400px 以下膠囊會蓋到 logo，
   字級、間距縮一點（中文版不受影響） */
@media (min-width: 992px) and (max-width: 1400px) {
    html[lang="en"] .at-hero-layout .at-main-menu-ul {
        padding: 0 12px;
    }

    html[lang="en"] .at-hero-layout .at-main-menu-ul>li>a {
        padding: 0 6px;
        font-size: .875rem;
        letter-spacing: .02em;
    }
}

/* 一般下拉選單（英文版全部、中文版「保健園地」）：寬度依內容撐開，每個連結一行
   原本絕對定位會縮成選單項目的寬度，英文科別名稱被擠成兩行 */
@media (min-width: 992px) {
    .at-hero-layout .at-general-item .dropdown-menu {
        width: max-content;
        max-width: calc(100vw - 40px);
    }

    .at-hero-layout .at-general-item .dropdown-menu a {
        white-space: nowrap;
    }
}

/* ------------------------------------------------------------
   文章內頁（最新消息、社區活動、衛教、各科新聞、英文消息）
   分類名稱當頁面標題：跟列表頁的 h2 同樣大小與明體，下方是星號 + 橫線（.at-title-area）
   文章標題移到橫線下方，不再有裝飾線
   ------------------------------------------------------------ */
.at-news-single-info .at-title-area__heading,
.at-team-area .at-title-area__heading {
    margin: 0 0 .5rem;
    color: #000;
    font-family: var(--at-heading-font);
    font-size: 1.6em;
    font-weight: 700;
    line-height: 2;
}

.at-news-single-info .at-post-title,
.at-page-main-content .at-news-single-info h2.at-post-title {
    margin: 28px 0 12px;
    color: #1A1A1A;
    font-size: 1.5em;
    font-weight: 700;
    line-height: 1.5;
}

html[data-theme="dark"] .at-news-single-info .at-title-area__heading,
html[data-theme="dark"] .at-team-area .at-title-area__heading,
html[data-theme="dark"] .at-news-single-info .at-post-title {
    color: #FFF !important;
}

/* ------------------------------------------------------------
   分類列表右上角的 RSS：外框膠囊，高度跟旁邊的回上頁圓鈕一樣（37px）
   ------------------------------------------------------------ */
.at_share_links li.at-rss {
    vertical-align: top;
}

.at_share_links li a.at-rss-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: auto;
    height: 37px;
    padding: 0 16px;
    border: 1px solid var(--at-main);
    border-radius: 37px;
    background: #FFF;
    color: #1A1A1A;
    font-size: .9375rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: .04em;
    text-decoration: none;
    transform: none;
    transition: background-color .2s ease, color .2s ease;
}

.at_share_links li a.at-rss-button i {
    color: var(--at-main);
    font-size: .875rem;
    transition: color .2s ease;
}

.at_share_links li a.at-rss-button:hover,
.at_share_links li a.at-rss-button:focus {
    background: var(--at-main);
    color: #FFF;
    transform: none;
}

.at_share_links li a.at-rss-button:hover i,
.at_share_links li a.at-rss-button:focus i {
    color: #FFF;
}

/* RSS 是外連到訂閱網址，不要再加外連小圖示 */
.at-page-main-content .at_share_links a.at-rss-button::after {
    content: none !important;
}

html[data-theme="dark"] .at_share_links li a.at-rss-button {
    background: transparent !important;
    border-color: #8FC9EC !important;
    color: #FFF !important;
}

html[data-theme="dark"] .at_share_links li a.at-rss-button i {
    color: #8FC9EC;
}

/* ------------------------------------------------------------
   頁面右下角「回上一頁／回最上面」：改成圓形圖示按鈕
   灰底白圖示、滑過變深；灰用 #757575（白圖示對比 4.6），圖示類元件需 3.0 以上
   按鈕小，電腦、手機都不會跟左邊的瀏覽人次／更新日期重疊
   ------------------------------------------------------------ */
.at-update-info .at-back-button-area,
.at-back-button-area {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 0 !important;
}

.at-back-button-area li {
    display: flex;
    margin: 0 !important;
    list-style: none;
}

.at-back-button-area li a.at-tool-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #757575;
    color: #FFF;
    font-size: .875rem;
    line-height: 1;
    text-decoration: none;
    transition: background-color .18s ease, transform .18s ease;
}

.at-back-button-area li a.at-tool-btn:hover,
.at-back-button-area li a.at-tool-btn:focus {
    background: var(--at-main);
    color: #FFF;
    transform: scale(1.06);
}

@media (max-width: 991px) {
    /* 手機：跟文字同一列靠右，不再擠到下一行置中 */
    .at-update-info .at-back-button-area,
    .at-back-button-area {
        position: absolute;
        top: 50%;
        right: 0;
        margin: 0;
        transform: translateY(-50%);
    }

    .at-back-button-area li a.at-tool-btn {
        width: 32px;
        height: 32px;
    }
}

html[data-theme="dark"] .at-back-button-area li a.at-tool-btn {
    background: #475569 !important;
    border: 0 !important;
    color: #FFF !important;
}

html[data-theme="dark"] .at-back-button-area li a.at-tool-btn:hover,
html[data-theme="dark"] .at-back-button-area li a.at-tool-btn:focus {
    background: var(--at-main) !important;
}

/* ------------------------------------------------------------
   標題右側工具列：語音、列印、分享、回上頁（列表頁另有 RSS）
   灰底白圖示圓鈕，滑過變深
   灰用 #757575（白圖示對比 4.6，圖示需 3.0 以上）
   ------------------------------------------------------------ */
.at-title-area .at_share_links {
    display: flex;
    align-items: center;
    gap: 8px;
}

.at-title-area .at_share_links > li {
    display: flex;
    align-items: center;
    margin: 0 !important;
}

.at_share_links .at-tool-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #757575;
    box-shadow: none;
    color: #FFF;
    font-size: .8125rem;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .18s ease, transform .18s ease;
}

.at_share_links .at-tool-btn:hover,
.at_share_links .at-tool-btn:focus,
.at_share_links .at-share-toggle[aria-expanded="true"],
.at_share_links .at-tool-btn.is-speaking {
    background: var(--at-main);
    color: #FFF;
    transform: scale(1.06);
    text-decoration: none;
}

/* 列表頁的 RSS 膠囊跟圓鈕同高 */
.at_share_links li a.at-rss-button {
    height: 32px;
    padding: 0 14px;
}

/* 分享：往下展開臉書、LINE 兩顆 */
.at_share_links .at-share-wrap {
    position: relative;
}

.at_share_links .at-share-list {
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    left: 50%;
    z-index: 20;
    gap: 8px;
    margin: 0;
    padding: 8px;
    border: 1px solid #DCE3E8;
    border-radius: 24px;
    background: #FFF;
    box-shadow: 0 6px 16px rgba(0, 0, 0, .12);
    list-style: none;
    transform: translateX(-50%);
}

.at_share_links .at-share-wrap.is-open .at-share-list {
    display: flex;
}

.at_share_links .at-share-list li {
    margin: 0 !important;
    list-style: none;
}

.at_share_links .at-tool-btn--fb {
    background: #1877F2;
}

/* LINE 官方綠 #06C755 配白圖示只有 2.3，改用深一階的 #05A446（3.3） */
.at_share_links .at-tool-btn--line {
    background: #05A446;
    font-size: 1rem;
}

.at_share_links .at-tool-btn--fb:hover,
.at_share_links .at-tool-btn--fb:focus {
    background: #0F5FCB;
}

.at_share_links .at-tool-btn--line:hover,
.at_share_links .at-tool-btn--line:focus {
    background: #038A3A;
}

/* 外連小圖示不要加在圓鈕上 */
.at-page-main-content .at_share_links a.at-tool-btn::after {
    content: none !important;
}

@media (max-width: 991px) {
    .at_share_links .at-tool-btn {
        width: 28px;
        height: 28px;
        font-size: .75rem;
    }

    .at_share_links li a.at-rss-button {
        height: 28px;
        padding: 0 10px;
        font-size: .8125rem;
    }
}

html[data-theme="dark"] .at_share_links .at-tool-btn {
    background: #475569 !important;
    border: 0 !important;
    color: #FFF !important;
}

html[data-theme="dark"] .at_share_links .at-tool-btn:hover,
html[data-theme="dark"] .at_share_links .at-tool-btn:focus,
html[data-theme="dark"] .at_share_links .at-share-toggle[aria-expanded="true"] {
    background: var(--at-main) !important;
}

html[data-theme="dark"] .at_share_links .at-share-list {
    border-color: rgba(255, 255, 255, .1);
    background: #1e293b;
}

/* 標題列排版：標題與右側工具列並排（不再用絕對定位疊在標題上），
   長標題會自己換行，不會跑到按鈕底下；手機版工具列獨立一列放在標題上方靠右 */
.at-title-area {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px 24px;
}

.at-title-area > h2,
.at-title-area > .at-title-area__heading {
    flex: 1 1 auto;
    min-width: 0;
}

.at-title-area .at_share_links {
    position: static !important;
    flex: 0 0 auto;
    margin: 0 0 14px !important;
}

@media (max-width: 991px) {
    .at-title-area {
        flex-wrap: wrap;
    }

    .at-title-area .at_share_links {
        order: -1;
        width: 100%;
        justify-content: flex-end;
        margin: 0 0 4px !important;
    }

    .at-title-area > h2,
    .at-title-area > .at-title-area__heading {
        flex-basis: 100%;
        margin-top: 0;
    }
}

/* ------------------------------------------------------------
   頁面右下角工具列：語音、列印、分享、回上一頁、回最上面
   （語音、列印、分享從標題列移到這裡；標題列只留回上一頁）
   ------------------------------------------------------------ */
.at-back-button-area .at-tool-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #757575;
    color: #FFF;
    font-size: .875rem;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .18s ease, transform .18s ease;
}

.at-back-button-area .at-tool-btn:hover,
.at-back-button-area .at-tool-btn:focus,
.at-back-button-area .at-share-toggle[aria-expanded="true"],
.at-back-button-area .at-tool-btn.is-speaking {
    background: var(--at-main);
    color: #FFF;
    transform: scale(1.06);
    text-decoration: none;
}

/* 分享：往上展開臉書、LINE（下方就是頁尾，往上比較不會被擋） */
.at-back-button-area .at-share-wrap {
    position: relative;
}

.at-back-button-area .at-share-list {
    display: none;
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    z-index: 20;
    gap: 8px;
    margin: 0;
    padding: 8px;
    border: 1px solid #DCE3E8;
    border-radius: 24px;
    background: #FFF;
    box-shadow: 0 6px 16px rgba(0, 0, 0, .12);
    list-style: none;
    transform: translateX(-50%);
}

.at-back-button-area .at-share-wrap.is-open .at-share-list {
    display: flex;
}

.at-back-button-area .at-share-list li {
    margin: 0 !important;
    list-style: none;
}

.at-back-button-area .at-tool-btn--fb {
    background: #1877F2;
}

.at-back-button-area .at-tool-btn--line {
    background: #05A446;
    font-size: 1rem;
}

.at-back-button-area .at-tool-btn--fb:hover,
.at-back-button-area .at-tool-btn--fb:focus {
    background: #0F5FCB;
}

.at-back-button-area .at-tool-btn--line:hover,
.at-back-button-area .at-tool-btn--line:focus {
    background: #038A3A;
}

.at-page-main-content .at-back-button-area a.at-tool-btn::after {
    content: none !important;
}

/* 手機：五顆按鈕放在瀏覽人次／更新日期下方靠右，不跟文字擠同一列 */
@media (max-width: 991px) {
    .at-update-info .at-back-button-area,
    .at-back-button-area {
        position: static;
        justify-content: flex-end;
        margin: 14px 0 0;
        transform: none;
    }

    .at-back-button-area .at-tool-btn {
        width: 32px;
        height: 32px;
    }
}

html[data-theme="dark"] .at-back-button-area .at-tool-btn {
    background: #475569 !important;
    border: 0 !important;
    color: #FFF !important;
}

html[data-theme="dark"] .at-back-button-area .at-tool-btn:hover,
html[data-theme="dark"] .at-back-button-area .at-tool-btn:focus,
html[data-theme="dark"] .at-back-button-area .at-share-toggle[aria-expanded="true"] {
    background: var(--at-main) !important;
}

html[data-theme="dark"] .at-back-button-area .at-share-list {
    border-color: rgba(255, 255, 255, .1);
    background: #1e293b;
}

/* 圓形圖示按鈕整體縮成約 90%（右下角工具列、標題右側回上頁／RSS） */
.at-back-button-area .at-tool-btn {
    width: 32px;
    height: 32px;
    font-size: .8rem;
}

.at_share_links .at-tool-btn {
    width: 29px;
    height: 29px;
    font-size: .75rem;
}

.at_share_links li a.at-rss-button {
    height: 29px;
    padding: 0 13px;
    font-size: .875rem;
}

.at-back-button-area .at-tool-btn--line,
.at_share_links .at-tool-btn--line {
    font-size: .9rem;
}

@media (max-width: 991px) {
    .at-back-button-area .at-tool-btn {
        width: 29px;
        height: 29px;
        font-size: .75rem;
    }

    .at_share_links .at-tool-btn {
        width: 25px;
        height: 25px;
        font-size: .7rem;
    }

    .at_share_links li a.at-rss-button {
        height: 25px;
        padding: 0 9px;
        font-size: .75rem;
    }
}

/* 回上一頁、回最上面是 <a>，舊規則（li a.at-tool-btn）權重較高，這裡用同樣權重一起縮 */
.at-back-button-area li a.at-tool-btn,
.at-back-button-area li button.at-tool-btn {
    width: 32px;
    height: 32px;
    font-size: .8rem;
}

@media (max-width: 991px) {
    .at-back-button-area li a.at-tool-btn,
    .at-back-button-area li button.at-tool-btn {
        width: 29px;
        height: 29px;
        font-size: .75rem;
    }
}

/* ============================================================
   快捷工具列 .at-dock：首頁｜網掛｜網站導覽｜上一頁｜TOP
   電腦版：固定在畫面右側中間的直式白色膠囊（沿用原本浮動工具列的外觀）
   手機版：固定在畫面最下方的一排，圖示 + 文字
   ============================================================ */
.at-dock {
    position: fixed;
    right: 16px;
    top: 50%;
    z-index: 50;
    transform: translateY(-50%);
}

.at-dock__list {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0;
    padding: 10px 6px;
    border-radius: 34px;
    background: linear-gradient(180deg, #FFF 0%, #f4f4f4 100%);
    box-shadow: 0 10px 28px rgba(0, 0, 0, .18), inset 0 1px 0 #FFF;
    list-style: none;
}

.at-dock__list > li {
    margin: 0;
    padding: 0;
    list-style: none;
}

.at-dock__list > li + li {
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px solid #e8e8e8;
}

.at-dock__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    width: 58px;
    padding: 4px 0;
    color: #333;
    text-decoration: none;
}

.at-dock__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: 1px solid #e4e4e4;
    border-radius: 50%;
    background: linear-gradient(180deg, #FFF 0%, #f2f2f2 100%);
    box-shadow: 0 2px 5px rgba(0, 0, 0, .12), inset 0 1px 0 #FFF;
    font-size: .875rem;
    transition: background-color .2s ease, color .2s ease, transform .2s ease;
}

.at-dock__label {
    color: #333;
    font-size: .75rem;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: .02em;
    white-space: nowrap;
}

.at-dock__item:hover,
.at-dock__item:focus {
    color: var(--at-main);
    text-decoration: none;
}

.at-dock__item:hover .at-dock__icon,
.at-dock__item:focus .at-dock__icon {
    border-color: var(--at-main);
    background: var(--at-main);
    color: #FFF;
    transform: translateY(-2px);
}

.at-dock__item:hover .at-dock__label,
.at-dock__item:focus .at-dock__label {
    color: var(--at-main-dark);
}

/* 外連圖示不要加在這些按鈕上 */
.at-dock__item::after {
    content: none !important;
}

/* ---------- 1199px 以下（手機、平板、小筆電）：畫面最下方一排 ---------- */
@media (max-width: 1199px) {
    .at-dock {
        top: auto;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 9000;
        transform: none;
    }

    .at-dock__list {
        flex-direction: row;
        align-items: stretch;
        padding: 6px 4px calc(6px + env(safe-area-inset-bottom));
        border-top: 1px solid #e5e5e5;
        border-radius: 0;
        background: #FFF;
        box-shadow: 0 -4px 14px rgba(0, 0, 0, .08);
    }

    .at-dock__list > li {
        flex: 1 1 0;
        min-width: 0;
    }

    .at-dock__list > li + li {
        margin-top: 0;
        padding-top: 0;
        border-top: 0;
    }

    .at-dock__item {
        width: auto;
        padding: 2px 0;
    }

    .at-dock__icon {
        width: 30px;
        height: 30px;
        border: 0;
        background: transparent;
        box-shadow: none;
        font-size: 1.05rem;
    }

    .at-dock__item:hover .at-dock__icon,
    .at-dock__item:focus .at-dock__icon {
        background: transparent;
        color: var(--at-main);
        transform: none;
    }

    /* 內容最底下留出工具列的高度，頁尾才不會被蓋住 */
    body {
        padding-bottom: calc(64px + env(safe-area-inset-bottom));
    }
}

@media print {
    .at-dock {
        display: none !important;
    }
}

/* 深色主題 */
html[data-theme="dark"] .at-dock__list {
    background: #1e293b;
    box-shadow: 0 10px 28px rgba(0, 0, 0, .45);
}

html[data-theme="dark"] .at-dock__list > li + li {
    border-top-color: rgba(255, 255, 255, .1);
}

html[data-theme="dark"] .at-dock__icon {
    border-color: rgba(255, 255, 255, .12);
    background: #334155;
    box-shadow: none;
    color: #FFF;
}

html[data-theme="dark"] .at-dock__item,
html[data-theme="dark"] .at-dock__label {
    color: #e2e8f0 !important;
}

@media (max-width: 1199px) {
    html[data-theme="dark"] .at-dock__list {
        border-top-color: rgba(255, 255, 255, .1);
    }

    html[data-theme="dark"] .at-dock__icon {
        background: transparent;
    }
}

/* 1200～1399px：右側膠囊只放圖示（文字留給讀螢幕軟體），才不會壓到內容區 */
@media (min-width: 1200px) and (max-width: 1399px) {
    .at-dock {
        right: 8px;
    }

    .at-dock__item {
        width: 44px;
    }

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

/* ------------------------------------------------------------
   手機版右上的搜尋：放大鏡在選單按鈕左邊，點了往下展開搜尋框
   搜尋框樣式與電腦版右上的搜尋相同
   ------------------------------------------------------------ */
@media (max-width: 991px) {
    .at-msearch-btn {
        position: absolute;
        top: 0;
        right: 64px;
        /* 其他規則給頁首按鈕設了 left，這裡清掉才會靠右 */
        left: auto !important;
        z-index: 10001;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 64px;
        padding: 0;
        border: 0;
        background: transparent;
        color: #333;
        font-size: 1.2rem;
        cursor: pointer;
    }

    .at-msearch-btn[aria-expanded="true"] {
        color: var(--at-main);
    }

    .at-msearch-panel {
        display: none;
        position: absolute;
        top: 68px;
        right: 12px;
        left: 12px;
        z-index: 10002;
        padding: 16px 16px 14px;
        border: 1px solid #DCE3E8;
        border-radius: 14px;
        background: #FFF;
        box-shadow: 0 8px 24px rgba(3, 58, 82, .16);
    }

    .at-msearch-panel.is-open {
        display: block;
    }

    .at-msearch-form {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin: 0;
    }

    .at-msearch-form input[type="text"] {
        flex: 1 1 100%;
        min-width: 0;
        height: 44px;
        padding: 0 14px;
        border: 1px solid #C9D3DA;
        border-radius: 8px;
        color: #222;
        font-size: 1rem;
    }

    .at-msearch-form input[type="text"]:focus {
        border-color: var(--at-main);
    }

    .at-msearch-submit,
    .at-msearch-advanced {
        flex: 1 1 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        height: 42px;
        padding: 0 14px;
        border: 0;
        border-radius: 8px;
        font-size: .9375rem;
        font-weight: 700;
        text-decoration: none;
        white-space: nowrap;
    }

    .at-msearch-submit {
        background: var(--at-main);
        color: #FFF;
    }

    a.at-msearch-advanced {
        background: #EEF4F7;
        color: var(--at-main-dark);
    }

    a.at-msearch-advanced::after {
        content: none !important;
    }

    .at-msearch-hot {
        margin: 12px 0 0;
        color: #444;
        font-size: .9375rem;
        line-height: 1.7;
        text-align: left;
    }

    .at-msearch-hot a {
        color: var(--at-main-dark);
        font-weight: 700;
    }

    /* logo 右邊讓出放大鏡的位置 */
    .at-top-logo .logo {
        max-width: calc(100% - 128px);
    }

    html[data-theme="dark"] .at-msearch-btn {
        color: #FFF;
    }

    html[data-theme="dark"] .at-msearch-panel {
        border-color: rgba(255, 255, 255, .1);
        background: #1e293b;
    }

    html[data-theme="dark"] .at-msearch-form input[type="text"] {
        border-color: rgba(255, 255, 255, .2);
        background: #0f172a;
        color: #e2e8f0;
    }

    html[data-theme="dark"] .at-msearch-hot {
        color: #cbd5e1;
    }

    html[data-theme="dark"] .at-msearch-hot a {
        color: #8FC9EC !important;
    }

    html[data-theme="dark"] a.at-msearch-advanced {
        background: #334155 !important;
        color: #FFF !important;
    }
}

/* 手機版：標題右上的「回上一頁」拿掉（下方快捷工具列已經有上一頁）
   列表頁的 RSS 保留；整列只剩回上一頁時，整列隱藏，不留空白 */
@media (max-width: 991px) {
    .at-title-area .at_share_links li:has(> .at-page-back) {
        display: none !important;
    }

    .at-title-area .at_share_links:not(:has(.at-rss)) {
        display: none !important;
    }
}

/* 手機版左側選單（收合的「關於我們」等）：
   style.css 的 p, span, a, li { font-size: 1.08em } 會一層層疊加，
   第二層的「院長的話」反而比第一層「本院介紹」大；這裡改用 rem 固定，兩層同樣大小 */
@media (max-width: 991px) {
    .at-page-sidebar-area ul li,
    .at-page-sidebar-area ul li a,
    .at-page-sidebar-area ul li span {
        font-size: 1rem;
    }

    .at-page-sidebar-area ul li i {
        font-size: .875rem;
    }
}

/* 手機版：頁面最下方那排圓形按鈕（語音、列印、分享、回上一頁、回最上面）置中 */
@media (max-width: 991px) {
    .at-update-info .at-back-button-area,
    .at-back-button-area {
        justify-content: center;
    }
}

/* 手機版：瀏覽人次、更新日期文字也置中，與下方按鈕對齊 */
@media (max-width: 991px) {
    .at-update-info {
        text-align: center;
    }
}

/* 手機選單底部工具列：深色主題 */
html[data-theme="dark"] #at_main_menu_area .at-mtools__btn,
html[data-theme="dark"] #at_main_menu_area .at-mtools__opt {
    border-color: rgba(255, 255, 255, .6);
    background: transparent;
    color: #FFF !important;
}

html[data-theme="dark"] #at_main_menu_area .at-mtools__btn[aria-pressed="true"],
html[data-theme="dark"] #at_main_menu_area .at-mtools__btn[aria-expanded="true"],
html[data-theme="dark"] #at_main_menu_area .at-mtools__opt[aria-pressed="true"],
html[data-theme="dark"] #at_main_menu_area .at-mtools__opt[disabled] {
    border-color: #FFF;
    background: #FFF;
    color: #0F5684 !important;
}

/* ------------------------------------------------------------
   手機版：主選單（漢堡選單）與單元選單（左側選單）字體、字級統一
   第一層（最新消息／關於我們）       ：明體 18px 粗體
   第二層分類（本院公告／本院介紹）   ：黑體 16px（單元選單的分類樣式同電腦版左側選單）
   第三層連結（訊息公告／院長的話）   ：黑體 16px
   ------------------------------------------------------------ */
@media (max-width: 991px) {
    .at-page-sidebar-title {
        font-size: 1.125rem;
    }

    #at_main_menu_area .at-mobile-child-menu > span {
        font-family: var(--at-body-font);
    }

}

/* ------------------------------------------------------------
   手機版單元選單（左側選單）
   - 標題列（關於我們）：靠左、明體 18px，右邊跟手機主選單同樣的圓形 +／−，下方一條細線
   - 標題下的清單：跟電腦版左側選單一模一樣
     分類（本院介紹）前面「>」灰色一般字重；展開中的分類主色、半粗體、箭頭右移
     子項目（院長的話）縮排 32px、灰字、沒有箭頭；目前頁面主色半粗體
   ------------------------------------------------------------ */
@media (max-width: 991px) {

    /* 整個選單外加灰色外框（圓角同電腦版卡片 20px），內容左右各內縮 5%（約 90% 寬） */
    .at-page-sidebar-column .at-page-sidebar-area {
        padding: 4px 5% 8px;
        border: 1px solid #DCDCDC;
        border-radius: 20px;
    }

    html[data-theme="dark"] .at-page-sidebar-column .at-page-sidebar-area {
        border-color: var(--dm-border) !important;
    }

    /* 收合時只剩標題列，標題下方的線就不用了（外框已經框住） */
    .at-page-sidebar-area .at-page-sidebar-title[aria-expanded="false"] {
        border-bottom-color: transparent;
    }

    /* 標題列 */
    .at-page-sidebar-area .at-page-sidebar-title {
        padding: 16px 48px 16px 0;
        border: 0;
        border-bottom: 1px solid #E9E9E9;
        border-radius: 0;
        color: #333;
        text-align: left;
    }

    .at-page-sidebar-area .at-page-sidebar-title[aria-expanded="true"] {
        border-radius: 0;
    }

    .at-page-sidebar-area .at-page-sidebar-title::after,
    .at-page-sidebar-area .at-page-sidebar-title[aria-expanded="true"]::after {
        content: "";
        top: 50%;
        right: 0;
        width: 32px;
        height: 32px;
        margin: -16px 0 0;
        border-radius: 50%;
        background:
            linear-gradient(#333, #333) center / 13px 1px no-repeat,
            linear-gradient(#333, #333) center / 1px 13px no-repeat,
            #EEF4F7;
        transform: none;
    }

    .at-page-sidebar-area .at-page-sidebar-title[aria-expanded="true"]::after {
        background:
            linear-gradient(#333, #333) center / 13px 1px no-repeat,
            linear-gradient(#333, #333) center / 1px 0 no-repeat,
            #EEF4F7;
    }

    /* 清單：白底、不再有外框 */
    .at-page-sidebar-area .sidebar-area>ul {
        margin: 0;
        padding: 14px 0 4px;
        border: 0;
        border-radius: 0;
        background: none;
    }

    .at-page-sidebar-area .sidebar-area ul li,
    .at-page-sidebar-area .sidebar-area ul li:not(:last-child),
    .at-page-sidebar-area .sidebar-area>ul>li:last-child {
        margin: 0;
        padding: 0;
        border: 0;
        background: transparent;
    }

    /* 分類（第一層清單項目）：同電腦版 */
    .at-page-sidebar-area #at_collapse > li > a {
        display: block;
        position: relative;
        margin: 0;
        padding: 6px 0 6px 24px;
        border: 0;
        color: var(--at-vs-text);
        font-size: 1rem;
        font-weight: 400;
        line-height: 1.8;
    }

    .at-page-sidebar-area #at_collapse > li > a::before {
        content: "\f054";
        display: inline-block;
        position: absolute;
        top: 11px;
        left: 0;
        width: auto;
        height: auto;
        margin: 0;
        border: 0;
        border-radius: 0;
        background: none;
        color: #858585;
        font-family: "Font Awesome 5 Free";
        font-size: 12px;
        font-weight: 900;
        line-height: 1.8;
        transform: none;
        transition: transform .3s cubic-bezier(.215, .61, .355, 1);
    }

    /* 電腦版沒有右側的展開箭頭，手機版也拿掉（aria-expanded 仍在，輔具讀得到） */
    .at-page-sidebar-area #at_collapse > li > a > .fa-angle-down,
    .at-page-sidebar-area #at_collapse > li > a > .fa-angle-up {
        display: none;
    }

    .at-page-sidebar-area #at_collapse > li > a:hover,
    .at-page-sidebar-area #at_collapse > li > a:focus {
        color: var(--at-vs-main);
        text-decoration: underline;
        text-underline-offset: 4px;
    }

    .at-page-sidebar-area #at_collapse > li > a:hover::before,
    .at-page-sidebar-area #at_collapse > li > a:focus::before {
        color: var(--at-vs-main);
        transform: translateX(5px);
    }

    /* 展開中的分類：主色、半粗體（非顏色提示）、箭頭右移 */
    .at-page-sidebar-area #at_collapse > li > a[aria-expanded="true"] {
        color: var(--at-vs-main);
        font-weight: 600;
        text-decoration: none;
    }

    .at-page-sidebar-area #at_collapse > li > a[aria-expanded="true"]::before {
        color: var(--at-vs-main);
        transform: translateX(5px);
    }

    /* 子項目 */
    .at-page-sidebar-area #at_collapse ul {
        padding: 8px 0 10px 32px;
    }

    .at-page-sidebar-area #at_collapse ul li a {
        display: block;
        position: relative;
        padding: 4px 0;
        color: var(--at-vs-sub);
        font-size: 1rem;
        font-weight: 400;
        line-height: 1.7;
    }

    .at-page-sidebar-area #at_collapse ul li a::before {
        content: none;
    }

    .at-page-sidebar-area #at_collapse ul li a:hover,
    .at-page-sidebar-area #at_collapse ul li a:focus {
        color: var(--at-vs-main);
        text-decoration: underline;
        text-underline-offset: 4px;
    }

    .at-page-sidebar-area #at_collapse ul li a[aria-current="page"],
    .at-page-sidebar-area #at_collapse > li > a[aria-current="page"] {
        color: var(--at-vs-main);
        font-weight: 600;
        text-decoration: none;
    }

    /* 深色主題：標題列的圓形 +／− */
    html[data-theme="dark"] .at-page-sidebar-area .at-page-sidebar-title {
        border-bottom-color: var(--dm-border) !important;
    }

    html[data-theme="dark"] .at-page-sidebar-area .at-page-sidebar-title::after {
        background:
            linear-gradient(#FFF, #FFF) center / 13px 1px no-repeat,
            linear-gradient(#FFF, #FFF) center / 1px 13px no-repeat,
            #334155 !important;
    }

    html[data-theme="dark"] .at-page-sidebar-area .at-page-sidebar-title[aria-expanded="true"]::after {
        background:
            linear-gradient(#FFF, #FFF) center / 13px 1px no-repeat,
            linear-gradient(#FFF, #FFF) center / 1px 0 no-repeat,
            #334155 !important;
    }

    html[data-theme="dark"] .at-page-sidebar-area #at_collapse > li > a::before {
        color: #94A3B8;
    }
}