/* tu-anti-flash.css — [PERFORMANCE-ANTI-FLASH-CLS-PRO-POLISH-01 2026-06-12]
 * Couche anti-flash de BOOT, chargée render-blocking en <head>.
 * Active tant que <body class="tu-preload"> est posé (statique au parse) ;
 * la classe est retirée par js/tu-anti-flash.js sur window.load -> les
 * transitions/animations normales reprennent ensuite.
 * Externe, CSP-safe (style-src 'self'). 100% additif, 0 refonte.
 * ========================================================================= */

/* 1 · TRANSITIONS OFF pendant le boot.
 * Supprime le flash des ~169 règles `transition: all` qui ANIMENT le switch
 * de thème quand global.js ajoute body.dark-mode au DOMContentLoaded
 * (~1,4-1,9 s après le 1er paint, mesuré). Rend aussi les reveals tu-motion
 * (`[data-tu-reveal]` opacity/transform) INSTANTANÉS au lieu de fade .7s.
 * Ne touche PAS les @keyframes -> les spinners de chargement restent animés. */
body.tu-preload *,
body.tu-preload *::before,
body.tu-preload *::after {
  transition: none !important;
}

/* 2 · REVEALS above-the-fold instantanés pendant le boot.
 * Neutralise l'animation page-in tu-wow (fade du <main>, jouée tard quand
 * tu-wow.js pose body.tu-wow-ready ~2,9 s) + l'entrée animée du logo.
 * Ciblé sur main/.logo (PAS `*`) pour NE PAS geler d'éventuels spinners infinis. */
body.tu-preload main,
body.tu-preload .logo img,
body.tu-preload a.logo img {
  animation: none !important;
}

/* 3 · PLACEHOLDER image produit.
 * L'espace est déjà réservé par aspect-ratio (responsive-premium.css). Ici on
 * pose un fond discret pour que la zone image ne soit pas "vide" avant le
 * chargement ; l'image opaque (object-fit:cover) la recouvre une fois chargée.
 * Théâme-aware : clair neutre en light, sombre tropical en dark. */
.product-image-wrapper,
.product-img-wrapper {
  background-color: #e9e4d8;
}
html.dark .product-image-wrapper,
html[data-tu-theme="dark"] .product-image-wrapper,
body.dark-mode .product-image-wrapper,
html.dark .product-img-wrapper,
html[data-tu-theme="dark"] .product-img-wrapper,
body.dark-mode .product-img-wrapper {
  background-color: #0e1a14;
}
