/**
 * BG Assistant Bot Message Styling
 * Distinct indigo/purple theme — separate from admin (teal) and regular messages (blue/gray)
 */

/* ==================== BOT MESSAGE CONTAINER ==================== */

.bot-message-container {
    padding-top: 12px;
}

/* Bot bubble — indigo gradient */
.chat-telegram .bot-message {
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.2) 0%, rgba(79, 70, 229, 0.15) 100%) !important;
    border: 1px solid rgba(99, 102, 241, 0.25) !important;
    border-radius: 12px 12px 12px 2px;
}

.chat-telegram .bot-message:hover {
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.28) 0%, rgba(79, 70, 229, 0.22) 100%) !important;
}

/* Bot bubble tail */
.chat-telegram .bot-message::before {
    border-right-color: rgba(99, 102, 241, 0.2) !important;
}

.chat-telegram .bot-message:hover::before {
    border-right-color: rgba(99, 102, 241, 0.28) !important;
}

/* Bot name color */
.bot-message-container .name {
    color: #818cf8 !important;
    font-weight: 700;
}

/* ==================== BOT BADGE ==================== */

.bot-badge {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 1px 6px;
    border-radius: 4px;
    background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);
    color: #fff;
    margin-left: 6px;
    vertical-align: middle;
}

/* ==================== WHISPER INDICATOR ==================== */

.bot-whisper-indicator {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 10px;
    color: rgba(129, 140, 248, 0.7);
    margin-top: 2px;
    font-style: italic;
}

.bot-whisper-indicator i {
    font-size: 10px;
}

/* ==================== BOT AVATAR ==================== */

.bot-message-container .message-avatar img {
    border: 2px solid rgba(99, 102, 241, 0.3);
    border-radius: 50%;
}

/* ==================== LIGHT THEME ==================== */

html[data-theme='light'] .chat-telegram .bot-message {
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.08) 0%, rgba(79, 70, 229, 0.05) 100%) !important;
    border: 1px solid rgba(99, 102, 241, 0.2) !important;
}

html[data-theme='light'] .chat-telegram .bot-message:hover {
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.14) 0%, rgba(79, 70, 229, 0.1) 100%) !important;
}

html[data-theme='light'] .chat-telegram .bot-message::before {
    border-right-color: rgba(99, 102, 241, 0.08) !important;
}

html[data-theme='light'] .bot-message-container .name {
    color: #4f46e5 !important;
}

html[data-theme='light'] .bot-whisper-indicator {
    color: rgba(79, 70, 229, 0.6);
}

html[data-theme='light'] .bot-message-container .message-avatar img {
    border-color: rgba(99, 102, 241, 0.25);
}