#root{width:100%}.chat-container{width:100%;height:100vh;display:flex;justify-content:center;align-items:center;padding:30px}.chat-content{background:linear-gradient(135deg,#fff,#f8f9fa);border-radius:20px;width:100%;height:100%;display:flex;flex-direction:column;box-shadow:0 20px 60px #0000004d;overflow:hidden;animation:slideUp .4s ease-out}.chat-header{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:20px 24px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 4px 12px #0000001a}.chat-header .header-left{display:flex;align-items:center;gap:16px}.chat-header .header-left .avatar-header{position:relative;width:56px;height:56px;background:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;border:3px solid rgba(255,255,255,.3);box-shadow:0 4px 12px #00000026}.chat-header .header-left .avatar-header .bot-icon-header{font-size:32px;color:#667eea}.chat-header .header-left .avatar-header .ant-badge{position:absolute;bottom:2px;right:2px}.chat-header .header-left .header-info{display:flex;flex-direction:column}.chat-header .header-left .header-info h3{margin:0;font-size:20px;font-weight:600;color:#fff}.chat-header .header-left .header-info .status-text{font-size:13px;color:#ffffffe6;margin-top:4px}.chat-header .header-actions{display:flex;gap:8px}.chat-header .header-actions .header-btn{color:#fff;font-size:18px}.chat-header .header-actions .header-btn:hover{background-color:#fff3;color:#fff}.chatbot-messages{flex:1;overflow-y:auto;padding:24px;background:#f8f9fa}.chatbot-messages::-webkit-scrollbar{width:8px}.chatbot-messages::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px}.chatbot-messages::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:10px}.chatbot-messages::-webkit-scrollbar-thumb:hover{background:#a8a8a8}.message-row{display:flex;margin-bottom:24px;animation:messageSlideIn .3s ease-out}.message-row .avatar{width:44px;height:44px;margin-right:12px;flex-shrink:0;background:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;border:2px solid #e0e0e0;box-shadow:0 2px 8px #0000001a}.message-row .avatar .bot-icon{font-size:24px;color:#667eea}.message-row .message-content .message-bubble{position:relative;padding:14px 18px;border-radius:18px;word-wrap:break-word;box-shadow:0 2px 8px #0000001a;transition:all .2s ease}.message-row .message-content .message-bubble .message-text{margin:0;line-height:1.6;font-size:15px;white-space:pre-wrap}.message-row .message-content .message-bubble .copy-btn{position:absolute;top:6px;right:6px;opacity:0;transition:opacity .2s ease;font-size:12px;color:#666}.message-row .message-content .message-time{font-size:11px;color:#999;margin-top:6px;padding:0 8px}.typing-indicator{background:#fff;padding:14px 18px;border-radius:18px 18px 18px 4px;box-shadow:0 2px 8px #0000001a}.typing-indicator .loading-dots{display:flex;gap:5px;align-items:center}.typing-indicator .loading-dots span{width:9px;height:9px;background-color:#667eea;border-radius:50%;animation:bounce 1.4s infinite ease-in-out}.chat-input-area{padding:20px 24px;background:#fff;border-top:1px solid #e0e0e0;box-shadow:0 -4px 12px #0000000d}.chat-input-area .input-wrapper .chat-input{flex:1;border:2px solid #e0e0e0;border-radius:24px;padding:14px 18px;font-size:15px;resize:none;min-height:50px;max-height:120px;overflow-y:auto;transition:all .3s ease;font-family:inherit;line-height:1.5}.chat-input-area .input-wrapper .send-btn{width:48px;height:48px;background:linear-gradient(135deg,#667eea,#764ba2);border:none;box-shadow:0 4px 12px #667eea66;transition:all .3s ease;font-size:18px}@media (max-width: 768px){.chat-container{padding:0}.chat-content{width:100%;height:100vh;max-height:100vh;border-radius:0}.message-row .message-content{max-width:80%}.chat-header .header-left .avatar-header{width:48px;height:48px}.chat-header .header-left .avatar-header .bot-icon-header{font-size:28px}.chat-header .header-left .header-info h3{font-size:18px}}@media (max-width: 1024px) and (min-width: 769px){.chat-content{max-width:700px}}@media (prefers-color-scheme: dark){.chat-content{background:linear-gradient(135deg,#1a1a1a,#2d2d2d)}.chatbot-messages{background:#1a1a1a}.message-bubble.bot{background:#2d2d2d;color:#e0e0e0}.message-bubble.bot .copy-btn{color:#999}.message-bubble.bot .copy-btn:hover{color:#667eea}.avatar{background:#2d2d2d;border-color:#404040}.typing-indicator{background:#2d2d2d}.chat-input-area{background:#2d2d2d;border-top-color:#404040}.chat-input-area .chat-input{background:#1a1a1a;border-color:#404040;color:#e0e0e0}.chat-input-area .chat-input:focus{border-color:#667eea}.chat-input-area .chat-input::placeholder{color:#666}}.layout-container{display:flex;min-height:100vh}.sidebar{width:240px;background-color:#1f2937;color:#fff;padding:1rem}.main-content{flex:1;width:100%;height:100%;display:flex}.demo-logo-vertical{padding:1rem;text-align:center;font-weight:700;font-size:large;display:flex;gap:10px;align-items:center;justify-content:center}.chat-modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;justify-content:center;align-items:center;z-index:1000;animation:fadeIn .3s ease-in-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.chat-modal-content{background:linear-gradient(135deg,#fff,#f8f9fa);border-radius:20px;width:90%;max-width:480px;height:85vh;max-height:700px;display:flex;flex-direction:column;box-shadow:0 20px 60px #0000004d;overflow:hidden;animation:slideUp .3s ease-out}@keyframes slideUp{0%{transform:translateY(50px);opacity:0}to{transform:translateY(0);opacity:1}}.chat-modal-header{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:20px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 4px 12px #0000001a}.chat-modal-header .header-left{display:flex;align-items:center;gap:12px}.chat-modal-header .header-left .avatar-header{position:relative}.chat-modal-header .header-left .avatar-header .gender-icon-header{font-size:48px;border:3px solid white;border-radius:50%;background:#fff;padding:2px}.chat-modal-header .header-left .avatar-header .ant-badge{position:absolute;bottom:2px;right:2px}.chat-modal-header .header-left .header-info{display:flex;flex-direction:column}.chat-modal-header .header-left .header-info h3{margin:0;font-size:18px;font-weight:600;color:#fff}.chat-modal-header .header-left .header-info .status-text{font-size:12px;color:#ffffffe6;margin-top:2px}.chat-modal-header .header-actions{display:flex;gap:8px}.chat-modal-header .header-actions .header-btn{color:#fff;font-size:18px}.chat-modal-header .header-actions .header-btn:hover{background-color:#fff3;color:#fff}.chat-modal-header .header-actions .header-btn.close-btn:hover{background-color:#ff3b30cc}.chat-messages{flex:1;overflow-y:auto;padding:20px;background:#f8f9fa}.chat-messages::-webkit-scrollbar{width:6px}.chat-messages::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px}.chat-messages::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:10px}.chat-messages::-webkit-scrollbar-thumb:hover{background:#a8a8a8}.message-row{display:flex;margin-bottom:20px;animation:messageSlideIn .3s ease-out}.message-row.user{justify-content:flex-end}.message-row.user .message-content{align-items:flex-end}.message-row.bot{justify-content:flex-start}.message-row .avatar{width:40px;height:40px;margin-right:12px;flex-shrink:0}.message-row .avatar .gender-icon{font-size:40px;border:2px solid #e0e0e0;border-radius:50%;background:#fff;padding:2px}.message-row .message-content{display:flex;flex-direction:column;max-width:70%}.message-row .message-content .message-bubble{position:relative;padding:12px 16px;border-radius:18px;word-wrap:break-word;box-shadow:0 2px 8px #0000001a;transition:all .2s ease}.message-row .message-content .message-bubble:hover{box-shadow:0 4px 12px #00000026}.message-row .message-content .message-bubble:hover .copy-btn{opacity:1}.message-row .message-content .message-bubble.user{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-bottom-right-radius:4px}.message-row .message-content .message-bubble.bot{background:#fff;color:#333;border-bottom-left-radius:4px}.message-row .message-content .message-bubble .message-text{margin:0;line-height:1.5;font-size:14px;white-space:pre-wrap}.message-row .message-content .message-bubble .copy-btn{position:absolute;top:4px;right:4px;opacity:0;transition:opacity .2s ease;font-size:12px;color:#666}.message-row .message-content .message-bubble .copy-btn:hover{color:#667eea}.message-row .message-content .message-bubble .message-image-container .message-image{max-width:100%;border-radius:8px;margin-top:8px}.message-row .message-content .message-time{font-size:11px;color:#999;margin-top:4px;padding:0 8px}@keyframes messageSlideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.typing-indicator{background:#fff;padding:12px 16px;border-radius:18px 18px 18px 4px;box-shadow:0 2px 8px #0000001a}.typing-indicator .loading-dots{display:flex;gap:4px;align-items:center}.typing-indicator .loading-dots span{width:8px;height:8px;background-color:#667eea;border-radius:50%;animation:bounce 1.4s infinite ease-in-out}.typing-indicator .loading-dots span:nth-child(1){animation-delay:-.32s}.typing-indicator .loading-dots span:nth-child(2){animation-delay:-.16s}@keyframes bounce{0%,80%,to{transform:scale(0);opacity:.5}40%{transform:scale(1);opacity:1}}.chat-input-area{padding:16px 20px;background:#fff;border-top:1px solid #e0e0e0;box-shadow:0 -4px 12px #0000000d}.chat-input-area .input-wrapper{display:flex;align-items:flex-end;gap:12px}.chat-input-area .input-wrapper .chat-input{flex:1;border:2px solid #e0e0e0;border-radius:24px;padding:12px 16px;font-size:14px;resize:none;max-height:120px;min-height:50px;overflow-y:auto;transition:all .3s ease;font-family:inherit}.chat-input-area .input-wrapper .chat-input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.chat-input-area .input-wrapper .chat-input:disabled{background-color:#f5f5f5;cursor:not-allowed}.chat-input-area .input-wrapper .chat-input::placeholder{color:#999}.chat-input-area .input-wrapper .chat-input::-webkit-scrollbar{width:4px}.chat-input-area .input-wrapper .chat-input::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:10px}.chat-input-area .input-wrapper .send-btn{width:44px;height:44px;background:linear-gradient(135deg,#667eea,#764ba2);border:none;box-shadow:0 4px 12px #667eea66;transition:all .3s ease}.chat-input-area .input-wrapper .send-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 16px #667eea80}.chat-input-area .input-wrapper .send-btn:active:not(:disabled){transform:translateY(0)}.chat-input-area .input-wrapper .send-btn:disabled{background:#d0d0d0;box-shadow:none;cursor:not-allowed}@media (max-width: 768px){.chat-modal-content{width:100%;height:100vh;max-height:100vh;border-radius:0}.message-row .message-content{max-width:80%}.chat-modal-header .header-left .avatar-header .gender-icon-header{font-size:40px}.chat-modal-header .header-left .header-info h3{font-size:16px}}@media (prefers-color-scheme: dark){.chat-modal-content{background:linear-gradient(135deg,#1a1a1a,#2d2d2d)}.chat-messages{background:#1a1a1a}.message-bubble.bot{background:#2d2d2d;color:#e0e0e0}.chat-input-area{background:#2d2d2d;border-top-color:#404040}.chat-input-area .chat-input{background:#1a1a1a;border-color:#404040;color:#e0e0e0}.chat-input-area .chat-input:focus{border-color:#667eea}}@font-face{font-family:Roboto;src:url(/assets/Roboto-VariableFont_wdth_wght-WOy3sDCz.ttf) format("truetype");font-weight:100 900;font-style:normal}@font-face{font-family:Roboto;src:url(../src/assets/font/Roboto-Italic-VariableFont_wdth,wght.ttf) format("truetype");font-weight:100 900;font-style:italic}:root{font-family:Roboto,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}
