/* ============================================================
   PAGE LOADER — logo shiny şekilde yatayda açılarak belirir
   (ışık parıltısı soldan sağa süzülür, logo arkasından dolar)
   ============================================================ */

.loader {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    background: radial-gradient(125% 100% at 50% 40%, #ffffff 0%, #f0f1ef 58%, #e7e9e5 100%);
    will-change: opacity;
}

.loader.is-done {
    display: none;
}

body.is-loading {
    overflow: hidden;
}

/* Logo = navy dolgu, şekli LogoSquare maskesiyle kesiliyor.
   Soldan sağa clip ile açılır (--wipe). */
.loader-logo {
    position: relative;
    isolation: isolate;
    width: clamp(160px, 22vw, 260px);
    aspect-ratio: 934 / 728;
    background: #002877;
    -webkit-mask: url(../../uploads/logo/LogoSquare.svg) center / contain no-repeat;
    mask: url(../../uploads/logo/LogoSquare.svg) center / contain no-repeat;
    --wipe: 100%;
    -webkit-clip-path: inset(0 var(--wipe) 0 0);
    clip-path: inset(0 var(--wipe) 0 0);
    overflow: hidden;
    filter: drop-shadow(0 12px 36px rgba(0, 40, 120, 0.12));
}

/* Işık bandı — logo üzerinde soldan sağa süzülen shine */
.loader-shine {
    position: absolute;
    top: -18%;
    left: 0;
    width: 38%;
    height: 136%;
    background: linear-gradient(90deg,
            rgba(175, 205, 255, 0) 0%,
            rgba(178, 206, 255, 0.55) 38%,
            rgba(240, 246, 255, 0.95) 50%,
            rgba(178, 206, 255, 0.55) 62%,
            rgba(175, 205, 255, 0) 100%);
    mix-blend-mode: screen;
    will-change: transform;
}

/* Hareket azaltma / JS yok: logo direkt dolu, parıltı yok */
@media (prefers-reduced-motion: reduce) {
    .loader-logo {
        --wipe: 0%;
        -webkit-clip-path: none;
        clip-path: none;
    }
    .loader-shine {
        display: none;
    }
}