/*
    Этот модуль делает прогресс-бары плавающими от низа карточки.
    Полезно для большей видимости прогресс-бара.
    Может использоваться как отдельный модуль.
*/

:root {
    --floating-progress-roundness: .75rem;
    --floating-progress-height: 10px;
}

.sessionNowPlayingDetails {
    padding-bottom: 10px;
}

.fullInnerCardFooter,
.activeSession .backgroundProgress,
.activeSession .playbackProgress,
.activeSession .transcodingProgress {
    width: 95%;
    bottom: 10px;
    margin: 0 auto;
    height: var(--floating-progress-height);
    border-radius: var(--floating-progress-roundness) !important;
    -webkit-border-radius: var(--floating-progress-roundness) !important;
    -moz-border-radius: var(--floating-progress-roundness) !important;
}

.itemProgressBar {
    height: var(--floating-progress-height);
    box-shadow: inset 0 1px var(--theme-menu-shadow-colour);
    -webkit-box-shadow: inset 0 1px var(--theme-menu-shadow-colour);
    -moz-box-shadow: inset 0 1px var(--theme-menu-shadow-colour);
}

.playbackProgress > div,
.backgroundProgress > div,
.transcodingProgress > div {
    box-shadow: inset 0 1px var(--theme-menu-shadow-colour);
    -webkit-box-shadow: inset 0 1px var(--theme-menu-shadow-colour);
    -moz-box-shadow: inset 0 1px var(--theme-menu-shadow-colour);
    border-radius: var(--floating-progress-roundness);
    -webkit-border-radius: var(--floating-progress-roundness);
    -moz-border-radius: var(--floating-progress-roundness);
}