/* =========================================================================
   OPTIMISATIONS DE PERFORMANCE ET D'ACCESSIBILITÉ
   ========================================================================= */

/* Améliore les performances avec le GPU et réduit les repaints */
[data-animation="haut"],
[data-animation="gauche"],
[data-animation="droite"],
.carte,
.carte-overlay,
.experience-item,
.education-item,
.project-item,
.lien-menu {
    will-change: transform, opacity;
    transform: translateZ(0);
    backface-visibility: hidden;
    perspective: 1000px;
}

/* Optimisation des images */
img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* Réduits repaints sur les conteneurs avec animations */
.terminal-window,
.terminal-screen,
.cartes-projets {
    contain: layout style paint;
}

/* Optimise les transitions */
* {
    transition-property: opacity, transform, color, background-color, box-shadow;
    transition-duration: 0.3s;
    transition-timing-function: ease;
}

/* Désactive les transitions sur les appareils qui les détestent */
@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* Améliore la performance du scroll smooth */
html {
    scroll-behavior: smooth;
    scroll-padding-top: 60px;
}

/* Font loading optimization - Les polices sont déjà en @import avec font-display: swap */
/* Les règles @font-face sont gérées dans le fichier @import original */

/* Optimise le preloader */
.preloader {
    position: fixed;
    inset: 0;
    z-index: 10000;
    background-attachment: fixed;
    /* Empêche le repositionnement lors du scroll */
}

/* Optimise les boutons pour un meilleur UX */
button,
.bouton-personnalise,
.lien-menu,
a {
    min-height: 44px;
    /* WCAG 2.5: Au moins 44x44px pour les cibles tactiles */
    touch-action: manipulation;
    /* Réduit le délai tactile à 300ms */
}

/* Flexibilité des conteneurs pour une meilleure réactivité */
.terminal-container,
.cartes-projets,
.cv-main {
    flex-wrap: wrap;
}

/* Améliore la lisibilité */
body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* Vision en mode sombre pour les préférences */
@media (prefers-color-scheme: dark) {
    body {
        background-color: #1a1a1a;
        color: #e0e0e0;
    }

    .cv-container {
        background-color: #2a2a2a;
        color: #e0e0e0;
    }

    .cv-header {
        color: #e0e0e0;
    }

    .cv-sidebar {
        background-color: #1f1f1f;
        border-right-color: #444;
    }

    .cv-content {
        background-color: #2a2a2a;
    }
}

/* Améliore la visibilité du focus pour l'accessibilité */
button:focus,
a:focus,
input:focus,
textarea:focus,
select:focus {
    outline: 2px solid #ff006e;
    outline-offset: 2px;
}

/* Améliore le contraste au survol */
.lien-menu:hover,
.tool:hover,
.experience-item:hover,
.education-item:hover,
.project-item:hover,
.cv-social a:hover {
    opacity: 0.9;
}

/* Optimise les media queries */
@media (max-width: 1200px) {
    .terminal-container {
        flex-direction: column;
    }

    .terminal-sidebar,
    .terminal-window {
        min-width: 100%;
        max-width: 100%;
    }
}

@media (max-width: 820px) {

    /* Augmente les espacements tactiles */
    button,
    a {
        padding: 0.75rem 1.5rem;
    }

    /* Réduit les animations sur mobile pour économiser la batterie */
    [data-animation],
    .preloader,
    .terminal-window {
        animation-duration: 0.2s;
    }

    /* Cache les éléments visuellement superflus sur mobile */
    .menu-burger span {
        display: none;
    }
}

@media (max-width: 480px) {

    /* Font sizing pour mobile */
    body {
        font-size: 14px;
    }

    h1 {
        font-size: 1.5rem;
    }

    h2 {
        font-size: 1.2rem;
    }

    /* Optimise l'espace */
    .cv-header,
    .cv-content,
    .cv-sidebar {
        padding: 1.5rem;
    }
}

/* Améliore la performance des scrollbars */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.05);
}

::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.3);
}

/* Optimise les liens pour le SEO et l'accessibilité */
a {
    color: inherit;
    text-decoration: none;
}

a:visited {
    color: inherit;
}

/* Impressions optimisées */
@media print {
    body {
        background: white;
    }

    a {
        text-decoration: underline;
    }

    .preloader,
    .menu-burger,
    .barre-laterale,
    .cv-footer {
        display: none !important;
    }

    .cv-container {
        box-shadow: none;
    }
}

/* Optimise la visibilité du lien CV dans le menu */
.lien-menu i {
    margin-right: 6px;
}

/* Améliore la visibilité du tooltip */
[title] {
    text-decoration: underline dotted;
    cursor: help;
}