/* Global styles extracted from inline <style> blocks */
body {
    min-height: 100vh;
    background: linear-gradient(135deg, #eef2f7 0%, #f8fbff 100%);
}

.navbar {
    backdrop-filter: saturate(180%) blur(10px);
    background: rgba(255, 255, 255, 0.8);
}

.card {
    border: none;
    border-radius: 16px;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
}

.form-label {
    font-weight: 600;
}

.brand {
    font-weight: 700;
}

.char-counter {
    font-size: 0.85rem;
    color: #6c757d;
}

/* Admin table message truncation */
.message-truncate {
    max-width: 360px;
}

/* Chat UI */
.chat-container {
    height: 60vh;
    overflow-y: auto;
    padding: 1rem;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 6px 20px rgba(0,0,0,0.06);
    display: flex;
    flex-direction: column;
}
.chat-bubble {
    max-width: 70%;
    padding: .5rem .75rem;
    border-radius: 12px;
    margin-bottom: .5rem;
    display: inline-block;
}
.chat-bubble.me {
    margin-left: auto;
    background: #0d6efd;
    color: #fff;
    align-self: flex-end;
}
.chat-bubble.them {
    margin-right: auto;
    background: #f1f3f5;
    align-self: flex-start;
}
.chat-time {
    font-size: .75rem;
    color: #6c757d;
    margin-top: .125rem;
}