.chat-container {
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
    background-color: #fffde7;
    border: 1px solid #fbc02d;
}

.chat-header {
    background-color: #fdd835;
    border-bottom: 1px solid #fbc02d;
}

.chat-header h3 {
    color: #4a4a4a   ;
    font-size: 19px;
}

.chat-header img {
    width: 50px;
    height: 50px;
    margin-right: 10px;
}



.input-box {
    border-top: 1px solid #fbc02d;
    background-color: #fdd835;
}

.chat-body::-webkit-scrollbar {
    width: 8px;
}
.chat-body::-webkit-scrollbar-track {
    background: #fffde7;
}
.chat-body::-webkit-scrollbar-thumb {
    background: #fdd835;
    border-radius: 4px;
}
.chat-body::-webkit-scrollbar-thumb:hover {
    background: #fbc02d;
}

.inform-message{

    background-color: #fff9c4;

}

.r-text {
    background-color: #fff9c4;
    color: #333;
    font-size: 13px;
}

.s-text {
    background-color: #fbc02d;
    color: #fff;
    font-size: 13px;
}

.menu-text {
    background-color: #ffd54f;
    color: #333;
    font-size: 12px;
}

.menu-text:hover {
    cursor: pointer;
    background-color: #fbc02d;
}

.time {
    font-size: 12px;
    color: #6d4848;
}



.message-input {

    font-size: 16px;
    border: 1px solid #ffd54f;
}
.message-input:focus {
    outline-color: #e19e01;
}
.send-button {
    background-color: #ffa000;
    color: #fff;
    font-size: 18px;
}

.send-button:hover {
    background-color: #FFB300;
}

.send-button:disabled {
    background-color: #FFE0B2;
}

.add-button {
    background-color: #ffa000;
    color: #fff;
    font-size: 18px;
}

.add-button:hover {
    background-color: #FFB300;
}





.inform-text2 {
    background-color: #fffffc;
    color: #040303;
    font-size: 14px; /* 폰트 사이즈 약간 증가 */
    font-weight: bold; /* 글자 두께 추가 */
    box-shadow: 2px 4px 8px rgba(0, 0, 0, 0.1); /* 부드러운 그림자 효과 */
    transition: background-color 0.3s ease, box-shadow 0.3s ease; /* 배경색 및 그림자 전환 효과 */
}

.inform-text {
    background-color: #fffffc;
    color: #040303;
    font-size: 14px; /* 폰트 사이즈 약간 증가 */
    font-weight: bold; /* 글자 두께 추가 */
    box-shadow: 2px 4px 8px rgba(0, 0, 0, 0.1); /* 부드러운 그림자 효과 */
    transition: background-color 0.3s ease, box-shadow 0.3s ease; /* 배경색 및 그림자 전환 효과 */
}

.notice-text {
    background-color: #fff9c4;
    color: #040303;
    font-size: 14px; /* 폰트 사이즈 약간 증가 */
    font-weight: bold; /* 글자 두께 추가 */
    box-shadow: 2px 4px 8px rgba(0, 0, 0, 0.1); /* 부드러운 그림자 효과 */
    transition: background-color 0.3s ease, box-shadow 0.3s ease; /* 배경색 및 그림자 전환 효과 */
}

.inform-text:hover {
    cursor: pointer;
    border: 1px solid #dfbc8e;
    box-shadow: 2px 6px 12px rgba(0, 0, 0, 0.3); /* 호버 시 그림자 더 강조 */
}

.inform-text::before , .inform-text2::before, .notice-text::before  {
    background-color: #27ae60 ;
}

.inform-item-text:hover {
    cursor: pointer;
    background-color: #FFB300;
    box-shadow: 2px 6px 12px rgba(0, 0, 0, 0.15); /* 호버 시 그림자 더 강조 */
}

.inform-item-text {

    background-color: #fffef3;
    color: #040303;
    font-size: 12px; /* 폰트 사이즈 약간 증가 */
    font-weight: bold; /* 글자 두께 추가 */
    box-shadow: 2px 4px 8px rgba(0, 0, 0, 0.1); /* 부드러운 그림자 효과 */


}

.notice-item-text {

    background-color: #fff9c4;
    color: #040303;
    font-size: 12px; /* 폰트 사이즈 약간 증가 */
    font-weight: bold; /* 글자 두께 추가 */
    box-shadow: 2px 4px 8px rgba(0, 0, 0, 0.1); /* 부드러운 그림자 효과 */


}

.inform-item-text::before,.notice-item-text::before  {

    background-color: #27ae60;

}


.end-item-text:hover {
    cursor: pointer;
    background-color: #FFB300;
    box-shadow: 2px 6px 12px rgba(0, 0, 0, 0.15); /* 호버 시 그림자 더 강조 */
}

.end-item-text {

    background-color: #fbf3d3;
    color: #040303;
    font-size: 12px; /* 폰트 사이즈 약간 증가 */
    font-weight: bold; /* 글자 두께 추가 */
    box-shadow: 2px 4px 8px rgba(0, 0, 0, 0.1); /* 부드러운 그림자 효과 */


}

.end-item-text::before {

    background-color: #27ae60    ;

}


.chat-modal-close,.back-icon {
    color: #90754b;
}

.chat-modal-close:hover,
.chat-modal-close:focus,
.back-icon:hover,
.back-icon:focus {
    color: #0e0909;
    text-decoration: none;
    cursor: pointer;
}

.responsed-header ,.responsed-container{

    background-color: #8B4513; /* Dark brown background */
    color: #ffffff; /* White font color */

}

.btn_end  {
    background-color: #f1c40f ;
    color: #000000   ;

}

.btn_end :hover {
    background-color: #d4ac0d ;
}

.btn_invite  {
    background-color: #f39c12  ;
    color: #000000;

}

.btn_invite :hover {
    background-color: #e67e22;
}