﻿﻿/* ============================================================
   Lee Michael English - Sticky Header Refinement
   強制修正滑動後 Header 壓迫感與 Logo 貼邊問題
   ============================================================ */
/* 1. 全域文字與閱讀感優化 */
html, body {
    font-family: 'Noto Sans TC', -apple-system, sans-serif !important;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    color: #333333;
}

/* 2. 精準鎖定 bKind-06 類別內的 h3 文字 */
.bKind-06 .info h3 {
    text-shadow: 2px 2px 12px rgba(0, 0, 0, 0.85) !important; /* 僅針對文字邊框加深陰影 */
    font-weight: 700 !important; /* 確保維持粗體 */
    color: #ffffff !important; /* 確保文字為白色 */
}

/* 3. 同步加強英文小標 h6 的辨識度 (可選) */
.bKind-06 .info h6 {
    text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.85) !important;
    font-weight: 400 !important;
}

/* 4. 原有響應式寬度框架 (ibf01) */
@media (min-width: 576px)  { .ibf01 { max-width: 510px; } }
@media (min-width: 768px)  { .ibf01 { max-width: 690px; } }
@media (min-width: 992px)  { .ibf01 { max-width: 922px; } }
@media (min-width: 1200px) { .ibf01 { max-width: 1102px; } }
@media (min-width: 1400px) { .ibf01 { max-width: 1282px; } }

/* 5. 強制撐開捲動後的容器高度 */
header.sticky, 
.site-header.fixed-top, 
.is-sticky header,
.header-scrolled {
    height: auto !important; /* 取消 JS 可能設定的固定高度 */
    padding-top: 20px !important;
    padding-bottom: 20px !important;
    background-color: #ffffff !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08) !important; /* 增加投影讓層次更分明 */
    display: flex !important;
    align-items: center !important;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* 6. 針對 Logo 容器增加內部呼吸空間 */
header.sticky .logo, 
header.sticky .header-logo,
.fixed-top .logo {
    display: block !important;
    padding: 5px 0 !important; /* 在 Logo 上下額外增加 5px 的安全區 */
}

/* 7. 確保 Logo 圖片尺寸適中且不貼邊 */
header.sticky .logo img, 
header.sticky .header-logo img,
.fixed-top .header-logo img {
    max-height: 42px !important; /* 捲動後稍微縮小 Logo 以利閱讀內容 */
    width: auto !important;
    object-fit: contain !important;
    margin: 0 !important;
}

/* 8. 同步修正捲動後的選單文字垂直居中 */
header.sticky .nav-link, 
header.sticky .menu-item a {
    line-height: 1 !important;
    display: flex !important;
    align-items: center !important;
}

/* 9. 導覽列功能隱藏 (購物車與幣值) */
li.lang, li.cart, .header-right .cart, .header-right .lang {
    display: none !important;
}

/* 10. 團隊輪播置中優化 */
.swiper-container.team .swiper-wrapper {
    display: flex !important;
    justify-content: center !important;
}

/* 11. Logo 尺寸控制 */
.header-logo img, .logo img {
    height: auto !important;
    max-height: 55px !important;
    margin: 0 !important;
}

/* 12. 手機與平板響應式微調 (max-width: 991px) */
@media (max-width: 991px) {
    header, .site-header {
        padding-top: 0px !important;
        padding-bottom: 20px !important;
        margin-bottom: 20px !important;
    }

    .header-logo img, .logo img {
        max-height: 40px !important; /* 縮小 Logo 避免擠壓 */
    }  