/* Геометрия и цвета сняты с финальных правил макета chat.css (17.10.2026).
   Отдельный слой не меняет обработчики отправки, вложений и камеры. */
#chat-section .input-wrapper {
    display: flex; position: relative; transform: none;
    box-sizing: border-box; width: min(calc(100% - var(--composer-desktop-gutter) * 2), var(--composer-max-width));
    max-width: var(--composer-max-width); margin: var(--space-2) auto var(--space-3); min-height: 0; padding: var(--composer-inset);
    align-items: flex-end; gap: var(--composer-inset); border: 0; border-radius: var(--ui-radius);
    background: var(--composer-surface); box-shadow: none; font-size: var(--font-base); line-height: var(--composer-menu-line);
}
#chat-section .input-wrapper:focus-within { border: 0; box-shadow: none; }
#chat-section .message-input-container { display: contents; }
#chat-section .message-input {
    display: block; flex: 1; min-width: 0; box-sizing: border-box; resize: none;
    min-height: var(--composer-control); max-height: min(25svh, var(--composer-text-cap));
    padding: var(--space-2); border: 0; border-radius: 0;
    background: transparent; color: var(--composer-text-ink); font-family: var(--font-sans);
    font-size: var(--font-label); line-height: var(--composer-text-line); outline: none; box-shadow: none;
    overflow-wrap: anywhere;
}
#chat-section .message-input:focus, #chat-section .message-input:focus-visible { background: transparent; box-shadow: none; }
#chat-section .message-input::placeholder { color: var(--composer-placeholder); opacity: 1; }
#chat-section .input-actions-inline { display: flex; flex-shrink: 0; gap: var(--composer-inset); align-self: flex-end; position: static; margin: 0; padding: 0; }
#chat-section :is(.hint-icon, .btn-voice, .btn-send) {
    display: flex; align-items: center; justify-content: center; flex-shrink: 0; box-sizing: border-box;
    width: var(--composer-control); height: var(--composer-control); min-width: var(--composer-control);
    padding: 0; border: 0; border-radius: 50%; box-shadow: none; cursor: pointer; color: var(--composer-icon-ink);
    background: transparent; transform: none; opacity: 1; font-family: var(--font-sans); font-size: var(--font-base); line-height: var(--composer-button-line);
}
#chat-section .hint-icon { margin-left: calc(-1 * var(--composer-inset)); }
#chat-section .hint-icon:hover, #chat-section .hint-icon[aria-expanded="true"], #chat-section .btn-voice:hover { color: var(--primary); transform: none; opacity: 1; }
#chat-section .btn-send, body.dark-theme #chat-section .btn-send { color: var(--composer-send-ink); background: var(--primary); }
#chat-section .btn-voice.listening { color: var(--error); }
#chat-section :is(.composer-attach-icon, .composer-voice-icon, .composer-send-icon) {
    display: block; width: var(--icon-size); height: var(--icon-size); flex-shrink: 0; background: currentColor;
    mask: var(--composer-icon) center / contain no-repeat; -webkit-mask: var(--composer-icon) center / contain no-repeat;
}
.composer-attach-icon { --composer-icon: url('/static/images/icons/attach.svg'); }
.composer-voice-icon { --composer-icon: url('/static/images/icons/microphone.svg'); }
.composer-send-icon { --composer-icon: url('/static/images/icons/send.svg'); }
#chat-section .btn-all-features { position: static; transform: none; margin: var(--space-3) auto 0; height: var(--composer-link-height); min-height: var(--composer-link-height); line-height: var(--composer-menu-line); color: var(--composer-icon-ink); flex-shrink: 0; }
#upload-modal.upload-popover {
    box-sizing: border-box; width: max-content; min-width: 0; max-width: calc(100vw - var(--composer-menu-inset) * 2);
    max-height: calc(100svh - var(--composer-menu-inset) * 2); overflow-y: auto;
    padding: var(--space-2); border: var(--hairline) solid var(--composer-menu-border); border-radius: var(--ui-radius);
    background: var(--composer-menu-surface); box-shadow: var(--composer-menu-shadow);
    backdrop-filter: none; -webkit-backdrop-filter: none; animation: none; color: var(--composer-text-ink);
}
#upload-modal .upload-buttons { display: block; }
#upload-modal .upload-btn {
    display: block; box-sizing: border-box; width: 100%; min-height: var(--control-height);
    padding: var(--space-2) var(--space-3); border: 0; border-radius: var(--ui-radius);
    background: transparent; color: var(--composer-text-ink); font-family: var(--font-sans);
    font-size: var(--font-base); line-height: var(--composer-menu-line); font-weight: 400; text-align: left;
}
#upload-modal .upload-btn:hover, #upload-modal .upload-btn:focus-visible { background: var(--composer-surface); }
#upload-modal .upload-btn:active { transform: none; }
@media (max-width: 768px) {
    #chat-section .input-wrapper { width: calc(100% - var(--space-2) * 2); gap: 0; margin-bottom: var(--space-2); }
    #chat-section .message-input { min-height: var(--composer-phone-control); max-height: min(25svh, var(--composer-phone-cap)); padding: var(--space-2) var(--composer-inset); font-size: var(--font-base); line-height: var(--composer-phone-line); }
    #chat-section :is(.hint-icon, .btn-voice, .btn-send) { width: var(--composer-phone-control); height: var(--composer-phone-control); min-width: var(--composer-phone-control); }
}

