/*
 * StudyHub.AZ Global Loading Spinner
 * Filename: global-loading.css
 * Author: Ostwind by Dr.FC
 * Описание: Глобальный спиннер загрузки для всего проекта
 */

/* === 🌐 ГЛОБАЛЬНЫЙ СПИННЕР ЗАГРУЗКИ === */
.global-loading-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  backdrop-filter: blur(5px);
  z-index: 999999;
  display: none;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.global-loading-overlay.active {
  display: flex;
  opacity: 1;
}

.global-loading-spinner {
  position: relative;
  width: 80px;
  height: 80px;
}

.global-loading-spinner::before,
.global-loading-spinner::after {
  content: '';
  position: absolute;
  border-radius: 50%;
  animation: globalSpin 2s linear infinite;
}

.global-loading-spinner::before {
  width: 100%;
  height: 100%;
  background: conic-gradient(
    from 0deg,
    transparent,
    #667eea,
    #764ba2,
    #667eea,
    transparent
  );
  animation: globalSpin 2s linear infinite;
}

.global-loading-spinner::after {
  width: 70%;
  height: 70%;
  background: #fff;
  top: 15%;
  left: 15%;
  animation: globalSpin 2s linear infinite reverse;
}

@keyframes globalSpin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* === 🎨 АНИМАЦИЯ САМОЛЕТА === */
.global-loading-airplane {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 40px;
  height: 40px;
  animation: airplaneFly 3s ease-in-out infinite;
}

.global-loading-airplane::before {
  content: '✈️';
  font-size: 32px;
  filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.3));
}

@keyframes airplaneFly {
  0%, 100% {
    transform: translate(-50%, -50%) rotate(-15deg) scale(1);
  }
  25% {
    transform: translate(-50%, -50%) rotate(15deg) scale(1.1);
  }
  50% {
    transform: translate(-50%, -50%) rotate(0deg) scale(1.2);
  }
  75% {
    transform: translate(-50%, -50%) rotate(-10deg) scale(1.1);
  }
}

/* === 📱 АДАПТИВНОСТЬ === */
@media (max-width: 768px) {
  .global-loading-spinner {
    width: 60px;
    height: 60px;
  }
  
  .global-loading-airplane::before {
    font-size: 24px;
  }
}

@media (max-width: 480px) {
  .global-loading-spinner {
    width: 50px;
    height: 50px;
  }
  
  .global-loading-airplane::before {
    font-size: 20px;
  }
}

/* === 🎯 СОСТОЯНИЯ ЗАГРУЗКИ === */
.global-loading-overlay.loading {
  display: flex;
  opacity: 1;
}

.global-loading-overlay.hidden {
  opacity: 0;
  pointer-events: none;
}

/* === 🔄 АНИМАЦИЯ ПОЯВЛЕНИЯ === */
.global-loading-overlay.fade-in {
  animation: fadeIn 0.3s ease;
}

.global-loading-overlay.fade-out {
  animation: fadeOut 0.3s ease;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}