/* Чат на сайте: фото, видео и смайлики (11.11.2026). Разметка — frontend/widgets/views/support-chat.php */
.support-chat__form{align-items:center;gap:4px}
.support-chat__form .support-chat__tool{display:grid;place-items:center;flex:0 0 36px;width:36px;height:36px;padding:0;border:0;border-radius:50%;background:transparent;color:#2d4779;font-size:20px;line-height:1;cursor:pointer;transition:background-color .12s,transform .08s;-webkit-tap-highlight-color:transparent}
.support-chat__form .support-chat__tool:hover{background:#eef1f8}
.support-chat__form .support-chat__tool:active{transform:scale(.9)}
.support-chat__form .support-chat__tool:disabled{opacity:.4;cursor:default}
.support-chat__form .support-chat__tool svg{width:21px;height:21px}
.support-chat__form input[name=message]{margin-left:2px}
.support-chat__emoji{display:grid;grid-template-columns:repeat(8,1fr);gap:2px;max-height:184px;padding:8px;overflow:auto;border-top:1px solid #eee;background:#fff;overscroll-behavior:contain}
.support-chat__emoji[hidden]{display:none}
.support-chat__emoji button{height:38px;padding:0;border:0;border-radius:9px;background:transparent;font-size:23px;line-height:1;cursor:pointer}
.support-chat__emoji button:hover{background:#f2f4f8}
.support-chat__emoji button:active{transform:scale(.88)}
.support-chat__message.has-media{padding:4px}
.support-chat__message.has-media .support-chat__who{display:block;padding:4px 7px 3px}
.support-chat__media{display:block;max-width:260px;max-height:300px;width:auto;height:auto;border-radius:12px;background:rgba(0,0,0,.06)}
video.support-chat__media{width:260px;background:#000}
.support-chat__caption{padding:6px 8px 3px}
.support-chat__media-gone{display:block;padding:8px;opacity:.7}
.support-chat__message{position:relative}
.support-chat__message.is-uploading .support-chat__media{opacity:.7}
.support-chat__progress{position:absolute;left:12px;right:12px;bottom:12px;height:5px;overflow:hidden;border-radius:3px;background:rgba(255,255,255,.6)}
.support-chat__progress i{display:block;width:0;height:100%;background:#2d4779;transition:width .2s}
/* Голосовые (11.11.2026): кнопка 🎤, полоса записи, плеер в пузыре */
.support-chat__form{position:relative;min-width:0}
.support-chat__form input[name=message]{width:0}
.support-chat__form .support-chat__tool[hidden]{display:none}
.support-chat__rec{position:absolute;inset:0;z-index:1;display:flex;align-items:center;gap:8px;padding:12px;background:#fff}
.support-chat__rec[hidden]{display:none}
.support-chat__form .support-chat__rec-cancel{flex:0 0 36px;width:36px;height:36px;padding:0;border-radius:50%;background:#f2f4f8;color:#5d6b86;font-size:16px}
.support-chat__rec-dot{flex:0 0 10px;width:10px;height:10px;border-radius:50%;background:#d93025;animation:support-chat-rec 1s ease-in-out infinite}
.support-chat__rec-time{font-size:15px;font-variant-numeric:tabular-nums;color:#1c2333}
.support-chat__rec-hint{flex:1;min-width:0;overflow:hidden;color:#8a93a6;font-size:13px;white-space:nowrap;text-overflow:ellipsis}
.support-chat__form .support-chat__rec-send{flex:0 0 42px;height:42px}
@keyframes support-chat-rec{50%{opacity:.25}}
.support-chat__message.has-voice{min-width:220px;padding:8px 12px 8px 8px}
.support-chat__message.has-voice .support-chat__who{display:block;margin:0 0 4px 4px}
.support-chat__voice{display:flex;align-items:center;gap:10px;white-space:nowrap}
.support-chat__voice-play{position:relative;flex:0 0 38px;width:38px;height:38px;padding:0;border:0;border-radius:50%;background:#2d4779;color:#fff;cursor:pointer}
.support-chat__voice-play::before{content:"";position:absolute;top:12px;left:15px;border-style:solid;border-width:7px 0 7px 11px;border-color:transparent transparent transparent currentColor}
.support-chat__voice.is-playing .support-chat__voice-play::before{top:12px;left:13px;width:12px;height:14px;box-sizing:border-box;border-width:0 4px;border-color:currentColor}
.support-chat__message--visitor .support-chat__voice-play{background:#fff;color:#2d4779}
.support-chat__voice-track{position:relative;flex:1;height:6px;border-radius:3px;background:rgba(45,71,121,.18);cursor:pointer}
.support-chat__voice-track::after{content:"";position:absolute;inset:-10px 0}
.support-chat__message--visitor .support-chat__voice-track{background:rgba(255,255,255,.35)}
.support-chat__voice-track i{display:block;width:0;height:100%;border-radius:3px;background:currentColor;opacity:.85}
.support-chat__message--manager .support-chat__voice-track i{background:#2d4779}
.support-chat__voice-time{flex:0 0 auto;min-width:34px;font-size:12px;font-variant-numeric:tabular-nums;opacity:.8;text-align:right}
.support-chat__message.has-voice.is-uploading .support-chat__progress{left:56px;right:12px;bottom:4px;height:3px}
/* Поле ввода заметнее (11.11.2026): на белом фоне тонкая серая рамка терялась, особенно на телефоне */
.support-chat__form{border-top:1px solid #e1e6f0;box-shadow:0 -6px 16px rgba(29,45,82,.07)}
.support-chat__form input[name=message]{height:42px;padding:0 14px;border:1.5px solid #9fb0d3;border-radius:21px;background:#f3f6fc;color:#1c2333;font-size:15px;transition:border-color .15s,box-shadow .15s,background-color .15s}
.support-chat__form input[name=message]::placeholder{color:#5c6884;opacity:1}
.support-chat__form input[name=message]:focus{outline:0;border-color:#2d4779;background:#fff;box-shadow:0 0 0 3px rgba(45,71,121,.16)}
.support-chat__form input[name=message]:disabled{border-color:#d7dce6;background:#f1f2f5}
@media (max-width:650px){.support-chat__form input[name=message]{font-size:16px}}
.support-chat__form button[type=submit]{flex:0 0 42px;height:42px;border-radius:50%}
/* Запись удержанием (11.11.2026): пока палец на 🎤 — вместо кнопок подсказка «‹ влево — отмена» */
.support-chat__form .support-chat__tool--voice{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.support-chat__rec.is-holding .support-chat__rec-cancel,.support-chat__rec.is-holding .support-chat__rec-send{visibility:hidden}
.support-chat__rec.is-holding .support-chat__rec-hint{color:#2d4779;font-weight:700;text-align:right;transition:transform .05s}