/* ==================== РЕЖИМ ПРОИЗВОДИТЕЛЬНОСТИ ==================== */

/* Отключаем только анимации появления при переключении режима (transitions остаются для плавности) */
body.no-transition .container.entering h1,
body.no-transition .container.entering .subtitle,
body.no-transition .container.entering .avatar,
body.no-transition .container.entering .socials,
body.no-transition .container.entering .discord-card,
body.no-transition .container.entering .card,
body.no-transition .container.entering .skills li {
  animation: none !important;
}

/* Кнопка переключения производительности - минималистичная */
.performance-toggle {
  position: fixed;
  top: 15px;
  right: 15px;
  z-index: 10005;
  width: 42px;
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  background: rgba(15, 15, 20, 0.7);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 50%;
  color: rgba(255, 255, 255, 0.8);
  font-size: 18px;
  cursor: pointer;
  transition: all 0.3s ease;
  backdrop-filter: blur(10px);
  box-shadow: 0 2px 15px rgba(0, 0, 0, 0.3);
  opacity: 0;
  pointer-events: none;
  overflow: hidden;
}

.performance-toggle.visible {
  opacity: 1;
  pointer-events: auto;
}

.performance-toggle:hover {
  background: rgba(25, 25, 35, 0.85);
  border-color: rgba(255, 255, 255, 0.25);
  color: #fff;
  transform: scale(1.08);
}

.performance-toggle:active {
  transform: scale(0.95);
}

/* Иконка - молния когда выключено, лист когда включено */
.performance-toggle .toggle-icon {
  transition: transform 0.3s ease;
  line-height: 1;
}

.performance-toggle.performance-mode {
  background: rgba(20, 25, 20, 0.8);
  border-color: rgba(100, 200, 100, 0.3);
  color: #90EE90;
}

/* ==================== ПЕРЕХОДНЫЕ СТИЛИ ==================== */

/* Плавные переходы для всех затрагиваемых элементов (без transform чтобы не было скачков) */
.container,
.card,
.card.main-card,
.enter-btn,
.splash-content,
.stars-container,
.models-container,
.dev-container,
.discord-card,
h1,
.page-title,
.splash-title,
.discord-left .avatar-small,
.snowflake,
#particles-canvas {
  transition: 
    backdrop-filter 0.5s ease,
    background 0.5s ease,
    box-shadow 0.5s ease,
    text-shadow 0.5s ease,
    filter 0.5s ease,
    opacity 0.5s ease;
}

/* ==================== РЕЖИМ ПРОИЗВОДИТЕЛЬНОСТИ АКТИВЕН ==================== */

/* Отключаем backdrop-filter и заменяем на приглушенные цвета */
body.performance-mode .container {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: rgba(18, 22, 28, 0.95) !important;
}

/* Отключаем светящуюся рамку контейнера */
body.performance-mode .container::after {
  display: none !important;
  opacity: 0 !important;
  animation: none !important;
}

body.performance-mode .card {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: rgba(25, 30, 38, 0.93) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35) !important;
  border-color: rgba(60, 70, 85, 0.4) !important;
}

body.performance-mode .card.main-card {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: rgba(22, 28, 36, 0.95) !important;
  box-shadow: 0 5px 18px rgba(0, 0, 0, 0.4) !important;
  border-color: rgba(50, 65, 85, 0.45) !important;
}

body.performance-mode .card::before,
body.performance-mode .card.main-card::before {
  display: none !important;
}

body.performance-mode .enter-btn {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: rgba(30, 38, 48, 0.92) !important;
  border-color: rgba(60, 75, 95, 0.45) !important;
}

/* Discord карточка */
body.performance-mode .discord-card {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: rgba(24, 30, 40, 0.94) !important;
  border-color: rgba(70, 80, 110, 0.4) !important;
}

/* Контейнеры на подстраницах */
body.performance-mode .stars-container,
body.performance-mode .models-container,
body.performance-mode .dev-container {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: rgba(15, 18, 24, 0.96) !important;
}

body.performance-mode .star-pack,
body.performance-mode .model-card,
body.performance-mode .service-card {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: rgba(25, 32, 42, 0.92) !important;
  border-color: rgba(50, 70, 95, 0.35) !important;
}

body.performance-mode .how-to-order {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: rgba(22, 30, 40, 0.92) !important;
  border-color: rgba(50, 70, 95, 0.35) !important;
}

/* Отключаем свечения текста - но оставляем видимость */
body.performance-mode h1,
body.performance-mode .page-title,
body.performance-mode .container h1,
body.performance-mode .container.entering h1 {
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5) !important;
  animation: none !important;
  color: #fff !important;
  opacity: 1 !important;
  visibility: visible !important;
}

body.performance-mode .splash-title {
  filter: none !important;
  animation: none !important;
  background: linear-gradient(135deg, #00bfff, #008080) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
}

/* Отключаем анимацию градиента на фоне */
body.performance-mode.bg-image {
  animation: none !important;
}

body.performance-mode {
  animation: none !important;
}


/* Аватар - оставляем анимацию, упрощаем тень */
body.performance-mode .avatar {
  box-shadow: 0 0 12px rgba(0, 150, 200, 0.25) !important;
}

/* Отключаем 3D и свечение карточек при hover */
body.performance-mode .card:hover,
body.performance-mode .card.main-card:hover,
body.performance-mode .discord-card:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.5) !important;
}

/* Отключаем градиенты ::before на карточках */
body.performance-mode .discord-card::before {
  display: none !important;
}

body.performance-mode .star-pack:hover,
body.performance-mode .model-card:hover,
body.performance-mode .service-card:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.5) !important;
}

