/**
 * CSS оптимизации для мобильных устройств
 */

/* Используем GPU ускорение для часто анимируемых элементов */
.conpam-canvas,
.conpam-modal-overlay,
.draggable-element {
    will-change: transform;
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

/* Оптимизация для мобильных устройств */
@media (max-width: 768px) {
    /* Отключаем тени и сложные эффекты на мобильных */
    .conpam-thumbnail,
    .conpam-model-thumbnail,
    .conpam-material-thumbnail,
    .conpam-decoration-thumbnail {
        box-shadow: none !important;
        transition: transform 0.2s ease;
    }
    
    /* Упрощаем hover эффекты */
    .conpam-thumbnail:hover,
    .conpam-model-thumbnail:hover {
        transform: scale(1.02);
    }
    
    /* Оптимизация скролла */
    .conpam-thumbnails-container,
    .conpam-modal-body {
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        scroll-behavior: smooth;
    }
    
    /* Минимизируем перерисовки при скролле */
    .conpam-thumbnails-container *,
    .conpam-modal-body * {
        will-change: auto;
    }
    
    /* Упрощаем градиенты */
    .conpam-startOverlay,
    .conpam-modal-header {
        background: #2c3e50 !important;
    }
    
    /* Оптимизация изображений */
    img {
        image-rendering: -webkit-optimize-contrast;
        image-rendering: crisp-edges;
    }
    
    /* Уменьшаем разрешение миниатюр на мобильных */
    .conpam-thumbnail img,
    .conpam-model-thumbnail img {
        max-width: 150px;
        max-height: 150px;
    }
}

/* Оптимизация для очень слабых устройств */
@media (max-width: 768px) and (max-resolution: 2dppx) {
    /* Отключаем все анимации */
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    
    /* Упрощаем рендеринг */
    .conpam-canvas {
        image-rendering: pixelated;
        image-rendering: -moz-crisp-edges;
        image-rendering: crisp-edges;
    }
}

/* Оптимизация для планшетов */
@media (min-width: 769px) and (max-width: 1024px) {
    /* Средние настройки качества */
    .conpam-thumbnail,
    .conpam-model-thumbnail {
        box-shadow: 0 1px 2px rgba(0,0,0,0.1);
    }
    
    .conpam-canvas {
        image-rendering: auto;
    }
}

/* Предотвращение мерцания при касании на iOS */
* {
    -webkit-tap-highlight-color: transparent;
}

/* Оптимизация производительности для больших списков */
.virtual-scroll-container {
    contain: layout style paint;
}

/* Изоляция слоев для уменьшения перерисовок */
.conpam-workspace,
.conpam-bottomPanel,
.conpam-toolbar {
    contain: layout;
    isolation: isolate;
}

/* CSS containment для модальных окон */
.conpam-modal {
    contain: layout style;
}

/* Оптимизация текста */
.text-preview,
.canvas-text {
    text-rendering: optimizeSpeed;
    font-smooth: never;
    -webkit-font-smoothing: subpixel-antialiased;
}

/* Принудительное использование GPU для трансформаций */
.gpu-accelerated {
    transform: translate3d(0, 0, 0);
    will-change: transform, opacity;
}

/* Оптимизация для кнопок на мобильных */
@media (hover: none) and (pointer: coarse) {
    button, 
    .conpam-btn,
    .clickable-element {
        /* Увеличиваем область касания */
        min-height: 44px;
        min-width: 44px;
        /* Убираем hover эффекты на touch устройствах */
        transition: none !important;
    }
    
    button:hover,
    .conpam-btn:hover {
        transform: none !important;
        box-shadow: none !important;
    }
}