*{font-family:Be Vietnam,sans-serif}.widget-btn{position:fixed;bottom:24px;right:24px;background:#25d366;color:#fff;border:none;border-radius:50%;width:60px;height:60px;font-size:1.8rem;cursor:pointer;box-shadow:0 4px 16px #25d36666;transition:transform .3s,box-shadow .3s;animation:floatBtn 2.2s infinite ease-in-out}.widget-btn:hover{transform:scale(1.1);box-shadow:0 6px 20px #25d36680}@keyframes floatBtn{0%,to{transform:translateY(0)}50%{transform:translateY(-12px)}}@keyframes bounceIn{0%{transform:scale(.5);opacity:0}60%{transform:scale(1.1);opacity:1}to{transform:scale(1)}}.widget-modal{position:fixed;bottom:100px;right:32px;width:380px;min-height:600px;max-width:96vw;max-height:96vh;background:#fff;border-radius:16px;box-shadow:0 8px 32px #00000026;z-index:1000;overflow:hidden;display:flex;flex-direction:column;animation:modalFadeIn .5s ease-out;border:1px solid #e0e0e0;box-sizing:border-box}@keyframes modalFadeIn{0%{transform:translateY(60px) scale(.92);opacity:0}80%{transform:translateY(-8px) scale(1.04);opacity:1}to{transform:translateY(0) scale(1);opacity:1}}.widget-header{background:#128c7e;color:#fff;padding:16px 18px;display:flex;justify-content:space-between;align-items:center;font-size:1.1rem;font-weight:500;letter-spacing:.3px;box-shadow:0 2px 8px #00000026;position:relative}.widget-header button{background:none;border:none;color:#fff;font-size:1.4rem;cursor:pointer;transition:color .2s,transform .2s}.widget-header button:hover{color:#dcf8c6;transform:scale(1.1)}.widget-tabs{display:flex;border-bottom:1.5px solid #e0e8f8;background:#f0f7ffb3;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.widget-tabs button{flex:1;padding:14px 0;background:none;border:none;cursor:pointer;font-weight:700;font-size:1.05rem;color:#0078d4;position:relative;transition:background .2s,color .2s}.widget-tabs .active{background:linear-gradient(90deg,#e3f0ff 80%,#f8fbff);color:#005fa3;border-bottom:2.5px solid #00c6fb}.widget-tabs .active:after{content:"";position:absolute;left:50%;bottom:-2px;transform:translate(-50%);width:60%;height:3px;background:linear-gradient(90deg,#00c6fb,#0078d4);border-radius:2px;animation:tabGlow 1.2s infinite alternate}@keyframes tabGlow{0%{box-shadow:0 0 4px #00c6fb88}to{box-shadow:0 0 12px #00c6fbcc}}.widget-content{padding:0;min-height:320px;background:#e5ddd5;display:flex;flex-direction:column;height:100%}.chat-section{display:flex;flex-direction:column;height:520px;flex:1;background:#e5ddd5}.chat-messages{flex:1;overflow-y:auto;margin-bottom:4px;padding:4px;background:#e5ddd5;background-image:repeating-linear-gradient(45deg,transparent,transparent 1px,rgba(255,255,255,.03) 1px,rgba(255,255,255,.03) 2px);scrollbar-width:thin;scrollbar-color:#999 #e5ddd5}.msg-row{display:flex;align-items:flex-end;margin-bottom:4px;padding:0 2px}.msg-row-left{flex-direction:row;justify-content:flex-start}.msg-row-right{flex-direction:row-reverse;justify-content:flex-end}.agent-avatar,.customer-avatar{width:28px;height:28px;border-radius:50%;background:#f0f0f0;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 2px #0000001a;margin:0 3px;flex-shrink:0}.msg-bot{background:#fff;color:#303030;border-radius:18px 18px 18px 4px;padding:6px 10px;box-shadow:0 1px 2px #0000001a;max-width:70%;font-size:.95rem;display:flex;flex-direction:column;align-items:flex-start;position:relative;margin-left:6px;border:1px solid #e0e0e0}.msg-bot:before{content:"";position:absolute;left:-8px;bottom:4px;width:0;height:0;border:8px solid transparent;border-right-color:#fff;border-left:0;border-bottom:0}.msg-user{background:#dcf8c6!important;color:#303030;border-radius:18px 18px 4px;padding:6px 10px;box-shadow:0 1px 2px #0000001a;max-width:70%;font-size:.95rem;display:flex;flex-direction:column;align-items:flex-end;position:relative;margin-right:6px}.msg-user:before{content:"";position:absolute;right:-8px;bottom:4px;width:0;height:0;border:8px solid transparent;border-left-color:#dcf8c6;border-right:0;border-bottom:0}.quick-replies{margin-top:4px;display:flex;flex-wrap:wrap;gap:4px}.quick-reply-btn{background:#fff;color:#128c7e;border:1px solid #e0e0e0;border-radius:16px;padding:6px 12px;font-size:.9rem;cursor:pointer;transition:all .2s;box-shadow:0 1px 2px #0000001a}.quick-reply-btn:hover{background:#f0f0f0;border-color:#128c7e}.chat-input{display:flex;gap:6px;margin-top:0;padding:6px;background:#f0f0f0;border-top:1px solid #e0e0e0}.chat-input input{flex:1;padding:10px 14px;border:none;border-radius:20px;font-size:.95rem;background:#fff;box-shadow:0 1px 2px #0000001a;outline:none}.chat-input input:focus{border-color:#00c6fb;box-shadow:0 0 8px #00c6fb88;outline:none}.chat-input button{padding:6px 10px;background:#25d366;color:#fff;border:none;border-radius:50%;font-weight:600;font-size:1.2rem;cursor:pointer;transition:background .2s,transform .1s;width:40px;height:40px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 4px #0003}.chat-input button:hover{background:#20be5a;transform:scale(1.05)}.chat-attach-btn,.chat-emoji-btn{background:none;border:none;cursor:pointer;font-size:1.2rem;padding:0 6px;transition:color .2s,transform .2s}.chat-attach-btn:hover,.chat-emoji-btn:hover{color:#0078d4;transform:scale(1.2)}@keyframes pulseBtn{0%{box-shadow:0 2px 8px #00c6fb44}to{box-shadow:0 6px 24px #00c6fb88}}.call-section{display:flex;flex-direction:column;align-items:center;justify-content:center;height:220px}.call-btn{padding:14px 36px;background:linear-gradient(90deg,#0078d4 80%,#00c6fb);color:#fff;border:none;border-radius:12px;font-size:1.15rem;font-weight:700;cursor:pointer;box-shadow:0 2px 12px #00c6fb44;transition:background .2s,transform .2s,box-shadow .2s;animation:pulseBtn 1.2s infinite alternate}.call-btn:hover{background:linear-gradient(90deg,#00c6fb 80%,#0078d4);transform:scale(1.12);box-shadow:0 0 18px #00c6fb88}.calling-status{font-size:1.35rem;color:#0078d4;margin-top:36px;animation:pulseText 1.2s infinite alternate;text-shadow:0 0 8px #00c6fb88}@keyframes pulseText{0%{opacity:.7;text-shadow:0 0 4px #00c6fb44}to{opacity:1;text-shadow:0 0 12px #00c6fb88}}.chat-avatar{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#e3f0ff 60%,#cce6ff);box-shadow:0 2px 8px #00c6fb22;font-size:1.6rem}.queue-list{scrollbar-width:thin;scrollbar-color:#0078d4 #e3f0ff}.queue-item-hover:hover{background:#e3f0ff;transition:background .2s}.whatsapp-theme{background:linear-gradient(135deg,#ece5dd,#d1f7c4);border-radius:18px;box-shadow:0 8px 32px #0000002e;border:1.5px solid #b2dfdb}.whatsapp-header{background:linear-gradient(90deg,#075e54 80%,#128c7e);color:#fff;padding:16px;font-size:1.15rem;font-weight:600;letter-spacing:.5px;border-bottom:2px solid #25d366}.whatsapp-content{background:transparent;padding:18px;min-height:320px}.whatsapp-footer{background:#f0f0f0;border-top:1.5px solid #b2dfdb;display:flex;align-items:center;gap:8px}.msg-user{background:#fff!important;color:#222;border-radius:18px 18px 4px;padding:12px 18px;box-shadow:0 2px 8px #0000001a;max-width:70%;font-size:1rem;margin-left:auto;margin-bottom:8px;border:1px solid #e0e0e0}.msg-bot{background:linear-gradient(135deg,#fff 80%,#ece5dd);color:#222;border-radius:18px 18px 18px 4px;padding:12px 18px;box-shadow:0 2px 8px #b2dfdb44;max-width:70%;font-size:1rem;margin-right:auto;margin-bottom:8px;border:1px solid #b2dfdb}.chat-avatar.agent-avatar{background:#128c7e;color:#fff;border:2px solid #25d366}.chat-avatar.customer-avatar{background:#25d366;color:#fff;border:2px solid #128c7e}.widget-btn{background:linear-gradient(135deg,#25d366 60%,#128c7e);color:#fff;border:none;border-radius:50%;width:64px;height:64px;font-size:2.2rem;cursor:pointer;box-shadow:0 4px 16px #00000040;transition:transform .2s,box-shadow .2s}.quick-reply-btn{background:#fff;color:#128c7e;border:1.5px solid #25d366;border-radius:22px;padding:6px 18px;font-size:14px;cursor:pointer;margin-top:2px;transition:background .2s,color .2s,border .2s}.quick-reply-btn:hover{background:#25d366;color:#fff;border:1.5px solid #128c7e}.chat-input input{flex:1;padding:10px;border:2px solid #b2dfdb;border-radius:10px;font-size:1.05rem;background:#fff;transition:border .2s,box-shadow .2s}.chat-input input:focus{border-color:#25d366;box-shadow:0 0 8px #25d36688;outline:none}.chat-input button{padding:10px 18px;background:linear-gradient(90deg,#128c7e 80%,#25d366);color:#fff;border:none;border-radius:10px;font-weight:700;font-size:1.05rem;cursor:pointer;transition:background .2s,transform .2s,box-shadow .2s;box-shadow:0 2px 8px #25d36644}.chat-input button:hover{background:linear-gradient(90deg,#25d366 80%,#128c7e);transform:scale(1.08);box-shadow:0 0 16px #25d36688}.emoji-picker{background:#fff;border:1.5px solid #b2dfdb;box-shadow:0 2px 16px #25d36644}@media (max-width: 600px){.widget-modal{width:98vw;min-width:0;min-height:0;max-width:100vw;max-height:100vh;border-radius:10px;right:2vw;bottom:2vw;padding:0}.widget-header{font-size:1rem;padding:12px}.widget-content{padding:8px;min-height:0;max-height:calc(100vh - 80px)}.chat-section{height:auto}.chat-input input{font-size:.95rem;padding:6px}.chat-input button{font-size:1rem;padding:6px 10px}.msg-user,.msg-bot{font-size:.95rem;padding:8px 10px}.chat-avatar{width:32px;height:32px;font-size:1.2rem}}.customer-widget,.customer-widget *,.widget-modal,.widget-modal *{font-family:Be Vietnam,sans-serif!important}:root{--widget-spacing-xs: 4px;--widget-spacing-sm: 8px;--widget-spacing-md: 16px;--widget-spacing-lg: 24px;--widget-spacing-xl: 32px;--widget-font-family: "Be Vietnam", sans-serif;--widget-font-size-xs: .75rem;--widget-font-size-sm: .875rem;--widget-font-size-md: 1rem;--widget-font-size-lg: 1.125rem;--widget-font-size-xl: 1.25rem;--widget-radius-sm: 6px;--widget-radius-md: 12px;--widget-radius-lg: 18px;--widget-radius-xl: 24px;--widget-radius-circle: 50%;--widget-shadow-sm: 0 2px 8px rgba(0, 0, 0, .1);--widget-shadow-md: 0 4px 16px rgba(0, 0, 0, .15);--widget-shadow-lg: 0 8px 32px rgba(0, 0, 0, .2);--widget-shadow-xl: 0 12px 48px rgba(0, 0, 0, .25);--widget-z-base: 1000;--widget-z-dropdown: 1100;--widget-z-overlay: 1200;--widget-z-modal: 1300;--widget-z-tooltip: 1400}[data-widget-theme=green-nature],.widget-theme-green-nature{--widget-accent-primary: #22c55e;--widget-accent-secondary: #16a34a;--widget-accent-gradient: linear-gradient(135deg, #22c55e 0%, #16a34a 50%, #15803d 100%);--widget-bg-primary: #f0fdf4;--widget-bg-secondary: #ffffff;--widget-bg-tertiary: #dcfce7;--widget-primary-500: #22c55e;--widget-primary-600: #16a34a}[data-widget-theme=slate-minimal],.widget-theme-slate-minimal{--widget-accent-primary: #64748b;--widget-accent-secondary: #475569;--widget-accent-gradient: linear-gradient(135deg, #64748b 0%, #475569 50%, #334155 100%);--widget-bg-primary: #f8fafc;--widget-bg-secondary: #ffffff;--widget-bg-tertiary: #f1f5f9;--widget-primary-500: #64748b;--widget-primary-600: #475569}.customer-widget{font-family:var(--widget-font-family);color:var(--widget-text-primary);background:var(--widget-bg-primary)}.customer-widget *{box-sizing:border-box}.widget-btn{background:var(--widget-accent-gradient);color:var(--widget-text-inverse);border:2px solid transparent;border-radius:var(--widget-radius-circle);box-shadow:var(--widget-shadow-lg);transition:all .3s cubic-bezier(.4,0,.2,1)}.widget-btn:hover{transform:scale(1.05);box-shadow:var(--widget-shadow-xl)}.widget-btn:focus{outline:2px solid var(--widget-border-focus);outline-offset:2px}.widget-modal{background:var(--widget-bg-secondary);border:1px solid var(--widget-border-primary);border-radius:var(--widget-radius-xl);box-shadow:var(--widget-shadow-xl);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.widget-header{background:var(--widget-accent-gradient);color:var(--widget-text-inverse);border-bottom:1px solid var(--widget-border-primary)}.chat-section,.chat-messages,.chat-widget-content{background:#e5ddd5!important}.widget-modal .widget-content:has(.chat-section){background:#e5ddd5!important}.chat-section .widget-content,.widget-content.chat-content,.chat-widget-content{background:#e5ddd5!important}.call-section,.sip-call-widget{background:#fff!important}.msg-user{background:var(--widget-accent-primary);color:var(--widget-text-inverse);border-radius:var(--widget-radius-lg) var(--widget-radius-lg) var(--widget-radius-sm) var(--widget-radius-lg)}.msg-bot{background:var(--widget-bg-tertiary);color:var(--widget-text-primary);border:1px solid var(--widget-border-primary);border-radius:var(--widget-radius-lg) var(--widget-radius-lg) var(--widget-radius-lg) var(--widget-radius-sm)}.chat-input input{background:var(--widget-bg-secondary);color:var(--widget-text-primary);border:2px solid var(--widget-border-primary);border-radius:var(--widget-radius-md)}.chat-input input:focus{border-color:var(--widget-border-focus);outline:none;box-shadow:0 0 0 3px #3b82f61a}.chat-input button{background:var(--widget-accent-gradient);color:var(--widget-text-inverse);border:none;border-radius:var(--widget-radius-md)}.status-online{color:var(--widget-success-500)}.status-warning{color:var(--widget-warning-500)}.status-error{color:var(--widget-error-500)}.file-upload-area{background:var(--widget-bg-tertiary);border:2px dashed var(--widget-border-secondary);border-radius:var(--widget-radius-md);color:var(--widget-text-secondary)}.file-upload-area:hover{border-color:var(--widget-accent-primary);background:var(--widget-bg-secondary)}@media (max-width: 768px){.widget-modal{border-radius:var(--widget-radius-md);margin:var(--widget-spacing-sm)}}@media (prefers-color-scheme: dark){.customer-widget:not([data-widget-theme]){--widget-bg-primary: #111827;--widget-bg-secondary: #1f2937;--widget-bg-tertiary: #374151;--widget-text-primary: #f9fafb;--widget-text-secondary: #e5e7eb;--widget-text-tertiary: #d1d5db;--widget-border-primary: #374151;--widget-border-secondary: #4b5563}}@media (prefers-contrast: high){.customer-widget:not([data-widget-theme]){--widget-border-primary: #000000;--widget-border-secondary: #333333;--widget-text-primary: #000000;--widget-bg-secondary: #ffffff}}@media (prefers-reduced-motion: reduce){.customer-widget *{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media print{.customer-widget{display:none!important}}.chat-loader{display:flex;align-items:center;justify-content:center;padding:20px;background:#ffffffe6;position:absolute;top:0;left:0;right:0;bottom:0;z-index:100;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.loader-spinner{display:flex;flex-direction:column;align-items:center;gap:12px}.spinner{width:32px;height:32px;border:3px solid #f3f3f3;border-top:3px solid #25d366;border-radius:50%;animation:spin 1s linear infinite}.loader-text{color:#666;font-size:14px;font-weight:500}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.message-loader{display:flex;align-items:center;justify-content:center;padding:16px;margin:8px 0}.message-loader .spinner{width:20px;height:20px;border-width:2px;margin-right:8px}.file-card{cursor:pointer;padding:12px;border-radius:8px;border:1px solid #e0e0e0;background-color:#f8f9fa;transition:all .2s ease;max-width:250px}.file-card:hover{background-color:#e9ecef;transform:translateY(-1px);box-shadow:0 2px 8px #0000001a}.file-card.bot:hover{border-color:#007bff}.file-card.user:hover{border-color:#28a745}.file-icon{font-size:1.2rem;margin-right:8px}.file-name{word-break:break-all;font-size:.9rem;color:#333;font-weight:500}.file-card{cursor:pointer;padding:12px;border-radius:8px;background-color:#f8f9fa;transition:all .2s ease;max-width:250px;min-width:150px;width:100%;display:block;box-sizing:border-box;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.file-card:hover{background-color:#e9ecef;transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.file-card:active{transform:translateY(0);background-color:#dee2e6}.file-card.bot:hover{background-color:#e9ecef}.file-card.user{background-color:#f0f8ff}.file-card.user:hover{background-color:#e0f2ff}.file-icon{font-size:1.2rem;pointer-events:none}.file-name{word-break:break-all;font-size:.9rem;color:#333;font-weight:500;pointer-events:none}.file-card>div{pointer-events:none}.file-card *{pointer-events:none}.msg-bot .file-card,.msg-user .file-card{border:none!important;box-shadow:none!important;width:100%!important;height:100%!important;min-height:44px;display:flex!important;align-items:center;justify-content:flex-start}.msg-user .file-card{justify-content:flex-end}.msg-bot .file-card:hover,.msg-user .file-card:hover{border:none!important;transform:scale(1.02)}.file-card>div{height:100%;display:flex;align-items:center}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}