/* Скрываем частицы canvas */
body.performance-mode #particles-canvas {
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Скрываем снежинки */
body.performance-mode .snowflake {
  opacity: 0 !important;
  animation: none !important;
}

/* Упрощаем тени кнопок */
body.performance-mode .player-btn,
body.performance-mode .nav-btn,
body.performance-mode .back-btn,
body.performance-mode .payment-btn {
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3) !important;
}

body.performance-mode .player-btn:hover,
body.performance-mode .nav-btn:hover,
body.performance-mode .back-btn:hover,
body.performance-mode .payment-btn:hover {
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4) !important;
}

/* Discord бейджи - убираем glow */
body.performance-mode .badge {
  box-shadow: none !important;
}

body.performance-mode .badge:hover {
  box-shadow: none !important;
  filter: none !important;
}

/* Discord статусы - убираем свечение */
body.performance-mode .status-online,
body.performance-mode .status-idle,
body.performance-mode .status-dnd,
body.performance-mode .status-offline {
  text-shadow: none !important;
}

/* Аватар Discord - упрощаем */
body.performance-mode .discord-left .avatar-small {
  box-shadow: none !important;
}

/* Упрощаем 3D эффекты карточек */
body.performance-mode .card,
body.performance-mode .card.main-card,
body.performance-mode .discord-card {
  transform-style: flat !important;
  perspective: none !important;
}

/* Упрощаем аватар - простой hover без анимации */
body.performance-mode .avatar {
  animation: none !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  display: block !important;
}

body.performance-mode .avatar:hover {
  animation: none !important;
  transform: scale(1.08) !important;
  transition: transform 0.3s ease !important;
}

/* Упрощаем splash screen */
body.performance-mode #splash-screen {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Соцсети - упрощенные эффекты */
body.performance-mode .socials img {
  filter: grayscale(0.3) !important;
}

body.performance-mode .socials img:hover {
  filter: none !important;
  transform: scale(1.1) !important;
}

/* Кнопка в режиме производительности */
body.performance-mode .performance-toggle {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Skills упрощенные */
body.performance-mode .skills li {
  backdrop-filter: none !important;
  background: rgba(30, 38, 50, 0.85) !important;
  border-color: rgba(60, 80, 100, 0.35) !important;
}

body.performance-mode .skills li:hover {
  background: rgba(35, 50, 70, 0.9) !important;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.35) !important;
  border-color: rgba(70, 100, 130, 0.5) !important;
  text-shadow: none !important;
  transform: scale(1.05) !important;
}

/* Music player */
body.performance-mode #music-player {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: rgba(18, 22, 30, 0.95) !important;
  border-color: rgba(50, 60, 75, 0.35) !important;
}

/* Visit counter */
body.performance-mode #visit-counter {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: rgba(20, 25, 32, 0.94) !important;
}

/* ==================== МОБИЛЬНЫЕ УСТРОЙСТВА ==================== */

@media (max-width: 768px) {
  .performance-toggle {
    top: 10px;
    right: 10px;
    width: 38px;
    height: 38px;
    font-size: 16px;
  }
}

@media (max-width: 480px) {
  .performance-toggle {
    top: 8px;
    right: 8px;
    width: 36px;
    height: 36px;
    font-size: 15px;
  }
}

/* ==================== Совместимость новых эффектов ==================== */

/* Отключаем визуализатор музыки */
body.performance-mode .music-visualizer {
  display: none !important;
}

/* Упрощаем соцсети - отключаем эффект пластинок */
body.performance-mode .socials a::before,
body.performance-mode .socials a::after {
  display: none !important;
  animation: none !important;
}

/* Отключаем анимированную рамку аватара */
body.performance-mode .profile-header .avatar {
  animation: none !important;
  background: none !important;
  border: 3px solid rgba(0, 150, 200, 0.4) !important;
}

/* Упрощаем hover для skills */
body.performance-mode .skills li::before {
  display: none !important;
}

body.performance-mode .skills li:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}

/* Упрощаем tooltips бейджей */
body.performance-mode .badge::after,
body.performance-mode .badge::before {
  transition: none !important;
}

/* Отключаем skeleton анимацию */
body.performance-mode .skeleton {
  animation: none !important;
  background: rgba(255, 255, 255, 0.08) !important;
}

/* Статус-индикатор без свечения */
body.performance-mode .discord-status-dot {
  box-shadow: none !important;
}

/* ==================== Дополнительные оптимизации ==================== */

/* Отключаем typing эффект для subtitle */
body.performance-mode .profile-info .subtitle {
  animation: none !important;
  width: 40ch !important;
  border-right: none !important;
  overflow: visible !important;
}

/* Убираем эффекты появления при переключении режима */
body.performance-mode .container h1,
body.performance-mode .container .subtitle,
body.performance-mode .container .socials,
body.performance-mode .container .avatar,
body.performance-mode .container .card {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  animation: none !important;
}

/* Гарантируем отображение элементов без анимации появления */
body.performance-mode .container.entering h1,
body.performance-mode .container.entering .subtitle,
body.performance-mode .container.entering .avatar,
body.performance-mode .container.entering .discord-card {
  animation: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}

/* Визуализатор музыки - также по ID */
body.performance-mode #music-visualizer,
body.performance-mode .music-visualizer {
  display: none !important;
  opacity: 0 !important;
}

/* Упрощаем hover на главном аватаре */
body.performance-mode .profile-header .avatar:hover {
  transform: scale(1.05) !important;
  box-shadow: 0 0 15px rgba(0, 150, 200, 0.3) !important;
}