/*
 * Acabamento visual compartilhado do drawer de chat.
 *
 * A largura e a geometria responsiva do drawer são canônicas em
 * flow-chat-overlay.css. Este arquivo não deve redefinir width nem transformar
 * o composer compacto em layout de página cheia, para que Board, Conversas,
 * Flow Connect e demais telas usem exatamente o mesmo drawer.
 */

#flow-chat-overlay .flow-chat-overlay-body {
    overflow: hidden;
}

#flow-chat-overlay .chat-message-composer.message-input {
    padding: 8px 12px 10px;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    background: rgba(248, 249, 250, 0.98);
}

#flow-chat-overlay .chat-footer-compact {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

#flow-chat-overlay .chat-attachment-strip {
    width: 100%;
}

#flow-chat-overlay .chat-attachment-strip .filepond--root {
    margin-bottom: 0;
    font-size: 13px;
}

#flow-chat-overlay .chat-attachment-strip .filepond--panel-root {
    border: 1px dashed #cfd8e3;
    border-radius: 10px;
    background: #ffffff;
}

#flow-chat-overlay .chat-attachment-strip .filepond--drop-label {
    min-height: 46px;
    color: #495057;
}

#flow-chat-overlay .chat-attachment-strip .filepond--drop-label label {
    padding: 0 12px;
    font-size: 13px;
    font-weight: 500;
}

#flow-chat-overlay .chat-attachment-strip .filepond--drop-label label::before {
    content: "\f0c6";
    display: inline-block;
    margin-right: 9px;
    color: #495057;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
}

#flow-chat-overlay .chat-attachment-strip .filepond--credits {
    display: none;
}

#flow-chat-overlay .chat-audio-send-preview {
    width: 100%;
}

#flow-chat-overlay .chat-message-audio-status {
    min-height: 16px;
    padding-left: 2px;
    font-size: 11px;
    line-height: 1.25;
}

#flow-chat-overlay .flow-connect-canonical-audio audio {
    display: block;
    width: 280px;
    max-width: 100%;
    height: 44px;
}

#flow-chat-overlay .message-audio-duration {
    display: block;
    margin-top: 2px;
    color: #64748b;
    font-size: 10px;
    text-align: right;
}