.loader-container{position:fixed;top:0;left:0;width:100%;height:100%;background-color:var(--base-beige-color);display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:9999;transition:opacity .5s ease-out}
.loader{position:relative;width:200px;height:200px;margin-bottom:2rem}
.loader-circle{position:absolute;width:100%;height:100%;border:6px solid transparent;border-top-color:var(--base-rouge-color);border-radius:50%;animation:1.5s linear infinite spin}
.loader-circle:nth-child(2){border-top-color:var(--base-noir-color);animation-delay:.5s;transform:scale(.8)}
.loader-circle:nth-child(3){border-top-color:var(--base-rouge-color);animation-delay:1s;transform:scale(.6)}
.loader-logo{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100px;height:100px;background-image:url('/images/logo/Mandragora/logo-loader.png');background-size:contain;background-repeat:no-repeat;background-position:center;animation:2s ease-in-out infinite pulse}
.loader-text{font-family:var(--global-font-family-titre);color:var(--base-rouge-color);font-size:1.5rem;text-align:center;opacity:0;animation:.5s ease-out .5s forwards fadeIn}
.loader-subtext{font-family:var(--global-font-family);color:var(--base-noir-color);font-size:1rem;text-align:center;margin-top:.5rem;opacity:0;animation:.5s ease-out .8s forwards fadeIn}
@keyframes spin{
0%{transform:rotate(0)}
100%{transform:rotate(360deg)}
}
@keyframes pulse{
0%,100%{transform:translate(-50%,-50%) scale(1)}
50%{transform:translate(-50%,-50%) scale(1.1)}
}
@keyframes fadeIn{
from{opacity:0;transform:translateY(10px)}
to{opacity:1;transform:translateY(0)}
}
.loader-hidden{opacity:0;pointer-events:none}