#AI3-WebChat body {
    background-color: transparent;
}

#dvSmartAgentMainFrm {
    border: 1px solid #e06e88;
    border-radius: 15px;
}

#AI3-WebChat .accesskey_U {
    color: #ffae00 !important;
    /* CUS Ai3/Tina.Wang */
}

#AI3-WebChat .EditorZone {
    border-top: 1px solid #ffae00;
    /* CUS Ai3/Tina.Wang */
}

#AI3-WebChat .RichMenuZone {
    padding: 5px 15px 0px 15px;
    background-color: #e06e88 !important;
    border-top: 1px solid #e06e88;
}

#ToolZone {
    background: transparent;
}

#AI3-WebChat .ChatMessageRight .ChatMessageContent {
    border: 1px solid #ff8520;
    /* CUS Ai3/Tina.Wang */
    background-color: #ff8520;
    /* CUS Ai3/Tina.Wang */
    color: #ffffff;
}

#AI3-WebChat .ChatMessageRight .ChatMessageContent:hover {
    border: 1px solid #ff8520;
    /* CUS Ai3/Tina.Wang */
    background-color: #ff8520;
    /* CUS Ai3/Tina.Wang */
    color: #ffffff;
}

#AI3-WebChat .ChatMessageContent {
    border-radius: 15px;
}

#AI3-WebChat .ChatMessageLeft .ChatMessageContent {
    border: 1px solid #f7f2e7;
    /* CUS Ai3/Tina.Wang */
    background-color: #f7f2e7;
    /* CUS Ai3/Tina.Wang */
}

#AI3-WebChat .ChatMessageLeft .ChatMessageContent:hover {
    border: 1px solid #f7f2e7;
    /* CUS Ai3/Tina.Wang */
    background-color: #f7f2e7;
    /* CUS Ai3/Tina.Wang */
}

#AI3-WebChat .QuickreplySlide {
    padding: 0px !important;
    height: 30px !important;
    font-size: 0.58rem;
    background-color: #ff8520;
    /* CUS Ai3/Tina.Wang */
    color: #ffffff;
}

#AI3-WebChat .bg-color {
    background-color: #ffae00 !important;
    /* CUS Ai3/Tina.Wang */
}

#AI3-WebChat .font-color {
    color: #ffffff !important;
}

#ToolZone>.swiper-container>.QuickReply_Vertical>.QuickreplySlide {
    background: #b8556c;
}

#AI3-WebChat .cardsSlide {
    background-color: white;
}

#AI3-WebChat .avatar_box .potrait .avatar_pic {
    background-color: #e06e88;
}

#webmakecallbtn {
    color: white;
}

#webmakecallbtn:hover {
    color: #ff8520;
    /* CUS Ai3/Tina.Wang */
}

#AI3-WebChat .modal-header button {
    /* Modal Header close button */
    color: white !important;
}

#AI3-WebChat .modal-header button:hover {
    color: #e06e88 !important;
    text-shadow: 4px 4px 3px rgba(20%, 20%, 40%, 0.5) !important;
}

#AI3-WebChat .modal-header div {
    /* Modal Header Font */
    color: white;
}

#AI3-WebChat .modal-header {
    background-color: #ff8520;
    /* CUS Ai3/Tina.Wang */
}

#dropdown-menu>li>span {
    color: #ff8520;
    /* CUS Ai3/Tina.Wang */
}

#dropdown-menu {
    /* Dropdown Menu  Background */
    background-color: white;
}

#AI3-WebChat .dropdown-menu .divider {
    /* Dropdown Menu  Divider */
    background-color: #e06e88;
}

#AI3-WebChat .modal-footer div>button {
    background-color: #ff8520 !important;
    /* CUS Ai3/Tina.Wang */
    color: white !important;
}


#forgetPasswordlink {
    background-color: #e06e88 !important;
    color: white !important;
    font-weight: bold;
}


#registerAcount {
    font-weight: bold;
    background-color: #ff8520 !important;
    /* CUS Ai3/Tina.Wang */
    color: white !important;
}


#loginbtn {
    font-weight: bold;
    background-color: #ff8520 !important;
    /* CUS Ai3/Tina.Wang */
    color: white !important;
}

