/* ============================================================
   基金會成果總表 / Summary of the Foundation's Achievements
   版式與配色比照 2025 永續報告書 6.3
   作用域：body.foundationAchievements（不影響其他頁面）
   ============================================================ */

/* ---------- 標題與前言 ---------- */

/* 標題走全站內頁 banner（.sh-banner）：與同區塊的產學共創、企業公民頁一致。
   banner 之後的內容間距，全站慣例是 .pt70，但該 class 定義在
   communityCare.css 裡而本頁沒有載入它，所以在這裡自行定義同樣的值 */
.foundationAchievements .fa-head {
    padding-top: 70px;
}

    /* 前言沿用 main.css 的 .sh-desbx：max-width 820px + margin 0 auto，
       即置中的文字欄，與產學共創等內頁一致（欄內文字仍左對齊） */

        .foundationAchievements .fa-head .sh-desbx p {
            line-height: 1.95;
            margin-bottom: 15px;
            letter-spacing: normal;
            color: #333;
        }

            .foundationAchievements .fa-head .sh-desbx p:last-child {
                margin-bottom: 0;
            }

/* ---------- 支出金額摘要 ---------- */

.foundationAchievements .fa-kpi {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-top: 32px;
}

.foundationAchievements .fa-kpi-c {
    background: #f4f6f9;
    border-top: 3px solid #004280;
    padding: 16px 18px 15px;
}

.foundationAchievements .fa-kpi-lab {
    font-size: 14px;
    line-height: 1.5;
    letter-spacing: normal;
    color: #5b6472;
    margin-bottom: 7px;
}

.foundationAchievements .fa-kpi-num {
    font-size: 23px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: normal;
    color: #004280;
}

.foundationAchievements .fa-kpi-cur {
    font-size: 13px;
    font-weight: 500;
    color: #5b6472;
    margin-left: 3px;
}

