/* Микрофон занимает слот кнопки отправки и должен выглядеть точно как она.
   Размеры, фон, форму и hover НЕ задаём: в chat_ui_enbek/crtr стили приходят
   из `.chat-input button`, в chat_ui.html — из класса `.send-btn`, который
   модуль копирует на кнопку. Любое правило здесь ломало бы это наследование
   (первая версия рисовала прозрачный кружок с рамкой поверх фирменной кнопки). */
.aidana-stt-mic {
    /* Иначе на touch удержание кнопки открывает контекстное меню и
       выделение текста вместо записи. */
    touch-action: none;
    -webkit-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
}

/* Атрибут `hidden` реализован в UA-стилях как `[hidden] { display: none }`,
   а любое авторское правило его перебивает. `.chat-input button` и `.send-btn`
   объявляют `display: flex`, поэтому без этих селекторов скрытая кнопка
   остаётся на экране и микрофон соседствует со стрелкой отправки.
   Специфичность 0-2-0 и 1-1-0 гарантированно выше исходных правил. */
.aidana-stt-mic[hidden],
#sendBtn[hidden] {
    display: none;
}

/* Запасной размер иконки для интерфейсов без собственного правила `svg`. */
.aidana-stt-mic svg {
    width: 20px;
    height: 20px;
    pointer-events: none;  /* клик всегда адресуется кнопке, а не path */
}

/* Специфичность 0-2-0 — выше, чем у `.chat-input button` (0-1-1) и
   `.send-btn` (0-1-0), поэтому состояние записи перебивает фирменный фон
   без !important. */
.aidana-stt-mic.is-recording {
    background: #dc2626;
    animation: aidana-stt-pulse 1.4s ease-in-out infinite;
}

/* Нативный input нужен кликабельным программно, но не в потоке и не в табе. */
.aidana-stt-native {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

.aidana-stt-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    font-size: 13px;
    color: #b91c1c;
    background: rgba(220, 38, 38, .07);
    border-top: 1px solid rgba(220, 38, 38, .18);
}

.aidana-stt-bar[hidden] {
    display: none;
}

.aidana-stt-dot {
    flex: 0 0 auto;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #dc2626;
    animation: aidana-stt-pulse 1.4s ease-in-out infinite;
}

.aidana-stt-label {
    flex: 1 1 auto;
    min-width: 0;
}

.aidana-stt-timer {
    flex: 0 0 auto;
    font-variant-numeric: tabular-nums;
}

/* Кнопка отмены — не в composer, поэтому стилизуется целиком здесь.
   Селектор с родителем, чтобы не поймать `.chat-input button` из чата. */
.aidana-stt-bar .aidana-stt-cancel {
    flex: 0 0 auto;
    width: auto;
    height: auto;
    min-height: 32px;
    padding: 4px 10px;
    border: 1px solid rgba(185, 28, 28, .35);
    border-radius: 8px;
    background: transparent;
    color: inherit;
    font: inherit;
    font-size: 13px;
    cursor: pointer;
}

.aidana-stt-bar .aidana-stt-cancel:hover {
    background: rgba(220, 38, 38, .12);
    transform: none;
}

.aidana-stt-cancel:focus-visible,
.aidana-stt-mic:focus-visible {
    outline: 3px solid #fbbf24;
    outline-offset: 2px;
}

@keyframes aidana-stt-pulse {
    0%, 100% { opacity: 1; }
    50%      { opacity: .45; }
}

@media (prefers-reduced-motion: reduce) {
    .aidana-stt-mic.is-recording,
    .aidana-stt-dot { animation: none; }
}

/* Ошибка показывается в той же красной полосе, что и запись, — но индикатор,
   таймер и «Отменить» к ней не относятся. Полоса нужна именно визуальная:
   раньше текст ошибки уходил только в sr-only-регион, и зрячий пользователь
   видел лишь то, что микрофон «ничего не делает». */
.aidana-stt-bar[data-stt-error] .aidana-stt-dot,
.aidana-stt-bar[data-stt-error] .aidana-stt-timer,
.aidana-stt-bar[data-stt-error] .aidana-stt-cancel {
    display: none;
}

.aidana-stt-bar[data-stt-error] .aidana-stt-label {
    white-space: normal;   /* сообщение про настройки приложения — в две строки */
}