/* Shared voice-message controls for the attendant, client and history. */
.msg-bubble .custom-audio-player {
    --audio-accent: var(--accent-text, var(--primary-color));
    --audio-progress: 0%;
    display: flex; flex-direction: column; align-items: stretch;
    width: 300px; max-width: 100%; min-width: 0; gap: 14px; padding: 3px 0;
    color: inherit; user-select: none; white-space: normal;
}
.audio-player-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; font-size: 10px; opacity: .85; }
.stream-message-row.sent .custom-audio-player { --audio-accent: #ffffff; }
.attendance-workspace .stream-message-row.sent .custom-audio-player { --audio-accent: var(--accent-text); }
.audio-player-heading > span:first-child { display: flex; gap: 6px; align-items: center; }
.audio-player-heading i { font-size: 14px; color: var(--audio-accent); }
.audio-player-heading .audio-duration { font-variant-numeric: tabular-nums; }
.audio-controls-row { display: flex; align-items: center; gap: 12px; min-width: 0; }
.custom-audio-player .btn-audio-play { width: 42px; height: 42px; flex: 0 0 42px; border-radius: 50%; border: 1px solid color-mix(in srgb, currentColor 18%, transparent); font-size: 23px; box-shadow: none; }
.custom-audio-player .audio-track-wrap { min-width: 0; flex: 1; gap: 8px; }
.msg-bubble .custom-audio-player .audio-seek-bar { width: 100%; height: 5px; margin: 6px 0 0; border-radius: 8px; background: linear-gradient(to right, var(--audio-accent) var(--audio-progress), color-mix(in srgb, currentColor 22%, transparent) var(--audio-progress)); }
.msg-bubble .custom-audio-player .audio-seek-bar::-webkit-slider-thumb { width: 11px; height: 11px; background: var(--audio-accent); border: 2px solid currentColor; }
.custom-audio-player .audio-seek-bar::-moz-range-thumb { width: 8px; height: 8px; border: 2px solid currentColor; border-radius: 50%; background: var(--audio-accent); }
.custom-audio-player .audio-time-info { font-size: 9px; font-weight: 400; gap: 8px; opacity: .8; }
.custom-audio-player .audio-speed { width: 60px; height: 30px; padding: 0 4px; border: 1px solid color-mix(in srgb, currentColor 20%, transparent); border-radius: 8px; font-family: inherit; font-size: 11px; font-weight: 600; color: inherit; background: transparent; cursor: pointer; flex-shrink: 0; }
.audio-speed option { color: #202c3e; background: #fff; }
.audio-player-footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-top: 11px; border-top: 1px solid color-mix(in srgb, currentColor 12%, transparent); }
.audio-player-footer .audio-transcribe { display: inline-flex; align-items: center; gap: 5px; min-height: 26px; padding: 0; border: 0; background: transparent; color: inherit; font-family: inherit; font-size: 10px; font-weight: 600; cursor: pointer; text-align: left; }
.audio-transcribe i { color: var(--audio-accent); font-size: 15px; }
.audio-transcribe:hover:not(:disabled) { text-decoration: underline; text-underline-offset: 3px; }
.audio-transcribe:disabled { opacity: .5; cursor: wait; }
.audio-speed-hint { font-size: 8px; opacity: .65; text-align: right; }
.custom-audio-player .audio-status { font-size: 10px; line-height: 1.6; opacity: .85; user-select: text; }
.audio-transcript { border: 1px solid color-mix(in srgb, currentColor 14%, transparent); border-radius: 10px; padding: 10px 12px; background: color-mix(in srgb, currentColor 3%, transparent); user-select: text; }
.audio-transcript-heading { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: 9px; opacity: .8; margin-bottom: 6px; }
.audio-transcript-heading .audio-copy { width: 26px; height: 26px; border-radius: 6px; background: transparent; border: 0; color: inherit; cursor: pointer; }
.audio-transcript-text { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 12px; line-height: 1.75; margin: 0; }
.custom-audio-player [hidden] { display: none !important; }
.custom-audio-player :focus-visible { outline: 2px solid var(--audio-accent); outline-offset: 3px; }
@media (max-width: 760px) {
    .msg-bubble .custom-audio-player { width: 270px; gap: 12px; }
    .audio-controls-row { gap: 8px; }
    .custom-audio-player .btn-audio-play { width: 36px; height: 36px; flex-basis: 36px; font-size: 20px; }
    .custom-audio-player .audio-speed { width: 54px; }
    .audio-speed-hint { display: none; }
    .custom-audio-player .audio-time-info > span:last-child { display: none; }
}

/* Composer send button while a voice message is recorded: the same button sends the audio. */
body #chat-message-submit.is-audio-send { flex: 0 0 auto; width: auto; min-width: 42px; padding: 0 15px; gap: 7px; border-radius: 999px; font-size: 15px; opacity: 1; cursor: pointer; box-shadow: 0 0 0 3px color-mix(in srgb, #ef4444 26%, transparent); }
body #chat-message-submit.is-audio-send .send-audio-label { font-size: 13px; font-weight: 700; white-space: nowrap; }
body #chat-message-submit.is-audio-send:focus-visible { outline: 2px solid var(--primary-color); outline-offset: 3px; }
@media (max-width: 520px) {
    body #chat-message-submit.is-audio-send { width: 42px; padding: 0; }
    body #chat-message-submit.is-audio-send .send-audio-label { display: none; }
}