/* 四欄在 992px 以下每格只剩約 110px，金額會被折成兩行，改 2×2 */
@media (max-width:991px) {
    .foundationAchievements .fa-kpi {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* ---------- 表格 ---------- */

.foundationAchievements .fa-table-bx {
    margin-top: 34px;
    margin-bottom: 90px;
}

.foundationAchievements .RWDTable {
    border-top: 3px solid #004280;
    border-collapse: collapse;
    table-layout: fixed;
}

    .foundationAchievements .RWDTable th,
    .foundationAchievements .RWDTable td {
        text-align: left;
        vertical-align: top;
        letter-spacing: normal;
    }

    /* 表頭列 */
    .foundationAchievements .RWDTable th.title_Row {
        background-color: #004280;
        color: #fff;
        font-size: 16px;
        font-weight: 700;
        text-align: center;
        word-break: keep-all;
        padding: 13px 14px;
        border-bottom: 0;
    }

        .foundationAchievements .RWDTable th.title_Row.border-Right {
            border-right: 1px solid rgba(255, 255, 255, .28);
        }

    /* 明確指定四欄寬度：不指定時瀏覽器會把空間讓給內容最多的 2026 目標欄 */
    .foundationAchievements .fa-c1 { width: 12%; }
    .foundationAchievements .fa-c2 { width: 18%; }
    .foundationAchievements .fa-c3 { width: 34%; }
    .foundationAchievements .fa-c4 { width: 36%; }

    /* 聚焦主軸欄 */
    .foundationAchievements .RWDTable th.title {
        background-color: #dfe4ec;
        color: #00305e;
        font-size: 16px;
        font-weight: 700;
        line-height: 1.55;
        text-align: center;
        vertical-align: middle;
        /* 這一欄只有 12% 寬（約 142px），而最長的主軸名稱「物聯網教育與創新
           人才培育」12 個字約需 192px。不能用 word-break: keep-all，否則
           中文無法換行，會直接溢出並蓋掉隔欄的專案名稱 */
        word-break: normal;
        overflow-wrap: anywhere;
        padding: 16px 12px;
        border-bottom: 1px solid #fff;
        border-right: 1px solid #cbd3de;
        width: auto;
    }

    .foundationAchievements .RWDTable td {
        font-size: 15px;
        line-height: 1.75;
        color: #333;
        border-bottom: 1px solid #e2e6ec;
        padding: 16px 16px 18px;
    }

        /* 專案名稱欄 */
        .foundationAchievements .RWDTable td.fa-proj {
            background-color: #f7f8fa;
            color: #23405e;
            font-weight: 500;
            line-height: 1.6;
            vertical-align: middle;
            padding: 16px 14px;
        }

        .foundationAchievements .RWDTable td.border-Right {
            border-right: 1px solid #dfe3ea;
        }

    /* 主軸之間的分隔線。2026 目標欄是合併儲存格，
       分隔線只會畫到該欄左緣為止，這是合併儲存格的限制 */
    .foundationAchievements .RWDTable tr.fa-grp > th,
    .foundationAchievements .RWDTable tr.fa-grp > td {
        border-top: 2px solid #b9c4d4;
    }

    .foundationAchievements .RWDTable tr.fa-hd + tr.fa-grp > th,
    .foundationAchievements .RWDTable tr.fa-hd + tr.fa-grp > td {
        border-top: 0;
    }

/* 「投入經費 ⋯」帶頭句 */
.foundationAchievements .fa-lead {
    color: #00305e;
    font-weight: 600;
    font-size: 15px;
    line-height: 1.6;
    margin-bottom: 9px;
}

.foundationAchievements .fa-lead-strong {
    color: #00305e;
    font-weight: 700;
    font-size: 15px;
    line-height: 1.6;
    margin-bottom: 4px;
}

/* 條列：報告書使用深藍方塊項目符號 */
.foundationAchievements .RWDTable ul.main-list-B {
    margin: 0;
    padding: 0;
}

    .foundationAchievements .RWDTable ul.main-list-B li {
        list-style: none;
        position: relative;
        margin: 8px 0;
        padding-left: 17px;
        font-size: 15px;
        line-height: 1.75;
        letter-spacing: normal;
        color: #4d4d4d;
    }

        .foundationAchievements .RWDTable ul.main-list-B li:before {
            content: '';
            position: absolute;
            left: 0;
            top: .58em;
            width: 7px;
            height: 7px;
            background-color: #004280;
        }

/* 2026 目標欄內的分項小標 */
.foundationAchievements .RWDTable .fa-sec-head {
    color: #004280;
    font-weight: 700;
    font-size: 15px;
    line-height: 1.5;
    letter-spacing: normal;
    margin: 15px 0 3px;
}

    .foundationAchievements .RWDTable .fa-sec-head.is-first {
        margin-top: 10px;
    }

/* ---------- 手機版 ---------- */

@media (max-width:580px) {
    /* 對應全站 .pt70 在此斷點的值 */
    .foundationAchievements .fa-head {
        padding-top: 35px;
    }

    .foundationAchievements .fa-kpi {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        margin-top: 24px;
    }

    .foundationAchievements .fa-kpi-c {
        padding: 12px 13px 11px;
    }

    .foundationAchievements .fa-kpi-lab {
        font-size: 12px;
        margin-bottom: 5px;
    }

    .foundationAchievements .fa-kpi-num {
        font-size: 17px;
    }

    .foundationAchievements .fa-table-bx {
        margin-top: 26px;
        margin-bottom: 50px;
    }

    .foundationAchievements .RWDTable {
        table-layout: auto;
    }

    /* 全站在此斷點會把 th.title 隱藏（原設計改用 .m-title），
       但本頁手機版是用 th.title 當左側標籤欄，需要還原顯示 */
    .foundationAchievements .m-displayBlock .RWDTable th.title {
        display: table-cell;
        width: 32%;
        text-align: left;
        vertical-align: top;
        background-color: #eef0f4;
        border-right: 1px solid #dfe3ea;
    }

    .foundationAchievements .RWDTable td.fa-proj {
        background-color: transparent;
    }

    /* 全站在此斷點對 td/th 設 word-break: keep-all，中文因此無法換行，
       會把表格撐寬超過視窗。本頁解除，並允許長英文詞（WISE-IoTSuite
       等）斷行 */
    .foundationAchievements .m-displayBlock .RWDTable td,
    .foundationAchievements .m-displayBlock .RWDTable td ul.main-list-B li,
    .foundationAchievements .m-displayBlock .RWDTable th.title_Row {
        word-break: normal;
        overflow-wrap: anywhere;
    }

    .foundationAchievements .m-displayBlock .RWDTable td {
        padding: 13px 12px;
    }
}
