/**
 * Performance Optimizations CSS
 * Reduz violações de performance e otimiza autofill
 * @author SoulClinic
 */

/* ===== OTIMIZAÇÕES DE AUTOFILL ===== */

/* Previne reflow durante autofill */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    transition-delay: 99999s;
    transition-property: background-color, color;
    -webkit-animation-name: autofill;
    -webkit-animation-fill-mode: both;
}

/* Animação otimizada para autofill */
@-webkit-keyframes autofill {
    to {
        color: inherit;
        background: transparent;
    }
}

/* ===== OTIMIZAÇÕES DE LAYOUT ===== */

/* Usar transform em vez de propriedades que causam reflow */
.optimize-layout {
    transform: translateZ(0);
    will-change: transform;
}

/* Otimizar elementos que mudam frequentemente */
[data-layout-update] {
    transform: translateZ(0);
    will-change: transform;
}

/* Otimizar elementos de scroll */
[data-scroll-update] {
    transform: translateZ(0);
    will-change: transform;
}

/* ===== OTIMIZAÇÕES DE SELECT2 ===== */

/* Reduzir reflow no Select2 */
.select2-container {
    transform: translateZ(0);
}

.select2-dropdown {
    transform: translateZ(0);
    will-change: transform;
}

/* Otimizar animações do Select2 */
.select2-results__option {
    transform: translateZ(0);
}

/* ===== OTIMIZAÇÕES DE FORMULÁRIOS ===== */

/* Prevenir reflow em inputs */
.form-control,
.form-select,
.form-check-input {
    transform: translateZ(0);
}

/* Otimizar validação visual */
.form-control.is-valid,
.form-control.is-invalid {
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

/* ===== OTIMIZAÇÕES DE MODAIS ===== */

/* Otimizar modais para evitar reflow */
.modal {
    transform: translateZ(0);
}

.modal-dialog {
    transform: translateZ(0);
}

/* ===== OTIMIZAÇÕES DE DATA TABLES ===== */

/* Otimizar DataTables */
.dataTables_wrapper {
    transform: translateZ(0);
}

.dataTables_processing {
    transform: translateZ(0);
}

/* ===== OTIMIZAÇÕES DE FULLCALENDAR ===== */

/* Otimizar FullCalendar */
.fc {
    transform: translateZ(0);
}

.fc-event {
    transform: translateZ(0);
}

/* ===== OTIMIZAÇÕES DE BOOTSTRAP ===== */

/* Otimizar componentes Bootstrap */
.btn,
.nav-link,
.dropdown-item {
    transform: translateZ(0);
}

/* Otimizar tooltips */
.tooltip {
    transform: translateZ(0);
}

/* Otimizar popovers */
.popover {
    transform: translateZ(0);
}

/* ===== OTIMIZAÇÕES DE ANIMAÇÕES ===== */

/* Usar transform em vez de propriedades que causam reflow */
.animate-transform {
    transition: transform 0.3s ease;
}

/* Otimizar hover states */
.hover-optimized:hover {
    transform: translateZ(0) scale(1.02);
}

/* ===== OTIMIZAÇÕES DE RESPONSIVIDADE ===== */

/* Otimizar media queries */
@media (max-width: 768px) {
    .mobile-optimized {
        transform: translateZ(0);
    }
}

/* ===== OTIMIZAÇÕES DE FONTS ===== */

/* Prevenir reflow durante carregamento de fontes */
body {
    font-display: swap;
}

/* ===== OTIMIZAÇÕES DE IMAGENS ===== */

/* Otimizar carregamento de imagens */
img {
    transform: translateZ(0);
}

/* ===== UTILITÁRIOS DE PERFORMANCE ===== */

/* Classe para forçar otimização */
.force-gpu {
    transform: translateZ(0);
    will-change: transform;
}

/* Classe para elementos que mudam frequentemente */
.frequent-update {
    transform: translateZ(0);
    will-change: transform;
}

/* Classe para elementos críticos */
.critical-performance {
    transform: translateZ(0);
    will-change: transform;
    contain: layout style paint;
}

/* ===== REDUÇÃO DE REPAINT ===== */

/* Usar opacity em vez de visibility quando possível */
.fade-optimized {
    opacity: 0;
    transition: opacity 0.3s ease;
}

.fade-optimized.show {
    opacity: 1;
}

/* ===== OTIMIZAÇÕES DE SCROLL ===== */

/* Otimizar scroll containers */
.scroll-optimized {
    transform: translateZ(0);
    will-change: scroll-position;
}

/* ===== OTIMIZAÇÕES DE DRAG & DROP ===== */

/* Otimizar elementos arrastáveis */
.draggable {
    transform: translateZ(0);
    will-change: transform;
}

/* ===== OTIMIZAÇÕES DE CARREGAMENTO ===== */

/* Skeleton loading otimizado */
.skeleton {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: loading 1.5s infinite;
    transform: translateZ(0);
}

@keyframes loading {
    0% {
        background-position: 200% 0;
    }
    100% {
        background-position: -200% 0;
    }
}

/* ===== OTIMIZAÇÕES DE PRINT ===== */

/* Desabilitar otimizações no print */
@media print {
    .optimize-layout,
    [data-layout-update],
    [data-scroll-update],
    .force-gpu,
    .frequent-update,
    .critical-performance {
        transform: none !important;
        will-change: auto !important;
    }
}