:root{
    --white:#F8FDFF;
    --pink:#EF798A;
    --pink_dark:#ea5d72;
    --blue:#084298;
    --gray_light:#F1F3F4;
    --gray:#666666;

    
}

body{
    background-color: var(--gray_light);
    font-size: 0.8rem;
}


.card-body {
    padding: 2px;
    display:flex;
    flex-direction: column;
    justify-content: space-between;
    color:var(--gray);


}
.card-body p{
    /* padding: 8px; */
    padding:2 2 0 2;
   
    margin-bottom: 6px;
   

   
} 
.card-title{
    margin-bottom: 0;
    align-self: flex-end;
    margin-top: auto;
}
.card-body h3{
    text-align: right;
}
/* 預設高度 */
.card-fixed-height {
    
    height: 15vh;
    min-height: 10vh;
    
}

.profile-fixed-height{
    height: 15vh;
    min-height: 10vh;
}

/* 螢幕寬度 ≥ 768px (md) */
@media (min-width: 768px) {
    .card-fixed-height {
        height: 12vh;
    }
    .profile-fixed-height {
        height: 25vh;
    }
    #profile{
        margin-bottom: 30px;
    }
}

/* 螢幕寬度 < 576px (xs) */
@media (max-width: 575.98px) {
    .card-fixed-height {
        height: 8vh;
    }
    .profile-fixed-height {
        height: 16vh;
    }
     #profile{
        margin-bottom: 75px;
    }
}



#profile{
    font-size: 0.8rem;

}
#profile .card-body{
    background-color:var(--blue);
    color:var(--white);

} 






/* 整個選單框框背景顏色 */
.Select-control {
    background-color: var(--pink) !important;
    color: var(--white) !important;
    border-radius: 0px;   /* 圓角，可自行調整 */
    border: none;         /* 移除邊框 */
    height:5vh;
    outline: none;       
    box-shadow: none;   
}

/* placeholder 文字顏色 */
.Select-placeholder,
.Select-value {
    color: var(--white) !important;
    font-size: 0.8rem;
    display:flex;
    align-items: center;
}


/* 已選取的值 */
.Select-value-label {
    color: var(--white) !important;
}

/* 下拉選單背景 & 選項 */
.Select-menu-outer {
    background-color: var(--pink) !important;
    color: var(--white) !important;
}

/* 滑過選項的顏色 */
.Select-option.is-focused {
    background-color: var(--pink_dark) !important; /* 深一點的粉紅 */
    color: var(--white) !important;
   
}

/* 讓箭頭變白色 */
.Select-arrow {
    border-color: var(--white) transparent transparent !important;
}

.Select-control.is-focused,
input:focus,
.Select-option.is-selected {
    box-shadow: none !important;
    outline: none !important;
}

/* 讓清除叉叉變白色 */
.Select-clear,
.Select-clear:hover {
    color: var(--white) !important;
}

.Select-input {
    height:5vh;

}

#metric-dropdown .Select-control{
    background-color: transparent!important;
    color: black !important;

    
}

#metric-dropdown .Select-placeholder,
#metric-dropdown .Select-value  {
    color: var(--pink) !important;
    font-size: 1rem;
    display:flex;
    align-items: center;
}

#metric-dropdown .Select-value-label {
    color: var(--pink)!important;
}


#metric-dropdown .Select-arrow {
    border-color: var(--pink) transparent transparent !important;
}


.info_icon{
    width: 0.7rem;
    height: 0.7rem;
    margin-bottom:2.5px;
    display: inline-block;
    vertical-align:middle;
    cursor: pointer;
   
}

.tooltip-mobile{
    font-size: 0.6rem;
}