/* 恢復原本的 body 樣式，但只在 Bootstrap 容器內應用字體 */
body {
    font-family: 'Noto Sans TC', sans-serif;
}

a{
    text-decoration:none !important;
}

:root {
    /* Teal */
    --teal-95: #E5F4F3;
    --teal-90: #D2E7E6;
    --teal-80: #7DD5D5;
    --teal-60: #14A1A1;
    --teal-40: #006A6A;
    --teal-20: #173535;

    /* System colors - Brand */
    --brand-primary: var(--teal-40);
    --brand-onPrimary: #FFFFFF;
    --brand-primaryVar: var(--teal-90);
    --brand-onPrimaryVarLight: var(--teal-40);
    --brand-onPrimaryVarDark: var(--teal-20);


    /* Red */
    --red-95: #FFEDEB;
    --red-90: #FFDAD8;
    --red-80: #FFB4B1;
    --red-60: #E26E6C;
    --red-40: #AB3439;
    --red-20: #5C1719;

    /* System colors - Danger */
    --danger-primary: var(--red-40);
    --danger-onPrimary: #FFFFFF;
    --danger-primaryVar: var(--red-90);
    --danger-onPrimaryVarLight: var(--red-40);
    --danger-onPrimaryVarDark: var(--red-20);

    /* Green */
    --green-95: #EFF2E3;
    --green-90: #DDE6CD;
    --green-80: #B5D098;
    --green-60: #6D9F3E;
    --green-40: #3A6B00;
    --green-20: #1B3700;

    /* System colors - Success */
    --success-primary: var(--green-40);
    --success-onPrimary: #FFFFFF;
    --success-primaryVar: var(--green-90);
    --success-onPrimaryVarLight: var(--green-40);
    --success-onPrimaryVarDark: var(--green-20);

    /* Gray */
    --gray-100: #FFFFFF;
    --gray-95: #EDF1F7;
    --gray-90: #DBE4EE;
    --gray-80: #BFC7D1;
    --gray-60: #8A929B;
    --gray-40: #575F67;
    --gray-30: #364959;
    --gray-20: #091D2C;

    /* System colors - Neutral */
    --neutral-primary: var(--gray-40);
    --neutral-primaryDark: var(--gray-20);
    --neutral-onPrimary: #FFFFFF;
    --neutral-primaryVar: var(--gray-90);
    --neutral-onPrimaryVarLight: var(--gray-40);
    --neutral-onPrimaryVarDark: var(--gray-20);

    /* System colors - Surface */
    --surface-onSurface: var(--gray-20);
    --surface-onSurfaceVar: var(--gray-30);
    --surface-onSurfaceVarL: var(--gray-40);
    --surface-onSurfacebrand: var(--gray-60);
    --surface-outline: var(--gray-80);
    --surface-outlineVar: var(--gray-90);
    --surface-surface-100: var(--gray-100);
    --surface-surface-200: var(--gray-95);
}

/* 修正 Bootstrap 衝突的樣式 - 只針對特定問題 */
/* 強制隱藏應該隱藏的元素 */
.rwd-nav-row {
    display: none !important;
}

.pagetitle {
    display: none !important;
}

.logo h1 {
    display: none !important;
}

/* 隱藏側選單 */
.pageMenu {
    display: none !important;
}


/* 恢復原本的全域樣式 */
.text-theme {
    color: #4BA592
}

.text-darkgreen {
    color: var(--brand-primary)
}

.btn-dark {
    background-color: var(--brand-primary);
    color: var(--brand-onPrimary);
    border: none;
    border-radius: 5px;
}

.btn-dark:hover {
    background-color: var(--brand-primary);
    color: var(--brand-onPrimary);
    border: none;
    border-radius: 5px;
}

.btn-grey {
    background-color: #E9E9E9;
    color: var(--teal-40);
    border: none;
    padding: 8px 20px;
    border-radius: 5px;
}

.btn-light {
    background-color: var(--teal-90);
    color: var(--teal-40);
    font-weight: bold;
    border: none;
    border-radius: 5px;
    float: none;
}

.btn-light:hover {
    background-color: var(--teal-60);
    color: var(--brand-onPrimary);
    border: none;
    border-radius: 5px;
}

.theme-bg {
    background-color: var(--gray-95);
    ;
}

.pagination-title {
    position: relative;
}

.pagination-title::after {
    content: "";
    position: absolute;
    bottom: -6px;
    left: -16px;
    width: 8px;
    height: 44px;
    border-radius: 5px;
    background-color: var(--teal-60);
}

.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
    color: var(--teal-40) !important;
    font-weight: bold !important;
    border-bottom: 2px solid var(--teal-60) !important;
}

/* .border-green{
    border-right: 5px solid  var(--teal-40);
} */

.timeline-item {
    position: relative;
}

.timeline-lastitem {
    position: relative;
}

.timeline-item::before {
    content: '';
    position: absolute;
    height: 100%;
    width: 1px;
    top: 15px;
    right: 0;
    border: 2px solid var(--teal-40);
}

.timeline-lastitem::before,
.timeline-item::after {
    content: '';
    position: absolute;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: white;
    border: 4px solid var(--teal-40);
    right: 0;
    top: 7.5px;
    transform: translateX(35%);
}

/* 修正彈跳視窗問題 - 使用更高的z-index值 */
.modal {
    z-index: 9999 !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
}

.modal-backdrop {
    z-index: 9998 !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
}

.modal-dialog {
    z-index: 10000 !important;
    position: relative !important;
    margin: 1.75rem auto !important;
    pointer-events: auto !important;
}

.modal-content {
    z-index: 10001 !important;
    position: relative !important;
    pointer-events: auto !important;
}

.modal-body {
    max-height: 70vh !important;
    overflow-y: auto !important;
    pointer-events: auto !important;
}

.modal-header {
    pointer-events: auto !important;
}

.modal-footer {
    pointer-events: auto !important;
}

/* 確保所有按鈕都可以點擊 */
.modal .btn {
    pointer-events: auto !important;
    z-index: 10002 !important;
}

/* 修正背景遮罩問題 */
.modal.show .modal-dialog {
    transform: none;
}

/* 確保按鈕可以正常點擊 */
.btn {
    pointer-events: auto;
}

/* 修正「回上一頁」按鈕置中問題 - 覆蓋全域的 float: left */
.btn.text-center {
    float: none !important;
    display: block;
    text-align: center;
}