#AI3-WebChat .nicknamebtn {
    font-weight: bold;
    background-color: #ff8520 !important;
    /* CUS Ai3/Tina.Wang */
    color: white !important;
}

#AI3-WebChat .fullwidthBtn {
    background-color: #ff8520 !important;
    /* CUS Ai3/Tina.Wang */
    color: white !important;
}

#AI3-WebChat .fullwidthBtn:hover {
    color: white;
    box-shadow: 4px 4px 3px rgba(20%, 20%, 40%, 0.5);
}

#AI3-WebChat .avatar_nickname_edit {
    color: #ff8520;
    /* CUS Ai3/Tina.Wang */
}

#s_submit {
    background: transparent;
    border: solid 2px #e06e88;
    font-weight: bold;
    color: #ff8520;
    /* CUS Ai3/Tina.Wang */
}

#AI3-WebChat .leave-chat {
    background: url(../../image/03/close.svg) no-repeat center center;
}

#AI3-WebChat .leave-chat:hover {
    background: url(../../image/03/close-hover.svg) no-repeat center center;
}

#ChangeEditorButton {
    background: url(../../image/03/keyboard.svg) no-repeat center center;
}

#ChangeEditorButton:hover {
    background: url(../../image/03/keyboard-hover.svg) no-repeat center center;
}

#MessageList {
    bottom: 45px;
    padding: 5px 10px;
    border-top: 2px solid #ffae00;
    /* CUS Ai3/Tina.Wang */
    /*background-image: url(../../image/03/back.jpg);*/
    /* CUS Ai3/Tina.Wang */
}

#ChatZone {
    top: 45px;
    /*background-image: url(../../image/03/back.jpg);*/
    /* CUS Ai3/Tina.Wang */
}

#ChatZone>#MessageList {
    bottom: 45px;
    /*background-image: url(../../image/03/back.jpg);*/
    /* CUS Ai3/Tina.Wang */
}

#ChangeRichMenuButton {
    background: url(../../image/03/richmenu.png) no-repeat center center;
    background-size: contain;
}

#ChangeRichMenuButton:hover {
    background: url(../../image/03/richmenu-hover.png) no-repeat center center;
    background-size: contain;
}

/* 20240809 Ai3/Tina.Wang
#SendButton {
    background: url(../../image/03/sendIcon1.svg);
    background-size: contain;
    height: 26px !important;
    background-repeat: no-repeat;
}

#SendButton:hover {
    background: url(../../image/03/sendIcon3.svg);
    background-size: contain;
    height: 26px !important;
    background-repeat: no-repeat;
}

#SendButton.active {
    background: url(../../image/03/sendIcon2.svg);
    background-size: contain;
    height: 26px !important;
    background-repeat: no-repeat;
}
*/

.IconButton:hover {
    transform: scale(1.2, 1.2);
}

#SendButton {
    background: #ba7f00;
    height: 40px !important;
    width: 40px !important;
    border-radius: 20px;
    align-content: center;
    color: #ffffff;
    padding: 0px;
}

#SendButton:hover {
    background: #ba7f00;
    background-size: contain;
    height: 40px !important;
    width: 40px !important;
    background-repeat: no-repeat;
    border-radius: 20px;
    text-align: center;
    align-content: center;
    color: #ffffff;
}

#SendButton.active {
    background: #ba7f00;
    background-size: contain;
    height: 40px !important;
    width: 40px !important;
    background-repeat: no-repeat;
    border-radius: 20px;
    text-align: center;
    align-content: center;
    color: #ffffff;
}

/* 20240809 Ai3/Tina.Wang End */

#audio-wave {
    background: url(../../image/03/audio-wave.gif);
    background-size: contain;
    height: 40px !important;
    /* CUS 20241111 �j�p�ק� */
    width: 40px !important;
    /* CUS 20241111 �j�p�ק� */
    background-repeat: no-repeat;
    margin-left: 5px;
}


#SpeechToTextBtn {
    background: url(../../image/03/mic.png);
    background-size: contain;
    height: 40px !important;
    /* CUS 20241111 �j�p�ק� */
    width: 40px !important;
    /* CUS 20241111 �j�p�ק� */
    background-repeat: no-repeat;
    margin-left: 5px;
}


