/* AI-помічник: розгорнуте вікно, вкладення і голос (відгук Farmak 15.10.2026).
   Базова панель .asst описана в analysis.css, тут лише нове поверх неї. */

.asst-h b { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.asst-x { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 8px; flex: none; color: var(--muted); }
.asst-x:hover { background: var(--surface-3); color: var(--text); }
.asst-x:focus-visible, .asst-clip:focus-visible, .asst-mic:focus-visible, .asst-chip-x:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* Розгорнуте вікно: майже весь екран, стрічка повідомлень росте разом з ним */
.asst.asst-big { right: 16px; bottom: 16px; width: min(960px, calc(100vw - 32px)); height: calc(100vh - 32px); height: calc(100dvh - 32px); }
.asst.asst-big .asst-m { max-width: min(760px, 88%); font-size: 14.5px; }
.asst.asst-big .asst-f textarea { height: 88px; }
@media (prefers-reduced-motion: no-preference) {
  .asst { transition: width .18s ease, height .18s ease; }
}

/* Скріпка поруч з полем */
.asst-clip { display: inline-grid; place-items: center; flex: none; width: 42px; border: 1px solid var(--line-2); background: var(--surface); color: var(--text-2); border-radius: 10px; cursor: pointer; }
.asst-clip:hover, .asst-mic:hover { border-color: var(--accent-border); color: var(--accent-text); }
.asst-mic { flex: none; }
.asst-send { flex: none; }
/* Загальне правило textarea (min-height 90px) у вікні помічника забирало місце у стрічки */
.asst-f textarea { min-width: 0; min-height: 0; height: 56px; }

/* Додані до питання знімки і файли */
.asst-att { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 10px 0; border-top: 1px solid var(--line); background: var(--surface); }
.asst-att[hidden] { display: none; }
.asst-chip { position: relative; display: inline-flex; align-items: center; gap: 6px; max-width: 220px; min-height: 40px; padding: 4px 26px 4px 6px; border: 1px solid var(--line-2); border-radius: 10px; background: var(--surface-2); color: var(--text); font-size: 12px; }
.asst-chip.img { padding: 3px 26px 3px 3px; }
.asst-chip img { width: 52px; height: 40px; object-fit: cover; object-position: left top; border-radius: 7px; display: block; background: var(--surface-3); }
.asst-chip-x { position: absolute; top: 2px; right: 2px; width: 22px; height: 22px; border: none; border-radius: 6px; background: transparent; color: var(--muted); font-size: 16px; line-height: 1; cursor: pointer; }
.asst-chip-x:hover { background: var(--surface-3); color: var(--text); }
.asst-doc { display: inline-flex; align-items: center; gap: 6px; min-width: 0; color: var(--text); }
.asst-doc > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.asst-doc .ico { color: var(--accent-text); }

/* Вкладення у надісланому питанні */
.asst-m-att { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.asst-m-att img { width: 96px; height: 72px; object-fit: cover; object-position: left top; border-radius: 8px; border: 1px solid rgba(255, 255, 255, .5); background: var(--surface); display: block; }
.asst-m-att .asst-doc { max-width: 220px; padding: 4px 8px; border-radius: 8px; background: var(--surface); color: var(--text); font-size: 12px; }
.asst-note { margin: 6px 0 0; font-size: 12px; color: var(--muted); }

/* Голос: підказка під полем, поки помічник слухає */
.asst-hint { padding: 0 12px 10px; font-size: 12px; color: var(--accent-text); background: var(--surface); }
.asst-hint[hidden] { display: none; }
.asst-mic.on { color: #B91C1C; }

/* Файл над вікном */
.asst-dropzone { position: absolute; inset: 8px; display: none; flex-direction: column; align-items: center; justify-content: center; gap: 8px; border: 2px dashed var(--accent); border-radius: 12px; background: rgba(238, 242, 255, .94); color: var(--accent-text); font-weight: 700; font-size: 14px; text-align: center; padding: 16px; pointer-events: none; z-index: 2; }
.asst.asst-drop .asst-dropzone { display: flex; }

@media (max-width: 640px) {
  .asst { right: 16px; bottom: 72px; }
  .asst.asst-big { right: 8px; bottom: 8px; width: calc(100vw - 16px); height: calc(100vh - 16px); height: calc(100dvh - 16px); }
  .asst-h { gap: 4px; padding: 10px 10px; }
  .asst-h .btn-sm { padding: 6px 8px; font-size: 12px; }
  .asst-f { gap: 4px; padding: 8px; }
  .asst-clip, .asst-mic { width: 38px; }
  .asst-send { padding: 0 10px; }
}