/* 
 * DO NOT EDIT THIS FILE.
 * The Airbus Web Experience use PostCSS to compile CSS
 * the same way as in the Drupal core except it use the .pcss extension.
 * Therefore, you are supposed to edit the pcss file of the same name.
 */

.awx-load{
  position:relative;
  display:inline-block;
  min-width:var(--awx-sp-v1-5);
  min-height:var(--awx-sp-v1-5);
  vertical-align:middle;
}

.awx-load.awx-load--fullscreen{
    position:fixed;
    z-index:1261;
    top:0;
    right:0;
    bottom:0;
    left:0;
    display:block;
  }

.awx-load.awx-load--fullscreen::before{
      position:absolute;
      z-index:1;
      top:0;
      right:0;
      bottom:0;
      left:0;
      content:"";
      transition:opacity 100ms ease-in;
      opacity:0;
      background-color:var(--awx-color-accent);
    }

.awx-load.awx-load--fullscreen.awx-load--active::before{
      opacity:.5;
    }

.awx-load.awx-load--fullscreen::after{
      filter:none;
      background-size:min(10%, 100px);
    }

.awx-load::after{
  position:absolute;
  z-index:12;
  top:0;
  right:0;
  bottom:0;
  left:0;
  display:grid !important;
  align-content:center;
  justify-content:center;
  place-content:center;
  min-width:var(--awx-sp-v1-5);
  content:"";
  transition:opacity 300ms ease-in;
  animation:roll 1s linear infinite;
  opacity:0;
  filter:brightness(8%) sepia(88%) hue-rotate(180deg) saturate(1100%);
  background-color:transparent;
  background-image:url(/themes/custom/airbus_web_experience_ui/assets/images/awx-icons-views.svg?c#spinner);
  background-repeat:no-repeat;
  background-position:center center;
  background-size:contain;
}

.awx-load--active::after{
  opacity:1;
}

.awx-load--message{
  padding-right:var(--awx-sp-v2);
}

.awx-load--message::after{
    left:auto;
  }
