@charset "utf-8";

.ods-m-tts-player { display: flex; width: 100%; flex-direction: column; align-items: flex-end; max-width: 940px; border-radius: 12px; background: var(--color-neutral-20); }

.ods-m-tts-player__player-bar { display: flex; align-items: center; gap: var(--space-padding-M); align-self: stretch; background: var(--color-neutral-white); padding: var(--space-padding-M) var(--space-padding-L); }

.ods-m-tts-player__controls { display: flex; align-items: center; gap: var(--space-padding-M); }

.ods-m-tts-player__speech { position: relative; border: 0px; padding: 0px; cursor: pointer; background: transparent; width: 16px; height: 16px; }

.ods-m-tts-player__speech[data-muted="true"]::before { content: ""; background: rgb(113, 112, 112); width: 100%; height: 1px; transform: rotate(130deg) translate(50%); display: block; left: 30%; top: 8%; position: absolute; }

.ods-m-tts-player__speech-icon { color: var(--color-neutral-80); }

.ods-m-tts-player__volume { display: flex; width: 87px; padding: 10px; flex-direction: column; align-items: flex-start; gap: 10px; box-sizing: border-box; }

.ods-m-tts-player__volume-time { display: flex; align-items: center; gap: 9px; }

.ods-m-tts-player__volume-controls { display: flex; align-items: center; }

.ods-m-tts-player__volume-belt { appearance: none; height: 4px; border-radius: 6px; cursor: pointer; accent-color: var(--color-czatai-bg); background: linear-gradient(to right,
            var(--color-czatai-bg) 0%,
            var(--color-czatai-surface) 0%); }

.ods-m-tts-player__volume-belt::-webkit-slider-thumb { background: var(--color-czatai-bg); appearance: none; width: 14px; height: 14px; border-radius: 50%; display: block; }

.ods-m-tts-player__volume-belt { width: 67px; }

.ods-m-tts-player__current-time { width: 72px; white-space: nowrap; }

.ods-m-tts-player__time { display: inline-block; width: 30px; color: var(--color-neutral-80); }

.ods-m-tts-player__time-separator { color: rgb(0, 0, 0); }

.ods-m-tts-player__length { display: inline-block; width: 30px; color: var(--color-neutral-70); }

.ods-m-tts-player__time, .ods-m-tts-player__time-separator, .ods-m-tts-player__length { font-family: var(--font-family2); font-size: var(--font-paragraph-text4mobile-size); font-style: normal; font-weight: var(--font-weight-normal); line-height: var(--font-paragraph-text4mobile-lineHeight); }

.ods-m-tts-player__ai-info { position: relative; bottom: 20px; right: 15px; }

.ods-m-tts-player__close { color: var(--color-neutral-90); border: 0px; padding: 0px; cursor: pointer; background: transparent; width: 24px; height: 24px; }

.ods-m-tts-player[data-player-state="PLAY"] .ods-a-tts-player-controls__icon:first-child { display: none; }

.ods-m-tts-player[data-player-state="INITIAL"] .ods-a-tts-player-controls__icon:last-child, .ods-m-tts-player[data-player-state="PAUSE"] .ods-a-tts-player-controls__icon:last-child { display: none; }

.ods-body-mobile .ods-o-inline-tts-player--sticky .ods-m-tts-player { height: 60px; }

.ods-body-mobile .ods-m-tts-player { padding: 0px; width: 100%; }

.ods-body-mobile .ods-m-tts-player__player-bar { height: 46px; padding: var(--space-padding-M) var(--space-padding-L); gap: var(--space-padding-S); }

.ods-body-mobile .ods-m-tts-player__volume-time { display: none; }

.ods-body-mobile .ods-m-tts-player__controls { gap: var(--space-padding-S); }

.ods-body-mobile.sponsoring-sticky .ods-o-inline-tts-player-wrapper .ods-o-inline-tts-player--sticky, .ods-body-mobile.sponsoring--sticky .ods-o-inline-tts-player-wrapper .ods-o-inline-tts-player--sticky { top: calc(var(--sponsoring-height-mobile) + var(--space-touchTargets-L)); }

.ods-body-mobile.sponsoring-hidden .ods-o-inline-tts-player-wrapper .ods-o-inline-tts-player--sticky { top: var(--space-touchTargets-L); }
