/* ============================================
   Optimisation de l'affichage des SVG
   ============================================ */

/* Forcer le rendu optimisé des SVG */
svg {
    shape-rendering: geometricPrecision;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* Empêcher l'éclatement des SVG */
    max-width: 100%;
    height: auto;
    display: block;
}

/* SVG dans le header - empêche l'éclatement */
.logo-desktop img[src$=".svg"],
.logo-mobile img[src$=".svg"],
.module-brand img[src$=".svg"] {
    display: block;
    width: auto;
    max-width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: left center;
}

/* Conteneur du logo - dimension fixe */
.logo-desktop,
.logo-mobile {
    display: inline-flex;
    align-items: center;
    height: 60px;
    max-height: 60px;
    overflow: hidden;
}

/* Améliorer le rendu des textes dans les SVG */
svg text {
    font-family: var(--font-display, 'Lexend Exa', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', Arial, sans-serif);
    font-display: swap;
    text-rendering: optimizeLegibility;
}

/* Si la police Lexend Exa n'est pas chargée, utiliser un fallback système */
@supports not (font-variation-settings: normal) {
    svg text {
        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', Arial, sans-serif;
    }
}

/* Optimisation pour les logos de modules */
.module-icon svg,
img[src*="module_icons"],
img[src*=".svg"] {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
}

/* Éviter le flash pendant le chargement */
.module-icon {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Cache les SVG non chargés pour éviter le flash */
svg:not([viewBox]) {
    visibility: hidden;
}

svg[viewBox] {
    visibility: visible;
}

/* Performance: réduire le reflow lors du chargement */
img[src$=".svg"] {
    will-change: auto;
    transform: translateZ(0);
}

/* ============================================
   Gestion des polices Google Fonts
   ============================================ */

/* Assurer que les polices se chargent rapidement */
@font-face {
    font-family: 'Lexend Exa';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Lexend Exa');
}

@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Inter');
}

/* Fallback si la police ne charge pas dans les 3 secondes */
@media (prefers-reduced-motion: reduce) {
    * {
        font-display: optional !important;
    }
}

/* ============================================
   Gradients SVG - Optimisation navigateur
   ============================================ */

/* Améliorer le rendu des gradients linéaires dans les SVG */
svg linearGradient,
svg radialGradient {
    color-interpolation: sRGB;
}

/* Fix pour Safari et iOS */
@supports (-webkit-appearance: none) {
    svg {
        transform: translateZ(0);
        -webkit-transform: translateZ(0);
    }
}

/* ============================================
   Accessibilité
   ============================================ */

/* Cacher les SVG décoratifs pour les lecteurs d'écran */
svg[aria-hidden="true"],
.decorative-svg {
    pointer-events: none;
}

/* Améliorer le contraste pour les utilisateurs avec vision réduite */
@media (prefers-contrast: high) {
    svg text {
        font-weight: 600;
        stroke-width: 0.5px;
    }
}

/* ============================================
   Print - Optimisation pour l'impression
   ============================================ */

@media print {
    svg {
        shape-rendering: crispEdges;
    }
    
    svg text {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
}
