.chat-container{width:80%;height:100vh;margin:0 auto;max-width:900px;background-color:#f7f7f7;border-radius:10px;overflow:hidden}.message-display-area{display:flex;flex-direction:column-reverse;overflow-y:auto;height:calc(100vh - 150px);padding:20px;background-color:#fff;border-bottom:1px solid #ddd}.message{display:flex;margin-bottom:10px;width:100%}.message .assistant,.message .user{max-width:80%;padding:10px;border-radius:15px;word-break:break-word}.message .user{margin-left:auto;background-color:#d1e7dd}.message .assistant{margin-right:auto;background-color:#e9e9e9}.message-input-form{display:flex;padding:10px}input[type=text]{flex:1 1;padding:10px;border:1px solid #ddd;border-radius:5px;margin-right:10px}button{padding:10px 15px;background-color:#3498db;color:#fff;border:none;border-radius:5px;cursor:pointer}button:hover{background-color:#2980b9}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.loader{align-self:flex-end;margin-bottom:10px;opacity:.7;border:5px solid #f3f3f3;border-top-color:#3498db;border-radius:50%;width:50px;height:50px;animation:spin 2s linear infinite}