:root{--bg-color: #ffffff;--bg-gradient: linear-gradient(135deg, #ffffff 0%, #f5f5f5 100%);--card-bg: #f9f9f9;--card-border: #e2e8f0;--accent-color: #D4AF37;--accent-light: #E8C547;--text-primary: #1a1a1a;--text-secondary: #4a5568;--text-muted: #718096;--success-color: #10b981;--warning-color: #f59e0b;--error-color: #ef4444;--button-text: #ffffff;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;min-width:320px;min-height:100vh}#root{width:100%;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}}.login-container{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg-gradient);padding:20px}.login-card{background:var(--card-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--card-border);border-radius:20px;padding:40px;width:100%;max-width:400px;box-shadow:0 20px 60px #0006}.login-header{text-align:center;margin-bottom:32px}.logo-icon{width:60px;height:60px;background:var(--accent-color);border-radius:16px;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;color:#000}.login-header h1{color:#fff;font-size:24px;font-weight:600;margin:0 0 8px}.login-header p{color:#fff9;font-size:14px;margin:0}.error-message{background:#ef44441a;border:1px solid rgba(239,68,68,.3);border-radius:8px;padding:12px 16px;display:flex;align-items:center;gap:8px;color:#ef4444;font-size:14px;margin-bottom:20px}.form-group{margin-bottom:20px}.form-group label{display:block;color:#fffc;font-size:14px;font-weight:500;margin-bottom:8px}.input-wrapper{position:relative}.input-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:#fff6}.form-group input{width:100%;padding:14px 14px 14px 44px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:10px;color:#fff;font-size:14px;transition:all .2s ease;box-sizing:border-box}.form-group input::placeholder{color:#fff6}.form-group input:focus{outline:none;border-color:gold;background:#ffd7000d}.forgot-link{display:block;color:#06b6d4;text-decoration:none;font-size:14px;font-weight:500;text-align:right;margin-bottom:16px;transition:color .3s ease}.forgot-link:hover{color:#22d3ee;text-decoration:underline}.login-button{width:100%;padding:14px;background:var(--accent-color);border:none;border-radius:10px;color:#000;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s ease;margin-top:8px}.login-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 20px #ffd7004d}.login-button:disabled{opacity:.6;cursor:not-allowed}.login-footer{text-align:center;margin-top:32px;padding-top:20px;border-top:1px solid rgba(255,255,255,.1)}.login-footer p{color:#fff6;font-size:12px;margin:0}.forgot-container{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#0f172a,#1e293b,#334155);padding:20px}.forgot-card{background:#ffffff08;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:24px;padding:40px;width:100%;max-width:440px;border:1px solid rgba(255,255,255,.1);box-shadow:0 20px 60px #0000004d}.back-link{display:inline-flex;align-items:center;gap:8px;color:#fff9;text-decoration:none;font-size:14px;margin-bottom:24px;transition:color .3s ease}.back-link:hover{color:#06b6d4}.forgot-header{text-align:center;margin-bottom:32px}.forgot-logo{width:72px;height:72px;background:linear-gradient(135deg,#06b6d4,#0891b2);border-radius:18px;display:flex;align-items:center;justify-content:center;margin:0 auto 20px;box-shadow:0 10px 30px #06b6d44d;color:#fff}.forgot-header h1{color:#fff;font-size:26px;font-weight:700;margin:0 0 8px}.forgot-header p{color:#ffffff80;font-size:14px;margin:0;line-height:1.5}.forgot-form{display:flex;flex-direction:column;gap:20px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{color:#ffffffb3;font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.input-wrapper{position:relative;display:flex;align-items:center}.input-icon{position:absolute;left:16px;color:#fff6;pointer-events:none}.input-wrapper input{width:100%;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:16px 16px 16px 48px;font-size:15px;color:#fff;transition:all .3s ease}.input-wrapper input::placeholder{color:#ffffff4d}.input-wrapper input:focus{outline:none;border-color:#06b6d4;background:#ffffff14;box-shadow:0 0 0 3px #06b6d426}.toggle-password{position:absolute;right:16px;background:none;border:none;color:#06b6d4;font-size:13px;cursor:pointer;font-weight:600}.toggle-password:hover{color:#22d3ee}.error-message{background:#ef444426;border:1px solid rgba(239,68,68,.3);color:#fca5a5;padding:12px 16px;border-radius:12px;font-size:14px;text-align:center;margin-bottom:8px}.submit-btn{background:linear-gradient(135deg,#06b6d4,#0891b2);color:#fff;border:none;padding:16px;border-radius:12px;font-size:15px;font-weight:700;cursor:pointer;transition:all .3s ease;margin-top:8px}.submit-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 30px #06b6d466}.submit-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.resend-btn{background:transparent;color:#fff9;border:1px solid rgba(255,255,255,.2);padding:12px;border-radius:12px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s ease}.resend-btn:hover:not(:disabled){background:#ffffff0d;color:#fff}.resend-btn:disabled{opacity:.5;cursor:not-allowed}.success-content{text-align:center}.dashboard-container{min-height:100vh;background:var(--bg-gradient);color:var(--text-primary)}.dashboard-header{display:flex;justify-content:space-between;align-items:center;padding:20px 32px;background:#fff;border-bottom:1px solid var(--card-border);position:sticky;top:0;z-index:100;box-shadow:0 2px 10px #00000005}.header-left{display:flex;align-items:center;gap:12px;color:var(--accent-color)}.header-left h1{color:var(--text-primary);font-size:20px;font-weight:600;margin:0}.header-right{display:flex;align-items:center;gap:16px}.refresh-btn{padding:8px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#fff;cursor:pointer;transition:all .2s}.refresh-btn:hover{background:#ffffff1a}.refresh-btn:disabled{opacity:.5}.refresh-btn .spinning{animation:spin 1s linear infinite}.user-info{display:flex;align-items:center;gap:8px;color:#fffc;font-size:14px;padding:8px 12px;background:#ffffff0d;border-radius:8px}.logout-btn{display:flex;align-items:center;gap:8px;padding:10px 16px;background:#ef44441a;border:1px solid rgba(239,68,68,.3);border-radius:8px;color:#ef4444;font-size:14px;cursor:pointer;transition:all .2s}.logout-btn:hover{background:#ef444433}.dashboard-content{padding:32px;max-width:1400px;margin:0 auto}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-bottom:24px}.section-header{margin-bottom:16px}.section-header h2{color:#fff;font-size:18px;font-weight:600;margin:0;display:flex;align-items:center;gap:8px}.stat-card{background:#fff;border:1px solid var(--card-border);border-radius:16px;padding:24px;display:flex;align-items:center;gap:20px;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 6px -1px #0000000d,0 2px 4px -1px #00000008;position:relative;overflow:hidden}.stat-card:after{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:currentColor;opacity:.8}.stat-card.clickable{cursor:pointer}.stat-card.clickable:hover{transform:translateY(-4px);box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;border-color:var(--accent-color)}.stat-icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.stat-content{flex:1;min-width:0}.stat-content h3{color:var(--text-primary);font-size:28px;font-weight:700;margin:0 0 4px;line-height:1.2}.stat-content p{color:var(--text-muted);font-size:14px;margin:0;font-weight:500}.quick-actions{background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:24px}.quick-actions h2{color:#fff;font-size:18px;margin:0 0 16px}.action-buttons{display:flex;gap:12px;flex-wrap:wrap}.action-btn{display:flex;align-items:center;gap:8px;padding:12px 20px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:10px;color:#fff;font-size:14px;cursor:pointer;transition:all .2s}.action-btn:hover{background:#ffffff1a}.action-btn.primary{background:linear-gradient(135deg,gold,#ffb347);color:#1a1a2e;font-weight:600;border:none}.action-btn.primary:hover{transform:translateY(-2px);box-shadow:0 4px 15px #ffd7004d}.ticket-list-container{min-height:100vh;background:var(--bg-gradient)}.list-header{display:flex;align-items:center;gap:16px;padding:16px 24px;background:#00000005;border-bottom:1px solid var(--card-border)}.back-btn{padding:8px;background:var(--card-bg);border:1px solid var(--card-border);border-radius:8px;color:var(--text-primary);cursor:pointer;transition:all .2s}.back-btn:hover{background:var(--accent-color);color:var(--button-text)}.list-header h1{flex:1;color:var(--text-primary);font-size:20px;margin:0}.list-filters{padding:16px 24px;display:flex;gap:16px;flex-wrap:wrap;border-bottom:1px solid var(--card-border)}.search-form{flex:1;min-width:200px;display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--card-bg);border:1px solid var(--card-border);border-radius:10px;color:var(--text-muted)}.search-form input{flex:1;background:none;border:none;color:var(--text-primary);font-size:14px;outline:none}.search-form input::placeholder{color:#fff6}.filter-group{display:flex;align-items:center;gap:12px;color:#ffffff80}.filter-group select{padding:12px 16px;background:var(--card-bg);border:1px solid var(--card-border);border-radius:10px;color:var(--text-primary);font-size:14px;cursor:pointer}.filter-group select option{background:var(--bg-color);color:var(--text-primary)}.tickets-list{padding:24px;margin:0}.loading-state,.empty-state{text-align:center;padding:60px 20px;color:#fff9}.loading-state .spinning,.empty-state svg{margin-bottom:16px;opacity:.5}.empty-state h3{color:var(--text-primary);margin:0 0 8px}.empty-state p{margin:0}.ticket-card{display:flex;align-items:center;gap:16px;padding:20px;background:var(--card-bg);border:1px solid var(--card-border);border-radius:12px;margin-bottom:12px;cursor:pointer;transition:all .2s;box-shadow:0 2px 8px #00000008}.ticket-card:hover{background:#fff;transform:translateY(-2px);box-shadow:0 4px 12px #00000014;border-color:var(--accent-color)}.ticket-main{flex:1}.ticket-badges{display:flex;gap:8px;margin-bottom:8px;flex-wrap:wrap}.badge{padding:4px 10px;border-radius:6px;font-size:11px;font-weight:600;text-transform:uppercase}.badge.type{background:#ffffff1a;color:#ffffffb3}.ticket-main h3{color:var(--text-primary);font-size:16px;font-weight:600;margin:0 0 8px}.ticket-meta{display:flex;gap:16px;flex-wrap:wrap}.meta-item{display:flex;align-items:center;gap:6px;color:var(--text-muted);font-size:13px}.chevron{color:var(--text-muted);opacity:.5}.ticket-detail-container{min-height:100vh;background:var(--bg-gradient);color:var(--text-primary)}.loading-state,.error-state{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;color:#fff9;gap:16px}.error-state button{padding:12px 24px;background:gold;border:none;border-radius:8px;color:#1a1a2e;font-weight:600;cursor:pointer}.detail-header{display:flex;align-items:center;gap:16px;padding:16px 24px;background:#fff;border-bottom:1px solid var(--card-border);box-shadow:0 2px 4px #00000005}.header-info{flex:1}.header-info h1{color:var(--text-primary);font-size:18px;margin:0 0 4px}.ticket-id{color:var(--text-muted);font-size:13px;font-family:monospace}.status-badge{padding:6px 14px;border-radius:8px;font-size:12px;font-weight:600;text-transform:uppercase}.detail-content{display:flex;gap:24px;padding:24px;margin:0}.main-column{flex:2;min-width:0}.side-column{flex:1;min-width:280px}.section{background:var(--card-bg);border:1px solid var(--card-border);border-radius:12px;padding:20px;margin-bottom:20px;box-shadow:0 2px 8px #00000005}.section h3{display:flex;align-items:center;gap:8px;color:var(--accent-color);font-size:14px;font-weight:700;margin:0 0 16px;text-transform:uppercase;letter-spacing:.5px}.description-section p{color:var(--text-secondary);line-height:1.6;margin:0}.messages-container{max-height:400px;overflow-y:auto;margin-bottom:16px}.no-messages{color:#ffffff80;text-align:center;padding:40px}.message{padding:16px;border-radius:12px;margin-bottom:12px}.message.customer{background:#f0f7ff;border-left:3px solid #3b82f6}.message.staff{background:#f0fdf4;border-left:3px solid #22c55e}.message.internal{background:#8b5cf61a;border-left:3px solid #8b5cf6}.internal-badge{display:inline-flex;align-items:center;gap:4px;padding:4px 8px;background:#8b5cf633;border-radius:4px;color:#8b5cf6;font-size:11px;font-weight:600;margin-bottom:8px}.message-header{display:flex;justify-content:space-between;margin-bottom:8px}.message-header .sender{color:var(--text-primary);font-weight:700;font-size:13px;text-transform:capitalize}.message-header .time{color:var(--text-muted);font-size:12px}.message p{color:var(--text-secondary);font-size:14px;line-height:1.5;margin:0}.reply-box{border-top:1px solid rgba(255,255,255,.1);padding-top:16px}.reply-options{margin-bottom:12px}.internal-toggle{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:6px;color:#fff9;font-size:13px;cursor:pointer}.internal-toggle input{display:none}.internal-toggle.active{background:#8b5cf61a;border-color:#8b5cf6;color:#8b5cf6}.reply-input{display:flex;gap:12px}.reply-input textarea{flex:1;padding:14px;background:#fff;border:1px solid var(--card-border);border-radius:10px;color:var(--text-primary);font-size:14px;resize:none;transition:all .2s}.reply-input textarea:focus{outline:none;border-color:var(--accent-color);box-shadow:0 0 0 3px #d4af371a}.send-btn{padding:14px;background:linear-gradient(135deg,gold,#ffb347);border:none;border-radius:10px;color:#1a1a2e;cursor:pointer;transition:all .2s}.send-btn:hover:not(:disabled){transform:scale(1.05)}.info-section .info-row{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.05)}.info-section .info-row:last-child{border-bottom:none}.info-section .info-row span{color:var(--text-muted);font-size:13px}.info-section .info-row strong{color:var(--text-primary);font-size:13px}.actions-section select{width:100%;padding:12px;background:#fff;border:1px solid var(--card-border);border-radius:8px;color:var(--text-primary);font-size:14px;margin-bottom:12px}.actions-section select option{background:#fff;color:var(--text-primary)}.status-btn{width:100%;padding:12px;background:linear-gradient(135deg,gold,#ffb347);border:none;border-radius:8px;color:#1a1a2e;font-weight:600;cursor:pointer}.status-btn:disabled{opacity:.5;cursor:not-allowed}@media(max-width:900px){.detail-content{flex-direction:column}.side-column{min-width:100%}}.spinning{animation:spin 1s linear infinite}.chat-queue-page{padding:24px;max-width:1200px;margin:0 auto}.page-header{display:flex;justify-content:space-between;align-items:flex-start}.page-header h1{font-size:28px;font-weight:700;color:var(--text-primary);margin:0}.page-header p{color:var(--text-muted);margin-top:4px}.status-selector{display:flex;align-items:center;gap:8px;background:#fff;padding:8px 16px;border-radius:8px;box-shadow:0 1px 3px #0000000d;border:1px solid var(--card-border)}.status-selector select{padding:6px 12px;border:1px solid var(--card-border);border-radius:6px;font-weight:500;cursor:pointer;background:#fff;color:var(--text-primary)}.waiting-alert-section{background:linear-gradient(135deg,#fef3c7,#fde68a);border:2px solid #f59e0b;border-radius:16px;padding:20px;margin:20px 0;animation:gentle-pulse 2s infinite}@keyframes gentle-pulse{0%,to{box-shadow:0 0 #f59e0b66}50%{box-shadow:0 0 0 8px #f59e0b00}}.alert-header{display:flex;align-items:center;gap:12px;margin-bottom:16px}.pulse-dot{width:12px;height:12px;background:#ef4444;border-radius:50%;animation:pulse-dot 1.5s infinite}@keyframes pulse-dot{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.3);opacity:.7}}.alert-header h2{margin:0;font-size:18px;color:#92400e}.waiting-list{display:flex;flex-direction:column;gap:12px}.waiting-card{background:#fff;border-radius:12px;padding:16px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 2px 4px #0000000d;border:1px solid rgba(0,0,0,.02)}.waiting-info{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.waiting-name{font-weight:600;font-size:16px;color:var(--text-primary)}.waiting-category{font-weight:500;font-size:14px;text-transform:capitalize;color:var(--text-secondary)}.waiting-time{color:var(--text-muted);font-size:13px}.escalation-reason{font-size:12px;color:var(--text-muted);font-style:italic;opacity:.8}.pick-btn{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;border:none;padding:12px 24px;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s}.pick-btn:hover{transform:scale(1.05);box-shadow:0 4px 12px #22c55e66}.status-badge{font-size:10px;padding:2px 6px;border-radius:4px;font-weight:500;text-transform:capitalize;background:#e5e7eb;color:#666}.status-badge.waiting_for_agent{background:#fef3c7;color:#d97706}.status-badge.agent_connected{background:#dcfce7;color:#16a34a}.status-badge.bot_active{background:#dbeafe;color:#3b82f6}.stat-card.urgent .stat-value{color:#f59e0b}.chat-card.waiting{border-left:4px solid #f59e0b;background:#fffbeb}.filter-tabs{display:flex;gap:8px;margin:24px 0 16px}.filter-tab{padding:10px 20px;border:1px solid var(--card-border);background:#fff;border-radius:8px;cursor:pointer;font-weight:500;color:var(--text-secondary);transition:all .2s}.filter-tab:hover{background:#f8fafc}.filter-tab.active{background:var(--accent-color);border-color:var(--accent-color);color:#fff}.queue-stats{display:flex;gap:16px;margin-bottom:24px}.stat-card{background:#fff;border-radius:12px;padding:20px;flex:1;display:flex;flex-direction:column;box-shadow:0 1px 3px #0000000d;border:1px solid var(--card-border)}.stat-value{font-size:32px;font-weight:700;color:var(--accent-color)}.stat-label{font-size:14px;color:#666;margin-top:4px}.chat-list{display:flex;flex-direction:column;gap:12px}.chat-card{background:#fff;border-radius:12px;padding:16px;display:flex;align-items:center;gap:16px;cursor:pointer;transition:all .2s;border:1px solid var(--card-border);box-shadow:0 1px 3px #0000000d}.chat-card:hover{border-color:var(--accent-color);transform:translateY(-2px);box-shadow:0 4px 12px #00000014}.chat-card.unassigned{border-left:4px solid #f59e0b}.chat-avatar{width:48px;height:48px;background:#f3f4f6;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:24px}.chat-info{flex:1}.chat-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.participant-name{font-weight:600;color:var(--text-primary);display:flex;align-items:center;gap:8px}.type-badge{font-size:10px;padding:2px 6px;border-radius:4px;font-weight:500;text-transform:uppercase}.type-badge.user{background:#dbeafe;color:#3b82f6}.type-badge.vendor{background:#fef3c7;color:#d97706}.chat-time{font-size:13px;color:#666}.chat-category{display:flex;align-items:center;gap:8px}.category-badge{font-size:12px;padding:4px 10px;border-radius:6px;font-weight:500;text-transform:capitalize}.unread-badge{background:#ef4444;color:#fff;font-size:12px;font-weight:600;padding:2px 8px;border-radius:12px;min-width:24px;text-align:center}.assign-indicator{font-size:20px;animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.loading{text-align:center;padding:60px;color:#666}.empty-state{text-align:center;padding:80px 20px;color:#666}.empty-icon{font-size:64px;display:block;margin-bottom:16px;opacity:.5}.chat-detail-container{display:flex;flex-direction:column;height:100vh;background:var(--bg-color)}.chat-header{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;background:#fff;color:var(--text-primary);box-shadow:0 2px 8px #0000000d;border-bottom:1px solid var(--card-border);z-index:10}.header-left{display:flex;align-items:center;gap:16px}.back-btn,.dashboard-nav-btn{display:flex;align-items:center;gap:8px;background:#0000000d;border:1px solid var(--card-border);color:var(--text-primary);padding:8px 14px;border-radius:8px;cursor:pointer;font-size:13px;font-weight:500;transition:all .2s}.back-btn:hover,.dashboard-nav-btn:hover{background:var(--accent-light);color:#fff;border-color:var(--accent-light);transform:translateY(-1px);box-shadow:0 2px 6px #0000001a}.dashboard-nav-btn{border-color:var(--accent-color);color:var(--accent-color)}.chat-info{display:flex;align-items:center;margin-left:8px}.chat-info h2{margin:0;font-size:18px;font-weight:700;color:var(--text-primary)}.status-badge{display:inline-block;padding:3px 10px;border-radius:12px;font-size:11px;font-weight:600;text-transform:uppercase;margin-left:10px}.status-badge.status-active{background:#22c55e}.status-badge.status-waiting_for_agent{background:#f59e0b}.status-badge.status-assigned{background:#3b82f6}.status-badge.status-resolved{background:#6b7280}.category-badge{display:inline-block;padding:3px 10px;border-radius:12px;font-size:11px;background:#fff3;margin-left:10px}.sla-timer-bar{display:flex;gap:16px;background:var(--card-bg);padding:10px 16px;border-radius:8px;border:1px solid var(--card-border)}.sla-item{display:flex;flex-direction:column;align-items:center;min-width:100px;padding:6px 12px;border-radius:8px;transition:all .3s}.sla-item.sla-good{background:#22c55e4d}.sla-item.sla-warning{background:#f59e0b66}.sla-item.sla-danger{background:#ef444480;animation:pulse-danger 1s infinite}.sla-item.sla-breached{background:#b91c1c99;color:#fff}@keyframes pulse-danger{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}.sla-label{font-size:10px;opacity:.9;text-transform:uppercase;letter-spacing:.5px}.sla-time{font-size:16px;font-weight:700;margin:2px 0}.sla-progress{width:100%;height:4px;background:#ffffff4d;border-radius:2px;overflow:hidden}.sla-progress-bar{height:100%;background:#fff;transition:width .5s}.header-actions{display:flex;gap:10px}.resolve-btn{background:#22c55e;color:#fff;border:none;padding:10px 20px;border-radius:6px;font-weight:600;cursor:pointer;transition:all .2s}.resolve-btn:hover{background:#16a34a;transform:translateY(-1px)}.chat-body{display:flex;flex:1;overflow:hidden}.messages-panel{flex:1;display:flex;flex-direction:column;background:#fff;margin:16px 8px 16px 16px;border-radius:12px;box-shadow:0 2px 8px #00000014;overflow:hidden}.messages-list{flex:1;overflow-y:auto;padding:20px}.message{max-width:70%;margin-bottom:16px;padding:12px 16px;border-radius:12px;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.message-other{background:#f1f5f9;border-bottom-left-radius:4px;color:var(--text-primary)}.message-staff{background:var(--accent-color);color:var(--button-text);margin-left:auto;border-bottom-right-radius:4px;box-shadow:0 2px 6px #d4af3733}.message-header{display:flex;justify-content:space-between;font-size:11px;margin-bottom:6px;opacity:.7}.message-content{font-size:14px;line-height:1.5;word-wrap:break-word}.message-image{max-width:200px;border-radius:8px;margin-bottom:8px}.message-input-container{display:flex;gap:12px;padding:16px;border-top:1px solid #e5e7eb;background:#fafafa}.message-input-container textarea{flex:1;padding:12px;border:1px solid #d1d5db;border-radius:8px;resize:none;font-size:14px;min-height:50px;max-height:120px;font-family:inherit}.message-input-container textarea:focus{outline:none;border-color:var(--accent-color);box-shadow:0 0 0 3px #d4af371a}.send-btn{padding:12px 24px;background:var(--accent-color);color:var(--button-text);border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:all .2s}.send-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #d4af374d}.send-btn:disabled{opacity:.5;cursor:not-allowed}.suggestions-panel{width:320px;background:#fff;margin:16px 16px 16px 8px;border-radius:12px;box-shadow:0 2px 8px #00000014;display:flex;flex-direction:column;transition:width .3s,margin .3s;overflow:hidden}.suggestions-panel.collapsed{width:48px;min-width:48px}.suggestions-header{display:flex;align-items:center;justify-content:space-between;padding:16px;background:var(--accent-light);color:var(--button-text)}.suggestions-header h3{margin:0;font-size:14px;font-weight:600;white-space:nowrap}.toggle-btn{background:#fff3;border:none;color:#fff;width:28px;height:28px;border-radius:6px;cursor:pointer;font-size:12px}.suggestions-content{flex:1;overflow-y:auto;padding:12px}.loading-suggestions,.no-suggestions{text-align:center;padding:30px 16px;color:#6b7280;font-size:13px}.refresh-btn{display:block;margin:16px auto 0;padding:8px 16px;background:var(--accent-color);color:var(--button-text);border:none;border-radius:6px;cursor:pointer;font-size:12px}.suggestion-card{background:#f9fafb;border:1px solid #e5e7eb;border-radius:10px;padding:14px;margin-bottom:12px;transition:all .2s}.suggestion-card:hover{border-color:#667eea;box-shadow:0 2px 8px #667eea26}.financial-badge{display:inline-block;background:#fef3c7;color:#92400e;padding:4px 10px;border-radius:6px;font-size:11px;font-weight:600;margin-bottom:8px}.template-name{font-size:11px;color:#667eea;font-weight:600;margin-bottom:6px}.suggestion-text{font-size:13px;line-height:1.5;color:#374151;margin-bottom:10px;background:#fff;padding:10px;border-radius:6px;border:1px solid #e5e7eb}.confidence-bar{display:flex;align-items:center;gap:8px;font-size:11px;color:#6b7280;margin-bottom:10px}.confidence-track{flex:1;height:6px;background:#e5e7eb;border-radius:3px;overflow:hidden}.confidence-fill{height:100%;background:linear-gradient(90deg,#f59e0b,#22c55e);border-radius:3px;transition:width .3s}.suggestion-actions{display:flex;gap:8px}.btn-use,.btn-edit,.btn-dismiss{flex:1;padding:8px;border:none;border-radius:6px;font-size:12px;font-weight:600;cursor:pointer;transition:all .2s}.btn-use{background:#22c55e;color:#fff}.btn-use:hover{background:#16a34a}.btn-edit{background:#3b82f6;color:#fff}.btn-edit:hover{background:#2563eb}.btn-dismiss{background:#f1f3f5;color:#6b7280;flex:0;width:36px}.btn-dismiss:hover{background:#ef4444;color:#fff}.chat-loading{display:flex;align-items:center;justify-content:center;height:100vh;font-size:16px;color:#6b7280}@media(max-width:768px){.suggestions-panel{display:none}.sla-timer-bar{flex-wrap:wrap;gap:8px}.sla-item{min-width:80px}}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--bg-color);color:var(--text-primary)}.app-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;background:var(--bg-gradient);color:var(--text-muted)}.spinner{width:40px;height:40px;border:3px solid rgba(212,175,55,.2);border-top-color:var(--accent-color);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:16px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#ffffff0d}::-webkit-scrollbar-thumb{background:#fff3;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#ffffff4d}