*{margin:0;padding:0;box-sizing:border-box}html{width:100%;height:100%;overflow:hidden;margin:0;padding:0}body{width:100%;height:100%;overflow:hidden;margin:0;padding:0;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:linear-gradient(135deg,#f5f7fa,#e8edf2,#f5f7fa)}app-root{width:100%;height:100%;display:flex}.app-layout{width:100%;height:100%;display:flex;position:relative}.sidebar{width:280px;height:100vh;background:#fff;border-right:1px solid #E5E7EB;display:flex;flex-direction:column;transition:transform .3s ease,width .3s ease;position:fixed;left:0;top:0;z-index:1000;box-shadow:2px 0 8px #0000000d}.sidebar-closed{transform:translate(-100%)}.sidebar-header{padding:16px;border-bottom:1px solid #E5E7EB;display:flex;gap:8px;align-items:center;flex-shrink:0}.new-chat-btn{flex:1;padding:10px 16px;background:linear-gradient(135deg,#2563eb,#3b82f6);color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:all .2s ease;box-shadow:0 2px 4px #2563eb33}.new-chat-btn:hover{transform:translateY(-1px);box-shadow:0 4px 8px #2563eb4d;background:linear-gradient(135deg,#1e40af,#2563eb)}.new-chat-icon{font-size:16px}.new-chat-text{font-size:14px}.sidebar-toggle-btn{width:36px;height:36px;padding:0;background:#f3f4f6;border:1px solid #E5E7EB;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:18px;color:#374151;transition:all .2s ease;flex-shrink:0}.sidebar-toggle-btn:hover{background:#e5e7eb;color:#111827}.sidebar-content{flex:1;overflow-y:auto;overflow-x:hidden;padding:8px}.chat-list{display:flex;flex-direction:column;gap:4px}.chat-item{padding:12px;border-radius:8px;cursor:pointer;display:flex;align-items:center;gap:8px;transition:background-color .2s ease;position:relative;border:1px solid transparent}.chat-item:hover{background:#f9fafb}.chat-item:hover .chat-item-delete{opacity:1}.chat-item.active{background:#eff6ff;border-color:#3b82f6}.chat-item-content{flex:1;min-width:0}.chat-item-title{font-size:14px;font-weight:500;color:#111827;margin-bottom:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;-webkit-user-select:none;user-select:none;padding:2px 4px;border-radius:4px;transition:background-color .2s ease}.chat-item-title:hover{background-color:#f3f4f6}.chat-item.active .chat-item-title{color:#1e40af;font-weight:600}.chat-title-edit{width:100%;padding:6px 8px;font-size:14px;font-weight:500;color:#111827;border:2px solid #3B82F6;border-radius:6px;outline:none;background:#fff;margin-bottom:4px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.chat-title-edit:focus{border-color:#2563eb;box-shadow:0 0 0 3px #2563eb1a}.chat-item.editing{background:#f9fafb;border-color:#3b82f6}.chat-item-meta{display:flex;align-items:center;gap:8px;font-size:12px;color:#6b7280}.chat-item-date,.chat-item-count{white-space:nowrap}.chat-item-delete{opacity:0;padding:4px 8px;background:transparent;border:none;cursor:pointer;font-size:14px;transition:opacity .2s ease,background-color .2s ease;border-radius:4px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.chat-item-delete:hover{background:#fee2e2;opacity:1!important}.chat-list-empty{padding:32px 16px;text-align:center;color:#9ca3af}.chat-list-empty p{margin-bottom:8px;font-size:14px}.chat-list-empty .hint{font-size:12px;color:#d1d5db}.main-content{flex:1;height:100vh;display:flex;justify-content:center;align-items:center;transition:margin-left .3s ease;margin-left:0;width:100%}.main-content.with-sidebar{margin-left:280px}@media (max-width: 768px){.sidebar{width:260px}.main-content.with-sidebar{margin-left:0}.sidebar-open{box-shadow:4px 0 16px #00000026}}.chatbot-container{width:100%;max-width:100%;height:100vh;min-height:100vh;max-height:100vh;background:#fff;border-radius:0;box-shadow:0 10px 40px #2563eb26,0 0 0 1px #2563eb1a;display:flex;flex-direction:column;overflow:hidden;position:relative}@media (min-width: 768px){.chatbot-container{max-width:100%;height:100vh;min-height:100vh;max-height:100vh;border-radius:0}.main-content.with-sidebar .chatbot-container{border-radius:0}.main-content:not(.with-sidebar) .chatbot-container{max-width:900px;height:95vh;min-height:95vh;max-height:95vh;border-radius:24px}}@media (min-width: 1024px){.main-content:not(.with-sidebar) .chatbot-container{max-width:1000px}}@media (min-width: 1440px){.main-content:not(.with-sidebar) .chatbot-container{max-width:1200px}}.chatbot-header{background:linear-gradient(135deg,#2563eb,#1e40af);color:#fff;padding:16px 20px;text-align:center;box-shadow:0 4px 12px #2563eb33;flex-shrink:0;position:relative;overflow:hidden}.chatbot-header:before{content:"";position:absolute;inset:0;background:linear-gradient(45deg,rgba(255,255,255,.1) 25%,transparent 25%,transparent 75%,rgba(255,255,255,.1) 75%);background-size:20px 20px;opacity:.3}.header-content{display:flex;align-items:center;justify-content:center;gap:12px;position:relative;z-index:1;flex-wrap:nowrap}.sidebar-toggle-btn-inline{position:absolute;left:16px;background:transparent;border:none;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:20px;padding:8px;border-radius:6px;transition:background-color .2s ease;z-index:2}.sidebar-toggle-btn-inline:hover{background:#ffffff1a}.header-icon{font-size:24px;animation:pulse 2s ease-in-out infinite}.header-title{font-size:18px;font-weight:700;letter-spacing:2px;text-transform:uppercase;text-shadow:0 2px 4px rgba(0,0,0,.2)}@media (min-width: 768px){.chatbot-header{padding:24px 20px}.header-icon{font-size:32px}.header-title{font-size:24px;letter-spacing:3px}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.chatbot-messages{flex:1;overflow-y:auto;overflow-x:hidden;padding:15px;background:linear-gradient(to bottom,#fff,#f8fafc);min-height:0;flex-shrink:1}@media (min-width: 768px){.chatbot-messages{padding:20px}}.message{margin-bottom:15px;display:flex;align-items:flex-start}.message.user{justify-content:flex-end}.message.user>div{display:flex;flex-direction:column;align-items:flex-end;max-width:100%;width:fit-content;min-width:0}.message-bubble{max-width:85%;min-width:fit-content;padding:12px 16px;border-radius:18px;word-wrap:break-word;overflow-wrap:break-word;word-break:break-word;width:fit-content;display:inline-block}.message.user .message-bubble{background:linear-gradient(135deg,#2563eb,#3b82f6);color:#fff;border-bottom-right-radius:4px;box-shadow:0 4px 12px #2563eb40}@media (min-width: 768px){.message-bubble{max-width:80%}}@media (min-width: 1024px){.message-bubble{max-width:75%}}.message.bot .message-bubble{background:#fff;color:#333;border-bottom-left-radius:4px;box-shadow:0 2px 8px #2563eb26;border-left:3px solid #2563EB}.message-time{font-size:11px;color:#999;margin-top:5px;padding:0 5px}.message.user .message-time{text-align:right;padding-right:0}.chatbot-input{padding:15px;background:#fff;border-top:1px solid #e0e0e0;display:flex;gap:10px;flex-shrink:0}@media (min-width: 768px){.chatbot-input{padding:20px}}.chatbot-input input{flex:1;padding:10px 16px;border:2px solid #e0e0e0;border-radius:25px;font-size:14px;outline:none;transition:border-color .3s;min-width:0}@media (min-width: 768px){.chatbot-input input{padding:12px 16px;font-size:16px}}.chatbot-input input:focus{border-color:#2563eb;box-shadow:0 0 0 3px #2563eb1a}.chatbot-input input.readonly,.chatbot-input input[readonly]{background-color:#f8fafc;cursor:text;opacity:.9}.chatbot-input input.readonly:focus,.chatbot-input input[readonly]:focus{border-color:#94a3b8;box-shadow:0 0 0 3px #94a3b81a}.chatbot-input button{padding:10px 20px;background:linear-gradient(135deg,#2563eb,#3b82f6);color:#fff;border:none;border-radius:25px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #2563eb4d;white-space:nowrap}@media (min-width: 768px){.chatbot-input button{padding:12px 24px;font-size:16px}}.chatbot-input button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #2563eb66;background:linear-gradient(135deg,#1e40af,#2563eb)}.chatbot-input button:disabled{opacity:.5;cursor:not-allowed}.loading-indicator{display:inline-block;padding:12px 16px;background:#fff;border-radius:18px 18px 18px 4px}.loading-dots{display:flex;gap:4px}.loading-dot{width:8px;height:8px;background:#2563eb;border-radius:50%;animation:bounce 1.4s infinite ease-in-out both}.loading-dot:nth-child(2){background:#3b82f6}.loading-dot:nth-child(3){background:#60a5fa}.loading-dot:nth-child(1){animation-delay:-.32s}.loading-dot:nth-child(2){animation-delay:-.16s}@keyframes bounce{0%,80%,to{transform:scale(0)}40%{transform:scale(1)}}.error-message{color:#e74c3c;font-size:14px;margin-top:5px}.message-bubble.error-bubble{border:2px solid #FBBF24;background:#fef3c7!important;color:#92400e}.message-bubble.error-bubble .error-header{display:flex;align-items:center;gap:8px;margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid #FBBF24;font-weight:700}.message-bubble.error-bubble .error-details{margin-top:8px;padding-top:8px;border-top:1px solid #FBBF24;font-size:12px;opacity:.8}.error-banner{padding:12px 20px;background:#eff6ff;border-top:3px solid #60A5FA;animation:slideDown .3s ease-out}.error-banner.error-database{background:#fee2e2;border-top-color:#f87171}.error-banner.error-n8n{background:#fef3c7;border-top-color:#fbbf24}.error-banner.error-network{background:#fee2e2;border-top-color:#ef4444}.error-banner.error-server{background:#fee2e2;border-top-color:#dc2626}.error-banner.error-unknown{background:#eff6ff;border-top-color:#60a5fa}.error-banner-content{display:flex;align-items:flex-start;gap:12px}.error-icon{font-size:24px;flex-shrink:0}.error-text{flex:1}.error-text strong{display:block;margin-bottom:4px;font-size:14px;color:#333}.error-text div{font-size:13px;color:#666;line-height:1.4}.error-close{background:none;border:none;font-size:24px;color:#999;cursor:pointer;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:color .2s}.error-close:hover{color:#333}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.confirm-dialog-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:10000;animation:fadeIn .2s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.confirm-dialog{background:#fff;border-radius:16px;box-shadow:0 20px 60px #0000004d;max-width:400px;width:90%;animation:slideUp .3s ease-out;overflow:hidden}@keyframes slideUp{0%{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.confirm-dialog-header{padding:24px 24px 16px;text-align:center;border-bottom:1px solid #E5E7EB}.confirm-dialog-icon{font-size:48px;display:block;margin-bottom:12px}.confirm-dialog-title{font-size:20px;font-weight:600;color:#111827;margin:0}.confirm-dialog-body{padding:24px;text-align:center;color:#374151;line-height:1.6}.confirm-dialog-body p{margin:8px 0;font-size:14px}.confirm-dialog-chat-title{font-weight:600;color:#1f2937;font-size:16px;margin:12px 0!important;word-break:break-word}.confirm-dialog-warning{color:#ef4444;font-size:13px;margin-top:16px!important;font-weight:500}.confirm-dialog-actions{padding:16px 24px 24px;display:flex;gap:12px;border-top:1px solid #E5E7EB}.confirm-dialog-btn{flex:1;padding:12px 24px;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease;outline:none}.confirm-dialog-btn-cancel{background:#f3f4f6;color:#374151;border:1px solid #E5E7EB}.confirm-dialog-btn-cancel:hover{background:#e5e7eb;color:#111827}.confirm-dialog-btn-cancel:active{background:#d1d5db}.confirm-dialog-btn-delete{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;box-shadow:0 2px 4px #ef444433}.confirm-dialog-btn-delete:hover{background:linear-gradient(135deg,#dc2626,#b91c1c);box-shadow:0 4px 8px #ef44444d;transform:translateY(-1px)}.confirm-dialog-btn-delete:active{transform:translateY(0);box-shadow:0 2px 4px #ef444433}@media (max-width: 480px){.confirm-dialog{width:95%;max-width:none}.confirm-dialog-header{padding:20px 20px 12px}.confirm-dialog-body{padding:20px}.confirm-dialog-actions{padding:12px 20px 20px;flex-direction:column}.confirm-dialog-btn{width:100%}}