#SpeechToTextEndBtn {
    background: url(../../image/03/mic-animate.png);
    background-size: contain;
    height: 40px !important;
    /* CUS 20241111 �j�p�ק� */
    width: 40px !important;
    /* CUS 20241111 �j�p�ק� */
    background-repeat: no-repeat;
    margin-left: 5px;
}


#play-tts-btn {
    background: url(../../image/03/speaker.png);
    background-size: contain;
    height: 20px !important;
    width: 20px !important;
    background-repeat: no-repeat;
    margin-left: 5px;
}


#DefaultStartTTSBtn {
    background: url(../../image/03/speaker-on.png);
    background-size: contain;
    height: 40px !important;
    /* CUS 20241111 �j�p�ק� */
    width: 40px !important;
    /* CUS 20241111 �j�p�ק� */
    background-repeat: no-repeat;
    margin-left: 5px;
}


#DefaultCloseTTSBtn {
    background: url(../../image/03/speaker-mute.png);
    background-size: contain;
    height: 40px !important;
    /* CUS 20241111 �j�p�ק� */
    width: 40px !important;
    /* CUS 20241111 �j�p�ק� */
    background-repeat: no-repeat;
    margin-left: 5px;
}

#AI3-WebChat .collapseRightZone {
    background: url(../../image/03/angle-left-solid.svg) no-repeat center center;
}

#AI3-WebChat .collapseRightZone:hover {
    background: url(../../image/03/angle-left-solid-hover.svg) no-repeat center center;
}

#ApplyAgentButton {
    background: url(../../image/03/chat.svg) no-repeat center center;
    background-size: contain;
}

#ApplyAgentButton:hover {
    background: url(../../image/03/chat-hover.svg) no-repeat center center;
    background-size: contain;
}

#AttachmentButton {
    background: url(../../image/03/attachment.svg) no-repeat center center;
    background-size: contain;
}

#AttachmentButton:hover {
    background: url(../../image/03/attachment-hover.svg) no-repeat center center;
    background-size: contain;
}

#ImageButton {
    background: url(../../image/03/image2.png) no-repeat center center;
    background-size: contain;
}

#ImageButton:hover {
    background: url(../../image/03/image2-hover.png) no-repeat center center;
    background-size: contain;
}

#EmojiButton {
    background: url(../../image/03/emoji-happy.svg) no-repeat center center;
    background-size: contain;
}

#EmojiButton:hover {
    background: url(../../image/03/emoji-happy-hover.svg) no-repeat center center;
    background-size: contain;
}

#hamburger-menu {
    background: url(../../image/03/list.svg) no-repeat center center;
    background-size: contain;
}

#hamburger-menu:hover {
    background: url(../../image/03/list-hover.svg) no-repeat center center;
    background-size: contain;
}


#fontsize-menu {
    background: url(../../image/03/fontSizeHelf.svg) no-repeat center center;
    background-size: contain;
}

#fontsize-menu:hover {
    background: url(../../image/03/fontSizeHelf-hover.svg) no-repeat center center;
    background-size: contain;
}

#AI3-WebChat .dynamic_cont {
    /*background-image: url(../../image/03/back.jpg);*/
    /* CUS Ai3/Tina.Wang */
}

#AI3-WebChat .member .dynamic_tab_icon {
    background: url(../../image/03/people_setup.svg) no-repeat center center;
    background-size: contain;
}

#AI3-WebChat .member.active .dynamic_tab_icon {
    background: url(../../image/03/people_setup-active.svg) no-repeat center center;
    background-size: contain;
}

#AI3-WebChat .addservicerecord .dynamic_tab_icon {
    background: url(../../image/03/servicecase.png) no-repeat center center;
    background-size: contain;
}

#AI3-WebChat .addservicerecord.active .dynamic_tab_icon {
    background: url(../../image/03/servicecase-active.png) no-repeat center center;
    background-size: contain;
}

#AI3-WebChat .servicerecord .dynamic_tab_icon {
    background: url(../../image/03/list.png) no-repeat center center;
    background-size: contain;
}

#AI3-WebChat .servicerecord.active .dynamic_tab_icon {
    background: url(../../image/03/list-active.png) no-repeat center center;
    background-size: contain;
}

