/**
 * Office UI Fabric JS 1.5.0
 * The JavaScript front-end framework for building experiences for Office 365.
 **/
// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.

//
// Office UI Fabric
// --------------------------------------------------
// ProgressIndicator Styles


$ProgressIndicatorMarginBetweenText: 8px;
$ProgressIndicatorButtonsWidth: 218px;
$ProgressIndicatorTextHeight: 18px;

.ms-ProgressIndicator {
  @include ms-baseFont;
  font-weight: $ms-font-weight-regular;
}

.ms-ProgressIndicator-itemName {
  color: $ms-color-neutralPrimary;
  font-size: $ms-font-size-m;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  padding-top: $ProgressIndicatorMarginBetweenText / 2;
  line-height: $ProgressIndicatorTextHeight + 2;
}

.ms-ProgressIndicator-itemDescription {
  color: $ms-color-neutralSecondaryAlt;
  font-size: $ms-font-size-xs;
  line-height: $ProgressIndicatorTextHeight;
}

.ms-ProgressIndicator-itemProgress {
  position: relative;
  width: 180px;
  height: 2px;
  padding: $ProgressIndicatorMarginBetweenText 0;
}

.ms-ProgressIndicator-progressTrack {
  position: absolute;
  width: 100%;
  height: 2px;
  background-color: $ms-color-neutralLight;
  outline: 1px solid transparent;
}

.ms-ProgressIndicator-progressBar {
  background-color: $ms-color-themePrimary;
  height: 2px;
  position: absolute;
  transition: width .3s ease;
  width: 0;

  @media screen and (-ms-high-contrast: active) {
    background-color: $ms-color-white;
  }

  @media screen and (-ms-high-contrast: black-on-white) {
    background-color: $ms-color-black;
  }
}