/* ===== МОБИЛЬНЫЕ ОПТИМИЗАЦИИ ===== */

/* Улучшения для touch-устройств */
@media (hover: none) and (pointer: coarse) {
  /* Убираем hover-эффекты на touch-устройствах */
  .btn:hover,
  .contact-static-icons a:hover,
  .main-logo:hover {
    transform: none !important;
  }
  
  /* Добавляем активные состояния для touch */
  .btn:active {
    transform: scale(0.98) !important;
    background-color: #6ba872 !important;
  }
  
  .contact-static-icons a:active {
    transform: scale(0.95) !important;
  }
  
  .main-logo:active {
    transform: scale(1.02) !important;
  }
}

/* Оптимизация для мобильных браузеров */
@media screen and (max-width: 768px) {
  /* Улучшение производительности (без глобального transform, чтобы не ломать position: fixed) */
  * {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
  }
  html, body, .site-bg {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-transform: none !important;
    transform: none !important;
  }
  
  /* Оптимизация анимаций */
  .glass,
  .btn,
  .contact-static-icons a {
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
  }
  
  /* Улучшение скролла */
  body {
    -webkit-overflow-scrolling: touch;
    overflow-scrolling: touch;
  }

  /* Аккуратная рамка без свечения на мобильных */
  .glass,
  .menu-glass,
  .logo-glass,
  .action-glass {
    border: 1px solid var(--glass-border) !important;
    box-shadow: none !important;
  }

  .glass::after,
  .menu-glass::after,
  .logo-glass::after,
  .action-glass::after {
    content: none !important;
  }
}

/* Улучшения для очень маленьких экранов */
@media screen and (max-width: 360px) {
  /* Уменьшаем все отступы */
  .glass {
    margin: 0.2rem !important;
    padding: 0.6rem !important;
  }
  
  /* Оптимизируем размеры кнопок */
  .btn {
    padding: 0.3rem 0.6rem !important;
    font-size: 0.85rem !important;
    min-height: 36px !important;
  }
  
  /* Уменьшаем размеры иконок */
  .contact-static-icons img {
    width: 32px !important;
    height: 32px !important;
  }
  
  .contact-static-icons a {
    min-height: 32px !important;
    min-width: 32px !important;
  }
  
  /* Оптимизируем заголовки */
  h1 {
    font-size: 1.5rem !important;
    line-height: 1.2 !important;
  }
  
  h2 {
    font-size: 1.2rem !important;
    line-height: 1.3 !important;
  }
  
  h3 {
    font-size: 1rem !important;
    line-height: 1.4 !important;
  }
}

/* Улучшения для ландшафтной ориентации на мобильных */
@media screen and (max-width: 768px) and (orientation: landscape) {
  /* Уменьшаем высоту hero-секции */
  .hero {
    min-height: 40vh !important;
    padding: 1rem !important;
  }
  
  /* Оптимизируем отступы */
  .glass {
    margin: 0.5rem !important;
    padding: 1rem !important;
  }
  
  /* Крупный логотип в ландшафтной ориентации на мобильных */
  .main-logo {
    height: 80px !important;
  }
}

/* Жесткое центрирование меню и кнопок на мобильных */
@media screen and (max-width: 600px) {
  .menu-glass nav,
  .main-nav {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    align-content: center !important;
    width: 100% !important;
  }
  .menu-glass .btn,
  .main-nav .btn {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* Улучшения для планшетов */
@media screen and (min-width: 769px) and (max-width: 1024px) {
  /* Оптимизируем размеры для планшетов */
  .glass {
    margin: 0.75rem !important;
    padding: 1.75rem !important;
  }
  
  .btn {
    padding: 0.6rem 1.1rem !important;
    font-size: 1rem !important;
    min-height: 42px !important;
  }
  
  /* Улучшаем сетки */
  .grid-container {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
    gap: 1.25rem !important;
  }
}

/* Улучшения для устройств с высоким DPI */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  /* Улучшаем качество изображений */
  img {
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
  }
  
  /* Улучшаем качество текста */
  body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
  }
}

/* Дополнительные стили для темной темы (основной) */
/* Убираем зависимость от prefers-color-scheme, так как темная тема теперь основная */

         /* Убираем дополнительные стили для контактной панели - простые иконки без рамки */

         /* Стили для ссылок на мобильных (темная тема основная) */
         @media (max-width: 768px) {
           a:not(.btn) {
             color: var(--nav-active-bg) !important;
             text-decoration: underline;
           }

           a:not(.btn):hover {
             color: #8bb892 !important;
             text-decoration: none;
           }

           .glass a:not(.btn) {
             color: var(--nav-active-bg) !important;
             text-decoration: underline;
           }

           .glass a:not(.btn):hover {
             color: #8bb892 !important;
             text-decoration: none;
           }

           /* Дополнительные стили для контента на мобильных */
           .glass h2,
           .glass h3,
           .glass h4,
           .glass p,
           .glass li,
           .glass strong,
           .glass b,
           .glass small,
           .glass code {
             color: var(--text-color) !important;
           }

           .glass {
             background: var(--glass-bg) !important;
             border: 1px solid var(--glass-border) !important;
           }

           .btn {
             background: var(--nav-active-bg) !important;
             color: white !important;
             border: 1px solid var(--nav-active-bg) !important;
           }

           .btn:hover {
             background: #8bb892 !important;
             border-color: #8bb892 !important;
           }
         }

