/**
 * 無障礙對比度修正
 * WCAG 2.0 AA 標準：文字對比度至少 4.5:1
 */

/* 1. 修正灰色文字 #999999 與白色背景 #fbfdfe 的對比度（原 2.82:1）
   改用 #666666 可達到 5.74:1 的對比度 */
.meta-tags span,
.meta-tags span a,
.blog-comment .meta,
.custom-breadcrumb-item:before,
.custom-breadcrumb-item a,
.post .description,
.post .description .time,
.post .description em,
.news .description,
.news .description .time,
.news .description em {
    color: #666666 !important;
}

/* 2. 修正新聞列表日期和文字的對比度
   確保在放大時文字清晰可讀 */
.newsdate {
    color: #333333 !important;
    font-weight: 500;
}

/* 3. 修正首頁背景圖片上的文字對比度
   為整個區塊和文字添加背景/陰影以提升可讀性 */
   
/* 桌面模式：為新聞區塊添加半透明深色覆蓋層 */
@media screen and (min-width: 992px) {
    .news-area,
    .section-gap,
    .testimonial {
        position: relative;
    }
    
    .news-area::before,
    .section-gap::before,
    .testimonial::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: rgba(0, 0, 0, 0.6);
        z-index: 0;
    }
    
    .news-area .container,
    .section-gap .container,
    .testimonial .container {
        position: relative;
        z-index: 1;
    }
    
    .news-area .section-title,
    .section-gap .section-title,
    .testimonial .section-title {
        color: #FFFFFF !important;
        text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.9) !important;
    }
    
    /* 延伸閱讀區塊的文字加強 */
    .testimonial .text,
    .testimonial .text h3,
    .testimonial .text h3 a,
    .testimonial .text p {
        background-color: rgba(0, 0, 0, 0.85) !important;
        color: #FFFFFF !important;
        padding: 1em !important;
        border-radius: 4px !important;
        text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.95) !important;
    }
    
    .testimonial .text h3 a {
        display: block !important;
    }
}

/* 所有模式：文字陰影加強 */
.news-area .newslist a,
.section-gap .newslist a {
    color: #FFFFFF !important;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.95), 
                 0 0 8px rgba(0, 0, 0, 0.9) !important;
}

.news-area .newsdate,
.news-area .newstxt,
.section-gap .newsdate,
.section-gap .newstxt {
    color: #FFFFFF !important;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.95), 
                 0 0 8px rgba(0, 0, 0, 0.9) !important;
    font-weight: 500;
}

/* 4. 修正淺灰底深灰字的對比度（#BBBBBB 與 #E9ECEF，原 1.62:1）
   改用 #555555 可達到 7.48:1 的對比度 */
.text-muted,
.muted-text {
    color: #555555 !important;
}

/* 修正 pagination 首頁按鈕的對比度 */
.page-link {
    color: #0056b3 !important;
}

.page-link:hover,
.page-link:focus {
    color: #003d82 !important;
    background-color: #e9ecef !important;
}

.page-item.active .page-link {
    background-color: #0056b3 !important;
    border-color: #0056b3 !important;
    color: #ffffff !important;
}

/* 5. 修正產業領袖營頁面的橘字對比度（#F5B248 與 #E0E0E1，原 1.4:1）
   改用深橘色 #B86A00 可達到 4.8:1 的對比度 */
#content-spacer h3,
#content-spacer.desktop h3,
.timeline-title,
.leader-camp-title {
    color: #8B5A00 !important;
    text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.8) !important;
}

/* 6. 修正太空課程頁面的咖啡色底白字對比度（#FFFFFF 與 #C5A86B，原 2.29:1）
   將咖啡色背景改深 */
.bh-information-page {
    background: linear-gradient(180deg, #8B6914 0%, #6B5010 100%) !important;
}

/* 確保 bh-section-second 有深色背景 */
.bh-section-second {
    background-color: rgba(107, 80, 16, 0.9) !important;
}

/* 確保 bh-title 和相關元素有足夠對比度 */
.bh-color-light-yellow {
    color: #FFEB3B !important; /* 亮黃色，與深咖啡色背景對比度 > 7:1 */
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5) !important;
}

