/* Global form submission loader — vitrin & talep formları */

body.otovsoto-form-loading {
  overflow: hidden;
}

.otovsoto-form-loader {
  position: fixed;
  inset: 0;
  z-index: 1300;
  display: grid;
  place-items: center;
  padding: 24px;
  animation: otovsoto-loader-fade-in 0.22s ease;
}

.otovsoto-form-loader[hidden] {
  display: none !important;
}

.otovsoto-form-loader__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(10, 10, 10, 0.48);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.otovsoto-form-loader__panel {
  position: relative;
  z-index: 1;
  width: min(100%, 380px);
  padding: 32px 28px 28px;
  background: #fff;
  border-radius: 24px;
  text-align: center;
  box-shadow:
    0 24px 64px rgba(10, 10, 10, 0.22),
    0 0 0 1px rgba(255, 255, 255, 0.06) inset;
  animation: otovsoto-loader-panel-in 0.32s cubic-bezier(0.22, 1, 0.36, 1);
}

.otovsoto-form-loader__hourglass {
  width: 56px;
  height: 56px;
  margin: 0 auto 18px;
  color: var(--brand, #00c6ff);
}

.otovsoto-form-loader__hourglass svg {
  width: 100%;
  height: 100%;
  display: block;
}

.otovsoto-form-loader__sand-top {
  transform-origin: center bottom;
  animation: otovsoto-sand-top 2.4s ease-in-out infinite;
}

.otovsoto-form-loader__sand-bottom {
  transform-origin: center top;
  animation: otovsoto-sand-bottom 2.4s ease-in-out infinite;
}

.otovsoto-form-loader__text {
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
  color: #0a0a0a;
  line-height: 1.45;
}

.otovsoto-form-loader__sub {
  margin: 8px 0 0;
  font-size: 0.85rem;
  color: #64748b;
  line-height: 1.5;
}

@keyframes otovsoto-loader-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes otovsoto-loader-panel-in {
  from {
    opacity: 0;
    transform: translateY(14px) scale(0.97);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes otovsoto-sand-top {
  0%, 100% { transform: scaleY(1); opacity: 1; }
  45% { transform: scaleY(0.15); opacity: 0.5; }
  55% { transform: scaleY(0.15); opacity: 0.5; }
}

@keyframes otovsoto-sand-bottom {
  0%, 100% { transform: scaleY(0.2); opacity: 0.4; }
  45% { transform: scaleY(1); opacity: 1; }
  55% { transform: scaleY(1); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .otovsoto-form-loader__sand-top,
  .otovsoto-form-loader__sand-bottom {
    animation: none;
  }

  .otovsoto-form-loader,
  .otovsoto-form-loader__panel {
    animation: none;
  }
}
