/* ===== GOLOSOVYE SOOBSCHENIYA: puzyr-pleer + overlay zapisi v kompozere =====
   Puzyr .voice-msg NAROCHNO neset klass .message-content-mobile — nasleduet fon/temu/ten
   puzyrej (own/other, dark, chat-theme) bez dublirovaniya pravil. */

/* --- Pleer v lente --- */
.voice-msg{
  display:flex; align-items:center; gap:10px;
  min-width:200px; max-width:280px;
  padding:8px 12px;
  white-space:normal;               /* pre-wrap puzyrya tut ne nuzhen */
}
.voice-play{
  width:38px; height:38px; flex:0 0 38px;
  border:0; border-radius:50%;
  background:var(--brand,#0a7c88); color:#fff;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; padding:0;
  -webkit-tap-highlight-color:transparent;
}
.voice-play:active{ transform:scale(.93); }
.voice-play svg{ width:17px; height:17px; display:block; }
.voice-play .vp-play{ margin-left:2px; }     /* treugolnik opticheski po centru */
.voice-msg .vp-pause{ display:none; }
.voice-msg.playing .vp-pause{ display:block; }
.voice-msg.playing .vp-play{ display:none; }

.voice-body{ flex:1; min-width:0; display:flex; flex-direction:column; gap:6px; }
.voice-track{
  position:relative; height:4px; border-radius:2px;
  background:rgba(0,56,65,.18);
  cursor:pointer;
}
/* uvelichennaya zona tapa dlya seek */
.voice-track::before{ content:''; position:absolute; left:0; right:0; top:-9px; bottom:-9px; }
.voice-progress{
  position:absolute; left:0; top:0; bottom:0; width:0;
  border-radius:2px; background:var(--brand,#0a7c88);
  transition:width .2s linear;
}
.voice-time{ font-size:12px; opacity:.72; font-variant-numeric:tabular-nums; line-height:1; }

body.dark-theme .voice-track{ background:rgba(255,255,255,.22); }
body.dark-theme .voice-play{ background:var(--brand-dark,#0a7c88); }
body.dark-theme .voice-progress{ background:#7fd0da; }

/* --- Overlay zapisi v kompozere (uderzhanie mikrofona) ---
   Pokryvaet stroku vvoda, no NE knopku-mikrofon sprava (palec derzhit eyo, vidna pulsatsiya). */
.input-area-mobile{ position:relative; }
.voice-rec-overlay{
  position:absolute; top:0; bottom:0; left:0; right:54px;
  z-index:6; display:none; align-items:center; gap:10px;
  padding:0 6px 0 14px;
  background:var(--panel,#fff);
}
.input-area-mobile.voice-recording .voice-rec-overlay{ display:flex; }
body.dark-theme .voice-rec-overlay{ background:var(--panel,#16232a); }
.voice-rec-dot{
  width:12px; height:12px; flex:0 0 12px; border-radius:50%;
  background:#ff4444;
  animation:voiceRecBlink 1s infinite;
}
@keyframes voiceRecBlink{ 0%,100%{opacity:1} 50%{opacity:.25} }
.voice-rec-time{
  font-size:15px; font-weight:600; color:var(--text,#12262b);
  font-variant-numeric:tabular-nums;
}
.voice-rec-hint{
  flex:1; text-align:center; font-size:13px;
  color:var(--text-secondary,#6b7c80);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}