/* loading 樣式：配合 loadings.js 內嵌樣板（startSectionLoading／startBtnLoading）。
   純 CSS，不依賴 map 樣式包的變數；登入頁與地圖頁各自以 <link> 引用本檔。 */

.o-loading {
  position: absolute;
  pointer-events: none;
  z-index: 1000;
  font-weight: bold;
}
.o-loading--center {
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.o-loading--left {
  left: 0;
  top: 50%;
  transform: translate(0, -50%);
}
.o-loading--right {
  right: 0;
  top: 50%;
  transform: translate(0, -50%);
}
.o-loading__parent {
  position: relative;
  overflow: hidden !important;
  /* 讓內部 .o-loading（z-index 1000）與遮罩（999）自成一個層級，只在這個區塊內比較，
     不會浮到同層其他面板（例如手機滿版的子面板）上面 */
  isolation: isolate;
}
.o-loading__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.75);
  z-index: 999;
}
.o-loading__spinner {
  display: flex;
  align-items: center;
  /* small 狀態的內圈縮小後，水平方向沒有置中規則會貼齊容器最左邊 */
  justify-content: center;
  border-radius: 50px;
  background-color: rgba(234, 242, 242, 0.8);
  padding: 0.5rem;
  box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1), 0 0 1px rgba(0, 0, 0, 0.2);
  height: 3rem;
}
.o-loading__spinner .spinner-border {
  flex-shrink: 0;
}
.o-loading__text {
  flex-shrink: 0;
}

/* loading spinner 尺寸（loadings.js 樣板的 Mustache 條件式尺寸） */
.o-loading__spinner--sm {
  width: 1.5rem;
  height: 1.5rem;
}
.o-loading__spinner--md {
  width: 3rem;
}
.o-loading__spinner--auto {
  height: auto;
}

/* 按鈕內嵌 spinner（loadings.js 的 spinnerPrimaryHTML／spinnerLightHTML） */
.o-inline-spinner {
  position: relative;
  top: -2px;
}