@import"https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&display=swap";*{box-sizing:border-box;margin:0;padding:0}:root{--primary-color:#009bf5;--background-default:#F2F4F9;--background-paper:#ffffff;--light-gray:#E7F1F7;--med-gray:#989FBB;--text-primary:#2C2C2C;--max-width:768px}body,html{font-family:Manrope,sans-serif;font-optical-sizing:auto;padding:0;margin:0}.chat-bot-page{height:100vh;width:100vw;display:grid;place-items:center;overflow:hidden}.chatbot-container{height:96vh;display:flex;flex-direction:column;justify-content:center;width:100%;gap:20px}.chatbot-messages-container{max-width:var(--max-width);width:100%;margin-inline:auto;padding-inline:10px}.chatbot-input-container{width:100%;background:var(--background-default);border-radius:10px;padding:10px;max-width:var(--max-width);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:10px}.chatbot-input-container input{width:100%;border:none;outline:none;background:transparent;font-size:16px}.chatbot-input-container input::placeholder{color:var(--text-primary)}.chatbot-input-container button{background:var(--primary-color);border-radius:50%;width:30px;height:30px;border:none;outline:none;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#fff}.no-messages{text-align:center;color:var(--text-primary);font-size:1.875rem;font-weight:600;line-height:2.25rem;word-spacing:5px}.message-box{font-size:15px;padding:10px 13px;width:fit-content;max-width:350px;background:var(--background-default);color:var(--text-primary);border-radius:10px 10px 10px 0}.message-box.user-message{background:var(--primary-color);color:#fff;border-radius:10px 10px 0}.message-avatar{width:30px;height:30px;border-radius:50%;overflow:hidden}.loading-more{text-align:center;font-size:12px;padding:5px;width:100%;background:var(--background-default);color:var(--text-primary);border-radius:10px 10px 0 0}.skeleton-loader{width:100%;height:100%;background:var(--background-default);animation:pulse 1s infinite}@keyframes pulse{0%{opacity:.5}to{opacity:1}}.animate-dots{display:flex;align-items:center}.dot{width:5px;height:5px;border-radius:50%;background:#333;animation:dot-blink 1s infinite;opacity:0}.dot:nth-child(1){animation-delay:0s}.dot:nth-child(2){animation-delay:.2s}.dot:nth-child(3){animation-delay:.4s}@keyframes dot-blink{0%,20%{opacity:0}50%{opacity:1}to{opacity:0}}
