/* 5b.css */

/* 全域設定：移除所有 a 標籤的下底線 */
a {
    text-decoration: none;
}

/* 修改主要背景的預設狀態 */
.bg-primary {
    background-color: #5e8de6 !important;
}

/* 修改主要按鈕的預設狀態 */
.btn-primary {
    background-color: #5e8de6;
    border-color: #5e8de6;
    color: #ffffff;
}

/* 修改主要按鈕的懸停 (hover) 狀態 */
.btn-primary:hover {
    background-color: #3b72b1;
    border-color: #3b72b1;
    color: #ffffff;
}

/* 修改主要按鈕的活動/點擊 (active) 狀態 */
.btn-primary:active {
    background-color: #cc4129;
    border-color: #cc4129;
    color: #ffffff;
}

/* 修改主要按鈕的焦點 (focus) 狀態，通常是外框 */
.btn-primary:focus {
    box-shadow: 0 0 0 0.25rem rgba(255, 87, 51, 0.5);
}

/* 修改主要按鈕的禁用 (disabled) 狀態 */
.btn-primary:disabled {
    background-color: #ff5733;
    border-color: #ff5733;
    opacity: 0.65;
}

/* 底部導覽列圖標大小 */
.navbar.fixed-bottom .bi {
    font-size: 1.75rem;
}

/* 當前頁面圖標的橘色樣式 */
.navbar .nav-link.active-icon .bi {
    color: #daa40f;
}

/* 側邊導覽列圖標大小 */
.col-sm-2 .navbar .bi {
    font-size: 2rem;
}

/* 確保 navbar 連結在 active 時有變色效果 */
.nav-link.active {
    color: #da0f7e;
}

/* 自定義區段樣式 */
.custom-section {
    padding: 40px 0;
    background-color: #f8f9fa;
    border-radius: 8px;
}
.tooltip-demo {
    cursor: pointer;
}

/* 側邊導覽列樣式 (sm 尺寸以上顯示) */
.col-sm-2 > .navbar {
    min-height: 100vh;
    position: sticky;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 1rem;
    max-width: 8rem;
}


/* 自訂彈出式選單通用樣式 */
.custom-menu {
    position: fixed;
    bottom: 56px;
    z-index: 1040;
    display: none;
    width: max-content;
    min-width: 100px;
}

/* 點擊後，選單顯示的樣式 */
.custom-menu.show {
    display: block !important;
}

/* 確保列表項的樣式並靠右對齊，新增顏色樣式 */
.custom-menu .list-group-item {
    cursor: pointer;
    text-align: right;
    font-size: 1.2rem;
    color: #007bff; /* 將文字顏色改為 Bootstrap 的預設藍色 */
}

/* log-in botton */
a.btn.login-btn {
    height: 3rem;
    /* border-radius: 1.5rem; */
    font-size: 1rem;
    line-height: 1rem;
    padding: 0 0rem;
    min-width: 8rem !important;
    max-width: 100%;
}

.google-btn-icon {
    width: 1.75rem;
    height: 1.75rem;
    margin-right: 0.625rem;
    vertical-align: middle;
}

.apple-btn-icon {
    width: 1.6rem;
    height: 1.66rem;
    margin-right: 1.4rem;
    vertical-align: middle;
}

/* 限制 card 的最大高度，確保置底效果明顯 */
.card.shadow-sm {
    max-height: 50vh; /* 限制卡片高度 */
    overflow: auto; /* 如果內容過多，顯示滾動條 */
}