@use 'ngx-tethys/styles/basic.scss';
@forward './audio-player.scss';
@forward './video-player.scss';
@forward './progress.scss';
@forward './controls.scss';

.thy-media-player {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    .media-content {
        width: 100%;
        height: 100%;
    }
}
.thy-video-player,
.thy-audio-player {
    overflow: hidden;
    audio::-moz-media-controls-panel {
        background-color: basic.$gray-100;
    }
    audio::-webkit-media-controls-panel {
        background-color: basic.$gray-100;
    }

    audio::-webkit-media-controls-play-button:hover {
        background-color: rgba(basic.$gray-300, 0.7);
        border-radius: 50%;
    }
}