/* ─── Liste discussions ─── */
.discussion-list { display: flex; flex-direction: column; gap: 8px; }

.discussion-card {
    display: flex; align-items: center; gap: 12px;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    padding: .875rem 1rem;
    text-decoration: none; color: var(--color-text);
    transition: border-color .15s, box-shadow .15s;
}
.discussion-card:hover { border-color: var(--color-primary); box-shadow: 0 2px 8px rgba(0,0,0,.06); text-decoration: none; }
.discussion-card--unread { border-left: 3px solid var(--color-primary); }

.discussion-card__avatar {
    width: 40px; height: 40px; border-radius: 50%; flex-shrink: 0;
    background: #EEF2FF; color: var(--color-primary);
    display: flex; align-items: center; justify-content: center;
    font-weight: 600; font-size: 14px;
}
.discussion-card__body  { flex: 1; min-width: 0; }
.discussion-card__title { font-weight: 600; font-size: 15px; margin-bottom: .2rem; }
.discussion-card__desc  { font-size: 13px; color: var(--color-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.discussion-card__meta  { font-size: 12px; color: var(--color-muted); margin-top: .2rem; }
.discussion-card__badge {
    background: var(--color-primary); color: #fff;
    border-radius: 20px; font-size: 12px; font-weight: 600;
    padding: 2px 8px; flex-shrink: 0;
}
.discussion-card__arrow { color: var(--color-muted); flex-shrink: 0; }

/* ─── Fenêtre de chat ─── */
.chat-layout { height: calc(100vh - 120px); display: flex; flex-direction: column; }
.chat-window {
    flex: 1; display: flex; flex-direction: column;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    overflow: hidden;
    min-height: 0;
}
.chat-desc {
    padding: .75rem 1rem;
    border-bottom: 1px solid var(--color-border);
    font-size: 13px; color: var(--color-muted);
    background: var(--color-bg);
}

/* ─── Zone messages ─── */
.chat-messages {
    flex: 1; overflow-y: auto;
    padding: 1rem; display: flex;
    flex-direction: column; gap: 4px;
    scroll-behavior: smooth;
}
.chat-empty {
    text-align: center; color: var(--color-muted);
    font-size: 14px; margin: auto;
}
.chat-date-sep {
    text-align: center; font-size: 12px;
    color: var(--color-muted); margin: .75rem 0 .5rem;
    display: flex; align-items: center; gap: 8px;
}
.chat-date-sep::before, .chat-date-sep::after {
    content: ''; flex: 1;
    border-top: 1px solid var(--color-border);
}

/* ─── Bulles de messages ─── */
.chat-msg {
    display: flex; align-items: flex-end; gap: 8px;
    max-width: 75%; margin-bottom: 4px;
}
.chat-msg--mine { align-self: flex-end; flex-direction: row-reverse; }

.chat-msg__avatar {
    width: 30px; height: 30px; border-radius: 50%; flex-shrink: 0;
    background: #EEF2FF; color: var(--color-primary);
    display: flex; align-items: center; justify-content: center;
    font-weight: 600; font-size: 11px;
}

.chat-msg__bubble { display: flex; flex-direction: column; gap: 2px; }

.chat-msg__author {
    font-size: 11px; font-weight: 600;
    color: var(--color-muted); padding: 0 12px;
}

.chat-msg__text {
    background: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: 16px 16px 16px 4px;
    padding: .5rem .875rem;
    font-size: 14px; line-height: 1.5;
    word-break: break-word;
}
.chat-msg--mine .chat-msg__text {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: #fff;
    border-radius: 16px 16px 4px 16px;
}

.chat-msg__time {
    font-size: 10px; color: var(--color-muted);
    padding: 0 12px; align-self: flex-end;
}
.chat-msg--mine .chat-msg__time { align-self: flex-start; }

/* ─── Formulaire de saisie ─── */
.chat-form {
    display: flex; gap: 10px; align-items: flex-end;
    padding: .75rem 1rem;
    border-top: 1px solid var(--color-border);
    background: var(--color-surface);
}
.chat-input {
    flex: 1; resize: none; min-height: 40px; max-height: 160px;
    padding: .6rem .875rem;
    border: 1px solid var(--color-border);
    border-radius: 20px; font-size: 14px;
    font-family: inherit; line-height: 1.5;
    background: var(--color-bg);
    transition: border-color .15s;
    overflow-y: auto;
}
.chat-input:focus {
    outline: none; border-color: var(--color-primary);
    background: var(--color-surface);
}
.chat-send {
    flex-shrink: 0; padding: .6rem 1.25rem;
    background: var(--color-primary); color: #fff;
    border: none; border-radius: 20px;
    font-size: 14px; font-weight: 500;
    cursor: pointer; transition: background .15s;
}
.chat-send:hover { background: var(--color-primary-h); }
