/* =========================================================
   RÜYA GLOBAL ROUTE LOADING V1
   Tüm roller / tüm modüller
   ========================================================= */

.ruyaRouteLoadingV1{
  position:fixed;
  inset:0;

  z-index:2147482000;

  display:flex;
  align-items:center;
  justify-content:center;

  padding:24px;

  box-sizing:border-box;

  background:#fff;

  opacity:0;
  visibility:hidden;
  pointer-events:none;

  transition:
    opacity .08s ease,
    visibility 0s linear .08s;
}

.ruyaRouteLoadingV1.is-active{
  opacity:1;
  visibility:visible;
  pointer-events:auto;

  transition:
    opacity .06s ease,
    visibility 0s;
}

.ruyaRouteLoadingInner{
  display:flex;
  align-items:center;
  justify-content:center;

  gap:11px;

  min-height:46px;

  padding:10px 15px;

  border:1px solid #e2e7ee;
  border-radius:14px;

  background:#fff;

  box-shadow:
    0 10px 35px rgba(30,45,70,.07);

  opacity:0;
  transform:translateY(2px);

  transition:
    opacity .12s ease,
    transform .12s ease;
}

.ruyaRouteLoadingV1.show-text .ruyaRouteLoadingInner{
  opacity:1;
  transform:translateY(0);
}

.ruyaRouteLoadingSpinner{
  width:17px;
  height:17px;

  flex:0 0 17px;

  border:2px solid #dbe3ee;
  border-top-color:#17356f;
  border-radius:50%;

  box-sizing:border-box;

  animation:ruyaRouteLoadingSpin .72s linear infinite;
}

.ruyaRouteLoadingText{
  display:flex;
  flex-direction:column;

  gap:1px;

  min-width:0;
}

.ruyaRouteLoadingText b{
  margin:0;

  color:#27364b;

  font-size:12px;
  line-height:1.25;
  font-weight:800;
}

.ruyaRouteLoadingText small{
  color:#8693a5;

  font-size:9.5px;
  line-height:1.3;
  font-weight:500;
}

@keyframes ruyaRouteLoadingSpin{
  to{
    transform:rotate(360deg);
  }
}

@media (max-width:760px){

  .ruyaRouteLoadingV1{
    padding:
      max(18px,env(safe-area-inset-top))
      18px
      max(18px,env(safe-area-inset-bottom));
  }

  .ruyaRouteLoadingInner{
    min-height:44px;

    padding:9px 13px;

    border-radius:13px;
  }

}
