/**
 * @license
 * Copyright Endlessjs. All Rights Reserved.
 * Licensed under the MIT License. See License.txt in the project root for license information.
 */

@mixin el-progress-bar-theme() {
  el-progress-bar {
    .progress-container {
      border-radius: el-theme(progress-bar-border-radius);
    }

    .progress-value {
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: el-theme(progress-bar-text-font-family);
      transition-duration: el-theme(progress-bar-animation-duration);
      transition-property: width, background-color;
    }
  }

  @each $size in el-get-sizes() {

    el-progress-bar.size-#{$size} {
      .progress-container {
        height: el-theme(progress-bar-#{$size}-height);
      }

      .progress-value {
        font-size: el-theme(progress-bar-#{$size}-text-font-size);
        font-weight: el-theme(progress-bar-#{$size}-text-font-weight);
        line-height: el-theme(progress-bar-#{$size}-text-line-height);
      }
    }
  }

  @each $status in el-get-statuses() {

    el-progress-bar.status-#{$status} {
      .progress-container {
        background-color: el-theme(progress-bar-#{$status}-background-color);
      }

      .progress-value {
        background-color: el-theme(progress-bar-#{$status}-filled-background-color);
        color: el-theme(progress-bar-#{$status}-text-color);
      }
    }
  }
}