/* 메신저 화면 모양: 왼쪽 직원 목록, 오른쪽 대화, 아래 입력 */
.messenger { display: grid; contain: size; grid-template-columns: 230px minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); gap: 6px; }
.messenger-list { display: flex; flex-direction: column; }
.messenger-contact { display: flex; align-items: center; gap: 6px; width: 100%; height: 28px; text-align: left; border: 0; border-bottom: 1px solid var(--line-soft); background: none; padding: 0 6px; cursor: pointer; }
.messenger-contact i { flex: 0 0 8px; height: 16px; }
.messenger-contact:hover { background: var(--hover); }
.messenger-contact.on { background: var(--sel); }
.messenger-name { flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.messenger-unread { flex: 0 0 auto; min-width: 20px; text-align: center; background: var(--red); color: #fff; font-size: 11px; font-weight: 700; padding: 0 4px; }
.messenger-talk { display: flex; flex-direction: column; overflow: hidden; }
.messenger-log { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 8px 10px; background: #f4f6f9; display: flex; flex-direction: column; gap: 5px; }
.messenger-empty { color: var(--muted); text-align: center; padding: 30px; }
.messenger-day { align-self: center; color: var(--muted); font-size: 11px; border-bottom: 1px solid var(--line-soft); padding: 0 10px; margin: 4px 0 2px; }
.messenger-msg { align-self: flex-start; max-width: 62%; }
.messenger-msg.mine { align-self: flex-end; }
.messenger-meta { font-size: 11px; color: var(--muted); }
.messenger-msg.mine .messenger-meta { text-align: right; }
.messenger-text { background: #fff; border: 1px solid var(--line); padding: 4px 8px; white-space: pre-wrap; word-break: break-word; }
.messenger-msg.mine .messenger-text { background: var(--blue-soft); border-color: #a9c0e6; }
.messenger-calls { flex: 0 0 auto; display: flex; flex-wrap: wrap; gap: 4px; align-items: center; padding: 4px 6px; border-top: 1px solid var(--line); background: #fff; }
.messenger-write { flex: 0 0 auto; display: flex; gap: 6px; padding: 0 6px 6px; background: #fff; }
.messenger-input { resize: none; }
.messenger-write .btn { align-self: stretch; min-width: 76px; }