@import "variables";
@import "mixins";

$preloader-dots: $col-prm !default;
$preloader-bg: $col-bg !default;

.loader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 99999;
  background: $preloader-bg;
  display: flex;
  flex-direction: row;
  align-content: center;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  font-size: 1.8rem;

  .spinner {
    > * {
      background-color: $preloader-dots;
    }
  }

  &.loaded {
    visibility: hidden;
    opacity: 0;
    transition: visibility 0s 0.25s, opacity 0.25s linear;
  }

  &.hidden {
    display: none;
  }
}

.woocommerce .loader::before {
  content: none !important;
}
