/* Styles for index.html's #main-loader (the pre-Angular-bootstrap splash
   screen) and the GTM noscript fallback iframe - moved out of inline
   <style>/style="..." in index.html so style-src doesn't need
   'unsafe-inline' in the Content-Security-Policy. */

.gtm-noscript-iframe {
  display: none;
  visibility: hidden;
}

/* Full-screen loader container */
#main-loader {
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  width: 100%;
  background: #fff;
  z-index: 999;
}

/* Centered loading content */
.loading-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100vh;
}

/* Logo container box */
.loading-container .loading-box {
  width: 220px;
  margin: 5px;
  text-align: center;
  position: relative;
}

/* Shimmer animation effect */
.loading-container .loading-box::after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  transform: translateX(-100%);
  background-image: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0,
    rgba(255, 255, 255, 0.2) 20%,
    rgba(255, 255, 255, 0.5) 60%,
    rgba(255, 255, 255, 0)
  );
  -webkit-animation: shimmer 2s infinite;
  animation: shimmer 1.5s infinite;
  content: '';
}

/* Shimmer animation keyframes */
@-webkit-keyframes shimmer {
  100% {
    transform: translateX(100%);
  }
}

@keyframes shimmer {
  100% {
    transform: translateX(100%);
  }
}