/* 設定全站字型為細黑體 */
body {
    font-family: "Microsoft JhengHei Light", "PingFang TC Light", "Heiti TC Light", "Noto Sans TC", sans-serif !important;
    font-weight: 300 !important; /* 設定為細字 */
    color: #000 !important; /* 黑色文字 */
}

/* 移除導覽列背景色 */
.navbar {
    background-color: transparent !important; /* 無底色 */
}

/* 修改導覽列文字顏色 */
.navbar .navbar-nav .nav-link,
.navbar .navbar-brand {
    color: #000 !important; /* 黑色文字 */
}

/* 當滑鼠懸停時 */
.navbar .navbar-nav .nav-link:hover {
    color: #333 !important; /* 深灰色 */
}

/* 在導覽列內的 nav-item 之後加入水平分隔線 */
.navbar-nav .nav-item {
    position: relative; /* 確保分隔線定位 */
    padding-bottom: 10px; /* 增加下方間距 */
}

/* 在每個 nav-item 下方添加分隔線 */
.navbar-nav .nav-item::after {
    content: ""; /* 產生分隔線 */
    display: block;
    width: 100%; /* 分隔線與 nav-item 等寬 */
    height: 1px; /* 分隔線厚度 */
    background-color: #ccc; /* 分隔線顏色 */
    margin-top: 5px; /* 與文字保持距離 */
}

/* 避免最後一個 nav-item 也有底線 */
.navbar-nav .nav-item:last-child::after {
    display: none;
}

/* 修改按鈕背景顏色 */
.btn-dark {
    background-color: #d6d6d6 !important; /* 淺灰色 */
    border-color: #bfbfbf !important;
    color: #333 !important; /* 文字顏色 */
}

/* 滑鼠懸停時變化 */
.btn-dark:hover {
    background-color: #c0c0c0 !important;
    border-color: #a9a9a9 !important;
}

/* 自訂手風琴標題底色與字型 */
.accordion-button {
    background-color: #e0e0e0 !important; /* 自訂淺灰色 */
    color: #000 !important; /* 黑色文字 */
    line-height: 2 !important; /* 加大行高 */
    padding-top: 10px; /* 增加內距，使內容更舒適 */
    padding-bottom: 10px;
    font-family: inherit !important; /* 繼承全站字型 */
}

/* 當手風琴標題被點擊時 */
.accordion-button:focus, 
.accordion-button:not(.collapsed) {
    background-color: #d6d6d6 !important; /* 稍微深一點的灰色 */
    color: #000 !important;
}

/* 移除 Bootstrap 預設的陰影 */
.accordion-button:focus {
    box-shadow: none !important;
}

/* 修改手風琴內文的行高與字型 */
.accordion-body {
    line-height: 2 !important; /* 加大內文行高 */
    font-size: 1.1rem !important; /* 可選：稍微加大字體 */
    padding: 15px; /* 增加內距，讓內容更舒適 */
    font-family: inherit !important; /* 繼承全站字型 */
}

/* 修改漢堡選單圖示顏色，固定在左上側，改為白色底黑色線條 */
.navbar-toggler {
    border-color: rgba(0, 0, 0, 0.5) !important; /* 設定邊框顏色為黑色半透明 */
    background-color: #fff !important; /* 設定背景為白色 */
    position: fixed; /* 固定在左上角 */
    top: 10px;
    left: 10px;
    z-index: 1050; /* 確保在最上層 */
    padding: 8px 10px;
    border-radius: 5px; /* 圓角 */
}

.navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='black' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E") !important; /* 設定黑色三條線 */
}

/* 當 navbar-toggler 被點擊時 */
.navbar-toggler:focus, 
.navbar-toggler:hover {
    background-color: #f8f8f8 !important; /* 稍微改變背景顏色 */
}