/*! GEMPERLES — Indicateur de chargement v2 (2026-08-31)
    A = #gp-loadbar  — filet champagne, sur CLIC DE LIEN
    B = #gp-loadveil — voile + arc, sur SOUMISSION DE FORMULAIRE (panier, recherche)

    🔑 v2 : la v1 redessinait le `.loading-mask` natif de Magento. Vérifié en prod le
    31/08 : PERSONNE ne l'allume (ni les filtres, ni le panier, ni la connexion) — les
    filtres naviguent, et l'ajout au panier est un POST classique. On dessine donc notre
    propre voile, sur un déclencheur réel. Les règles `.loading-mask` sont conservées en
    fin de fichier : elles ne coûtent rien et si Magento l'allume un jour, ce sera au ton. */

/* ---------------------------------------------------------------
   A — LE FILET (clic de lien)
   --------------------------------------------------------------- */
#gp-loadbar{
  position:fixed; top:0; left:0; right:0; height:3px;
  z-index:100000;              /* au-dessus du voile et du header collant */
  pointer-events:none;
  opacity:0; transition:opacity .18s ease;
}
#gp-loadbar.is-on{opacity:1}
#gp-loadbar > i{
  display:block; height:100%; width:0;
  background:#B08D4A;
  transition:width .2s cubic-bezier(.22,.85,.3,1);
  box-shadow:0 0 8px rgba(176,141,74,.55);
}

/* ---------------------------------------------------------------
   B — LE VOILE + L'ARC (soumission de formulaire)
   --------------------------------------------------------------- */
#gp-loadveil{
  position:fixed; top:0; right:0; bottom:0; left:0;
  z-index:99999;
  background:rgba(252,251,249,.28);
  opacity:0; transition:opacity .2s ease;
  pointer-events:none;         /* invisible ET transparent aux clics tant qu'il dort */
}
/* Une fois allumé il INTERCEPTE les clics : c'est voulu — c'est ce qui empêche
   le client d'ajouter deux fois le même bijou au panier. */
#gp-loadveil.is-on{opacity:1; pointer-events:auto}
#gp-loadveil::before{
  content:"";
  position:absolute; top:50%; left:50%;
  width:42px; height:42px; margin:-21px 0 0 -21px;
  border:1.5px solid rgba(10,26,56,.13);
  border-top-color:#B08D4A;
  border-radius:50%;
  animation:gpLoaderSpin 1.05s linear infinite;
}
@keyframes gpLoaderSpin{to{transform:rotate(360deg)}}

/* ---------------------------------------------------------------
   Le voile natif de Magento, au cas où il servirait un jour
   ⛔ NE JAMAIS toucher `display` ici : Magento l'allume par style inline.
   --------------------------------------------------------------- */
.loading-mask{background-color:rgba(252,251,249,.28) !important}
.loading-mask .loader > img{display:none !important}
.loading-mask .loader > p{
  display:block !important;
  position:absolute; width:1px; height:1px;
  margin:-1px; padding:0; overflow:hidden;
  clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0;
}
.loading-mask .loader::before{
  content:"";
  position:absolute; top:50%; left:50%;
  width:42px; height:42px; margin:-21px 0 0 -21px;
  border:1.5px solid rgba(10,26,56,.13);
  border-top-color:#B08D4A;
  border-radius:50%;
  animation:gpLoaderSpin 1.05s linear infinite;
}

/* ---------------------------------------------------------------
   Mouvement réduit
   --------------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  #gp-loadbar > i{box-shadow:none; transition:none}
  #gp-loadveil::before,
  .loading-mask .loader::before{animation:gpLoaderFade 1.4s ease-in-out infinite}
  @keyframes gpLoaderFade{0%,100%{opacity:.35}50%{opacity:1}}
}