.bh-color-white,
.bh-content.bh-color-white,
.bh-content.bh-color-white p,
.bh-content.bh-color-white li,
.bh-information-page p,
.bh-information-page li {
    color: #FFFFFF !important;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3) !important;
}

/* 7. 修正section-title下的灰色分隔線對比度 */
.section-title::after {
    background-color: #666666 !important;
}

/* 8. 確保所有在深色背景上的文字有足夠對比度 */
.section-gap .newslist a {
    color: #FFFFFF !important;
}

/* 活動報報輪播項目的文字對比度加強 */
.blog-item-wrapper .blog-item-text,
.blog-item-wrapper .blog-item-text h3,
.blog-item-wrapper .blog-item-text .date {
    background-color: rgba(0, 0, 0, 0.85) !important;
    color: #FFFFFF !important;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.95) !important;
    padding: 0.8em !important;
}

.blog-item-wrapper .blog-item-text h3 {
    margin: 0 !important;
}

.blog-item-wrapper .blog-item-text .date {
    padding: 0.5em 0.8em !important;
}

/* 9. 修正首頁「訊息公告」「活動報報」「延伸閱讀」標題的對比度 */
@media screen and (min-width: 992px) {
    .news-area .section-title h2,
    .news-area .section-title,
    .section-gap .section-title h2,
    .section-gap .section-title {
        color: #FFFFFF !important;
        font-weight: 600;
        text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.95), 
                     0 0 10px rgba(0, 0, 0, 0.9) !important;
    }
    
    /* 確保按鈕可見 */
    .news-area .genric-btn,
    .section-gap .genric-btn {
        background-color: rgba(255, 255, 255, 0.95) !important;
        border: 2px solid #FFFFFF !important;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.6) !important;
    }
}

/* 10. 其他區域的標題保持深色 */
.section-title h2,
.section-title {
    font-weight: 600;
}

/* 11. 手機模式/放大模式（200-400%）時的對比度加強 */
@media screen and (max-width: 991px) {
    /* 為整個新聞區塊添加半透明深色背景 */
    .news-area,
    .section-gap,
    .testimonial {
        background-color: rgba(0, 0, 0, 0.75) !important;
        padding: 2em 0 !important;
    }
    
    /* 標題添加深色背景確保可讀性 */
    .news-area .section-title,
    .section-gap .section-title,
    .testimonial .section-title {
        background-color: rgba(0, 0, 0, 0.8) !important;
        padding: 0.5em 1em !important;
        border-radius: 4px !important;
        display: inline-block !important;
        color: #FFFFFF !important;
        text-shadow: none !important;
    }
    
    /* 延伸閱讀文字加強 */
    .testimonial .text,
    .testimonial .text h3,
    .testimonial .text h3 a,
    .testimonial .text h3 a span,
    .testimonial .text p {
        background-color: rgba(0, 0, 0, 0.85) !important;
        color: #FFFFFF !important;
        text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.95) !important;
        padding: 0.8em !important;
        border-radius: 4px !important;
    }
    
    /* 新聞列表項目添加背景 */
    .news-area .newslist,
    .section-gap .newslist {
        background-color: rgba(0, 0, 0, 0.7) !important;
        padding: 0.8em 1em !important;
        margin-bottom: 0.5em !important;
        border-radius: 4px !important;
    }
    
    .news-area .newslist a,
    .section-gap .newslist a,
    .news-area .newsdate,
    .news-area .newstxt,
    .section-gap .newsdate,
    .section-gap .newstxt {
        color: #FFFFFF !important;
        text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.9) !important;
    }
    
    /* 確保分隔線可見 */
    .news-area .newslisthr,
    .section-gap .newslisthr {
        border-color: rgba(255, 255, 255, 0.3) !important;
        opacity: 1 !important;
    }
    
    /* 輪播項目的文字也需要加強對比 */
    .blog-item-text,
    .blog-item-text h3,
    .blog-item-text .date {
        color: #FFFFFF !important;
        text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.9) !important;
    }
}