#AI3-WebChat .avatar_box .potrait .avatar_pic .avatar_pic_icon {
    background: url(../../image/03/camera.svg) no-repeat center center;
}

#AI3-WebChat .swiper-button-next {
    background-image: url("../../image/03/swiper_arrow_next.png");
}

#AI3-WebChat .swiper-button-prev {
    background-image: url("../../image/03/swiper_arrow_prev.png");
}

#LoginButton {
    background: url(../../image/03/user-solid.svg) no-repeat center center;
    background-size: contain;
}

#LoginButton:hover {
    background: url(../../image/03/user-solid-hover.svg) no-repeat center center;
    background-size: contain;
}

#Editor {
    border: none;
}

#AI3-WebChat .btn {
    background: #ff8520;
    /* CUS Ai3/Tina.Wang */
    color: #fff;
}

#AI3-WebChat .btn_box button {
    background: #ff8520;
    /* CUS Ai3/Tina.Wang */
    color: #fff;
}

#AI3-WebChat .btn_box div {
    background: #ff8520;
    /* CUS Ai3/Tina.Wang */
    color: #fff;
}


#AI3-WebChat .ChatMessage.ChatMessageRight .ChatMessageFileContentInfo {
    color: #fff;
}


#AI3-WebChat .ChatMessage.ChatMessageRight .Link[href] {
    color: #fff;
}

#AI3-WebChat .ChatMessage.ChatMessageRight .link-text {
    color: #fff !important;
}


#AI3-WebChat .ChatMessage.ChatMessageRight label[action] {
    color: #fff;
}


#AI3-WebChat .service-group-item {
    background: #efb6c3;
}


#AI3-WebChat .service-group-item:hover {
    background: #ff8520;
    /* CUS Ai3/Tina.Wang */
    color: #fff;
}


#AI3-WebChat .hotTopic-item {
    background: #efb6c3;
}


#AI3-WebChat .hotTopic-item:hover {
    background: #ff8520;
    /* CUS Ai3/Tina.Wang */
    color: #fff;
}


#openvidubtn {
    color: white;
}

#openvidubtn:hover {
    color: #ff8520;
    /* CUS Ai3/Tina.Wang */
}




.GptRelated {}

.GptRelated:hover {
    background-color: rgb(255, 138, 167);
}


.ChatMessageGptSatisDislike {
    background-image: url(../../image/03/ChatMessageGptSatisDislike.svg);
}

.ChatMessageGptSatisOK {
    background-image: url(../../image/03/ChatMessageGptSatisOK.svg);
}

.ChatMessageGptSatisLike {
    background-image: url(../../image/03/ChatMessageGptSatisLike.svg);
}

.ChatMessageGptSatisDislike:hover {
    background-image: url(../../image/03/ChatMessageGptSatisDislike_hover.svg);
}

.ChatMessageGptSatisOK:hover {
    background-image: url(../../image/03/ChatMessageGptSatisOK_hover.svg);
}

.ChatMessageGptSatisLike:hover {
    background-image: url(../../image/03/ChatMessageGptSatisLike_hover.svg);
}

.ChatMessageGptSatisDislike_clicked {
    background-image: url(../../image/03/ChatMessageGptSatisDislike_clicked.svg);
    float: right;
}

.ChatMessageGptSatisOK_clicked {
    background-image: url(../../image/03/ChatMessageGptSatisOK_clicked.svg);
    float: right;
}

.ChatMessageGptSatisLike_clicked {
    background-image: url(../../image/03/ChatMessageGptSatisLike_clicked.svg);
    float: right;
}


.card-title-helf {
    color: rgb(184, 58, 87);
}

.card-title-full {
    color: rgb(255, 255, 255);
}

.fontsize-btn-helf {
    border: 1px solid rgb(184, 58, 87);
    color: rgb(184, 58, 87);
}

.fontsize-btn-full {
    border: 1px solid rgb(255, 255, 255);
    color: rgb(255, 255, 255);
}


.fontsize-btn:hover {
    background-color: #ff8520;
    /* CUS Ai3/Tina.Wang */
    color: rgb(255, 255, 255);
}

.fontsize-active {
    background-color: #ff8520;
    /* CUS Ai3/Tina.Wang */
    color: rgb(255, 255, 255);
}