/* assets/messaging.css - Version  Elite */

.messaging-layout {
    display: grid;
    grid-template-columns: 320px 1fr 300px; /* 3 colonnes : Liste / Chat / Intel */
    height: calc(100vh - 160px);
    background: white;
    border-radius: 24px;
    overflow: hidden;
    border: 1px solid #EAEAEA;
    box-shadow: 0 10px 40px rgba(0,0,0,0.03);
}

/* --- LISTE DES CONVERSATIONS (SIDEBAR GAUCHE) --- */
.msg-sidebar { border-right: 1px solid #F5F5F7; display: flex; flex-direction: column; background: #FFF; }
.msg-search-area { padding: 20px; border-bottom: 1px solid #FAFAFA; }
.search-input { width: 100%; padding: 10px 15px; border-radius: 12px; border: 1px solid #EEE; background: #F9F9FB; font-size: 13px; outline: none; }

.conversation-list { flex: 1; overflow-y: auto; padding: 10px 0; }
.conv-item {
    padding: 12px 16px;
    margin: 4px 12px;
    border-radius: 14px;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    gap: 12px;
    border-left: none !important; /* SUPPRESSION BORDURE BLEUE */
}

.conv-item:hover { background: #F5F5F7; }
.conv-item.active { background: #E1F0FF !important; } /* Fond bleu doux */

.conv-avatar { width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: white; font-weight: 700; position: relative; flex-shrink: 0; }

/* --- POINT DE NOTIFICATION PULSANT --- */
@keyframes notification-pulse {
    0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(0, 113, 227, 0.7); }
    70% { transform: scale(1); box-shadow: 0 0 0 6px rgba(0, 113, 227, 0); }
    100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(0, 113, 227, 0); }
}
.status-dot {
    position: absolute; bottom: 0; right: 0; width: 10px; height: 10px; background: #0071E3; 
    border: 2px solid white; border-radius: 50%; 
    animation: notification-pulse 2s infinite cubic-bezier(0.4, 0, 0.2, 1);
}

/* --- ZONE DE CHAT (CENTRE) --- */
.msg-content { display: flex; flex-direction: column; background: #FAFAFA; }
.chat-header { padding: 15px 25px; background: white; border-bottom: 1px solid #EEE; display: flex; justify-content: space-between; align-items: center; }
.chat-messages { flex: 1; padding: 25px; overflow-y: auto; display: flex; flex-direction: column; gap: 15px; }

.msg-bubble { max-width: 75%; padding: 12px 16px; border-radius: 18px; font-size: 14px; line-height: 1.5; }
.msg-bubble.client { background: white; color: #1D1D1F; border: 1px solid #EAEAEA; border-bottom-left-radius: 4px; }
.msg-bubble.me { background: #1D1D1F; color: white; border-bottom-right-radius: 4px; align-self: flex-end; }

/* --- SIDEBAR INTEL (DROITE) --- */
.msg-intel { padding: 25px; background: white; border-left: 1px solid #F5F5F7; display: flex; flex-direction: column; gap: 30px; }
.intel-section h4 { font-size: 11px; font-weight: 700; color: #888; text-transform: uppercase; margin-bottom: 15px; letter-spacing: 0.5px; }

/* --- BROUILLON IA --- */
.ai-suggestion-box { background: #F4E1FF; border: 1px solid #E9D5FF; border-radius: 18px; padding: 20px; margin: 20px; box-shadow: 0 4px 15px rgba(175, 82, 222, 0.1); }