/* Loading mask — keep below navbar; never trap taps when hidden */
.lmask,
#loading-mask {
  position: fixed !important;
  top: var(--cm-map-header-h, 68px) !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: auto !important;
  height: auto !important;
  background-color: rgba(0, 0, 0, 0.45);
  z-index: 900 !important;
  opacity: 0.45;
}

.lmask::before,
#loading-mask::before {
  content: '';
  border: 5px solid rgba(102, 126, 234, 0.9);
  border-right-color: transparent;
  border-left-color: transparent;
  border-radius: 50px;
  box-shadow: 0 0 35px #667eea;
  width: 50px;
  height: 50px;
  margin: -25px 0 0 -25px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-animation: spinPulse 1s infinite linear;
  animation: spinPulse 1s infinite linear;
}

.lmask::after,
#loading-mask::after {
  content: '';
  border: 5px solid rgba(118, 75, 162, 0.9);
  border-left-color: transparent;
  border-right-color: transparent;
  border-radius: 50px;
  box-shadow: 0 0 15px #667eea;
  width: 30px;
  height: 30px;
  margin: -15px 0 0 -15px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-animation: spinoffPulse 1s infinite linear;
  animation: spinoffPulse 1s infinite linear;
}

#loading-mask[aria-hidden="true"],
#loading-mask.is-hidden,
.lmask.is-hidden,
.lmask[aria-hidden="true"] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  opacity: 0 !important;
  z-index: -1 !important;
}

@-webkit-keyframes spinPulse {
  0% { -webkit-transform: rotate(160deg); opacity: 0; box-shadow: 0 0 1px #667eea; }
  50% { -webkit-transform: rotate(145deg); opacity: 1; }
  100% { -webkit-transform: rotate(-320deg); opacity: 0; }
}
@keyframes spinPulse {
  0% { transform: rotate(160deg); opacity: 0; box-shadow: 0 0 1px #667eea; }
  50% { transform: rotate(145deg); opacity: 1; }
  100% { transform: rotate(-320deg); opacity: 0; }
}
@-webkit-keyframes spinoffPulse {
  0% { -webkit-transform: rotate(0deg); opacity: 0.5; }
  50% { -webkit-transform: rotate(144deg); opacity: 1; }
  100% { -webkit-transform: rotate(360deg); opacity: 0.2; }
}
@keyframes spinoffPulse {
  0% { transform: rotate(0deg); opacity: 0.5; }
  50% { transform: rotate(144deg); opacity: 1; }
  100% { transform: rotate(360deg); opacity: 0.2; }
}

.loading-indicator {
  position: absolute;
  width: 220px;
  height: 19px;
  top: 50%;
  left: 50%;
  margin: -10px 0 0 -110px;
  z-index: 901;
}
.loading-bar {
  width: 100%;
}