/* Улучшения для устройств с уменьшенным движением */
@media (prefers-reduced-motion: reduce) {
  /* Отключаем анимации для пользователей с чувствительностью к движению */
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  
  .hero h1,
  .hero p {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
  
  .action-glass {
    animation: none !important;
  }
  
  h1, h2 {
    animation: none !important;
  }
}

/* Улучшения для устройств с высоким контрастом */
@media (prefers-contrast: high) {
  /* Увеличиваем контрастность для лучшей читаемости */
  .glass {
    border-width: 2px !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.3) !important;
  }
  
  .btn {
    border: 2px solid currentColor !important;
    font-weight: 900 !important;
  }
  
  .contact-static-icons {
    border: 2px solid var(--nav-active-bg) !important;
  }
}

/* Улучшения для устройств с фокусом на доступности */
@media (prefers-reduced-motion: no-preference) {
  /* Добавляем плавные переходы для пользователей, которые их предпочитают */
  .btn:focus {
    outline: 3px solid var(--nav-active-bg) !important;
    outline-offset: 2px !important;
  }
  
  .contact-static-icons a:focus {
    outline: none !important;
    box-shadow: none !important;
  }
}

/* Убираем рамки только у контактных иконок (телефон, WhatsApp, Telegram) */
@media screen and (max-width: 700px) {

  
  /* Адаптация кнопки "Вверх" под вертикальную панель контактов */
  #back-to-top {
    left: 1rem !important;
    bottom: 20px !important;
    z-index: 1041;
  }
  
  /* Адаптация cookie-banner под вертикальную панель контактов */
  #cookie-banner {
    bottom: 20px !important;
    left: 15px !important;
    right: 100px !important; /* Оставляем место для панели контактов */
    transform: none !important; /* Отключаем центрирование */
    max-width: none !important;
    width: auto !important;
    z-index: 1042;
    font-size: 0.85rem !important;
    padding: 0.8rem 1rem !important;
  }
  
  #cookie-banner button {
    margin-left: 0.5rem !important;
    margin-top: 0.5rem !important;
    display: inline-block !important;
    white-space: nowrap !important;
    font-size: 0.8rem !important;
    padding: 0.4rem 0.8rem !important;
  }
}

/* Дополнительные улучшения для мобильных форм */
@media screen and (max-width: 480px) {
  /* Адаптация cookie-banner для маленьких экранов */
  #cookie-banner {
    left: 10px !important;
    right: 85px !important; /* Меньше места для контактов на маленьких экранах */
    font-size: 0.8rem !important;
    padding: 0.6rem 0.8rem !important;
    line-height: 1.3 !important;
  }
  
  #cookie-banner button {
    margin-left: 0.3rem !important;
    margin-top: 0.4rem !important;
    font-size: 0.75rem !important;
    padding: 0.3rem 0.6rem !important;
  }

  /* Улучшаем доступность форм на мобильных */
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input[type="datetime-local"],
  select,
  textarea {
    font-size: 16px !important; /* Предотвращает зум на iOS */
    padding: 14px !important;
    border-radius: 8px !important;
    border: 2px solid var(--glass-border) !important;
  }
  
  /* Улучшаем фокус для форм */
  input[type="text"]:focus,
  input[type="email"]:focus,
  input[type="tel"]:focus,
  input[type="datetime-local"]:focus,
  select:focus,
  textarea:focus {
    outline: none !important;
    border-color: var(--nav-active-bg) !important;
    box-shadow: 0 0 0 3px rgba(124, 169, 130, 0.3) !important;
  }
  
  /* Улучшаем кнопки отправки форм */
  input[type="submit"],
  button[type="submit"] {
    min-height: 48px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    border-radius: 8px !important;
  }
  
  /* Центрирование формы заявки на странице услуг */
  .glass.animate-fade-in-right {
    margin-left: 0.5rem !important;
    margin-right: 0.5rem !important;
    text-align: center;
  }
  
  .glass.animate-fade-in-right form {
    margin: 0 auto;
    max-width: 100%;
  }
  
  .glass.animate-fade-in-right .input,
  .glass.animate-fade-in-right .btn,
  .glass.animate-fade-in-right #dropzone {
    text-align: left;
  }
  
  .glass.animate-fade-in-right label {
    text-align: left;
    display: block;
  }
  
  /* Улучшаем отображение dropzone на мобильных */
  #dropzone {
    padding: 1.5rem 1rem !important;
    margin: 0.5rem 0 !important;
  }
  
  #dropzone p {
    font-size: 0.9rem !important;
    margin-bottom: 0.75rem !important;
  }
  
  #preview {
    justify-content: center;
    gap: 0.5rem !important;
  }
  
  #preview > div {
    width: 70px !important;
    height: 70px !important;
  }
}
