/* Мессенджеры (Wazzup): поле ответа внизу переписки сделки и крупные ярлыки файлов. */

/* Ярлыки файлов во всех сообщениях: крупнее, расширение — на самом ярлыке. */
.file-chip { gap:10px; max-width:340px; margin:4px 8px 4px 0; padding:7px 14px 7px 7px; border-radius:12px; }
.file-chip-ext { display:inline-flex; align-items:center; justify-content:center; min-width:44px; height:44px; padding:0 6px;
  border-radius:8px; background:var(--accent-soft); border:1px solid var(--accent); color:var(--accent);
  font-size:13px; font-weight:800; letter-spacing:.03em; text-transform:uppercase; }
.file-chip-name { font-size:13px; }

/* Поле ответа: как строка ввода мессенджера. margin-top:auto (17.10.2026) -- #desk-panel бывает
   flex-колонкой (.timeline-fill/.agent-chat-mode) выше высоты переписки; без этого поле ввода
   повисало сразу под лентой сообщений, а под ним пустовала вся оставшаяся высота панели. Авто-отступ
   прижимает композер к низу панели, где он и должен быть. В обычном (не-flex) контексте auto-margin
   ничего не меняет. */
.wz-composer { position:sticky; bottom:0; z-index:5; display:flex; flex-direction:column; gap:4px; margin-top:auto;
  padding:10px 0 0; border-top:1px solid var(--line); background:#fff; }
.wz-bar { display:flex; align-items:flex-end; gap:8px; }
.wz-bar > * { margin:0 !important; }
.wz-attach { flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; padding:0; border-radius:50%; color:var(--accent); box-sizing:border-box; }
.wz-attach:hover:not(:disabled) { background:var(--accent-soft); border-color:var(--accent); }
.wz-input { flex:1 1 auto; min-width:0; }
#desk-root .wz-input textarea, .wz-composer .wz-input textarea { display:block; width:100%; height:44px; min-height:44px !important; max-height:220px;
  padding:11px 16px !important; border:1px solid var(--line); border-radius:22px; font:14px/20px Segoe UI,Arial,sans-serif;
  resize:none !important; overflow-y:hidden; background:var(--wash); color:var(--ink); box-sizing:border-box; }
.wz-targets { flex:0 0 auto; display:flex; gap:4px; }
.wz-target { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; padding:0;
  border-radius:50%; background:transparent; border:1px solid transparent; box-shadow:none; }
.wz-target svg { width:34px; height:34px; }
.wz-target:hover:not(:disabled) { transform:translateY(-1px); }
.wz-target.wz-whatsapp:hover:not(:disabled) { border-color:#25D366; background:#e7f9ee; }
.wz-target.wz-telegram:hover:not(:disabled) { border-color:#2AABEE; background:#e6f5fd; }
.wz-target.wz-max:hover:not(:disabled) { border-color:#7B5CFF; background:#efebff; }
.wz-target.wz-mail:hover:not(:disabled) { border-color:var(--accent); background:var(--accent-soft); }
.wz-target:disabled { opacity:.35; filter:grayscale(1); cursor:not-allowed; }
.wz-files { display:flex; flex-wrap:wrap; }
.wz-files .file-chip { position:relative; padding-right:30px; }
.wz-file-remove { position:absolute; right:6px; top:50%; transform:translateY(-50%); width:20px; height:20px; padding:0;
  border-radius:50%; background:var(--muted); font-size:13px; line-height:20px; }
.wz-status { color:var(--muted); font-size:11px; }
.wz-status:empty { display:none; }
@media (max-width:560px) { .wz-target { width:38px; height:38px; } .wz-target svg { width:30px; height:30px; } }

/* Микрофон диктовки — значок вместо эмодзи во всех полях. */
.field-mic { display:inline-flex; align-items:center; justify-content:center; }
.field-mic .ui-icon { display:block; }
.wz-mic { flex:0 0 auto; width:44px; height:44px; padding:0; border-radius:50%; color:var(--accent); box-sizing:border-box; }
.wz-mic.field-mic-recording { background:#ffe3e0; color:#c0392b; border-color:#c0392b; }
