:root {
    --primary: #2c7be5;
    --bg-light: #f9fbfd;
}
body { background-color: var(--bg-light); font-family: 'Inter', sans-serif; }
.card { border: none; box-shadow: 0 0.75rem 1.5rem rgba(18,38,63,.03); border-radius: 0.5rem; }
.hero-bg {
    background: linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.6)), url('https://images.unsplash.com/photo-1556740758-90de374c12ad?auto=format&fit=crop&w=1920&q=80');
    background-size: cover;
    background-position: center;
    color: white;
    padding: 100px 0;
}
.chat-bubble { padding: 15px; border-radius: 10px; margin-bottom: 10px; max-width: 80%; }
.bubble-customer { background: #e3f2fd; margin-left: auto; text-align: right; }
.bubble-agent { background: #fff; border: 1px solid #eee; }
.status-badge { font-size: 0.8em; padding: 5px 10px; border-radius: 20px; }
.bg-open { background-color: #28a745; color: white; }
.bg-pending { background-color: #ffc107; color: black; }
.bg-closed { background-color: #6c757d; color: white; }