/* Состояния диктовки и вложений используют те же поверхности, что и поле. */
#chat-section .btn-voice.listening { background: var(--composer-surface); animation: none; box-shadow: none; }
#chat-section .btn-voice.listening .composer-voice-icon { mask: none; -webkit-mask: none; width: var(--space-3); height: var(--space-3); border-radius: var(--hairline); }
#chat-section .btn-voice:disabled { opacity: var(--composer-disabled-opacity); cursor: not-allowed; }
.composer-status { width: min(calc(100% - var(--space-4) * 2), var(--composer-max-width)); margin: var(--space-2) auto 0; box-sizing: border-box; padding: var(--space-2) var(--space-3); border-radius: var(--ui-radius); background: var(--composer-surface); color: var(--text-secondary); font-size: var(--font-label); overflow-wrap: anywhere; }
.composer-status[hidden] { display: none; }
.composer-status.is-error { color: var(--error); }
#chat-section .attached-files-container { width: min(calc(100% - var(--space-2) * 2), var(--composer-max-width)); flex-wrap: wrap; gap: var(--space-2); }
#chat-section .attached-file-item { flex: 0 1 auto; min-width: 0; gap: var(--space-2); padding: var(--space-2) var(--space-3); background: var(--composer-surface); animation: none; transition: none; font-size: var(--font-label); }
#chat-section .attached-file-item:hover { background: var(--composer-surface); border-color: transparent; }
#chat-section .file-name { max-width: none; }
#chat-section .file-size { font-size: var(--font-caption); }
#chat-section .file-remove-btn { width: var(--control-compact); height: var(--control-compact); min-width: var(--control-compact); min-height: var(--control-compact); border-radius: var(--ui-radius); color: var(--text-secondary); font-size: var(--space-5); }
#chat-section .file-remove-btn:hover { background: var(--bg-hover); color: var(--text); }
/* Заголовок занимает доступную ширину: Контекст всегда у правого края. */
.main-content.chat-active .chat-heading { flex: 1; }
.main-content.chat-active .chat-current-title { flex: 1; min-width: 0; }
.chat-context-btn { margin-left: auto; min-height: var(--control-compact); padding: var(--space-2) var(--space-3); border: 0; border-radius: var(--ui-radius); background: var(--primary); color: var(--on-primary); font-family: var(--font-sans); font-size: var(--font-label); }
.chat-context-btn:hover { background: var(--primary); color: var(--on-primary); }
@media (max-width: 768px) {
    .chat-context-btn { padding-inline: var(--space-2); font-size: var(--font-caption); }
}

/* Контекст: компактное чтение и отдельная форма, как signal-context-dialog макета. */
.app-dialog.signal-context { box-sizing: border-box; width: min(var(--signal-context-width), calc(100vw - var(--space-4) * 2)); max-height: calc(100svh - var(--space-4) * 2); padding: var(--space-4); background: var(--composer-menu-surface); border: var(--hairline) solid var(--composer-menu-border); border-radius: var(--ui-radius); color: var(--text); overflow-y: auto; }
.signal-context-head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); margin-bottom: var(--space-3); }
.signal-context-head .app-dialog-title { margin: 0; font-size: var(--font-lead); font-weight: 500; color: var(--primary); }
.signal-context-close { display: grid; place-items: center; flex-shrink: 0; width: var(--signal-context-control); height: var(--signal-context-control); padding: 0; border: 0; border-radius: var(--ui-radius); background: transparent; color: var(--text-secondary); font: inherit; font-size: var(--space-5); cursor: pointer; }
.signal-context .app-dialog-text { margin: 0 0 var(--space-3); color: var(--text-secondary); font-size: var(--font-label); line-height: var(--composer-menu-line); }
.signal-context-readout { display: grid; gap: var(--space-3); }
.signal-context-readout section { padding: var(--space-3); border-radius: var(--ui-radius); background: var(--composer-surface); }
.signal-context-readout h3 { margin: 0 0 var(--space-2); color: var(--primary); font-size: var(--font-label); font-weight: 500; }
.signal-context-readout p { margin: 0; font-size: var(--font-label); line-height: var(--composer-menu-line); white-space: pre-wrap; overflow-wrap: anywhere; }
.signal-context-readout .is-empty { color: var(--text-secondary); }
.signal-context-edit { min-height: var(--signal-context-control); padding: 0; border: 0; background: transparent; color: var(--primary); font: inherit; font-size: var(--font-caption); cursor: pointer; }
.signal-context-field { margin-top: var(--space-3); gap: var(--space-2); color: var(--text-secondary); font-weight: 400; }
.signal-context-field textarea { min-height: var(--signal-context-field-height); max-height: 40svh; padding: var(--space-3); border: 0; background: var(--composer-surface); color: var(--text); font-size: var(--font-base); line-height: var(--composer-text-line); outline: none; box-shadow: none; }
.signal-context-field textarea::placeholder { color: var(--composer-placeholder); opacity: 1; }
.signal-context-field textarea:focus-visible { outline: none; box-shadow: none; }
.signal-context .app-dialog-actions { margin-top: var(--space-3); gap: var(--space-2); justify-content: flex-end; flex-wrap: nowrap; }
.signal-context .app-dialog-btn { min-height: var(--signal-context-control); padding: var(--space-2) var(--space-3); font-size: var(--font-label); border: 0; background: var(--composer-surface); }
.signal-context .app-dialog-btn.is-primary { background: var(--primary); color: var(--on-primary); }
.signal-context [hidden] { display: none !important; }
