.message-container {
    display: flex;
    flex-direction: column;
    row-gap: .5em;
}

.message {
    width: fit-content;
    max-width: 80%;
    word-wrap: break-word;
    max-width: 80%;
    white-space: pre-wrap; /* 支援換行與空格 */
    padding: .5rem;
}

    .message.ai {
        background-color: #d0e6ff;
        text-align: left;
    }

    .message.user {
        background-color: #e2e2e2;
        /*text-align: right;*/
        margin-left: auto;
    }

.loading-indicator {
    font-style: italic;
    color: #666;
    padding: 8px;
}

/* Spinner inline 風格 */
.spinner-border.spinner-sm.inline {
    width: 1rem;
    height: 1rem;
    vertical-align: text-bottom;
    margin-left: 5px;
}

/*.message.ai::before {
    content: "🤖：";
}*/
.message.ai::before {
    content: "";
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('Images/頭像圖示_2.png'); /* ← 路徑改成你實際的圖片位置 */
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 6px;
    vertical-align: middle;
}
/*.message.user::after {
            content: "";
        }*/

#chat-input {
    resize: none; /* 禁止手動拉大 */
    height: auto; /* 自動高度 */
    flex-grow: 1; /* 讓它撐滿剩下的空間 */
}

#send-btn {
    white-space: nowrap; /* 防止文字換行 */
    height: auto;
}

.vh-100 {
    height: 100dvh !important;
}


/**********************************/
.message-wrap {
    word-break: break-word;
}

.message.ai {
    background-color: #d0e6ff;
}

.feedback-tools button {
    font-size: 14px;
    color: #666;
}

    .feedback-tools button:hover {
        color: #007bff;
    }

.feedback-tools .btn {
    border: none !important;
}

    .feedback-tools .btn:disabled {
        opacity: 0.6;
        pointer-events: none;
    }

/* 預設 icon 外觀 */
.feedback-tools i {
    /*color: #666;*/
}

/* 送出後狀態：has-feedback → 永久實心 icon */
/* hover 時切換 icon（尚未送出才有） */
/* 預設不寫 display，所有 <i> 都會照原樣 inline 顯示 */

.feedback-tools .wei-reply:not(.has-feedback):not(:hover) .wei-choose {
    display: none;
}

.feedback-tools .wei-reply:not(.has-feedback):hover .wei-unchoose {
    display: none;
}

.feedback-tools .wei-reply.has-feedback .wei-unchoose {
    display: none;
}


/* 共用 icon-style 按鈕，像 ChatGPT 樣式 */
.btn-icon {
    color: #FFF;
    background-color: transparent;  
    border: none;
    font-size: 1.25rem; /* fs-5 大小 */
}

    .btn-icon:hover,
    .btn-icon:focus-visible {
        background-color: rgba(255, 255, 255, 0.1);
        outline: none;
        color: #FFF;
    }

    .btn-icon:disabled {
        color: rgba(255, 255, 255, 0.4);
        pointer-events: none;
    }