/**
 * Private ticket audio controls shared by the customer and agent interfaces.
 * @author Hassan HashemiFard
 * @link https://hasanhashemi.ir
 * @link https://telxa.ir
 * @copyright 2026 Telxa Technologies. All rights reserved.
 */
.telxa-wrapper .telxa-ticket-thread { display: flex; flex-direction: column; gap: 14px; padding-block: 16px; }
.telxa-wrapper .telxa-ticket-thread .telxa-auth-ticket-message { box-sizing: border-box; width: fit-content; max-width: min(78%, 650px); margin: 0; border: 1px solid var(--telxa-line, #d8e1ec); border-radius: 16px; padding: 15px 18px; overflow-wrap: anywhere; }
.telxa-wrapper .telxa-ticket-thread .telxa-ticket-message--customer { margin-left: 0; margin-right: auto; background: var(--telxa-surface-soft, #f4f7fb); color: var(--telxa-text, #172b4d); }
.telxa-wrapper .telxa-ticket-thread .telxa-auth-ticket-message--agent { margin-left: auto; margin-right: 0; background: var(--telxa-primary-subtle, #edf4ff); color: var(--telxa-text, #172b4d); }
.telxa-wrapper .telxa-ticket-thread header { display: flex; flex-wrap: wrap; gap: 8px 16px; justify-content: space-between; font-size: 12px; }
.telxa-wrapper .telxa-ticket-thread time, .telxa-wrapper .telxa-ticket-message-status { color: var(--telxa-muted, #516278); font-size: 11px; }
.telxa-wrapper .telxa-ticket-message-status { margin-top: 8px; }
.telxa-wrapper .telxa-chat-composer { display: grid; gap: 10px; width: 100%; min-width: 0; padding: 14px; border: 1px solid var(--telxa-line, #d8e1ec); border-radius: 14px; background: var(--telxa-surface, #fff); }
.telxa-wrapper .telxa-chat-composer textarea[data-telxa-autogrow] { min-height: 54px; max-height: 200px; resize: vertical; }
.telxa-wrapper .telxa-composer-tools, .telxa-wrapper .telxa-voice-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.telxa-wrapper .telxa-composer-attachment { position: relative; }
.telxa-wrapper .telxa-composer-attachment input { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }
.telxa-wrapper .telxa-composer-clip, .telxa-wrapper .telxa-voice button { display: inline-flex; align-items: center; justify-content: center; gap: 5px; min-height: 40px; padding: 7px 10px; border: 1px solid var(--telxa-line, #d8e1ec); border-radius: 8px; background: var(--telxa-surface, #fff); color: var(--telxa-text, #172b4d); font: inherit; font-size: 12px; cursor: pointer; }
.telxa-wrapper .telxa-composer-attachment input:focus-visible + span, .telxa-wrapper .telxa-composer-attachment:focus-within label { outline: 3px solid var(--telxa-focus, #478be8); outline-offset: 2px; }
.telxa-wrapper .telxa-voice { min-width: 0; flex: 1 1 320px; }
.telxa-wrapper .telxa-voice button:disabled { opacity: .45; cursor: not-allowed; }
.telxa-wrapper .telxa-voice [data-voice-status] { margin: 4px 0 0; font-size: 12px; color: var(--telxa-muted, #516278); }
.telxa-wrapper .telxa-voice [data-voice-status]:empty { display: none; }
.telxa-wrapper .telxa-recording-indicator { display: none; width: 10px; height: 10px; border-radius: 50%; background: #d93c4b; }
.telxa-wrapper .telxa-voice.is-recording .telxa-recording-indicator { display: inline-block; animation: telxa-recording 1.2s ease-out infinite; }
.telxa-wrapper .telxa-audio-player { --voice-progress: 0%; display: flex; direction: ltr; align-items: center; gap: 9px; width: min(330px, 100%); min-width: 0; margin-block: 10px; padding: 9px; border: 1px solid var(--telxa-line, #d8e1ec); border-radius: 12px; background: var(--telxa-surface, #fff); }
.telxa-wrapper .telxa-audio-player[hidden], .telxa-wrapper .telxa-audio-player audio { display: none; }
.telxa-wrapper .telxa-audio-player .telxa-audio-play { flex: 0 0 36px; width: 36px; height: 36px; min-height: 0; padding: 0; border: 0; border-radius: 50%; background: var(--telxa-primary, #1e60e6); color: #fff; cursor: pointer; }
.telxa-wrapper .telxa-audio-track { position: relative; flex: 1 1 auto; min-width: 40px; height: 35px; }
.telxa-wrapper .telxa-audio-wave { display: flex; align-items: center; gap: 3px; width: 100%; height: 100%; color: var(--telxa-primary, #1e60e6); overflow: hidden; }
.telxa-wrapper .telxa-audio-wave i { flex: 1 0 2px; max-width: 3px; border-radius: 3px; background: currentColor; opacity: .35; }
.telxa-wrapper .telxa-audio-wave::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to right, transparent var(--voice-progress), var(--telxa-surface, #fff) var(--voice-progress)); opacity: .4; pointer-events: none; }
.telxa-wrapper .telxa-audio-track input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.telxa-wrapper .telxa-audio-track:focus-within { outline: 2px solid var(--telxa-focus, #478be8); outline-offset: 2px; }
.telxa-wrapper .telxa-audio-time { white-space: nowrap; color: var(--telxa-muted, #516278); font-size: 12px; }
.telxa-wrapper .telxa-audio-options { position: relative; }
.telxa-wrapper .telxa-audio-options summary { cursor: pointer; list-style: none; padding: 4px; font-size: 22px; line-height: 1; }
.telxa-wrapper .telxa-audio-options summary::-webkit-details-marker { display: none; }
.telxa-wrapper .telxa-audio-options > div { position: absolute; z-index: 5; right: 0; top: 100%; display: grid; min-width: 120px; padding: 6px; border: 1px solid var(--telxa-line, #d8e1ec); border-radius: 10px; background: var(--telxa-surface, #fff); box-shadow: var(--telxa-shadow-md, 0 4px 12px rgba(0,0,0,.06)); }
.telxa-wrapper .telxa-audio-options :is(a, button) { padding: 6px; border: 0; background: transparent; color: var(--telxa-text, #172b4d); font: inherit; text-align: right; text-decoration: none; cursor: pointer; }
@keyframes telxa-recording { 0% { box-shadow: 0 0 0 0 rgba(217,60,75,.45); } 100% { box-shadow: 0 0 0 9px rgba(217,60,75,0); } }
@media (max-width: 700px) { .telxa-wrapper .telxa-ticket-thread .telxa-auth-ticket-message { max-width: 94%; } .telxa-wrapper .telxa-chat-composer { padding: 10px; } }
@media (prefers-reduced-motion: reduce) { .telxa-wrapper .telxa-voice.is-recording .telxa-recording-indicator { animation: none; } }