/*---------------------------------------------------------------------------------------------
* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
* See LICENSE.md in the project root for license terms and full copyright notice.
*--------------------------------------------------------------------------------------------*/
@import "~@bentley/ui-core/lib/ui-core/style/breakpoints";
@import "~@bentley/ui-core/lib/ui-core/style/typography";

.uifw-tile-loading-bar {
  $font-size-medium: $uicore-font-size-small;
  $font-size-small: $uicore-font-size-smaller;

  transition: opacity 1s ease-in;
  opacity: 0;
  display: flex;
  flex-direction: column;
  align-items: center;

  > span {
    font-size: $font-size-medium;
    margin-top: 6px;
    position: relative;
  }

  > .core-lb {
    width: 100%;
    height: 100%;
    flex: 1;
  }

  &.nz-footer-mode {
    width: 12em;
  }

  &:not(.nz-footer-mode) {
    min-width: 4em;
  }

  @include for-small-desktop-down {
    &.nz-footer-mode {
      width: 9em;
    }
  }

  @include for-tablet-portrait-down {
    font-size: $font-size-medium;
  }

  @include for-phone-only {
    font-size: $font-size-small;

    &.nz-footer-mode {
      width: 6em;
    }
  }
}

.uifw-tile-loading-bar-visible {
  opacity: 1;
}