/* ════════════════════════════════════════════
   DestockGym — components/loader.css
   Loader plein écran : logo DG « reflet de lumière » (façon Rockstar).
   Le contour reste gravé (faible) ; une bande teal→orange floutée descend
   à travers, illuminant le contour au passage. En boucle.
════════════════════════════════════════════ */

.dg-loader {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #000000a8;                  /* noir ~66% */
    opacity: 0;
    visibility: hidden;
    transition: opacity .35s ease, visibility .35s ease;
}

body.dg-loading .dg-loader {
    opacity: 1;
    visibility: visible;
}

/* Le div est masqué par le tracé du logo → on ne voit que le contour fin */
.dg-loader__inner {
    position: relative;
    width: 170px;
    height: 170px;
    overflow: hidden;
    -webkit-mask: url(../../icons/dg-logo-loader.svg) center / contain no-repeat;
            mask: url(../../icons/dg-logo-loader.svg) center / contain no-repeat;
    /* contour gravé visible en permanence (faible) */
    background: rgba(147, 180, 192, 0.18);
}

/* Bande de lumière floutée qui balaie de haut en bas */
.dg-loader__inner::after {
    content: "";
    position: absolute;
    left: -20%;
    width: 140%;
    height: 60%;
    top: -60%;
    background: linear-gradient(180deg,
        transparent 0%,
        #93b4c0 30%,
        #b7a899 70%,
        transparent 100%);
    filter: blur(6px);
}

body.dg-loading .dg-loader__inner::after {
    animation: dgSweep 2.15s cubic-bezier(.77, 0, .175, 1) infinite;
}

@keyframes dgSweep {
    0%   { top: -65%; }
    100% { top: 105%; }
}
