/* PROGRESS BAR */
.progress_bar_container {}
.progress_content { width: 100%; margin-bottom: 20px;}
.progress_bar_outline {
     background: #E6EAFC;
     height: 26px;
     border-radius: 12px;
     overflow: hidden;
     position: relative;
     display: flex;
     align-items: center;
}
.progress_bar_inner_bar {
     background: #5273F1;
     /* width: 67%; */
     height: 26px;
     border-radius: 12px;
     display: inline-block;
     transition: 300ms all linear;
}
.progress_bar_percentage {
     position: absolute;
     /* left: 68%; */
     font-weight: 500;
     font-size: 14px;
     letter-spacing: 0.15px;
     transition: 300ms all linear;
     font-family: Arial;
}
.progress_bar_percentage[dark] { color: #636B81; margin-left: 6px; }
.progress_bar_percentage[light] { color: #fff; margin-right: 6px;}
.progress_bar_percentage[beginning] { margin-left: 12px;}
.progress_bar_percentage[end] { margin-right: 9px;}

.progress_bar_details_container {
     display: flex;
     justify-content: space-between;
     padding: 0 8px;
}
.progress_bar_status, .progress_bar_data_transfered {
     color: #636B81;
     /* font-weight: 500; */
     /* font-size: 13px; */

     font-weight: 600;
     font-size: 13px;
     /* font-size: 14px; */
     -webkit-font-smoothing: antialiased;
}
progress-bar[indeterminate] .progress_bar_percentage { display: none; }
progress-bar[indeterminate] .progress_bar_data_transfered { display: none; }
progress-bar[indeterminate] .progress_bar_inner_bar { width: 100% !important; position: relative; }
progress-bar[indeterminate] .progress_bar_inner_bar::after {
     content: '';
     position: absolute;
     top: 0px; left: 0px; right: 0px; bottom: 0px;
     background-image: linear-gradient(
          -45deg,
          rgba(255, 255, 255, .2) 25%,
          transparent 25%,
          transparent 50%,
          rgba(255, 255, 255, .2) 50%,
          rgba(255, 255, 255, .2) 75%,
          transparent 75%,
          transparent
     );
     z-index: 1;
     background-size: 50px 50px;
     animation: move 2s linear infinite;
}

@keyframes move {
     0% { background-position: 0 0; }
     100% { background-position: 50px 50px; }
}