.chat-container{display:flex;flex-direction:column;height:100vh;max-width:1000px;margin:0 auto;background:var(--surface)}.chat-header{padding:1.5rem 2rem;background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);color:#fff;box-shadow:0 4px 6px var(--shadow);display:flex;justify-content:space-between;align-items:center}.chat-header h1{font-size:1.5rem;margin-bottom:.25rem}.chat-header p{opacity:.9;font-size:.875rem}.dashboard-link{color:#fff;text-decoration:none;padding:.5rem 1rem;border:2px solid rgba(255,255,255,.3);border-radius:.5rem;font-size:.875rem;transition:all .2s ease}.dashboard-link:hover{background:#ffffff1a;border-color:#fff}.case-info{display:flex;gap:.75rem;align-items:center;margin-top:.5rem}.case-info .badge{background:#fff3;color:#fff}.case-info .sentiment{font-size:.75rem;font-weight:500;text-transform:capitalize;padding:.25rem .75rem;background:#fff3;border-radius:9999px}.form-container{flex:1;overflow-y:auto;padding:2rem;display:flex;justify-content:center;align-items:center}.support-form{width:100%;max-width:600px;background:var(--surface);padding:2rem;border-radius:1rem;box-shadow:0 4px 20px var(--shadow)}.form-group{margin-bottom:1.5rem}.form-group label{display:block;margin-bottom:.5rem;font-weight:600;color:var(--text);font-size:.875rem}.form-group input,.form-group textarea{width:100%;padding:.75rem;border:2px solid var(--border);border-radius:.5rem;font-size:.875rem;transition:border-color .2s ease}.form-group input:focus,.form-group textarea:focus{border-color:var(--primary);outline:none}.form-group textarea{resize:vertical;font-family:inherit}.support-form .btn{width:100%;padding:.875rem;font-size:1rem;margin-top:.5rem}.messages-container{flex:1;overflow-y:auto;padding:2rem;background:var(--background)}.message{margin-bottom:1.5rem;animation:slideIn .3s ease}@keyframes slideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.message-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.message-sender{font-weight:600;font-size:.875rem;color:var(--text)}.message-time{font-size:.75rem;color:var(--text-secondary)}.message-content{padding:1rem;border-radius:1rem;font-size:.875rem;line-height:1.5;max-width:80%}.message-user .message-content{background:var(--primary);color:#fff;margin-left:auto;border-bottom-right-radius:.25rem}.message-agent .message-content{background:var(--surface);color:var(--text);border:1px solid var(--border);border-bottom-left-radius:.25rem}.message-input-form{display:flex;gap:.75rem;padding:1.5rem 2rem;background:var(--surface);border-top:1px solid var(--border);box-shadow:0 -2px 10px var(--shadow)}.message-input{flex:1;padding:.875rem 1rem;border:2px solid var(--border);border-radius:.75rem;font-size:.875rem;transition:border-color .2s ease}.message-input:focus{border-color:var(--primary);outline:none}.message-input-form .btn{padding:.875rem 2rem;white-space:nowrap}@media (max-width: 768px){.chat-header{flex-direction:column;align-items:flex-start;gap:1rem}.message-content{max-width:90%}.form-container{padding:1rem}.support-form{padding:1.5rem}}.dashboard-container{min-height:100vh;background:var(--background);padding:2rem}.dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.dashboard-header h1{font-size:2rem;color:var(--text);margin-bottom:.5rem}.dashboard-header p{color:var(--text-secondary);font-size:.875rem}.loading{text-align:center;padding:3rem;font-size:1.125rem;color:var(--text-secondary)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem;margin-bottom:2rem}.stat-card{background:var(--surface);padding:1.5rem;border-radius:1rem;box-shadow:0 2px 8px var(--shadow);transition:transform .2s ease,box-shadow .2s ease}.stat-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px var(--shadow)}.stat-card.stat-open{border-left:4px solid var(--warning)}.stat-card.stat-resolved{border-left:4px solid var(--secondary)}.stat-label{font-size:.875rem;color:var(--text-secondary);margin-bottom:.5rem;font-weight:500}.stat-value{font-size:2rem;font-weight:700;color:var(--text)}.category-section{margin-bottom:2rem}.category-section h2{font-size:1.25rem;margin-bottom:1rem;color:var(--text)}.category-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem}.category-card{background:var(--surface);padding:1rem;border-radius:.75rem;box-shadow:0 2px 6px var(--shadow);text-align:center;transition:transform .2s ease}.category-card:hover{transform:translateY(-2px)}.category-name{font-size:.875rem;color:var(--text-secondary);margin-bottom:.5rem}.category-count{font-size:1.5rem;font-weight:700;color:var(--primary)}.filters-section{background:var(--surface);padding:1.5rem;border-radius:1rem;box-shadow:0 2px 8px var(--shadow);margin-bottom:2rem;display:flex;gap:1.5rem;align-items:flex-end;flex-wrap:wrap}.filter-group{flex:1;min-width:200px}.filter-group label{display:block;font-size:.875rem;font-weight:600;color:var(--text);margin-bottom:.5rem}.filter-group select{width:100%;padding:.625rem;border:2px solid var(--border);border-radius:.5rem;font-size:.875rem;background:#fff;cursor:pointer;transition:border-color .2s ease}.filter-group select:focus{outline:none;border-color:var(--primary)}.btn-clear-filters{padding:.625rem 1rem;background:var(--text-secondary);color:#fff;border:none;border-radius:.5rem;font-size:.875rem;cursor:pointer;transition:background .2s ease}.btn-clear-filters:hover{background:var(--text)}.cases-section{background:var(--surface);padding:1.5rem;border-radius:1rem;box-shadow:0 2px 8px var(--shadow)}.cases-section h2{font-size:1.25rem;margin-bottom:1.5rem;color:var(--text)}.empty-state{text-align:center;padding:3rem;color:var(--text-secondary)}.cases-table{overflow-x:auto}.cases-table table{width:100%;border-collapse:collapse}.cases-table th{text-align:left;padding:.75rem;font-size:.75rem;font-weight:600;text-transform:uppercase;color:var(--text-secondary);border-bottom:2px solid var(--border)}.cases-table td{padding:1rem .75rem;border-bottom:1px solid var(--border);font-size:.875rem}.cases-table tbody tr{transition:background .2s ease}.cases-table tbody tr:hover{background:var(--background)}.customer-info{display:flex;flex-direction:column;gap:.25rem}.customer-name{font-weight:600;color:var(--text)}.customer-email{font-size:.75rem;color:var(--text-secondary)}.subject-cell{max-width:250px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.category-badge{display:inline-block;padding:.25rem .625rem;background:var(--background);color:var(--text);border-radius:.375rem;font-size:.75rem;font-weight:500}.date-cell{white-space:nowrap;color:var(--text-secondary)}.btn-view{display:inline-block;padding:.375rem .875rem;background:var(--primary);color:#fff;text-decoration:none;border-radius:.375rem;font-size:.75rem;font-weight:600;transition:background .2s ease}.btn-view:hover{background:var(--primary-dark)}@media (max-width: 768px){.dashboard-container{padding:1rem}.dashboard-header{flex-direction:column;align-items:flex-start;gap:1rem}.stats-grid{grid-template-columns:1fr 1fr}.filters-section{flex-direction:column;align-items:stretch}.filter-group{min-width:100%}.cases-table{font-size:.75rem}.subject-cell{max-width:150px}}.case-details-container{min-height:100vh;background:var(--background)}.case-header{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);padding:2rem;color:#fff;box-shadow:0 4px 6px var(--shadow)}.back-link{color:#fff;text-decoration:none;font-size:.875rem;margin-bottom:.5rem;display:inline-block;opacity:.9;transition:opacity .2s ease}.back-link:hover{opacity:1}.case-header h1{font-size:2rem;margin-top:.5rem}.case-content{display:grid;grid-template-columns:1fr 350px;gap:2rem;padding:2rem;max-width:1400px;margin:0 auto}.case-main{display:flex;flex-direction:column;gap:1.5rem}.case-info-card,.messages-card,.sidebar-card{background:var(--surface);border-radius:1rem;padding:1.5rem;box-shadow:0 2px 8px var(--shadow)}.case-info-card h2{font-size:1.5rem;color:var(--text);margin-bottom:1rem}.case-meta{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.5rem;padding-bottom:1.5rem;border-bottom:1px solid var(--border)}.meta-item{display:flex;gap:.5rem}.meta-label{font-weight:600;color:var(--text-secondary);font-size:.875rem}.meta-value{color:var(--text);font-size:.875rem}.description h3{font-size:1rem;color:var(--text);margin-bottom:.75rem}.description p{color:var(--text-secondary);line-height:1.6;font-size:.875rem}.messages-card h3{font-size:1.125rem;color:var(--text);margin-bottom:1rem}.messages-list{max-height:500px;overflow-y:auto;margin-bottom:1.5rem;padding-right:.5rem}.messages-list .message{margin-bottom:1rem}.messages-list .message-header{display:flex;justify-content:space-between;margin-bottom:.5rem}.messages-list .message-sender{font-weight:600;font-size:.875rem;color:var(--text)}.messages-list .message-time{font-size:.75rem;color:var(--text-secondary)}.messages-list .message-content{padding:.875rem;border-radius:.75rem;font-size:.875rem;line-height:1.5}.messages-list .message-customer .message-content{background:#e0e7ff;color:var(--text)}.messages-list .message-agent .message-content{background:var(--background);color:var(--text);border:1px solid var(--border)}.message-form{display:flex;flex-direction:column;gap:.75rem}.message-form textarea{width:100%;padding:.875rem;border:2px solid var(--border);border-radius:.5rem;font-size:.875rem;font-family:inherit;resize:vertical;transition:border-color .2s ease}.message-form textarea:focus{outline:none;border-color:var(--primary)}.message-form .btn{align-self:flex-end}.case-sidebar{display:flex;flex-direction:column;gap:1.5rem}.sidebar-card h3{font-size:.875rem;font-weight:600;color:var(--text);margin-bottom:1rem;text-transform:uppercase;letter-spacing:.5px}.status-buttons{display:flex;flex-direction:column;gap:.5rem}.status-btn{padding:.625rem;border:2px solid var(--border);background:#fff;color:var(--text);border-radius:.5rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s ease;text-align:left}.status-btn:hover:not(:disabled){border-color:var(--primary);background:#4f46e50d}.status-btn.active{border-color:var(--primary);background:var(--primary);color:#fff}.status-btn:disabled{opacity:.5;cursor:not-allowed}.category-select,.priority-select{width:100%;padding:.625rem;border:2px solid var(--border);border-radius:.5rem;font-size:.875rem;background:#fff;cursor:pointer;transition:border-color .2s ease}.category-select:focus,.priority-select:focus{outline:none;border-color:var(--primary)}.sentiment-display{padding:.75rem;border-radius:.5rem;font-size:.875rem;font-weight:600;text-align:center;text-transform:capitalize}.sentiment-display.sentiment-positive{background:#d1fae5;color:#065f46}.sentiment-display.sentiment-neutral{background:#f3f4f6;color:#374151}.sentiment-display.sentiment-negative{background:#fee2e2;color:#991b1b}.resolved-time{font-size:.875rem;color:var(--text-secondary)}.loading,.error{text-align:center;padding:3rem;font-size:1.125rem;color:var(--text-secondary)}@media (max-width: 1024px){.case-content{grid-template-columns:1fr;padding:1rem}.case-sidebar{order:-1}}@media (max-width: 768px){.case-header{padding:1.5rem 1rem}.case-header h1{font-size:1.5rem}.messages-list{max-height:400px}}.app{min-height:100vh;display:flex;flex-direction:column}*{margin:0;padding:0;box-sizing:border-box}:root{--primary: #4f46e5;--primary-dark: #4338ca;--secondary: #10b981;--danger: #ef4444;--warning: #f59e0b;--background: #f9fafb;--surface: #ffffff;--text: #111827;--text-secondary: #6b7280;--border: #e5e7eb;--shadow: rgba(0, 0, 0, .1)}body{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;background:var(--background);color:var(--text)}#root{min-height:100vh}.container{max-width:1200px;margin:0 auto;padding:0 1rem}button{cursor:pointer;border:none;outline:none;font-family:inherit;transition:all .2s ease}button:disabled{opacity:.5;cursor:not-allowed}input,textarea{font-family:inherit;outline:none}.btn{padding:.625rem 1.25rem;border-radius:.5rem;font-weight:500;font-size:.875rem;transition:all .2s ease}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover:not(:disabled){background:var(--primary-dark);transform:translateY(-1px);box-shadow:0 4px 12px #4f46e54d}.btn-secondary{background:var(--secondary);color:#fff}.btn-secondary:hover:not(:disabled){background:#059669;transform:translateY(-1px)}.badge{display:inline-block;padding:.25rem .75rem;border-radius:9999px;font-size:.75rem;font-weight:600;text-transform:uppercase}.badge-open{background:#dbeafe;color:#1e40af}.badge-in-progress{background:#fef3c7;color:#92400e}.badge-resolved{background:#d1fae5;color:#065f46}.badge-closed{background:#e5e7eb;color:#374151}.priority-critical{color:var(--danger)}.priority-high{color:var(--warning)}.priority-medium{color:var(--text-secondary)}.priority-low,.sentiment-positive{color:var(--secondary)}.sentiment-neutral{color:var(--text-secondary)}.sentiment-negative{color:var(--danger)}